@uniformdev/canvas-next-rsc-client 19.202.0 → 19.204.0

package/dist/index.d.mts

@@ -6,7 +6,7 @@ import * as react from 'react';
 import { PropsWithChildren } from 'react';
 import * as _uniformdev_canvas_next_rsc_shared from '@uniformdev/canvas-next-rsc-shared';
 import { AppDirectoryContextState, PersonalizeProps, ComponentProps, TestProps, CreateUniformContextOptions, AppDirectoryContext } from '@uniformdev/canvas-next-rsc-shared';
-import { VisibilityParameterValue } from '@uniformdev/canvas';
+import { VisibilityParameterValue, ComponentInstance, UpdateContextualEditingStateInternalMessage } from '@uniformdev/canvas';
 
 type ClientContextComponentProps = {
     /**
@@ -91,4 +91,22 @@ declare const useUniformContext: () => {
     context: AppDirectoryContext | undefined;
 };
 
-export { type ClientContextComponent, type ClientContextComponentProps, ClientContextPersonalizationTransfer, ClientContextTestTransfer, ClientContextUpdate, ClientContextualEditingComponentWrapper, ContextUpdateTransferClient, type CreateClientUniformContextOptions, DefaultUniformClientContext, PersonalizeClient, type PersonalizeClientProps, TestClient, UniformScript, VisibilityRulesWrapperClient, createClientUniformContext, useInitUniformContext, useQuirks, useScores, useUniformContext };
+type UseUniformContextualEditingStateProps = {
+    /**
+     * When not set, the hook will return the global contextual state no matter where its used.
+     * When set, it will return only the state relevant to the component passed.
+     * @default undefined
+     **/
+    scope?: ComponentInstance;
+};
+type UseUniformContextualEditingStateReturnType = {
+    /**
+     * A reference to the currently selected component in Canvas editor.
+     * Returns `undefined` if the selected component is not part of the current React component.
+     * Set the `scope` option a component instance to limit the scope of selected compponents.
+     */
+    selectedComponentReference: UpdateContextualEditingStateInternalMessage['state']['selectedComponentReference'];
+};
+declare const useUniformContextualEditingState: ({ scope, }?: UseUniformContextualEditingStateProps) => UseUniformContextualEditingStateReturnType;
+
+export { type ClientContextComponent, type ClientContextComponentProps, ClientContextPersonalizationTransfer, ClientContextTestTransfer, ClientContextUpdate, ClientContextualEditingComponentWrapper, ContextUpdateTransferClient, type CreateClientUniformContextOptions, DefaultUniformClientContext, PersonalizeClient, type PersonalizeClientProps, TestClient, UniformScript, type UseUniformContextualEditingStateProps, type UseUniformContextualEditingStateReturnType, VisibilityRulesWrapperClient, createClientUniformContext, useInitUniformContext, useQuirks, useScores, useUniformContext, useUniformContextualEditingState };

package/dist/index.d.ts

@@ -6,7 +6,7 @@ import * as react from 'react';
 import { PropsWithChildren } from 'react';
 import * as _uniformdev_canvas_next_rsc_shared from '@uniformdev/canvas-next-rsc-shared';
 import { AppDirectoryContextState, PersonalizeProps, ComponentProps, TestProps, CreateUniformContextOptions, AppDirectoryContext } from '@uniformdev/canvas-next-rsc-shared';
-import { VisibilityParameterValue } from '@uniformdev/canvas';
+import { VisibilityParameterValue, ComponentInstance, UpdateContextualEditingStateInternalMessage } from '@uniformdev/canvas';
 
 type ClientContextComponentProps = {
     /**
@@ -91,4 +91,22 @@ declare const useUniformContext: () => {
     context: AppDirectoryContext | undefined;
 };
 
-export { type ClientContextComponent, type ClientContextComponentProps, ClientContextPersonalizationTransfer, ClientContextTestTransfer, ClientContextUpdate, ClientContextualEditingComponentWrapper, ContextUpdateTransferClient, type CreateClientUniformContextOptions, DefaultUniformClientContext, PersonalizeClient, type PersonalizeClientProps, TestClient, UniformScript, VisibilityRulesWrapperClient, createClientUniformContext, useInitUniformContext, useQuirks, useScores, useUniformContext };
+type UseUniformContextualEditingStateProps = {
+    /**
+     * When not set, the hook will return the global contextual state no matter where its used.
+     * When set, it will return only the state relevant to the component passed.
+     * @default undefined
+     **/
+    scope?: ComponentInstance;
+};
+type UseUniformContextualEditingStateReturnType = {
+    /**
+     * A reference to the currently selected component in Canvas editor.
+     * Returns `undefined` if the selected component is not part of the current React component.
+     * Set the `scope` option a component instance to limit the scope of selected compponents.
+     */
+    selectedComponentReference: UpdateContextualEditingStateInternalMessage['state']['selectedComponentReference'];
+};
+declare const useUniformContextualEditingState: ({ scope, }?: UseUniformContextualEditingStateProps) => UseUniformContextualEditingStateReturnType;
+
+export { type ClientContextComponent, type ClientContextComponentProps, ClientContextPersonalizationTransfer, ClientContextTestTransfer, ClientContextUpdate, ClientContextualEditingComponentWrapper, ContextUpdateTransferClient, type CreateClientUniformContextOptions, DefaultUniformClientContext, PersonalizeClient, type PersonalizeClientProps, TestClient, UniformScript, type UseUniformContextualEditingStateProps, type UseUniformContextualEditingStateReturnType, VisibilityRulesWrapperClient, createClientUniformContext, useInitUniformContext, useQuirks, useScores, useUniformContext, useUniformContextualEditingState };

package/dist/index.esm.js

@@ -1137,6 +1137,47 @@ function useScores() {
   }, [context]);
   return scores;
 }
+
+// src/hooks/useUniformContextualEditingState.ts
+import {
+  createCanvasChannel as createCanvasChannel2,
+  isUpdateContextualEditingStateInternalMessage
+} from "@uniformdev/canvas";
+import { useEffect as useEffect12, useMemo as useMemo4, useState as useState10 } from "react";
+var useUniformContextualEditingState = ({
+  scope
+} = {}) => {
+  const [selectedComponentReference, setSelectedComponentReference] = useState10();
+  const channel = useMemo4(() => {
+    const channel2 = createCanvasChannel2({
+      broadcastTo: [window],
+      listenTo: [window]
+    });
+    return channel2;
+  }, []);
+  useEffect12(() => {
+    if (!channel) {
+      return;
+    }
+    const unsubscribe = channel.on("update-contextual-editing-state-internal", async (message) => {
+      var _a;
+      if (!isUpdateContextualEditingStateInternalMessage(message)) {
+        return;
+      }
+      if (!!scope && (scope == null ? void 0 : scope._id) !== ((_a = message.state.selectedComponentReference) == null ? void 0 : _a.parentId)) {
+        setSelectedComponentReference(void 0);
+        return;
+      }
+      setSelectedComponentReference(message.state.selectedComponentReference);
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, [scope, channel]);
+  return {
+    selectedComponentReference
+  };
+};
 export {
   ClientContextPersonalizationTransfer,
   ClientContextTestTransfer,
@@ -1152,7 +1193,8 @@ export {
   useInitUniformContext,
   useQuirks,
   useScores,
-  useUniformContext
+  useUniformContext,
+  useUniformContextualEditingState
 };
 /*! Bundled license information:
 

package/dist/index.js

@@ -237,7 +237,8 @@ __export(src_exports, {
   useInitUniformContext: () => useInitUniformContext,
   useQuirks: () => useQuirks,
   useScores: () => useScores,
-  useUniformContext: () => useUniformContext
+  useUniformContext: () => useUniformContext,
+  useUniformContextualEditingState: () => useUniformContextualEditingState
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -1155,6 +1156,44 @@ function useScores() {
   }, [context]);
   return scores;
 }
+
+// src/hooks/useUniformContextualEditingState.ts
+var import_canvas6 = require("@uniformdev/canvas");
+var import_react14 = require("react");
+var useUniformContextualEditingState = ({
+  scope
+} = {}) => {
+  const [selectedComponentReference, setSelectedComponentReference] = (0, import_react14.useState)();
+  const channel = (0, import_react14.useMemo)(() => {
+    const channel2 = (0, import_canvas6.createCanvasChannel)({
+      broadcastTo: [window],
+      listenTo: [window]
+    });
+    return channel2;
+  }, []);
+  (0, import_react14.useEffect)(() => {
+    if (!channel) {
+      return;
+    }
+    const unsubscribe = channel.on("update-contextual-editing-state-internal", async (message) => {
+      var _a;
+      if (!(0, import_canvas6.isUpdateContextualEditingStateInternalMessage)(message)) {
+        return;
+      }
+      if (!!scope && (scope == null ? void 0 : scope._id) !== ((_a = message.state.selectedComponentReference) == null ? void 0 : _a.parentId)) {
+        setSelectedComponentReference(void 0);
+        return;
+      }
+      setSelectedComponentReference(message.state.selectedComponentReference);
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, [scope, channel]);
+  return {
+    selectedComponentReference
+  };
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ClientContextPersonalizationTransfer,
@@ -1171,7 +1210,8 @@ function useScores() {
   useInitUniformContext,
   useQuirks,
   useScores,
-  useUniformContext
+  useUniformContext,
+  useUniformContextualEditingState
 });
 /*! Bundled license information:
 

package/dist/index.mjs

@@ -1137,6 +1137,47 @@ function useScores() {
   }, [context]);
   return scores;
 }
+
+// src/hooks/useUniformContextualEditingState.ts
+import {
+  createCanvasChannel as createCanvasChannel2,
+  isUpdateContextualEditingStateInternalMessage
+} from "@uniformdev/canvas";
+import { useEffect as useEffect12, useMemo as useMemo4, useState as useState10 } from "react";
+var useUniformContextualEditingState = ({
+  scope
+} = {}) => {
+  const [selectedComponentReference, setSelectedComponentReference] = useState10();
+  const channel = useMemo4(() => {
+    const channel2 = createCanvasChannel2({
+      broadcastTo: [window],
+      listenTo: [window]
+    });
+    return channel2;
+  }, []);
+  useEffect12(() => {
+    if (!channel) {
+      return;
+    }
+    const unsubscribe = channel.on("update-contextual-editing-state-internal", async (message) => {
+      var _a;
+      if (!isUpdateContextualEditingStateInternalMessage(message)) {
+        return;
+      }
+      if (!!scope && (scope == null ? void 0 : scope._id) !== ((_a = message.state.selectedComponentReference) == null ? void 0 : _a.parentId)) {
+        setSelectedComponentReference(void 0);
+        return;
+      }
+      setSelectedComponentReference(message.state.selectedComponentReference);
+    });
+    return () => {
+      unsubscribe();
+    };
+  }, [scope, channel]);
+  return {
+    selectedComponentReference
+  };
+};
 export {
   ClientContextPersonalizationTransfer,
   ClientContextTestTransfer,
@@ -1152,7 +1193,8 @@ export {
   useInitUniformContext,
   useQuirks,
   useScores,
-  useUniformContext
+  useUniformContext,
+  useUniformContextualEditingState
 };
 /*! Bundled license information:
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/canvas-next-rsc-client",
-  "version": "19.202.0",
+  "version": "19.204.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "scripts": {
     "build": "tsup",
@@ -32,9 +32,9 @@
     "react-dom": "18.3.1"
   },
   "dependencies": {
-    "@uniformdev/canvas": "19.202.0",
-    "@uniformdev/canvas-next-rsc-shared": "^19.202.0",
-    "@uniformdev/canvas-react": "^19.202.0"
+    "@uniformdev/canvas": "19.204.0",
+    "@uniformdev/canvas-next-rsc-shared": "^19.204.0",
+    "@uniformdev/canvas-react": "^19.204.0"
   },
   "engines": {
     "node": ">=16.14.0"
@@ -47,5 +47,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "133a9ea4d2d3794e2d05ad8277f6bb3803d109d7"
+  "gitHead": "526d22d188132e5d47dc117808be6ead40532cb1"
 }