@localess/react 3.0.1-dev.20260408183951 → 3.0.1-dev.20260410070330
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 +189 -7
- package/dist/chunk-AJP75NRT.mjs +56 -0
- package/dist/chunk-ETSLIILF.mjs +149 -0
- package/dist/chunk-V6JSXN66.mjs +76 -0
- package/dist/index.d.mts +4 -89
- package/dist/index.d.ts +4 -89
- package/dist/index.js +73 -89
- package/dist/index.mjs +25 -210
- package/dist/richtext-XH7pH80J.d.mts +82 -0
- package/dist/richtext-XH7pH80J.d.ts +82 -0
- package/dist/rsc.d.mts +15 -0
- package/dist/rsc.d.ts +15 -0
- package/dist/rsc.js +315 -0
- package/dist/rsc.mjs +66 -0
- package/dist/ssr.d.mts +18 -0
- package/dist/ssr.d.ts +18 -0
- package/dist/ssr.js +223 -0
- package/dist/ssr.mjs +38 -0
- package/package.json +13 -3
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
export { Content, ContentAsset, ContentData, ContentDataField, ContentDataSchema, ContentLink, ContentMetadata, ContentReference, ContentRichText, EventCallback, EventToApp, EventToAppType, Links, LocalessClient, LocalessSync, References, Translations, isBrowser, isIframe, isServer, localessEditable, localessEditableField } from '@localess/client';
|
|
1
|
+
export { L as LocalessOptions, f as findLink, g as getComponent, a as getFallbackComponent, b as getLocalessClient, i as isSyncEnabled, l as localessInit, r as registerComponent, c as renderRichTextToReact, d as resolveAsset, s as setComponents, e as setFallbackComponent, u as unregisterComponent } from './richtext-XH7pH80J.js';
|
|
3
2
|
import * as React from 'react';
|
|
4
|
-
import
|
|
3
|
+
import { ContentData, Links, References, ContentFetchParams, Content } from '@localess/client';
|
|
4
|
+
export { Content, ContentAsset, ContentData, ContentDataField, ContentDataSchema, ContentLink, ContentMetadata, ContentReference, ContentRichText, EventCallback, EventToApp, EventToAppType, Links, LocalessClient, LocalessSync, References, Translations, isBrowser, isIframe, isServer, localessEditable, localessEditableField } from '@localess/client';
|
|
5
5
|
|
|
6
6
|
type LocalessComponentProps<T extends ContentData = ContentData> = {
|
|
7
7
|
data: T;
|
|
@@ -10,92 +10,7 @@ type LocalessComponentProps<T extends ContentData = ContentData> = {
|
|
|
10
10
|
};
|
|
11
11
|
declare const LocalessComponent: React.ForwardRefExoticComponent<LocalessComponentProps<ContentData> & React.RefAttributes<HTMLElement>>;
|
|
12
12
|
|
|
13
|
-
type LocalessDocumentProps<T extends ContentData = ContentData> = {
|
|
14
|
-
data: T;
|
|
15
|
-
links?: Links;
|
|
16
|
-
references?: References;
|
|
17
|
-
};
|
|
18
|
-
declare const LocalessDocument: React.ForwardRefExoticComponent<LocalessDocumentProps<ContentData> & React.RefAttributes<HTMLElement>>;
|
|
19
|
-
|
|
20
|
-
type LocalessOptions = LocalessClientOptions & {
|
|
21
|
-
/**
|
|
22
|
-
* Components mapping for Localess Component integration
|
|
23
|
-
*/
|
|
24
|
-
components?: Record<string, React__default.ElementType>;
|
|
25
|
-
/**
|
|
26
|
-
* Component used if expected key didn't return anything
|
|
27
|
-
*/
|
|
28
|
-
fallbackComponent?: React__default.ElementType;
|
|
29
|
-
/**
|
|
30
|
-
* Load Sync Script, for Visual Editor integration
|
|
31
|
-
*/
|
|
32
|
-
enableSync?: boolean;
|
|
33
|
-
};
|
|
34
|
-
|
|
35
13
|
type UseLocalessOptions = ContentFetchParams & {};
|
|
36
14
|
declare const useLocaless: <T extends ContentData = ContentData>(slug: string | string[], options?: UseLocalessOptions) => Content<T> | undefined;
|
|
37
15
|
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
/**
|
|
41
|
-
* Render Localess Rich Text content to React elements
|
|
42
|
-
* @param content - The Rich Text content to render
|
|
43
|
-
* @returns React.ReactNode - The rendered React elements
|
|
44
|
-
*/
|
|
45
|
-
declare function renderRichTextToReact(content: ContentRichText): React__default.ReactNode;
|
|
46
|
-
|
|
47
|
-
/**
|
|
48
|
-
* Initialize Localess Client
|
|
49
|
-
* @param options
|
|
50
|
-
* @returns LocalessClient
|
|
51
|
-
*/
|
|
52
|
-
declare function localessInit(options: LocalessOptions): LocalessClient;
|
|
53
|
-
/**
|
|
54
|
-
* Get Localess Client
|
|
55
|
-
* @returns LocalessClient
|
|
56
|
-
*/
|
|
57
|
-
declare function getLocalessClient(): LocalessClient;
|
|
58
|
-
/**
|
|
59
|
-
* Register Component
|
|
60
|
-
* @param key - component key
|
|
61
|
-
* @param component - React Component
|
|
62
|
-
*/
|
|
63
|
-
declare function registerComponent(key: string, component: React__default.ElementType): void;
|
|
64
|
-
/**
|
|
65
|
-
* Unregister Component
|
|
66
|
-
* @param key - component key
|
|
67
|
-
*/
|
|
68
|
-
declare function unregisterComponent(key: string): void;
|
|
69
|
-
/**
|
|
70
|
-
* Set Components
|
|
71
|
-
* @param components - Record of components
|
|
72
|
-
*/
|
|
73
|
-
declare function setComponents(components: Record<string, React__default.ElementType>): void;
|
|
74
|
-
/**
|
|
75
|
-
* Get Component
|
|
76
|
-
* @param key - component key
|
|
77
|
-
* @returns React Component
|
|
78
|
-
*/
|
|
79
|
-
declare function getComponent(key: string): React__default.ElementType | undefined;
|
|
80
|
-
/**
|
|
81
|
-
* Set Fallback Component
|
|
82
|
-
* @param fallbackComponent
|
|
83
|
-
*/
|
|
84
|
-
declare function setFallbackComponent(fallbackComponent: React__default.ElementType): void;
|
|
85
|
-
/**
|
|
86
|
-
* Get Fallback Component
|
|
87
|
-
* @returns React Component
|
|
88
|
-
*/
|
|
89
|
-
declare function getFallbackComponent(): React__default.ElementType | undefined;
|
|
90
|
-
/**
|
|
91
|
-
* Check if Sync is enabled
|
|
92
|
-
*/
|
|
93
|
-
declare function isSyncEnabled(): boolean;
|
|
94
|
-
/**
|
|
95
|
-
* Resolve Asset URL
|
|
96
|
-
* @param asset - ContentAsset
|
|
97
|
-
* @returns Asset URL
|
|
98
|
-
*/
|
|
99
|
-
declare function resolveAsset(asset: ContentAsset): string;
|
|
100
|
-
|
|
101
|
-
export { LocalessComponent, type LocalessComponentProps, LocalessDocument, type LocalessDocumentProps, type LocalessOptions, type UseLocalessOptions, findLink, getComponent, getFallbackComponent, getLocalessClient, isSyncEnabled, localessInit, registerComponent, renderRichTextToReact, resolveAsset, setComponents, setFallbackComponent, unregisterComponent, useLocaless };
|
|
16
|
+
export { LocalessComponent, type LocalessComponentProps, type UseLocalessOptions, useLocaless };
|
package/dist/index.js
CHANGED
|
@@ -18,20 +18,19 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
|
|
20
20
|
// src/index.ts
|
|
21
|
-
var
|
|
22
|
-
__export(
|
|
21
|
+
var src_exports = {};
|
|
22
|
+
__export(src_exports, {
|
|
23
23
|
LocalessComponent: () => LocalessComponent,
|
|
24
|
-
LocalessDocument: () => LocalessDocument,
|
|
25
24
|
findLink: () => findLink,
|
|
26
25
|
getComponent: () => getComponent,
|
|
27
26
|
getFallbackComponent: () => getFallbackComponent,
|
|
28
27
|
getLocalessClient: () => getLocalessClient,
|
|
29
|
-
isBrowser: () =>
|
|
30
|
-
isIframe: () =>
|
|
31
|
-
isServer: () =>
|
|
28
|
+
isBrowser: () => import_client2.isBrowser,
|
|
29
|
+
isIframe: () => import_client2.isIframe,
|
|
30
|
+
isServer: () => import_client2.isServer,
|
|
32
31
|
isSyncEnabled: () => isSyncEnabled,
|
|
33
|
-
localessEditable: () =>
|
|
34
|
-
localessEditableField: () =>
|
|
32
|
+
localessEditable: () => import_client2.localessEditable,
|
|
33
|
+
localessEditableField: () => import_client2.localessEditableField,
|
|
35
34
|
localessInit: () => localessInit,
|
|
36
35
|
registerComponent: () => registerComponent,
|
|
37
36
|
renderRichTextToReact: () => renderRichTextToReact,
|
|
@@ -41,19 +40,16 @@ __export(index_exports, {
|
|
|
41
40
|
unregisterComponent: () => unregisterComponent,
|
|
42
41
|
useLocaless: () => useLocaless
|
|
43
42
|
});
|
|
44
|
-
module.exports = __toCommonJS(
|
|
45
|
-
var import_client5 = require("@localess/client");
|
|
43
|
+
module.exports = __toCommonJS(src_exports);
|
|
46
44
|
|
|
47
|
-
// src/
|
|
48
|
-
var
|
|
49
|
-
var import_client2 = require("@localess/client");
|
|
45
|
+
// src/core/state.ts
|
|
46
|
+
var import_client = require("@localess/client");
|
|
50
47
|
|
|
51
48
|
// src/console.ts
|
|
52
49
|
var FONT_BOLD = "font-weight: bold";
|
|
53
50
|
var FONT_NORMAL = "font-weight: normal";
|
|
54
51
|
|
|
55
|
-
// src/state.ts
|
|
56
|
-
var import_client = require("@localess/client");
|
|
52
|
+
// src/core/state.ts
|
|
57
53
|
var _client = void 0;
|
|
58
54
|
var _components = {};
|
|
59
55
|
var _fallbackComponent = void 0;
|
|
@@ -108,60 +104,70 @@ function resolveAsset(asset) {
|
|
|
108
104
|
return `${_assetPathPrefix}${asset.uri}`;
|
|
109
105
|
}
|
|
110
106
|
|
|
111
|
-
// src/components/localess-component.tsx
|
|
107
|
+
// src/core/components/localess-component.tsx
|
|
108
|
+
var import_react = require("react");
|
|
109
|
+
|
|
110
|
+
// src/core/utils/index.ts
|
|
111
|
+
var import_client2 = require("@localess/client");
|
|
112
|
+
|
|
113
|
+
// src/core/utils/link.util.ts
|
|
114
|
+
function findLink(links, link) {
|
|
115
|
+
switch (link.type) {
|
|
116
|
+
case "content": {
|
|
117
|
+
if (links) {
|
|
118
|
+
const path = links[link.uri];
|
|
119
|
+
if (path) {
|
|
120
|
+
return "/" + path.fullSlug;
|
|
121
|
+
} else {
|
|
122
|
+
return "/not-found";
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
return "/not-found";
|
|
126
|
+
}
|
|
127
|
+
case "url":
|
|
128
|
+
return link.uri;
|
|
129
|
+
default:
|
|
130
|
+
return "no-type";
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
// src/core/components/localess-component.tsx
|
|
112
135
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
113
|
-
var LocalessComponent = (0, import_react.forwardRef)(
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
136
|
+
var LocalessComponent = (0, import_react.forwardRef)(
|
|
137
|
+
({ data, links, references, ...restProps }, ref) => {
|
|
138
|
+
if (!data) {
|
|
139
|
+
console.error("LocalessComponent property %cdata%c is not provided.", FONT_BOLD, FONT_NORMAL);
|
|
140
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
141
|
+
"LocalessComponent property ",
|
|
142
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: "data" }),
|
|
143
|
+
" is not provided."
|
|
144
|
+
] });
|
|
145
|
+
}
|
|
146
|
+
const Comp = getComponent(data._schema);
|
|
147
|
+
if (Comp) {
|
|
148
|
+
const attr = isSyncEnabled() ? (0, import_client2.localessEditable)(data) : {};
|
|
149
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Comp, { ref, data, links, references, ...attr, ...restProps });
|
|
150
|
+
}
|
|
151
|
+
const FallbackComponent = getFallbackComponent();
|
|
152
|
+
if (FallbackComponent) {
|
|
153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackComponent, { ref, data, links, references, ...restProps });
|
|
154
|
+
}
|
|
155
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
|
|
156
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: "LocalessComponent" }),
|
|
157
|
+
" could not found component with key ",
|
|
158
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: data._schema }),
|
|
159
|
+
". ",
|
|
160
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("br", {}),
|
|
161
|
+
"Please check if your configuration is correct."
|
|
120
162
|
] });
|
|
121
163
|
}
|
|
122
|
-
|
|
123
|
-
if (Comp) {
|
|
124
|
-
const attr = isSyncEnabled() ? (0, import_client2.localessEditable)(data) : {};
|
|
125
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Comp, { ref, data, links, references, ...attr, ...restProps });
|
|
126
|
-
}
|
|
127
|
-
const FallbackComponent = getFallbackComponent();
|
|
128
|
-
if (FallbackComponent) {
|
|
129
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackComponent, { ref, data, links, references, ...restProps });
|
|
130
|
-
}
|
|
131
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
|
|
132
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: "LocalessComponent" }),
|
|
133
|
-
" could not found component with key ",
|
|
134
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: data._schema || data.schema }),
|
|
135
|
-
". ",
|
|
136
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("br", {}),
|
|
137
|
-
"Please check if your configuration is correct."
|
|
138
|
-
] });
|
|
139
|
-
});
|
|
164
|
+
);
|
|
140
165
|
|
|
141
|
-
// src/
|
|
166
|
+
// src/core/hooks/use-localess.ts
|
|
142
167
|
var import_react2 = require("react");
|
|
143
168
|
var import_client3 = require("@localess/client");
|
|
144
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
145
|
-
var LocalessDocument = (0, import_react2.forwardRef)(({ data, links, references, ...restProps }, ref) => {
|
|
146
|
-
const [contentData, setContentData] = (0, import_react2.useState)(data);
|
|
147
|
-
(0, import_react2.useEffect)(() => {
|
|
148
|
-
if (isSyncEnabled() && (0, import_client3.isBrowser)()) {
|
|
149
|
-
window.localess?.on(["input", "change"], (event) => {
|
|
150
|
-
console.log("Localess:event", event);
|
|
151
|
-
if (event.type === "change" || event.type === "input") {
|
|
152
|
-
setContentData(event.data);
|
|
153
|
-
}
|
|
154
|
-
});
|
|
155
|
-
}
|
|
156
|
-
});
|
|
157
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LocalessComponent, { data: contentData, links, references, ...restProps });
|
|
158
|
-
});
|
|
159
|
-
|
|
160
|
-
// src/hooks/use-localess.ts
|
|
161
|
-
var import_react3 = require("react");
|
|
162
|
-
var import_client4 = require("@localess/client");
|
|
163
169
|
var useLocaless = (slug, options = {}) => {
|
|
164
|
-
const [document, setDocument] = (0,
|
|
170
|
+
const [document, setDocument] = (0, import_react2.useState)();
|
|
165
171
|
const client = getLocalessClient();
|
|
166
172
|
let normalizedSlug;
|
|
167
173
|
if (Array.isArray(slug)) {
|
|
@@ -169,11 +175,11 @@ var useLocaless = (slug, options = {}) => {
|
|
|
169
175
|
} else {
|
|
170
176
|
normalizedSlug = slug;
|
|
171
177
|
}
|
|
172
|
-
(0,
|
|
178
|
+
(0, import_react2.useEffect)(() => {
|
|
173
179
|
async function loadDocument() {
|
|
174
180
|
const document2 = await client.getContentBySlug(normalizedSlug, options);
|
|
175
181
|
setDocument(document2);
|
|
176
|
-
if (isSyncEnabled() && (0,
|
|
182
|
+
if (isSyncEnabled() && (0, import_client3.isBrowser)()) {
|
|
177
183
|
window.localess?.on(["input", "change"], (event) => {
|
|
178
184
|
if (event.type === "change" || event.type === "input") {
|
|
179
185
|
setDocument({ ...document2, data: event.data });
|
|
@@ -186,29 +192,8 @@ var useLocaless = (slug, options = {}) => {
|
|
|
186
192
|
return document;
|
|
187
193
|
};
|
|
188
194
|
|
|
189
|
-
// src/
|
|
190
|
-
|
|
191
|
-
switch (link.type) {
|
|
192
|
-
case "content": {
|
|
193
|
-
if (links) {
|
|
194
|
-
const path = links[link.uri];
|
|
195
|
-
if (path) {
|
|
196
|
-
return "/" + path.fullSlug;
|
|
197
|
-
} else {
|
|
198
|
-
return "/not-found";
|
|
199
|
-
}
|
|
200
|
-
}
|
|
201
|
-
return "/not-found";
|
|
202
|
-
}
|
|
203
|
-
case "url":
|
|
204
|
-
return link.uri;
|
|
205
|
-
default:
|
|
206
|
-
return "no-type";
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
// src/richtext.ts
|
|
211
|
-
var import_react4 = require("@tiptap/static-renderer/pm/react");
|
|
195
|
+
// src/core/richtext.ts
|
|
196
|
+
var import_react3 = require("@tiptap/static-renderer/pm/react");
|
|
212
197
|
var import_extension_document = require("@tiptap/extension-document");
|
|
213
198
|
var import_extension_text = require("@tiptap/extension-text");
|
|
214
199
|
var import_extension_paragraph = require("@tiptap/extension-paragraph");
|
|
@@ -225,7 +210,7 @@ var import_extension_code = require("@tiptap/extension-code");
|
|
|
225
210
|
var import_extension_code_block_lowlight = require("@tiptap/extension-code-block-lowlight");
|
|
226
211
|
var import_extension_link = require("@tiptap/extension-link");
|
|
227
212
|
function renderRichTextToReact(content) {
|
|
228
|
-
return (0,
|
|
213
|
+
return (0, import_react3.renderToReactElement)({
|
|
229
214
|
content,
|
|
230
215
|
extensions: [
|
|
231
216
|
import_extension_document.Document,
|
|
@@ -251,7 +236,6 @@ function renderRichTextToReact(content) {
|
|
|
251
236
|
// Annotate the CommonJS export names for ESM import in node:
|
|
252
237
|
0 && (module.exports = {
|
|
253
238
|
LocalessComponent,
|
|
254
|
-
LocalessDocument,
|
|
255
239
|
findLink,
|
|
256
240
|
getComponent,
|
|
257
241
|
getFallbackComponent,
|
package/dist/index.mjs
CHANGED
|
@@ -1,222 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
_components = components || {};
|
|
25
|
-
_fallbackComponent = fallbackComponent;
|
|
26
|
-
if (enableSync) {
|
|
27
|
-
_enableSync = true;
|
|
28
|
-
loadLocalessSync(restOptions.origin);
|
|
29
|
-
}
|
|
30
|
-
return _client;
|
|
31
|
-
}
|
|
32
|
-
function getLocalessClient() {
|
|
33
|
-
if (!_client) {
|
|
34
|
-
console.error("[Localess] No client found. Please check if the Localess is initialized.");
|
|
35
|
-
throw new Error("[Localess] No client found.");
|
|
36
|
-
}
|
|
37
|
-
return _client;
|
|
38
|
-
}
|
|
39
|
-
function registerComponent(key, component) {
|
|
40
|
-
_components[key] = component;
|
|
41
|
-
}
|
|
42
|
-
function unregisterComponent(key) {
|
|
43
|
-
delete _components[key];
|
|
44
|
-
}
|
|
45
|
-
function setComponents(components) {
|
|
46
|
-
_components = components;
|
|
47
|
-
}
|
|
48
|
-
function getComponent(key) {
|
|
49
|
-
if (Object.hasOwn(_components, key)) {
|
|
50
|
-
return _components[key];
|
|
51
|
-
}
|
|
52
|
-
console.error(`[Localess] component %c${key}%c can't be found.`, FONT_BOLD, FONT_NORMAL);
|
|
53
|
-
return void 0;
|
|
54
|
-
}
|
|
55
|
-
function setFallbackComponent(fallbackComponent) {
|
|
56
|
-
_fallbackComponent = fallbackComponent;
|
|
57
|
-
}
|
|
58
|
-
function getFallbackComponent() {
|
|
59
|
-
return _fallbackComponent;
|
|
60
|
-
}
|
|
61
|
-
function isSyncEnabled() {
|
|
62
|
-
return _enableSync;
|
|
63
|
-
}
|
|
64
|
-
function resolveAsset(asset) {
|
|
65
|
-
return `${_assetPathPrefix}${asset.uri}`;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
// src/components/localess-component.tsx
|
|
69
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
70
|
-
var LocalessComponent = forwardRef(({ data, links, references, ...restProps }, ref) => {
|
|
71
|
-
if (!data) {
|
|
72
|
-
console.error("LocalessComponent property %cdata%c is not provided.", FONT_BOLD, FONT_NORMAL);
|
|
73
|
-
return /* @__PURE__ */ jsxs("div", { children: [
|
|
74
|
-
"LocalessComponent property ",
|
|
75
|
-
/* @__PURE__ */ jsx("b", { children: "data" }),
|
|
76
|
-
" is not provided."
|
|
77
|
-
] });
|
|
78
|
-
}
|
|
79
|
-
const Comp = getComponent(data._schema);
|
|
80
|
-
if (Comp) {
|
|
81
|
-
const attr = isSyncEnabled() ? localessEditable(data) : {};
|
|
82
|
-
return /* @__PURE__ */ jsx(Comp, { ref, data, links, references, ...attr, ...restProps });
|
|
83
|
-
}
|
|
84
|
-
const FallbackComponent = getFallbackComponent();
|
|
85
|
-
if (FallbackComponent) {
|
|
86
|
-
return /* @__PURE__ */ jsx(FallbackComponent, { ref, data, links, references, ...restProps });
|
|
87
|
-
}
|
|
88
|
-
return /* @__PURE__ */ jsxs("p", { children: [
|
|
89
|
-
/* @__PURE__ */ jsx("b", { children: "LocalessComponent" }),
|
|
90
|
-
" could not found component with key ",
|
|
91
|
-
/* @__PURE__ */ jsx("b", { children: data._schema || data.schema }),
|
|
92
|
-
". ",
|
|
93
|
-
/* @__PURE__ */ jsx("br", {}),
|
|
94
|
-
"Please check if your configuration is correct."
|
|
95
|
-
] });
|
|
96
|
-
});
|
|
97
|
-
|
|
98
|
-
// src/components/localess-document.tsx
|
|
99
|
-
import { forwardRef as forwardRef2, useEffect, useState } from "react";
|
|
100
|
-
import { isBrowser } from "@localess/client";
|
|
101
|
-
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
102
|
-
var LocalessDocument = forwardRef2(({ data, links, references, ...restProps }, ref) => {
|
|
103
|
-
const [contentData, setContentData] = useState(data);
|
|
104
|
-
useEffect(() => {
|
|
105
|
-
if (isSyncEnabled() && isBrowser()) {
|
|
106
|
-
window.localess?.on(["input", "change"], (event) => {
|
|
107
|
-
console.log("Localess:event", event);
|
|
108
|
-
if (event.type === "change" || event.type === "input") {
|
|
109
|
-
setContentData(event.data);
|
|
110
|
-
}
|
|
111
|
-
});
|
|
112
|
-
}
|
|
113
|
-
});
|
|
114
|
-
return /* @__PURE__ */ jsx2(LocalessComponent, { data: contentData, links, references, ...restProps });
|
|
115
|
-
});
|
|
116
|
-
|
|
117
|
-
// src/hooks/use-localess.ts
|
|
118
|
-
import { useEffect as useEffect2, useState as useState2 } from "react";
|
|
119
|
-
import { isBrowser as isBrowser2 } from "@localess/client";
|
|
120
|
-
var useLocaless = (slug, options = {}) => {
|
|
121
|
-
const [document, setDocument] = useState2();
|
|
122
|
-
const client = getLocalessClient();
|
|
123
|
-
let normalizedSlug;
|
|
124
|
-
if (Array.isArray(slug)) {
|
|
125
|
-
normalizedSlug = slug.join("/");
|
|
126
|
-
} else {
|
|
127
|
-
normalizedSlug = slug;
|
|
128
|
-
}
|
|
129
|
-
useEffect2(() => {
|
|
130
|
-
async function loadDocument() {
|
|
131
|
-
const document2 = await client.getContentBySlug(normalizedSlug, options);
|
|
132
|
-
setDocument(document2);
|
|
133
|
-
if (isSyncEnabled() && isBrowser2()) {
|
|
134
|
-
window.localess?.on(["input", "change"], (event) => {
|
|
135
|
-
if (event.type === "change" || event.type === "input") {
|
|
136
|
-
setDocument({ ...document2, data: event.data });
|
|
137
|
-
}
|
|
138
|
-
});
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
loadDocument();
|
|
142
|
-
}, [slug, options, client]);
|
|
143
|
-
return document;
|
|
144
|
-
};
|
|
145
|
-
|
|
146
|
-
// src/utils/link.util.ts
|
|
147
|
-
function findLink(links, link) {
|
|
148
|
-
switch (link.type) {
|
|
149
|
-
case "content": {
|
|
150
|
-
if (links) {
|
|
151
|
-
const path = links[link.uri];
|
|
152
|
-
if (path) {
|
|
153
|
-
return "/" + path.fullSlug;
|
|
154
|
-
} else {
|
|
155
|
-
return "/not-found";
|
|
156
|
-
}
|
|
157
|
-
}
|
|
158
|
-
return "/not-found";
|
|
159
|
-
}
|
|
160
|
-
case "url":
|
|
161
|
-
return link.uri;
|
|
162
|
-
default:
|
|
163
|
-
return "no-type";
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
// src/richtext.ts
|
|
168
|
-
import { renderToReactElement } from "@tiptap/static-renderer/pm/react";
|
|
169
|
-
import { Document } from "@tiptap/extension-document";
|
|
170
|
-
import { Text } from "@tiptap/extension-text";
|
|
171
|
-
import { Paragraph } from "@tiptap/extension-paragraph";
|
|
172
|
-
import { Heading } from "@tiptap/extension-heading";
|
|
173
|
-
import { Bold } from "@tiptap/extension-bold";
|
|
174
|
-
import { Italic } from "@tiptap/extension-italic";
|
|
175
|
-
import { Strike } from "@tiptap/extension-strike";
|
|
176
|
-
import { Underline } from "@tiptap/extension-underline";
|
|
177
|
-
import { History } from "@tiptap/extension-history";
|
|
178
|
-
import { ListItem } from "@tiptap/extension-list-item";
|
|
179
|
-
import { OrderedList } from "@tiptap/extension-ordered-list";
|
|
180
|
-
import { BulletList } from "@tiptap/extension-bullet-list";
|
|
181
|
-
import { Code } from "@tiptap/extension-code";
|
|
182
|
-
import { CodeBlockLowlight } from "@tiptap/extension-code-block-lowlight";
|
|
183
|
-
import { Link } from "@tiptap/extension-link";
|
|
184
|
-
function renderRichTextToReact(content) {
|
|
185
|
-
return renderToReactElement({
|
|
186
|
-
content,
|
|
187
|
-
extensions: [
|
|
188
|
-
Document,
|
|
189
|
-
Text,
|
|
190
|
-
Paragraph,
|
|
191
|
-
Heading.configure({
|
|
192
|
-
levels: [1, 2, 3, 4, 5, 6]
|
|
193
|
-
}),
|
|
194
|
-
Bold,
|
|
195
|
-
Italic,
|
|
196
|
-
Strike,
|
|
197
|
-
Underline,
|
|
198
|
-
History,
|
|
199
|
-
ListItem,
|
|
200
|
-
OrderedList,
|
|
201
|
-
BulletList,
|
|
202
|
-
Code,
|
|
203
|
-
CodeBlockLowlight,
|
|
204
|
-
Link
|
|
205
|
-
]
|
|
206
|
-
});
|
|
207
|
-
}
|
|
1
|
+
import {
|
|
2
|
+
LocalessComponent,
|
|
3
|
+
useLocaless
|
|
4
|
+
} from "./chunk-V6JSXN66.mjs";
|
|
5
|
+
import {
|
|
6
|
+
findLink,
|
|
7
|
+
getComponent,
|
|
8
|
+
getFallbackComponent,
|
|
9
|
+
getLocalessClient,
|
|
10
|
+
isBrowser,
|
|
11
|
+
isIframe,
|
|
12
|
+
isServer,
|
|
13
|
+
isSyncEnabled,
|
|
14
|
+
localessEditable,
|
|
15
|
+
localessEditableField,
|
|
16
|
+
localessInit,
|
|
17
|
+
registerComponent,
|
|
18
|
+
renderRichTextToReact,
|
|
19
|
+
resolveAsset,
|
|
20
|
+
setComponents,
|
|
21
|
+
setFallbackComponent,
|
|
22
|
+
unregisterComponent
|
|
23
|
+
} from "./chunk-ETSLIILF.mjs";
|
|
208
24
|
export {
|
|
209
25
|
LocalessComponent,
|
|
210
|
-
LocalessDocument,
|
|
211
26
|
findLink,
|
|
212
27
|
getComponent,
|
|
213
28
|
getFallbackComponent,
|
|
214
29
|
getLocalessClient,
|
|
215
|
-
|
|
30
|
+
isBrowser,
|
|
216
31
|
isIframe,
|
|
217
32
|
isServer,
|
|
218
33
|
isSyncEnabled,
|
|
219
|
-
|
|
34
|
+
localessEditable,
|
|
220
35
|
localessEditableField,
|
|
221
36
|
localessInit,
|
|
222
37
|
registerComponent,
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { LocalessClientOptions, LocalessClient, ContentAsset, Links, ContentLink, ContentRichText } from '@localess/client';
|
|
3
|
+
|
|
4
|
+
type LocalessOptions = LocalessClientOptions & {
|
|
5
|
+
/**
|
|
6
|
+
* Components mapping for Localess Component integration
|
|
7
|
+
*/
|
|
8
|
+
components?: Record<string, React__default.ElementType>;
|
|
9
|
+
/**
|
|
10
|
+
* Component used if expected key didn't return anything
|
|
11
|
+
*/
|
|
12
|
+
fallbackComponent?: React__default.ElementType;
|
|
13
|
+
/**
|
|
14
|
+
* Load Sync Script, for Visual Editor integration
|
|
15
|
+
*/
|
|
16
|
+
enableSync?: boolean;
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Initialize Localess Client
|
|
21
|
+
* @param options
|
|
22
|
+
* @returns LocalessClient
|
|
23
|
+
*/
|
|
24
|
+
declare function localessInit(options: LocalessOptions): LocalessClient;
|
|
25
|
+
/**
|
|
26
|
+
* Get Localess Client
|
|
27
|
+
* @returns LocalessClient
|
|
28
|
+
*/
|
|
29
|
+
declare function getLocalessClient(): LocalessClient;
|
|
30
|
+
/**
|
|
31
|
+
* Register Component
|
|
32
|
+
* @param key - component key
|
|
33
|
+
* @param component - React Component
|
|
34
|
+
*/
|
|
35
|
+
declare function registerComponent(key: string, component: React__default.ElementType): void;
|
|
36
|
+
/**
|
|
37
|
+
* Unregister Component
|
|
38
|
+
* @param key - component key
|
|
39
|
+
*/
|
|
40
|
+
declare function unregisterComponent(key: string): void;
|
|
41
|
+
/**
|
|
42
|
+
* Set Components
|
|
43
|
+
* @param components - Record of components
|
|
44
|
+
*/
|
|
45
|
+
declare function setComponents(components: Record<string, React__default.ElementType>): void;
|
|
46
|
+
/**
|
|
47
|
+
* Get Component
|
|
48
|
+
* @param key - component key
|
|
49
|
+
* @returns React Component
|
|
50
|
+
*/
|
|
51
|
+
declare function getComponent(key: string): React__default.ElementType | undefined;
|
|
52
|
+
/**
|
|
53
|
+
* Set Fallback Component
|
|
54
|
+
* @param fallbackComponent
|
|
55
|
+
*/
|
|
56
|
+
declare function setFallbackComponent(fallbackComponent: React__default.ElementType): void;
|
|
57
|
+
/**
|
|
58
|
+
* Get Fallback Component
|
|
59
|
+
* @returns React Component
|
|
60
|
+
*/
|
|
61
|
+
declare function getFallbackComponent(): React__default.ElementType | undefined;
|
|
62
|
+
/**
|
|
63
|
+
* Check if Sync is enabled
|
|
64
|
+
*/
|
|
65
|
+
declare function isSyncEnabled(): boolean;
|
|
66
|
+
/**
|
|
67
|
+
* Resolve Asset URL
|
|
68
|
+
* @param asset - ContentAsset
|
|
69
|
+
* @returns Asset URL
|
|
70
|
+
*/
|
|
71
|
+
declare function resolveAsset(asset: ContentAsset): string;
|
|
72
|
+
|
|
73
|
+
declare function findLink(links: Links | undefined, link: ContentLink): string;
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* Render Localess Rich Text content to React elements
|
|
77
|
+
* @param content - The Rich Text content to render
|
|
78
|
+
* @returns React.ReactNode - The rendered React elements
|
|
79
|
+
*/
|
|
80
|
+
declare function renderRichTextToReact(content: ContentRichText): React__default.ReactNode;
|
|
81
|
+
|
|
82
|
+
export { type LocalessOptions as L, getFallbackComponent as a, getLocalessClient as b, renderRichTextToReact as c, resolveAsset as d, setFallbackComponent as e, findLink as f, getComponent as g, isSyncEnabled as i, localessInit as l, registerComponent as r, setComponents as s, unregisterComponent as u };
|