@uniformdev/canvas-react 19.179.2-alpha.22 → 19.181.1-alpha.4

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 (6) hide show
  1. package/dist/index.d.mts +16 -4
  2. package/dist/index.d.ts +16 -4
  3. package/dist/index.esm.js +53 -36
  4. package/dist/index.js +63 -43
  5. package/dist/index.mjs +53 -36
  6. package/package.json +6 -6
package/dist/index.d.mts CHANGED
@@ -227,7 +227,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
227
227
  isPatternParameter?: boolean;
228
228
  ignorePatternParameterDefault?: boolean;
229
229
  optionalPatternParameter?: boolean;
230
- dataSourceVariant?: "unpublished";
231
230
  variables?: {
232
231
  [key: string]: string;
233
232
  };
@@ -239,7 +238,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
239
238
  isPatternParameter?: boolean;
240
239
  ignorePatternParameterDefault?: boolean;
241
240
  optionalPatternParameter?: boolean;
242
- dataSourceVariant?: "unpublished";
243
241
  variables?: {
244
242
  [key: string]: string;
245
243
  };
@@ -322,7 +320,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
322
320
  isPatternParameter?: boolean;
323
321
  ignorePatternParameterDefault?: boolean;
324
322
  optionalPatternParameter?: boolean;
325
- dataSourceVariant?: "unpublished";
326
323
  variables?: {
327
324
  [key: string]: string;
328
325
  };
@@ -334,7 +331,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
334
331
  isPatternParameter?: boolean;
335
332
  ignorePatternParameterDefault?: boolean;
336
333
  optionalPatternParameter?: boolean;
337
- dataSourceVariant?: "unpublished";
338
334
  variables?: {
339
335
  [key: string]: string;
340
336
  };
@@ -473,6 +469,14 @@ type UniformRichTextProps = {
473
469
  * for rendering a rich text node
474
470
  */
475
471
  resolveRichTextRenderer?: RenderRichTextComponentResolver;
472
+ /**
473
+ * Sets the value to show in Canvas editor when the parameter value is empty.
474
+ * Can be a static string, or a function to generate the placeholder out of parameter info.
475
+ * @default undefined
476
+ */
477
+ placeholder?: string | ((parameter: {
478
+ id: string;
479
+ }) => string | undefined);
476
480
  } & Omit<React$1.HTMLAttributes<HTMLDivElement>, 'children'>;
477
481
  /**
478
482
  * Adds rendering support for Uniform Rich Text parameters
@@ -490,6 +494,14 @@ declare const UniformRichText: React$1.ForwardRefExoticComponent<{
490
494
  * for rendering a rich text node
491
495
  */
492
496
  resolveRichTextRenderer?: RenderRichTextComponentResolver;
497
+ /**
498
+ * Sets the value to show in Canvas editor when the parameter value is empty.
499
+ * Can be a static string, or a function to generate the placeholder out of parameter info.
500
+ * @default undefined
501
+ */
502
+ placeholder?: string | ((parameter: {
503
+ id: string;
504
+ }) => string | undefined);
493
505
  } & Omit<React$1.HTMLAttributes<HTMLDivElement>, "children"> & React$1.RefAttributes<unknown>>;
494
506
 
495
507
  type UniformRichTextNodeProps = {
package/dist/index.d.ts CHANGED
@@ -227,7 +227,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
227
227
  isPatternParameter?: boolean;
228
228
  ignorePatternParameterDefault?: boolean;
229
229
  optionalPatternParameter?: boolean;
230
- dataSourceVariant?: "unpublished";
231
230
  variables?: {
232
231
  [key: string]: string;
233
232
  };
@@ -239,7 +238,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
239
238
  isPatternParameter?: boolean;
240
239
  ignorePatternParameterDefault?: boolean;
241
240
  optionalPatternParameter?: boolean;
242
- dataSourceVariant?: "unpublished";
243
241
  variables?: {
244
242
  [key: string]: string;
245
243
  };
@@ -322,7 +320,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
322
320
  isPatternParameter?: boolean;
323
321
  ignorePatternParameterDefault?: boolean;
324
322
  optionalPatternParameter?: boolean;
325
- dataSourceVariant?: "unpublished";
326
323
  variables?: {
327
324
  [key: string]: string;
328
325
  };
@@ -334,7 +331,6 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
334
331
  isPatternParameter?: boolean;
335
332
  ignorePatternParameterDefault?: boolean;
336
333
  optionalPatternParameter?: boolean;
337
- dataSourceVariant?: "unpublished";
338
334
  variables?: {
339
335
  [key: string]: string;
340
336
  };
@@ -473,6 +469,14 @@ type UniformRichTextProps = {
473
469
  * for rendering a rich text node
474
470
  */
475
471
  resolveRichTextRenderer?: RenderRichTextComponentResolver;
472
+ /**
473
+ * Sets the value to show in Canvas editor when the parameter value is empty.
474
+ * Can be a static string, or a function to generate the placeholder out of parameter info.
475
+ * @default undefined
476
+ */
477
+ placeholder?: string | ((parameter: {
478
+ id: string;
479
+ }) => string | undefined);
476
480
  } & Omit<React$1.HTMLAttributes<HTMLDivElement>, 'children'>;
477
481
  /**
478
482
  * Adds rendering support for Uniform Rich Text parameters
@@ -490,6 +494,14 @@ declare const UniformRichText: React$1.ForwardRefExoticComponent<{
490
494
  * for rendering a rich text node
491
495
  */
492
496
  resolveRichTextRenderer?: RenderRichTextComponentResolver;
497
+ /**
498
+ * Sets the value to show in Canvas editor when the parameter value is empty.
499
+ * Can be a static string, or a function to generate the placeholder out of parameter info.
500
+ * @default undefined
501
+ */
502
+ placeholder?: string | ((parameter: {
503
+ id: string;
504
+ }) => string | undefined);
493
505
  } & Omit<React$1.HTMLAttributes<HTMLDivElement>, "children"> & React$1.RefAttributes<unknown>>;
494
506
 
495
507
  type UniformRichTextNodeProps = {
package/dist/index.esm.js CHANGED
@@ -695,15 +695,12 @@ import {
695
695
  ATTRIBUTE_PARAMETER_ID,
696
696
  ATTRIBUTE_PARAMETER_TYPE
697
697
  } from "@uniformdev/canvas";
698
- import {
699
- isRichTextValue,
700
- isRichTextValueConsideredEmpty
701
- } from "@uniformdev/richtext";
702
- import React18, { useMemo as useMemo5 } from "react";
698
+ import { isRichTextValue, isRichTextValueConsideredEmpty } from "@uniformdev/richtext";
699
+ import React19 from "react";
703
700
 
704
701
  // src/components/UniformRichText/UniformRichTextNode.tsx
705
702
  import { isRichTextNode } from "@uniformdev/richtext";
706
- import React17 from "react";
703
+ import React18 from "react";
707
704
 
708
705
  // src/components/UniformRichText/nodes/HeadingRichTextNode.tsx
709
706
  import React9 from "react";
@@ -757,19 +754,28 @@ var ParagraphRichTextNode = ({ children, node }) => {
757
754
  );
758
755
  };
759
756
 
760
- // src/components/UniformRichText/nodes/TabRichTextNode.tsx
757
+ // src/components/UniformRichText/nodes/TableCellRichTextNode.tsx
758
+ import { getRichTextTagFromTableCellHeaderState } from "@uniformdev/richtext";
761
759
  import React15 from "react";
760
+ var TableCellRichTextNode = ({ children, node }) => {
761
+ const { headerState } = node;
762
+ const TableCellTag = getRichTextTagFromTableCellHeaderState(headerState);
763
+ return /* @__PURE__ */ React15.createElement(TableCellTag, null, children);
764
+ };
765
+
766
+ // src/components/UniformRichText/nodes/TabRichTextNode.tsx
767
+ import React16 from "react";
762
768
  var TabRichTextNode = () => {
763
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, " ");
769
+ return /* @__PURE__ */ React16.createElement(React16.Fragment, null, " ");
764
770
  };
765
771
 
766
772
  // src/components/UniformRichText/nodes/TextRichTextNode.tsx
767
773
  import { getRichTextTagsFromTextFormat } from "@uniformdev/richtext";
768
- import React16 from "react";
774
+ import React17 from "react";
769
775
  var TextRichTextNode = ({ node }) => {
770
776
  const { text, format } = node;
771
777
  const tags = getRichTextTagsFromTextFormat(format);
772
- return /* @__PURE__ */ React16.createElement(React16.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ React16.createElement(Tag, null, children), text) : text);
778
+ return /* @__PURE__ */ React17.createElement(React17.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ React17.createElement(Tag, null, children), text) : text);
773
779
  };
774
780
 
775
781
  // src/components/UniformRichText/UniformRichTextNode.tsx
@@ -783,8 +789,8 @@ function UniformRichTextNode({ node, ...props }) {
783
789
  if (!NodeRenderer) {
784
790
  return null;
785
791
  }
786
- const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ React17.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
787
- return /* @__PURE__ */ React17.createElement(NodeRenderer, { node }, children);
792
+ const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ React18.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
793
+ return /* @__PURE__ */ React18.createElement(NodeRenderer, { node }, children);
788
794
  }
789
795
  var rendererMap = /* @__PURE__ */ new Map([
790
796
  ["heading", HeadingRichTextNode],
@@ -793,48 +799,59 @@ var rendererMap = /* @__PURE__ */ new Map([
793
799
  ["list", ListRichTextNode],
794
800
  ["listitem", ListItemRichTextNode],
795
801
  ["paragraph", ParagraphRichTextNode],
796
- ["quote", ({ children }) => /* @__PURE__ */ React17.createElement("blockquote", null, children)],
802
+ ["quote", ({ children }) => /* @__PURE__ */ React18.createElement("blockquote", null, children)],
797
803
  [
798
804
  "code",
799
- ({ children }) => /* @__PURE__ */ React17.createElement("pre", null, /* @__PURE__ */ React17.createElement("code", null, children))
805
+ ({ children }) => /* @__PURE__ */ React18.createElement("pre", null, /* @__PURE__ */ React18.createElement("code", null, children))
800
806
  ],
801
- ["root", ({ children }) => /* @__PURE__ */ React17.createElement(React17.Fragment, null, children)],
807
+ ["root", ({ children }) => /* @__PURE__ */ React18.createElement(React18.Fragment, null, children)],
802
808
  ["text", TextRichTextNode],
803
- ["tab", TabRichTextNode]
809
+ ["tab", TabRichTextNode],
810
+ [
811
+ "table",
812
+ ({ children }) => /* @__PURE__ */ React18.createElement("table", null, /* @__PURE__ */ React18.createElement("tbody", null, children))
813
+ ],
814
+ ["tablerow", ({ children }) => /* @__PURE__ */ React18.createElement("tr", null, children)],
815
+ ["tablecell", TableCellRichTextNode]
804
816
  ]);
805
817
  var resolveRichTextDefaultRenderer = (node) => {
806
818
  return rendererMap.get(node.type);
807
819
  };
808
820
 
809
821
  // src/components/UniformRichText/UniformRichText.tsx
810
- var UniformRichText = React18.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", ...props }, ref) {
811
- const { data: componentData } = useUniformCurrentComponent();
812
- const parameter = useMemo5(() => {
813
- var _a;
814
- return (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
815
- }, [componentData, parameterId]);
816
- const value = useMemo5(() => parameter == null ? void 0 : parameter.value, [parameter]);
817
- if (!value || !isRichTextValue(value) || isRichTextValueConsideredEmpty(value)) return null;
818
- return Tag === null ? /* @__PURE__ */ React18.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ React18.createElement(
822
+ var UniformRichText = React19.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", placeholder, ...props }, ref) {
823
+ var _a;
824
+ const { data: componentData, contextualEditingDefaultPlaceholder } = useUniformCurrentComponent();
825
+ const { isContextualEditing } = useUniformCurrentComposition();
826
+ const parameter = (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
827
+ if (!parameter) {
828
+ return null;
829
+ }
830
+ const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
831
+ const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
832
+ const value = parameter.value;
833
+ if (!value || !isRichTextValue(value)) return null;
834
+ if (!isContextualEditing && isRichTextValueConsideredEmpty(value)) return null;
835
+ return Tag === null ? /* @__PURE__ */ React19.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ React19.createElement(
819
836
  Tag,
820
837
  {
821
838
  ref,
822
839
  ...props,
823
- ...{
840
+ ...isContextualEditing ? {
824
841
  [ATTRIBUTE_COMPONENT_ID]: componentData == null ? void 0 : componentData._id,
825
842
  [ATTRIBUTE_PARAMETER_ID]: parameterId,
826
843
  [ATTRIBUTE_PARAMETER_TYPE]: "richText"
827
- }
844
+ } : {}
828
845
  },
829
- /* @__PURE__ */ React18.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
846
+ isRichTextValueConsideredEmpty(value) ? /* @__PURE__ */ React19.createElement("p", null, /* @__PURE__ */ React19.createElement("i", null, computedPlaceholder)) : /* @__PURE__ */ React19.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
830
847
  );
831
848
  });
832
849
 
833
850
  // src/components/UniformText.tsx
834
- import React20, { useState as useState2 } from "react";
851
+ import React21, { useState as useState2 } from "react";
835
852
 
836
853
  // src/components/PureUniformText.tsx
837
- import React19 from "react";
854
+ import React20 from "react";
838
855
  var PureUniformText = ({
839
856
  as: Tag = "span",
840
857
  parameterId,
@@ -853,10 +870,10 @@ var PureUniformText = ({
853
870
  return null;
854
871
  }
855
872
  if (!isContextualEditing) {
856
- return /* @__PURE__ */ React19.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
873
+ return /* @__PURE__ */ React20.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
857
874
  }
858
875
  const computedPlaceholder = typeof placeholder === "function" ? placeholder({ id: parameterId }) : placeholder;
859
- return /* @__PURE__ */ React19.createElement(
876
+ return /* @__PURE__ */ React20.createElement(
860
877
  Tag,
861
878
  {
862
879
  ...props,
@@ -894,7 +911,7 @@ var UniformText = ({
894
911
  }
895
912
  const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
896
913
  const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
897
- return /* @__PURE__ */ React20.createElement(
914
+ return /* @__PURE__ */ React21.createElement(
898
915
  PureUniformText,
899
916
  {
900
917
  ...props,
@@ -972,7 +989,7 @@ import {
972
989
  createCanvasChannel as createCanvasChannel2,
973
990
  isUpdateContextualEditingStateInternalMessage
974
991
  } from "@uniformdev/canvas";
975
- import { useEffect as useEffect3, useMemo as useMemo6, useState as useState3 } from "react";
992
+ import { useEffect as useEffect3, useMemo as useMemo5, useState as useState3 } from "react";
976
993
  var useUniformContextualEditingState = ({
977
994
  global = false
978
995
  } = {}) => {
@@ -982,7 +999,7 @@ var useUniformContextualEditingState = ({
982
999
  const [previewMode, setPreviewMode] = useState3(
983
1000
  isContextualEditing ? "editor" : void 0
984
1001
  );
985
- const channel = useMemo6(() => {
1002
+ const channel = useMemo5(() => {
986
1003
  if (!isContextualEditing) {
987
1004
  return;
988
1005
  }
@@ -1016,7 +1033,7 @@ var useUniformContextualEditingState = ({
1016
1033
  unsubscribe();
1017
1034
  };
1018
1035
  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference, setPreviewMode]);
1019
- return useMemo6(
1036
+ return useMemo5(
1020
1037
  () => ({
1021
1038
  isContextualEditing,
1022
1039
  selectedComponentReference,
package/dist/index.js CHANGED
@@ -719,12 +719,12 @@ var UniformPlayground = ({
719
719
 
720
720
  // src/components/UniformRichText/UniformRichText.tsx
721
721
  var import_canvas11 = require("@uniformdev/canvas");
722
- var import_richtext5 = require("@uniformdev/richtext");
723
- var import_react20 = __toESM(require("react"));
722
+ var import_richtext6 = require("@uniformdev/richtext");
723
+ var import_react21 = __toESM(require("react"));
724
724
 
725
725
  // src/components/UniformRichText/UniformRichTextNode.tsx
726
- var import_richtext4 = require("@uniformdev/richtext");
727
- var import_react19 = __toESM(require("react"));
726
+ var import_richtext5 = require("@uniformdev/richtext");
727
+ var import_react20 = __toESM(require("react"));
728
728
 
729
729
  // src/components/UniformRichText/nodes/HeadingRichTextNode.tsx
730
730
  var import_react11 = __toESM(require("react"));
@@ -778,25 +778,34 @@ var ParagraphRichTextNode = ({ children, node }) => {
778
778
  );
779
779
  };
780
780
 
781
- // src/components/UniformRichText/nodes/TabRichTextNode.tsx
781
+ // src/components/UniformRichText/nodes/TableCellRichTextNode.tsx
782
+ var import_richtext3 = require("@uniformdev/richtext");
782
783
  var import_react17 = __toESM(require("react"));
784
+ var TableCellRichTextNode = ({ children, node }) => {
785
+ const { headerState } = node;
786
+ const TableCellTag = (0, import_richtext3.getRichTextTagFromTableCellHeaderState)(headerState);
787
+ return /* @__PURE__ */ import_react17.default.createElement(TableCellTag, null, children);
788
+ };
789
+
790
+ // src/components/UniformRichText/nodes/TabRichTextNode.tsx
791
+ var import_react18 = __toESM(require("react"));
783
792
  var TabRichTextNode = () => {
784
- return /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, " ");
793
+ return /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, " ");
785
794
  };
786
795
 
787
796
  // src/components/UniformRichText/nodes/TextRichTextNode.tsx
788
- var import_richtext3 = require("@uniformdev/richtext");
789
- var import_react18 = __toESM(require("react"));
797
+ var import_richtext4 = require("@uniformdev/richtext");
798
+ var import_react19 = __toESM(require("react"));
790
799
  var TextRichTextNode = ({ node }) => {
791
800
  const { text, format } = node;
792
- const tags = (0, import_richtext3.getRichTextTagsFromTextFormat)(format);
793
- return /* @__PURE__ */ import_react18.default.createElement(import_react18.default.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ import_react18.default.createElement(Tag, null, children), text) : text);
801
+ const tags = (0, import_richtext4.getRichTextTagsFromTextFormat)(format);
802
+ return /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ import_react19.default.createElement(Tag, null, children), text) : text);
794
803
  };
795
804
 
796
805
  // src/components/UniformRichText/UniformRichTextNode.tsx
797
806
  function UniformRichTextNode({ node, ...props }) {
798
807
  var _a;
799
- if (!(0, import_richtext4.isRichTextNode)(node)) return null;
808
+ if (!(0, import_richtext5.isRichTextNode)(node)) return null;
800
809
  let NodeRenderer = (_a = props.resolveRichTextRenderer) == null ? void 0 : _a.call(props, node);
801
810
  if (typeof NodeRenderer === "undefined") {
802
811
  NodeRenderer = resolveRichTextDefaultRenderer(node);
@@ -804,8 +813,8 @@ function UniformRichTextNode({ node, ...props }) {
804
813
  if (!NodeRenderer) {
805
814
  return null;
806
815
  }
807
- const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ import_react19.default.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
808
- return /* @__PURE__ */ import_react19.default.createElement(NodeRenderer, { node }, children);
816
+ const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ import_react20.default.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
817
+ return /* @__PURE__ */ import_react20.default.createElement(NodeRenderer, { node }, children);
809
818
  }
810
819
  var rendererMap = /* @__PURE__ */ new Map([
811
820
  ["heading", HeadingRichTextNode],
@@ -814,48 +823,59 @@ var rendererMap = /* @__PURE__ */ new Map([
814
823
  ["list", ListRichTextNode],
815
824
  ["listitem", ListItemRichTextNode],
816
825
  ["paragraph", ParagraphRichTextNode],
817
- ["quote", ({ children }) => /* @__PURE__ */ import_react19.default.createElement("blockquote", null, children)],
826
+ ["quote", ({ children }) => /* @__PURE__ */ import_react20.default.createElement("blockquote", null, children)],
818
827
  [
819
828
  "code",
820
- ({ children }) => /* @__PURE__ */ import_react19.default.createElement("pre", null, /* @__PURE__ */ import_react19.default.createElement("code", null, children))
829
+ ({ children }) => /* @__PURE__ */ import_react20.default.createElement("pre", null, /* @__PURE__ */ import_react20.default.createElement("code", null, children))
821
830
  ],
822
- ["root", ({ children }) => /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, children)],
831
+ ["root", ({ children }) => /* @__PURE__ */ import_react20.default.createElement(import_react20.default.Fragment, null, children)],
823
832
  ["text", TextRichTextNode],
824
- ["tab", TabRichTextNode]
833
+ ["tab", TabRichTextNode],
834
+ [
835
+ "table",
836
+ ({ children }) => /* @__PURE__ */ import_react20.default.createElement("table", null, /* @__PURE__ */ import_react20.default.createElement("tbody", null, children))
837
+ ],
838
+ ["tablerow", ({ children }) => /* @__PURE__ */ import_react20.default.createElement("tr", null, children)],
839
+ ["tablecell", TableCellRichTextNode]
825
840
  ]);
826
841
  var resolveRichTextDefaultRenderer = (node) => {
827
842
  return rendererMap.get(node.type);
828
843
  };
829
844
 
830
845
  // src/components/UniformRichText/UniformRichText.tsx
831
- var UniformRichText = import_react20.default.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", ...props }, ref) {
832
- const { data: componentData } = useUniformCurrentComponent();
833
- const parameter = (0, import_react20.useMemo)(() => {
834
- var _a;
835
- return (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
836
- }, [componentData, parameterId]);
837
- const value = (0, import_react20.useMemo)(() => parameter == null ? void 0 : parameter.value, [parameter]);
838
- if (!value || !(0, import_richtext5.isRichTextValue)(value) || (0, import_richtext5.isRichTextValueConsideredEmpty)(value)) return null;
839
- return Tag === null ? /* @__PURE__ */ import_react20.default.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ import_react20.default.createElement(
846
+ var UniformRichText = import_react21.default.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", placeholder, ...props }, ref) {
847
+ var _a;
848
+ const { data: componentData, contextualEditingDefaultPlaceholder } = useUniformCurrentComponent();
849
+ const { isContextualEditing } = useUniformCurrentComposition();
850
+ const parameter = (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
851
+ if (!parameter) {
852
+ return null;
853
+ }
854
+ const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
855
+ const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
856
+ const value = parameter.value;
857
+ if (!value || !(0, import_richtext6.isRichTextValue)(value)) return null;
858
+ if (!isContextualEditing && (0, import_richtext6.isRichTextValueConsideredEmpty)(value)) return null;
859
+ return Tag === null ? /* @__PURE__ */ import_react21.default.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ import_react21.default.createElement(
840
860
  Tag,
841
861
  {
842
862
  ref,
843
863
  ...props,
844
- ...{
864
+ ...isContextualEditing ? {
845
865
  [import_canvas11.ATTRIBUTE_COMPONENT_ID]: componentData == null ? void 0 : componentData._id,
846
866
  [import_canvas11.ATTRIBUTE_PARAMETER_ID]: parameterId,
847
867
  [import_canvas11.ATTRIBUTE_PARAMETER_TYPE]: "richText"
848
- }
868
+ } : {}
849
869
  },
850
- /* @__PURE__ */ import_react20.default.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
870
+ (0, import_richtext6.isRichTextValueConsideredEmpty)(value) ? /* @__PURE__ */ import_react21.default.createElement("p", null, /* @__PURE__ */ import_react21.default.createElement("i", null, computedPlaceholder)) : /* @__PURE__ */ import_react21.default.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
851
871
  );
852
872
  });
853
873
 
854
874
  // src/components/UniformText.tsx
855
- var import_react22 = __toESM(require("react"));
875
+ var import_react23 = __toESM(require("react"));
856
876
 
857
877
  // src/components/PureUniformText.tsx
858
- var import_react21 = __toESM(require("react"));
878
+ var import_react22 = __toESM(require("react"));
859
879
  var PureUniformText = ({
860
880
  as: Tag = "span",
861
881
  parameterId,
@@ -874,10 +894,10 @@ var PureUniformText = ({
874
894
  return null;
875
895
  }
876
896
  if (!isContextualEditing) {
877
- return /* @__PURE__ */ import_react21.default.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
897
+ return /* @__PURE__ */ import_react22.default.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
878
898
  }
879
899
  const computedPlaceholder = typeof placeholder === "function" ? placeholder({ id: parameterId }) : placeholder;
880
- return /* @__PURE__ */ import_react21.default.createElement(
900
+ return /* @__PURE__ */ import_react22.default.createElement(
881
901
  Tag,
882
902
  {
883
903
  ...props,
@@ -906,7 +926,7 @@ var UniformText = ({
906
926
  var _a, _b, _c;
907
927
  const { data: componentData, contextualEditingDefaultPlaceholder } = useUniformCurrentComponent();
908
928
  const { isContextualEditing } = useUniformCurrentComposition();
909
- const [isFocused, setIsFocused] = (0, import_react22.useState)(false);
929
+ const [isFocused, setIsFocused] = (0, import_react23.useState)(false);
910
930
  const parameter = (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
911
931
  const isEditable = (_c = (_b = parameter == null ? void 0 : parameter._contextualEditing) == null ? void 0 : _b.isEditable) != null ? _c : false;
912
932
  const shouldSkipCustomRendering = isFocused && isEditable;
@@ -915,7 +935,7 @@ var UniformText = ({
915
935
  }
916
936
  const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
917
937
  const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
918
- return /* @__PURE__ */ import_react22.default.createElement(
938
+ return /* @__PURE__ */ import_react23.default.createElement(
919
939
  PureUniformText,
920
940
  {
921
941
  ...props,
@@ -948,14 +968,14 @@ var getParameterAttributes = (options) => {
948
968
 
949
969
  // src/hooks/useCompositionEventEffect.ts
950
970
  var import_canvas13 = require("@uniformdev/canvas");
951
- var import_react23 = require("react");
971
+ var import_react24 = require("react");
952
972
  function useCompositionEventEffect({
953
973
  enabled,
954
974
  projectId,
955
975
  compositionId,
956
976
  effect
957
977
  }) {
958
- (0, import_react23.useEffect)(() => {
978
+ (0, import_react24.useEffect)(() => {
959
979
  if (!enabled || !compositionId || !projectId) {
960
980
  return;
961
981
  }
@@ -984,17 +1004,17 @@ function useCompositionEventEffect({
984
1004
 
985
1005
  // src/hooks/useUniformContextualEditingState.ts
986
1006
  var import_canvas14 = require("@uniformdev/canvas");
987
- var import_react24 = require("react");
1007
+ var import_react25 = require("react");
988
1008
  var useUniformContextualEditingState = ({
989
1009
  global = false
990
1010
  } = {}) => {
991
1011
  const { isContextualEditing } = useUniformCurrentComposition();
992
1012
  const { data: componentData } = useUniformCurrentComponent();
993
- const [selectedComponentReference, setSelectedComponentReference] = (0, import_react24.useState)();
994
- const [previewMode, setPreviewMode] = (0, import_react24.useState)(
1013
+ const [selectedComponentReference, setSelectedComponentReference] = (0, import_react25.useState)();
1014
+ const [previewMode, setPreviewMode] = (0, import_react25.useState)(
995
1015
  isContextualEditing ? "editor" : void 0
996
1016
  );
997
- const channel = (0, import_react24.useMemo)(() => {
1017
+ const channel = (0, import_react25.useMemo)(() => {
998
1018
  if (!isContextualEditing) {
999
1019
  return;
1000
1020
  }
@@ -1004,7 +1024,7 @@ var useUniformContextualEditingState = ({
1004
1024
  });
1005
1025
  return channel2;
1006
1026
  }, [isContextualEditing]);
1007
- (0, import_react24.useEffect)(() => {
1027
+ (0, import_react25.useEffect)(() => {
1008
1028
  var _a, _b;
1009
1029
  if (!channel) {
1010
1030
  return;
@@ -1028,7 +1048,7 @@ var useUniformContextualEditingState = ({
1028
1048
  unsubscribe();
1029
1049
  };
1030
1050
  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference, setPreviewMode]);
1031
- return (0, import_react24.useMemo)(
1051
+ return (0, import_react25.useMemo)(
1032
1052
  () => ({
1033
1053
  isContextualEditing,
1034
1054
  selectedComponentReference,
package/dist/index.mjs CHANGED
@@ -695,15 +695,12 @@ import {
695
695
  ATTRIBUTE_PARAMETER_ID,
696
696
  ATTRIBUTE_PARAMETER_TYPE
697
697
  } from "@uniformdev/canvas";
698
- import {
699
- isRichTextValue,
700
- isRichTextValueConsideredEmpty
701
- } from "@uniformdev/richtext";
702
- import React18, { useMemo as useMemo5 } from "react";
698
+ import { isRichTextValue, isRichTextValueConsideredEmpty } from "@uniformdev/richtext";
699
+ import React19 from "react";
703
700
 
704
701
  // src/components/UniformRichText/UniformRichTextNode.tsx
705
702
  import { isRichTextNode } from "@uniformdev/richtext";
706
- import React17 from "react";
703
+ import React18 from "react";
707
704
 
708
705
  // src/components/UniformRichText/nodes/HeadingRichTextNode.tsx
709
706
  import React9 from "react";
@@ -757,19 +754,28 @@ var ParagraphRichTextNode = ({ children, node }) => {
757
754
  );
758
755
  };
759
756
 
760
- // src/components/UniformRichText/nodes/TabRichTextNode.tsx
757
+ // src/components/UniformRichText/nodes/TableCellRichTextNode.tsx
758
+ import { getRichTextTagFromTableCellHeaderState } from "@uniformdev/richtext";
761
759
  import React15 from "react";
760
+ var TableCellRichTextNode = ({ children, node }) => {
761
+ const { headerState } = node;
762
+ const TableCellTag = getRichTextTagFromTableCellHeaderState(headerState);
763
+ return /* @__PURE__ */ React15.createElement(TableCellTag, null, children);
764
+ };
765
+
766
+ // src/components/UniformRichText/nodes/TabRichTextNode.tsx
767
+ import React16 from "react";
762
768
  var TabRichTextNode = () => {
763
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, " ");
769
+ return /* @__PURE__ */ React16.createElement(React16.Fragment, null, " ");
764
770
  };
765
771
 
766
772
  // src/components/UniformRichText/nodes/TextRichTextNode.tsx
767
773
  import { getRichTextTagsFromTextFormat } from "@uniformdev/richtext";
768
- import React16 from "react";
774
+ import React17 from "react";
769
775
  var TextRichTextNode = ({ node }) => {
770
776
  const { text, format } = node;
771
777
  const tags = getRichTextTagsFromTextFormat(format);
772
- return /* @__PURE__ */ React16.createElement(React16.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ React16.createElement(Tag, null, children), text) : text);
778
+ return /* @__PURE__ */ React17.createElement(React17.Fragment, null, tags.length > 0 ? tags.reduceRight((children, Tag) => /* @__PURE__ */ React17.createElement(Tag, null, children), text) : text);
773
779
  };
774
780
 
775
781
  // src/components/UniformRichText/UniformRichTextNode.tsx
@@ -783,8 +789,8 @@ function UniformRichTextNode({ node, ...props }) {
783
789
  if (!NodeRenderer) {
784
790
  return null;
785
791
  }
786
- const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ React17.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
787
- return /* @__PURE__ */ React17.createElement(NodeRenderer, { node }, children);
792
+ const children = node.children ? node.children.map((childNode, i) => /* @__PURE__ */ React18.createElement(UniformRichTextNode, { ...props, key: i, node: childNode })) : null;
793
+ return /* @__PURE__ */ React18.createElement(NodeRenderer, { node }, children);
788
794
  }
789
795
  var rendererMap = /* @__PURE__ */ new Map([
790
796
  ["heading", HeadingRichTextNode],
@@ -793,48 +799,59 @@ var rendererMap = /* @__PURE__ */ new Map([
793
799
  ["list", ListRichTextNode],
794
800
  ["listitem", ListItemRichTextNode],
795
801
  ["paragraph", ParagraphRichTextNode],
796
- ["quote", ({ children }) => /* @__PURE__ */ React17.createElement("blockquote", null, children)],
802
+ ["quote", ({ children }) => /* @__PURE__ */ React18.createElement("blockquote", null, children)],
797
803
  [
798
804
  "code",
799
- ({ children }) => /* @__PURE__ */ React17.createElement("pre", null, /* @__PURE__ */ React17.createElement("code", null, children))
805
+ ({ children }) => /* @__PURE__ */ React18.createElement("pre", null, /* @__PURE__ */ React18.createElement("code", null, children))
800
806
  ],
801
- ["root", ({ children }) => /* @__PURE__ */ React17.createElement(React17.Fragment, null, children)],
807
+ ["root", ({ children }) => /* @__PURE__ */ React18.createElement(React18.Fragment, null, children)],
802
808
  ["text", TextRichTextNode],
803
- ["tab", TabRichTextNode]
809
+ ["tab", TabRichTextNode],
810
+ [
811
+ "table",
812
+ ({ children }) => /* @__PURE__ */ React18.createElement("table", null, /* @__PURE__ */ React18.createElement("tbody", null, children))
813
+ ],
814
+ ["tablerow", ({ children }) => /* @__PURE__ */ React18.createElement("tr", null, children)],
815
+ ["tablecell", TableCellRichTextNode]
804
816
  ]);
805
817
  var resolveRichTextDefaultRenderer = (node) => {
806
818
  return rendererMap.get(node.type);
807
819
  };
808
820
 
809
821
  // src/components/UniformRichText/UniformRichText.tsx
810
- var UniformRichText = React18.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", ...props }, ref) {
811
- const { data: componentData } = useUniformCurrentComponent();
812
- const parameter = useMemo5(() => {
813
- var _a;
814
- return (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
815
- }, [componentData, parameterId]);
816
- const value = useMemo5(() => parameter == null ? void 0 : parameter.value, [parameter]);
817
- if (!value || !isRichTextValue(value) || isRichTextValueConsideredEmpty(value)) return null;
818
- return Tag === null ? /* @__PURE__ */ React18.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ React18.createElement(
822
+ var UniformRichText = React19.forwardRef(function UniformRichText2({ parameterId, resolveRichTextRenderer, as: Tag = "div", placeholder, ...props }, ref) {
823
+ var _a;
824
+ const { data: componentData, contextualEditingDefaultPlaceholder } = useUniformCurrentComponent();
825
+ const { isContextualEditing } = useUniformCurrentComposition();
826
+ const parameter = (_a = componentData == null ? void 0 : componentData.parameters) == null ? void 0 : _a[parameterId];
827
+ if (!parameter) {
828
+ return null;
829
+ }
830
+ const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
831
+ const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
832
+ const value = parameter.value;
833
+ if (!value || !isRichTextValue(value)) return null;
834
+ if (!isContextualEditing && isRichTextValueConsideredEmpty(value)) return null;
835
+ return Tag === null ? /* @__PURE__ */ React19.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer }) : /* @__PURE__ */ React19.createElement(
819
836
  Tag,
820
837
  {
821
838
  ref,
822
839
  ...props,
823
- ...{
840
+ ...isContextualEditing ? {
824
841
  [ATTRIBUTE_COMPONENT_ID]: componentData == null ? void 0 : componentData._id,
825
842
  [ATTRIBUTE_PARAMETER_ID]: parameterId,
826
843
  [ATTRIBUTE_PARAMETER_TYPE]: "richText"
827
- }
844
+ } : {}
828
845
  },
829
- /* @__PURE__ */ React18.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
846
+ isRichTextValueConsideredEmpty(value) ? /* @__PURE__ */ React19.createElement("p", null, /* @__PURE__ */ React19.createElement("i", null, computedPlaceholder)) : /* @__PURE__ */ React19.createElement(UniformRichTextNode, { node: value.root, resolveRichTextRenderer })
830
847
  );
831
848
  });
832
849
 
833
850
  // src/components/UniformText.tsx
834
- import React20, { useState as useState2 } from "react";
851
+ import React21, { useState as useState2 } from "react";
835
852
 
836
853
  // src/components/PureUniformText.tsx
837
- import React19 from "react";
854
+ import React20 from "react";
838
855
  var PureUniformText = ({
839
856
  as: Tag = "span",
840
857
  parameterId,
@@ -853,10 +870,10 @@ var PureUniformText = ({
853
870
  return null;
854
871
  }
855
872
  if (!isContextualEditing) {
856
- return /* @__PURE__ */ React19.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
873
+ return /* @__PURE__ */ React20.createElement(Tag, { style: isMultiline ? { whiteSpace: "pre-wrap" } : {}, ...props }, render(value));
857
874
  }
858
875
  const computedPlaceholder = typeof placeholder === "function" ? placeholder({ id: parameterId }) : placeholder;
859
- return /* @__PURE__ */ React19.createElement(
876
+ return /* @__PURE__ */ React20.createElement(
860
877
  Tag,
861
878
  {
862
879
  ...props,
@@ -894,7 +911,7 @@ var UniformText = ({
894
911
  }
895
912
  const placeholderProp = placeholder != null ? placeholder : contextualEditingDefaultPlaceholder;
896
913
  const computedPlaceholder = typeof placeholderProp === "function" ? placeholderProp({ id: parameterId }) : placeholderProp;
897
- return /* @__PURE__ */ React20.createElement(
914
+ return /* @__PURE__ */ React21.createElement(
898
915
  PureUniformText,
899
916
  {
900
917
  ...props,
@@ -972,7 +989,7 @@ import {
972
989
  createCanvasChannel as createCanvasChannel2,
973
990
  isUpdateContextualEditingStateInternalMessage
974
991
  } from "@uniformdev/canvas";
975
- import { useEffect as useEffect3, useMemo as useMemo6, useState as useState3 } from "react";
992
+ import { useEffect as useEffect3, useMemo as useMemo5, useState as useState3 } from "react";
976
993
  var useUniformContextualEditingState = ({
977
994
  global = false
978
995
  } = {}) => {
@@ -982,7 +999,7 @@ var useUniformContextualEditingState = ({
982
999
  const [previewMode, setPreviewMode] = useState3(
983
1000
  isContextualEditing ? "editor" : void 0
984
1001
  );
985
- const channel = useMemo6(() => {
1002
+ const channel = useMemo5(() => {
986
1003
  if (!isContextualEditing) {
987
1004
  return;
988
1005
  }
@@ -1016,7 +1033,7 @@ var useUniformContextualEditingState = ({
1016
1033
  unsubscribe();
1017
1034
  };
1018
1035
  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference, setPreviewMode]);
1019
- return useMemo6(
1036
+ return useMemo5(
1020
1037
  () => ({
1021
1038
  isContextualEditing,
1022
1039
  selectedComponentReference,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uniformdev/canvas-react",
3
- "version": "19.179.2-alpha.22+79878be48f",
3
+ "version": "19.181.1-alpha.4+63886f3999",
4
4
  "description": "React SDK for Uniform Canvas",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "main": "./dist/index.js",
@@ -45,10 +45,10 @@
45
45
  "document": "api-extractor run --local"
46
46
  },
47
47
  "dependencies": {
48
- "@uniformdev/canvas": "19.179.2-alpha.22+79878be48f",
49
- "@uniformdev/context": "19.179.2-alpha.22+79878be48f",
50
- "@uniformdev/context-react": "19.179.2-alpha.22+79878be48f",
51
- "@uniformdev/richtext": "19.179.2-alpha.22+79878be48f"
48
+ "@uniformdev/canvas": "19.181.1-alpha.4+63886f3999",
49
+ "@uniformdev/context": "19.181.1-alpha.4+63886f3999",
50
+ "@uniformdev/context-react": "19.181.1-alpha.4+63886f3999",
51
+ "@uniformdev/richtext": "19.181.1-alpha.4+63886f3999"
52
52
  },
53
53
  "peerDependencies": {
54
54
  "immer": ">= 10",
@@ -67,5 +67,5 @@
67
67
  "publishConfig": {
68
68
  "access": "public"
69
69
  },
70
- "gitHead": "79878be48f2d4b1c6158026aa632e71c91473ac6"
70
+ "gitHead": "63886f3999fa693ef6b012fdcaefc930e238fc4d"
71
71
  }