@uniformdev/canvas-react 19.5.1-alpha.22 → 19.7.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 (4) hide show
  1. package/dist/index.esm.js +40 -3
  2. package/dist/index.js +40 -3
  3. package/dist/index.mjs +40 -3
  4. package/package.json +5 -5
package/dist/index.esm.js CHANGED
@@ -2,6 +2,9 @@
2
2
  import { CANVAS_LOCALIZATION_TYPE } from "@uniformdev/canvas";
3
3
  import React from "react";
4
4
  var wrapperStyles = {
5
+ display: "flex",
6
+ flexDirection: "column",
7
+ gap: "0.5rem",
5
8
  borderLeft: "4px solid #e42535",
6
9
  padding: "16px",
7
10
  fontSize: "16px",
@@ -11,7 +14,7 @@ var wrapperStyles = {
11
14
  color: "#1d3557"
12
15
  };
13
16
  function DefaultNotImplementedComponent(props) {
14
- var _a;
17
+ var _a, _b, _c;
15
18
  const componentType = (_a = props.component) == null ? void 0 : _a.type;
16
19
  if (!componentType) {
17
20
  return null;
@@ -28,7 +31,41 @@ function DefaultNotImplementedComponent(props) {
28
31
  "enable localization in your front-end application."
29
32
  )));
30
33
  }
31
- return /* @__PURE__ */ React.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ React.createElement("h2", null, "Component: ", /* @__PURE__ */ React.createElement("code", null, componentType)), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("code", null, /* @__PURE__ */ React.createElement("strong", null, componentType)), " ", "has no React implementation. It may need to be added to your ", /* @__PURE__ */ React.createElement("code", null, "resolveRenderer()"), " function."), /* @__PURE__ */ React.createElement("details", null, /* @__PURE__ */ React.createElement("summary", { style: { cursor: "pointer" } }, "Data"), /* @__PURE__ */ React.createElement("pre", null, JSON.stringify(props, null, 2))));
34
+ const proposedFileName = `${componentType[0].toUpperCase()}${componentType.substring(1)}`;
35
+ const probableProps = Object.keys((_b = props.component.parameters) != null ? _b : {});
36
+ const probableSlots = Object.keys((_c = props.component.slots) != null ? _c : {});
37
+ return /* @__PURE__ */ React.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ React.createElement("h2", { style: { fontSize: "1.2rem" } }, "Unknown Component"), /* @__PURE__ */ React.createElement("p", null, "Received request from Uniform to render a component with the public ID: ", /* @__PURE__ */ React.createElement("code", null, componentType), "."), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("code", null, "<UniformComposition />"), " does not have ", /* @__PURE__ */ React.createElement("code", null, componentType), " mapped to a React component yet."), /* @__PURE__ */ React.createElement("p", null, "To teach your app how to render this component:"), " ", /* @__PURE__ */ React.createElement(
38
+ "ul",
39
+ {
40
+ style: {
41
+ listStyleType: "disc",
42
+ marginLeft: "1rem",
43
+ display: "flex",
44
+ flexDirection: "column",
45
+ gap: "0.5rem"
46
+ }
47
+ },
48
+ /* @__PURE__ */ React.createElement("li", null, "Create a React component and register it with Uniform, for example", /* @__PURE__ */ React.createElement("pre", null, `function ${proposedFileName}(${probableProps.length > 0 ? `{ ${probableProps.join(", ")} }` : ""}) {
49
+ return (
50
+ <div>
51
+ ${proposedFileName}!
52
+ ${probableSlots.length > 0 ? probableSlots.map((slot) => `<UniformSlot name="${slot}" />`).join("\n ") : ""}
53
+ </div>
54
+ )
55
+ }
56
+
57
+ registerUniformComponent({ type: "${componentType}", component: ${proposedFileName} })`), /* @__PURE__ */ React.createElement("details", null, /* @__PURE__ */ React.createElement("summary", { style: { cursor: "pointer" } }, "Props that your React component will receive"), /* @__PURE__ */ React.createElement("pre", null, JSON.stringify(props, null, 2)))),
58
+ /* @__PURE__ */ React.createElement("li", null, "Import the component into the file where ", /* @__PURE__ */ React.createElement("code", null, "<UniformComposition />"), " is defined, for example ", /* @__PURE__ */ React.createElement("pre", null, `import "../components/${proposedFileName}.tsx"`))
59
+ ), " ", /* @__PURE__ */ React.createElement("p", null, "Need more help?", " ", /* @__PURE__ */ React.createElement(
60
+ "a",
61
+ {
62
+ href: "https://docs.uniform.app/docs/guides/composition/rendering",
63
+ target: "_blank",
64
+ rel: "noreferrer",
65
+ style: { textDecoration: "underline" }
66
+ },
67
+ "Check out the documentation."
68
+ )));
32
69
  }
33
70
 
34
71
  // src/components/UniformComponent.tsx
@@ -561,7 +598,7 @@ var UniformText = ({
561
598
  ref: elementRef,
562
599
  "data-uniform-component-id": componentData == null ? void 0 : componentData._id,
563
600
  "data-uniform-parameter-id": parameterId,
564
- "data-uniform-parameter-value": value,
601
+ "data-uniform-parameter-value": value != null ? value : "",
565
602
  "data-uniform-parameter-type": "text",
566
603
  "data-uniform-is-multiline": isMultiline,
567
604
  "data-uniform-placeholder": placeholder,
package/dist/index.js CHANGED
@@ -53,6 +53,9 @@ module.exports = __toCommonJS(src_exports);
53
53
  var import_canvas = require("@uniformdev/canvas");
54
54
  var import_react = __toESM(require("react"));
55
55
  var wrapperStyles = {
56
+ display: "flex",
57
+ flexDirection: "column",
58
+ gap: "0.5rem",
56
59
  borderLeft: "4px solid #e42535",
57
60
  padding: "16px",
58
61
  fontSize: "16px",
@@ -62,7 +65,7 @@ var wrapperStyles = {
62
65
  color: "#1d3557"
63
66
  };
64
67
  function DefaultNotImplementedComponent(props) {
65
- var _a;
68
+ var _a, _b, _c;
66
69
  const componentType = (_a = props.component) == null ? void 0 : _a.type;
67
70
  if (!componentType) {
68
71
  return null;
@@ -79,7 +82,41 @@ function DefaultNotImplementedComponent(props) {
79
82
  "enable localization in your front-end application."
80
83
  )));
81
84
  }
82
- return /* @__PURE__ */ import_react.default.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ import_react.default.createElement("h2", null, "Component: ", /* @__PURE__ */ import_react.default.createElement("code", null, componentType)), /* @__PURE__ */ import_react.default.createElement("p", null, /* @__PURE__ */ import_react.default.createElement("code", null, /* @__PURE__ */ import_react.default.createElement("strong", null, componentType)), " ", "has no React implementation. It may need to be added to your ", /* @__PURE__ */ import_react.default.createElement("code", null, "resolveRenderer()"), " function."), /* @__PURE__ */ import_react.default.createElement("details", null, /* @__PURE__ */ import_react.default.createElement("summary", { style: { cursor: "pointer" } }, "Data"), /* @__PURE__ */ import_react.default.createElement("pre", null, JSON.stringify(props, null, 2))));
85
+ const proposedFileName = `${componentType[0].toUpperCase()}${componentType.substring(1)}`;
86
+ const probableProps = Object.keys((_b = props.component.parameters) != null ? _b : {});
87
+ const probableSlots = Object.keys((_c = props.component.slots) != null ? _c : {});
88
+ return /* @__PURE__ */ import_react.default.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ import_react.default.createElement("h2", { style: { fontSize: "1.2rem" } }, "Unknown Component"), /* @__PURE__ */ import_react.default.createElement("p", null, "Received request from Uniform to render a component with the public ID: ", /* @__PURE__ */ import_react.default.createElement("code", null, componentType), "."), /* @__PURE__ */ import_react.default.createElement("p", null, /* @__PURE__ */ import_react.default.createElement("code", null, "<UniformComposition />"), " does not have ", /* @__PURE__ */ import_react.default.createElement("code", null, componentType), " mapped to a React component yet."), /* @__PURE__ */ import_react.default.createElement("p", null, "To teach your app how to render this component:"), " ", /* @__PURE__ */ import_react.default.createElement(
89
+ "ul",
90
+ {
91
+ style: {
92
+ listStyleType: "disc",
93
+ marginLeft: "1rem",
94
+ display: "flex",
95
+ flexDirection: "column",
96
+ gap: "0.5rem"
97
+ }
98
+ },
99
+ /* @__PURE__ */ import_react.default.createElement("li", null, "Create a React component and register it with Uniform, for example", /* @__PURE__ */ import_react.default.createElement("pre", null, `function ${proposedFileName}(${probableProps.length > 0 ? `{ ${probableProps.join(", ")} }` : ""}) {
100
+ return (
101
+ <div>
102
+ ${proposedFileName}!
103
+ ${probableSlots.length > 0 ? probableSlots.map((slot) => `<UniformSlot name="${slot}" />`).join("\n ") : ""}
104
+ </div>
105
+ )
106
+ }
107
+
108
+ registerUniformComponent({ type: "${componentType}", component: ${proposedFileName} })`), /* @__PURE__ */ import_react.default.createElement("details", null, /* @__PURE__ */ import_react.default.createElement("summary", { style: { cursor: "pointer" } }, "Props that your React component will receive"), /* @__PURE__ */ import_react.default.createElement("pre", null, JSON.stringify(props, null, 2)))),
109
+ /* @__PURE__ */ import_react.default.createElement("li", null, "Import the component into the file where ", /* @__PURE__ */ import_react.default.createElement("code", null, "<UniformComposition />"), " is defined, for example ", /* @__PURE__ */ import_react.default.createElement("pre", null, `import "../components/${proposedFileName}.tsx"`))
110
+ ), " ", /* @__PURE__ */ import_react.default.createElement("p", null, "Need more help?", " ", /* @__PURE__ */ import_react.default.createElement(
111
+ "a",
112
+ {
113
+ href: "https://docs.uniform.app/docs/guides/composition/rendering",
114
+ target: "_blank",
115
+ rel: "noreferrer",
116
+ style: { textDecoration: "underline" }
117
+ },
118
+ "Check out the documentation."
119
+ )));
83
120
  }
84
121
 
85
122
  // src/components/UniformComponent.tsx
@@ -589,7 +626,7 @@ var UniformText = ({
589
626
  ref: elementRef,
590
627
  "data-uniform-component-id": componentData == null ? void 0 : componentData._id,
591
628
  "data-uniform-parameter-id": parameterId,
592
- "data-uniform-parameter-value": value,
629
+ "data-uniform-parameter-value": value != null ? value : "",
593
630
  "data-uniform-parameter-type": "text",
594
631
  "data-uniform-is-multiline": isMultiline,
595
632
  "data-uniform-placeholder": placeholder,
package/dist/index.mjs CHANGED
@@ -2,6 +2,9 @@
2
2
  import { CANVAS_LOCALIZATION_TYPE } from "@uniformdev/canvas";
3
3
  import React from "react";
4
4
  var wrapperStyles = {
5
+ display: "flex",
6
+ flexDirection: "column",
7
+ gap: "0.5rem",
5
8
  borderLeft: "4px solid #e42535",
6
9
  padding: "16px",
7
10
  fontSize: "16px",
@@ -11,7 +14,7 @@ var wrapperStyles = {
11
14
  color: "#1d3557"
12
15
  };
13
16
  function DefaultNotImplementedComponent(props) {
14
- var _a;
17
+ var _a, _b, _c;
15
18
  const componentType = (_a = props.component) == null ? void 0 : _a.type;
16
19
  if (!componentType) {
17
20
  return null;
@@ -28,7 +31,41 @@ function DefaultNotImplementedComponent(props) {
28
31
  "enable localization in your front-end application."
29
32
  )));
30
33
  }
31
- return /* @__PURE__ */ React.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ React.createElement("h2", null, "Component: ", /* @__PURE__ */ React.createElement("code", null, componentType)), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("code", null, /* @__PURE__ */ React.createElement("strong", null, componentType)), " ", "has no React implementation. It may need to be added to your ", /* @__PURE__ */ React.createElement("code", null, "resolveRenderer()"), " function."), /* @__PURE__ */ React.createElement("details", null, /* @__PURE__ */ React.createElement("summary", { style: { cursor: "pointer" } }, "Data"), /* @__PURE__ */ React.createElement("pre", null, JSON.stringify(props, null, 2))));
34
+ const proposedFileName = `${componentType[0].toUpperCase()}${componentType.substring(1)}`;
35
+ const probableProps = Object.keys((_b = props.component.parameters) != null ? _b : {});
36
+ const probableSlots = Object.keys((_c = props.component.slots) != null ? _c : {});
37
+ return /* @__PURE__ */ React.createElement("div", { style: wrapperStyles }, /* @__PURE__ */ React.createElement("h2", { style: { fontSize: "1.2rem" } }, "Unknown Component"), /* @__PURE__ */ React.createElement("p", null, "Received request from Uniform to render a component with the public ID: ", /* @__PURE__ */ React.createElement("code", null, componentType), "."), /* @__PURE__ */ React.createElement("p", null, /* @__PURE__ */ React.createElement("code", null, "<UniformComposition />"), " does not have ", /* @__PURE__ */ React.createElement("code", null, componentType), " mapped to a React component yet."), /* @__PURE__ */ React.createElement("p", null, "To teach your app how to render this component:"), " ", /* @__PURE__ */ React.createElement(
38
+ "ul",
39
+ {
40
+ style: {
41
+ listStyleType: "disc",
42
+ marginLeft: "1rem",
43
+ display: "flex",
44
+ flexDirection: "column",
45
+ gap: "0.5rem"
46
+ }
47
+ },
48
+ /* @__PURE__ */ React.createElement("li", null, "Create a React component and register it with Uniform, for example", /* @__PURE__ */ React.createElement("pre", null, `function ${proposedFileName}(${probableProps.length > 0 ? `{ ${probableProps.join(", ")} }` : ""}) {
49
+ return (
50
+ <div>
51
+ ${proposedFileName}!
52
+ ${probableSlots.length > 0 ? probableSlots.map((slot) => `<UniformSlot name="${slot}" />`).join("\n ") : ""}
53
+ </div>
54
+ )
55
+ }
56
+
57
+ registerUniformComponent({ type: "${componentType}", component: ${proposedFileName} })`), /* @__PURE__ */ React.createElement("details", null, /* @__PURE__ */ React.createElement("summary", { style: { cursor: "pointer" } }, "Props that your React component will receive"), /* @__PURE__ */ React.createElement("pre", null, JSON.stringify(props, null, 2)))),
58
+ /* @__PURE__ */ React.createElement("li", null, "Import the component into the file where ", /* @__PURE__ */ React.createElement("code", null, "<UniformComposition />"), " is defined, for example ", /* @__PURE__ */ React.createElement("pre", null, `import "../components/${proposedFileName}.tsx"`))
59
+ ), " ", /* @__PURE__ */ React.createElement("p", null, "Need more help?", " ", /* @__PURE__ */ React.createElement(
60
+ "a",
61
+ {
62
+ href: "https://docs.uniform.app/docs/guides/composition/rendering",
63
+ target: "_blank",
64
+ rel: "noreferrer",
65
+ style: { textDecoration: "underline" }
66
+ },
67
+ "Check out the documentation."
68
+ )));
32
69
  }
33
70
 
34
71
  // src/components/UniformComponent.tsx
@@ -561,7 +598,7 @@ var UniformText = ({
561
598
  ref: elementRef,
562
599
  "data-uniform-component-id": componentData == null ? void 0 : componentData._id,
563
600
  "data-uniform-parameter-id": parameterId,
564
- "data-uniform-parameter-value": value,
601
+ "data-uniform-parameter-value": value != null ? value : "",
565
602
  "data-uniform-parameter-type": "text",
566
603
  "data-uniform-is-multiline": isMultiline,
567
604
  "data-uniform-placeholder": placeholder,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/canvas-react",
3
- "version": "19.5.1-alpha.22+5b4a94102",
3
+ "version": "19.7.0",
4
4
  "description": "React SDK for Uniform Canvas",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "./dist/index.js",
@@ -24,9 +24,9 @@
24
24
  "document": "api-extractor run --local"
25
25
  },
26
26
  "dependencies": {
27
- "@uniformdev/canvas": "19.5.1-alpha.22+5b4a94102",
28
- "@uniformdev/context": "19.5.1-alpha.22+5b4a94102",
29
- "@uniformdev/context-react": "19.5.1-alpha.22+5b4a94102"
27
+ "@uniformdev/canvas": "19.7.0",
28
+ "@uniformdev/context": "19.7.0",
29
+ "@uniformdev/context-react": "19.7.0"
30
30
  },
31
31
  "peerDependencies": {
32
32
  "react": ">= 16 || 17 || 18",
@@ -43,5 +43,5 @@
43
43
  "publishConfig": {
44
44
  "access": "public"
45
45
  },
46
- "gitHead": "5b4a94102c83a88c9fbf888a24d633e8abf96b76"
46
+ "gitHead": "bbcd8d36ccb082d87f1f434a94d6d9402ddb5424"
47
47
  }