@localess/react 3.0.6-dev.20260506093132 → 3.0.6-dev.20260512074100
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 +62 -62
- package/SKILL.md +6 -6
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -38,11 +38,11 @@ pnpm add @localess/react
|
|
|
38
38
|
|
|
39
39
|
`@localess/react` provides three different exports to suit different rendering strategies:
|
|
40
40
|
|
|
41
|
-
| Export
|
|
42
|
-
|
|
43
|
-
| `@localess/react`
|
|
44
|
-
| `@localess/react/ssr` | SSR without live editing, Next.js static exports
|
|
45
|
-
| `@localess/react/rsc` | React Server Components with live editing
|
|
41
|
+
| Export | Use Case | Live Editing | Static Export |
|
|
42
|
+
|-----------------------|-------------------------------------------------------|--------------|---------------|
|
|
43
|
+
| `@localess/react` | Single Page Applications (SPA), client-side rendering | ✅ | ✅ |
|
|
44
|
+
| `@localess/react/ssr` | SSR without live editing, Next.js static exports | ❌ | ✅ |
|
|
45
|
+
| `@localess/react/rsc` | React Server Components with live editing | ✅ | ❌ |
|
|
46
46
|
|
|
47
47
|
### When to Use Each Export
|
|
48
48
|
|
|
@@ -105,18 +105,18 @@ localessInit({
|
|
|
105
105
|
|
|
106
106
|
### Initialization Options
|
|
107
107
|
|
|
108
|
-
| Option
|
|
109
|
-
|
|
110
|
-
| `origin`
|
|
111
|
-
| `spaceId`
|
|
112
|
-
| `token`
|
|
113
|
-
| `version`
|
|
114
|
-
| `debug`
|
|
115
|
-
| `cacheTTL`
|
|
116
|
-
| `fileSystemCache`
|
|
117
|
-
| `components`
|
|
118
|
-
| `fallbackComponent` | `React.ElementType`
|
|
119
|
-
| `enableSync`
|
|
108
|
+
| Option | Type | Required | Default | Description |
|
|
109
|
+
|---------------------|-------------------------------------|----------|---------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
|
|
110
|
+
| `origin` | `string` | ✅ | — | Fully qualified domain with protocol (e.g., `https://my-localess.web.app`) |
|
|
111
|
+
| `spaceId` | `string` | ✅ | — | Localess Space ID, found in Space settings |
|
|
112
|
+
| `token` | `string` | ✅ | — | Localess API token (keep secret — server-side only) |
|
|
113
|
+
| `version` | `'draft' \| string` | ❌ | `'published'` | Default content version |
|
|
114
|
+
| `debug` | `boolean` | ❌ | `false` | Enable debug logging |
|
|
115
|
+
| `cacheTTL` | `number \| false` | ❌ | `300` | Cache TTL in **seconds** (default: 5 minutes). Set `false` to disable caching entirely — takes precedence over `fileSystemCache` |
|
|
116
|
+
| `fileSystemCache` | `boolean` | ❌ | `false` | Use a file-system cache instead of the default in-memory cache. Shared across all processes pointing to the same working directory (e.g. Next.js parallel build workers). Respects `cacheTTL` for TTL value |
|
|
117
|
+
| `components` | `Record<string, React.ElementType>` | ❌ | `{}` | Map of schema keys to React components |
|
|
118
|
+
| `fallbackComponent` | `React.ElementType` | ❌ | — | Component rendered when a schema key has no registered component |
|
|
119
|
+
| `enableSync` | `boolean` | ❌ | `false` | Load the Visual Editor sync script for live-editing support |
|
|
120
120
|
|
|
121
121
|
---
|
|
122
122
|
|
|
@@ -143,13 +143,13 @@ import { LocalessComponent } from "@localess/react";
|
|
|
143
143
|
|
|
144
144
|
### Props
|
|
145
145
|
|
|
146
|
-
| Prop
|
|
147
|
-
|
|
148
|
-
| `data`
|
|
149
|
-
| `links`
|
|
150
|
-
| `references` | `References`
|
|
151
|
-
| `ref`
|
|
152
|
-
| `...rest`
|
|
146
|
+
| Prop | Type | Required | Description |
|
|
147
|
+
|--------------|--------------------------|----------|----------------------------------------------------------------------------------------------------|
|
|
148
|
+
| `data` | `ContentData` | ✅ | Content data object from Localess. The component looks up `data._schema` in the component registry |
|
|
149
|
+
| `links` | `Links` | ❌ | Resolved content links map, forwarded to the rendered component |
|
|
150
|
+
| `references` | `References` | ❌ | Resolved references map, forwarded to the rendered component |
|
|
151
|
+
| `ref` | `React.Ref<HTMLElement>` | ❌ | Ref forwarded to the rendered component's root element |
|
|
152
|
+
| `...rest` | `any` | ❌ | Any additional props are forwarded to the rendered component |
|
|
153
153
|
|
|
154
154
|
> If a schema key is not registered and no `fallbackComponent` is configured, `LocalessComponent` renders an error message in the DOM.
|
|
155
155
|
|
|
@@ -322,10 +322,10 @@ export function PageView({ slug }: { slug: string }) {
|
|
|
322
322
|
|
|
323
323
|
### Parameters
|
|
324
324
|
|
|
325
|
-
| Parameter | Type
|
|
326
|
-
|
|
327
|
-
| `slug`
|
|
328
|
-
| `options` | `ContentFetchParams` | ❌
|
|
325
|
+
| Parameter | Type | Required | Description |
|
|
326
|
+
|-----------|----------------------|----------|-------------------------------------------------------------------------------------------|
|
|
327
|
+
| `slug` | `string \| string[]` | ✅ | Content slug. Arrays are joined with `/` — e.g. `['blog', 'post']` → `'blog/post'` |
|
|
328
|
+
| `options` | `ContentFetchParams` | ❌ | Same fetch options as `getContentBySlug` (locale, version, resolveReference, resolveLink) |
|
|
329
329
|
|
|
330
330
|
Returns `Content<T> | undefined` — `undefined` while the initial fetch is in progress.
|
|
331
331
|
|
|
@@ -406,13 +406,13 @@ export default async function HomePage({ params }: { params: Promise<{ locale?:
|
|
|
406
406
|
|
|
407
407
|
**Props:**
|
|
408
408
|
|
|
409
|
-
| Prop
|
|
410
|
-
|
|
411
|
-
| `data`
|
|
412
|
-
| `links`
|
|
413
|
-
| `references` | `References`
|
|
414
|
-
| `ref`
|
|
415
|
-
| `...rest`
|
|
409
|
+
| Prop | Type | Required | Description |
|
|
410
|
+
|--------------|--------------------------|----------|---------------------------------------------------------------------|
|
|
411
|
+
| `data` | `ContentData` | ✅ | Initial content data (typically server-fetched) |
|
|
412
|
+
| `links` | `Links` | ❌ | Resolved links map, forwarded to the inner `LocalessComponent` |
|
|
413
|
+
| `references` | `References` | ❌ | Resolved references map, forwarded to the inner `LocalessComponent` |
|
|
414
|
+
| `ref` | `React.Ref<HTMLElement>` | ❌ | Forwarded to the rendered root element |
|
|
415
|
+
| `...rest` | `any` | ❌ | Any additional props are forwarded |
|
|
416
416
|
|
|
417
417
|
> `LocalessDocument` subscribes to `input` / `change` editor events automatically when `enableSync` is active. It is a Client Component internally — no `'use client'` directive needed at the call site in Server Components.
|
|
418
418
|
|
|
@@ -453,15 +453,15 @@ export function PageClient({ initialContent }: { initialContent: Content<Page> }
|
|
|
453
453
|
|
|
454
454
|
**Available events via `window.localess.on()`:**
|
|
455
455
|
|
|
456
|
-
| Event
|
|
457
|
-
|
|
458
|
-
| `input`
|
|
459
|
-
| `change`
|
|
460
|
-
| `save`
|
|
461
|
-
| `publish`
|
|
462
|
-
| `pong`
|
|
463
|
-
| `enterSchema` | Editor cursor enters a schema block
|
|
464
|
-
| `hoverSchema` | Editor cursor hovers over a schema block
|
|
456
|
+
| Event | When |
|
|
457
|
+
|---------------|-----------------------------------------------|
|
|
458
|
+
| `input` | User is typing in a field (real-time preview) |
|
|
459
|
+
| `change` | Field value confirmed |
|
|
460
|
+
| `save` | Content saved |
|
|
461
|
+
| `publish` | Content published |
|
|
462
|
+
| `pong` | Editor heartbeat response |
|
|
463
|
+
| `enterSchema` | Editor cursor enters a schema block |
|
|
464
|
+
| `hoverSchema` | Editor cursor hovers over a schema block |
|
|
465
465
|
|
|
466
466
|
> `window.localess` only exposes `.on()` and `.onChange()` — there is no `.off()` method.
|
|
467
467
|
|
|
@@ -744,24 +744,24 @@ export default function PageClient({ initialContent, locale }) {
|
|
|
744
744
|
|
|
745
745
|
The table below shows which symbols are available in each export.
|
|
746
746
|
|
|
747
|
-
| Symbol
|
|
748
|
-
|
|
749
|
-
| `localessInit`
|
|
750
|
-
| `getLocalessClient`
|
|
751
|
-
| `registerComponent` / `setComponents` / `getComponent` |
|
|
752
|
-
| `setFallbackComponent` / `getFallbackComponent`
|
|
753
|
-
| `resolveAsset`
|
|
754
|
-
| `LocalessComponent`
|
|
755
|
-
| `renderRichTextToReact`
|
|
756
|
-
| `findLink`
|
|
757
|
-
| `isServer`
|
|
758
|
-
| All content types
|
|
759
|
-
| `LocalessDocument`
|
|
760
|
-
| `useLocaless`
|
|
761
|
-
| `localessEditable` / `localessEditableField`
|
|
762
|
-
| `isBrowser` / `isIframe`
|
|
763
|
-
| `isSyncEnabled`
|
|
764
|
-
| Sync event types (`LocalessSync`, `EventToApp`, …)
|
|
747
|
+
| Symbol | `@localess/react` | `@localess/react/ssr` | `@localess/react/rsc` |
|
|
748
|
+
|--------------------------------------------------------|:-----------------:|:---------------------:|:---------------------:|
|
|
749
|
+
| `localessInit` | ✅ | ✅ | ✅ |
|
|
750
|
+
| `getLocalessClient` | ✅ | ✅ | ✅ |
|
|
751
|
+
| `registerComponent` / `setComponents` / `getComponent` | ✅ | ✅ | ✅ |
|
|
752
|
+
| `setFallbackComponent` / `getFallbackComponent` | ✅ | ✅ | ✅ |
|
|
753
|
+
| `resolveAsset` | ✅ | ✅ | ✅ |
|
|
754
|
+
| `LocalessComponent` | ✅ | ✅ | ✅ |
|
|
755
|
+
| `renderRichTextToReact` | ✅ | ✅ | ✅ |
|
|
756
|
+
| `findLink` | ✅ | ✅ | ✅ |
|
|
757
|
+
| `isServer` | ✅ | ✅ | ✅ |
|
|
758
|
+
| All content types | ✅ | ✅ | ✅ |
|
|
759
|
+
| `LocalessDocument` | ✅ | ❌ | ✅ |
|
|
760
|
+
| `useLocaless` | ✅ | ❌ | ✅ |
|
|
761
|
+
| `localessEditable` / `localessEditableField` | ✅ | ❌ | ✅ |
|
|
762
|
+
| `isBrowser` / `isIframe` | ✅ | ❌ | ✅ |
|
|
763
|
+
| `isSyncEnabled` | ✅ | ❌ | ✅ |
|
|
764
|
+
| Sync event types (`LocalessSync`, `EventToApp`, …) | ✅ | ❌ | ✅ |
|
|
765
765
|
|
|
766
766
|
---
|
|
767
767
|
|
package/SKILL.md
CHANGED
|
@@ -229,12 +229,12 @@ export default async function HomePage({ params }: { params: Promise<{ locale?:
|
|
|
229
229
|
|
|
230
230
|
**Props** (same shape as `LocalessComponent`):
|
|
231
231
|
|
|
232
|
-
| Prop
|
|
233
|
-
|
|
234
|
-
| `data`
|
|
235
|
-
| `links`
|
|
236
|
-
| `references` | `References`
|
|
237
|
-
| `ref`
|
|
232
|
+
| Prop | Type | Required | Description |
|
|
233
|
+
|--------------|--------------------------|----------|----------------------------------------|
|
|
234
|
+
| `data` | `ContentData` | ✅ | Initial content data |
|
|
235
|
+
| `links` | `Links` | ❌ | Resolved links map |
|
|
236
|
+
| `references` | `References` | ❌ | Resolved references map |
|
|
237
|
+
| `ref` | `React.Ref<HTMLElement>` | ❌ | Forwarded to the rendered root element |
|
|
238
238
|
|
|
239
239
|
> Subscribes to `input` / `change` events automatically when `enableSync` is active. Unlike `useLocaless`, it does not fetch content — it only handles live sync for data passed in as props.
|
|
240
240
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@localess/react",
|
|
3
|
-
"version": "3.0.6-dev.
|
|
3
|
+
"version": "3.0.6-dev.20260512074100",
|
|
4
4
|
"description": "ReactJS JavaScript/TypeScript SDK for Localess's API.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"localess",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"react-dom": "^17 || ^18 || ^19"
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
|
-
"@localess/client": "3.0.6-dev.
|
|
64
|
+
"@localess/client": "3.0.6-dev.20260512074100",
|
|
65
65
|
"@tiptap/extension-bold": "^3.22.5",
|
|
66
66
|
"@tiptap/extension-bullet-list": "^3.22.5",
|
|
67
67
|
"@tiptap/extension-code": "^3.22.5",
|