react-datocms 7.2.3 → 7.2.5-0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/cjs/ContentLink/index.js +100 -0
- package/dist/cjs/ContentLink/index.js.map +1 -0
- package/dist/cjs/StructuredText/index.js.map +1 -1
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/useContentLink/index.js +90 -0
- package/dist/cjs/useContentLink/index.js.map +1 -0
- package/dist/cjs/useSiteSearch/index.js +2 -1
- package/dist/cjs/useSiteSearch/index.js.map +1 -1
- package/dist/esm/ContentLink/index.js +96 -0
- package/dist/esm/ContentLink/index.js.map +1 -0
- package/dist/esm/StructuredText/index.js.map +1 -1
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/useContentLink/index.js +84 -0
- package/dist/esm/useContentLink/index.js.map +1 -0
- package/dist/esm/useSiteSearch/index.js +2 -1
- package/dist/esm/useSiteSearch/index.js.map +1 -1
- package/dist/types/ContentLink/index.d.ts +74 -0
- package/dist/types/StructuredText/index.d.ts +1 -1
- package/dist/types/index.d.ts +2 -0
- package/dist/types/useContentLink/index.d.ts +56 -0
- package/dist/types/useSiteSearch/index.d.ts +3 -1
- package/package.json +18 -1
- package/src/ContentLink/index.tsx +108 -0
- package/src/StructuredText/index.tsx +3 -3
- package/src/index.ts +3 -0
- package/src/useContentLink/index.ts +123 -0
- package/src/useSiteSearch/index.tsx +5 -1
package/README.md
CHANGED
|
@@ -27,6 +27,7 @@ This package offers different components and hooks. Please refer to one of the f
|
|
|
27
27
|
* [`<SRCImage />` and `<Image />` components for responsive/progressive images](./docs/image.md)
|
|
28
28
|
* [`<StructuredText />` component](./docs/structured-text.md)
|
|
29
29
|
* [`<VideoPlayer />` component](./docs/video-player.md)
|
|
30
|
+
* [`<ContentLink />` component and `useContentLink()` hook for Visual Editing with click-to-edit overlays](./docs/content-link.md)
|
|
30
31
|
* [`useQuerySubscription()` hook for live, real-time updates of content](./docs/live-real-time-updates.md)
|
|
31
32
|
* [`useSiteSearch()` hook to render a DatoCMS Site Search form widget](./docs/site-search.md)
|
|
32
33
|
* [`renderMetaTags()` and other helpers to render social share, SEO and Favicon meta tags](./docs/meta-tags.md)
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
4
|
+
var t = {};
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
8
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
10
|
+
t[p[i]] = s[p[i]];
|
|
11
|
+
}
|
|
12
|
+
return t;
|
|
13
|
+
};
|
|
14
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
15
|
+
exports.ContentLink = void 0;
|
|
16
|
+
const react_1 = require("react");
|
|
17
|
+
const index_js_1 = require("../useContentLink/index.js");
|
|
18
|
+
/**
|
|
19
|
+
* ContentLink component for Visual Editing with DatoCMS.
|
|
20
|
+
*
|
|
21
|
+
* This component enables Visual Editing by:
|
|
22
|
+
* - Detecting stega-encoded metadata in content and creating click-to-edit overlays
|
|
23
|
+
* - Integrating with DatoCMS Web Previews plugin for in-editor editing
|
|
24
|
+
* - Supporting Alt/Option key for temporary click-to-edit mode
|
|
25
|
+
* - Providing bidirectional communication between preview and DatoCMS editor
|
|
26
|
+
*
|
|
27
|
+
* ## Basic Usage (Standalone Website with Click-to-Edit)
|
|
28
|
+
*
|
|
29
|
+
* For standalone websites with click-to-edit overlays:
|
|
30
|
+
*
|
|
31
|
+
* ```tsx
|
|
32
|
+
* import { ContentLink } from 'react-datocms';
|
|
33
|
+
*
|
|
34
|
+
* function App() {
|
|
35
|
+
* return (
|
|
36
|
+
* <>
|
|
37
|
+
* <ContentLink enableClickToEdit={true} />
|
|
38
|
+
* {/* Your content with stega-encoded data *\/}
|
|
39
|
+
* </>
|
|
40
|
+
* );
|
|
41
|
+
* }
|
|
42
|
+
* ```
|
|
43
|
+
*
|
|
44
|
+
* ## Web Previews Plugin Integration (Next.js Example)
|
|
45
|
+
*
|
|
46
|
+
* For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
|
|
47
|
+
*
|
|
48
|
+
* ```tsx
|
|
49
|
+
* 'use client';
|
|
50
|
+
* import { ContentLink } from 'react-datocms';
|
|
51
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
52
|
+
*
|
|
53
|
+
* export function VisualEditing() {
|
|
54
|
+
* const router = useRouter();
|
|
55
|
+
* const pathname = usePathname();
|
|
56
|
+
*
|
|
57
|
+
* return (
|
|
58
|
+
* <ContentLink
|
|
59
|
+
* onNavigateTo={(path) => router.push(path)}
|
|
60
|
+
* currentPath={pathname}
|
|
61
|
+
* />
|
|
62
|
+
* );
|
|
63
|
+
* }
|
|
64
|
+
* ```
|
|
65
|
+
*
|
|
66
|
+
* ## How Visual Editing Works
|
|
67
|
+
*
|
|
68
|
+
* 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
|
|
69
|
+
* when fetching content from DatoCMS to embed editing metadata.
|
|
70
|
+
*
|
|
71
|
+
* 2. **Add ContentLink component**: Place this component in your app to scan for encoded
|
|
72
|
+
* content and create overlays.
|
|
73
|
+
*
|
|
74
|
+
* 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
|
|
75
|
+
* for temporary editing mode.
|
|
76
|
+
*
|
|
77
|
+
* 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
|
|
78
|
+
*
|
|
79
|
+
* @param props - Configuration props for ContentLink
|
|
80
|
+
* @returns null - This component has no visual output
|
|
81
|
+
*/
|
|
82
|
+
function ContentLink(props) {
|
|
83
|
+
const { currentPath, enableClickToEdit: enableClickToEditOptions } = props, useContentLinkOptions = __rest(props, ["currentPath", "enableClickToEdit"]);
|
|
84
|
+
const { enableClickToEdit, setCurrentPath } = (0, index_js_1.useContentLink)(useContentLinkOptions);
|
|
85
|
+
// Sync current path when it changes
|
|
86
|
+
(0, react_1.useEffect)(() => {
|
|
87
|
+
if (currentPath !== undefined) {
|
|
88
|
+
setCurrentPath(currentPath);
|
|
89
|
+
}
|
|
90
|
+
}, [currentPath, setCurrentPath]);
|
|
91
|
+
// Optionally enable click-to-edit on mount
|
|
92
|
+
(0, react_1.useEffect)(() => {
|
|
93
|
+
if (enableClickToEditOptions !== undefined) {
|
|
94
|
+
enableClickToEdit(enableClickToEditOptions === true ? undefined : enableClickToEditOptions);
|
|
95
|
+
}
|
|
96
|
+
}, [enableClickToEditOptions, enableClickToEdit]);
|
|
97
|
+
return null;
|
|
98
|
+
}
|
|
99
|
+
exports.ContentLink = ContentLink;
|
|
100
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iHAQuD;AAqB9B,+FAvBvB,8DAAc,OAuBuB;AAA9B,+FAtBP,8DAAc,OAsBO;AAkRI,2FAxSzB,8DAAc,OAwSqB;AAtSrC,iFAiBuC;AAGE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/cjs/index.js
CHANGED
|
@@ -22,4 +22,6 @@ __exportStar(require("./VideoPlayer/index.js"), exports);
|
|
|
22
22
|
__exportStar(require("./useQuerySubscription/index.js"), exports);
|
|
23
23
|
__exportStar(require("./useSiteSearch/index.js"), exports);
|
|
24
24
|
__exportStar(require("./useVideoPlayer/index.js"), exports);
|
|
25
|
+
__exportStar(require("./ContentLink/index.js"), exports);
|
|
26
|
+
__exportStar(require("./useContentLink/index.js"), exports);
|
|
25
27
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1 +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"}
|
|
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;AAE1C,yDAAuC;AACvC,4DAA0C"}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useContentLink = exports.stripStega = exports.decodeStega = void 0;
|
|
5
|
+
const content_link_1 = require("@datocms/content-link");
|
|
6
|
+
const react_1 = require("react");
|
|
7
|
+
var content_link_2 = require("@datocms/content-link");
|
|
8
|
+
Object.defineProperty(exports, "decodeStega", { enumerable: true, get: function () { return content_link_2.decodeStega; } });
|
|
9
|
+
Object.defineProperty(exports, "stripStega", { enumerable: true, get: function () { return content_link_2.stripStega; } });
|
|
10
|
+
/**
|
|
11
|
+
* Hook to control the ContentLink controller for Visual Editing.
|
|
12
|
+
*
|
|
13
|
+
* This hook provides low-level access to the @datocms/content-link controller,
|
|
14
|
+
* allowing you to programmatically control click-to-edit overlays and
|
|
15
|
+
* communicate with the DatoCMS Web Previews plugin.
|
|
16
|
+
*
|
|
17
|
+
* @param options - Configuration options for the controller
|
|
18
|
+
* @returns An object containing the controller instance and its methods
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* import { useContentLink } from 'react-datocms';
|
|
23
|
+
*
|
|
24
|
+
* function MyComponent() {
|
|
25
|
+
* const { enableClickToEdit, flashAll } = useContentLink({
|
|
26
|
+
* onNavigateTo: (path) => router.push(path),
|
|
27
|
+
* });
|
|
28
|
+
*
|
|
29
|
+
* return (
|
|
30
|
+
* <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
|
|
31
|
+
* Enable Editing
|
|
32
|
+
* </button>
|
|
33
|
+
* );
|
|
34
|
+
* }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
function useContentLink(options = {}) {
|
|
38
|
+
const { enabled = true, onNavigateTo, root } = options;
|
|
39
|
+
const controllerRef = (0, react_1.useRef)(null);
|
|
40
|
+
// Create/dispose controller based on enabled flag and dependencies
|
|
41
|
+
(0, react_1.useEffect)(() => {
|
|
42
|
+
if (!enabled) {
|
|
43
|
+
if (controllerRef.current) {
|
|
44
|
+
controllerRef.current.dispose();
|
|
45
|
+
controllerRef.current = null;
|
|
46
|
+
}
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
const controller = (0, content_link_1.createController)({
|
|
50
|
+
onNavigateTo,
|
|
51
|
+
root: (root === null || root === void 0 ? void 0 : root.current) || undefined,
|
|
52
|
+
});
|
|
53
|
+
controllerRef.current = controller;
|
|
54
|
+
return () => {
|
|
55
|
+
controller.dispose();
|
|
56
|
+
controllerRef.current = null;
|
|
57
|
+
};
|
|
58
|
+
}, [enabled, onNavigateTo, root]);
|
|
59
|
+
// Stable method references that call through to the controller
|
|
60
|
+
const enableClickToEdit = (0, react_1.useCallback)((opts) => {
|
|
61
|
+
var _a;
|
|
62
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.enableClickToEdit(opts);
|
|
63
|
+
}, []);
|
|
64
|
+
const disableClickToEdit = (0, react_1.useCallback)(() => {
|
|
65
|
+
var _a;
|
|
66
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.disableClickToEdit();
|
|
67
|
+
}, []);
|
|
68
|
+
const isClickToEditEnabled = (0, react_1.useCallback)(() => {
|
|
69
|
+
var _a, _b;
|
|
70
|
+
return (_b = (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.isClickToEditEnabled()) !== null && _b !== void 0 ? _b : false;
|
|
71
|
+
}, []);
|
|
72
|
+
const flashAll = (0, react_1.useCallback)((scrollToNearestTarget) => {
|
|
73
|
+
var _a;
|
|
74
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.flashAll(scrollToNearestTarget);
|
|
75
|
+
}, []);
|
|
76
|
+
const setCurrentPath = (0, react_1.useCallback)((path) => {
|
|
77
|
+
var _a;
|
|
78
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.setCurrentPath(path);
|
|
79
|
+
}, []);
|
|
80
|
+
return {
|
|
81
|
+
controller: controllerRef.current,
|
|
82
|
+
enableClickToEdit,
|
|
83
|
+
disableClickToEdit,
|
|
84
|
+
isClickToEditEnabled,
|
|
85
|
+
flashAll,
|
|
86
|
+
setCurrentPath,
|
|
87
|
+
};
|
|
88
|
+
}
|
|
89
|
+
exports.useContentLink = useContentLink;
|
|
90
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"}
|
|
@@ -43,7 +43,7 @@ function useSiteSearch(config) {
|
|
|
43
43
|
}
|
|
44
44
|
setResponse(undefined);
|
|
45
45
|
const request = {
|
|
46
|
-
filter: Object.assign({ query: state.query, locale: state.locale, build_trigger_id: config.buildTriggerId }, (config.fuzzySearch === true ? { fuzzy: true } : {})),
|
|
46
|
+
filter: Object.assign({ query: state.query, locale: state.locale, build_trigger_id: config.buildTriggerId, search_index_id: config.searchIndexId }, (config.fuzzySearch === true ? { fuzzy: true } : {})),
|
|
47
47
|
page: {
|
|
48
48
|
limit: resultsPerPage,
|
|
49
49
|
offset: resultsPerPage * state.page,
|
|
@@ -74,6 +74,7 @@ function useSiteSearch(config) {
|
|
|
74
74
|
resultsPerPage,
|
|
75
75
|
state,
|
|
76
76
|
config.buildTriggerId,
|
|
77
|
+
config.searchIndexId,
|
|
77
78
|
config.fuzzySearch,
|
|
78
79
|
config.client.config.apiToken,
|
|
79
80
|
]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useSiteSearch/index.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;AAEb,yDAAyD;AACzD,kDAA0B;AAC1B,iCAAyD;AACzD,gFAAsD;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useSiteSearch/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
+
var t = {};
|
|
4
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
+
t[p] = s[p];
|
|
6
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
+
t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
import { useEffect } from 'react';
|
|
14
|
+
import { useContentLink, } from '../useContentLink/index.js';
|
|
15
|
+
/**
|
|
16
|
+
* ContentLink component for Visual Editing with DatoCMS.
|
|
17
|
+
*
|
|
18
|
+
* This component enables Visual Editing by:
|
|
19
|
+
* - Detecting stega-encoded metadata in content and creating click-to-edit overlays
|
|
20
|
+
* - Integrating with DatoCMS Web Previews plugin for in-editor editing
|
|
21
|
+
* - Supporting Alt/Option key for temporary click-to-edit mode
|
|
22
|
+
* - Providing bidirectional communication between preview and DatoCMS editor
|
|
23
|
+
*
|
|
24
|
+
* ## Basic Usage (Standalone Website with Click-to-Edit)
|
|
25
|
+
*
|
|
26
|
+
* For standalone websites with click-to-edit overlays:
|
|
27
|
+
*
|
|
28
|
+
* ```tsx
|
|
29
|
+
* import { ContentLink } from 'react-datocms';
|
|
30
|
+
*
|
|
31
|
+
* function App() {
|
|
32
|
+
* return (
|
|
33
|
+
* <>
|
|
34
|
+
* <ContentLink enableClickToEdit={true} />
|
|
35
|
+
* {/* Your content with stega-encoded data *\/}
|
|
36
|
+
* </>
|
|
37
|
+
* );
|
|
38
|
+
* }
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* ## Web Previews Plugin Integration (Next.js Example)
|
|
42
|
+
*
|
|
43
|
+
* For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
|
|
44
|
+
*
|
|
45
|
+
* ```tsx
|
|
46
|
+
* 'use client';
|
|
47
|
+
* import { ContentLink } from 'react-datocms';
|
|
48
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
49
|
+
*
|
|
50
|
+
* export function VisualEditing() {
|
|
51
|
+
* const router = useRouter();
|
|
52
|
+
* const pathname = usePathname();
|
|
53
|
+
*
|
|
54
|
+
* return (
|
|
55
|
+
* <ContentLink
|
|
56
|
+
* onNavigateTo={(path) => router.push(path)}
|
|
57
|
+
* currentPath={pathname}
|
|
58
|
+
* />
|
|
59
|
+
* );
|
|
60
|
+
* }
|
|
61
|
+
* ```
|
|
62
|
+
*
|
|
63
|
+
* ## How Visual Editing Works
|
|
64
|
+
*
|
|
65
|
+
* 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
|
|
66
|
+
* when fetching content from DatoCMS to embed editing metadata.
|
|
67
|
+
*
|
|
68
|
+
* 2. **Add ContentLink component**: Place this component in your app to scan for encoded
|
|
69
|
+
* content and create overlays.
|
|
70
|
+
*
|
|
71
|
+
* 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
|
|
72
|
+
* for temporary editing mode.
|
|
73
|
+
*
|
|
74
|
+
* 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
|
|
75
|
+
*
|
|
76
|
+
* @param props - Configuration props for ContentLink
|
|
77
|
+
* @returns null - This component has no visual output
|
|
78
|
+
*/
|
|
79
|
+
export function ContentLink(props) {
|
|
80
|
+
const { currentPath, enableClickToEdit: enableClickToEditOptions } = props, useContentLinkOptions = __rest(props, ["currentPath", "enableClickToEdit"]);
|
|
81
|
+
const { enableClickToEdit, setCurrentPath } = useContentLink(useContentLinkOptions);
|
|
82
|
+
// Sync current path when it changes
|
|
83
|
+
useEffect(() => {
|
|
84
|
+
if (currentPath !== undefined) {
|
|
85
|
+
setCurrentPath(currentPath);
|
|
86
|
+
}
|
|
87
|
+
}, [currentPath, setCurrentPath]);
|
|
88
|
+
// Optionally enable click-to-edit on mount
|
|
89
|
+
useEffect(() => {
|
|
90
|
+
if (enableClickToEditOptions !== undefined) {
|
|
91
|
+
enableClickToEdit(enableClickToEditOptions === true ? undefined : enableClickToEditOptions);
|
|
92
|
+
}
|
|
93
|
+
}, [enableClickToEditOptions, enableClickToEdit]);
|
|
94
|
+
return null;
|
|
95
|
+
}
|
|
96
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,sBAAsB,EACtB,MAAM,EACN,cAAc,EACd,cAAc,GACf,MAAM,+CAA+C,CAAC;AACvD,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/StructuredText/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/esm/index.js
CHANGED
|
@@ -6,4 +6,6 @@ export * from './VideoPlayer/index.js';
|
|
|
6
6
|
export * from './useQuerySubscription/index.js';
|
|
7
7
|
export * from './useSiteSearch/index.js';
|
|
8
8
|
export * from './useVideoPlayer/index.js';
|
|
9
|
+
export * from './ContentLink/index.js';
|
|
10
|
+
export * from './useContentLink/index.js';
|
|
9
11
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +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"}
|
|
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;AAE1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC"}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { createController } from '@datocms/content-link';
|
|
3
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
4
|
+
export { decodeStega, stripStega } from '@datocms/content-link';
|
|
5
|
+
/**
|
|
6
|
+
* Hook to control the ContentLink controller for Visual Editing.
|
|
7
|
+
*
|
|
8
|
+
* This hook provides low-level access to the @datocms/content-link controller,
|
|
9
|
+
* allowing you to programmatically control click-to-edit overlays and
|
|
10
|
+
* communicate with the DatoCMS Web Previews plugin.
|
|
11
|
+
*
|
|
12
|
+
* @param options - Configuration options for the controller
|
|
13
|
+
* @returns An object containing the controller instance and its methods
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```tsx
|
|
17
|
+
* import { useContentLink } from 'react-datocms';
|
|
18
|
+
*
|
|
19
|
+
* function MyComponent() {
|
|
20
|
+
* const { enableClickToEdit, flashAll } = useContentLink({
|
|
21
|
+
* onNavigateTo: (path) => router.push(path),
|
|
22
|
+
* });
|
|
23
|
+
*
|
|
24
|
+
* return (
|
|
25
|
+
* <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
|
|
26
|
+
* Enable Editing
|
|
27
|
+
* </button>
|
|
28
|
+
* );
|
|
29
|
+
* }
|
|
30
|
+
* ```
|
|
31
|
+
*/
|
|
32
|
+
export function useContentLink(options = {}) {
|
|
33
|
+
const { enabled = true, onNavigateTo, root } = options;
|
|
34
|
+
const controllerRef = useRef(null);
|
|
35
|
+
// Create/dispose controller based on enabled flag and dependencies
|
|
36
|
+
useEffect(() => {
|
|
37
|
+
if (!enabled) {
|
|
38
|
+
if (controllerRef.current) {
|
|
39
|
+
controllerRef.current.dispose();
|
|
40
|
+
controllerRef.current = null;
|
|
41
|
+
}
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
const controller = createController({
|
|
45
|
+
onNavigateTo,
|
|
46
|
+
root: (root === null || root === void 0 ? void 0 : root.current) || undefined,
|
|
47
|
+
});
|
|
48
|
+
controllerRef.current = controller;
|
|
49
|
+
return () => {
|
|
50
|
+
controller.dispose();
|
|
51
|
+
controllerRef.current = null;
|
|
52
|
+
};
|
|
53
|
+
}, [enabled, onNavigateTo, root]);
|
|
54
|
+
// Stable method references that call through to the controller
|
|
55
|
+
const enableClickToEdit = useCallback((opts) => {
|
|
56
|
+
var _a;
|
|
57
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.enableClickToEdit(opts);
|
|
58
|
+
}, []);
|
|
59
|
+
const disableClickToEdit = useCallback(() => {
|
|
60
|
+
var _a;
|
|
61
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.disableClickToEdit();
|
|
62
|
+
}, []);
|
|
63
|
+
const isClickToEditEnabled = useCallback(() => {
|
|
64
|
+
var _a, _b;
|
|
65
|
+
return (_b = (_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.isClickToEditEnabled()) !== null && _b !== void 0 ? _b : false;
|
|
66
|
+
}, []);
|
|
67
|
+
const flashAll = useCallback((scrollToNearestTarget) => {
|
|
68
|
+
var _a;
|
|
69
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.flashAll(scrollToNearestTarget);
|
|
70
|
+
}, []);
|
|
71
|
+
const setCurrentPath = useCallback((path) => {
|
|
72
|
+
var _a;
|
|
73
|
+
(_a = controllerRef.current) === null || _a === void 0 ? void 0 : _a.setCurrentPath(path);
|
|
74
|
+
}, []);
|
|
75
|
+
return {
|
|
76
|
+
controller: controllerRef.current,
|
|
77
|
+
enableClickToEdit,
|
|
78
|
+
disableClickToEdit,
|
|
79
|
+
isClickToEditEnabled,
|
|
80
|
+
flashAll,
|
|
81
|
+
setCurrentPath,
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
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"}
|
|
@@ -37,7 +37,7 @@ export function useSiteSearch(config) {
|
|
|
37
37
|
}
|
|
38
38
|
setResponse(undefined);
|
|
39
39
|
const request = {
|
|
40
|
-
filter: Object.assign({ query: state.query, locale: state.locale, build_trigger_id: config.buildTriggerId }, (config.fuzzySearch === true ? { fuzzy: true } : {})),
|
|
40
|
+
filter: Object.assign({ query: state.query, locale: state.locale, build_trigger_id: config.buildTriggerId, search_index_id: config.searchIndexId }, (config.fuzzySearch === true ? { fuzzy: true } : {})),
|
|
41
41
|
page: {
|
|
42
42
|
limit: resultsPerPage,
|
|
43
43
|
offset: resultsPerPage * state.page,
|
|
@@ -68,6 +68,7 @@ export function useSiteSearch(config) {
|
|
|
68
68
|
resultsPerPage,
|
|
69
69
|
state,
|
|
70
70
|
config.buildTriggerId,
|
|
71
|
+
config.searchIndexId,
|
|
71
72
|
config.fuzzySearch,
|
|
72
73
|
config.client.config.apiToken,
|
|
73
74
|
]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useSiteSearch/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;;;AAEb,yDAAyD;AACzD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useSiteSearch/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import { type UseContentLinkOptions } from '../useContentLink/index.js';
|
|
2
|
+
export type ContentLinkProps = UseContentLinkOptions & {
|
|
3
|
+
/** Current pathname to sync with Web Previews plugin */
|
|
4
|
+
currentPath?: string;
|
|
5
|
+
/** Enable click-to-edit on mount. Pass true for default behavior or an object with scrollToNearestTarget. If undefined, click-to-edit is disabled. */
|
|
6
|
+
enableClickToEdit?: true | {
|
|
7
|
+
scrollToNearestTarget: true;
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* ContentLink component for Visual Editing with DatoCMS.
|
|
12
|
+
*
|
|
13
|
+
* This component enables Visual Editing by:
|
|
14
|
+
* - Detecting stega-encoded metadata in content and creating click-to-edit overlays
|
|
15
|
+
* - Integrating with DatoCMS Web Previews plugin for in-editor editing
|
|
16
|
+
* - Supporting Alt/Option key for temporary click-to-edit mode
|
|
17
|
+
* - Providing bidirectional communication between preview and DatoCMS editor
|
|
18
|
+
*
|
|
19
|
+
* ## Basic Usage (Standalone Website with Click-to-Edit)
|
|
20
|
+
*
|
|
21
|
+
* For standalone websites with click-to-edit overlays:
|
|
22
|
+
*
|
|
23
|
+
* ```tsx
|
|
24
|
+
* import { ContentLink } from 'react-datocms';
|
|
25
|
+
*
|
|
26
|
+
* function App() {
|
|
27
|
+
* return (
|
|
28
|
+
* <>
|
|
29
|
+
* <ContentLink enableClickToEdit={true} />
|
|
30
|
+
* {/* Your content with stega-encoded data *\/}
|
|
31
|
+
* </>
|
|
32
|
+
* );
|
|
33
|
+
* }
|
|
34
|
+
* ```
|
|
35
|
+
*
|
|
36
|
+
* ## Web Previews Plugin Integration (Next.js Example)
|
|
37
|
+
*
|
|
38
|
+
* For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
|
|
39
|
+
*
|
|
40
|
+
* ```tsx
|
|
41
|
+
* 'use client';
|
|
42
|
+
* import { ContentLink } from 'react-datocms';
|
|
43
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
44
|
+
*
|
|
45
|
+
* export function VisualEditing() {
|
|
46
|
+
* const router = useRouter();
|
|
47
|
+
* const pathname = usePathname();
|
|
48
|
+
*
|
|
49
|
+
* return (
|
|
50
|
+
* <ContentLink
|
|
51
|
+
* onNavigateTo={(path) => router.push(path)}
|
|
52
|
+
* currentPath={pathname}
|
|
53
|
+
* />
|
|
54
|
+
* );
|
|
55
|
+
* }
|
|
56
|
+
* ```
|
|
57
|
+
*
|
|
58
|
+
* ## How Visual Editing Works
|
|
59
|
+
*
|
|
60
|
+
* 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
|
|
61
|
+
* when fetching content from DatoCMS to embed editing metadata.
|
|
62
|
+
*
|
|
63
|
+
* 2. **Add ContentLink component**: Place this component in your app to scan for encoded
|
|
64
|
+
* content and create overlays.
|
|
65
|
+
*
|
|
66
|
+
* 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
|
|
67
|
+
* for temporary editing mode.
|
|
68
|
+
*
|
|
69
|
+
* 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
|
|
70
|
+
*
|
|
71
|
+
* @param props - Configuration props for ContentLink
|
|
72
|
+
* @returns null - This component has no visual output
|
|
73
|
+
*/
|
|
74
|
+
export declare function ContentLink(props: ContentLinkProps): null;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type RenderMarkRule, type TransformMetaFn, type TransformedMeta, renderMarkRule, renderNodeRule } from 'datocms-structured-text-generic-html-renderer';
|
|
2
|
-
import { type Node, RenderError, type RenderResult, type RenderRule, type Document as StructuredTextDocument, type
|
|
2
|
+
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';
|
|
3
3
|
import { type ReactElement } from 'react';
|
|
4
4
|
export { renderNodeRule, renderMarkRule, RenderError };
|
|
5
5
|
export type { StructuredTextDocument, CdaStructuredTextValue, TypesafeCdaStructuredTextValue, CdaStructuredTextRecord, };
|
package/dist/types/index.d.ts
CHANGED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type Controller } from '@datocms/content-link';
|
|
3
|
+
export type { Controller } from '@datocms/content-link';
|
|
4
|
+
export { decodeStega, stripStega } from '@datocms/content-link';
|
|
5
|
+
export type UseContentLinkOptions = {
|
|
6
|
+
/** Whether the controller is enabled (default: true) */
|
|
7
|
+
enabled?: boolean;
|
|
8
|
+
/** Callback when Web Previews plugin requests navigation */
|
|
9
|
+
onNavigateTo?: (path: string) => void;
|
|
10
|
+
/** Ref to limit scanning to this root instead of document */
|
|
11
|
+
root?: React.RefObject<ParentNode>;
|
|
12
|
+
};
|
|
13
|
+
export type UseContentLinkResult = {
|
|
14
|
+
/** The controller instance, or null if disabled */
|
|
15
|
+
controller: Controller | null;
|
|
16
|
+
/** Enable click-to-edit overlays */
|
|
17
|
+
enableClickToEdit: (options?: {
|
|
18
|
+
scrollToNearestTarget: boolean;
|
|
19
|
+
}) => void;
|
|
20
|
+
/** Disable click-to-edit overlays */
|
|
21
|
+
disableClickToEdit: () => void;
|
|
22
|
+
/** Check if click-to-edit is enabled */
|
|
23
|
+
isClickToEditEnabled: () => boolean;
|
|
24
|
+
/** Highlight all editable elements */
|
|
25
|
+
flashAll: (scrollToNearestTarget?: boolean) => void;
|
|
26
|
+
/** Notify Web Previews plugin of current path */
|
|
27
|
+
setCurrentPath: (path: string) => void;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Hook to control the ContentLink controller for Visual Editing.
|
|
31
|
+
*
|
|
32
|
+
* This hook provides low-level access to the @datocms/content-link controller,
|
|
33
|
+
* allowing you to programmatically control click-to-edit overlays and
|
|
34
|
+
* communicate with the DatoCMS Web Previews plugin.
|
|
35
|
+
*
|
|
36
|
+
* @param options - Configuration options for the controller
|
|
37
|
+
* @returns An object containing the controller instance and its methods
|
|
38
|
+
*
|
|
39
|
+
* @example
|
|
40
|
+
* ```tsx
|
|
41
|
+
* import { useContentLink } from 'react-datocms';
|
|
42
|
+
*
|
|
43
|
+
* function MyComponent() {
|
|
44
|
+
* const { enableClickToEdit, flashAll } = useContentLink({
|
|
45
|
+
* onNavigateTo: (path) => router.push(path),
|
|
46
|
+
* });
|
|
47
|
+
*
|
|
48
|
+
* return (
|
|
49
|
+
* <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
|
|
50
|
+
* Enable Editing
|
|
51
|
+
* </button>
|
|
52
|
+
* );
|
|
53
|
+
* }
|
|
54
|
+
* ```
|
|
55
|
+
*/
|
|
56
|
+
export declare function useContentLink(options?: UseContentLinkOptions): UseContentLinkResult;
|
|
@@ -9,6 +9,7 @@ type SearchResultInstancesHrefSchema = {
|
|
|
9
9
|
fuzzy?: boolean;
|
|
10
10
|
query: string;
|
|
11
11
|
build_trigger_id?: string;
|
|
12
|
+
search_index_id?: string;
|
|
12
13
|
locale?: string;
|
|
13
14
|
[k: string]: unknown;
|
|
14
15
|
};
|
|
@@ -45,7 +46,8 @@ declare class GenericClient {
|
|
|
45
46
|
type Highlighter = (match: string, key: string, context: 'title' | 'bodyExcerpt') => React.ReactNode;
|
|
46
47
|
export type UseSiteSearchConfig<Client extends GenericClient> = {
|
|
47
48
|
client: Client;
|
|
48
|
-
buildTriggerId
|
|
49
|
+
buildTriggerId?: string;
|
|
50
|
+
searchIndexId?: string;
|
|
49
51
|
fuzzySearch?: boolean;
|
|
50
52
|
resultsPerPage?: number;
|
|
51
53
|
highlightMatch?: Highlighter;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-datocms",
|
|
3
|
-
"version": "7.2.
|
|
3
|
+
"version": "7.2.5-0",
|
|
4
4
|
"engines": {
|
|
5
5
|
"node": ">=8.0.0"
|
|
6
6
|
},
|
|
@@ -48,6 +48,16 @@
|
|
|
48
48
|
"require": "./dist/cjs/useVideoPlayer/index.js",
|
|
49
49
|
"import": "./dist/esm/useVideoPlayer/index.js",
|
|
50
50
|
"types": "./dist/types/useVideoPlayer/index.d.ts"
|
|
51
|
+
},
|
|
52
|
+
"./use-content-link": {
|
|
53
|
+
"require": "./dist/cjs/useContentLink/index.js",
|
|
54
|
+
"import": "./dist/esm/useContentLink/index.js",
|
|
55
|
+
"types": "./dist/types/useContentLink/index.d.ts"
|
|
56
|
+
},
|
|
57
|
+
"./content-link": {
|
|
58
|
+
"require": "./dist/cjs/ContentLink/index.js",
|
|
59
|
+
"import": "./dist/esm/ContentLink/index.js",
|
|
60
|
+
"types": "./dist/types/ContentLink/index.d.ts"
|
|
51
61
|
}
|
|
52
62
|
},
|
|
53
63
|
"typesVersions": {
|
|
@@ -75,6 +85,12 @@
|
|
|
75
85
|
],
|
|
76
86
|
"use-video-player": [
|
|
77
87
|
"./dist/types/useVideoPlayer/index.d.ts"
|
|
88
|
+
],
|
|
89
|
+
"use-content-link": [
|
|
90
|
+
"./dist/types/useContentLink/index.d.ts"
|
|
91
|
+
],
|
|
92
|
+
"content-link": [
|
|
93
|
+
"./dist/types/ContentLink/index.d.ts"
|
|
78
94
|
]
|
|
79
95
|
}
|
|
80
96
|
},
|
|
@@ -133,6 +149,7 @@
|
|
|
133
149
|
"react": ">= 16.12.0 || ^19.0.0-rc"
|
|
134
150
|
},
|
|
135
151
|
"dependencies": {
|
|
152
|
+
"@datocms/content-link": "^0.3.6",
|
|
136
153
|
"@mux/mux-player-react": "*",
|
|
137
154
|
"datocms-listen": "^0.1.9",
|
|
138
155
|
"datocms-structured-text-generic-html-renderer": "^5.0.0",
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { useEffect } from 'react';
|
|
4
|
+
import {
|
|
5
|
+
type UseContentLinkOptions,
|
|
6
|
+
useContentLink,
|
|
7
|
+
} from '../useContentLink/index.js';
|
|
8
|
+
|
|
9
|
+
export type ContentLinkProps = UseContentLinkOptions & {
|
|
10
|
+
/** Current pathname to sync with Web Previews plugin */
|
|
11
|
+
currentPath?: string;
|
|
12
|
+
/** Enable click-to-edit on mount. Pass true for default behavior or an object with scrollToNearestTarget. If undefined, click-to-edit is disabled. */
|
|
13
|
+
enableClickToEdit?: true | { scrollToNearestTarget: true };
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* ContentLink component for Visual Editing with DatoCMS.
|
|
18
|
+
*
|
|
19
|
+
* This component enables Visual Editing by:
|
|
20
|
+
* - Detecting stega-encoded metadata in content and creating click-to-edit overlays
|
|
21
|
+
* - Integrating with DatoCMS Web Previews plugin for in-editor editing
|
|
22
|
+
* - Supporting Alt/Option key for temporary click-to-edit mode
|
|
23
|
+
* - Providing bidirectional communication between preview and DatoCMS editor
|
|
24
|
+
*
|
|
25
|
+
* ## Basic Usage (Standalone Website with Click-to-Edit)
|
|
26
|
+
*
|
|
27
|
+
* For standalone websites with click-to-edit overlays:
|
|
28
|
+
*
|
|
29
|
+
* ```tsx
|
|
30
|
+
* import { ContentLink } from 'react-datocms';
|
|
31
|
+
*
|
|
32
|
+
* function App() {
|
|
33
|
+
* return (
|
|
34
|
+
* <>
|
|
35
|
+
* <ContentLink enableClickToEdit={true} />
|
|
36
|
+
* {/* Your content with stega-encoded data *\/}
|
|
37
|
+
* </>
|
|
38
|
+
* );
|
|
39
|
+
* }
|
|
40
|
+
* ```
|
|
41
|
+
*
|
|
42
|
+
* ## Web Previews Plugin Integration (Next.js Example)
|
|
43
|
+
*
|
|
44
|
+
* For integration with DatoCMS Web Previews plugin, provide navigation callbacks:
|
|
45
|
+
*
|
|
46
|
+
* ```tsx
|
|
47
|
+
* 'use client';
|
|
48
|
+
* import { ContentLink } from 'react-datocms';
|
|
49
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
50
|
+
*
|
|
51
|
+
* export function VisualEditing() {
|
|
52
|
+
* const router = useRouter();
|
|
53
|
+
* const pathname = usePathname();
|
|
54
|
+
*
|
|
55
|
+
* return (
|
|
56
|
+
* <ContentLink
|
|
57
|
+
* onNavigateTo={(path) => router.push(path)}
|
|
58
|
+
* currentPath={pathname}
|
|
59
|
+
* />
|
|
60
|
+
* );
|
|
61
|
+
* }
|
|
62
|
+
* ```
|
|
63
|
+
*
|
|
64
|
+
* ## How Visual Editing Works
|
|
65
|
+
*
|
|
66
|
+
* 1. **Fetch content with stega encoding**: Use the `contentLink` and `baseEditingUrl` options
|
|
67
|
+
* when fetching content from DatoCMS to embed editing metadata.
|
|
68
|
+
*
|
|
69
|
+
* 2. **Add ContentLink component**: Place this component in your app to scan for encoded
|
|
70
|
+
* content and create overlays.
|
|
71
|
+
*
|
|
72
|
+
* 3. **Enable editing**: Either set `enableClickToEdit={true}` prop or hold Alt/Option key
|
|
73
|
+
* for temporary editing mode.
|
|
74
|
+
*
|
|
75
|
+
* 4. **Click to edit**: Click on any content to open the DatoCMS editor at that field.
|
|
76
|
+
*
|
|
77
|
+
* @param props - Configuration props for ContentLink
|
|
78
|
+
* @returns null - This component has no visual output
|
|
79
|
+
*/
|
|
80
|
+
export function ContentLink(props: ContentLinkProps): null {
|
|
81
|
+
const {
|
|
82
|
+
currentPath,
|
|
83
|
+
enableClickToEdit: enableClickToEditOptions,
|
|
84
|
+
...useContentLinkOptions
|
|
85
|
+
} = props;
|
|
86
|
+
|
|
87
|
+
const { enableClickToEdit, setCurrentPath } = useContentLink(
|
|
88
|
+
useContentLinkOptions,
|
|
89
|
+
);
|
|
90
|
+
|
|
91
|
+
// Sync current path when it changes
|
|
92
|
+
useEffect(() => {
|
|
93
|
+
if (currentPath !== undefined) {
|
|
94
|
+
setCurrentPath(currentPath);
|
|
95
|
+
}
|
|
96
|
+
}, [currentPath, setCurrentPath]);
|
|
97
|
+
|
|
98
|
+
// Optionally enable click-to-edit on mount
|
|
99
|
+
useEffect(() => {
|
|
100
|
+
if (enableClickToEditOptions !== undefined) {
|
|
101
|
+
enableClickToEdit(
|
|
102
|
+
enableClickToEditOptions === true ? undefined : enableClickToEditOptions
|
|
103
|
+
);
|
|
104
|
+
}
|
|
105
|
+
}, [enableClickToEditOptions, enableClickToEdit]);
|
|
106
|
+
|
|
107
|
+
return null;
|
|
108
|
+
}
|
|
@@ -8,16 +8,16 @@ import {
|
|
|
8
8
|
renderNodeRule,
|
|
9
9
|
} from 'datocms-structured-text-generic-html-renderer';
|
|
10
10
|
import {
|
|
11
|
+
type CdaStructuredTextRecord,
|
|
12
|
+
type CdaStructuredTextValue,
|
|
11
13
|
type Node,
|
|
12
14
|
RenderError,
|
|
13
15
|
type RenderResult,
|
|
14
16
|
type RenderRule,
|
|
15
17
|
type Document as StructuredTextDocument,
|
|
16
|
-
type CdaStructuredTextValue,
|
|
17
|
-
type CdaStructuredTextRecord,
|
|
18
|
-
type TypesafeCdaStructuredTextValue,
|
|
19
18
|
type StructuredText as StructuredTextGraphQlResponse,
|
|
20
19
|
type Record as StructuredTextGraphQlResponseRecord,
|
|
20
|
+
type TypesafeCdaStructuredTextValue,
|
|
21
21
|
type TypesafeStructuredText as TypesafeStructuredTextGraphQlResponse,
|
|
22
22
|
isBlock,
|
|
23
23
|
isInlineBlock,
|
package/src/index.ts
CHANGED
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { type Controller, createController } from '@datocms/content-link';
|
|
4
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
5
|
+
|
|
6
|
+
// Re-export types and utilities from @datocms/content-link for convenience
|
|
7
|
+
export type { Controller } from '@datocms/content-link';
|
|
8
|
+
export { decodeStega, stripStega } from '@datocms/content-link';
|
|
9
|
+
|
|
10
|
+
export type UseContentLinkOptions = {
|
|
11
|
+
/** Whether the controller is enabled (default: true) */
|
|
12
|
+
enabled?: boolean;
|
|
13
|
+
/** Callback when Web Previews plugin requests navigation */
|
|
14
|
+
onNavigateTo?: (path: string) => void;
|
|
15
|
+
/** Ref to limit scanning to this root instead of document */
|
|
16
|
+
root?: React.RefObject<ParentNode>;
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
export type UseContentLinkResult = {
|
|
20
|
+
/** The controller instance, or null if disabled */
|
|
21
|
+
controller: Controller | null;
|
|
22
|
+
/** Enable click-to-edit overlays */
|
|
23
|
+
enableClickToEdit: (options?: { scrollToNearestTarget: boolean }) => void;
|
|
24
|
+
/** Disable click-to-edit overlays */
|
|
25
|
+
disableClickToEdit: () => void;
|
|
26
|
+
/** Check if click-to-edit is enabled */
|
|
27
|
+
isClickToEditEnabled: () => boolean;
|
|
28
|
+
/** Highlight all editable elements */
|
|
29
|
+
flashAll: (scrollToNearestTarget?: boolean) => void;
|
|
30
|
+
/** Notify Web Previews plugin of current path */
|
|
31
|
+
setCurrentPath: (path: string) => void;
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* Hook to control the ContentLink controller for Visual Editing.
|
|
36
|
+
*
|
|
37
|
+
* This hook provides low-level access to the @datocms/content-link controller,
|
|
38
|
+
* allowing you to programmatically control click-to-edit overlays and
|
|
39
|
+
* communicate with the DatoCMS Web Previews plugin.
|
|
40
|
+
*
|
|
41
|
+
* @param options - Configuration options for the controller
|
|
42
|
+
* @returns An object containing the controller instance and its methods
|
|
43
|
+
*
|
|
44
|
+
* @example
|
|
45
|
+
* ```tsx
|
|
46
|
+
* import { useContentLink } from 'react-datocms';
|
|
47
|
+
*
|
|
48
|
+
* function MyComponent() {
|
|
49
|
+
* const { enableClickToEdit, flashAll } = useContentLink({
|
|
50
|
+
* onNavigateTo: (path) => router.push(path),
|
|
51
|
+
* });
|
|
52
|
+
*
|
|
53
|
+
* return (
|
|
54
|
+
* <button onClick={() => enableClickToEdit({ scrollToNearestTarget: true })}>
|
|
55
|
+
* Enable Editing
|
|
56
|
+
* </button>
|
|
57
|
+
* );
|
|
58
|
+
* }
|
|
59
|
+
* ```
|
|
60
|
+
*/
|
|
61
|
+
export function useContentLink(
|
|
62
|
+
options: UseContentLinkOptions = {},
|
|
63
|
+
): UseContentLinkResult {
|
|
64
|
+
const { enabled = true, onNavigateTo, root } = options;
|
|
65
|
+
|
|
66
|
+
const controllerRef = useRef<Controller | null>(null);
|
|
67
|
+
|
|
68
|
+
// Create/dispose controller based on enabled flag and dependencies
|
|
69
|
+
useEffect(() => {
|
|
70
|
+
if (!enabled) {
|
|
71
|
+
if (controllerRef.current) {
|
|
72
|
+
controllerRef.current.dispose();
|
|
73
|
+
controllerRef.current = null;
|
|
74
|
+
}
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
const controller = createController({
|
|
79
|
+
onNavigateTo,
|
|
80
|
+
root: root?.current || undefined,
|
|
81
|
+
});
|
|
82
|
+
|
|
83
|
+
controllerRef.current = controller;
|
|
84
|
+
|
|
85
|
+
return () => {
|
|
86
|
+
controller.dispose();
|
|
87
|
+
controllerRef.current = null;
|
|
88
|
+
};
|
|
89
|
+
}, [enabled, onNavigateTo, root]);
|
|
90
|
+
|
|
91
|
+
// Stable method references that call through to the controller
|
|
92
|
+
const enableClickToEdit = useCallback(
|
|
93
|
+
(opts?: { scrollToNearestTarget: boolean }) => {
|
|
94
|
+
controllerRef.current?.enableClickToEdit(opts);
|
|
95
|
+
},
|
|
96
|
+
[],
|
|
97
|
+
);
|
|
98
|
+
|
|
99
|
+
const disableClickToEdit = useCallback(() => {
|
|
100
|
+
controllerRef.current?.disableClickToEdit();
|
|
101
|
+
}, []);
|
|
102
|
+
|
|
103
|
+
const isClickToEditEnabled = useCallback(() => {
|
|
104
|
+
return controllerRef.current?.isClickToEditEnabled() ?? false;
|
|
105
|
+
}, []);
|
|
106
|
+
|
|
107
|
+
const flashAll = useCallback((scrollToNearestTarget?: boolean) => {
|
|
108
|
+
controllerRef.current?.flashAll(scrollToNearestTarget);
|
|
109
|
+
}, []);
|
|
110
|
+
|
|
111
|
+
const setCurrentPath = useCallback((path: string) => {
|
|
112
|
+
controllerRef.current?.setCurrentPath(path);
|
|
113
|
+
}, []);
|
|
114
|
+
|
|
115
|
+
return {
|
|
116
|
+
controller: controllerRef.current,
|
|
117
|
+
enableClickToEdit,
|
|
118
|
+
disableClickToEdit,
|
|
119
|
+
isClickToEditEnabled,
|
|
120
|
+
flashAll,
|
|
121
|
+
setCurrentPath,
|
|
122
|
+
};
|
|
123
|
+
}
|
|
@@ -15,6 +15,7 @@ type SearchResultInstancesHrefSchema = {
|
|
|
15
15
|
fuzzy?: boolean;
|
|
16
16
|
query: string;
|
|
17
17
|
build_trigger_id?: string;
|
|
18
|
+
search_index_id?: string;
|
|
18
19
|
locale?: string;
|
|
19
20
|
[k: string]: unknown;
|
|
20
21
|
};
|
|
@@ -62,7 +63,8 @@ type Highlighter = (
|
|
|
62
63
|
|
|
63
64
|
export type UseSiteSearchConfig<Client extends GenericClient> = {
|
|
64
65
|
client: Client;
|
|
65
|
-
buildTriggerId
|
|
66
|
+
buildTriggerId?: string;
|
|
67
|
+
searchIndexId?: string;
|
|
66
68
|
fuzzySearch?: boolean;
|
|
67
69
|
resultsPerPage?: number;
|
|
68
70
|
highlightMatch?: Highlighter;
|
|
@@ -161,6 +163,7 @@ export function useSiteSearch<Client extends GenericClient>(
|
|
|
161
163
|
query: state.query,
|
|
162
164
|
locale: state.locale,
|
|
163
165
|
build_trigger_id: config.buildTriggerId,
|
|
166
|
+
search_index_id: config.searchIndexId,
|
|
164
167
|
...(config.fuzzySearch === true ? { fuzzy: true } : {}),
|
|
165
168
|
},
|
|
166
169
|
page: {
|
|
@@ -196,6 +199,7 @@ export function useSiteSearch<Client extends GenericClient>(
|
|
|
196
199
|
resultsPerPage,
|
|
197
200
|
state,
|
|
198
201
|
config.buildTriggerId,
|
|
202
|
+
config.searchIndexId,
|
|
199
203
|
config.fuzzySearch,
|
|
200
204
|
config.client.config.apiToken,
|
|
201
205
|
]);
|