@uniformdev/canvas-react 19.51.1-alpha.1 → 19.51.1-alpha.22

package/dist/index.d.mts

@@ -1,5 +1,4 @@
 import React$1, { Key, ReactNode, PropsWithChildren } from 'react';
-import * as _uniformdev_canvas from '@uniformdev/canvas';
 import { ComponentInstance, RootComponentInstance, UpdateCompositionMessage, getParameterAttributes as getParameterAttributes$1, SubscribeToCompositionOptions } from '@uniformdev/canvas';
 export { GetParameterAttributesProps, createUniformApiEnhancer } from '@uniformdev/canvas';
 import { PureUniformTextProps } from './core.mjs';
@@ -243,8 +242,10 @@ declare function useUniformCurrentComposition(): UniformCompositionContextValue;
  */
 declare function UniformComposition<TRenderProps = unknown>({ data, behaviorTracking, children, resolveRenderer, contextualEditingEnhancer, contextualEditingDefaultPlaceholder, }: UniformCompositionProps<TRenderProps>): React$1.JSX.Element;
 
-type UniformPlaygroundDecorator = (options: {
+type UniformPlaygroundDecorator = (props: {
+    /** The rendered component instance, needs to wrapped and rendered by the decorator */
     children: React$1.ReactNode;
+    /** The component instance data */
     data: ComponentInstance | RootComponentInstance;
 }) => React$1.ReactElement;
 type UniformPlaygroundProps = {
@@ -378,7 +379,18 @@ type UseUniformContextualEditingStateProps = {
  */
 declare const useUniformContextualEditingState: ({ global, }?: UseUniformContextualEditingStateProps) => {
     isContextualEditing: boolean;
-    selectedComponentReference: Omit<_uniformdev_canvas.ContextualEditingComponentReference, "elements"> | undefined;
+    selectedComponentReference: {
+        id: string;
+        slotName?: string | undefined;
+        componentIndex?: number | undefined;
+        totalComponents?: number | undefined;
+        componentName?: string | undefined;
+        componentTitle?: string | undefined;
+        parentId?: string | undefined;
+        parentType?: string | undefined;
+        isLocalized?: boolean | undefined;
+        isReadOnly?: boolean | undefined;
+    } | undefined;
 };
 
 declare const componentStore: ComponentStore;

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 import React$1, { Key, ReactNode, PropsWithChildren } from 'react';
-import * as _uniformdev_canvas from '@uniformdev/canvas';
 import { ComponentInstance, RootComponentInstance, UpdateCompositionMessage, getParameterAttributes as getParameterAttributes$1, SubscribeToCompositionOptions } from '@uniformdev/canvas';
 export { GetParameterAttributesProps, createUniformApiEnhancer } from '@uniformdev/canvas';
 import { PureUniformTextProps } from './core.js';
@@ -243,8 +242,10 @@ declare function useUniformCurrentComposition(): UniformCompositionContextValue;
  */
 declare function UniformComposition<TRenderProps = unknown>({ data, behaviorTracking, children, resolveRenderer, contextualEditingEnhancer, contextualEditingDefaultPlaceholder, }: UniformCompositionProps<TRenderProps>): React$1.JSX.Element;
 
-type UniformPlaygroundDecorator = (options: {
+type UniformPlaygroundDecorator = (props: {
+    /** The rendered component instance, needs to wrapped and rendered by the decorator */
     children: React$1.ReactNode;
+    /** The component instance data */
     data: ComponentInstance | RootComponentInstance;
 }) => React$1.ReactElement;
 type UniformPlaygroundProps = {
@@ -378,7 +379,18 @@ type UseUniformContextualEditingStateProps = {
  */
 declare const useUniformContextualEditingState: ({ global, }?: UseUniformContextualEditingStateProps) => {
     isContextualEditing: boolean;
-    selectedComponentReference: Omit<_uniformdev_canvas.ContextualEditingComponentReference, "elements"> | undefined;
+    selectedComponentReference: {
+        id: string;
+        slotName?: string | undefined;
+        componentIndex?: number | undefined;
+        totalComponents?: number | undefined;
+        componentName?: string | undefined;
+        componentTitle?: string | undefined;
+        parentId?: string | undefined;
+        parentType?: string | undefined;
+        isLocalized?: boolean | undefined;
+        isReadOnly?: boolean | undefined;
+    } | undefined;
 };
 
 declare const componentStore: ComponentStore;

package/dist/index.esm.js

@@ -186,7 +186,7 @@ import {
   CANVAS_LOCALE_TAG_PARAM,
   IN_CONTEXT_EDITOR_COMPONENT_END_ROLE,
   IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,
-  PLACEHOLDER_ID
+  isComponentPlaceholderId
 } from "@uniformdev/canvas";
 import React4 from "react";
 
@@ -200,6 +200,7 @@ import {
   EMPTY_COMPOSITION,
   IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID,
   IN_CONTEXT_EDITOR_QUERY_STRING_PARAM,
+  isAllowedReferrer,
   isUpdateCompositionInternalMessage
 } from "@uniformdev/canvas";
 import { useEffect, useMemo, useState } from "react";
@@ -276,10 +277,7 @@ function isInContextEditingMode() {
   const isOpenedByInContextEditor = new URLSearchParams(window.location.search).has(
     IN_CONTEXT_EDITOR_QUERY_STRING_PARAM
   );
-  const isAllowlistedReferrer = Boolean(
-    window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//)
-  );
-  return isOpenedByInContextEditor && isAllowlistedReferrer;
+  return isOpenedByInContextEditor && isAllowedReferrer(window.document.referrer);
 }
 
 // src/components/UniformComposition.tsx
@@ -331,7 +329,7 @@ function ContextualEditingComponentWrapper({
   children
 }) {
   var _a, _b, _c, _d, _e;
-  const isPlaceholder = (component == null ? void 0 : component._id) === PLACEHOLDER_ID;
+  const isPlaceholder = isComponentPlaceholderId(component == null ? void 0 : component._id);
   const { isContextualEditing } = useUniformCurrentComposition();
   const isReadOnly = ((_a = component == null ? void 0 : component._contextualEditing) == null ? void 0 : _a.isEditable) ? void 0 : "true";
   return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : isPlaceholder && emptyPlaceholder === null ? null : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
@@ -577,7 +575,7 @@ var UniformPlayground = ({
     if (!composition) {
       return null;
     }
-    let component = /* @__PURE__ */ React7.createElement(
+    let component = /* @__PURE__ */ React7.createElement(ContextualEditingComponentWrapper, { component: composition }, /* @__PURE__ */ React7.createElement(
       UniformComponent,
       {
         data: composition,
@@ -586,7 +584,7 @@ var UniformPlayground = ({
         contextualEditingDefaultPlaceholder
       },
       children
-    );
+    ));
     decorators.forEach((Decorator) => {
       component = /* @__PURE__ */ React7.createElement(Decorator, { data: composition }, component);
     });
@@ -604,7 +602,7 @@ var UniformPlayground = ({
     {
       value: { data: composition, behaviorTracking, resolveRenderer, isContextualEditing }
     },
-    /* @__PURE__ */ React7.createElement(ContextualEditingComponentWrapper, { component: composition }, renderedComponent)
+    renderedComponent
   );
 };
 
@@ -928,11 +926,14 @@ var useUniformContextualEditingState = ({
     return () => {
       unsubscribe();
     };
-  }, [global, channel, componentData == null ? void 0 : componentData._id]);
-  return {
-    isContextualEditing,
-    selectedComponentReference
-  };
+  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference]);
+  return useMemo4(
+    () => ({
+      isContextualEditing,
+      selectedComponentReference
+    }),
+    [isContextualEditing, selectedComponentReference]
+  );
 };
 export {
   DefaultNotImplementedComponent,

package/dist/index.js

@@ -310,10 +310,7 @@ function isInContextEditingMode() {
   const isOpenedByInContextEditor = new URLSearchParams(window.location.search).has(
     import_canvas3.IN_CONTEXT_EDITOR_QUERY_STRING_PARAM
   );
-  const isAllowlistedReferrer = Boolean(
-    window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//)
-  );
-  return isOpenedByInContextEditor && isAllowlistedReferrer;
+  return isOpenedByInContextEditor && (0, import_canvas3.isAllowedReferrer)(window.document.referrer);
 }
 
 // src/components/UniformComposition.tsx
@@ -365,7 +362,7 @@ function ContextualEditingComponentWrapper({
   children
 }) {
   var _a, _b, _c, _d, _e;
-  const isPlaceholder = (component == null ? void 0 : component._id) === import_canvas4.PLACEHOLDER_ID;
+  const isPlaceholder = (0, import_canvas4.isComponentPlaceholderId)(component == null ? void 0 : component._id);
   const { isContextualEditing } = useUniformCurrentComposition();
   const isReadOnly = ((_a = component == null ? void 0 : component._contextualEditing) == null ? void 0 : _a.isEditable) ? void 0 : "true";
   return !isContextualEditing ? /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, children) : isPlaceholder && emptyPlaceholder === null ? null : /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(
@@ -611,7 +608,7 @@ var UniformPlayground = ({
     if (!composition) {
       return null;
     }
-    let component = /* @__PURE__ */ import_react7.default.createElement(
+    let component = /* @__PURE__ */ import_react7.default.createElement(ContextualEditingComponentWrapper, { component: composition }, /* @__PURE__ */ import_react7.default.createElement(
       UniformComponent,
       {
         data: composition,
@@ -620,7 +617,7 @@ var UniformPlayground = ({
         contextualEditingDefaultPlaceholder
       },
       children
-    );
+    ));
     decorators.forEach((Decorator) => {
       component = /* @__PURE__ */ import_react7.default.createElement(Decorator, { data: composition }, component);
     });
@@ -638,7 +635,7 @@ var UniformPlayground = ({
     {
       value: { data: composition, behaviorTracking, resolveRenderer, isContextualEditing }
     },
-    /* @__PURE__ */ import_react7.default.createElement(ContextualEditingComponentWrapper, { component: composition }, renderedComponent)
+    renderedComponent
   );
 };
 
@@ -946,11 +943,14 @@ var useUniformContextualEditingState = ({
     return () => {
       unsubscribe();
     };
-  }, [global, channel, componentData == null ? void 0 : componentData._id]);
-  return {
-    isContextualEditing,
-    selectedComponentReference
-  };
+  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference]);
+  return (0, import_react21.useMemo)(
+    () => ({
+      isContextualEditing,
+      selectedComponentReference
+    }),
+    [isContextualEditing, selectedComponentReference]
+  );
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -186,7 +186,7 @@ import {
   CANVAS_LOCALE_TAG_PARAM,
   IN_CONTEXT_EDITOR_COMPONENT_END_ROLE,
   IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,
-  PLACEHOLDER_ID
+  isComponentPlaceholderId
 } from "@uniformdev/canvas";
 import React4 from "react";
 
@@ -200,6 +200,7 @@ import {
   EMPTY_COMPOSITION,
   IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID,
   IN_CONTEXT_EDITOR_QUERY_STRING_PARAM,
+  isAllowedReferrer,
   isUpdateCompositionInternalMessage
 } from "@uniformdev/canvas";
 import { useEffect, useMemo, useState } from "react";
@@ -276,10 +277,7 @@ function isInContextEditingMode() {
   const isOpenedByInContextEditor = new URLSearchParams(window.location.search).has(
     IN_CONTEXT_EDITOR_QUERY_STRING_PARAM
   );
-  const isAllowlistedReferrer = Boolean(
-    window.document.referrer.match(/(^https:\/\/|\.)(uniform.app|uniform.wtf|localhost:\d{4})\//)
-  );
-  return isOpenedByInContextEditor && isAllowlistedReferrer;
+  return isOpenedByInContextEditor && isAllowedReferrer(window.document.referrer);
 }
 
 // src/components/UniformComposition.tsx
@@ -331,7 +329,7 @@ function ContextualEditingComponentWrapper({
   children
 }) {
   var _a, _b, _c, _d, _e;
-  const isPlaceholder = (component == null ? void 0 : component._id) === PLACEHOLDER_ID;
+  const isPlaceholder = isComponentPlaceholderId(component == null ? void 0 : component._id);
   const { isContextualEditing } = useUniformCurrentComposition();
   const isReadOnly = ((_a = component == null ? void 0 : component._contextualEditing) == null ? void 0 : _a.isEditable) ? void 0 : "true";
   return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : isPlaceholder && emptyPlaceholder === null ? null : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
@@ -577,7 +575,7 @@ var UniformPlayground = ({
     if (!composition) {
       return null;
     }
-    let component = /* @__PURE__ */ React7.createElement(
+    let component = /* @__PURE__ */ React7.createElement(ContextualEditingComponentWrapper, { component: composition }, /* @__PURE__ */ React7.createElement(
       UniformComponent,
       {
         data: composition,
@@ -586,7 +584,7 @@ var UniformPlayground = ({
         contextualEditingDefaultPlaceholder
       },
       children
-    );
+    ));
     decorators.forEach((Decorator) => {
       component = /* @__PURE__ */ React7.createElement(Decorator, { data: composition }, component);
     });
@@ -604,7 +602,7 @@ var UniformPlayground = ({
     {
       value: { data: composition, behaviorTracking, resolveRenderer, isContextualEditing }
     },
-    /* @__PURE__ */ React7.createElement(ContextualEditingComponentWrapper, { component: composition }, renderedComponent)
+    renderedComponent
   );
 };
 
@@ -928,11 +926,14 @@ var useUniformContextualEditingState = ({
     return () => {
       unsubscribe();
     };
-  }, [global, channel, componentData == null ? void 0 : componentData._id]);
-  return {
-    isContextualEditing,
-    selectedComponentReference
-  };
+  }, [global, channel, componentData == null ? void 0 : componentData._id, setSelectedComponentReference]);
+  return useMemo4(
+    () => ({
+      isContextualEditing,
+      selectedComponentReference
+    }),
+    [isContextualEditing, selectedComponentReference]
+  );
 };
 export {
   DefaultNotImplementedComponent,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/canvas-react",
-  "version": "19.51.1-alpha.1+e55ae6c1e",
+  "version": "19.51.1-alpha.22+ee274f045",
   "description": "React SDK for Uniform Canvas",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -45,10 +45,10 @@
     "document": "api-extractor run --local"
   },
   "dependencies": {
-    "@uniformdev/canvas": "19.51.1-alpha.1+e55ae6c1e",
-    "@uniformdev/context": "19.51.1-alpha.1+e55ae6c1e",
-    "@uniformdev/context-react": "19.51.1-alpha.1+e55ae6c1e",
-    "@uniformdev/richtext": "19.51.1-alpha.1+e55ae6c1e"
+    "@uniformdev/canvas": "19.51.1-alpha.22+ee274f045",
+    "@uniformdev/context": "19.51.1-alpha.22+ee274f045",
+    "@uniformdev/context-react": "19.51.1-alpha.22+ee274f045",
+    "@uniformdev/richtext": "19.51.1-alpha.22+ee274f045"
   },
   "peerDependencies": {
     "react": ">= 16 || 17 || 18",
@@ -65,5 +65,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "e55ae6c1ea8df19f04a9dba22769d76e16d28d70"
+  "gitHead": "ee274f04521c4024826b21fee01d50fcc1e414a1"
 }