react-datocms 7.2.4 → 7.2.5-0

package/README.md

@@ -27,6 +27,7 @@ This package offers different components and hooks. Please refer to one of the f
 * [`<SRCImage />` and `<Image />` components for responsive/progressive images](./docs/image.md)
 * [`<StructuredText />` component](./docs/structured-text.md)
 * [`<VideoPlayer />` component](./docs/video-player.md)
+* [`<ContentLink />` component and `useContentLink()` hook for Visual Editing with click-to-edit overlays](./docs/content-link.md)
 * [`useQuerySubscription()` hook for live, real-time updates of content](./docs/live-real-time-updates.md)
 * [`useSiteSearch()` hook to render a DatoCMS Site Search form widget](./docs/site-search.md)
 * [`renderMetaTags()` and other helpers to render social share, SEO and Favicon meta tags](./docs/meta-tags.md)

package/dist/cjs/ContentLink/index.js

@@ -0,0 +1,100 @@
+"use strict";
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContentLink = void 0;
+const react_1 = require("react");
+const index_js_1 = require("../useContentLink/index.js");
+/**
+ * ContentLink component for Visual Editing with DatoCMS.
+ *
+ * This component enables Visual Editing by:
+ * - Detecting stega-encoded metadata in content and creating click-to-edit overlays
+ * - Integrating with DatoCMS Web Previews plugin for in-editor editing
+ * - Supporting Alt/Option key for temporary click-to-edit mode
+ * - Providing bidirectional communication between preview and DatoCMS editor
+ *
+ * ## Basic Usage (Standalone Website with Click-to-Edit)
+ *
+ * For standalone websites with click-to-edit overlays:
+ *
+ * ```tsx
+ * import { ContentLink } from 'react-datocms';
+ *
+ * function App() {
+ *   return (
+ *     <>
+ *       <ContentLink enableClickToEdit={true} />
+ *       {/* Your content with stega-encoded data *\/}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * ## Web Previews Plugin Integration (Next.js Example)
+ *
+ * For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
+ *
+ * ```tsx
+ * 'use client';
+ * import { ContentLink } from 'react-datocms';
+ * import { useRouter, usePathname } from 'next/navigation';
+ *
+ * export function VisualEditing() {
+ *   const router = useRouter();
+ *   const pathname = usePathname();
+ *
+ *   return (
+ *     <ContentLink
+ *       onNavigateTo={(path) => router.push(path)}
+ *       currentPath={pathname}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * ## How Visual Editing Works
+ *
+ * 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
+ *    when fetching content from DatoCMS to embed editing metadata.
+ *
+ * 2. **Add ContentLink component**: Place this component in your app to scan for encoded
+ *    content and create overlays.
+ *
+ * 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
+ *    for temporary editing mode.
+ *
+ * 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
+ *
+ * @param props - Configuration props for ContentLink
+ * @returns null - This component has no visual output
+ */
+function ContentLink(props) {
+    const { currentPath, enableClickToEdit: enableClickToEditOptions } = props, useContentLinkOptions = __rest(props, ["currentPath", "enableClickToEdit"]);
+    const { enableClickToEdit, setCurrentPath } = (0, index_js_1.useContentLink)(useContentLinkOptions);
+    // Sync current path when it changes
+    (0, react_1.useEffect)(() => {
+        if (currentPath !== undefined) {
+            setCurrentPath(currentPath);
+        }
+    }, [currentPath, setCurrentPath]);
+    // Optionally enable click-to-edit on mount
+    (0, react_1.useEffect)(() => {
+        if (enableClickToEditOptions !== undefined) {
+            enableClickToEdit(enableClickToEditOptions === true ? undefined : enableClickToEditOptions);
+        }
+    }, [enableClickToEditOptions, enableClickToEdit]);
+    return null;
+}
+exports.ContentLink = ContentLink;
+//# sourceMappingURL=index.js.map

package/dist/cjs/ContentLink/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ContentLink/index.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;AAEb,iCAAkC;AAClC,yDAGoC;AASpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH,SAAgB,WAAW,CAAC,KAAuB;IACjD,MAAM,EACJ,WAAW,EACX,iBAAiB,EAAE,wBAAwB,KAEzC,KAAK,EADJ,qBAAqB,UACtB,KAAK,EAJH,oCAIL,CAAQ,CAAC;IAEV,MAAM,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,IAAA,yBAAc,EAC1D,qBAAqB,CACtB,CAAC;IAEF,oCAAoC;IACpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;YAC9B,cAAc,CAAC,WAAW,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC;IAElC,2CAA2C;IAC3C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,wBAAwB,KAAK,SAAS,EAAE,CAAC;YAC3C,iBAAiB,CACf,wBAAwB,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,wBAAwB,CACzE,CAAC;QACJ,CAAC;IACH,CAAC,EAAE,CAAC,wBAAwB,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAElD,OAAO,IAAI,CAAC;AACd,CAAC;AA5BD,kCA4BC"}

package/dist/cjs/StructuredText/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/index.js

@@ -22,4 +22,6 @@ __exportStar(require("./VideoPlayer/index.js"), exports);
 __exportStar(require("./useQuerySubscription/index.js"), exports);
 __exportStar(require("./useSiteSearch/index.js"), exports);
 __exportStar(require("./useVideoPlayer/index.js"), exports);
+__exportStar(require("./ContentLink/index.js"), exports);
+__exportStar(require("./useContentLink/index.js"), exports);
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mDAAiC;AACjC,sDAAoC;AACpC,iDAA+B;AAC/B,4DAA0C;AAC1C,yDAAuC;AAEvC,kEAAgD;AAChD,2DAAyC;AACzC,4DAA0C"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mDAAiC;AACjC,sDAAoC;AACpC,iDAA+B;AAC/B,4DAA0C;AAC1C,yDAAuC;AAEvC,kEAAgD;AAChD,2DAAyC;AACzC,4DAA0C;AAE1C,yDAAuC;AACvC,4DAA0C"}

package/dist/cjs/useContentLink/index.js

@@ -0,0 +1,90 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useContentLink = exports.stripStega = exports.decodeStega = void 0;
+const content_link_1 = require("@datocms/content-link");
+const react_1 = require("react");
+var content_link_2 = require("@datocms/content-link");
+Object.defineProperty(exports, "decodeStega", { enumerable: true, get: function () { return content_link_2.decodeStega; } });
+Object.defineProperty(exports, "stripStega", { enumerable: true, get: function () { return content_link_2.stripStega; } });
+/**
+ * Hook to control the ContentLink controller for Visual Editing.
+ *
+ * This hook provides low-level access to the @datocms/content-link controller,
+ * allowing you to programmatically control click-to-edit overlays and
+ * communicate with the DatoCMS Web Previews plugin.
+ *
+ * @param options - Configuration options for the controller
+ * @returns An object containing the controller instance and its methods
+ *
+ * @example
+ * ```tsx
+ * import { useContentLink } from 'react-datocms';
+ *
+ * function MyComponent() {
+ *   const { enableClickToEdit, flashAll } = useContentLink({
+ *     onNavigateTo: (path) => router.push(path),
+ *   });
+ *
+ *   return (
+ *     <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
+ *       Enable Editing
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+function useContentLink(options = {}) {
+    const { enabled = true, onNavigateTo, root } = options;
+    const controllerRef = (0, react_1.useRef)(null);
+    // Create/dispose controller based on enabled flag and dependencies
+    (0, react_1.useEffect)(() => {
+        if (!enabled) {
+            if (controllerRef.current) {
+                controllerRef.current.dispose();
+                controllerRef.current = null;
+            }
+            return;
+        }
+        const controller = (0, content_link_1.createController)({
+            onNavigateTo,
+            root: (root === null || root === void 0 ? void 0 : root.current) || undefined,
+        });
+        controllerRef.current = controller;
+        return () => {
+            controller.dispose();
+            controllerRef.current = null;
+        };
+    }, [enabled, onNavigateTo, root]);
+    // Stable method references that call through to the controller
+    const enableClickToEdit = (0, react_1.useCallback)((opts) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.enableClickToEdit(opts);
+    }, []);
+    const disableClickToEdit = (0, react_1.useCallback)(() => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.disableClickToEdit();
+    }, []);
+    const isClickToEditEnabled = (0, react_1.useCallback)(() => {
+        var _a, _b;
+        return (_b = (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.isClickToEditEnabled()) !== null && _b !== void 0 ? _b : false;
+    }, []);
+    const flashAll = (0, react_1.useCallback)((scrollToNearestTarget) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.flashAll(scrollToNearestTarget);
+    }, []);
+    const setCurrentPath = (0, react_1.useCallback)((path) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.setCurrentPath(path);
+    }, []);
+    return {
+        controller: controllerRef.current,
+        enableClickToEdit,
+        disableClickToEdit,
+        isClickToEditEnabled,
+        flashAll,
+        setCurrentPath,
+    };
+}
+exports.useContentLink = useContentLink;
+//# sourceMappingURL=index.js.map

package/dist/cjs/useContentLink/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useContentLink/index.ts"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AAEb,wDAA0E;AAC1E,iCAAuD;AAIvD,sDAAgE;AAAvD,2GAAA,WAAW,OAAA;AAAE,0GAAA,UAAU,OAAA;AA0BhC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,SAAgB,cAAc,CAC5B,UAAiC,EAAE;IAEnC,MAAM,EAAE,OAAO,GAAG,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;IAEvD,MAAM,aAAa,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAC;IAEtD,mEAAmE;IACnE,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;gBAC1B,aAAa,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;gBAChC,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;YAC/B,CAAC;YACD,OAAO;QACT,CAAC;QAED,MAAM,UAAU,GAAG,IAAA,+BAAgB,EAAC;YAClC,YAAY;YACZ,IAAI,EAAE,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,KAAI,SAAS;SACjC,CAAC,CAAC;QAEH,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC;QAEnC,OAAO,GAAG,EAAE;YACV,UAAU,CAAC,OAAO,EAAE,CAAC;YACrB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC,CAAC;IAElC,+DAA+D;IAC/D,MAAM,iBAAiB,GAAG,IAAA,mBAAW,EACnC,CAAC,IAAyC,EAAE,EAAE;;QAC5C,MAAA,aAAa,CAAC,OAAO,0CAAE,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACjD,CAAC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,kBAAkB,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;;QAC1C,MAAA,aAAa,CAAC,OAAO,0CAAE,kBAAkB,EAAE,CAAC;IAC9C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,oBAAoB,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;;QAC5C,OAAO,MAAA,MAAA,aAAa,CAAC,OAAO,0CAAE,oBAAoB,EAAE,mCAAI,KAAK,CAAC;IAChE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,IAAA,mBAAW,EAAC,CAAC,qBAA+B,EAAE,EAAE;;QAC/D,MAAA,aAAa,CAAC,OAAO,0CAAE,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,cAAc,GAAG,IAAA,mBAAW,EAAC,CAAC,IAAY,EAAE,EAAE;;QAClD,MAAA,aAAa,CAAC,OAAO,0CAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IAC9C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,UAAU,EAAE,aAAa,CAAC,OAAO;QACjC,iBAAiB;QACjB,kBAAkB;QAClB,oBAAoB;QACpB,QAAQ;QACR,cAAc;KACf,CAAC;AACJ,CAAC;AA9DD,wCA8DC"}

package/dist/esm/ContentLink/index.js

@@ -0,0 +1,96 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { useEffect } from 'react';
+import { useContentLink, } from '../useContentLink/index.js';
+/**
+ * ContentLink component for Visual Editing with DatoCMS.
+ *
+ * This component enables Visual Editing by:
+ * - Detecting stega-encoded metadata in content and creating click-to-edit overlays
+ * - Integrating with DatoCMS Web Previews plugin for in-editor editing
+ * - Supporting Alt/Option key for temporary click-to-edit mode
+ * - Providing bidirectional communication between preview and DatoCMS editor
+ *
+ * ## Basic Usage (Standalone Website with Click-to-Edit)
+ *
+ * For standalone websites with click-to-edit overlays:
+ *
+ * ```tsx
+ * import { ContentLink } from 'react-datocms';
+ *
+ * function App() {
+ *   return (
+ *     <>
+ *       <ContentLink enableClickToEdit={true} />
+ *       {/* Your content with stega-encoded data *\/}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * ## Web Previews Plugin Integration (Next.js Example)
+ *
+ * For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
+ *
+ * ```tsx
+ * 'use client';
+ * import { ContentLink } from 'react-datocms';
+ * import { useRouter, usePathname } from 'next/navigation';
+ *
+ * export function VisualEditing() {
+ *   const router = useRouter();
+ *   const pathname = usePathname();
+ *
+ *   return (
+ *     <ContentLink
+ *       onNavigateTo={(path) => router.push(path)}
+ *       currentPath={pathname}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * ## How Visual Editing Works
+ *
+ * 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
+ *    when fetching content from DatoCMS to embed editing metadata.
+ *
+ * 2. **Add ContentLink component**: Place this component in your app to scan for encoded
+ *    content and create overlays.
+ *
+ * 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
+ *    for temporary editing mode.
+ *
+ * 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
+ *
+ * @param props - Configuration props for ContentLink
+ * @returns null - This component has no visual output
+ */
+export function ContentLink(props) {
+    const { currentPath, enableClickToEdit: enableClickToEditOptions } = props, useContentLinkOptions = __rest(props, ["currentPath", "enableClickToEdit"]);
+    const { enableClickToEdit, setCurrentPath } = useContentLink(useContentLinkOptions);
+    // Sync current path when it changes
+    useEffect(() => {
+        if (currentPath !== undefined) {
+            setCurrentPath(currentPath);
+        }
+    }, [currentPath, setCurrentPath]);
+    // Optionally enable click-to-edit on mount
+    useEffect(() => {
+        if (enableClickToEditOptions !== undefined) {
+            enableClickToEdit(enableClickToEditOptions === true ? undefined : enableClickToEditOptions);
+        }
+    }, [enableClickToEditOptions, enableClickToEdit]);
+    return null;
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/ContentLink/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ContentLink/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;;;;;AAEb,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAEL,cAAc,GACf,MAAM,4BAA4B,CAAC;AASpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+DG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,MAAM,EACJ,WAAW,EACX,iBAAiB,EAAE,wBAAwB,KAEzC,KAAK,EADJ,qBAAqB,UACtB,KAAK,EAJH,oCAIL,CAAQ,CAAC;IAEV,MAAM,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,cAAc,CAC1D,qBAAqB,CACtB,CAAC;IAEF,oCAAoC;IACpC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;YAC9B,cAAc,CAAC,WAAW,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC;IAElC,2CAA2C;IAC3C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,wBAAwB,KAAK,SAAS,EAAE,CAAC;YAC3C,iBAAiB,CACf,wBAAwB,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,wBAAwB,CACzE,CAAC;QACJ,CAAC;IACH,CAAC,EAAE,CAAC,wBAAwB,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAElD,OAAO,IAAI,CAAC;AACd,CAAC"}

package/dist/esm/StructuredText/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}

package/dist/esm/index.js

@@ -6,4 +6,6 @@ export * from './VideoPlayer/index.js';
 export * from './useQuerySubscription/index.js';
 export * from './useSiteSearch/index.js';
 export * from './useVideoPlayer/index.js';
+export * from './ContentLink/index.js';
+export * from './useContentLink/index.js';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AAEvC,cAAc,iCAAiC,CAAC;AAChD,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AAEvC,cAAc,iCAAiC,CAAC;AAChD,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAE1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC"}

package/dist/esm/useContentLink/index.js

@@ -0,0 +1,84 @@
+'use client';
+import { createController } from '@datocms/content-link';
+import { useCallback, useEffect, useRef } from 'react';
+export { decodeStega, stripStega } from '@datocms/content-link';
+/**
+ * Hook to control the ContentLink controller for Visual Editing.
+ *
+ * This hook provides low-level access to the @datocms/content-link controller,
+ * allowing you to programmatically control click-to-edit overlays and
+ * communicate with the DatoCMS Web Previews plugin.
+ *
+ * @param options - Configuration options for the controller
+ * @returns An object containing the controller instance and its methods
+ *
+ * @example
+ * ```tsx
+ * import { useContentLink } from 'react-datocms';
+ *
+ * function MyComponent() {
+ *   const { enableClickToEdit, flashAll } = useContentLink({
+ *     onNavigateTo: (path) => router.push(path),
+ *   });
+ *
+ *   return (
+ *     <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
+ *       Enable Editing
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+export function useContentLink(options = {}) {
+    const { enabled = true, onNavigateTo, root } = options;
+    const controllerRef = useRef(null);
+    // Create/dispose controller based on enabled flag and dependencies
+    useEffect(() => {
+        if (!enabled) {
+            if (controllerRef.current) {
+                controllerRef.current.dispose();
+                controllerRef.current = null;
+            }
+            return;
+        }
+        const controller = createController({
+            onNavigateTo,
+            root: (root === null || root === void 0 ? void 0 : root.current) || undefined,
+        });
+        controllerRef.current = controller;
+        return () => {
+            controller.dispose();
+            controllerRef.current = null;
+        };
+    }, [enabled, onNavigateTo, root]);
+    // Stable method references that call through to the controller
+    const enableClickToEdit = useCallback((opts) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.enableClickToEdit(opts);
+    }, []);
+    const disableClickToEdit = useCallback(() => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.disableClickToEdit();
+    }, []);
+    const isClickToEditEnabled = useCallback(() => {
+        var _a, _b;
+        return (_b = (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.isClickToEditEnabled()) !== null && _b !== void 0 ? _b : false;
+    }, []);
+    const flashAll = useCallback((scrollToNearestTarget) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.flashAll(scrollToNearestTarget);
+    }, []);
+    const setCurrentPath = useCallback((path) => {
+        var _a;
+        (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.setCurrentPath(path);
+    }, []);
+    return {
+        controller: controllerRef.current,
+        enableClickToEdit,
+        disableClickToEdit,
+        isClickToEditEnabled,
+        flashAll,
+        setCurrentPath,
+    };
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/useContentLink/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useContentLink/index.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAmB,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAIvD,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AA0BhE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,UAAU,cAAc,CAC5B,UAAiC,EAAE;IAEnC,MAAM,EAAE,OAAO,GAAG,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC;IAEvD,MAAM,aAAa,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEtD,mEAAmE;IACnE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;gBAC1B,aAAa,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;gBAChC,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;YAC/B,CAAC;YACD,OAAO;QACT,CAAC;QAED,MAAM,UAAU,GAAG,gBAAgB,CAAC;YAClC,YAAY;YACZ,IAAI,EAAE,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,KAAI,SAAS;SACjC,CAAC,CAAC;QAEH,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC;QAEnC,OAAO,GAAG,EAAE;YACV,UAAU,CAAC,OAAO,EAAE,CAAC;YACrB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;QAC/B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC,CAAC;IAElC,+DAA+D;IAC/D,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,IAAyC,EAAE,EAAE;;QAC5C,MAAA,aAAa,CAAC,OAAO,0CAAE,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACjD,CAAC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;;QAC1C,MAAA,aAAa,CAAC,OAAO,0CAAE,kBAAkB,EAAE,CAAC;IAC9C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,oBAAoB,GAAG,WAAW,CAAC,GAAG,EAAE;;QAC5C,OAAO,MAAA,MAAA,aAAa,CAAC,OAAO,0CAAE,oBAAoB,EAAE,mCAAI,KAAK,CAAC;IAChE,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,qBAA+B,EAAE,EAAE;;QAC/D,MAAA,aAAa,CAAC,OAAO,0CAAE,QAAQ,CAAC,qBAAqB,CAAC,CAAC;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,IAAY,EAAE,EAAE;;QAClD,MAAA,aAAa,CAAC,OAAO,0CAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IAC9C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,UAAU,EAAE,aAAa,CAAC,OAAO;QACjC,iBAAiB;QACjB,kBAAkB;QAClB,oBAAoB;QACpB,QAAQ;QACR,cAAc;KACf,CAAC;AACJ,CAAC"}

package/dist/types/ContentLink/index.d.ts

@@ -0,0 +1,74 @@
+import { type UseContentLinkOptions } from '../useContentLink/index.js';
+export type ContentLinkProps = UseContentLinkOptions & {
+    /** Current pathname to sync with Web Previews plugin */
+    currentPath?: string;
+    /** Enable click-to-edit on mount. Pass true for default behavior or an object with scrollToNearestTarget. If undefined, click-to-edit is disabled. */
+    enableClickToEdit?: true | {
+        scrollToNearestTarget: true;
+    };
+};
+/**
+ * ContentLink component for Visual Editing with DatoCMS.
+ *
+ * This component enables Visual Editing by:
+ * - Detecting stega-encoded metadata in content and creating click-to-edit overlays
+ * - Integrating with DatoCMS Web Previews plugin for in-editor editing
+ * - Supporting Alt/Option key for temporary click-to-edit mode
+ * - Providing bidirectional communication between preview and DatoCMS editor
+ *
+ * ## Basic Usage (Standalone Website with Click-to-Edit)
+ *
+ * For standalone websites with click-to-edit overlays:
+ *
+ * ```tsx
+ * import { ContentLink } from 'react-datocms';
+ *
+ * function App() {
+ *   return (
+ *     <>
+ *       <ContentLink enableClickToEdit={true} />
+ *       {/* Your content with stega-encoded data *\/}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * ## Web Previews Plugin Integration (Next.js Example)
+ *
+ * For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
+ *
+ * ```tsx
+ * 'use client';
+ * import { ContentLink } from 'react-datocms';
+ * import { useRouter, usePathname } from 'next/navigation';
+ *
+ * export function VisualEditing() {
+ *   const router = useRouter();
+ *   const pathname = usePathname();
+ *
+ *   return (
+ *     <ContentLink
+ *       onNavigateTo={(path) => router.push(path)}
+ *       currentPath={pathname}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * ## How Visual Editing Works
+ *
+ * 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
+ *    when fetching content from DatoCMS to embed editing metadata.
+ *
+ * 2. **Add ContentLink component**: Place this component in your app to scan for encoded
+ *    content and create overlays.
+ *
+ * 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
+ *    for temporary editing mode.
+ *
+ * 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
+ *
+ * @param props - Configuration props for ContentLink
+ * @returns null - This component has no visual output
+ */
+export declare function ContentLink(props: ContentLinkProps): null;

package/dist/types/StructuredText/index.d.ts

@@ -1,5 +1,5 @@
 import { type RenderMarkRule, type TransformMetaFn, type TransformedMeta, renderMarkRule, renderNodeRule } from 'datocms-structured-text-generic-html-renderer';
-import { type Node, RenderError, type RenderResult, type RenderRule, type Document as StructuredTextDocument, type CdaStructuredTextValue, type CdaStructuredTextRecord, type TypesafeCdaStructuredTextValue, type StructuredText as StructuredTextGraphQlResponse, type Record as StructuredTextGraphQlResponseRecord, type TypesafeStructuredText as TypesafeStructuredTextGraphQlResponse } from 'datocms-structured-text-utils';
+import { type CdaStructuredTextRecord, type CdaStructuredTextValue, type Node, RenderError, type RenderResult, type RenderRule, type Document as StructuredTextDocument, type StructuredText as StructuredTextGraphQlResponse, type Record as StructuredTextGraphQlResponseRecord, type TypesafeCdaStructuredTextValue, type TypesafeStructuredText as TypesafeStructuredTextGraphQlResponse } from 'datocms-structured-text-utils';
 import { type ReactElement } from 'react';
 export { renderNodeRule, renderMarkRule, RenderError };
 export type { StructuredTextDocument, CdaStructuredTextValue, TypesafeCdaStructuredTextValue, CdaStructuredTextRecord, };

package/dist/types/index.d.ts

@@ -6,3 +6,5 @@ export * from './VideoPlayer/index.js';
 export * from './useQuerySubscription/index.js';
 export * from './useSiteSearch/index.js';
 export * from './useVideoPlayer/index.js';
+export * from './ContentLink/index.js';
+export * from './useContentLink/index.js';

package/dist/types/useContentLink/index.d.ts

@@ -0,0 +1,56 @@
+/// <reference types="react" />
+import { type Controller } from '@datocms/content-link';
+export type { Controller } from '@datocms/content-link';
+export { decodeStega, stripStega } from '@datocms/content-link';
+export type UseContentLinkOptions = {
+    /** Whether the controller is enabled (default: true) */
+    enabled?: boolean;
+    /** Callback when Web Previews plugin requests navigation */
+    onNavigateTo?: (path: string) => void;
+    /** Ref to limit scanning to this root instead of document */
+    root?: React.RefObject<ParentNode>;
+};
+export type UseContentLinkResult = {
+    /** The controller instance, or null if disabled */
+    controller: Controller | null;
+    /** Enable click-to-edit overlays */
+    enableClickToEdit: (options?: {
+        scrollToNearestTarget: boolean;
+    }) => void;
+    /** Disable click-to-edit overlays */
+    disableClickToEdit: () => void;
+    /** Check if click-to-edit is enabled */
+    isClickToEditEnabled: () => boolean;
+    /** Highlight all editable elements */
+    flashAll: (scrollToNearestTarget?: boolean) => void;
+    /** Notify Web Previews plugin of current path */
+    setCurrentPath: (path: string) => void;
+};
+/**
+ * Hook to control the ContentLink controller for Visual Editing.
+ *
+ * This hook provides low-level access to the @datocms/content-link controller,
+ * allowing you to programmatically control click-to-edit overlays and
+ * communicate with the DatoCMS Web Previews plugin.
+ *
+ * @param options - Configuration options for the controller
+ * @returns An object containing the controller instance and its methods
+ *
+ * @example
+ * ```tsx
+ * import { useContentLink } from 'react-datocms';
+ *
+ * function MyComponent() {
+ *   const { enableClickToEdit, flashAll } = useContentLink({
+ *     onNavigateTo: (path) => router.push(path),
+ *   });
+ *
+ *   return (
+ *     <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
+ *       Enable Editing
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+export declare function useContentLink(options?: UseContentLinkOptions): UseContentLinkResult;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-datocms",
-  "version": "7.2.4",
+  "version": "7.2.5-0",
   "engines": {
     "node": ">=8.0.0"
   },
@@ -48,6 +48,16 @@
       "require": "./dist/cjs/useVideoPlayer/index.js",
       "import": "./dist/esm/useVideoPlayer/index.js",
       "types": "./dist/types/useVideoPlayer/index.d.ts"
+    },
+    "./use-content-link": {
+      "require": "./dist/cjs/useContentLink/index.js",
+      "import": "./dist/esm/useContentLink/index.js",
+      "types": "./dist/types/useContentLink/index.d.ts"
+    },
+    "./content-link": {
+      "require": "./dist/cjs/ContentLink/index.js",
+      "import": "./dist/esm/ContentLink/index.js",
+      "types": "./dist/types/ContentLink/index.d.ts"
     }
   },
   "typesVersions": {
@@ -75,6 +85,12 @@
       ],
       "use-video-player": [
         "./dist/types/useVideoPlayer/index.d.ts"
+      ],
+      "use-content-link": [
+        "./dist/types/useContentLink/index.d.ts"
+      ],
+      "content-link": [
+        "./dist/types/ContentLink/index.d.ts"
       ]
     }
   },
@@ -133,6 +149,7 @@
     "react": ">= 16.12.0 || ^19.0.0-rc"
   },
   "dependencies": {
+    "@datocms/content-link": "^0.3.6",
     "@mux/mux-player-react": "*",
     "datocms-listen": "^0.1.9",
     "datocms-structured-text-generic-html-renderer": "^5.0.0",

package/src/ContentLink/index.tsx

@@ -0,0 +1,108 @@
+'use client';
+
+import { useEffect } from 'react';
+import {
+  type UseContentLinkOptions,
+  useContentLink,
+} from '../useContentLink/index.js';
+
+export type ContentLinkProps = UseContentLinkOptions & {
+  /** Current pathname to sync with Web Previews plugin */
+  currentPath?: string;
+  /** Enable click-to-edit on mount. Pass true for default behavior or an object with scrollToNearestTarget. If undefined, click-to-edit is disabled. */
+  enableClickToEdit?: true | { scrollToNearestTarget: true };
+};
+
+/**
+ * ContentLink component for Visual Editing with DatoCMS.
+ *
+ * This component enables Visual Editing by:
+ * - Detecting stega-encoded metadata in content and creating click-to-edit overlays
+ * - Integrating with DatoCMS Web Previews plugin for in-editor editing
+ * - Supporting Alt/Option key for temporary click-to-edit mode
+ * - Providing bidirectional communication between preview and DatoCMS editor
+ *
+ * ## Basic Usage (Standalone Website with Click-to-Edit)
+ *
+ * For standalone websites with click-to-edit overlays:
+ *
+ * ```tsx
+ * import { ContentLink } from 'react-datocms';
+ *
+ * function App() {
+ *   return (
+ *     <>
+ *       <ContentLink enableClickToEdit={true} />
+ *       {/* Your content with stega-encoded data *\/}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * ## Web Previews Plugin Integration (Next.js Example)
+ *
+ * For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
+ *
+ * ```tsx
+ * 'use client';
+ * import { ContentLink } from 'react-datocms';
+ * import { useRouter, usePathname } from 'next/navigation';
+ *
+ * export function VisualEditing() {
+ *   const router = useRouter();
+ *   const pathname = usePathname();
+ *
+ *   return (
+ *     <ContentLink
+ *       onNavigateTo={(path) => router.push(path)}
+ *       currentPath={pathname}
+ *     />
+ *   );
+ * }
+ * ```
+ *
+ * ## How Visual Editing Works
+ *
+ * 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
+ *    when fetching content from DatoCMS to embed editing metadata.
+ *
+ * 2. **Add ContentLink component**: Place this component in your app to scan for encoded
+ *    content and create overlays.
+ *
+ * 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
+ *    for temporary editing mode.
+ *
+ * 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
+ *
+ * @param props - Configuration props for ContentLink
+ * @returns null - This component has no visual output
+ */
+export function ContentLink(props: ContentLinkProps): null {
+  const {
+    currentPath,
+    enableClickToEdit: enableClickToEditOptions,
+    ...useContentLinkOptions
+  } = props;
+
+  const { enableClickToEdit, setCurrentPath } = useContentLink(
+    useContentLinkOptions,
+  );
+
+  // Sync current path when it changes
+  useEffect(() => {
+    if (currentPath !== undefined) {
+      setCurrentPath(currentPath);
+    }
+  }, [currentPath, setCurrentPath]);
+
+  // Optionally enable click-to-edit on mount
+  useEffect(() => {
+    if (enableClickToEditOptions !== undefined) {
+      enableClickToEdit(
+        enableClickToEditOptions === true ? undefined : enableClickToEditOptions
+      );
+    }
+  }, [enableClickToEditOptions, enableClickToEdit]);
+
+  return null;
+}

package/src/StructuredText/index.tsx

@@ -8,16 +8,16 @@ import {
   renderNodeRule,
 } from 'datocms-structured-text-generic-html-renderer';
 import {
+  type CdaStructuredTextRecord,
+  type CdaStructuredTextValue,
   type Node,
   RenderError,
   type RenderResult,
   type RenderRule,
   type Document as StructuredTextDocument,
-  type CdaStructuredTextValue,
-  type CdaStructuredTextRecord,
-  type TypesafeCdaStructuredTextValue,
   type StructuredText as StructuredTextGraphQlResponse,
   type Record as StructuredTextGraphQlResponseRecord,
+  type TypesafeCdaStructuredTextValue,
   type TypesafeStructuredText as TypesafeStructuredTextGraphQlResponse,
   isBlock,
   isInlineBlock,

package/src/index.ts

@@ -7,3 +7,6 @@ export * from './VideoPlayer/index.js';
 export * from './useQuerySubscription/index.js';
 export * from './useSiteSearch/index.js';
 export * from './useVideoPlayer/index.js';
+
+export * from './ContentLink/index.js';
+export * from './useContentLink/index.js';

package/src/useContentLink/index.ts

@@ -0,0 +1,123 @@
+'use client';
+
+import { type Controller, createController } from '@datocms/content-link';
+import { useCallback, useEffect, useRef } from 'react';
+
+// Re-export types and utilities from @datocms/content-link for convenience
+export type { Controller } from '@datocms/content-link';
+export { decodeStega, stripStega } from '@datocms/content-link';
+
+export type UseContentLinkOptions = {
+  /** Whether the controller is enabled (default: true) */
+  enabled?: boolean;
+  /** Callback when Web Previews plugin requests navigation */
+  onNavigateTo?: (path: string) => void;
+  /** Ref to limit scanning to this root instead of document */
+  root?: React.RefObject<ParentNode>;
+};
+
+export type UseContentLinkResult = {
+  /** The controller instance, or null if disabled */
+  controller: Controller | null;
+  /** Enable click-to-edit overlays */
+  enableClickToEdit: (options?: { scrollToNearestTarget: boolean }) => void;
+  /** Disable click-to-edit overlays */
+  disableClickToEdit: () => void;
+  /** Check if click-to-edit is enabled */
+  isClickToEditEnabled: () => boolean;
+  /** Highlight all editable elements */
+  flashAll: (scrollToNearestTarget?: boolean) => void;
+  /** Notify Web Previews plugin of current path */
+  setCurrentPath: (path: string) => void;
+};
+
+/**
+ * Hook to control the ContentLink controller for Visual Editing.
+ *
+ * This hook provides low-level access to the @datocms/content-link controller,
+ * allowing you to programmatically control click-to-edit overlays and
+ * communicate with the DatoCMS Web Previews plugin.
+ *
+ * @param options - Configuration options for the controller
+ * @returns An object containing the controller instance and its methods
+ *
+ * @example
+ * ```tsx
+ * import { useContentLink } from 'react-datocms';
+ *
+ * function MyComponent() {
+ *   const { enableClickToEdit, flashAll } = useContentLink({
+ *     onNavigateTo: (path) => router.push(path),
+ *   });
+ *
+ *   return (
+ *     <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
+ *       Enable Editing
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+export function useContentLink(
+  options: UseContentLinkOptions = {},
+): UseContentLinkResult {
+  const { enabled = true, onNavigateTo, root } = options;
+
+  const controllerRef = useRef<Controller | null>(null);
+
+  // Create/dispose controller based on enabled flag and dependencies
+  useEffect(() => {
+    if (!enabled) {
+      if (controllerRef.current) {
+        controllerRef.current.dispose();
+        controllerRef.current = null;
+      }
+      return;
+    }
+
+    const controller = createController({
+      onNavigateTo,
+      root: root?.current || undefined,
+    });
+
+    controllerRef.current = controller;
+
+    return () => {
+      controller.dispose();
+      controllerRef.current = null;
+    };
+  }, [enabled, onNavigateTo, root]);
+
+  // Stable method references that call through to the controller
+  const enableClickToEdit = useCallback(
+    (opts?: { scrollToNearestTarget: boolean }) => {
+      controllerRef.current?.enableClickToEdit(opts);
+    },
+    [],
+  );
+
+  const disableClickToEdit = useCallback(() => {
+    controllerRef.current?.disableClickToEdit();
+  }, []);
+
+  const isClickToEditEnabled = useCallback(() => {
+    return controllerRef.current?.isClickToEditEnabled() ?? false;
+  }, []);
+
+  const flashAll = useCallback((scrollToNearestTarget?: boolean) => {
+    controllerRef.current?.flashAll(scrollToNearestTarget);
+  }, []);
+
+  const setCurrentPath = useCallback((path: string) => {
+    controllerRef.current?.setCurrentPath(path);
+  }, []);
+
+  return {
+    controller: controllerRef.current,
+    enableClickToEdit,
+    disableClickToEdit,
+    isClickToEditEnabled,
+    flashAll,
+    setCurrentPath,
+  };
+}