@rulab/adminjs-components 0.1.0-alpha.1 → 0.1.0-alpha.2

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/dist/index.cjs CHANGED
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
- var __create = Object.create;
3
2
  var __defProp = Object.defineProperty;
4
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
6
  var __export = (target, all) => {
9
7
  for (var name in all)
@@ -17,566 +15,18 @@ var __copyProps = (to, from, except, desc) => {
17
15
  }
18
16
  return to;
19
17
  };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
18
+ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
28
19
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
-
30
- // src/index.ts
31
20
  var index_exports = {};
32
21
  __export(index_exports, {
33
- ColorStatusEdit: () => ColorStatusEdit_default,
34
- ColorStatusList: () => ColorStatusList_default,
35
- ColorStatusShow: () => ColorStatusShow_default,
36
- SlugEdit: () => SlugEdit_default,
37
- SlugFeature: () => SlugFeature_default,
38
- StringList: () => StringList_default,
39
- StringListShow: () => StringListShow_default,
40
- parseHtml: () => parseHtml
22
+ parseHtml: () => import_parseHtml.parseHtml
41
23
  });
42
24
  module.exports = __toCommonJS(index_exports);
43
-
44
- // node_modules/.pnpm/tsup@8.3.5_typescript@5.4.5/node_modules/tsup/assets/cjs_shims.js
45
- var getImportMetaUrl = () => typeof document === "undefined" ? new URL(`file:${__filename}`).href : document.currentScript && document.currentScript.src || new URL("main.js", document.baseURI).href;
46
- var importMetaUrl = /* @__PURE__ */ getImportMetaUrl();
47
-
48
- // src/components/ColorStatus/ColorStatusEdit.tsx
49
- var import_react = __toESM(require("react"), 1);
50
- var import_react_select = __toESM(require("react-select"), 1);
51
- var import_chroma_js = __toESM(require("chroma-js"), 1);
52
-
53
- // src/components/ColorStatus/styles.ts
54
- var import_styled_components = require("@adminjs/design-system/styled-components");
55
- var ColorStatusWrapper = import_styled_components.styled.div`
56
- margin-bottom: 24px;
57
- `;
58
- var Label = import_styled_components.styled.div`
59
- font-size: 12px;
60
- margin-bottom: 8px;
61
- `;
62
- var ShowLabel = import_styled_components.styled.div`
63
- font-size: 12px;
64
- margin-bottom: 8px;
65
- color: rgb(137, 138, 154);
66
- `;
67
- var ColorStatusBadgeWrapper = import_styled_components.styled.div`
68
- margin-bottom: 20px;
69
- `;
70
- var ColorStatusBadge = import_styled_components.styled.div`
71
- background-color: ${(props) => props.color};
72
- width: fit-content;
73
- padding: 5px 10px;
74
- border-radius: 20px;
75
- font-size: 12px;
76
- color: white;
77
- white-space: nowrap;
78
- `;
79
-
80
- // src/components/ColorStatus/ColorStatusEdit.tsx
81
- var dot = (color = "transparent") => ({
82
- alignItems: "center",
83
- display: "flex",
84
- ":before": {
85
- backgroundColor: color,
86
- borderRadius: 10,
87
- content: '" "',
88
- display: "block",
89
- marginRight: 8,
90
- height: 10,
91
- width: 10
92
- }
93
- });
94
- var colorStyles = {
95
- control: (styles) => ({ ...styles, backgroundColor: "white" }),
96
- option: (styles, { data, isDisabled, isFocused, isSelected }) => {
97
- const color = (0, import_chroma_js.default)(data.color);
98
- return {
99
- ...styles,
100
- backgroundColor: isSelected ? data.color : isFocused ? color.alpha(0.1).css() : void 0,
101
- color: isSelected ? import_chroma_js.default.contrast(color, "white") > 2 ? "white" : "black" : data.color,
102
- ":active": {
103
- ...styles[":active"],
104
- backgroundColor: isSelected ? data.color : color.alpha(0.3).css()
105
- }
106
- };
107
- },
108
- input: (styles) => ({ ...styles, ...dot() }),
109
- placeholder: (styles) => ({ ...styles, ...dot("#ccc") }),
110
- singleValue: (styles, { data }) => ({ ...styles, ...dot(data.color) })
111
- };
112
- var ColorStatus = ({ property, record, onChange }) => {
113
- const availableValues = property.availableValues;
114
- const currentOption = availableValues.find(
115
- (item) => item.value === record.params[property.path]
116
- );
117
- const [selectOption, setCurrentOption] = (0, import_react.useState)(currentOption);
118
- const handleSelectChange = (option) => {
119
- setCurrentOption(option);
120
- };
121
- (0, import_react.useEffect)(() => {
122
- onChange(property.path, selectOption?.value);
123
- }, [selectOption]);
124
- return /* @__PURE__ */ import_react.default.createElement(ColorStatusWrapper, null, /* @__PURE__ */ import_react.default.createElement(Label, null, property.path), /* @__PURE__ */ import_react.default.createElement(
125
- import_react_select.default,
126
- {
127
- className: "basic-single",
128
- classNamePrefix: "select",
129
- defaultValue: selectOption ?? availableValues[0],
130
- onChange: handleSelectChange,
131
- isClearable: true,
132
- name: "color",
133
- options: availableValues,
134
- styles: colorStyles
135
- }
136
- ));
137
- };
138
- var ColorStatusEdit_default = ColorStatus;
139
-
140
- // src/components/ColorStatus/ColorStatusShow.tsx
141
- var import_react2 = __toESM(require("react"), 1);
142
- var ColorStatusShow = ({ property, record }) => {
143
- const currentOption = property.availableValues?.find(
144
- (item) => item.value === record.params[property.path]
145
- );
146
- return /* @__PURE__ */ import_react2.default.createElement(ColorStatusBadgeWrapper, null, /* @__PURE__ */ import_react2.default.createElement(ShowLabel, null, property.path), /* @__PURE__ */ import_react2.default.createElement(ColorStatusBadge, { color: currentOption.color }, record.params[property.path]));
147
- };
148
- var ColorStatusShow_default = ColorStatusShow;
149
-
150
- // src/components/ColorStatus/ColorStatusList.tsx
151
- var import_react3 = __toESM(require("react"), 1);
152
- var ColorStatusList = ({ property, record }) => {
153
- const currentOption = property.availableValues?.find(
154
- (item) => item.value === record.params[property.path]
155
- );
156
- return /* @__PURE__ */ import_react3.default.createElement(ColorStatusBadge, { color: currentOption.color }, record.params[property.path]);
157
- };
158
- var ColorStatusList_default = ColorStatusList;
159
-
160
- // src/components/Slug/SlugEdit.tsx
161
- var import_react4 = __toESM(require("react"), 1);
162
- var import_styled_components3 = require("styled-components");
163
- var import_design_system2 = require("@adminjs/design-system");
164
-
165
- // src/utils/parseHtml.ts
166
- var import_editorjs_html = __toESM(require("editorjs-html"), 1);
167
- var tableParser = (block) => {
168
- const rows = block.data.content.map((row, index) => {
169
- const tableHtml = [];
170
- if (block.data.withHeadings && index === 0) {
171
- tableHtml.push(`<tr>${row.map((cell) => `<th>${cell}</th>`)}</tr>`);
172
- } else {
173
- tableHtml.push(`<tr>${row.map((cell) => `<td>${cell}</td>`)}</tr>`);
174
- }
175
- return tableHtml;
176
- });
177
- if (block.data.withHeadings) {
178
- const heading = rows[0];
179
- const [, ...content] = rows;
180
- return `<table><thead>${heading.join("")}</thead><tbody>${content.join("")}</tbody></table>`;
181
- } else {
182
- return `<table><tbody>${rows.join("")}</tbody></table>`;
183
- }
184
- };
185
- var audioPlayerParser = (block) => {
186
- return `<audio controls src={${block.data.src}} />`;
187
- };
188
- var parseHtml = (jsonData) => {
189
- const edjsParser = (0, import_editorjs_html.default)({
190
- table: tableParser,
191
- audioPlayer: audioPlayerParser
192
- });
193
- try {
194
- const data = edjsParser.parse(JSON.parse(jsonData));
195
- return String(data).replace(/>,</g, "><");
196
- } catch (e) {
197
- console.log("error", e);
198
- }
199
- };
200
-
201
- // src/utils/slugifyImport.ts
202
- var import_slugify = __toESM(require("slugify"), 1);
203
- var slugifyImport_default = import_slugify.default;
204
-
205
- // src/utils/slugifyTitle.ts
206
- var slugifyTitle = (title) => {
207
- return slugifyImport_default(title, {
208
- replacement: "-",
209
- remove: /[*+~.()'"!:@]/g,
210
- lower: true,
211
- locale: "vi",
212
- trim: true
213
- });
214
- };
215
-
216
- // src/components/Slug/styles.ts
217
- var import_styled_components2 = require("@adminjs/design-system/styled-components");
218
- var import_design_system = require("@adminjs/design-system");
219
- var StyledInputWrapper = (0, import_styled_components2.styled)(import_design_system.Box)`
220
- display: flex;
221
- margin-bottom: 40px;
222
- `;
223
- var StyledCustomInput = (0, import_styled_components2.styled)(import_design_system.Input)`
224
- width: 100%;
225
- margin-right: 10px;
226
- `;
227
- var StyledGenerateButton = (0, import_styled_components2.styled)(import_design_system.Button)`
228
- white-space: nowrap;
229
- `;
230
- var StyledLabel = import_styled_components2.styled.div`
231
- font-size: 12px;
232
- margin-bottom: 8px;
233
- text-transform: capitalize;
234
- `;
235
-
236
- // src/components/Slug/SlugEdit.tsx
237
- var SlugEdit = ({
238
- property,
239
- record,
240
- resource,
241
- onChange
242
- }) => {
243
- const [inputValue, setInputValue] = (0, import_react4.useState)(record.params.slug);
244
- (0, import_react4.useEffect)(() => {
245
- onChange(property.path, inputValue);
246
- }, [inputValue]);
247
- return /* @__PURE__ */ import_react4.default.createElement(import_styled_components3.ThemeProvider, { theme: import_design_system2.theme }, /* @__PURE__ */ import_react4.default.createElement(StyledLabel, { htmlFor: "customSlug" }, property.path), /* @__PURE__ */ import_react4.default.createElement(StyledInputWrapper, null, /* @__PURE__ */ import_react4.default.createElement(
248
- StyledCustomInput,
249
- {
250
- id: property.path,
251
- name: property.path,
252
- value: inputValue,
253
- onChange: handleInput
254
- }
255
- ), /* @__PURE__ */ import_react4.default.createElement(StyledGenerateButton, { variant: "outlined", onClick: generateSlug }, "Generate Slug")));
256
- function handleInput(e) {
257
- setInputValue(e.target.value);
258
- }
259
- function generateSlug(e) {
260
- e.preventDefault();
261
- const slugSource = record.params[property.props.sourceField ?? resource.titleProperty.name];
262
- if (slugSource) {
263
- setInputValue(slugifyTitle(slugSource));
264
- }
265
- }
266
- };
267
- var SlugEdit_default = SlugEdit;
268
-
269
- // src/components/StringList/StringList.tsx
270
- var import_design_system5 = require("@adminjs/design-system");
271
- var import_react8 = __toESM(require("react"), 1);
272
- var import_styled_components7 = require("styled-components");
273
-
274
- // src/components/StringList/styles.ts
275
- var import_design_system3 = require("@adminjs/design-system");
276
- var import_styled_components4 = require("@adminjs/design-system/styled-components");
277
- var StyledWrapper = (0, import_styled_components4.styled)(import_design_system3.Box)`
278
- display: flex;
279
- flex-direction: column;
280
- margin-bottom: 45px;
281
- `;
282
- var StyledCustomInput2 = (0, import_styled_components4.styled)(import_design_system3.Input)`
283
- width: 100%;
284
- margin-right: 10px;
285
- `;
286
- var StyledInputWrapper2 = (0, import_styled_components4.styled)(import_design_system3.Box)`
287
- display: flex;
288
- `;
289
- var StyledListWrapper = (0, import_styled_components4.styled)(import_design_system3.Box)`
290
- margin-bottom: 15px;
291
- `;
292
- var StyledLabel2 = import_styled_components4.styled.div`
293
- font-size: 12px;
294
- margin-bottom: 8px;
295
- text-transform: capitalize;
296
- `;
297
- var StyledShowLabel = (0, import_styled_components4.styled)(StyledLabel2)`
298
- line-height: 16px;
299
- color: rgb(137, 138, 154);
300
- font-weight: 300;
301
- `;
302
- var StyledShowWrapper = (0, import_styled_components4.styled)(import_design_system3.Box)`
303
- margin-bottom: 35px;
304
- `;
305
- var StyledListItem = import_styled_components4.styled.li`
306
- margin-bottom: 5px;
307
- `;
308
-
309
- // src/components/StringList/SortableList/SortableList.tsx
310
- var import_react7 = __toESM(require("react"), 1);
311
- var import_core = require("@dnd-kit/core");
312
- var import_sortable2 = require("@dnd-kit/sortable");
313
-
314
- // src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx
315
- var import_react6 = __toESM(require("react"), 1);
316
- var import_sortable = require("@dnd-kit/sortable");
317
- var import_design_system4 = require("@adminjs/design-system");
318
-
319
- // src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx
320
- var import_react5 = __toESM(require("react"), 1);
321
-
322
- // src/components/StringList/SortableList/components/SortableItem/styles.ts
323
- var import_styled_components5 = require("@adminjs/design-system/styled-components");
324
- var StyledListItem2 = import_styled_components5.styled.li`
325
- display: flex;
326
- justify-content: space-between;
327
- align-items: center;
328
- background-color: #fff;
329
- padding: 10px 20px 10px 15px;
330
- box-shadow:
331
- 0 0 0 calc(1px / var(--scale-x, 1)) rgba(63, 63, 68, 0.05),
332
- 0 1px calc(3px / var(--scale-x, 1)) 0 rgba(34, 33, 81, 0.15);
333
- border-radius: 5px;
334
- list-style: none;
335
- `;
336
- var StyledDragButton = import_styled_components5.styled.button`
337
- padding: 3px;
338
- margin-right: 15px;
339
- cursor: move;
340
- background: none;
341
- border: none;
342
- `;
343
-
344
- // src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx
345
- var DragHandle = ({ context }) => {
346
- const { attributes, listeners, ref } = (0, import_react5.useContext)(context);
347
- return /* @__PURE__ */ import_react5.default.createElement(StyledDragButton, { ...attributes, ...listeners, ref }, /* @__PURE__ */ import_react5.default.createElement("svg", { viewBox: "0 0 20 20", width: "13" }, /* @__PURE__ */ import_react5.default.createElement("path", { d: "M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z" })));
348
- };
349
-
350
- // src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx
351
- var SortableItemContext = (0, import_react6.createContext)({
352
- attributes: {},
353
- listeners: void 0,
354
- ref() {
355
- }
356
- });
357
- function SortableItem({
358
- children,
359
- id,
360
- onDelete
361
- }) {
362
- const { attributes, isDragging, listeners, setNodeRef, setActivatorNodeRef } = (0, import_sortable.useSortable)({ id });
363
- const context = (0, import_react6.useMemo)(
364
- () => ({
365
- attributes,
366
- listeners,
367
- ref: setActivatorNodeRef
368
- }),
369
- [attributes, listeners, setActivatorNodeRef]
370
- );
371
- const style = {
372
- opacity: isDragging ? 0.4 : void 0
373
- };
374
- return /* @__PURE__ */ import_react6.default.createElement(SortableItemContext.Provider, { value: context }, /* @__PURE__ */ import_react6.default.createElement(StyledListItem2, { ref: setNodeRef, style }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement(DragHandle, { context: SortableItemContext }), children), /* @__PURE__ */ import_react6.default.createElement(
375
- import_design_system4.Button,
376
- {
377
- variant: "outlined",
378
- color: "danger",
379
- size: "icon",
380
- onClick: (e) => onDelete(e, id)
381
- },
382
- /* @__PURE__ */ import_react6.default.createElement(import_design_system4.Icon, { icon: "X", color: "red" })
383
- )));
384
- }
385
-
386
- // src/components/StringList/SortableList/styles.ts
387
- var import_styled_components6 = require("@adminjs/design-system/styled-components");
388
- var StyledListWrapper2 = import_styled_components6.styled.ul`
389
- display: flex;
390
- flex-direction: column;
391
- gap: 12px;
392
- padding: 0;
393
- list-style: none;
394
- `;
395
-
396
- // src/components/StringList/SortableList/SortableList.tsx
397
- var dropAnimationConfig = {
398
- sideEffects: (0, import_core.defaultDropAnimationSideEffects)({
399
- styles: {
400
- active: {
401
- opacity: "0.4"
402
- }
403
- }
404
- })
405
- };
406
- function SortableList({
407
- items,
408
- onChange,
409
- renderItem
410
- }) {
411
- const [active, setActive] = (0, import_react7.useState)(null);
412
- const activeItem = (0, import_react7.useMemo)(
413
- () => items.find((item) => item.id === active?.id),
414
- [active, items]
415
- );
416
- const sensors = (0, import_core.useSensors)(
417
- (0, import_core.useSensor)(import_core.PointerSensor),
418
- (0, import_core.useSensor)(import_core.KeyboardSensor, {
419
- coordinateGetter: import_sortable2.sortableKeyboardCoordinates
420
- })
421
- );
422
- return /* @__PURE__ */ import_react7.default.createElement(
423
- import_core.DndContext,
424
- {
425
- sensors,
426
- onDragStart: ({ active: active2 }) => {
427
- setActive(active2);
428
- },
429
- onDragEnd: ({ active: active2, over }) => {
430
- if (over && active2.id !== over?.id) {
431
- const activeIndex = items.findIndex(({ id }) => id === active2.id);
432
- const overIndex = items.findIndex(({ id }) => id === over.id);
433
- onChange((0, import_sortable2.arrayMove)(items, activeIndex, overIndex));
434
- }
435
- setActive(null);
436
- },
437
- onDragCancel: () => {
438
- setActive(null);
439
- }
440
- },
441
- /* @__PURE__ */ import_react7.default.createElement(import_sortable2.SortableContext, { items, strategy: import_sortable2.verticalListSortingStrategy }, /* @__PURE__ */ import_react7.default.createElement(StyledListWrapper2, { role: "application" }, items.map((item, index) => /* @__PURE__ */ import_react7.default.createElement(import_react7.Fragment, { key: index }, renderItem(item))))),
442
- /* @__PURE__ */ import_react7.default.createElement(import_core.DragOverlay, { dropAnimation: dropAnimationConfig }, activeItem ? renderItem(activeItem) : null)
443
- );
444
- }
445
- SortableList.Item = SortableItem;
446
-
447
- // src/components/StringList/constants.ts
448
- var separator = "|";
449
-
450
- // src/components/StringList/StringList.tsx
451
- var StringList = ({
452
- record,
453
- onChange,
454
- property,
455
- stringListSeparator = separator
456
- }) => {
457
- const stringListValue = record.params?.[property.path] ?? property.props.value ?? "";
458
- const initialList = stringListValue ? prepareDataForList(stringListValue) : [];
459
- const [inputValue, setInputValue] = (0, import_react8.useState)("");
460
- const [list, setList] = (0, import_react8.useState)(initialList);
461
- const serializedData = prepareDataForDatabase(list);
462
- (0, import_react8.useEffect)(() => {
463
- onChange(property.path, serializedData);
464
- }, [serializedData]);
465
- return /* @__PURE__ */ import_react8.default.createElement(import_styled_components7.ThemeProvider, { theme: import_design_system5.theme }, /* @__PURE__ */ import_react8.default.createElement(StyledLabel2, { htmlFor: "custom" }, property.path), /* @__PURE__ */ import_react8.default.createElement(StyledWrapper, null, /* @__PURE__ */ import_react8.default.createElement(StyledListWrapper, null, /* @__PURE__ */ import_react8.default.createElement(
466
- SortableList,
467
- {
468
- items: list,
469
- onChange: setList,
470
- renderItem: (item) => /* @__PURE__ */ import_react8.default.createElement(SortableList.Item, { id: item.id, onDelete: handleDeleteButton }, item.value)
471
- }
472
- )), /* @__PURE__ */ import_react8.default.createElement(StyledInputWrapper2, null, /* @__PURE__ */ import_react8.default.createElement(
473
- import_design_system5.Input,
474
- {
475
- id: "stringList",
476
- name: property.path,
477
- value: serializedData,
478
- hidden: true
479
- }
480
- ), /* @__PURE__ */ import_react8.default.createElement(
481
- StyledCustomInput2,
482
- {
483
- id: "custom",
484
- name: "customInput",
485
- value: inputValue,
486
- onChange: handleInput,
487
- onKeyPress: handleEnterPress
488
- }
489
- ), /* @__PURE__ */ import_react8.default.createElement(import_design_system5.Button, { variant: "outlined", onClick: handleAddButton }, "Add"))));
490
- function handleInput(e) {
491
- setInputValue(e.target.value);
492
- }
493
- function handleEnterPress(e) {
494
- if (e.key === "Enter") {
495
- handleAddButton(e);
496
- }
497
- }
498
- function handleAddButton(e) {
499
- e.preventDefault();
500
- if (Boolean(inputValue)) {
501
- setList([...list, createListObject(inputValue)]);
502
- setInputValue("");
503
- }
504
- }
505
- function handleDeleteButton(e, id) {
506
- e.preventDefault();
507
- const newData = list.filter((item) => item.id !== id);
508
- setList(newData);
509
- }
510
- function prepareDataForDatabase(list2) {
511
- return list2.map(({ value }) => value).join(stringListSeparator);
512
- }
513
- function prepareDataForList(str) {
514
- return str.split(stringListSeparator).map((item) => createListObject(item));
515
- }
516
- function createListObject(value) {
517
- return {
518
- id: `${Date.now()}-${Math.floor(Math.random() * 1e3)}`,
519
- value
520
- };
521
- }
522
- };
523
- var StringList_default = StringList;
524
-
525
- // src/components/StringList/StringListShow.tsx
526
- var import_react9 = __toESM(require("react"), 1);
527
- var import_styled_components8 = require("styled-components");
528
- var import_design_system6 = require("@adminjs/design-system");
529
- var StringListShow = ({
530
- property,
531
- record,
532
- stringListSeparator = separator
533
- }) => {
534
- return /* @__PURE__ */ import_react9.default.createElement(import_styled_components8.ThemeProvider, { theme: import_design_system6.theme }, /* @__PURE__ */ import_react9.default.createElement(StyledShowWrapper, null, /* @__PURE__ */ import_react9.default.createElement(StyledShowLabel, null, property.path), record.params.facts && /* @__PURE__ */ import_react9.default.createElement("ul", null, record.params.facts.split(stringListSeparator).map((item, index) => /* @__PURE__ */ import_react9.default.createElement(StyledListItem, { key: index }, `- ${item}`)))));
535
- };
536
- var StringListShow_default = StringListShow;
537
-
538
- // src/components/Slug/SlugFeature.ts
539
- var import_adminjs = require("adminjs");
540
-
541
- // src/utils/bundle-component.ts
542
- var import_path = __toESM(require("path"), 1);
543
- var url = __toESM(require("url"), 1);
544
- var dirname = url.fileURLToPath(new URL(".", importMetaUrl));
545
- var bundleComponent = (loader, componentName, componentFile) => {
546
- const componentPath = import_path.default.join(dirname, "../src/components", componentName, componentFile);
547
- console.log("[bundleComponent] Registering:", componentPath);
548
- return loader.add(componentName, componentPath);
549
- };
550
-
551
- // src/components/Slug/SlugFeature.ts
552
- var COMPONENT_NAME = "Slug";
553
- var SlugFeature = (config) => {
554
- const { componentLoader, key } = config;
555
- const uploadFeature = () => {
556
- const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, "SlugEdit.tsx");
557
- return (0, import_adminjs.buildFeature)({
558
- properties: {
559
- [key]: {
560
- isVisible: { show: false, edit: true, list: false, filter: false },
561
- components: {
562
- edit: editComponent
563
- }
564
- }
565
- }
566
- });
567
- };
568
- return uploadFeature();
569
- };
570
- var SlugFeature_default = SlugFeature;
25
+ __reExport(index_exports, require("./components/index.js"), module.exports);
26
+ var import_parseHtml = require("./utils/parseHtml.js");
571
27
  // Annotate the CommonJS export names for ESM import in node:
572
28
  0 && (module.exports = {
573
- ColorStatusEdit,
574
- ColorStatusList,
575
- ColorStatusShow,
576
- SlugEdit,
577
- SlugFeature,
578
- StringList,
579
- StringListShow,
580
- parseHtml
29
+ parseHtml,
30
+ ...require("./components/index.js")
581
31
  });
582
32
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../node_modules/.pnpm/tsup@8.3.5_typescript@5.4.5/node_modules/tsup/assets/cjs_shims.js","../src/components/ColorStatus/ColorStatusEdit.tsx","../src/components/ColorStatus/styles.ts","../src/components/ColorStatus/ColorStatusShow.tsx","../src/components/ColorStatus/ColorStatusList.tsx","../src/components/Slug/SlugEdit.tsx","../src/utils/parseHtml.ts","../src/utils/slugifyImport.ts","../src/utils/slugifyTitle.ts","../src/components/Slug/styles.ts","../src/components/StringList/StringList.tsx","../src/components/StringList/styles.ts","../src/components/StringList/SortableList/SortableList.tsx","../src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx","../src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx","../src/components/StringList/SortableList/components/SortableItem/styles.ts","../src/components/StringList/SortableList/styles.ts","../src/components/StringList/constants.ts","../src/components/StringList/StringListShow.tsx","../src/components/Slug/SlugFeature.ts","../src/utils/bundle-component.ts"],"sourcesContent":["export * from \"./components/index.js\";\r\nexport { parseHtml } from \"./utils/parseHtml.js\";\r\n","// Shim globals in cjs bundle\n// There's a weird bug that esbuild will always inject importMetaUrl\n// if we export it as `const importMetaUrl = ... __filename ...`\n// But using a function will not cause this issue\n\nconst getImportMetaUrl = () =>\n typeof document === 'undefined'\n ? new URL(`file:${__filename}`).href\n : (document.currentScript && document.currentScript.src) ||\n new URL('main.js', document.baseURI).href\n\nexport const importMetaUrl = /* @__PURE__ */ getImportMetaUrl()\n","import React, { FC, useState, useEffect } from \"react\";\r\n\r\nimport { EditPropertyProps } from \"adminjs\";\r\nimport Select, { MultiValue, SingleValue, StylesConfig } from \"react-select\";\r\nimport chroma from \"chroma-js\";\r\n\r\nimport { ColorStatusWrapper, Label } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\ntype ColorStatusTypes = Omit<EditPropertyProps, \"where\" | \"resource\">;\r\n\r\nconst dot = (color = \"transparent\") => ({\r\n alignItems: \"center\",\r\n display: \"flex\",\r\n\r\n \":before\": {\r\n backgroundColor: color,\r\n borderRadius: 10,\r\n content: '\" \"',\r\n display: \"block\",\r\n marginRight: 8,\r\n height: 10,\r\n width: 10,\r\n },\r\n});\r\n\r\nconst colorStyles: StylesConfig<AvailableValueType> = {\r\n control: (styles) => ({ ...styles, backgroundColor: \"white\" }),\r\n option: (styles, { data, isDisabled, isFocused, isSelected }) => {\r\n const color = chroma(data.color);\r\n return {\r\n ...styles,\r\n backgroundColor: isSelected\r\n ? data.color\r\n : isFocused\r\n ? color.alpha(0.1).css()\r\n : undefined,\r\n color: isSelected\r\n ? chroma.contrast(color, \"white\") > 2\r\n ? \"white\"\r\n : \"black\"\r\n : data.color,\r\n\r\n \":active\": {\r\n ...styles[\":active\"],\r\n backgroundColor: isSelected ? data.color : color.alpha(0.3).css(),\r\n },\r\n };\r\n },\r\n input: (styles) => ({ ...styles, ...dot() }),\r\n placeholder: (styles) => ({ ...styles, ...dot(\"#ccc\") }),\r\n singleValue: (styles, { data }) => ({ ...styles, ...dot(data.color) }),\r\n};\r\n\r\nconst ColorStatus: FC<ColorStatusTypes> = ({ property, record, onChange }) => {\r\n const availableValues = property.availableValues as AvailableValueType[];\r\n\r\n const currentOption = availableValues.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n const [selectOption, setCurrentOption] = useState<\r\n SingleValue<AvailableValueType> | undefined\r\n >(currentOption);\r\n\r\n const handleSelectChange = (\r\n option: SingleValue<AvailableValueType> | MultiValue<AvailableValueType>,\r\n ) => {\r\n setCurrentOption(option as SingleValue<AvailableValueType>);\r\n };\r\n\r\n useEffect(() => {\r\n onChange(property.path, selectOption?.value);\r\n }, [selectOption]);\r\n\r\n return (\r\n <ColorStatusWrapper>\r\n <Label>{property.path}</Label>\r\n <Select\r\n className=\"basic-single\"\r\n classNamePrefix=\"select\"\r\n defaultValue={selectOption ?? availableValues[0]}\r\n onChange={handleSelectChange}\r\n isClearable={true}\r\n name=\"color\"\r\n options={availableValues}\r\n styles={colorStyles}\r\n />\r\n </ColorStatusWrapper>\r\n );\r\n};\r\n\r\nexport default ColorStatus;\r\n","import { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const ColorStatusWrapper = styled.div`\r\n margin-bottom: 24px;\r\n`;\r\n\r\nexport const Label = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n`;\r\n\r\nexport const ShowLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n color: rgb(137, 138, 154);\r\n`;\r\n\r\nexport const ColorStatusBadgeWrapper = styled.div`\r\n margin-bottom: 20px;\r\n`;\r\n\r\nexport const ColorStatusBadge = styled.div`\r\n background-color: ${(props: any) => props.color};\r\n width: fit-content;\r\n padding: 5px 10px;\r\n border-radius: 20px;\r\n font-size: 12px;\r\n color: white;\r\n white-space: nowrap;\r\n`;\r\n","import React, { FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ColorStatusBadgeWrapper, ColorStatusBadge, ShowLabel } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\nconst ColorStatusShow: FC<ShowPropertyProps> = ({ property, record }) => {\r\n const currentOption = property.availableValues?.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n return (\r\n <ColorStatusBadgeWrapper>\r\n <ShowLabel>{property.path}</ShowLabel>\r\n <ColorStatusBadge color={currentOption.color}>\r\n {record.params[property.path]}\r\n </ColorStatusBadge>\r\n </ColorStatusBadgeWrapper>\r\n );\r\n};\r\n\r\nexport default ColorStatusShow;\r\n","import React, { FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ColorStatusBadge } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\nconst ColorStatusList: FC<ShowPropertyProps> = ({ property, record }) => {\r\n const currentOption = property.availableValues?.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n return (\r\n <ColorStatusBadge color={currentOption.color}>\r\n {record.params[property.path]}\r\n </ColorStatusBadge>\r\n );\r\n};\r\n\r\nexport default ColorStatusList;\r\n","import { EditPropertyProps } from \"adminjs\";\r\nimport React, {\r\n ChangeEvent,\r\n FC,\r\n SyntheticEvent,\r\n useEffect,\r\n useState,\r\n} from \"react\";\r\nimport { ThemeProvider } from \"styled-components\";\r\n\r\nimport { theme } from \"@adminjs/design-system\";\r\n\r\nimport { slugifyTitle } from \"../../utils\";\r\n\r\nimport {\r\n StyledCustomInput,\r\n StyledGenerateButton,\r\n StyledInputWrapper,\r\n StyledLabel,\r\n} from \"./styles.js\";\r\n\r\ntype CustomSlugTypes = Omit<EditPropertyProps, \"where\">;\r\n\r\nconst SlugEdit: FC<CustomSlugTypes> = ({\r\n property,\r\n record,\r\n resource,\r\n onChange,\r\n}) => {\r\n const [inputValue, setInputValue] = useState(record.params.slug);\r\n\r\n useEffect(() => {\r\n onChange(property.path, inputValue);\r\n }, [inputValue]);\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledLabel htmlFor=\"customSlug\">{property.path}</StyledLabel>\r\n <StyledInputWrapper>\r\n <StyledCustomInput\r\n id={property.path}\r\n name={property.path}\r\n value={inputValue}\r\n onChange={handleInput}\r\n />\r\n <StyledGenerateButton variant=\"outlined\" onClick={generateSlug}>\r\n Generate Slug\r\n </StyledGenerateButton>\r\n </StyledInputWrapper>\r\n </ThemeProvider>\r\n );\r\n\r\n function handleInput(e: ChangeEvent<HTMLInputElement>) {\r\n setInputValue(e.target.value);\r\n }\r\n\r\n function generateSlug(e: SyntheticEvent<HTMLInputElement>) {\r\n e.preventDefault();\r\n const slugSource =\r\n record.params[property.props.sourceField ?? resource.titleProperty.name];\r\n\r\n if (slugSource) {\r\n setInputValue(slugifyTitle(slugSource));\r\n }\r\n }\r\n};\r\n\r\nexport default SlugEdit;\r\n","import edjsHTML from \"editorjs-html\";\r\n\r\ntype TableBlockType = {\r\n type: \"table\";\r\n data: {\r\n content: string[][];\r\n withHeadings: boolean;\r\n };\r\n};\r\n\r\ntype AudioPlayerBlockType = {\r\n type: \"audioPlayer\";\r\n data: {\r\n src: string;\r\n };\r\n};\r\n\r\nconst tableParser = (block: TableBlockType) => {\r\n const rows = block.data.content.map((row, index) => {\r\n const tableHtml = [];\r\n if (block.data.withHeadings && index === 0) {\r\n tableHtml.push(`<tr>${row.map((cell) => `<th>${cell}</th>`)}</tr>`);\r\n } else {\r\n tableHtml.push(`<tr>${row.map((cell) => `<td>${cell}</td>`)}</tr>`);\r\n }\r\n\r\n return tableHtml;\r\n });\r\n\r\n if (block.data.withHeadings) {\r\n const heading = rows[0] as string[];\r\n const [, ...content] = rows;\r\n\r\n return `<table><thead>${heading.join(\"\")}</thead><tbody>${content.join(\"\")}</tbody></table>`;\r\n } else {\r\n return `<table><tbody>${rows.join(\"\")}</tbody></table>`;\r\n }\r\n};\r\n\r\nconst audioPlayerParser = (block: AudioPlayerBlockType) => {\r\n return `<audio controls src={${block.data.src}} />`;\r\n};\r\n\r\nexport const parseHtml = (jsonData: string) => {\r\n const edjsParser = edjsHTML({\r\n table: tableParser,\r\n audioPlayer: audioPlayerParser,\r\n });\r\n\r\n try {\r\n const data = edjsParser.parse(JSON.parse(jsonData));\r\n return String(data).replace(/>,</g, \"><\");\r\n } catch (e) {\r\n console.log(\"error\", e);\r\n }\r\n};\r\n","// This is a fix of typescript module import error\r\nimport slugify from \"slugify\";\r\n\r\nexport default slugify as unknown as typeof slugify.default;\r\n","import slugify from \"./slugifyImport.js\";\r\n\r\nexport const slugifyTitle = (title: string) => {\r\n return slugify(title, {\r\n replacement: \"-\",\r\n remove: /[*+~.()'\"!:@]/g,\r\n lower: true,\r\n locale: \"vi\",\r\n trim: true,\r\n });\r\n};\r\n","// @ts-ignore\r\nimport { styled } from \"@adminjs/design-system/styled-components\";\r\n// @ts-ignore\r\nimport { Box, Button, Input } from \"@adminjs/design-system\";\r\n\r\nexport const StyledInputWrapper = styled(Box)`\r\n display: flex;\r\n margin-bottom: 40px;\r\n`;\r\n\r\nexport const StyledCustomInput = styled(Input)`\r\n width: 100%;\r\n margin-right: 10px;\r\n`;\r\n\r\nexport const StyledGenerateButton = styled(Button)`\r\n white-space: nowrap;\r\n`;\r\n\r\nexport const StyledLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n text-transform: capitalize;\r\n`;\r\n","import { Button, Input, theme } from \"@adminjs/design-system\";\r\nimport { EditPropertyProps } from \"adminjs\";\r\nimport React, {\r\n ChangeEvent,\r\n FC,\r\n KeyboardEvent,\r\n SyntheticEvent,\r\n useEffect,\r\n useState,\r\n} from \"react\";\r\nimport { ThemeProvider } from \"styled-components\";\r\n\r\nimport {\r\n StyledCustomInput,\r\n StyledInputWrapper,\r\n StyledLabel,\r\n StyledListWrapper,\r\n StyledWrapper,\r\n} from \"./styles.js\";\r\n\r\nimport { SortableList } from \"./SortableList/SortableList.js\";\r\nimport { separator } from \"./constants.js\";\r\n\r\ntype ListDataTypes = {\r\n id: string;\r\n value: string;\r\n};\r\n\r\ntype StringListTypes = Omit<EditPropertyProps, \"where\" | \"resource\">;\r\n\r\ninterface StringListShowPropsType extends StringListTypes {\r\n stringListSeparator?: string;\r\n}\r\n\r\nconst StringList: FC<StringListShowPropsType> = ({\r\n record,\r\n onChange,\r\n property,\r\n stringListSeparator = separator,\r\n}) => {\r\n const stringListValue =\r\n record.params?.[property.path] ?? property.props.value ?? \"\";\r\n\r\n const initialList = stringListValue\r\n ? prepareDataForList(stringListValue)\r\n : [];\r\n\r\n const [inputValue, setInputValue] = useState(\"\");\r\n const [list, setList] = useState<ListDataTypes[]>(initialList);\r\n\r\n const serializedData = prepareDataForDatabase(list);\r\n\r\n useEffect(() => {\r\n onChange(property.path, serializedData);\r\n }, [serializedData]);\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledLabel htmlFor=\"custom\">{property.path}</StyledLabel>\r\n <StyledWrapper>\r\n <StyledListWrapper>\r\n <SortableList\r\n items={list}\r\n onChange={setList}\r\n renderItem={(item) => (\r\n <SortableList.Item id={item.id} onDelete={handleDeleteButton}>\r\n {item.value}\r\n </SortableList.Item>\r\n )}\r\n />\r\n </StyledListWrapper>\r\n <StyledInputWrapper>\r\n <Input\r\n id=\"stringList\"\r\n name={property.path}\r\n value={serializedData}\r\n hidden\r\n />\r\n <StyledCustomInput\r\n id=\"custom\"\r\n name=\"customInput\"\r\n value={inputValue}\r\n onChange={handleInput}\r\n onKeyPress={handleEnterPress}\r\n />\r\n <Button variant=\"outlined\" onClick={handleAddButton}>\r\n Add\r\n </Button>\r\n </StyledInputWrapper>\r\n </StyledWrapper>\r\n </ThemeProvider>\r\n );\r\n\r\n function handleInput(e: ChangeEvent<HTMLInputElement>) {\r\n setInputValue(e.target.value);\r\n }\r\n\r\n function handleEnterPress(e: KeyboardEvent<HTMLInputElement>) {\r\n if (e.key === \"Enter\") {\r\n handleAddButton(e);\r\n }\r\n }\r\n\r\n function handleAddButton(e: SyntheticEvent<HTMLInputElement>) {\r\n e.preventDefault();\r\n\r\n if (Boolean(inputValue)) {\r\n setList([...list, createListObject(inputValue)]);\r\n\r\n setInputValue(\"\");\r\n }\r\n }\r\n\r\n function handleDeleteButton(e: ChangeEvent<HTMLInputElement>, id: string) {\r\n e.preventDefault();\r\n const newData = list.filter((item: ListDataTypes) => item.id !== id);\r\n setList(newData);\r\n }\r\n\r\n function prepareDataForDatabase(list: ListDataTypes[]) {\r\n return list.map(({ value }) => value).join(stringListSeparator);\r\n }\r\n\r\n function prepareDataForList(str: string) {\r\n return str.split(stringListSeparator).map((item) => createListObject(item));\r\n }\r\n\r\n function createListObject(value: string) {\r\n return {\r\n id: `${Date.now()}-${Math.floor(Math.random() * 1000)}`,\r\n value: value,\r\n };\r\n }\r\n};\r\n\r\nexport default StringList;\r\n","import { Box, Input } from \"@adminjs/design-system\";\r\nimport { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const StyledWrapper = styled(Box)`\r\n display: flex;\r\n flex-direction: column;\r\n margin-bottom: 45px;\r\n`;\r\n\r\nexport const StyledCustomInput = styled(Input)`\r\n width: 100%;\r\n margin-right: 10px;\r\n`;\r\n\r\nexport const StyledInputWrapper = styled(Box)`\r\n display: flex;\r\n`;\r\n\r\nexport const StyledListWrapper = styled(Box)`\r\n margin-bottom: 15px;\r\n`;\r\n\r\nexport const StyledLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n text-transform: capitalize;\r\n`;\r\n\r\nexport const StyledShowLabel = styled(StyledLabel)`\r\n line-height: 16px;\r\n color: rgb(137, 138, 154);\r\n font-weight: 300;\r\n`;\r\n\r\nexport const StyledShowWrapper = styled(Box)`\r\n margin-bottom: 35px;\r\n`;\r\n\r\nexport const StyledListItem = styled.li`\r\n margin-bottom: 5px;\r\n`;\r\n","import React, { Fragment, useMemo, useState } from \"react\";\r\nimport type { ReactNode } from \"react\";\r\n\r\nimport {\r\n DndContext,\r\n KeyboardSensor,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n DragOverlay,\r\n defaultDropAnimationSideEffects,\r\n} from \"@dnd-kit/core\";\r\nimport {\r\n SortableContext,\r\n arrayMove,\r\n sortableKeyboardCoordinates,\r\n verticalListSortingStrategy,\r\n} from \"@dnd-kit/sortable\";\r\n\r\nimport type { DropAnimation } from \"@dnd-kit/core\";\r\n\r\nimport { SortableItem } from \"./components/index.js\";\r\nimport { StyledListWrapper } from \"./styles.js\";\r\n\r\nimport type { Active, UniqueIdentifier } from \"@dnd-kit/core\";\r\n\r\ninterface BaseItem {\r\n id: UniqueIdentifier;\r\n value: string;\r\n}\r\n\r\ninterface Props<T extends BaseItem> {\r\n items: T[];\r\n onChange(items: T[]): void;\r\n renderItem(item: T): ReactNode;\r\n}\r\n\r\nconst dropAnimationConfig: DropAnimation = {\r\n sideEffects: defaultDropAnimationSideEffects({\r\n styles: {\r\n active: {\r\n opacity: \"0.4\",\r\n },\r\n },\r\n }),\r\n};\r\n\r\nexport function SortableList<T extends BaseItem>({\r\n items,\r\n onChange,\r\n renderItem,\r\n}: Props<T>) {\r\n const [active, setActive] = useState<Active | null>(null);\r\n const activeItem = useMemo(\r\n () => items.find((item) => item.id === active?.id),\r\n [active, items],\r\n );\r\n const sensors = useSensors(\r\n useSensor(PointerSensor),\r\n useSensor(KeyboardSensor, {\r\n coordinateGetter: sortableKeyboardCoordinates,\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n onDragStart={({ active }) => {\r\n setActive(active);\r\n }}\r\n onDragEnd={({ active, over }) => {\r\n if (over && active.id !== over?.id) {\r\n const activeIndex = items.findIndex(({ id }) => id === active.id);\r\n const overIndex = items.findIndex(({ id }) => id === over.id);\r\n\r\n onChange(arrayMove(items, activeIndex, overIndex));\r\n }\r\n setActive(null);\r\n }}\r\n onDragCancel={() => {\r\n setActive(null);\r\n }}\r\n >\r\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\r\n <StyledListWrapper role=\"application\">\r\n {items.map((item, index) => (\r\n <Fragment key={index}>{renderItem(item)}</Fragment>\r\n ))}\r\n </StyledListWrapper>\r\n </SortableContext>\r\n <DragOverlay dropAnimation={dropAnimationConfig}>\r\n {activeItem ? renderItem(activeItem) : null}\r\n </DragOverlay>\r\n </DndContext>\r\n );\r\n}\r\n\r\nSortableList.Item = SortableItem;\r\n","import React, { createContext, useMemo, ChangeEvent } from 'react';\r\nimport type { CSSProperties, PropsWithChildren } from 'react';\r\nimport { useSortable } from '@dnd-kit/sortable';\r\nimport { Button, Icon } from '@adminjs/design-system';\r\n\r\nimport { DragHandle } from './DragHandle.js';\r\nimport { StyledListItem } from './styles.js';\r\nimport type { DragContext } from './types.js';\r\n\r\ninterface SortableItemPropsType {\r\n id: string;\r\n onDelete: (e: ChangeEvent<HTMLInputElement>, id: string) => void;\r\n}\r\n\r\nconst SortableItemContext = createContext<DragContext>({\r\n attributes: {},\r\n listeners: undefined,\r\n ref() {},\r\n});\r\n\r\nexport function SortableItem({\r\n children,\r\n id,\r\n onDelete,\r\n}: PropsWithChildren<SortableItemPropsType>) {\r\n const { attributes, isDragging, listeners, setNodeRef, setActivatorNodeRef } =\r\n useSortable({ id });\r\n const context = useMemo(\r\n () => ({\r\n attributes,\r\n listeners,\r\n ref: setActivatorNodeRef,\r\n }),\r\n [attributes, listeners, setActivatorNodeRef],\r\n );\r\n\r\n const style: CSSProperties = {\r\n opacity: isDragging ? 0.4 : undefined,\r\n };\r\n\r\n return (\r\n <SortableItemContext.Provider value={context}>\r\n <StyledListItem ref={setNodeRef} style={style}>\r\n <div>\r\n <DragHandle context={SortableItemContext} />\r\n {children}\r\n </div>\r\n <Button\r\n variant=\"outlined\"\r\n color=\"danger\"\r\n size=\"icon\"\r\n onClick={(e: ChangeEvent<HTMLInputElement>) => onDelete(e, id)}\r\n >\r\n <Icon icon=\"X\" color=\"red\" />\r\n </Button>\r\n </StyledListItem>\r\n </SortableItemContext.Provider>\r\n );\r\n}\r\n","import React, { Context, FC, useContext } from \"react\";\r\n\r\nimport { StyledDragButton } from \"./styles.js\";\r\nimport type { DragContext } from \"./types.js\";\r\n\r\ninterface DragHandlePropsType {\r\n context: Context<DragContext>;\r\n}\r\n\r\nexport const DragHandle: FC<DragHandlePropsType> = ({ context }) => {\r\n const { attributes, listeners, ref } = useContext(context);\r\n\r\n return (\r\n <StyledDragButton {...attributes} {...listeners} ref={ref}>\r\n <svg viewBox=\"0 0 20 20\" width=\"13\">\r\n <path d=\"M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z\"></path>\r\n </svg>\r\n </StyledDragButton>\r\n );\r\n};\r\n","import { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const StyledListItem = styled.li`\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n background-color: #fff;\r\n padding: 10px 20px 10px 15px;\r\n box-shadow:\r\n 0 0 0 calc(1px / var(--scale-x, 1)) rgba(63, 63, 68, 0.05),\r\n 0 1px calc(3px / var(--scale-x, 1)) 0 rgba(34, 33, 81, 0.15);\r\n border-radius: 5px;\r\n list-style: none;\r\n`;\r\n\r\nexport const StyledDragButton = styled.button`\r\n padding: 3px;\r\n margin-right: 15px;\r\n cursor: move;\r\n background: none;\r\n border: none;\r\n`;\r\n","import { styled } from '@adminjs/design-system/styled-components';\r\n\r\nexport const StyledListWrapper = styled.ul`\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n padding: 0;\r\n list-style: none;\r\n`;\r\n","export const separator = \"|\";\r\n","import React, { memo, useState, useEffect, useRef, FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ThemeProvider } from \"styled-components\";\r\nimport { theme } from \"@adminjs/design-system\";\r\n\r\nimport { StyledShowLabel, StyledShowWrapper, StyledListItem } from \"./styles\";\r\nimport { separator } from \"./constants\";\r\n\r\ninterface StringListShowPropsType extends ShowPropertyProps {\r\n stringListSeparator?: string;\r\n}\r\n\r\nconst StringListShow: FC<StringListShowPropsType> = ({\r\n property,\r\n record,\r\n stringListSeparator = separator,\r\n}) => {\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledShowWrapper>\r\n <StyledShowLabel>{property.path}</StyledShowLabel>\r\n {record.params.facts && (\r\n <ul>\r\n {record.params.facts\r\n .split(stringListSeparator)\r\n .map((item: string, index: number) => (\r\n <StyledListItem key={index}>{`- ${item}`}</StyledListItem>\r\n ))}\r\n </ul>\r\n )}\r\n </StyledShowWrapper>\r\n </ThemeProvider>\r\n );\r\n};\r\n\r\nexport default StringListShow;\r\n","import {buildFeature, ComponentLoader, FeatureType} from \"adminjs\";\r\nimport {bundleComponent} from \"../../utils/bundle-component\";\r\n\r\nconst COMPONENT_NAME = 'Slug'\r\n\r\ntype SlugOptions = {\r\n componentLoader: ComponentLoader\r\n key: string\r\n}\r\nconst SlugFeature = (config: SlugOptions): FeatureType => {\r\n const {componentLoader,key} = config\r\n\r\n const uploadFeature = () => {\r\n const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.tsx')\r\n return buildFeature({\r\n properties: {\r\n [key]: {\r\n isVisible: { show: false, edit: true, list: false, filter: false },\r\n components: {\r\n edit: editComponent,\r\n },\r\n },\r\n },\r\n })\r\n }\r\n\r\n return uploadFeature()\r\n}\r\n\r\nexport default SlugFeature","import path from 'path'\r\nimport * as url from 'url'\r\nimport { createRequire } from 'module'\r\n\r\nimport type { ComponentLoader } from 'adminjs'\r\n\r\nconst dirname = url.fileURLToPath(new URL('.', import.meta.url))\r\n//const __filename = url.fileURLToPath(new URL('.', import.meta.url))\r\n//const __dirname = path.dirname(__filename)\r\n//const require = createRequire(import.meta.url)\r\n//const basePath = path.dirname(require.resolve('@rulab/adminjs-components'))\r\n\r\n// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\r\nexport const bundleComponent = (\r\n loader: ComponentLoader,\r\n componentName: string,\r\n componentFile: string,\r\n) => {\r\n const componentPath = path.join( dirname,'../src/components',componentName,componentFile)\r\n console.log('[bundleComponent] Registering:', componentPath)\r\n return loader.add(componentName, componentPath)\r\n}"],"mappings":"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","names":["chroma","React","Select","import_react","React","import_react","React","import_react","import_styled_components","import_design_system","edjsHTML","slugify","import_styled_components","React","import_design_system","import_react","import_styled_components","import_design_system","import_styled_components","StyledCustomInput","StyledInputWrapper","StyledLabel","import_react","import_sortable","import_react","import_design_system","import_react","import_styled_components","StyledListItem","React","React","StyledListItem","import_styled_components","StyledListWrapper","React","active","StyledListWrapper","React","StyledLabel","StyledInputWrapper","StyledCustomInput","list","import_react","import_styled_components","import_design_system","React","path"]}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export * from \"./components/index.js\";\r\nexport { parseHtml } from \"./utils/parseHtml.js\";\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAc,kCAAd;AACA,uBAA0B;","names":[]}
package/dist/index.js CHANGED
@@ -1,553 +1,6 @@
1
- // src/components/ColorStatus/ColorStatusEdit.tsx
2
- import React, { useState, useEffect } from "react";
3
- import Select from "react-select";
4
- import chroma from "chroma-js";
5
-
6
- // src/components/ColorStatus/styles.ts
7
- import { styled } from "@adminjs/design-system/styled-components";
8
- var ColorStatusWrapper = styled.div`
9
- margin-bottom: 24px;
10
- `;
11
- var Label = styled.div`
12
- font-size: 12px;
13
- margin-bottom: 8px;
14
- `;
15
- var ShowLabel = styled.div`
16
- font-size: 12px;
17
- margin-bottom: 8px;
18
- color: rgb(137, 138, 154);
19
- `;
20
- var ColorStatusBadgeWrapper = styled.div`
21
- margin-bottom: 20px;
22
- `;
23
- var ColorStatusBadge = styled.div`
24
- background-color: ${(props) => props.color};
25
- width: fit-content;
26
- padding: 5px 10px;
27
- border-radius: 20px;
28
- font-size: 12px;
29
- color: white;
30
- white-space: nowrap;
31
- `;
32
-
33
- // src/components/ColorStatus/ColorStatusEdit.tsx
34
- var dot = (color = "transparent") => ({
35
- alignItems: "center",
36
- display: "flex",
37
- ":before": {
38
- backgroundColor: color,
39
- borderRadius: 10,
40
- content: '" "',
41
- display: "block",
42
- marginRight: 8,
43
- height: 10,
44
- width: 10
45
- }
46
- });
47
- var colorStyles = {
48
- control: (styles) => ({ ...styles, backgroundColor: "white" }),
49
- option: (styles, { data, isDisabled, isFocused, isSelected }) => {
50
- const color = chroma(data.color);
51
- return {
52
- ...styles,
53
- backgroundColor: isSelected ? data.color : isFocused ? color.alpha(0.1).css() : void 0,
54
- color: isSelected ? chroma.contrast(color, "white") > 2 ? "white" : "black" : data.color,
55
- ":active": {
56
- ...styles[":active"],
57
- backgroundColor: isSelected ? data.color : color.alpha(0.3).css()
58
- }
59
- };
60
- },
61
- input: (styles) => ({ ...styles, ...dot() }),
62
- placeholder: (styles) => ({ ...styles, ...dot("#ccc") }),
63
- singleValue: (styles, { data }) => ({ ...styles, ...dot(data.color) })
64
- };
65
- var ColorStatus = ({ property, record, onChange }) => {
66
- const availableValues = property.availableValues;
67
- const currentOption = availableValues.find(
68
- (item) => item.value === record.params[property.path]
69
- );
70
- const [selectOption, setCurrentOption] = useState(currentOption);
71
- const handleSelectChange = (option) => {
72
- setCurrentOption(option);
73
- };
74
- useEffect(() => {
75
- onChange(property.path, selectOption?.value);
76
- }, [selectOption]);
77
- return /* @__PURE__ */ React.createElement(ColorStatusWrapper, null, /* @__PURE__ */ React.createElement(Label, null, property.path), /* @__PURE__ */ React.createElement(
78
- Select,
79
- {
80
- className: "basic-single",
81
- classNamePrefix: "select",
82
- defaultValue: selectOption ?? availableValues[0],
83
- onChange: handleSelectChange,
84
- isClearable: true,
85
- name: "color",
86
- options: availableValues,
87
- styles: colorStyles
88
- }
89
- ));
90
- };
91
- var ColorStatusEdit_default = ColorStatus;
92
-
93
- // src/components/ColorStatus/ColorStatusShow.tsx
94
- import React2 from "react";
95
- var ColorStatusShow = ({ property, record }) => {
96
- const currentOption = property.availableValues?.find(
97
- (item) => item.value === record.params[property.path]
98
- );
99
- return /* @__PURE__ */ React2.createElement(ColorStatusBadgeWrapper, null, /* @__PURE__ */ React2.createElement(ShowLabel, null, property.path), /* @__PURE__ */ React2.createElement(ColorStatusBadge, { color: currentOption.color }, record.params[property.path]));
100
- };
101
- var ColorStatusShow_default = ColorStatusShow;
102
-
103
- // src/components/ColorStatus/ColorStatusList.tsx
104
- import React3 from "react";
105
- var ColorStatusList = ({ property, record }) => {
106
- const currentOption = property.availableValues?.find(
107
- (item) => item.value === record.params[property.path]
108
- );
109
- return /* @__PURE__ */ React3.createElement(ColorStatusBadge, { color: currentOption.color }, record.params[property.path]);
110
- };
111
- var ColorStatusList_default = ColorStatusList;
112
-
113
- // src/components/Slug/SlugEdit.tsx
114
- import React4, {
115
- useEffect as useEffect2,
116
- useState as useState2
117
- } from "react";
118
- import { ThemeProvider } from "styled-components";
119
- import { theme } from "@adminjs/design-system";
120
-
121
- // src/utils/parseHtml.ts
122
- import edjsHTML from "editorjs-html";
123
- var tableParser = (block) => {
124
- const rows = block.data.content.map((row, index) => {
125
- const tableHtml = [];
126
- if (block.data.withHeadings && index === 0) {
127
- tableHtml.push(`<tr>${row.map((cell) => `<th>${cell}</th>`)}</tr>`);
128
- } else {
129
- tableHtml.push(`<tr>${row.map((cell) => `<td>${cell}</td>`)}</tr>`);
130
- }
131
- return tableHtml;
132
- });
133
- if (block.data.withHeadings) {
134
- const heading = rows[0];
135
- const [, ...content] = rows;
136
- return `<table><thead>${heading.join("")}</thead><tbody>${content.join("")}</tbody></table>`;
137
- } else {
138
- return `<table><tbody>${rows.join("")}</tbody></table>`;
139
- }
140
- };
141
- var audioPlayerParser = (block) => {
142
- return `<audio controls src={${block.data.src}} />`;
143
- };
144
- var parseHtml = (jsonData) => {
145
- const edjsParser = edjsHTML({
146
- table: tableParser,
147
- audioPlayer: audioPlayerParser
148
- });
149
- try {
150
- const data = edjsParser.parse(JSON.parse(jsonData));
151
- return String(data).replace(/>,</g, "><");
152
- } catch (e) {
153
- console.log("error", e);
154
- }
155
- };
156
-
157
- // src/utils/slugifyImport.ts
158
- import slugify from "slugify";
159
- var slugifyImport_default = slugify;
160
-
161
- // src/utils/slugifyTitle.ts
162
- var slugifyTitle = (title) => {
163
- return slugifyImport_default(title, {
164
- replacement: "-",
165
- remove: /[*+~.()'"!:@]/g,
166
- lower: true,
167
- locale: "vi",
168
- trim: true
169
- });
170
- };
171
-
172
- // src/components/Slug/styles.ts
173
- import { styled as styled2 } from "@adminjs/design-system/styled-components";
174
- import { Box, Button, Input } from "@adminjs/design-system";
175
- var StyledInputWrapper = styled2(Box)`
176
- display: flex;
177
- margin-bottom: 40px;
178
- `;
179
- var StyledCustomInput = styled2(Input)`
180
- width: 100%;
181
- margin-right: 10px;
182
- `;
183
- var StyledGenerateButton = styled2(Button)`
184
- white-space: nowrap;
185
- `;
186
- var StyledLabel = styled2.div`
187
- font-size: 12px;
188
- margin-bottom: 8px;
189
- text-transform: capitalize;
190
- `;
191
-
192
- // src/components/Slug/SlugEdit.tsx
193
- var SlugEdit = ({
194
- property,
195
- record,
196
- resource,
197
- onChange
198
- }) => {
199
- const [inputValue, setInputValue] = useState2(record.params.slug);
200
- useEffect2(() => {
201
- onChange(property.path, inputValue);
202
- }, [inputValue]);
203
- return /* @__PURE__ */ React4.createElement(ThemeProvider, { theme }, /* @__PURE__ */ React4.createElement(StyledLabel, { htmlFor: "customSlug" }, property.path), /* @__PURE__ */ React4.createElement(StyledInputWrapper, null, /* @__PURE__ */ React4.createElement(
204
- StyledCustomInput,
205
- {
206
- id: property.path,
207
- name: property.path,
208
- value: inputValue,
209
- onChange: handleInput
210
- }
211
- ), /* @__PURE__ */ React4.createElement(StyledGenerateButton, { variant: "outlined", onClick: generateSlug }, "Generate Slug")));
212
- function handleInput(e) {
213
- setInputValue(e.target.value);
214
- }
215
- function generateSlug(e) {
216
- e.preventDefault();
217
- const slugSource = record.params[property.props.sourceField ?? resource.titleProperty.name];
218
- if (slugSource) {
219
- setInputValue(slugifyTitle(slugSource));
220
- }
221
- }
222
- };
223
- var SlugEdit_default = SlugEdit;
224
-
225
- // src/components/StringList/StringList.tsx
226
- import { Button as Button3, Input as Input3, theme as theme2 } from "@adminjs/design-system";
227
- import React8, {
228
- useEffect as useEffect3,
229
- useState as useState4
230
- } from "react";
231
- import { ThemeProvider as ThemeProvider2 } from "styled-components";
232
-
233
- // src/components/StringList/styles.ts
234
- import { Box as Box2, Input as Input2 } from "@adminjs/design-system";
235
- import { styled as styled3 } from "@adminjs/design-system/styled-components";
236
- var StyledWrapper = styled3(Box2)`
237
- display: flex;
238
- flex-direction: column;
239
- margin-bottom: 45px;
240
- `;
241
- var StyledCustomInput2 = styled3(Input2)`
242
- width: 100%;
243
- margin-right: 10px;
244
- `;
245
- var StyledInputWrapper2 = styled3(Box2)`
246
- display: flex;
247
- `;
248
- var StyledListWrapper = styled3(Box2)`
249
- margin-bottom: 15px;
250
- `;
251
- var StyledLabel2 = styled3.div`
252
- font-size: 12px;
253
- margin-bottom: 8px;
254
- text-transform: capitalize;
255
- `;
256
- var StyledShowLabel = styled3(StyledLabel2)`
257
- line-height: 16px;
258
- color: rgb(137, 138, 154);
259
- font-weight: 300;
260
- `;
261
- var StyledShowWrapper = styled3(Box2)`
262
- margin-bottom: 35px;
263
- `;
264
- var StyledListItem = styled3.li`
265
- margin-bottom: 5px;
266
- `;
267
-
268
- // src/components/StringList/SortableList/SortableList.tsx
269
- import React7, { Fragment, useMemo as useMemo2, useState as useState3 } from "react";
270
- import {
271
- DndContext,
272
- KeyboardSensor,
273
- PointerSensor,
274
- useSensor,
275
- useSensors,
276
- DragOverlay,
277
- defaultDropAnimationSideEffects
278
- } from "@dnd-kit/core";
279
- import {
280
- SortableContext,
281
- arrayMove,
282
- sortableKeyboardCoordinates,
283
- verticalListSortingStrategy
284
- } from "@dnd-kit/sortable";
285
-
286
- // src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx
287
- import React6, { createContext, useMemo } from "react";
288
- import { useSortable } from "@dnd-kit/sortable";
289
- import { Button as Button2, Icon } from "@adminjs/design-system";
290
-
291
- // src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx
292
- import React5, { useContext } from "react";
293
-
294
- // src/components/StringList/SortableList/components/SortableItem/styles.ts
295
- import { styled as styled4 } from "@adminjs/design-system/styled-components";
296
- var StyledListItem2 = styled4.li`
297
- display: flex;
298
- justify-content: space-between;
299
- align-items: center;
300
- background-color: #fff;
301
- padding: 10px 20px 10px 15px;
302
- box-shadow:
303
- 0 0 0 calc(1px / var(--scale-x, 1)) rgba(63, 63, 68, 0.05),
304
- 0 1px calc(3px / var(--scale-x, 1)) 0 rgba(34, 33, 81, 0.15);
305
- border-radius: 5px;
306
- list-style: none;
307
- `;
308
- var StyledDragButton = styled4.button`
309
- padding: 3px;
310
- margin-right: 15px;
311
- cursor: move;
312
- background: none;
313
- border: none;
314
- `;
315
-
316
- // src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx
317
- var DragHandle = ({ context }) => {
318
- const { attributes, listeners, ref } = useContext(context);
319
- return /* @__PURE__ */ React5.createElement(StyledDragButton, { ...attributes, ...listeners, ref }, /* @__PURE__ */ React5.createElement("svg", { viewBox: "0 0 20 20", width: "13" }, /* @__PURE__ */ React5.createElement("path", { d: "M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z" })));
320
- };
321
-
322
- // src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx
323
- var SortableItemContext = createContext({
324
- attributes: {},
325
- listeners: void 0,
326
- ref() {
327
- }
328
- });
329
- function SortableItem({
330
- children,
331
- id,
332
- onDelete
333
- }) {
334
- const { attributes, isDragging, listeners, setNodeRef, setActivatorNodeRef } = useSortable({ id });
335
- const context = useMemo(
336
- () => ({
337
- attributes,
338
- listeners,
339
- ref: setActivatorNodeRef
340
- }),
341
- [attributes, listeners, setActivatorNodeRef]
342
- );
343
- const style = {
344
- opacity: isDragging ? 0.4 : void 0
345
- };
346
- return /* @__PURE__ */ React6.createElement(SortableItemContext.Provider, { value: context }, /* @__PURE__ */ React6.createElement(StyledListItem2, { ref: setNodeRef, style }, /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement(DragHandle, { context: SortableItemContext }), children), /* @__PURE__ */ React6.createElement(
347
- Button2,
348
- {
349
- variant: "outlined",
350
- color: "danger",
351
- size: "icon",
352
- onClick: (e) => onDelete(e, id)
353
- },
354
- /* @__PURE__ */ React6.createElement(Icon, { icon: "X", color: "red" })
355
- )));
356
- }
357
-
358
- // src/components/StringList/SortableList/styles.ts
359
- import { styled as styled5 } from "@adminjs/design-system/styled-components";
360
- var StyledListWrapper2 = styled5.ul`
361
- display: flex;
362
- flex-direction: column;
363
- gap: 12px;
364
- padding: 0;
365
- list-style: none;
366
- `;
367
-
368
- // src/components/StringList/SortableList/SortableList.tsx
369
- var dropAnimationConfig = {
370
- sideEffects: defaultDropAnimationSideEffects({
371
- styles: {
372
- active: {
373
- opacity: "0.4"
374
- }
375
- }
376
- })
377
- };
378
- function SortableList({
379
- items,
380
- onChange,
381
- renderItem
382
- }) {
383
- const [active, setActive] = useState3(null);
384
- const activeItem = useMemo2(
385
- () => items.find((item) => item.id === active?.id),
386
- [active, items]
387
- );
388
- const sensors = useSensors(
389
- useSensor(PointerSensor),
390
- useSensor(KeyboardSensor, {
391
- coordinateGetter: sortableKeyboardCoordinates
392
- })
393
- );
394
- return /* @__PURE__ */ React7.createElement(
395
- DndContext,
396
- {
397
- sensors,
398
- onDragStart: ({ active: active2 }) => {
399
- setActive(active2);
400
- },
401
- onDragEnd: ({ active: active2, over }) => {
402
- if (over && active2.id !== over?.id) {
403
- const activeIndex = items.findIndex(({ id }) => id === active2.id);
404
- const overIndex = items.findIndex(({ id }) => id === over.id);
405
- onChange(arrayMove(items, activeIndex, overIndex));
406
- }
407
- setActive(null);
408
- },
409
- onDragCancel: () => {
410
- setActive(null);
411
- }
412
- },
413
- /* @__PURE__ */ React7.createElement(SortableContext, { items, strategy: verticalListSortingStrategy }, /* @__PURE__ */ React7.createElement(StyledListWrapper2, { role: "application" }, items.map((item, index) => /* @__PURE__ */ React7.createElement(Fragment, { key: index }, renderItem(item))))),
414
- /* @__PURE__ */ React7.createElement(DragOverlay, { dropAnimation: dropAnimationConfig }, activeItem ? renderItem(activeItem) : null)
415
- );
416
- }
417
- SortableList.Item = SortableItem;
418
-
419
- // src/components/StringList/constants.ts
420
- var separator = "|";
421
-
422
- // src/components/StringList/StringList.tsx
423
- var StringList = ({
424
- record,
425
- onChange,
426
- property,
427
- stringListSeparator = separator
428
- }) => {
429
- const stringListValue = record.params?.[property.path] ?? property.props.value ?? "";
430
- const initialList = stringListValue ? prepareDataForList(stringListValue) : [];
431
- const [inputValue, setInputValue] = useState4("");
432
- const [list, setList] = useState4(initialList);
433
- const serializedData = prepareDataForDatabase(list);
434
- useEffect3(() => {
435
- onChange(property.path, serializedData);
436
- }, [serializedData]);
437
- return /* @__PURE__ */ React8.createElement(ThemeProvider2, { theme: theme2 }, /* @__PURE__ */ React8.createElement(StyledLabel2, { htmlFor: "custom" }, property.path), /* @__PURE__ */ React8.createElement(StyledWrapper, null, /* @__PURE__ */ React8.createElement(StyledListWrapper, null, /* @__PURE__ */ React8.createElement(
438
- SortableList,
439
- {
440
- items: list,
441
- onChange: setList,
442
- renderItem: (item) => /* @__PURE__ */ React8.createElement(SortableList.Item, { id: item.id, onDelete: handleDeleteButton }, item.value)
443
- }
444
- )), /* @__PURE__ */ React8.createElement(StyledInputWrapper2, null, /* @__PURE__ */ React8.createElement(
445
- Input3,
446
- {
447
- id: "stringList",
448
- name: property.path,
449
- value: serializedData,
450
- hidden: true
451
- }
452
- ), /* @__PURE__ */ React8.createElement(
453
- StyledCustomInput2,
454
- {
455
- id: "custom",
456
- name: "customInput",
457
- value: inputValue,
458
- onChange: handleInput,
459
- onKeyPress: handleEnterPress
460
- }
461
- ), /* @__PURE__ */ React8.createElement(Button3, { variant: "outlined", onClick: handleAddButton }, "Add"))));
462
- function handleInput(e) {
463
- setInputValue(e.target.value);
464
- }
465
- function handleEnterPress(e) {
466
- if (e.key === "Enter") {
467
- handleAddButton(e);
468
- }
469
- }
470
- function handleAddButton(e) {
471
- e.preventDefault();
472
- if (Boolean(inputValue)) {
473
- setList([...list, createListObject(inputValue)]);
474
- setInputValue("");
475
- }
476
- }
477
- function handleDeleteButton(e, id) {
478
- e.preventDefault();
479
- const newData = list.filter((item) => item.id !== id);
480
- setList(newData);
481
- }
482
- function prepareDataForDatabase(list2) {
483
- return list2.map(({ value }) => value).join(stringListSeparator);
484
- }
485
- function prepareDataForList(str) {
486
- return str.split(stringListSeparator).map((item) => createListObject(item));
487
- }
488
- function createListObject(value) {
489
- return {
490
- id: `${Date.now()}-${Math.floor(Math.random() * 1e3)}`,
491
- value
492
- };
493
- }
494
- };
495
- var StringList_default = StringList;
496
-
497
- // src/components/StringList/StringListShow.tsx
498
- import React9 from "react";
499
- import { ThemeProvider as ThemeProvider3 } from "styled-components";
500
- import { theme as theme3 } from "@adminjs/design-system";
501
- var StringListShow = ({
502
- property,
503
- record,
504
- stringListSeparator = separator
505
- }) => {
506
- return /* @__PURE__ */ React9.createElement(ThemeProvider3, { theme: theme3 }, /* @__PURE__ */ React9.createElement(StyledShowWrapper, null, /* @__PURE__ */ React9.createElement(StyledShowLabel, null, property.path), record.params.facts && /* @__PURE__ */ React9.createElement("ul", null, record.params.facts.split(stringListSeparator).map((item, index) => /* @__PURE__ */ React9.createElement(StyledListItem, { key: index }, `- ${item}`)))));
507
- };
508
- var StringListShow_default = StringListShow;
509
-
510
- // src/components/Slug/SlugFeature.ts
511
- import { buildFeature } from "adminjs";
512
-
513
- // src/utils/bundle-component.ts
514
- import path from "path";
515
- import * as url from "url";
516
- var dirname = url.fileURLToPath(new URL(".", import.meta.url));
517
- var bundleComponent = (loader, componentName, componentFile) => {
518
- const componentPath = path.join(dirname, "../src/components", componentName, componentFile);
519
- console.log("[bundleComponent] Registering:", componentPath);
520
- return loader.add(componentName, componentPath);
521
- };
522
-
523
- // src/components/Slug/SlugFeature.ts
524
- var COMPONENT_NAME = "Slug";
525
- var SlugFeature = (config) => {
526
- const { componentLoader, key } = config;
527
- const uploadFeature = () => {
528
- const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, "SlugEdit.tsx");
529
- return buildFeature({
530
- properties: {
531
- [key]: {
532
- isVisible: { show: false, edit: true, list: false, filter: false },
533
- components: {
534
- edit: editComponent
535
- }
536
- }
537
- }
538
- });
539
- };
540
- return uploadFeature();
541
- };
542
- var SlugFeature_default = SlugFeature;
1
+ export * from "./components/index.js";
2
+ import { parseHtml } from "./utils/parseHtml.js";
543
3
  export {
544
- ColorStatusEdit_default as ColorStatusEdit,
545
- ColorStatusList_default as ColorStatusList,
546
- ColorStatusShow_default as ColorStatusShow,
547
- SlugEdit_default as SlugEdit,
548
- SlugFeature_default as SlugFeature,
549
- StringList_default as StringList,
550
- StringListShow_default as StringListShow,
551
4
  parseHtml
552
5
  };
553
6
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ColorStatus/ColorStatusEdit.tsx","../src/components/ColorStatus/styles.ts","../src/components/ColorStatus/ColorStatusShow.tsx","../src/components/ColorStatus/ColorStatusList.tsx","../src/components/Slug/SlugEdit.tsx","../src/utils/parseHtml.ts","../src/utils/slugifyImport.ts","../src/utils/slugifyTitle.ts","../src/components/Slug/styles.ts","../src/components/StringList/StringList.tsx","../src/components/StringList/styles.ts","../src/components/StringList/SortableList/SortableList.tsx","../src/components/StringList/SortableList/components/SortableItem/SortableItem.tsx","../src/components/StringList/SortableList/components/SortableItem/DragHandle.tsx","../src/components/StringList/SortableList/components/SortableItem/styles.ts","../src/components/StringList/SortableList/styles.ts","../src/components/StringList/constants.ts","../src/components/StringList/StringListShow.tsx","../src/components/Slug/SlugFeature.ts","../src/utils/bundle-component.ts"],"sourcesContent":["import React, { FC, useState, useEffect } from \"react\";\r\n\r\nimport { EditPropertyProps } from \"adminjs\";\r\nimport Select, { MultiValue, SingleValue, StylesConfig } from \"react-select\";\r\nimport chroma from \"chroma-js\";\r\n\r\nimport { ColorStatusWrapper, Label } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\ntype ColorStatusTypes = Omit<EditPropertyProps, \"where\" | \"resource\">;\r\n\r\nconst dot = (color = \"transparent\") => ({\r\n alignItems: \"center\",\r\n display: \"flex\",\r\n\r\n \":before\": {\r\n backgroundColor: color,\r\n borderRadius: 10,\r\n content: '\" \"',\r\n display: \"block\",\r\n marginRight: 8,\r\n height: 10,\r\n width: 10,\r\n },\r\n});\r\n\r\nconst colorStyles: StylesConfig<AvailableValueType> = {\r\n control: (styles) => ({ ...styles, backgroundColor: \"white\" }),\r\n option: (styles, { data, isDisabled, isFocused, isSelected }) => {\r\n const color = chroma(data.color);\r\n return {\r\n ...styles,\r\n backgroundColor: isSelected\r\n ? data.color\r\n : isFocused\r\n ? color.alpha(0.1).css()\r\n : undefined,\r\n color: isSelected\r\n ? chroma.contrast(color, \"white\") > 2\r\n ? \"white\"\r\n : \"black\"\r\n : data.color,\r\n\r\n \":active\": {\r\n ...styles[\":active\"],\r\n backgroundColor: isSelected ? data.color : color.alpha(0.3).css(),\r\n },\r\n };\r\n },\r\n input: (styles) => ({ ...styles, ...dot() }),\r\n placeholder: (styles) => ({ ...styles, ...dot(\"#ccc\") }),\r\n singleValue: (styles, { data }) => ({ ...styles, ...dot(data.color) }),\r\n};\r\n\r\nconst ColorStatus: FC<ColorStatusTypes> = ({ property, record, onChange }) => {\r\n const availableValues = property.availableValues as AvailableValueType[];\r\n\r\n const currentOption = availableValues.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n const [selectOption, setCurrentOption] = useState<\r\n SingleValue<AvailableValueType> | undefined\r\n >(currentOption);\r\n\r\n const handleSelectChange = (\r\n option: SingleValue<AvailableValueType> | MultiValue<AvailableValueType>,\r\n ) => {\r\n setCurrentOption(option as SingleValue<AvailableValueType>);\r\n };\r\n\r\n useEffect(() => {\r\n onChange(property.path, selectOption?.value);\r\n }, [selectOption]);\r\n\r\n return (\r\n <ColorStatusWrapper>\r\n <Label>{property.path}</Label>\r\n <Select\r\n className=\"basic-single\"\r\n classNamePrefix=\"select\"\r\n defaultValue={selectOption ?? availableValues[0]}\r\n onChange={handleSelectChange}\r\n isClearable={true}\r\n name=\"color\"\r\n options={availableValues}\r\n styles={colorStyles}\r\n />\r\n </ColorStatusWrapper>\r\n );\r\n};\r\n\r\nexport default ColorStatus;\r\n","import { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const ColorStatusWrapper = styled.div`\r\n margin-bottom: 24px;\r\n`;\r\n\r\nexport const Label = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n`;\r\n\r\nexport const ShowLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n color: rgb(137, 138, 154);\r\n`;\r\n\r\nexport const ColorStatusBadgeWrapper = styled.div`\r\n margin-bottom: 20px;\r\n`;\r\n\r\nexport const ColorStatusBadge = styled.div`\r\n background-color: ${(props: any) => props.color};\r\n width: fit-content;\r\n padding: 5px 10px;\r\n border-radius: 20px;\r\n font-size: 12px;\r\n color: white;\r\n white-space: nowrap;\r\n`;\r\n","import React, { FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ColorStatusBadgeWrapper, ColorStatusBadge, ShowLabel } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\nconst ColorStatusShow: FC<ShowPropertyProps> = ({ property, record }) => {\r\n const currentOption = property.availableValues?.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n return (\r\n <ColorStatusBadgeWrapper>\r\n <ShowLabel>{property.path}</ShowLabel>\r\n <ColorStatusBadge color={currentOption.color}>\r\n {record.params[property.path]}\r\n </ColorStatusBadge>\r\n </ColorStatusBadgeWrapper>\r\n );\r\n};\r\n\r\nexport default ColorStatusShow;\r\n","import React, { FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ColorStatusBadge } from \"./styles\";\r\n\r\nimport type { AvailableValueType } from \"./types\";\r\n\r\nconst ColorStatusList: FC<ShowPropertyProps> = ({ property, record }) => {\r\n const currentOption = property.availableValues?.find(\r\n (item) => item.value === record.params[property.path],\r\n ) as AvailableValueType;\r\n\r\n return (\r\n <ColorStatusBadge color={currentOption.color}>\r\n {record.params[property.path]}\r\n </ColorStatusBadge>\r\n );\r\n};\r\n\r\nexport default ColorStatusList;\r\n","import { EditPropertyProps } from \"adminjs\";\r\nimport React, {\r\n ChangeEvent,\r\n FC,\r\n SyntheticEvent,\r\n useEffect,\r\n useState,\r\n} from \"react\";\r\nimport { ThemeProvider } from \"styled-components\";\r\n\r\nimport { theme } from \"@adminjs/design-system\";\r\n\r\nimport { slugifyTitle } from \"../../utils\";\r\n\r\nimport {\r\n StyledCustomInput,\r\n StyledGenerateButton,\r\n StyledInputWrapper,\r\n StyledLabel,\r\n} from \"./styles.js\";\r\n\r\ntype CustomSlugTypes = Omit<EditPropertyProps, \"where\">;\r\n\r\nconst SlugEdit: FC<CustomSlugTypes> = ({\r\n property,\r\n record,\r\n resource,\r\n onChange,\r\n}) => {\r\n const [inputValue, setInputValue] = useState(record.params.slug);\r\n\r\n useEffect(() => {\r\n onChange(property.path, inputValue);\r\n }, [inputValue]);\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledLabel htmlFor=\"customSlug\">{property.path}</StyledLabel>\r\n <StyledInputWrapper>\r\n <StyledCustomInput\r\n id={property.path}\r\n name={property.path}\r\n value={inputValue}\r\n onChange={handleInput}\r\n />\r\n <StyledGenerateButton variant=\"outlined\" onClick={generateSlug}>\r\n Generate Slug\r\n </StyledGenerateButton>\r\n </StyledInputWrapper>\r\n </ThemeProvider>\r\n );\r\n\r\n function handleInput(e: ChangeEvent<HTMLInputElement>) {\r\n setInputValue(e.target.value);\r\n }\r\n\r\n function generateSlug(e: SyntheticEvent<HTMLInputElement>) {\r\n e.preventDefault();\r\n const slugSource =\r\n record.params[property.props.sourceField ?? resource.titleProperty.name];\r\n\r\n if (slugSource) {\r\n setInputValue(slugifyTitle(slugSource));\r\n }\r\n }\r\n};\r\n\r\nexport default SlugEdit;\r\n","import edjsHTML from \"editorjs-html\";\r\n\r\ntype TableBlockType = {\r\n type: \"table\";\r\n data: {\r\n content: string[][];\r\n withHeadings: boolean;\r\n };\r\n};\r\n\r\ntype AudioPlayerBlockType = {\r\n type: \"audioPlayer\";\r\n data: {\r\n src: string;\r\n };\r\n};\r\n\r\nconst tableParser = (block: TableBlockType) => {\r\n const rows = block.data.content.map((row, index) => {\r\n const tableHtml = [];\r\n if (block.data.withHeadings && index === 0) {\r\n tableHtml.push(`<tr>${row.map((cell) => `<th>${cell}</th>`)}</tr>`);\r\n } else {\r\n tableHtml.push(`<tr>${row.map((cell) => `<td>${cell}</td>`)}</tr>`);\r\n }\r\n\r\n return tableHtml;\r\n });\r\n\r\n if (block.data.withHeadings) {\r\n const heading = rows[0] as string[];\r\n const [, ...content] = rows;\r\n\r\n return `<table><thead>${heading.join(\"\")}</thead><tbody>${content.join(\"\")}</tbody></table>`;\r\n } else {\r\n return `<table><tbody>${rows.join(\"\")}</tbody></table>`;\r\n }\r\n};\r\n\r\nconst audioPlayerParser = (block: AudioPlayerBlockType) => {\r\n return `<audio controls src={${block.data.src}} />`;\r\n};\r\n\r\nexport const parseHtml = (jsonData: string) => {\r\n const edjsParser = edjsHTML({\r\n table: tableParser,\r\n audioPlayer: audioPlayerParser,\r\n });\r\n\r\n try {\r\n const data = edjsParser.parse(JSON.parse(jsonData));\r\n return String(data).replace(/>,</g, \"><\");\r\n } catch (e) {\r\n console.log(\"error\", e);\r\n }\r\n};\r\n","// This is a fix of typescript module import error\r\nimport slugify from \"slugify\";\r\n\r\nexport default slugify as unknown as typeof slugify.default;\r\n","import slugify from \"./slugifyImport.js\";\r\n\r\nexport const slugifyTitle = (title: string) => {\r\n return slugify(title, {\r\n replacement: \"-\",\r\n remove: /[*+~.()'\"!:@]/g,\r\n lower: true,\r\n locale: \"vi\",\r\n trim: true,\r\n });\r\n};\r\n","// @ts-ignore\r\nimport { styled } from \"@adminjs/design-system/styled-components\";\r\n// @ts-ignore\r\nimport { Box, Button, Input } from \"@adminjs/design-system\";\r\n\r\nexport const StyledInputWrapper = styled(Box)`\r\n display: flex;\r\n margin-bottom: 40px;\r\n`;\r\n\r\nexport const StyledCustomInput = styled(Input)`\r\n width: 100%;\r\n margin-right: 10px;\r\n`;\r\n\r\nexport const StyledGenerateButton = styled(Button)`\r\n white-space: nowrap;\r\n`;\r\n\r\nexport const StyledLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n text-transform: capitalize;\r\n`;\r\n","import { Button, Input, theme } from \"@adminjs/design-system\";\r\nimport { EditPropertyProps } from \"adminjs\";\r\nimport React, {\r\n ChangeEvent,\r\n FC,\r\n KeyboardEvent,\r\n SyntheticEvent,\r\n useEffect,\r\n useState,\r\n} from \"react\";\r\nimport { ThemeProvider } from \"styled-components\";\r\n\r\nimport {\r\n StyledCustomInput,\r\n StyledInputWrapper,\r\n StyledLabel,\r\n StyledListWrapper,\r\n StyledWrapper,\r\n} from \"./styles.js\";\r\n\r\nimport { SortableList } from \"./SortableList/SortableList.js\";\r\nimport { separator } from \"./constants.js\";\r\n\r\ntype ListDataTypes = {\r\n id: string;\r\n value: string;\r\n};\r\n\r\ntype StringListTypes = Omit<EditPropertyProps, \"where\" | \"resource\">;\r\n\r\ninterface StringListShowPropsType extends StringListTypes {\r\n stringListSeparator?: string;\r\n}\r\n\r\nconst StringList: FC<StringListShowPropsType> = ({\r\n record,\r\n onChange,\r\n property,\r\n stringListSeparator = separator,\r\n}) => {\r\n const stringListValue =\r\n record.params?.[property.path] ?? property.props.value ?? \"\";\r\n\r\n const initialList = stringListValue\r\n ? prepareDataForList(stringListValue)\r\n : [];\r\n\r\n const [inputValue, setInputValue] = useState(\"\");\r\n const [list, setList] = useState<ListDataTypes[]>(initialList);\r\n\r\n const serializedData = prepareDataForDatabase(list);\r\n\r\n useEffect(() => {\r\n onChange(property.path, serializedData);\r\n }, [serializedData]);\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledLabel htmlFor=\"custom\">{property.path}</StyledLabel>\r\n <StyledWrapper>\r\n <StyledListWrapper>\r\n <SortableList\r\n items={list}\r\n onChange={setList}\r\n renderItem={(item) => (\r\n <SortableList.Item id={item.id} onDelete={handleDeleteButton}>\r\n {item.value}\r\n </SortableList.Item>\r\n )}\r\n />\r\n </StyledListWrapper>\r\n <StyledInputWrapper>\r\n <Input\r\n id=\"stringList\"\r\n name={property.path}\r\n value={serializedData}\r\n hidden\r\n />\r\n <StyledCustomInput\r\n id=\"custom\"\r\n name=\"customInput\"\r\n value={inputValue}\r\n onChange={handleInput}\r\n onKeyPress={handleEnterPress}\r\n />\r\n <Button variant=\"outlined\" onClick={handleAddButton}>\r\n Add\r\n </Button>\r\n </StyledInputWrapper>\r\n </StyledWrapper>\r\n </ThemeProvider>\r\n );\r\n\r\n function handleInput(e: ChangeEvent<HTMLInputElement>) {\r\n setInputValue(e.target.value);\r\n }\r\n\r\n function handleEnterPress(e: KeyboardEvent<HTMLInputElement>) {\r\n if (e.key === \"Enter\") {\r\n handleAddButton(e);\r\n }\r\n }\r\n\r\n function handleAddButton(e: SyntheticEvent<HTMLInputElement>) {\r\n e.preventDefault();\r\n\r\n if (Boolean(inputValue)) {\r\n setList([...list, createListObject(inputValue)]);\r\n\r\n setInputValue(\"\");\r\n }\r\n }\r\n\r\n function handleDeleteButton(e: ChangeEvent<HTMLInputElement>, id: string) {\r\n e.preventDefault();\r\n const newData = list.filter((item: ListDataTypes) => item.id !== id);\r\n setList(newData);\r\n }\r\n\r\n function prepareDataForDatabase(list: ListDataTypes[]) {\r\n return list.map(({ value }) => value).join(stringListSeparator);\r\n }\r\n\r\n function prepareDataForList(str: string) {\r\n return str.split(stringListSeparator).map((item) => createListObject(item));\r\n }\r\n\r\n function createListObject(value: string) {\r\n return {\r\n id: `${Date.now()}-${Math.floor(Math.random() * 1000)}`,\r\n value: value,\r\n };\r\n }\r\n};\r\n\r\nexport default StringList;\r\n","import { Box, Input } from \"@adminjs/design-system\";\r\nimport { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const StyledWrapper = styled(Box)`\r\n display: flex;\r\n flex-direction: column;\r\n margin-bottom: 45px;\r\n`;\r\n\r\nexport const StyledCustomInput = styled(Input)`\r\n width: 100%;\r\n margin-right: 10px;\r\n`;\r\n\r\nexport const StyledInputWrapper = styled(Box)`\r\n display: flex;\r\n`;\r\n\r\nexport const StyledListWrapper = styled(Box)`\r\n margin-bottom: 15px;\r\n`;\r\n\r\nexport const StyledLabel = styled.div`\r\n font-size: 12px;\r\n margin-bottom: 8px;\r\n text-transform: capitalize;\r\n`;\r\n\r\nexport const StyledShowLabel = styled(StyledLabel)`\r\n line-height: 16px;\r\n color: rgb(137, 138, 154);\r\n font-weight: 300;\r\n`;\r\n\r\nexport const StyledShowWrapper = styled(Box)`\r\n margin-bottom: 35px;\r\n`;\r\n\r\nexport const StyledListItem = styled.li`\r\n margin-bottom: 5px;\r\n`;\r\n","import React, { Fragment, useMemo, useState } from \"react\";\r\nimport type { ReactNode } from \"react\";\r\n\r\nimport {\r\n DndContext,\r\n KeyboardSensor,\r\n PointerSensor,\r\n useSensor,\r\n useSensors,\r\n DragOverlay,\r\n defaultDropAnimationSideEffects,\r\n} from \"@dnd-kit/core\";\r\nimport {\r\n SortableContext,\r\n arrayMove,\r\n sortableKeyboardCoordinates,\r\n verticalListSortingStrategy,\r\n} from \"@dnd-kit/sortable\";\r\n\r\nimport type { DropAnimation } from \"@dnd-kit/core\";\r\n\r\nimport { SortableItem } from \"./components/index.js\";\r\nimport { StyledListWrapper } from \"./styles.js\";\r\n\r\nimport type { Active, UniqueIdentifier } from \"@dnd-kit/core\";\r\n\r\ninterface BaseItem {\r\n id: UniqueIdentifier;\r\n value: string;\r\n}\r\n\r\ninterface Props<T extends BaseItem> {\r\n items: T[];\r\n onChange(items: T[]): void;\r\n renderItem(item: T): ReactNode;\r\n}\r\n\r\nconst dropAnimationConfig: DropAnimation = {\r\n sideEffects: defaultDropAnimationSideEffects({\r\n styles: {\r\n active: {\r\n opacity: \"0.4\",\r\n },\r\n },\r\n }),\r\n};\r\n\r\nexport function SortableList<T extends BaseItem>({\r\n items,\r\n onChange,\r\n renderItem,\r\n}: Props<T>) {\r\n const [active, setActive] = useState<Active | null>(null);\r\n const activeItem = useMemo(\r\n () => items.find((item) => item.id === active?.id),\r\n [active, items],\r\n );\r\n const sensors = useSensors(\r\n useSensor(PointerSensor),\r\n useSensor(KeyboardSensor, {\r\n coordinateGetter: sortableKeyboardCoordinates,\r\n }),\r\n );\r\n\r\n return (\r\n <DndContext\r\n sensors={sensors}\r\n onDragStart={({ active }) => {\r\n setActive(active);\r\n }}\r\n onDragEnd={({ active, over }) => {\r\n if (over && active.id !== over?.id) {\r\n const activeIndex = items.findIndex(({ id }) => id === active.id);\r\n const overIndex = items.findIndex(({ id }) => id === over.id);\r\n\r\n onChange(arrayMove(items, activeIndex, overIndex));\r\n }\r\n setActive(null);\r\n }}\r\n onDragCancel={() => {\r\n setActive(null);\r\n }}\r\n >\r\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\r\n <StyledListWrapper role=\"application\">\r\n {items.map((item, index) => (\r\n <Fragment key={index}>{renderItem(item)}</Fragment>\r\n ))}\r\n </StyledListWrapper>\r\n </SortableContext>\r\n <DragOverlay dropAnimation={dropAnimationConfig}>\r\n {activeItem ? renderItem(activeItem) : null}\r\n </DragOverlay>\r\n </DndContext>\r\n );\r\n}\r\n\r\nSortableList.Item = SortableItem;\r\n","import React, { createContext, useMemo, ChangeEvent } from 'react';\r\nimport type { CSSProperties, PropsWithChildren } from 'react';\r\nimport { useSortable } from '@dnd-kit/sortable';\r\nimport { Button, Icon } from '@adminjs/design-system';\r\n\r\nimport { DragHandle } from './DragHandle.js';\r\nimport { StyledListItem } from './styles.js';\r\nimport type { DragContext } from './types.js';\r\n\r\ninterface SortableItemPropsType {\r\n id: string;\r\n onDelete: (e: ChangeEvent<HTMLInputElement>, id: string) => void;\r\n}\r\n\r\nconst SortableItemContext = createContext<DragContext>({\r\n attributes: {},\r\n listeners: undefined,\r\n ref() {},\r\n});\r\n\r\nexport function SortableItem({\r\n children,\r\n id,\r\n onDelete,\r\n}: PropsWithChildren<SortableItemPropsType>) {\r\n const { attributes, isDragging, listeners, setNodeRef, setActivatorNodeRef } =\r\n useSortable({ id });\r\n const context = useMemo(\r\n () => ({\r\n attributes,\r\n listeners,\r\n ref: setActivatorNodeRef,\r\n }),\r\n [attributes, listeners, setActivatorNodeRef],\r\n );\r\n\r\n const style: CSSProperties = {\r\n opacity: isDragging ? 0.4 : undefined,\r\n };\r\n\r\n return (\r\n <SortableItemContext.Provider value={context}>\r\n <StyledListItem ref={setNodeRef} style={style}>\r\n <div>\r\n <DragHandle context={SortableItemContext} />\r\n {children}\r\n </div>\r\n <Button\r\n variant=\"outlined\"\r\n color=\"danger\"\r\n size=\"icon\"\r\n onClick={(e: ChangeEvent<HTMLInputElement>) => onDelete(e, id)}\r\n >\r\n <Icon icon=\"X\" color=\"red\" />\r\n </Button>\r\n </StyledListItem>\r\n </SortableItemContext.Provider>\r\n );\r\n}\r\n","import React, { Context, FC, useContext } from \"react\";\r\n\r\nimport { StyledDragButton } from \"./styles.js\";\r\nimport type { DragContext } from \"./types.js\";\r\n\r\ninterface DragHandlePropsType {\r\n context: Context<DragContext>;\r\n}\r\n\r\nexport const DragHandle: FC<DragHandlePropsType> = ({ context }) => {\r\n const { attributes, listeners, ref } = useContext(context);\r\n\r\n return (\r\n <StyledDragButton {...attributes} {...listeners} ref={ref}>\r\n <svg viewBox=\"0 0 20 20\" width=\"13\">\r\n <path d=\"M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z\"></path>\r\n </svg>\r\n </StyledDragButton>\r\n );\r\n};\r\n","import { styled } from \"@adminjs/design-system/styled-components\";\r\n\r\nexport const StyledListItem = styled.li`\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n background-color: #fff;\r\n padding: 10px 20px 10px 15px;\r\n box-shadow:\r\n 0 0 0 calc(1px / var(--scale-x, 1)) rgba(63, 63, 68, 0.05),\r\n 0 1px calc(3px / var(--scale-x, 1)) 0 rgba(34, 33, 81, 0.15);\r\n border-radius: 5px;\r\n list-style: none;\r\n`;\r\n\r\nexport const StyledDragButton = styled.button`\r\n padding: 3px;\r\n margin-right: 15px;\r\n cursor: move;\r\n background: none;\r\n border: none;\r\n`;\r\n","import { styled } from '@adminjs/design-system/styled-components';\r\n\r\nexport const StyledListWrapper = styled.ul`\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n padding: 0;\r\n list-style: none;\r\n`;\r\n","export const separator = \"|\";\r\n","import React, { memo, useState, useEffect, useRef, FC } from \"react\";\r\nimport { ShowPropertyProps } from \"adminjs\";\r\n\r\nimport { ThemeProvider } from \"styled-components\";\r\nimport { theme } from \"@adminjs/design-system\";\r\n\r\nimport { StyledShowLabel, StyledShowWrapper, StyledListItem } from \"./styles\";\r\nimport { separator } from \"./constants\";\r\n\r\ninterface StringListShowPropsType extends ShowPropertyProps {\r\n stringListSeparator?: string;\r\n}\r\n\r\nconst StringListShow: FC<StringListShowPropsType> = ({\r\n property,\r\n record,\r\n stringListSeparator = separator,\r\n}) => {\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <StyledShowWrapper>\r\n <StyledShowLabel>{property.path}</StyledShowLabel>\r\n {record.params.facts && (\r\n <ul>\r\n {record.params.facts\r\n .split(stringListSeparator)\r\n .map((item: string, index: number) => (\r\n <StyledListItem key={index}>{`- ${item}`}</StyledListItem>\r\n ))}\r\n </ul>\r\n )}\r\n </StyledShowWrapper>\r\n </ThemeProvider>\r\n );\r\n};\r\n\r\nexport default StringListShow;\r\n","import {buildFeature, ComponentLoader, FeatureType} from \"adminjs\";\r\nimport {bundleComponent} from \"../../utils/bundle-component\";\r\n\r\nconst COMPONENT_NAME = 'Slug'\r\n\r\ntype SlugOptions = {\r\n componentLoader: ComponentLoader\r\n key: string\r\n}\r\nconst SlugFeature = (config: SlugOptions): FeatureType => {\r\n const {componentLoader,key} = config\r\n\r\n const uploadFeature = () => {\r\n const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.tsx')\r\n return buildFeature({\r\n properties: {\r\n [key]: {\r\n isVisible: { show: false, edit: true, list: false, filter: false },\r\n components: {\r\n edit: editComponent,\r\n },\r\n },\r\n },\r\n })\r\n }\r\n\r\n return uploadFeature()\r\n}\r\n\r\nexport default SlugFeature","import path from 'path'\r\nimport * as url from 'url'\r\nimport { createRequire } from 'module'\r\n\r\nimport type { ComponentLoader } from 'adminjs'\r\n\r\nconst dirname = url.fileURLToPath(new URL('.', import.meta.url))\r\n//const __filename = url.fileURLToPath(new URL('.', import.meta.url))\r\n//const __dirname = path.dirname(__filename)\r\n//const require = createRequire(import.meta.url)\r\n//const basePath = path.dirname(require.resolve('@rulab/adminjs-components'))\r\n\r\n// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\r\nexport const bundleComponent = (\r\n loader: ComponentLoader,\r\n componentName: string,\r\n componentFile: string,\r\n) => {\r\n const componentPath = path.join( dirname,'../src/components',componentName,componentFile)\r\n console.log('[bundleComponent] Registering:', componentPath)\r\n return loader.add(componentName, componentPath)\r\n}"],"mappings":"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","names":["React","React","React","React","React","useEffect","useState","styled","useState","useEffect","React","Button","Input","theme","React","useEffect","useState","ThemeProvider","Box","Input","styled","StyledCustomInput","StyledInputWrapper","StyledLabel","React","useMemo","useState","React","Button","React","styled","StyledListItem","React","React","StyledListItem","Button","styled","StyledListWrapper","useState","useMemo","React","active","StyledListWrapper","useState","useEffect","React","ThemeProvider","theme","StyledLabel","StyledInputWrapper","Input","StyledCustomInput","Button","list","React","ThemeProvider","theme","React","ThemeProvider","theme"]}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export * from \"./components/index.js\";\r\nexport { parseHtml } from \"./utils/parseHtml.js\";\r\n"],"mappings":"AAAA,cAAc;AACd,SAAS,iBAAiB;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rulab/adminjs-components",
3
- "version": "0.1.0-alpha.1",
3
+ "version": "0.1.0-alpha.2",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -10,7 +10,7 @@ type SlugOptions = {
10
10
  const SlugFeature = (config: SlugOptions): FeatureType => {
11
11
  const {componentLoader,key} = config
12
12
 
13
- const uploadFeature = () => {
13
+ const slugFeature = () => {
14
14
  const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.tsx')
15
15
  return buildFeature({
16
16
  properties: {
@@ -24,7 +24,7 @@ const SlugFeature = (config: SlugOptions): FeatureType => {
24
24
  })
25
25
  }
26
26
 
27
- return uploadFeature()
27
+ return slugFeature()
28
28
  }
29
29
 
30
30
  export default SlugFeature