@uniformdev/canvas-react 18.35.1-alpha.27 → 18.38.1-alpha.10

package/dist/index.d.ts

@@ -69,11 +69,130 @@ type UniformComponentContextValue = {
 declare function useUniformCurrentComponent(): UniformComponentContextValue;
 /**
  * Allows the rendering of a Canvas component instance (root or not), and its children if it has any.
- * Note that the actual rendering happens inside `<UniformSlot />`, this component only provides the services needed to achieve that.
+ * Note that the actual rendering happens inside `<Slot />`, this component only provides the services needed to achieve that.
  * This component is used internally by `<UniformComposition />`, which you should use in most cases.
  */
 declare function UniformComponent<TRenderProps = unknown>({ data, resolveRenderer, children, behaviorTracking, }: UniformComponentProps<TRenderProps>): JSX.Element | null;
 
+/** @deprecated use `createUniformApiEnhancer` instead */
+declare const createApiEnhancer: ({ apiUrl }: {
+    apiUrl: string;
+}) => (message: UpdateCompositionMessage) => Promise<{
+    type: string;
+    parameters?: {
+        [key: string]: {
+            value: unknown;
+            type: string;
+            connectedData?: {
+                pointer: string;
+                syntax: "jptr";
+            } | undefined;
+        };
+    } | undefined;
+    variant?: string | undefined;
+    projectMapNodes?: {
+        id: string;
+        path: string;
+        projectMapId: string;
+    }[] | undefined;
+    slots?: {
+        [key: string]: {
+            type: string;
+            parameters?: {
+                [key: string]: {
+                    value: unknown;
+                    type: string;
+                    connectedData?: {
+                        pointer: string;
+                        syntax: "jptr";
+                    } | undefined;
+                };
+            } | undefined;
+            variant?: string | undefined;
+            slots?: {
+                [key: string]: any[];
+            } | undefined;
+            _id?: string | undefined;
+            _pattern?: string | undefined;
+            _dataResources?: {
+                [key: string]: {
+                    type: string;
+                    isPatternParameter?: boolean | undefined;
+                    ignorePatternParameterDefault?: boolean | undefined;
+                    variables?: {
+                        [key: string]: string;
+                    } | undefined;
+                };
+            } | undefined;
+            _patternDataResources?: {
+                [key: string]: {
+                    type: string;
+                    isPatternParameter?: boolean | undefined;
+                    ignorePatternParameterDefault?: boolean | undefined;
+                    variables?: {
+                        [key: string]: string;
+                    } | undefined;
+                };
+            } | undefined;
+            _patternError?: "NOTFOUND" | "CYCLIC" | undefined;
+            _overrides?: {
+                [key: string]: {
+                    parameters?: {
+                        [key: string]: {
+                            value: unknown;
+                            type: string;
+                            connectedData?: {
+                                pointer: string;
+                                syntax: "jptr";
+                            } | undefined;
+                        };
+                    } | undefined;
+                    variant?: string | undefined;
+                };
+            } | undefined;
+            _overridability?: {
+                parameters?: {
+                    [key: string]: "yes" | "no";
+                } | undefined;
+                variants?: boolean | undefined;
+            } | undefined;
+        }[];
+    } | undefined;
+    _id: string;
+    _slug?: string | null | undefined;
+    _name: string;
+    _dataResources?: {
+        [key: string]: {
+            type: string;
+            isPatternParameter?: boolean | undefined;
+            ignorePatternParameterDefault?: boolean | undefined;
+            variables?: {
+                [key: string]: string;
+            } | undefined;
+        };
+    } | undefined;
+    _overrides?: {
+        [key: string]: {
+            parameters?: {
+                [key: string]: {
+                    value: unknown;
+                    type: string;
+                    connectedData?: {
+                        pointer: string;
+                        syntax: "jptr";
+                    } | undefined;
+                };
+            } | undefined;
+            variant?: string | undefined;
+        };
+    } | undefined;
+    _overridability?: {
+        parameters?: {
+            [key: string]: "yes" | "no";
+        } | undefined;
+        variants?: boolean | undefined;
+    } | undefined;
+}>;
 type UseUniformContextualEditingProps = {
     initialCompositionValue?: RootComponentInstance;
     /**
@@ -205,6 +324,128 @@ declare const useUniformContextualEditing: ({ initialCompositionValue, enhance,
     } | undefined;
     isContextualEditing: boolean;
 };
+/** @deprecated use useUniformContextualEditing instead */
+declare const useContextualEditing: ({ initialCompositionValue, enhance, }: UseUniformContextualEditingProps) => {
+    composition: {
+        type: string;
+        parameters?: {
+            [key: string]: {
+                value: unknown;
+                type: string;
+                connectedData?: {
+                    pointer: string;
+                    syntax: "jptr";
+                } | undefined;
+            };
+        } | undefined;
+        variant?: string | undefined;
+        projectMapNodes?: {
+            id: string;
+            path: string;
+            projectMapId: string;
+        }[] | undefined;
+        slots?: {
+            [key: string]: {
+                type: string;
+                parameters?: {
+                    [key: string]: {
+                        value: unknown;
+                        type: string;
+                        connectedData?: {
+                            pointer: string;
+                            syntax: "jptr";
+                        } | undefined;
+                    };
+                } | undefined;
+                variant?: string | undefined;
+                slots?: {
+                    [key: string]: any[];
+                } | undefined;
+                _id?: string | undefined;
+                _pattern?: string | undefined;
+                _dataResources?: {
+                    [key: string]: {
+                        type: string;
+                        isPatternParameter?: boolean | undefined;
+                        ignorePatternParameterDefault?: boolean | undefined;
+                        variables?: {
+                            [key: string]: string;
+                        } | undefined;
+                    };
+                } | undefined;
+                _patternDataResources?: {
+                    [key: string]: {
+                        type: string;
+                        isPatternParameter?: boolean | undefined;
+                        ignorePatternParameterDefault?: boolean | undefined;
+                        variables?: {
+                            [key: string]: string;
+                        } | undefined;
+                    };
+                } | undefined;
+                _patternError?: "NOTFOUND" | "CYCLIC" | undefined;
+                _overrides?: {
+                    [key: string]: {
+                        parameters?: {
+                            [key: string]: {
+                                value: unknown;
+                                type: string;
+                                connectedData?: {
+                                    pointer: string;
+                                    syntax: "jptr";
+                                } | undefined;
+                            };
+                        } | undefined;
+                        variant?: string | undefined;
+                    };
+                } | undefined;
+                _overridability?: {
+                    parameters?: {
+                        [key: string]: "yes" | "no";
+                    } | undefined;
+                    variants?: boolean | undefined;
+                } | undefined;
+            }[];
+        } | undefined;
+        _id: string;
+        _slug?: string | null | undefined;
+        _name: string;
+        _dataResources?: {
+            [key: string]: {
+                type: string;
+                isPatternParameter?: boolean | undefined;
+                ignorePatternParameterDefault?: boolean | undefined;
+                variables?: {
+                    [key: string]: string;
+                } | undefined;
+            };
+        } | undefined;
+        _overrides?: {
+            [key: string]: {
+                parameters?: {
+                    [key: string]: {
+                        value: unknown;
+                        type: string;
+                        connectedData?: {
+                            pointer: string;
+                            syntax: "jptr";
+                        } | undefined;
+                    };
+                } | undefined;
+                variant?: string | undefined;
+            };
+        } | undefined;
+        _overridability?: {
+            parameters?: {
+                [key: string]: "yes" | "no";
+            } | undefined;
+            variants?: boolean | undefined;
+        } | undefined;
+    } | undefined;
+    isContextualEditing: boolean;
+};
+/** @deprecated use UseUniformContextualEditingProps instead */
+type UseContextualEditingProps = UseUniformContextualEditingProps;
 
 type UniformCompositionProps<TRenderProps = unknown> = UniformComponentProps<TRenderProps> & {
     /** The composition data */
@@ -227,6 +468,12 @@ declare function useUniformCurrentComposition(): UniformCompositionContextValue;
  * It also takes care of enabling [Contextual Editing](https://docs.uniform.app/capabilities/composition/contextual-editing).
  */
 declare function UniformComposition<TRenderProps = unknown>({ data, behaviorTracking, children, resolveRenderer, contextualEditingEnhancer, }: UniformCompositionProps<TRenderProps>): JSX.Element;
+/** @deprecated use `useUniformCurrentComposition` instead */
+declare const useComposition: typeof useUniformCurrentComposition;
+/** @deprecated use `UniformComposition` instead */
+declare const Composition: typeof UniformComposition;
+/** @deprecated use `UniformCompositionProps` instead */
+type CompositionProps<TRenderProps = unknown> = UniformCompositionProps<TRenderProps>;
 
 type CustomSlotChildRenderFunc = (options: {
     child: ReactNode;
@@ -252,6 +499,10 @@ type UniformSlotProps<TSlotNames extends string> = {
 };
 /** Renders a named Slot within a Composition. */
 declare function UniformSlot<TSlotNames extends string = string>({ name, resolveRenderer, children, emptyPlaceholder, }: UniformSlotProps<TSlotNames>): JSX.Element | null;
+/** @deprecated use `UniformSlotProps` instead */
+type SlotProps<TSlotNames extends string> = UniformSlotProps<TSlotNames>;
+/** @deprecated use `UniformSlot` instead */
+declare const Slot: typeof UniformSlot;
 
 type UseCompositionEventEffectOptions = Omit<Partial<SubscribeToCompositionOptions>, 'callback'> & {
     enabled: boolean;
@@ -276,4 +527,4 @@ declare const createComponentStoreResolver: (options: {
     defaultComponent?: React$1.ComponentType<ComponentProps<any>>;
 }) => RenderComponentResolver;
 
-export { ComponentProps, ComponentStore, DefaultNotImplementedComponent, NOT_IMPLEMENTED_COMPONENT, RenderComponentResolver, SystemRenderConfig, SystemRenderFunction, UniformComponent, UniformComponentContextValue, UniformComponentProps, UniformComposition, UniformCompositionProps, UniformSlot, UniformSlotProps, UseCompositionEventEffectOptions, UseUniformContextualEditingProps, componentStore, componentStoreResolver, createComponentStore, createComponentStoreResolver, registerUniformComponent, useCompositionEventEffect, useUniformContextualEditing, useUniformCurrentComponent, useUniformCurrentComposition };
+export { ComponentProps, ComponentStore, Composition, CompositionProps, DefaultNotImplementedComponent, NOT_IMPLEMENTED_COMPONENT, RenderComponentResolver, Slot, SlotProps, SystemRenderConfig, SystemRenderFunction, UniformComponent, UniformComponentContextValue, UniformComponentProps, UniformComposition, UniformCompositionProps, UniformSlot, UniformSlotProps, UseCompositionEventEffectOptions, UseContextualEditingProps, UseUniformContextualEditingProps, componentStore, componentStoreResolver, createApiEnhancer, createComponentStore, createComponentStoreResolver, registerUniformComponent, useComposition, useCompositionEventEffect, useContextualEditing, useUniformContextualEditing, useUniformCurrentComponent, useUniformCurrentComposition };

package/dist/index.esm.js

@@ -165,6 +165,7 @@ import {
   isUpdateCompositionMessage
 } from "@uniformdev/canvas";
 import { useEffect, useMemo, useState } from "react";
+var createApiEnhancer = createUniformApiEnhancer;
 var registeredCompositionIds = /* @__PURE__ */ new Set();
 var useUniformContextualEditing = ({
   initialCompositionValue,
@@ -243,6 +244,7 @@ function isInContextEditingMode() {
   );
   return isOpenedByInContextEditor && isAllowlistedReferrer;
 }
+var useContextualEditing = useUniformContextualEditing;
 
 // src/components/UniformComposition.tsx
 var UniformCompositionContext = createContext({
@@ -279,6 +281,8 @@ function UniformComposition({
     ))
   );
 }
+var useComposition = useUniformCurrentComposition;
+var Composition = UniformComposition;
 
 // src/components/ContextualEditingComponentWrapper.tsx
 function ContextualEditingComponentWrapper({
@@ -293,7 +297,7 @@ function ContextualEditingComponentWrapper({
   var _a, _b, _c, _d;
   const isPlaceholder = (component == null ? void 0 : component._id) === PLACEHOLDER_ID;
   const { isContextualEditing } = useUniformCurrentComposition();
-  return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
+  return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : isPlaceholder && emptyPlaceholder === null ? null : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
     "script",
     {
       "data-role": IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,
@@ -427,6 +431,7 @@ function renderComponent({
   }
   return null;
 }
+var Slot = UniformSlot;
 
 // src/components/UniformComponent.tsx
 var UniformComponentContext = createContext2({});
@@ -480,7 +485,7 @@ function resolveChildren({
     } else {
       if (Object.keys((_a = data.slots) != null ? _a : {}).length > 1 && process.env.NODE_ENV === "development") {
         console.warn(
-          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<UniformSlot name={slotName} />' to reliably render the slots.`
+          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<Slot name={slotName} />' to reliably render the slots.`
         );
       }
       children = Object.keys(data.slots || {}).map((slotName) => /* @__PURE__ */ React6.createElement(UniformSlot, { key: slotName, name: slotName }));
@@ -530,18 +535,23 @@ function useCompositionEventEffect({
   }, [compositionId, enabled, projectId, effect]);
 }
 export {
+  Composition,
   DefaultNotImplementedComponent,
   NOT_IMPLEMENTED_COMPONENT,
+  Slot,
   UniformComponent,
   UniformComposition,
   UniformSlot,
   componentStore,
   componentStoreResolver,
+  createApiEnhancer,
   createComponentStore,
   createComponentStoreResolver,
   createUniformApiEnhancer,
   registerUniformComponent,
+  useComposition,
   useCompositionEventEffect,
+  useContextualEditing,
   useUniformContextualEditing,
   useUniformCurrentComponent,
   useUniformCurrentComposition

package/dist/index.js

@@ -30,18 +30,23 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  Composition: () => Composition,
   DefaultNotImplementedComponent: () => DefaultNotImplementedComponent,
   NOT_IMPLEMENTED_COMPONENT: () => NOT_IMPLEMENTED_COMPONENT,
+  Slot: () => Slot,
   UniformComponent: () => UniformComponent,
   UniformComposition: () => UniformComposition,
   UniformSlot: () => UniformSlot,
   componentStore: () => componentStore,
   componentStoreResolver: () => componentStoreResolver,
+  createApiEnhancer: () => createApiEnhancer,
   createComponentStore: () => createComponentStore,
   createComponentStoreResolver: () => createComponentStoreResolver,
   createUniformApiEnhancer: () => import_canvas3.createUniformApiEnhancer,
   registerUniformComponent: () => registerUniformComponent,
+  useComposition: () => useComposition,
   useCompositionEventEffect: () => useCompositionEventEffect,
+  useContextualEditing: () => useContextualEditing,
   useUniformContextualEditing: () => useUniformContextualEditing,
   useUniformCurrentComponent: () => useUniformCurrentComponent,
   useUniformCurrentComposition: () => useUniformCurrentComposition
@@ -193,6 +198,7 @@ var import_react3 = __toESM(require("react"));
 // src/hooks/useUniformContextualEditing.ts
 var import_canvas3 = require("@uniformdev/canvas");
 var import_react2 = require("react");
+var createApiEnhancer = import_canvas3.createUniformApiEnhancer;
 var registeredCompositionIds = /* @__PURE__ */ new Set();
 var useUniformContextualEditing = ({
   initialCompositionValue,
@@ -271,6 +277,7 @@ function isInContextEditingMode() {
   );
   return isOpenedByInContextEditor && isAllowlistedReferrer;
 }
+var useContextualEditing = useUniformContextualEditing;
 
 // src/components/UniformComposition.tsx
 var UniformCompositionContext = (0, import_react3.createContext)({
@@ -307,6 +314,8 @@ function UniformComposition({
     ))
   );
 }
+var useComposition = useUniformCurrentComposition;
+var Composition = UniformComposition;
 
 // src/components/ContextualEditingComponentWrapper.tsx
 function ContextualEditingComponentWrapper({
@@ -321,7 +330,7 @@ function ContextualEditingComponentWrapper({
   var _a, _b, _c, _d;
   const isPlaceholder = (component == null ? void 0 : component._id) === import_canvas4.PLACEHOLDER_ID;
   const { isContextualEditing } = useUniformCurrentComposition();
-  return !isContextualEditing ? /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, children) : /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(
+  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(
     "script",
     {
       "data-role": import_canvas4.IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,
@@ -455,6 +464,7 @@ function renderComponent({
   }
   return null;
 }
+var Slot = UniformSlot;
 
 // src/components/UniformComponent.tsx
 var UniformComponentContext = (0, import_react6.createContext)({});
@@ -508,7 +518,7 @@ function resolveChildren({
     } else {
       if (Object.keys((_a = data.slots) != null ? _a : {}).length > 1 && process.env.NODE_ENV === "development") {
         console.warn(
-          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<UniformSlot name={slotName} />' to reliably render the slots.`
+          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<Slot name={slotName} />' to reliably render the slots.`
         );
       }
       children = Object.keys(data.slots || {}).map((slotName) => /* @__PURE__ */ import_react6.default.createElement(UniformSlot, { key: slotName, name: slotName }));
@@ -555,18 +565,23 @@ function useCompositionEventEffect({
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Composition,
   DefaultNotImplementedComponent,
   NOT_IMPLEMENTED_COMPONENT,
+  Slot,
   UniformComponent,
   UniformComposition,
   UniformSlot,
   componentStore,
   componentStoreResolver,
+  createApiEnhancer,
   createComponentStore,
   createComponentStoreResolver,
   createUniformApiEnhancer,
   registerUniformComponent,
+  useComposition,
   useCompositionEventEffect,
+  useContextualEditing,
   useUniformContextualEditing,
   useUniformCurrentComponent,
   useUniformCurrentComposition

package/dist/index.mjs

@@ -165,6 +165,7 @@ import {
   isUpdateCompositionMessage
 } from "@uniformdev/canvas";
 import { useEffect, useMemo, useState } from "react";
+var createApiEnhancer = createUniformApiEnhancer;
 var registeredCompositionIds = /* @__PURE__ */ new Set();
 var useUniformContextualEditing = ({
   initialCompositionValue,
@@ -243,6 +244,7 @@ function isInContextEditingMode() {
   );
   return isOpenedByInContextEditor && isAllowlistedReferrer;
 }
+var useContextualEditing = useUniformContextualEditing;
 
 // src/components/UniformComposition.tsx
 var UniformCompositionContext = createContext({
@@ -279,6 +281,8 @@ function UniformComposition({
     ))
   );
 }
+var useComposition = useUniformCurrentComposition;
+var Composition = UniformComposition;
 
 // src/components/ContextualEditingComponentWrapper.tsx
 function ContextualEditingComponentWrapper({
@@ -293,7 +297,7 @@ function ContextualEditingComponentWrapper({
   var _a, _b, _c, _d;
   const isPlaceholder = (component == null ? void 0 : component._id) === PLACEHOLDER_ID;
   const { isContextualEditing } = useUniformCurrentComposition();
-  return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
+  return !isContextualEditing ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, children) : isPlaceholder && emptyPlaceholder === null ? null : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
     "script",
     {
       "data-role": IN_CONTEXT_EDITOR_COMPONENT_START_ROLE,
@@ -427,6 +431,7 @@ function renderComponent({
   }
   return null;
 }
+var Slot = UniformSlot;
 
 // src/components/UniformComponent.tsx
 var UniformComponentContext = createContext2({});
@@ -480,7 +485,7 @@ function resolveChildren({
     } else {
       if (Object.keys((_a = data.slots) != null ? _a : {}).length > 1 && process.env.NODE_ENV === "development") {
         console.warn(
-          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<UniformSlot name={slotName} />' to reliably render the slots.`
+          `[canvas-dev] All the slots in component '${data.type}' are rendered in no particular order. Use '<Slot name={slotName} />' to reliably render the slots.`
         );
       }
       children = Object.keys(data.slots || {}).map((slotName) => /* @__PURE__ */ React6.createElement(UniformSlot, { key: slotName, name: slotName }));
@@ -530,18 +535,23 @@ function useCompositionEventEffect({
   }, [compositionId, enabled, projectId, effect]);
 }
 export {
+  Composition,
   DefaultNotImplementedComponent,
   NOT_IMPLEMENTED_COMPONENT,
+  Slot,
   UniformComponent,
   UniformComposition,
   UniformSlot,
   componentStore,
   componentStoreResolver,
+  createApiEnhancer,
   createComponentStore,
   createComponentStoreResolver,
   createUniformApiEnhancer,
   registerUniformComponent,
+  useComposition,
   useCompositionEventEffect,
+  useContextualEditing,
   useUniformContextualEditing,
   useUniformCurrentComponent,
   useUniformCurrentComposition

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/canvas-react",
-  "version": "18.35.1-alpha.27+183715405",
+  "version": "18.38.1-alpha.10+13f006c1d",
   "description": "React SDK for Uniform Canvas",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -24,16 +24,16 @@
     "document": "api-extractor run --local"
   },
   "dependencies": {
-    "@uniformdev/canvas": "18.35.1-alpha.27+183715405",
-    "@uniformdev/context": "18.35.1-alpha.27+183715405",
-    "@uniformdev/context-react": "18.35.1-alpha.27+183715405"
+    "@uniformdev/canvas": "18.38.1-alpha.10+13f006c1d",
+    "@uniformdev/context": "18.38.1-alpha.10+13f006c1d",
+    "@uniformdev/context-react": "18.38.1-alpha.10+13f006c1d"
   },
   "peerDependencies": {
     "react": ">= 16 || 17 || 18",
     "react-dom": ">=16"
   },
   "devDependencies": {
-    "@types/react": "18.0.33",
+    "@types/react": "18.0.35",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   },
@@ -43,5 +43,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "18371540510874773bba7b3e0fbb0c6427cb8e07"
+  "gitHead": "13f006c1d5ebbe593d33f3446a8de84b4a2d42d1"
 }