@rakun-kit/manager-react 1.5.6 → 1.5.8

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.
Files changed (113) hide show
  1. package/README.md +272 -269
  2. package/dist/cjs/components/editor/plugins/toolbar/image-toolbar-plugin.js +2 -1
  3. package/dist/cjs/components/editor/plugins/toolbar/image-toolbar-plugin.js.map +1 -1
  4. package/dist/cjs/components/editor/themes/editor-theme.css +91 -91
  5. package/dist/cjs/components/media/MediaLibrary.js +7 -4
  6. package/dist/cjs/components/media/MediaLibrary.js.map +1 -1
  7. package/dist/cjs/components/media/contexts/MediaLibraryContext.js.map +1 -1
  8. package/dist/cjs/components/media/folders/FoldersTree.js +1 -1
  9. package/dist/cjs/components/media/folders/FoldersTree.js.map +1 -1
  10. package/dist/cjs/components/media/previews/MediaContextMenuContent.js +17 -4
  11. package/dist/cjs/components/media/previews/MediaContextMenuContent.js.map +1 -1
  12. package/dist/cjs/components/media/previews/Previews.js +108 -34
  13. package/dist/cjs/components/media/previews/Previews.js.map +1 -1
  14. package/dist/cjs/components/media/previews/context/MediaPreviewContext.js.map +1 -1
  15. package/dist/cjs/components/media/previews/dialogs/ExpandedPreviewDialog.js +17 -1
  16. package/dist/cjs/components/media/previews/dialogs/ExpandedPreviewDialog.js.map +1 -1
  17. package/dist/cjs/components/media/previews/hooks/useMediaPreviewRenderer.js +56 -12
  18. package/dist/cjs/components/media/previews/hooks/useMediaPreviewRenderer.js.map +1 -1
  19. package/dist/cjs/components/media/previews/toolbar/PreviewsToolbar.js +14 -12
  20. package/dist/cjs/components/media/previews/toolbar/PreviewsToolbar.js.map +1 -1
  21. package/dist/cjs/components/media/previews/views/PreviewsGridLargeView.js +2 -1
  22. package/dist/cjs/components/media/previews/views/PreviewsGridLargeView.js.map +1 -1
  23. package/dist/cjs/components/media/previews/views/PreviewsGridSmallView.js +2 -1
  24. package/dist/cjs/components/media/previews/views/PreviewsGridSmallView.js.map +1 -1
  25. package/dist/cjs/components/media/previews/views/PreviewsListView.js +1 -1
  26. package/dist/cjs/components/media/previews/views/PreviewsListView.js.map +1 -1
  27. package/dist/cjs/components/ui/sortable.js +4 -4
  28. package/dist/cjs/help/manager-help.js +13 -6
  29. package/dist/cjs/help/manager-help.js.map +1 -1
  30. package/dist/cjs/i18n/catalog.js +17 -1
  31. package/dist/cjs/i18n/catalog.js.map +1 -1
  32. package/dist/cjs/layouts.js +1 -3
  33. package/dist/cjs/layouts.js.map +1 -1
  34. package/dist/cjs/lib/media.js +1 -0
  35. package/dist/cjs/lib/media.js.map +1 -1
  36. package/dist/cjs/media.js +1 -0
  37. package/dist/cjs/media.js.map +1 -1
  38. package/dist/cjs/router/dashboard/[contentType]/[edit]/_fields/FileField/index.js +68 -23
  39. package/dist/cjs/router/dashboard/[contentType]/[edit]/_fields/FileField/index.js.map +1 -1
  40. package/dist/cjs/router/dashboard/media/screen.js +1 -1
  41. package/dist/cjs/router/dashboard/media/screen.js.map +1 -1
  42. package/dist/cjs/state/theme-script.js +12 -12
  43. package/dist/docs/index.md +147 -140
  44. package/dist/esm/components/editor/plugins/toolbar/image-toolbar-plugin.d.ts.map +1 -1
  45. package/dist/esm/components/editor/plugins/toolbar/image-toolbar-plugin.js +2 -1
  46. package/dist/esm/components/editor/plugins/toolbar/image-toolbar-plugin.js.map +1 -1
  47. package/dist/esm/components/editor/themes/editor-theme.css +91 -91
  48. package/dist/esm/components/media/MediaLibrary.d.ts.map +1 -1
  49. package/dist/esm/components/media/MediaLibrary.js +7 -4
  50. package/dist/esm/components/media/MediaLibrary.js.map +1 -1
  51. package/dist/esm/components/media/contexts/MediaLibraryContext.d.ts +1 -0
  52. package/dist/esm/components/media/contexts/MediaLibraryContext.d.ts.map +1 -1
  53. package/dist/esm/components/media/contexts/MediaLibraryContext.js.map +1 -1
  54. package/dist/esm/components/media/folders/FoldersTree.js +1 -1
  55. package/dist/esm/components/media/folders/FoldersTree.js.map +1 -1
  56. package/dist/esm/components/media/previews/MediaContextMenuContent.d.ts.map +1 -1
  57. package/dist/esm/components/media/previews/MediaContextMenuContent.js +17 -4
  58. package/dist/esm/components/media/previews/MediaContextMenuContent.js.map +1 -1
  59. package/dist/esm/components/media/previews/Previews.d.ts.map +1 -1
  60. package/dist/esm/components/media/previews/Previews.js +108 -34
  61. package/dist/esm/components/media/previews/Previews.js.map +1 -1
  62. package/dist/esm/components/media/previews/context/MediaPreviewContext.d.ts +3 -0
  63. package/dist/esm/components/media/previews/context/MediaPreviewContext.d.ts.map +1 -1
  64. package/dist/esm/components/media/previews/context/MediaPreviewContext.js.map +1 -1
  65. package/dist/esm/components/media/previews/dialogs/ExpandedPreviewDialog.d.ts.map +1 -1
  66. package/dist/esm/components/media/previews/dialogs/ExpandedPreviewDialog.js +17 -1
  67. package/dist/esm/components/media/previews/dialogs/ExpandedPreviewDialog.js.map +1 -1
  68. package/dist/esm/components/media/previews/hooks/useMediaPreviewRenderer.d.ts +13 -2
  69. package/dist/esm/components/media/previews/hooks/useMediaPreviewRenderer.d.ts.map +1 -1
  70. package/dist/esm/components/media/previews/hooks/useMediaPreviewRenderer.js +54 -12
  71. package/dist/esm/components/media/previews/hooks/useMediaPreviewRenderer.js.map +1 -1
  72. package/dist/esm/components/media/previews/toolbar/PreviewsToolbar.d.ts.map +1 -1
  73. package/dist/esm/components/media/previews/toolbar/PreviewsToolbar.js +15 -13
  74. package/dist/esm/components/media/previews/toolbar/PreviewsToolbar.js.map +1 -1
  75. package/dist/esm/components/media/previews/views/PreviewsGridLargeView.d.ts.map +1 -1
  76. package/dist/esm/components/media/previews/views/PreviewsGridLargeView.js +2 -1
  77. package/dist/esm/components/media/previews/views/PreviewsGridLargeView.js.map +1 -1
  78. package/dist/esm/components/media/previews/views/PreviewsGridSmallView.d.ts.map +1 -1
  79. package/dist/esm/components/media/previews/views/PreviewsGridSmallView.js +2 -1
  80. package/dist/esm/components/media/previews/views/PreviewsGridSmallView.js.map +1 -1
  81. package/dist/esm/components/media/previews/views/PreviewsListView.js +1 -1
  82. package/dist/esm/components/media/previews/views/PreviewsListView.js.map +1 -1
  83. package/dist/esm/components/ui/sortable.js +4 -4
  84. package/dist/esm/help/manager-help.d.ts.map +1 -1
  85. package/dist/esm/help/manager-help.js +13 -6
  86. package/dist/esm/help/manager-help.js.map +1 -1
  87. package/dist/esm/i18n/catalog.d.ts +25 -1
  88. package/dist/esm/i18n/catalog.d.ts.map +1 -1
  89. package/dist/esm/i18n/catalog.js +17 -1
  90. package/dist/esm/i18n/catalog.js.map +1 -1
  91. package/dist/esm/i18n/useTranslations.d.ts.map +1 -1
  92. package/dist/esm/layouts.d.ts.map +1 -1
  93. package/dist/esm/layouts.js +1 -3
  94. package/dist/esm/layouts.js.map +1 -1
  95. package/dist/esm/lib/media.d.ts +1 -0
  96. package/dist/esm/lib/media.d.ts.map +1 -1
  97. package/dist/esm/lib/media.js +1 -0
  98. package/dist/esm/lib/media.js.map +1 -1
  99. package/dist/esm/media.d.ts +1 -0
  100. package/dist/esm/media.d.ts.map +1 -1
  101. package/dist/esm/media.js +1 -0
  102. package/dist/esm/media.js.map +1 -1
  103. package/dist/esm/router/dashboard/[contentType]/[edit]/_fields/FileField/index.d.ts.map +1 -1
  104. package/dist/esm/router/dashboard/[contentType]/[edit]/_fields/FileField/index.js +68 -23
  105. package/dist/esm/router/dashboard/[contentType]/[edit]/_fields/FileField/index.js.map +1 -1
  106. package/dist/esm/router/dashboard/[contentType]/[edit]/_hooks/useRouteLayoutData.d.ts.map +1 -1
  107. package/dist/esm/router/dashboard/media/screen.js +1 -1
  108. package/dist/esm/router/dashboard/media/screen.js.map +1 -1
  109. package/dist/esm/state/theme-script.js +12 -12
  110. package/dist/styles.css +101 -9
  111. package/dist/styles.css.d.ts +3 -3
  112. package/dist/tsconfig.build.tsbuildinfo +1 -1
  113. package/package.json +217 -216
package/README.md CHANGED
@@ -1,88 +1,88 @@
1
- # @rakun-kit/manager-react
2
-
3
- React manager UI and client utilities for Rakun.
4
-
5
- Most apps use this package through framework adapters such as
6
- `@rakun-kit/next/manager`, but the runtime components and clients are also
7
- published for custom integrations.
8
-
9
- ## Browser App
10
-
11
- Render the manager with a manager client and navigation implementation:
12
-
13
- ```tsx
14
- import {
15
- ManagerBrowserApp,
16
- createHttpManagerClient,
17
- } from "@rakun-kit/manager-react";
18
- import "@rakun-kit/manager-react/styles.css";
19
-
20
- const client = createHttpManagerClient({
21
- baseUrl: "/api/rakun",
22
- });
23
-
24
- export function ManagerPage() {
25
- return (
26
- <ManagerBrowserApp
27
- client={client}
28
- pathname={window.location.pathname}
29
- basePath="/backend"
30
- />
31
- );
32
- }
33
- ```
34
-
35
- `ManagerBrowserApp` creates browser path navigation by default. Use
36
- `ManagerRuntimeApp` when you need to provide custom navigation.
37
-
38
- ## Clients
39
-
40
- HTTP client:
41
-
42
- ```ts
43
- import { createHttpManagerClient } from "@rakun-kit/manager-react/client/http";
44
-
45
- const client = createHttpManagerClient({
46
- baseUrl: "/api/rakun",
47
- });
48
-
49
- const contentTypes = await client.request("manager.contentTypes");
50
- ```
51
-
52
- tRPC client adapter:
53
-
54
- ```ts
55
- import { createTrpcManagerClient } from "@rakun-kit/manager-react/client/trpc";
56
-
57
- const managerClient = createTrpcManagerClient(trpcProxyClient);
58
- ```
59
-
60
- Custom client:
61
-
62
- ```ts
63
- import { createManagerClient } from "@rakun-kit/manager-react/client/request";
64
-
65
- const client = createManagerClient(async (name, input, options) => {
66
- // call your transport here
67
- });
68
- ```
69
-
70
- ## Navigation
71
-
72
- Use `createPathManagerNavigation` for router integrations:
73
-
74
- ```ts
75
- import { createPathManagerNavigation } from "@rakun-kit/manager-react/state/navigation";
76
-
77
- const navigation = createPathManagerNavigation({
78
- basePath: "/backend",
79
- push: (href) => router.push(href),
80
- replace: (href) => router.replace(href),
81
- });
82
- ```
83
-
1
+ # @rakun-kit/manager-react
2
+
3
+ React manager UI and client utilities for Rakun.
4
+
5
+ Most apps use this package through framework adapters such as
6
+ `@rakun-kit/next/manager`, but the runtime components and clients are also
7
+ published for custom integrations.
8
+
9
+ ## Browser App
10
+
11
+ Render the manager with a manager client and navigation implementation:
12
+
13
+ ```tsx
14
+ import {
15
+ ManagerBrowserApp,
16
+ createHttpManagerClient,
17
+ } from "@rakun-kit/manager-react";
18
+ import "@rakun-kit/manager-react/styles.css";
19
+
20
+ const client = createHttpManagerClient({
21
+ baseUrl: "/api/rakun",
22
+ });
23
+
24
+ export function ManagerPage() {
25
+ return (
26
+ <ManagerBrowserApp
27
+ client={client}
28
+ pathname={window.location.pathname}
29
+ basePath="/backend"
30
+ />
31
+ );
32
+ }
33
+ ```
34
+
35
+ `ManagerBrowserApp` creates browser path navigation by default. Use
36
+ `ManagerRuntimeApp` when you need to provide custom navigation.
37
+
38
+ ## Clients
39
+
40
+ HTTP client:
41
+
42
+ ```ts
43
+ import { createHttpManagerClient } from "@rakun-kit/manager-react/client/http";
44
+
45
+ const client = createHttpManagerClient({
46
+ baseUrl: "/api/rakun",
47
+ });
48
+
49
+ const contentTypes = await client.request("manager.contentTypes");
50
+ ```
51
+
52
+ tRPC client adapter:
53
+
54
+ ```ts
55
+ import { createTrpcManagerClient } from "@rakun-kit/manager-react/client/trpc";
56
+
57
+ const managerClient = createTrpcManagerClient(trpcProxyClient);
58
+ ```
59
+
60
+ Custom client:
61
+
62
+ ```ts
63
+ import { createManagerClient } from "@rakun-kit/manager-react/client/request";
64
+
65
+ const client = createManagerClient(async (name, input, options) => {
66
+ // call your transport here
67
+ });
68
+ ```
69
+
70
+ ## Navigation
71
+
72
+ Use `createPathManagerNavigation` for router integrations:
73
+
74
+ ```ts
75
+ import { createPathManagerNavigation } from "@rakun-kit/manager-react/state/navigation";
76
+
77
+ const navigation = createPathManagerNavigation({
78
+ basePath: "/backend",
79
+ push: (href) => router.push(href),
80
+ replace: (href) => router.replace(href),
81
+ });
82
+ ```
83
+
84
84
  ## Link fields
85
-
85
+
86
86
  The `f.link()` editor shows a title alongside its destination. Users can paste
87
87
  or type a direct URL, choose the home page, or browse configured page-route
88
88
  types and select one of their entries. Internal selections automatically use
@@ -101,7 +101,10 @@ restores them before saving media metadata.
101
101
 
102
102
  With optimization enabled in the media toolbar, an image's context menu offers
103
103
  `Reimport with current optimization`. It regenerates the configured variants
104
- while retaining the existing media record and all relations to it.
104
+ while retaining the existing media record and all relations to it. Multi-select
105
+ supports the same reimport action from the selection toolbar. Optimization is
106
+ on by default, and generated previews are stored as inline `data:image/...`
107
+ LQIP values on the media record.
105
108
 
106
109
  ## Dynamic data mappings
107
110
 
@@ -109,187 +112,187 @@ The list mapping editor supports recursive `blocks` targets. Select
109
112
  `Nested list` for a mapped list property to configure its own source, query,
110
113
  filters, item type, and field mapping. `Current document` query values inside
111
114
  that nested editor resolve against the parent source item.
112
-
113
- ## Styles
114
-
115
- Import the package stylesheet once:
116
-
117
- ```ts
118
- import "@rakun-kit/manager-react/styles.css";
119
- ```
120
-
121
- ## Manager languages
122
-
123
- English and the locale runtime are built into this package. Extra translations
124
- ship from a separate package:
125
-
126
- ```sh
127
- bun add @rakun-kit/manager-locales
128
- # or: npm install @rakun-kit/manager-locales
129
- ```
130
-
131
- Import only the locale needed by the server bootstrap:
132
-
133
- ```ts
134
- import { esManagerLocalePack } from '@rakun-kit/manager-locales/es'
135
-
136
- rakunBootstrap({
137
- // ...
138
- managerLanguages: [esManagerLocalePack],
139
- })
140
- ```
141
-
142
- Each language has an independent subpath, so application bundlers only include
143
- the locales explicitly imported by the host.
144
-
145
- Content-type titles and categories can use project-defined message keys without
146
- adding them to the built-in `ManagerMessageKey` union. Add an English partial
147
- pack and extend installed locales through `managerLanguages`:
148
-
149
- ```ts
150
- import { extendManagerLanguagePack } from '@rakun-kit/core/contracts'
151
- import { esManagerLocalePack } from '@rakun-kit/manager-locales/es'
152
-
153
- const managerLanguages = [
154
- {
155
- code: 'en',
156
- name: 'English',
157
- messages: {
158
- 'field.title': 'Title',
159
- 'layoutModule.header': 'Header',
160
- 'project.contentTypes.article.menu': 'Articles',
161
- },
162
- },
163
- extendManagerLanguagePack(esManagerLocalePack, {
164
- 'field.title': 'Título',
165
- 'layoutModule.header': 'Cabecera',
166
- 'project.contentTypes.article.menu': 'Artículos',
167
- }),
168
- ]
169
- ```
170
-
171
- Then set `menu.title` or `menu.category` to that arbitrary key. Project keys are
172
- resolved at runtime but remain outside the static manager catalog.
173
-
174
- Field labels use the dynamic `field.<fieldName>` namespace. A content-type field
175
- named `title`, for example, automatically resolves `field.title` in edit forms
176
- and list columns without adding it to `ManagerMessageKey`.
177
-
178
- Layout module labels follow `layoutModule.<layoutKey>`. For example, the
179
- `header` slot automatically resolves `layoutModule.header` in its tab and
180
- configuration panel.
181
-
182
- ## Event Logs
183
-
184
- Settings → Logs displays the persistent Rakun event stream through the native
185
- `manager.logs.list` operation. The screen supports filters, cursor pagination,
186
- and structured event details. Both the settings card and the operation require
187
- the `system.eventLog.read` permission, which can be assigned from Settings →
188
- User Roles.
189
-
190
- ## Manager Plugins
191
-
192
- Manager plugins run inside the normal providers and can add dashboard routes,
193
- sidebar items, and custom field editors:
194
-
195
- ```tsx
196
- import {
197
- defineRakunManagerPlugin,
198
- ManagerBrowserApp,
199
- } from '@rakun-kit/manager-react'
200
-
201
- const analyticsManagerPlugin = defineRakunManagerPlugin({
202
- id: '@acme/rakun-analytics',
203
- routes: [{
204
- id: 'dashboard',
205
- path: '/analytics',
206
- component: AnalyticsScreen,
207
- permissions: ['plugin.analytics.view'],
208
- }],
209
- sidebar: [{
210
- id: 'analytics',
211
- title: 'Analytics',
212
- routeId: 'dashboard',
213
- position: 'primary',
214
- group: 'Plugins',
215
- }],
216
- fieldEditors: {
217
- '@acme/rakun-analytics.query': QueryEditor,
218
- },
219
- })
220
-
221
- <ManagerBrowserApp plugins={[analyticsManagerPlugin]} {...props} />
222
- ```
223
-
224
- Use `ManagerFieldEditorProps`, `ManagerFieldEditorRef`, and
225
- `useManagerFieldValue` from `@rakun-kit/manager-react/plugins` when implementing
226
- field editors. Next.js applications should import plugin objects inside a
227
- `'use client'` wrapper around `RakunManagerClientPage`; `RakunManagerPage` accepts
228
- that wrapper through `managerComponent`.
229
-
230
- ### Extending the RichText editor
231
-
232
- Manager plugins can register Lexical nodes and React plugins for every
233
- `RichText` field, including fields rendered inside relations, blocks, and
234
- modules:
235
-
236
- ```tsx
237
- 'use client'
238
-
239
- import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
240
- import {
241
- defineRakunManagerPlugin,
242
- type ManagerRichTextPluginProps,
243
- } from '@rakun-kit/manager-react/plugins'
244
- import { MentionNode } from './MentionNode'
245
-
246
- const MentionsPlugin = ({ id }: ManagerRichTextPluginProps) => {
247
- const [editor] = useLexicalComposerContext()
248
-
249
- // Register commands and listeners on `editor` here.
250
- return null
251
- }
252
-
253
- export const mentionsManagerPlugin = defineRakunManagerPlugin({
254
- id: '@acme/rakun-mentions',
255
- richText: {
256
- nodes: [MentionNode],
257
- plugins: [
258
- {
259
- id: '@acme/rakun-mentions.plugin',
260
- component: MentionsPlugin,
261
- placement: 'editor',
262
- },
263
- ],
264
- },
265
- })
266
- ```
267
-
268
- Lexical plugin components receive `ManagerRichTextPluginProps` (the field id,
269
- configuration, current content type, and related field metadata) and render
270
- inside `LexicalComposer`, so they can use the normal Lexical React hooks.
271
- Supported placements are `toolbar`, `block-format`, `editor` (the default),
272
- `actions-start`, and `actions-end`. `block-format` components render inside the
273
- manager's block selector and can use `ManagerRichTextBlockFormatItem` from
274
- `@rakun-kit/manager-react/rich-text`. Contributions keep declaration order
275
- unless an explicit `order` is provided. Node types and plugin ids must be unique;
276
- conflicts report both plugin owners. Node replacements use Lexical's standard
277
- `LexicalNodeReplacement` configuration.
278
-
279
- ## Exports
280
-
281
- - `@rakun-kit/manager-react`: manager app, providers, clients, navigation, router, layout, media, and state helpers.
282
- - `@rakun-kit/manager-react/client/http`: HTTP manager client.
283
- - `@rakun-kit/manager-react/client/request`: transport-agnostic manager client.
284
- - `@rakun-kit/manager-react/client/trpc`: tRPC proxy client adapter.
285
- - `@rakun-kit/manager-react/app/runtime-app`: `ManagerRuntimeApp`, `ManagerBrowserApp`.
286
- - `@rakun-kit/manager-react/state/navigation`: navigation helpers and provider.
287
- - `@rakun-kit/manager-react/link`: link component provider.
288
- - `@rakun-kit/manager-react/i18n`: locale runtime, catalog, and locale types.
289
- - `@rakun-kit/manager-react/styles.css`: bundled manager styles.
290
-
291
- ## Build
292
-
293
- ```sh
294
- bun run build --workspace @rakun-kit/manager-react
295
- ```
115
+
116
+ ## Styles
117
+
118
+ Import the package stylesheet once:
119
+
120
+ ```ts
121
+ import "@rakun-kit/manager-react/styles.css";
122
+ ```
123
+
124
+ ## Manager languages
125
+
126
+ English and the locale runtime are built into this package. Extra translations
127
+ ship from a separate package:
128
+
129
+ ```sh
130
+ bun add @rakun-kit/manager-locales
131
+ # or: npm install @rakun-kit/manager-locales
132
+ ```
133
+
134
+ Import only the locale needed by the server bootstrap:
135
+
136
+ ```ts
137
+ import { esManagerLocalePack } from '@rakun-kit/manager-locales/es'
138
+
139
+ rakunBootstrap({
140
+ // ...
141
+ managerLanguages: [esManagerLocalePack],
142
+ })
143
+ ```
144
+
145
+ Each language has an independent subpath, so application bundlers only include
146
+ the locales explicitly imported by the host.
147
+
148
+ Content-type titles and categories can use project-defined message keys without
149
+ adding them to the built-in `ManagerMessageKey` union. Add an English partial
150
+ pack and extend installed locales through `managerLanguages`:
151
+
152
+ ```ts
153
+ import { extendManagerLanguagePack } from '@rakun-kit/core/contracts'
154
+ import { esManagerLocalePack } from '@rakun-kit/manager-locales/es'
155
+
156
+ const managerLanguages = [
157
+ {
158
+ code: 'en',
159
+ name: 'English',
160
+ messages: {
161
+ 'field.title': 'Title',
162
+ 'layoutModule.header': 'Header',
163
+ 'project.contentTypes.article.menu': 'Articles',
164
+ },
165
+ },
166
+ extendManagerLanguagePack(esManagerLocalePack, {
167
+ 'field.title': 'Título',
168
+ 'layoutModule.header': 'Cabecera',
169
+ 'project.contentTypes.article.menu': 'Artículos',
170
+ }),
171
+ ]
172
+ ```
173
+
174
+ Then set `menu.title` or `menu.category` to that arbitrary key. Project keys are
175
+ resolved at runtime but remain outside the static manager catalog.
176
+
177
+ Field labels use the dynamic `field.<fieldName>` namespace. A content-type field
178
+ named `title`, for example, automatically resolves `field.title` in edit forms
179
+ and list columns without adding it to `ManagerMessageKey`.
180
+
181
+ Layout module labels follow `layoutModule.<layoutKey>`. For example, the
182
+ `header` slot automatically resolves `layoutModule.header` in its tab and
183
+ configuration panel.
184
+
185
+ ## Event Logs
186
+
187
+ Settings → Logs displays the persistent Rakun event stream through the native
188
+ `manager.logs.list` operation. The screen supports filters, cursor pagination,
189
+ and structured event details. Both the settings card and the operation require
190
+ the `system.eventLog.read` permission, which can be assigned from Settings →
191
+ User Roles.
192
+
193
+ ## Manager Plugins
194
+
195
+ Manager plugins run inside the normal providers and can add dashboard routes,
196
+ sidebar items, and custom field editors:
197
+
198
+ ```tsx
199
+ import {
200
+ defineRakunManagerPlugin,
201
+ ManagerBrowserApp,
202
+ } from '@rakun-kit/manager-react'
203
+
204
+ const analyticsManagerPlugin = defineRakunManagerPlugin({
205
+ id: '@acme/rakun-analytics',
206
+ routes: [{
207
+ id: 'dashboard',
208
+ path: '/analytics',
209
+ component: AnalyticsScreen,
210
+ permissions: ['plugin.analytics.view'],
211
+ }],
212
+ sidebar: [{
213
+ id: 'analytics',
214
+ title: 'Analytics',
215
+ routeId: 'dashboard',
216
+ position: 'primary',
217
+ group: 'Plugins',
218
+ }],
219
+ fieldEditors: {
220
+ '@acme/rakun-analytics.query': QueryEditor,
221
+ },
222
+ })
223
+
224
+ <ManagerBrowserApp plugins={[analyticsManagerPlugin]} {...props} />
225
+ ```
226
+
227
+ Use `ManagerFieldEditorProps`, `ManagerFieldEditorRef`, and
228
+ `useManagerFieldValue` from `@rakun-kit/manager-react/plugins` when implementing
229
+ field editors. Next.js applications should import plugin objects inside a
230
+ `'use client'` wrapper around `RakunManagerClientPage`; `RakunManagerPage` accepts
231
+ that wrapper through `managerComponent`.
232
+
233
+ ### Extending the RichText editor
234
+
235
+ Manager plugins can register Lexical nodes and React plugins for every
236
+ `RichText` field, including fields rendered inside relations, blocks, and
237
+ modules:
238
+
239
+ ```tsx
240
+ 'use client'
241
+
242
+ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
243
+ import {
244
+ defineRakunManagerPlugin,
245
+ type ManagerRichTextPluginProps,
246
+ } from '@rakun-kit/manager-react/plugins'
247
+ import { MentionNode } from './MentionNode'
248
+
249
+ const MentionsPlugin = ({ id }: ManagerRichTextPluginProps) => {
250
+ const [editor] = useLexicalComposerContext()
251
+
252
+ // Register commands and listeners on `editor` here.
253
+ return null
254
+ }
255
+
256
+ export const mentionsManagerPlugin = defineRakunManagerPlugin({
257
+ id: '@acme/rakun-mentions',
258
+ richText: {
259
+ nodes: [MentionNode],
260
+ plugins: [
261
+ {
262
+ id: '@acme/rakun-mentions.plugin',
263
+ component: MentionsPlugin,
264
+ placement: 'editor',
265
+ },
266
+ ],
267
+ },
268
+ })
269
+ ```
270
+
271
+ Lexical plugin components receive `ManagerRichTextPluginProps` (the field id,
272
+ configuration, current content type, and related field metadata) and render
273
+ inside `LexicalComposer`, so they can use the normal Lexical React hooks.
274
+ Supported placements are `toolbar`, `block-format`, `editor` (the default),
275
+ `actions-start`, and `actions-end`. `block-format` components render inside the
276
+ manager's block selector and can use `ManagerRichTextBlockFormatItem` from
277
+ `@rakun-kit/manager-react/rich-text`. Contributions keep declaration order
278
+ unless an explicit `order` is provided. Node types and plugin ids must be unique;
279
+ conflicts report both plugin owners. Node replacements use Lexical's standard
280
+ `LexicalNodeReplacement` configuration.
281
+
282
+ ## Exports
283
+
284
+ - `@rakun-kit/manager-react`: manager app, providers, clients, navigation, router, layout, media, and state helpers.
285
+ - `@rakun-kit/manager-react/client/http`: HTTP manager client.
286
+ - `@rakun-kit/manager-react/client/request`: transport-agnostic manager client.
287
+ - `@rakun-kit/manager-react/client/trpc`: tRPC proxy client adapter.
288
+ - `@rakun-kit/manager-react/app/runtime-app`: `ManagerRuntimeApp`, `ManagerBrowserApp`.
289
+ - `@rakun-kit/manager-react/state/navigation`: navigation helpers and provider.
290
+ - `@rakun-kit/manager-react/link`: link component provider.
291
+ - `@rakun-kit/manager-react/i18n`: locale runtime, catalog, and locale types.
292
+ - `@rakun-kit/manager-react/styles.css`: bundled manager styles.
293
+
294
+ ## Build
295
+
296
+ ```sh
297
+ bun run build --workspace @rakun-kit/manager-react
298
+ ```
@@ -19,8 +19,9 @@ const i18n_1 = require("../../../../i18n/index.js");
19
19
  const media_1 = require("../../../../media.js");
20
20
  exports.INSERT_IMAGE_COMMAND = (0, lexical_1.createCommand)('INSERT_IMAGE_COMMAND');
21
21
  const resolveImageSrc = async (media, request) => {
22
- if (media.previewUrl)
22
+ if (media.previewUrl && !media.previewUrl.startsWith('data:')) {
23
23
  return media.previewUrl;
24
+ }
24
25
  if (media.url)
25
26
  return media.url;
26
27
  const key = media.previewKey || media.key;
@@ -1 +1 @@
1
- {"version":3,"file":"image-toolbar-plugin.js","sourceRoot":"","sources":["../../../../../../src/components/editor/plugins/toolbar/image-toolbar-plugin.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;AAuCZ,oCAgBC;AAED,gDA0DC;;AAjHD,kFAAiF;AACjF,qCAA8E;AAE9E,+CAAwC;AACxC,iCAAwD;AACxD,mCAA8B;AAE9B,mEAG4C;AAC5C,iFAA+E;AAC/E,mDAA+C;AAC/C,0CAAiD;AACjD,iFAA0E;AAC1E,iCAAwC;AACxC,mCAAqE;AAIxD,QAAA,oBAAoB,GAC/B,IAAA,uBAAa,EAAC,sBAAsB,CAAC,CAAA;AAEvC,MAAM,eAAe,GAAG,KAAK,EAC3B,KAAkB,EAClB,OAAuD,EACvD,EAAE;IACF,IAAI,KAAK,CAAC,UAAU;QAAE,OAAO,KAAK,CAAC,UAAU,CAAA;IAC7C,IAAI,KAAK,CAAC,GAAG;QAAE,OAAO,KAAK,CAAC,GAAG,CAAA;IAE/B,MAAM,GAAG,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,GAAG,CAAA;IACzC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM;QAAE,OAAO,IAAI,CAAA;IAEtC,MAAM,MAAM,GAAG,MAAM,IAAA,uBAAe,EAAC,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,CAAA;IAChF,OAAO,MAAM,CAAC,GAAG,IAAI,IAAI,CAAA;AAC3B,CAAC,CAAA;AAED,SAAgB,YAAY;IAC1B,MAAM,CAAC,MAAM,CAAC,GAAG,IAAA,kDAAyB,GAAE,CAAA;IAE5C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,OAAO,MAAM,CAAC,eAAe,CAC3B,4BAAoB,EACpB,CAAC,OAAO,EAAE,EAAE;YACV,MAAM,SAAS,GAAG,IAAA,4BAAgB,EAAC,OAAO,CAAC,CAAA;YAC3C,IAAA,sBAAY,EAAC,CAAC,SAAS,CAAC,CAAC,CAAA;YACzB,OAAO,IAAI,CAAA;QACb,CAAC,EACD,iCAAuB,CACxB,CAAA;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEZ,OAAO,IAAI,CAAA;AACb,CAAC;AAED,SAAgB,kBAAkB;IAChC,MAAM,CAAC,GAAG,IAAA,sBAAe,GAAE,CAAA;IAC3B,MAAM,EAAE,YAAY,EAAE,GAAG,IAAA,mCAAiB,GAAE,CAAA;IAC5C,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAA,gBAAQ,GAAE,CAAA;IACvC,MAAM,aAAa,GAAG,IAAA,wBAAgB,GAAE,CAAA;IACxC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IAE7C,MAAM,sBAAsB,GAAG,IAAA,mBAAW,EAAC,KAAK,IAAI,EAAE;QACpD,IAAI,OAAO;YAAE,OAAM;QAEnB,UAAU,CAAC,IAAI,CAAC,CAAA;QAChB,IAAI,CAAC;YACH,MAAM,WAAW,GAAG,MAAM,gBAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;YAClE,IAAI,CAAC,WAAW;gBAAE,OAAM;YAExB,MAAM,KAAK,GAAG,CACZ,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAC/B,CAAA;YAC5B,IAAI,CAAC,KAAK;gBAAE,OAAM;YAElB,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,UAAU,CAAC,QAAQ,CAAC,EAAE,CAAC;gBACtC,cAAK,CAAC,KAAK,CAAC,CAAC,CAAC,8BAA8B,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAC,CAAA;gBACtE,OAAM;YACR,CAAC;YAED,MAAM,GAAG,GAAG,MAAM,eAAe,CAAC,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;YAC/D,IAAI,CAAC,GAAG,EAAE,CAAC;gBACT,cAAK,CAAC,KAAK,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAA;gBAC3C,OAAM;YACR,CAAC;YAED,YAAY,CAAC,eAAe,CAAC,4BAAoB,EAAE;gBACjD,GAAG;gBACH,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,IAAI,EAAE;gBACjD,OAAO,EAAE,KAAK,CAAC,GAAG;aACnB,CAAC,CAAA;YACF,YAAY,CAAC,KAAK,EAAE,CAAA;QACtB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,cAAK,CAAC,KAAK,CAAC,IAAA,gDAAqB,EAAC,KAAK,EAAE,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,CAAA;QAC3E,CAAC;gBAAS,CAAC;YACT,UAAU,CAAC,KAAK,CAAC,CAAA;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,EAAE,aAAa,CAAC,OAAO,EAAE,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAA;IAEvE,OAAO,CACL,uBAAC,eAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,WAAW,gBACT,CAAC,CAAC,sBAAsB,CAAC,EACrC,KAAK,EAAE,CAAC,CAAC,sBAAsB,CAAC,EAChC,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,sBAAsB,EAAE,YAE5C,uBAAC,wBAAS,IAAC,SAAS,EAAC,SAAS,GAAG,GAC1B,CACV,CAAA;AACH,CAAC"}
1
+ {"version":3,"file":"image-toolbar-plugin.js","sourceRoot":"","sources":["../../../../../../src/components/editor/plugins/toolbar/image-toolbar-plugin.tsx"],"names":[],"mappings":"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"}