dn-react-router-toolkit 0.8.0 → 0.9.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.
Files changed (71) hide show
  1. package/dist/api/index.js +13 -4
  2. package/dist/api/index.mjs +14 -5
  3. package/dist/api/item_api_handler.d.mts +4 -2
  4. package/dist/api/item_api_handler.d.ts +4 -2
  5. package/dist/api/item_api_handler.js +13 -4
  6. package/dist/api/item_api_handler.mjs +14 -5
  7. package/dist/crud/index.d.mts +0 -20
  8. package/dist/crud/index.d.ts +0 -20
  9. package/dist/crud/index.js +12 -8508
  10. package/dist/crud/index.mjs +0 -8516
  11. package/dist/post/index.js +67 -7705
  12. package/dist/post/index.mjs +54 -7717
  13. package/dist/post/post_form_page.js +67 -7705
  14. package/dist/post/post_form_page.mjs +54 -7717
  15. package/dist/table/index.d.mts +1 -3
  16. package/dist/table/index.d.ts +1 -3
  17. package/dist/table/index.js +83 -76
  18. package/dist/table/index.mjs +84 -74
  19. package/dist/table/load_table.d.mts +8 -2
  20. package/dist/table/load_table.d.ts +8 -2
  21. package/dist/table/load_table.js +23 -3
  22. package/dist/table/load_table.mjs +24 -3
  23. package/dist/table/loader.d.mts +3 -0
  24. package/dist/table/loader.d.ts +3 -0
  25. package/dist/table/loader.js +23 -3
  26. package/dist/table/loader.mjs +24 -3
  27. package/dist/table/repository.d.mts +6 -4
  28. package/dist/table/repository.d.ts +6 -4
  29. package/dist/table/repository.js +4 -0
  30. package/dist/table/repository.mjs +4 -0
  31. package/dist/table/table.d.mts +5 -2
  32. package/dist/table/table.d.ts +5 -2
  33. package/dist/table/table.js +38 -6
  34. package/dist/table/table.mjs +38 -6
  35. package/dist/table/table_form.d.mts +2 -2
  36. package/dist/table/table_form.d.ts +2 -2
  37. package/dist/table/table_form.js +52 -19
  38. package/dist/table/table_form.mjs +52 -19
  39. package/dist/table/use_table.d.mts +3 -3
  40. package/dist/table/use_table.d.ts +3 -3
  41. package/dist/table/use_table.js +1 -10
  42. package/dist/table/use_table.mjs +1 -10
  43. package/package.json +1 -1
  44. package/dist/crud/crud_loader.d.mts +0 -26
  45. package/dist/crud/crud_loader.d.ts +0 -26
  46. package/dist/crud/crud_loader.js +0 -322
  47. package/dist/crud/crud_loader.mjs +0 -307
  48. package/dist/crud/crud_page.d.mts +0 -32
  49. package/dist/crud/crud_page.d.ts +0 -32
  50. package/dist/crud/crud_page.js +0 -726
  51. package/dist/crud/crud_page.mjs +0 -708
  52. package/dist/crud/generate_handlers.d.mts +0 -16
  53. package/dist/crud/generate_handlers.d.ts +0 -16
  54. package/dist/crud/generate_handlers.js +0 -39
  55. package/dist/crud/generate_handlers.mjs +0 -14
  56. package/dist/crud/generate_pages.d.mts +0 -19
  57. package/dist/crud/generate_pages.d.ts +0 -19
  58. package/dist/crud/generate_pages.js +0 -55
  59. package/dist/crud/generate_pages.mjs +0 -30
  60. package/dist/crud/generate_routes.d.mts +0 -5
  61. package/dist/crud/generate_routes.d.ts +0 -5
  62. package/dist/crud/generate_routes.js +0 -7639
  63. package/dist/crud/generate_routes.mjs +0 -7627
  64. package/dist/table/item_loader.d.mts +0 -14
  65. package/dist/table/item_loader.d.ts +0 -14
  66. package/dist/table/item_loader.js +0 -43
  67. package/dist/table/item_loader.mjs +0 -18
  68. package/dist/table/page.d.mts +0 -16
  69. package/dist/table/page.d.ts +0 -16
  70. package/dist/table/page.js +0 -325
  71. package/dist/table/page.mjs +0 -300
@@ -1,726 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/crud/crud_page.tsx
21
- var crud_page_exports = {};
22
- __export(crud_page_exports, {
23
- crudPage: () => crudPage
24
- });
25
- module.exports = __toCommonJS(crud_page_exports);
26
- var import_react_router9 = require("react-router");
27
-
28
- // src/crud/crud_form_provider.tsx
29
- var import_react_router = require("react-router");
30
- var import_react_store_input = require("react-store-input");
31
- var import_react = require("react");
32
-
33
- // src/crud/serialize.ts
34
- function serialize(value) {
35
- if (value === void 0) {
36
- return void 0;
37
- }
38
- if (value === null) {
39
- return {
40
- type: "null",
41
- value: null
42
- };
43
- }
44
- if (typeof value === "string") {
45
- return {
46
- type: "string",
47
- value
48
- };
49
- }
50
- if (typeof value === "number") {
51
- return {
52
- type: "number",
53
- value
54
- };
55
- }
56
- if (typeof value === "boolean") {
57
- return {
58
- type: "boolean",
59
- value
60
- };
61
- }
62
- if (value instanceof Date) {
63
- return {
64
- type: "date",
65
- value: value.toISOString()
66
- };
67
- }
68
- if (Array.isArray(value)) {
69
- return {
70
- type: "array",
71
- value: value.map((item) => serialize(item))
72
- };
73
- }
74
- if (typeof value === "object") {
75
- return {
76
- type: "object",
77
- value: Object.entries(value).reduce(
78
- (acc, [key, value2]) => {
79
- return {
80
- ...acc,
81
- [key]: serialize(value2)
82
- };
83
- },
84
- {}
85
- )
86
- };
87
- }
88
- return void 0;
89
- }
90
-
91
- // src/crud/crud_form_provider.tsx
92
- var import_utils = require("dn-react-toolkit/utils");
93
- var import_jsx_runtime = require("react/jsx-runtime");
94
- var FormContext = (0, import_react.createContext)({});
95
- function useFormContext() {
96
- return (0, import_react.useContext)(FormContext);
97
- }
98
- function CrudFormProvider({
99
- primaryKey,
100
- name,
101
- prefix,
102
- item,
103
- columns = {},
104
- children
105
- }) {
106
- const apiPrefix = `/api${prefix}`;
107
- const createInitialState = () => {
108
- return Object.keys(item || columns).reduce((acc, key) => {
109
- const value2 = item ? item[key] : void 0;
110
- if (columns[key]?.defaultValue !== void 0) {
111
- if (typeof value2 === "number") {
112
- return {
113
- ...acc,
114
- [key]: value2 ?? columns[key]?.defaultValue
115
- };
116
- }
117
- return {
118
- ...acc,
119
- [key]: value2 || columns[key]?.defaultValue
120
- };
121
- }
122
- return {
123
- ...acc,
124
- [key]: value2
125
- };
126
- }, {});
127
- };
128
- const store = (0, import_react_store_input.useStore)(createInitialState());
129
- const navigate = (0, import_react_router.useNavigate)();
130
- const submit = async () => {
131
- const res = await fetch(apiPrefix, {
132
- method: "POST",
133
- headers: {
134
- "Content-Type": "application/json"
135
- },
136
- body: JSON.stringify(serialize(store.state))
137
- });
138
- if (!res.ok) {
139
- const { message } = await res.json();
140
- alert(message);
141
- return;
142
- }
143
- alert(`${import_utils.Korean.with(name, ["\uC744", "\uB97C"])} \uC800\uC7A5\uD588\uC2B5\uB2C8\uB2E4.`);
144
- const { id } = await res.json();
145
- navigate(`${prefix}/${id}`);
146
- };
147
- const deleteItem = async () => {
148
- if (!item || !primaryKey) {
149
- return;
150
- }
151
- const ok = confirm("\uC815\uB9D0\uB85C \uC0AD\uC81C\uD558\uC2DC\uACA0\uC2B5\uB2C8\uAE4C?");
152
- if (!ok) {
153
- return;
154
- }
155
- const res = await fetch(`${apiPrefix}/${item[primaryKey]}`, {
156
- method: "DELETE"
157
- });
158
- if (!res.ok) {
159
- const { message } = await res.json();
160
- alert(message);
161
- return;
162
- }
163
- alert(`${import_utils.Korean.with(name, ["\uC744", "\uB97C"])} \uC0AD\uC81C\uD588\uC2B5\uB2C8\uB2E4.`);
164
- navigate(`${prefix}`);
165
- };
166
- const value = {
167
- name,
168
- item,
169
- store,
170
- submit,
171
- delete: deleteItem,
172
- columns
173
- };
174
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormContext.Provider, { value, children });
175
- }
176
-
177
- // src/table/page.tsx
178
- var import_react_router6 = require("react-router");
179
-
180
- // src/table/table_form.tsx
181
- var import_react_router5 = require("react-router");
182
- var import_go2 = require("react-icons/go");
183
-
184
- // src/table/table.tsx
185
- var import_utils2 = require("dn-react-toolkit/utils");
186
- var import_go = require("react-icons/go");
187
- var import_react_router2 = require("react-router");
188
- var import_jsx_runtime2 = require("react/jsx-runtime");
189
- function Table({
190
- className = "min-w-full whitespace-nowrap",
191
- data,
192
- columns,
193
- mapper: Mapper,
194
- getLink,
195
- limit,
196
- offset,
197
- orderBy,
198
- direction
199
- }) {
200
- const keys = Object.entries(columns).filter((entry) => entry[1]).map(([key]) => key);
201
- const sortedArray = [...data];
202
- const [_, setSearchParams] = (0, import_react_router2.useSearchParams)();
203
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
204
- "table",
205
- {
206
- className: (0, import_utils2.cn)(className, "text-[15px] border-separate border-spacing-0"),
207
- children: [
208
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tr", { children: keys.map((key) => {
209
- const value = columns[key];
210
- function getReactNode() {
211
- if (value && typeof value === "object" && "label" in value) {
212
- return value.label;
213
- }
214
- return value;
215
- }
216
- function Head() {
217
- const reactNode = getReactNode();
218
- if (typeof reactNode === "string") {
219
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
220
- "button",
221
- {
222
- className: (0, import_utils2.cn)(
223
- orderBy === key ? "text-neutral-900 font-medium" : "text-neutral-500",
224
- "px-4 h-14 flex items-center w-full"
225
- ),
226
- onClick: () => {
227
- let newDirection = "asc";
228
- if (orderBy === key) {
229
- newDirection = direction === "asc" ? "desc" : "asc";
230
- }
231
- setSearchParams({
232
- orderBy: key,
233
- direction: newDirection
234
- });
235
- },
236
- children: [
237
- reactNode,
238
- orderBy === key && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "ml-0.5", children: direction === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_go.GoArrowUp, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_go.GoArrowDown, {}) })
239
- ]
240
- }
241
- );
242
- }
243
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: reactNode });
244
- }
245
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: (0, import_utils2.cn)("border-y font-normal"), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Head, {}) }, key);
246
- }) }) }),
247
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tbody", { children: [
248
- sortedArray.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
249
- "td",
250
- {
251
- colSpan: keys.length,
252
- className: "px-4 h-14 text-neutral-400 text-center",
253
- children: "\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4."
254
- }
255
- ) }),
256
- sortedArray.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("tr", { className: "hover:bg-gray-50 transition-colors", children: keys.map((key, i2) => {
257
- const value = item[key];
258
- function Content() {
259
- if (key in columns) {
260
- const column = columns[key];
261
- if (column && typeof column === "object" && "mapper" in column) {
262
- const mapper = column.mapper;
263
- if (mapper) {
264
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: mapper(item) });
265
- }
266
- }
267
- }
268
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: String(value) });
269
- }
270
- const linkedContent = getLink ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
271
- import_react_router2.Link,
272
- {
273
- to: getLink(item),
274
- className: "block content-center px-4 w-full h-full",
275
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Content, {})
276
- }
277
- ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Content, {});
278
- const cell = Mapper ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Mapper, { item, index: i2, children: linkedContent }) : linkedContent;
279
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("td", { className: "px-0 h-14 border-b", children: cell }, key);
280
- }) }, i))
281
- ] })
282
- ]
283
- }
284
- );
285
- }
286
-
287
- // src/table/use_table.tsx
288
- var import_react_router3 = require("react-router");
289
- function useTable() {
290
- const { table } = (0, import_react_router3.useLoaderData)();
291
- const { items, total, limit, offset, orderBy, direction, searchKey } = table;
292
- return {
293
- items,
294
- total,
295
- limit,
296
- offset,
297
- orderBy,
298
- direction,
299
- searchKey
300
- };
301
- }
302
-
303
- // src/table/buttons.tsx
304
- var import_utils3 = require("dn-react-toolkit/utils");
305
- var import_react_router4 = require("react-router");
306
- var import_jsx_runtime3 = require("react/jsx-runtime");
307
- function TablePageButtons({
308
- MAX_PAGES_TO_SHOW,
309
- total,
310
- limit,
311
- offset
312
- }) {
313
- const pages = Math.ceil(total / limit);
314
- const { pathname } = (0, import_react_router4.useLocation)();
315
- const [searchParams] = (0, import_react_router4.useSearchParams)();
316
- const currentPage = Math.floor(offset / limit) + 1;
317
- const startButton = (Math.ceil(currentPage / MAX_PAGES_TO_SHOW) - 1) * MAX_PAGES_TO_SHOW;
318
- const endButton = Math.min(startButton + MAX_PAGES_TO_SHOW - 1, pages);
319
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: pages > 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex justify-center items-center my-8 gap-4 text-neutral-400", children: [
320
- startButton > 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
321
- import_react_router4.Link,
322
- {
323
- to: (() => {
324
- searchParams.set(
325
- "offset",
326
- String((startButton - 1) * limit)
327
- );
328
- return `${pathname}?${searchParams.toString()}`;
329
- })(),
330
- className: "w-10 block text-center transition-colors hover:text-primary",
331
- children: "\uC774\uC804"
332
- }
333
- ),
334
- Array.from({
335
- length: Math.min(
336
- MAX_PAGES_TO_SHOW,
337
- pages - startButton
338
- )
339
- }).map((_, index) => {
340
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
341
- import_react_router4.Link,
342
- {
343
- to: (() => {
344
- searchParams.set(
345
- "offset",
346
- String((startButton + index) * limit)
347
- );
348
- return `${pathname}?${searchParams.toString()}`;
349
- })(),
350
- className: (0, import_utils3.cn)(
351
- "w-6 block text-center transition-colors",
352
- currentPage === startButton + index + 1 ? "font-bold text-primary" : "hover:text-primary"
353
- ),
354
- children: startButton + index + 1
355
- },
356
- index
357
- );
358
- }),
359
- endButton < pages && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
360
- import_react_router4.Link,
361
- {
362
- to: (() => {
363
- searchParams.set(
364
- "offset",
365
- String((endButton + 1) * limit)
366
- );
367
- return `${pathname}?${searchParams.toString()}`;
368
- })(),
369
- className: "w-10 block text-center transition-colors hover:text-primary",
370
- children: "\uB2E4\uC74C"
371
- }
372
- )
373
- ] }) });
374
- }
375
-
376
- // src/table/table_form.tsx
377
- var import_jsx_runtime4 = require("react/jsx-runtime");
378
- function TableForm({
379
- columns,
380
- primaryKey = "id"
381
- }) {
382
- const { pathname } = (0, import_react_router5.useLocation)();
383
- const { items, total, limit, offset, orderBy, direction, searchKey } = useTable();
384
- const navigate = (0, import_react_router5.useNavigate)();
385
- const search = (query) => {
386
- const searchParams2 = new URLSearchParams(window.location.search);
387
- searchParams2.set("query", query);
388
- searchParams2.set("offset", "0");
389
- navigate(`${pathname}?${searchParams2.toString()}`);
390
- };
391
- const [searchParams] = (0, import_react_router5.useSearchParams)();
392
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
393
- searchKey && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
394
- "form",
395
- {
396
- className: "h-18 px-4 flex items-center border-t",
397
- onSubmit: (e) => {
398
- e.preventDefault();
399
- const formData = new FormData(e.currentTarget);
400
- const query = formData.get("query");
401
- search(query);
402
- },
403
- children: [
404
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
405
- "button",
406
- {
407
- type: "submit",
408
- className: "w-10 h-10 flex justify-center items-center",
409
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_go2.GoSearch, { className: "text-xl mr-4" })
410
- }
411
- ),
412
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
413
- "input",
414
- {
415
- className: "outline-none h-full flex-1",
416
- placeholder: "\uC5EC\uAE30\uC5D0 \uAC80\uC0C9\uD558\uC138\uC694...",
417
- name: "query",
418
- defaultValue: searchParams.get("query") ?? ""
419
- }
420
- )
421
- ]
422
- }
423
- ),
424
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
425
- Table,
426
- {
427
- data: items,
428
- columns,
429
- getLink: primaryKey ? (item) => `${pathname}/${item[primaryKey]}` : void 0,
430
- limit,
431
- offset,
432
- orderBy,
433
- direction
434
- }
435
- ),
436
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
437
- TablePageButtons,
438
- {
439
- total,
440
- limit,
441
- offset,
442
- MAX_PAGES_TO_SHOW: 10
443
- }
444
- )
445
- ] });
446
- }
447
-
448
- // src/table/page.tsx
449
- var import_jsx_runtime5 = require("react/jsx-runtime");
450
- function createTablePage({
451
- name,
452
- columns,
453
- primaryKey = "id"
454
- }) {
455
- return function TablePage({
456
- header: Header
457
- }) {
458
- const { pathname } = (0, import_react_router6.useLocation)();
459
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
460
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
461
- Header,
462
- {
463
- title: name,
464
- actions: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react_router6.Link, { to: `${pathname}/new`, className: "button-primary", children: [
465
- name,
466
- " \uCD94\uAC00"
467
- ] })
468
- }
469
- ),
470
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "max-w-7xl mx-auto w-full overflow-auto", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TableForm, { columns, primaryKey }) })
471
- ] });
472
- };
473
- }
474
-
475
- // src/form/create_form_component.tsx
476
- var import_utils4 = require("dn-react-toolkit/utils");
477
- var import_react2 = require("react");
478
- var import_jsx_runtime6 = require("react/jsx-runtime");
479
- function createComponent(tag, options) {
480
- return function FormComponent({ className, ...props }) {
481
- const Tag = tag;
482
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Tag, { ...props, className: (0, import_utils4.cn)(options.className, className) });
483
- };
484
- }
485
-
486
- // src/form/form_components.tsx
487
- var FormEntry = createComponent("div", {
488
- className: "flex-1"
489
- });
490
- var FormRow = createComponent("div", {
491
- className: "flex-1 flex gap-4 mb-6"
492
- });
493
- var FormLabel = createComponent("label", {
494
- className: "flex-1 font-semibold mb-2.5 block"
495
- });
496
-
497
- // src/crud/crud_form.tsx
498
- var import_react_store_input3 = require("react-store-input");
499
-
500
- // src/client/env_loader.tsx
501
- var import_react_router7 = require("react-router");
502
- var import_jsx_runtime7 = require("react/jsx-runtime");
503
-
504
- // src/client/file_input.tsx
505
- var import_react3 = require("react");
506
- var import_jsx_runtime8 = require("react/jsx-runtime");
507
-
508
- // src/client/use_user_agent.tsx
509
- var import_react_router8 = require("react-router");
510
-
511
- // src/client/store_text_editor.tsx
512
- var import_dn_react_text_editor = require("dn-react-text-editor");
513
- var import_react_store_input2 = require("react-store-input");
514
- var import_react4 = require("react");
515
- var import_jsx_runtime9 = require("react/jsx-runtime");
516
- function StoreTextEditor({
517
- store,
518
- name,
519
- getter,
520
- setter,
521
- defaultValue,
522
- ref,
523
- ...props
524
- }) {
525
- const controllerRef = (0, import_react4.useRef)(null);
526
- (0, import_react4.useImperativeHandle)(
527
- ref,
528
- () => controllerRef.current,
529
- []
530
- );
531
- const { dispatch } = (0, import_react_store_input2.useStoreController)(store, {
532
- onSubscribe: (state) => {
533
- const controller = controllerRef.current;
534
- if (!controller) {
535
- return;
536
- }
537
- const getResult = () => {
538
- if (getter) {
539
- return getter(state) || "";
540
- }
541
- if (name) {
542
- return state[name] || "";
543
- }
544
- return "";
545
- };
546
- const result = getResult();
547
- if (controller.value !== result) {
548
- controller.value = result;
549
- }
550
- },
551
- onDispatch: (state) => {
552
- const controller = controllerRef.current;
553
- if (!controller) {
554
- return;
555
- }
556
- if (setter) {
557
- setter(state, controller.value);
558
- return;
559
- }
560
- if (name) {
561
- state[name] = controller.value;
562
- }
563
- }
564
- });
565
- const getDefaultValue = () => {
566
- if (getter) {
567
- return getter(store.state);
568
- }
569
- if (name) {
570
- return store.state[name];
571
- }
572
- return void 0;
573
- };
574
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
575
- import_dn_react_text_editor.TextEditor,
576
- {
577
- ...props,
578
- ref: controllerRef,
579
- defaultValue: defaultValue ?? getDefaultValue(),
580
- onChange: (e) => {
581
- dispatch();
582
- props.onChange?.(e);
583
- }
584
- }
585
- );
586
- }
587
-
588
- // src/client/editor.tsx
589
- var import_client = require("dn-react-toolkit/file/client");
590
-
591
- // src/crud/crud_form.tsx
592
- var import_jsx_runtime10 = require("react/jsx-runtime");
593
- function CrudForm({
594
- AdminHeader
595
- }) {
596
- const form = useFormContext();
597
- const component = (0, import_react_store_input3.useStoreComponent)(form.store);
598
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
599
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
600
- AdminHeader,
601
- {
602
- title: `${form.name} ${form.item ? "\uC218\uC815" : "\uCD94\uAC00"}`,
603
- actions: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
604
- form.item && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
605
- "button",
606
- {
607
- type: "button",
608
- className: "button-outline",
609
- onClick: () => {
610
- form.delete();
611
- },
612
- children: "\uC0AD\uC81C\uD558\uAE30"
613
- }
614
- ),
615
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
616
- "button",
617
- {
618
- type: "button",
619
- className: "button-primary",
620
- onClick: form.submit,
621
- children: "\uC800\uC7A5\uD558\uAE30"
622
- }
623
- )
624
- ] })
625
- }
626
- ),
627
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-w-2xl mx-auto", children: Object.keys(form.columns).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, { children: Object.entries(form.columns).map(
628
- ([name, value]) => {
629
- function InputComponent() {
630
- if (value.component) {
631
- const Component = value.component;
632
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, { store: form.store, name });
633
- }
634
- if (value.type === "textarea") {
635
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
636
- StoreTextEditor,
637
- {
638
- store: form.store,
639
- name,
640
- editor: {
641
- attributes: {
642
- class: "text-editor-form"
643
- }
644
- }
645
- }
646
- );
647
- }
648
- if (value.options) {
649
- const Component = value.options;
650
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(component.select, { name, className: "select-form", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Component, {}) });
651
- }
652
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
653
- component.input,
654
- {
655
- name,
656
- type: value.type,
657
- className: "input-form"
658
- }
659
- );
660
- }
661
- const v = form.store.state[name];
662
- if (typeof v === "boolean") {
663
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex", children: [
664
- value.label,
665
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "ml-auto", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(InputComponent, {}) })
666
- ] });
667
- }
668
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FormRow, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(FormEntry, { children: [
669
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FormLabel, { children: value.label }, name),
670
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(InputComponent, {})
671
- ] }) }, name);
672
- }
673
- ) }) })
674
- ] });
675
- }
676
-
677
- // src/crud/crud_page.tsx
678
- var import_jsx_runtime11 = require("react/jsx-runtime");
679
- function crudPage({
680
- name,
681
- primaryKey,
682
- tablePageOptions,
683
- formOptions,
684
- header
685
- }) {
686
- const create = (prefix) => {
687
- return function Page() {
688
- const data = (0, import_react_router9.useLoaderData)();
689
- const { pathname } = (0, import_react_router9.useLocation)();
690
- if (pathname === prefix) {
691
- const Component = createTablePage({
692
- ...tablePageOptions,
693
- name
694
- });
695
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Component, { header });
696
- }
697
- if (pathname.startsWith(prefix)) {
698
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
699
- CrudFormProvider,
700
- {
701
- item: data?.item,
702
- prefix,
703
- name,
704
- columns: formOptions.columns,
705
- primaryKey,
706
- children: formOptions.form ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(FormDelegate, { component: formOptions.form }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CrudForm, { AdminHeader: header })
707
- }
708
- );
709
- }
710
- };
711
- };
712
- return {
713
- name,
714
- create
715
- };
716
- }
717
- function FormDelegate({
718
- component: Component
719
- }) {
720
- const form = useFormContext();
721
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Component, { form });
722
- }
723
- // Annotate the CommonJS export names for ESM import in node:
724
- 0 && (module.exports = {
725
- crudPage
726
- });