@payloadcms/ui 3.0.0-beta.120 → 3.0.0-beta.121
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/elements/BulkUpload/ActionsBar/index.scss +4 -0
- package/dist/elements/BulkUpload/FileSidebar/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/FileSidebar/index.js +34 -25
- package/dist/elements/BulkUpload/FileSidebar/index.js.map +1 -1
- package/dist/elements/BulkUpload/FileSidebar/index.scss +40 -2
- package/dist/elements/BulkUpload/FormsManager/index.d.ts +1 -0
- package/dist/elements/BulkUpload/FormsManager/index.d.ts.map +1 -1
- package/dist/elements/BulkUpload/FormsManager/index.js +35 -5
- package/dist/elements/BulkUpload/FormsManager/index.js.map +1 -1
- package/dist/elements/RelationshipTable/index.d.ts +1 -0
- package/dist/elements/RelationshipTable/index.d.ts.map +1 -1
- package/dist/elements/RelationshipTable/index.js +94 -92
- package/dist/elements/RelationshipTable/index.js.map +1 -1
- package/dist/elements/Thumbnail/createThumbnail.d.ts +5 -0
- package/dist/elements/Thumbnail/createThumbnail.d.ts.map +1 -0
- package/dist/elements/Thumbnail/createThumbnail.js +50 -0
- package/dist/elements/Thumbnail/createThumbnail.js.map +1 -0
- package/dist/elements/Thumbnail/index.d.ts.map +1 -1
- package/dist/elements/Thumbnail/index.js.map +1 -1
- package/dist/exports/client/index.js +22 -22
- package/dist/exports/client/index.js.map +4 -4
- package/dist/fields/Join/index.d.ts.map +1 -1
- package/dist/fields/Join/index.js +2 -0
- package/dist/fields/Join/index.js.map +1 -1
- package/dist/fields/Textarea/index.d.ts.map +1 -1
- package/dist/fields/Textarea/index.js +1 -0
- package/dist/fields/Textarea/index.js.map +1 -1
- package/dist/providers/ListQuery/index.js +1 -1
- package/dist/providers/ListQuery/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +5 -5
|
@@ -27,6 +27,7 @@ const baseClass = 'relationship-table';
|
|
|
27
27
|
export const RelationshipTable = props => {
|
|
28
28
|
const $ = _c(79);
|
|
29
29
|
const {
|
|
30
|
+
allowCreate: t0,
|
|
30
31
|
field,
|
|
31
32
|
filterOptions,
|
|
32
33
|
initialData: initialDataFromProps,
|
|
@@ -34,26 +35,27 @@ export const RelationshipTable = props => {
|
|
|
34
35
|
Label,
|
|
35
36
|
relationTo
|
|
36
37
|
} = props;
|
|
38
|
+
const allowCreate = t0 === undefined ? true : t0;
|
|
37
39
|
const {
|
|
38
|
-
config:
|
|
40
|
+
config: t1,
|
|
39
41
|
getEntityConfig
|
|
40
42
|
} = useConfig();
|
|
41
43
|
const {
|
|
42
|
-
routes:
|
|
44
|
+
routes: t2,
|
|
43
45
|
serverURL
|
|
44
|
-
} =
|
|
46
|
+
} = t1;
|
|
45
47
|
const {
|
|
46
48
|
api
|
|
47
|
-
} =
|
|
49
|
+
} = t2;
|
|
48
50
|
const {
|
|
49
51
|
id: docID
|
|
50
52
|
} = useDocumentInfo();
|
|
51
53
|
const {
|
|
52
54
|
permissions
|
|
53
55
|
} = useAuth();
|
|
54
|
-
let
|
|
56
|
+
let t3;
|
|
55
57
|
if ($[0] !== initialDataFromProps) {
|
|
56
|
-
|
|
58
|
+
t3 = () => {
|
|
57
59
|
if (initialDataFromProps) {
|
|
58
60
|
return {
|
|
59
61
|
...initialDataFromProps,
|
|
@@ -67,11 +69,11 @@ export const RelationshipTable = props => {
|
|
|
67
69
|
}
|
|
68
70
|
};
|
|
69
71
|
$[0] = initialDataFromProps;
|
|
70
|
-
$[1] =
|
|
72
|
+
$[1] = t3;
|
|
71
73
|
} else {
|
|
72
|
-
|
|
74
|
+
t3 = $[1];
|
|
73
75
|
}
|
|
74
|
-
const [initialData, setInitialData] = useState(
|
|
76
|
+
const [initialData, setInitialData] = useState(t3);
|
|
75
77
|
const {
|
|
76
78
|
i18n,
|
|
77
79
|
t
|
|
@@ -82,57 +84,57 @@ export const RelationshipTable = props => {
|
|
|
82
84
|
const [where, setWhere] = useState(null);
|
|
83
85
|
const [search, setSearch] = useState("");
|
|
84
86
|
const [openColumnSelector, setOpenColumnSelector] = useState(false);
|
|
85
|
-
let
|
|
87
|
+
let t4;
|
|
86
88
|
if ($[2] !== getEntityConfig || $[3] !== relationTo) {
|
|
87
|
-
|
|
89
|
+
t4 = () => getEntityConfig({
|
|
88
90
|
collectionSlug: relationTo
|
|
89
91
|
});
|
|
90
92
|
$[2] = getEntityConfig;
|
|
91
93
|
$[3] = relationTo;
|
|
92
|
-
$[4] =
|
|
94
|
+
$[4] = t4;
|
|
93
95
|
} else {
|
|
94
|
-
|
|
96
|
+
t4 = $[4];
|
|
95
97
|
}
|
|
96
|
-
const [collectionConfig] = useState(
|
|
98
|
+
const [collectionConfig] = useState(t4);
|
|
97
99
|
const apiURL = `${serverURL}${api}/${collectionConfig.slug}`;
|
|
98
|
-
let
|
|
100
|
+
let t5;
|
|
99
101
|
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
|
|
100
|
-
|
|
102
|
+
t5 = {
|
|
101
103
|
depth: 0
|
|
102
104
|
};
|
|
103
|
-
$[5] =
|
|
105
|
+
$[5] = t5;
|
|
104
106
|
} else {
|
|
105
|
-
|
|
107
|
+
t5 = $[5];
|
|
106
108
|
}
|
|
107
|
-
let
|
|
109
|
+
let t6;
|
|
108
110
|
if ($[6] !== initialData) {
|
|
109
|
-
|
|
111
|
+
t6 = {
|
|
110
112
|
initialData,
|
|
111
|
-
initialParams:
|
|
113
|
+
initialParams: t5
|
|
112
114
|
};
|
|
113
115
|
$[6] = initialData;
|
|
114
|
-
$[7] =
|
|
116
|
+
$[7] = t6;
|
|
115
117
|
} else {
|
|
116
|
-
|
|
118
|
+
t6 = $[7];
|
|
117
119
|
}
|
|
118
|
-
const [
|
|
120
|
+
const [t7, t8] = usePayloadAPI(apiURL, t6);
|
|
119
121
|
const {
|
|
120
122
|
data
|
|
121
|
-
} =
|
|
123
|
+
} = t7;
|
|
122
124
|
const {
|
|
123
125
|
setParams
|
|
124
|
-
} =
|
|
125
|
-
let
|
|
126
|
+
} = t8;
|
|
127
|
+
let t9;
|
|
126
128
|
if ($[8] !== collectionConfig || $[9] !== where || $[10] !== filterOptions || $[11] !== search || $[12] !== limit || $[13] !== page || $[14] !== sort || $[15] !== setParams) {
|
|
127
|
-
|
|
129
|
+
t9 = () => {
|
|
128
130
|
const {
|
|
129
|
-
admin:
|
|
131
|
+
admin: t10,
|
|
130
132
|
versions
|
|
131
133
|
} = collectionConfig;
|
|
132
134
|
const {
|
|
133
135
|
listSearchableFields,
|
|
134
136
|
useAsTitle
|
|
135
|
-
} =
|
|
137
|
+
} = t10 === undefined ? {} : t10;
|
|
136
138
|
const params = {
|
|
137
139
|
depth: 0
|
|
138
140
|
};
|
|
@@ -180,13 +182,13 @@ export const RelationshipTable = props => {
|
|
|
180
182
|
$[13] = page;
|
|
181
183
|
$[14] = sort;
|
|
182
184
|
$[15] = setParams;
|
|
183
|
-
$[16] =
|
|
185
|
+
$[16] = t9;
|
|
184
186
|
} else {
|
|
185
|
-
|
|
187
|
+
t9 = $[16];
|
|
186
188
|
}
|
|
187
|
-
let
|
|
189
|
+
let t10;
|
|
188
190
|
if ($[17] !== page || $[18] !== sort || $[19] !== where || $[20] !== search || $[21] !== collectionConfig || $[22] !== filterOptions || $[23] !== initialData || $[24] !== limit || $[25] !== setParams) {
|
|
189
|
-
|
|
191
|
+
t10 = [page, sort, where, search, collectionConfig, filterOptions, initialData, limit, setParams];
|
|
190
192
|
$[17] = page;
|
|
191
193
|
$[18] = sort;
|
|
192
194
|
$[19] = where;
|
|
@@ -196,29 +198,29 @@ export const RelationshipTable = props => {
|
|
|
196
198
|
$[23] = initialData;
|
|
197
199
|
$[24] = limit;
|
|
198
200
|
$[25] = setParams;
|
|
199
|
-
$[26] =
|
|
201
|
+
$[26] = t10;
|
|
200
202
|
} else {
|
|
201
|
-
|
|
203
|
+
t10 = $[26];
|
|
202
204
|
}
|
|
203
|
-
useEffect(
|
|
204
|
-
let
|
|
205
|
+
useEffect(t9, t10);
|
|
206
|
+
let t11;
|
|
205
207
|
if ($[27] !== relationTo) {
|
|
206
|
-
|
|
208
|
+
t11 = {
|
|
207
209
|
collectionSlug: relationTo
|
|
208
210
|
};
|
|
209
211
|
$[27] = relationTo;
|
|
210
|
-
$[28] =
|
|
212
|
+
$[28] = t11;
|
|
211
213
|
} else {
|
|
212
|
-
|
|
214
|
+
t11 = $[28];
|
|
213
215
|
}
|
|
214
|
-
const [DocumentDrawer, DocumentDrawerToggler,
|
|
216
|
+
const [DocumentDrawer, DocumentDrawerToggler, t12] = useDocumentDrawer(t11);
|
|
215
217
|
const {
|
|
216
218
|
closeDrawer,
|
|
217
219
|
openDrawer
|
|
218
|
-
} =
|
|
219
|
-
let
|
|
220
|
+
} = t12;
|
|
221
|
+
let t13;
|
|
220
222
|
if ($[29] !== data) {
|
|
221
|
-
|
|
223
|
+
t13 = args => {
|
|
222
224
|
const foundDocIndex = data?.docs?.findIndex(doc_0 => doc_0.id === args.doc.id);
|
|
223
225
|
if (foundDocIndex !== -1) {
|
|
224
226
|
const newDocs = [...data.docs];
|
|
@@ -235,59 +237,59 @@ export const RelationshipTable = props => {
|
|
|
235
237
|
}
|
|
236
238
|
};
|
|
237
239
|
$[29] = data;
|
|
238
|
-
$[30] =
|
|
240
|
+
$[30] = t13;
|
|
239
241
|
} else {
|
|
240
|
-
|
|
242
|
+
t13 = $[30];
|
|
241
243
|
}
|
|
242
|
-
const onDrawerSave =
|
|
243
|
-
let
|
|
244
|
+
const onDrawerSave = t13;
|
|
245
|
+
let t14;
|
|
244
246
|
if ($[31] !== closeDrawer || $[32] !== onDrawerSave) {
|
|
245
|
-
|
|
247
|
+
t14 = args_0 => {
|
|
246
248
|
closeDrawer();
|
|
247
249
|
onDrawerSave(args_0);
|
|
248
250
|
};
|
|
249
251
|
$[31] = closeDrawer;
|
|
250
252
|
$[32] = onDrawerSave;
|
|
251
|
-
$[33] =
|
|
253
|
+
$[33] = t14;
|
|
252
254
|
} else {
|
|
253
|
-
|
|
255
|
+
t14 = $[33];
|
|
254
256
|
}
|
|
255
|
-
const onDrawerCreate =
|
|
257
|
+
const onDrawerCreate = t14;
|
|
256
258
|
const preferenceKey = `${relationTo}-list`;
|
|
257
|
-
const
|
|
258
|
-
let
|
|
259
|
-
if ($[34] !==
|
|
260
|
-
|
|
259
|
+
const canCreate = allowCreate !== false && permissions?.collections?.[relationTo]?.create?.permission;
|
|
260
|
+
let t15;
|
|
261
|
+
if ($[34] !== canCreate || $[35] !== i18n || $[36] !== DocumentDrawerToggler) {
|
|
262
|
+
t15 = canCreate && _jsx(DocumentDrawerToggler, {
|
|
261
263
|
children: i18n.t("fields:addNew")
|
|
262
264
|
});
|
|
263
|
-
$[34] =
|
|
265
|
+
$[34] = canCreate;
|
|
264
266
|
$[35] = i18n;
|
|
265
267
|
$[36] = DocumentDrawerToggler;
|
|
266
|
-
$[37] =
|
|
268
|
+
$[37] = t15;
|
|
267
269
|
} else {
|
|
268
|
-
|
|
270
|
+
t15 = $[37];
|
|
269
271
|
}
|
|
270
|
-
const
|
|
271
|
-
const
|
|
272
|
-
let
|
|
273
|
-
if ($[38] !==
|
|
274
|
-
let
|
|
272
|
+
const t16 = `${baseClass}__toggle-columns ${openColumnSelector ? `${baseClass}__buttons-active` : ""}`;
|
|
273
|
+
const t17 = openColumnSelector ? "up" : "down";
|
|
274
|
+
let t18;
|
|
275
|
+
if ($[38] !== t17 || $[39] !== openColumnSelector || $[40] !== t || $[41] !== t16 || $[42] !== t15 || $[43] !== Label || $[44] !== data || $[45] !== collectionConfig || $[46] !== i18n || $[47] !== canCreate || $[48] !== openDrawer || $[49] !== limit || $[50] !== field || $[51] !== onDrawerSave || $[52] !== relationTo || $[53] !== preferenceKey || $[54] !== sort || $[55] !== docID || $[56] !== initialDrawerState || $[57] !== onDrawerCreate || $[58] !== DocumentDrawer) {
|
|
276
|
+
let t19;
|
|
275
277
|
if ($[60] !== openColumnSelector) {
|
|
276
|
-
|
|
278
|
+
t19 = () => setOpenColumnSelector(!openColumnSelector);
|
|
277
279
|
$[60] = openColumnSelector;
|
|
278
|
-
$[61] =
|
|
280
|
+
$[61] = t19;
|
|
279
281
|
} else {
|
|
280
|
-
|
|
282
|
+
t19 = $[61];
|
|
281
283
|
}
|
|
282
|
-
let
|
|
283
|
-
if ($[62] !== data.docs || $[63] !== collectionConfig || $[64] !== i18n || $[65] !==
|
|
284
|
-
|
|
284
|
+
let t20;
|
|
285
|
+
if ($[62] !== data.docs || $[63] !== collectionConfig || $[64] !== i18n || $[65] !== canCreate || $[66] !== openDrawer) {
|
|
286
|
+
t20 = data.docs && data.docs.length === 0 && _jsxs("div", {
|
|
285
287
|
className: `${baseClass}__no-results`,
|
|
286
288
|
children: [_jsx("p", {
|
|
287
289
|
children: i18n.t("general:noResults", {
|
|
288
290
|
label: getTranslation(collectionConfig?.labels?.plural, i18n)
|
|
289
291
|
})
|
|
290
|
-
}),
|
|
292
|
+
}), canCreate && _jsx(Button, {
|
|
291
293
|
onClick: openDrawer,
|
|
292
294
|
children: i18n.t("general:createNewLabel", {
|
|
293
295
|
label: getTranslation(collectionConfig?.labels?.singular, i18n)
|
|
@@ -297,15 +299,15 @@ export const RelationshipTable = props => {
|
|
|
297
299
|
$[62] = data.docs;
|
|
298
300
|
$[63] = collectionConfig;
|
|
299
301
|
$[64] = i18n;
|
|
300
|
-
$[65] =
|
|
302
|
+
$[65] = canCreate;
|
|
301
303
|
$[66] = openDrawer;
|
|
302
|
-
$[67] =
|
|
304
|
+
$[67] = t20;
|
|
303
305
|
} else {
|
|
304
|
-
|
|
306
|
+
t20 = $[67];
|
|
305
307
|
}
|
|
306
|
-
let
|
|
308
|
+
let t21;
|
|
307
309
|
if ($[68] !== data || $[69] !== limit || $[70] !== collectionConfig || $[71] !== i18n || $[72] !== field || $[73] !== onDrawerSave || $[74] !== openColumnSelector || $[75] !== relationTo || $[76] !== preferenceKey || $[77] !== sort) {
|
|
308
|
-
|
|
310
|
+
t21 = data.docs && data.docs.length > 0 && _jsx(RelationshipProvider, {
|
|
309
311
|
children: _jsx(ListQueryProvider, {
|
|
310
312
|
data,
|
|
311
313
|
defaultLimit: limit || collectionConfig?.admin?.pagination?.defaultLimit,
|
|
@@ -385,29 +387,29 @@ export const RelationshipTable = props => {
|
|
|
385
387
|
$[75] = relationTo;
|
|
386
388
|
$[76] = preferenceKey;
|
|
387
389
|
$[77] = sort;
|
|
388
|
-
$[78] =
|
|
390
|
+
$[78] = t21;
|
|
389
391
|
} else {
|
|
390
|
-
|
|
392
|
+
t21 = $[78];
|
|
391
393
|
}
|
|
392
|
-
|
|
394
|
+
t18 = _jsxs("div", {
|
|
393
395
|
className: baseClass,
|
|
394
396
|
children: [_jsxs("div", {
|
|
395
397
|
className: `${baseClass}__header`,
|
|
396
398
|
children: [Label, _jsxs("div", {
|
|
397
399
|
className: `${baseClass}__actions`,
|
|
398
|
-
children: [
|
|
400
|
+
children: [t15, _jsx(Pill, {
|
|
399
401
|
"aria-controls": `${baseClass}-columns`,
|
|
400
402
|
"aria-expanded": openColumnSelector,
|
|
401
|
-
className:
|
|
403
|
+
className: t16,
|
|
402
404
|
icon: _jsx(ChevronIcon, {
|
|
403
|
-
direction:
|
|
405
|
+
direction: t17
|
|
404
406
|
}),
|
|
405
|
-
onClick:
|
|
407
|
+
onClick: t19,
|
|
406
408
|
pillStyle: "light",
|
|
407
409
|
children: t("general:columns")
|
|
408
410
|
})]
|
|
409
411
|
})]
|
|
410
|
-
}),
|
|
412
|
+
}), t20, t21, _jsx(DocumentDrawer, {
|
|
411
413
|
initialData: {
|
|
412
414
|
category: docID
|
|
413
415
|
},
|
|
@@ -415,16 +417,16 @@ export const RelationshipTable = props => {
|
|
|
415
417
|
onSave: onDrawerCreate
|
|
416
418
|
})]
|
|
417
419
|
});
|
|
418
|
-
$[38] =
|
|
420
|
+
$[38] = t17;
|
|
419
421
|
$[39] = openColumnSelector;
|
|
420
422
|
$[40] = t;
|
|
421
|
-
$[41] =
|
|
422
|
-
$[42] =
|
|
423
|
+
$[41] = t16;
|
|
424
|
+
$[42] = t15;
|
|
423
425
|
$[43] = Label;
|
|
424
426
|
$[44] = data;
|
|
425
427
|
$[45] = collectionConfig;
|
|
426
428
|
$[46] = i18n;
|
|
427
|
-
$[47] =
|
|
429
|
+
$[47] = canCreate;
|
|
428
430
|
$[48] = openDrawer;
|
|
429
431
|
$[49] = limit;
|
|
430
432
|
$[50] = field;
|
|
@@ -436,10 +438,10 @@ export const RelationshipTable = props => {
|
|
|
436
438
|
$[56] = initialDrawerState;
|
|
437
439
|
$[57] = onDrawerCreate;
|
|
438
440
|
$[58] = DocumentDrawer;
|
|
439
|
-
$[59] =
|
|
441
|
+
$[59] = t18;
|
|
440
442
|
} else {
|
|
441
|
-
|
|
443
|
+
t18 = $[59];
|
|
442
444
|
}
|
|
443
|
-
return
|
|
445
|
+
return t18;
|
|
444
446
|
};
|
|
445
447
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useState","AnimateHeightImport","AnimateHeight","default","getTranslation","Button","Pill","usePayloadAPI","ChevronIcon","useAuth","useConfig","useDocumentInfo","ListQueryProvider","useTranslation","ColumnSelector","useDocumentDrawer","hoistQueryParamsToAnd","RelationshipProvider","TableColumnsProvider","DrawerLink","RelationshipTableWrapper","baseClass","RelationshipTable","props","$","field","filterOptions","initialData","initialDataFromProps","initialDrawerState","Label","relationTo","config","t0","getEntityConfig","routes","t1","serverURL","api","id","docID","permissions","t2","docs","Array","isArray","reduce","acc","doc","setInitialData","i18n","t","limit","setLimit","sort","setSort","undefined","page","setPage","where","setWhere","search","setSearch","openColumnSelector","setOpenColumnSelector","t3","collectionSlug","collectionConfig","apiURL","slug","t4","Symbol","for","depth","t5","initialParams","t6","t7","data","setParams","t8","admin","t9","versions","listSearchableFields","useAsTitle","params","copyOfWhere","searchAsConditions","map","fieldName","like","length","searchFilter","or","drafts","draft","t10","DocumentDrawer","DocumentDrawerToggler","t11","closeDrawer","openDrawer","t12","args","foundDocIndex","findIndex","doc_0","newDocs","onDrawerSave","t13","args_0","onDrawerCreate","preferenceKey","hasCreatePermission","collections","create","permission","t14","_jsx","children","t15","t16","t17","t18","t19","_jsxs","className","label","labels","plural","onClick","singular","t20","defaultLimit","pagination","defaultSort","handlePageChange","handlePerPageChange","handleSearchChange","handleSortChange","handleWhereChange","modifySearchParams","beforeRows","accessor","active","cellProps","components","Cell","type","RenderedComponent","sortColumnProps","appearance","height","icon","direction","pillStyle","category","initialState","onSave"],"sources":["../../../src/elements/RelationshipTable/index.tsx"],"sourcesContent":["'use client'\nimport type {\n ClientCollectionConfig,\n ClientField,\n JoinFieldClient,\n PaginatedDocs,\n Where,\n} from 'payload'\n\nimport React, { useCallback, useEffect, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nconst AnimateHeight = AnimateHeightImport.default || AnimateHeightImport\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { DocumentDrawerProps } from '../DocumentDrawer/types.js'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { Pill } from '../../elements/Pill/index.js'\nimport { usePayloadAPI } from '../../hooks/usePayloadAPI.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { ListQueryProvider } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ColumnSelector } from '../ColumnSelector/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { hoistQueryParamsToAnd } from '../ListDrawer/DrawerContent.js'\nimport { RelationshipProvider } from '../Table/RelationshipProvider/index.js'\nimport { TableColumnsProvider } from '../TableColumns/index.js'\nimport { DrawerLink } from './cells/DrawerLink/index.js'\nimport './index.scss'\nimport { RelationshipTableWrapper } from './TableWrapper.js'\n\nconst baseClass = 'relationship-table'\n\ntype RelationshipTableComponentProps = {\n readonly field: JoinFieldClient\n readonly filterOptions?: boolean | Where\n readonly initialData?: PaginatedDocs\n readonly initialDrawerState?: DocumentDrawerProps['initialState']\n readonly Label?: React.ReactNode\n readonly relationTo: string\n}\n\nexport const RelationshipTable: React.FC<RelationshipTableComponentProps> = (props) => {\n const {\n field,\n filterOptions,\n initialData: initialDataFromProps,\n initialDrawerState,\n Label,\n relationTo,\n } = props\n\n const {\n config: {\n routes: { api },\n serverURL,\n },\n getEntityConfig,\n } = useConfig()\n\n const { id: docID } = useDocumentInfo()\n\n const { permissions } = useAuth()\n\n const [initialData, setInitialData] = useState<PaginatedDocs>(() => {\n if (initialDataFromProps) {\n return {\n ...initialDataFromProps,\n docs: Array.isArray(initialDataFromProps.docs)\n ? initialDataFromProps.docs.reduce((acc, doc) => {\n if (typeof doc === 'string') {\n return acc\n }\n return [...acc, doc]\n }, [])\n : [],\n }\n }\n })\n\n const { i18n, t } = useTranslation()\n\n const [limit, setLimit] = useState<number>()\n const [sort, setSort] = useState<string | undefined>(undefined)\n const [page, setPage] = useState<number>(1)\n const [where, setWhere] = useState<null | Where>(null)\n const [search, setSearch] = useState<string>('')\n const [openColumnSelector, setOpenColumnSelector] = useState(false)\n\n const [collectionConfig] = useState(\n () => getEntityConfig({ collectionSlug: relationTo }) as ClientCollectionConfig,\n )\n\n const apiURL = `${serverURL}${api}/${collectionConfig.slug}`\n\n const [{ data }, { setParams }] = usePayloadAPI(apiURL, {\n initialData,\n initialParams: {\n depth: 0,\n },\n })\n\n useEffect(() => {\n const {\n admin: { listSearchableFields, useAsTitle } = {} as ClientCollectionConfig['admin'],\n versions,\n } = collectionConfig\n\n const params: {\n cacheBust?: number\n depth?: number\n draft?: string\n limit?: number\n page?: number\n search?: string\n sort?: string\n where?: unknown\n } = {\n depth: 0,\n }\n\n let copyOfWhere = { ...(where || {}) }\n\n if (filterOptions && typeof filterOptions !== 'boolean') {\n copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, filterOptions)\n }\n\n if (search) {\n const searchAsConditions = (listSearchableFields || [useAsTitle]).map((fieldName) => {\n return {\n [fieldName]: {\n like: search,\n },\n }\n }, [])\n\n if (searchAsConditions.length > 0) {\n const searchFilter: Where = {\n or: [...searchAsConditions],\n }\n\n copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, searchFilter)\n }\n }\n\n if (limit) {\n params.limit = limit\n }\n if (page) {\n params.page = page\n }\n if (sort) {\n params.sort = sort\n }\n if (copyOfWhere) {\n params.where = copyOfWhere\n }\n if (versions?.drafts) {\n params.draft = 'true'\n }\n\n setParams(params)\n }, [page, sort, where, search, collectionConfig, filterOptions, initialData, limit, setParams])\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer, openDrawer }] = useDocumentDrawer({\n collectionSlug: relationTo,\n })\n\n const onDrawerSave = useCallback<DocumentDrawerProps['onSave']>(\n (args) => {\n const foundDocIndex = data?.docs?.findIndex((doc) => doc.id === args.doc.id)\n\n if (foundDocIndex !== -1) {\n const newDocs = [...data.docs]\n newDocs[foundDocIndex] = args.doc\n setInitialData({\n ...data,\n docs: newDocs,\n })\n } else {\n setInitialData({\n ...data,\n docs: [args.doc, ...data.docs],\n })\n }\n },\n [data],\n )\n\n const onDrawerCreate = useCallback<DocumentDrawerProps['onSave']>(\n (args) => {\n closeDrawer()\n void onDrawerSave(args)\n },\n [closeDrawer, onDrawerSave],\n )\n\n const preferenceKey = `${relationTo}-list`\n\n const hasCreatePermission = permissions?.collections?.[relationTo]?.create?.permission\n\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__header`}>\n {Label}\n <div className={`${baseClass}__actions`}>\n {hasCreatePermission && (\n <DocumentDrawerToggler>{i18n.t('fields:addNew')}</DocumentDrawerToggler>\n )}\n <Pill\n aria-controls={`${baseClass}-columns`}\n aria-expanded={openColumnSelector}\n className={`${baseClass}__toggle-columns ${\n openColumnSelector ? `${baseClass}__buttons-active` : ''\n }`}\n icon={<ChevronIcon direction={openColumnSelector ? 'up' : 'down'} />}\n onClick={() => setOpenColumnSelector(!openColumnSelector)}\n pillStyle=\"light\"\n >\n {t('general:columns')}\n </Pill>\n </div>\n </div>\n {data.docs && data.docs.length === 0 && (\n <div className={`${baseClass}__no-results`}>\n <p>\n {i18n.t('general:noResults', {\n label: getTranslation(collectionConfig?.labels?.plural, i18n),\n })}\n </p>\n {hasCreatePermission && (\n <Button onClick={openDrawer}>\n {i18n.t('general:createNewLabel', {\n label: getTranslation(collectionConfig?.labels?.singular, i18n),\n })}\n </Button>\n )}\n </div>\n )}\n {data.docs && data.docs.length > 0 && (\n <RelationshipProvider>\n <ListQueryProvider\n data={data}\n defaultLimit={limit || collectionConfig?.admin?.pagination?.defaultLimit}\n defaultSort={sort}\n handlePageChange={setPage}\n handlePerPageChange={setLimit}\n handleSearchChange={setSearch}\n handleSortChange={setSort}\n handleWhereChange={setWhere}\n modifySearchParams={false}\n preferenceKey={preferenceKey}\n >\n <TableColumnsProvider\n beforeRows={[\n {\n accessor: 'collection',\n active: true,\n cellProps: {\n field: {\n admin: {\n components: {\n Cell: {\n type: 'client',\n RenderedComponent: (\n <Pill>{getTranslation(collectionConfig.labels.singular, i18n)}</Pill>\n ),\n },\n Label: null,\n },\n },\n } as ClientField,\n },\n Heading: i18n.t('version:type'),\n },\n ]}\n cellProps={[\n {},\n {\n field: {\n admin: {\n components: {\n Cell: {\n type: 'client',\n RenderedComponent: (\n <DrawerLink field={field} onDrawerSave={onDrawerSave} />\n ),\n },\n },\n },\n } as ClientField,\n link: false,\n },\n ]}\n collectionSlug={relationTo}\n preferenceKey={preferenceKey}\n sortColumnProps={{\n appearance: 'condensed',\n }}\n >\n {/* @ts-expect-error TODO: get this CJS import to work, eslint keeps removing the type assertion */}\n <AnimateHeight\n className={`${baseClass}__columns`}\n height={openColumnSelector ? 'auto' : 0}\n id={`${baseClass}-columns`}\n >\n <div className={`${baseClass}__columns-inner`}>\n <ColumnSelector collectionSlug={collectionConfig.slug} />\n </div>\n </AnimateHeight>\n <RelationshipTableWrapper collectionConfig={collectionConfig} />\n </TableColumnsProvider>\n </ListQueryProvider>\n </RelationshipProvider>\n )}\n <DocumentDrawer\n initialData={{\n category: docID,\n }}\n initialState={initialDrawerState}\n onSave={onDrawerCreate}\n />\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useState","AnimateHeightImport","AnimateHeight","default","getTranslation","Button","Pill","usePayloadAPI","ChevronIcon","useAuth","useConfig","useDocumentInfo","ListQueryProvider","useTranslation","ColumnSelector","useDocumentDrawer","hoistQueryParamsToAnd","RelationshipProvider","TableColumnsProvider","DrawerLink","RelationshipTableWrapper","baseClass","RelationshipTable","props","$","allowCreate","t0","field","filterOptions","initialData","initialDataFromProps","initialDrawerState","Label","relationTo","undefined","config","t1","getEntityConfig","routes","t2","serverURL","api","id","docID","permissions","t3","docs","Array","isArray","reduce","acc","doc","setInitialData","i18n","t","limit","setLimit","sort","setSort","page","setPage","where","setWhere","search","setSearch","openColumnSelector","setOpenColumnSelector","t4","collectionSlug","collectionConfig","apiURL","slug","t5","Symbol","for","depth","t6","initialParams","t7","t8","data","setParams","t9","admin","t10","versions","listSearchableFields","useAsTitle","params","copyOfWhere","searchAsConditions","map","fieldName","like","length","searchFilter","or","drafts","draft","t11","DocumentDrawer","DocumentDrawerToggler","t12","closeDrawer","openDrawer","t13","args","foundDocIndex","findIndex","doc_0","newDocs","onDrawerSave","t14","args_0","onDrawerCreate","preferenceKey","canCreate","collections","create","permission","t15","_jsx","children","t16","t17","t18","t19","t20","_jsxs","className","label","labels","plural","onClick","singular","t21","defaultLimit","pagination","defaultSort","handlePageChange","handlePerPageChange","handleSearchChange","handleSortChange","handleWhereChange","modifySearchParams","beforeRows","accessor","active","cellProps","components","Cell","type","RenderedComponent","sortColumnProps","appearance","height","icon","direction","pillStyle","category","initialState","onSave"],"sources":["../../../src/elements/RelationshipTable/index.tsx"],"sourcesContent":["'use client'\nimport type {\n ClientCollectionConfig,\n ClientField,\n JoinFieldClient,\n PaginatedDocs,\n Where,\n} from 'payload'\n\nimport React, { useCallback, useEffect, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nconst AnimateHeight = AnimateHeightImport.default || AnimateHeightImport\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { DocumentDrawerProps } from '../DocumentDrawer/types.js'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { Pill } from '../../elements/Pill/index.js'\nimport { usePayloadAPI } from '../../hooks/usePayloadAPI.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { ListQueryProvider } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ColumnSelector } from '../ColumnSelector/index.js'\nimport { useDocumentDrawer } from '../DocumentDrawer/index.js'\nimport { hoistQueryParamsToAnd } from '../ListDrawer/DrawerContent.js'\nimport { RelationshipProvider } from '../Table/RelationshipProvider/index.js'\nimport { TableColumnsProvider } from '../TableColumns/index.js'\nimport { DrawerLink } from './cells/DrawerLink/index.js'\nimport './index.scss'\nimport { RelationshipTableWrapper } from './TableWrapper.js'\n\nconst baseClass = 'relationship-table'\n\ntype RelationshipTableComponentProps = {\n readonly allowCreate?: boolean\n readonly field: JoinFieldClient\n readonly filterOptions?: boolean | Where\n readonly initialData?: PaginatedDocs\n readonly initialDrawerState?: DocumentDrawerProps['initialState']\n readonly Label?: React.ReactNode\n readonly relationTo: string\n}\n\nexport const RelationshipTable: React.FC<RelationshipTableComponentProps> = (props) => {\n const {\n allowCreate = true,\n field,\n filterOptions,\n initialData: initialDataFromProps,\n initialDrawerState,\n Label,\n relationTo,\n } = props\n\n const {\n config: {\n routes: { api },\n serverURL,\n },\n getEntityConfig,\n } = useConfig()\n\n const { id: docID } = useDocumentInfo()\n\n const { permissions } = useAuth()\n\n const [initialData, setInitialData] = useState<PaginatedDocs>(() => {\n if (initialDataFromProps) {\n return {\n ...initialDataFromProps,\n docs: Array.isArray(initialDataFromProps.docs)\n ? initialDataFromProps.docs.reduce((acc, doc) => {\n if (typeof doc === 'string') {\n return acc\n }\n return [...acc, doc]\n }, [])\n : [],\n }\n }\n })\n\n const { i18n, t } = useTranslation()\n\n const [limit, setLimit] = useState<number>()\n const [sort, setSort] = useState<string | undefined>(undefined)\n const [page, setPage] = useState<number>(1)\n const [where, setWhere] = useState<null | Where>(null)\n const [search, setSearch] = useState<string>('')\n const [openColumnSelector, setOpenColumnSelector] = useState(false)\n\n const [collectionConfig] = useState(\n () => getEntityConfig({ collectionSlug: relationTo }) as ClientCollectionConfig,\n )\n\n const apiURL = `${serverURL}${api}/${collectionConfig.slug}`\n\n const [{ data }, { setParams }] = usePayloadAPI(apiURL, {\n initialData,\n initialParams: {\n depth: 0,\n },\n })\n\n useEffect(() => {\n const {\n admin: { listSearchableFields, useAsTitle } = {} as ClientCollectionConfig['admin'],\n versions,\n } = collectionConfig\n\n const params: {\n cacheBust?: number\n depth?: number\n draft?: string\n limit?: number\n page?: number\n search?: string\n sort?: string\n where?: unknown\n } = {\n depth: 0,\n }\n\n let copyOfWhere = { ...(where || {}) }\n\n if (filterOptions && typeof filterOptions !== 'boolean') {\n copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, filterOptions)\n }\n\n if (search) {\n const searchAsConditions = (listSearchableFields || [useAsTitle]).map((fieldName) => {\n return {\n [fieldName]: {\n like: search,\n },\n }\n }, [])\n\n if (searchAsConditions.length > 0) {\n const searchFilter: Where = {\n or: [...searchAsConditions],\n }\n\n copyOfWhere = hoistQueryParamsToAnd(copyOfWhere, searchFilter)\n }\n }\n\n if (limit) {\n params.limit = limit\n }\n if (page) {\n params.page = page\n }\n if (sort) {\n params.sort = sort\n }\n if (copyOfWhere) {\n params.where = copyOfWhere\n }\n if (versions?.drafts) {\n params.draft = 'true'\n }\n\n setParams(params)\n }, [page, sort, where, search, collectionConfig, filterOptions, initialData, limit, setParams])\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer, openDrawer }] = useDocumentDrawer({\n collectionSlug: relationTo,\n })\n\n const onDrawerSave = useCallback<DocumentDrawerProps['onSave']>(\n (args) => {\n const foundDocIndex = data?.docs?.findIndex((doc) => doc.id === args.doc.id)\n\n if (foundDocIndex !== -1) {\n const newDocs = [...data.docs]\n newDocs[foundDocIndex] = args.doc\n setInitialData({\n ...data,\n docs: newDocs,\n })\n } else {\n setInitialData({\n ...data,\n docs: [args.doc, ...data.docs],\n })\n }\n },\n [data],\n )\n\n const onDrawerCreate = useCallback<DocumentDrawerProps['onSave']>(\n (args) => {\n closeDrawer()\n void onDrawerSave(args)\n },\n [closeDrawer, onDrawerSave],\n )\n\n const preferenceKey = `${relationTo}-list`\n\n const canCreate =\n allowCreate !== false && permissions?.collections?.[relationTo]?.create?.permission\n\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__header`}>\n {Label}\n <div className={`${baseClass}__actions`}>\n {canCreate && <DocumentDrawerToggler>{i18n.t('fields:addNew')}</DocumentDrawerToggler>}\n <Pill\n aria-controls={`${baseClass}-columns`}\n aria-expanded={openColumnSelector}\n className={`${baseClass}__toggle-columns ${\n openColumnSelector ? `${baseClass}__buttons-active` : ''\n }`}\n icon={<ChevronIcon direction={openColumnSelector ? 'up' : 'down'} />}\n onClick={() => setOpenColumnSelector(!openColumnSelector)}\n pillStyle=\"light\"\n >\n {t('general:columns')}\n </Pill>\n </div>\n </div>\n {data.docs && data.docs.length === 0 && (\n <div className={`${baseClass}__no-results`}>\n <p>\n {i18n.t('general:noResults', {\n label: getTranslation(collectionConfig?.labels?.plural, i18n),\n })}\n </p>\n {canCreate && (\n <Button onClick={openDrawer}>\n {i18n.t('general:createNewLabel', {\n label: getTranslation(collectionConfig?.labels?.singular, i18n),\n })}\n </Button>\n )}\n </div>\n )}\n {data.docs && data.docs.length > 0 && (\n <RelationshipProvider>\n <ListQueryProvider\n data={data}\n defaultLimit={limit || collectionConfig?.admin?.pagination?.defaultLimit}\n defaultSort={sort}\n handlePageChange={setPage}\n handlePerPageChange={setLimit}\n handleSearchChange={setSearch}\n handleSortChange={setSort}\n handleWhereChange={setWhere}\n modifySearchParams={false}\n preferenceKey={preferenceKey}\n >\n <TableColumnsProvider\n beforeRows={[\n {\n accessor: 'collection',\n active: true,\n cellProps: {\n field: {\n admin: {\n components: {\n Cell: {\n type: 'client',\n RenderedComponent: (\n <Pill>{getTranslation(collectionConfig.labels.singular, i18n)}</Pill>\n ),\n },\n Label: null,\n },\n },\n } as ClientField,\n },\n Heading: i18n.t('version:type'),\n },\n ]}\n cellProps={[\n {},\n {\n field: {\n admin: {\n components: {\n Cell: {\n type: 'client',\n RenderedComponent: (\n <DrawerLink field={field} onDrawerSave={onDrawerSave} />\n ),\n },\n },\n },\n } as ClientField,\n link: false,\n },\n ]}\n collectionSlug={relationTo}\n preferenceKey={preferenceKey}\n sortColumnProps={{\n appearance: 'condensed',\n }}\n >\n {/* @ts-expect-error TODO: get this CJS import to work, eslint keeps removing the type assertion */}\n <AnimateHeight\n className={`${baseClass}__columns`}\n height={openColumnSelector ? 'auto' : 0}\n id={`${baseClass}-columns`}\n >\n <div className={`${baseClass}__columns-inner`}>\n <ColumnSelector collectionSlug={collectionConfig.slug} />\n </div>\n </AnimateHeight>\n <RelationshipTableWrapper collectionConfig={collectionConfig} />\n </TableColumnsProvider>\n </ListQueryProvider>\n </RelationshipProvider>\n )}\n <DocumentDrawer\n initialData={{\n category: docID,\n }}\n initialState={initialDrawerState}\n onSave={onDrawerCreate}\n />\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createThumbnail.d.ts","sourceRoot":"","sources":["../../../src/elements/Thumbnail/createThumbnail.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,eAAe,SAAU,IAAI,KAAG,OAAO,CAAC,MAAM,CAgD1D,CAAA"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Create a thumbnail from a File object by drawing it onto an OffscreenCanvas
|
|
3
|
+
*/export const createThumbnail = file => {
|
|
4
|
+
return new Promise((resolve, reject) => {
|
|
5
|
+
const img = new Image();
|
|
6
|
+
img.src = URL.createObjectURL(file) // Use Object URL directly
|
|
7
|
+
;
|
|
8
|
+
img.onload = () => {
|
|
9
|
+
const maxDimension = 280;
|
|
10
|
+
let drawHeight, drawWidth;
|
|
11
|
+
// Calculate aspect ratio
|
|
12
|
+
const aspectRatio = img.width / img.height;
|
|
13
|
+
// Determine dimensions to fit within maxDimension while maintaining aspect ratio
|
|
14
|
+
if (aspectRatio > 1) {
|
|
15
|
+
// Image is wider than tall
|
|
16
|
+
drawWidth = maxDimension;
|
|
17
|
+
drawHeight = maxDimension / aspectRatio;
|
|
18
|
+
} else {
|
|
19
|
+
// Image is taller than wide, or square
|
|
20
|
+
drawWidth = maxDimension * aspectRatio;
|
|
21
|
+
drawHeight = maxDimension;
|
|
22
|
+
}
|
|
23
|
+
const canvas = new OffscreenCanvas(drawWidth, drawHeight) // Create an OffscreenCanvas
|
|
24
|
+
;
|
|
25
|
+
const ctx = canvas.getContext('2d');
|
|
26
|
+
// Draw the image onto the OffscreenCanvas with calculated dimensions
|
|
27
|
+
ctx.drawImage(img, 0, 0, drawWidth, drawHeight);
|
|
28
|
+
// Convert the OffscreenCanvas to a Blob and free up memory
|
|
29
|
+
canvas.convertToBlob({
|
|
30
|
+
type: 'image/jpeg',
|
|
31
|
+
quality: 0.25
|
|
32
|
+
}).then(blob => {
|
|
33
|
+
URL.revokeObjectURL(img.src) // Release the Object URL
|
|
34
|
+
;
|
|
35
|
+
const reader = new FileReader();
|
|
36
|
+
reader.onload = () => resolve(reader.result) // Resolve as data URL
|
|
37
|
+
;
|
|
38
|
+
reader.onerror = reject;
|
|
39
|
+
reader.readAsDataURL(blob);
|
|
40
|
+
}).catch(reject);
|
|
41
|
+
};
|
|
42
|
+
img.onerror = error => {
|
|
43
|
+
URL.revokeObjectURL(img.src) // Release Object URL on error
|
|
44
|
+
;
|
|
45
|
+
// eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors
|
|
46
|
+
reject(error);
|
|
47
|
+
};
|
|
48
|
+
});
|
|
49
|
+
};
|
|
50
|
+
//# sourceMappingURL=createThumbnail.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createThumbnail.js","names":["createThumbnail","file","Promise","resolve","reject","img","Image","src","URL","createObjectURL","onload","maxDimension","drawHeight","drawWidth","aspectRatio","width","height","canvas","OffscreenCanvas","ctx","getContext","drawImage","convertToBlob","type","quality","then","blob","revokeObjectURL","reader","FileReader","result","onerror","readAsDataURL","catch","error"],"sources":["../../../src/elements/Thumbnail/createThumbnail.ts"],"sourcesContent":["/**\n * Create a thumbnail from a File object by drawing it onto an OffscreenCanvas\n */\nexport const createThumbnail = (file: File): Promise<string> => {\n return new Promise((resolve, reject) => {\n const img = new Image()\n img.src = URL.createObjectURL(file) // Use Object URL directly\n\n img.onload = () => {\n const maxDimension = 280\n let drawHeight: number, drawWidth: number\n\n // Calculate aspect ratio\n const aspectRatio = img.width / img.height\n\n // Determine dimensions to fit within maxDimension while maintaining aspect ratio\n if (aspectRatio > 1) {\n // Image is wider than tall\n drawWidth = maxDimension\n drawHeight = maxDimension / aspectRatio\n } else {\n // Image is taller than wide, or square\n drawWidth = maxDimension * aspectRatio\n drawHeight = maxDimension\n }\n\n const canvas = new OffscreenCanvas(drawWidth, drawHeight) // Create an OffscreenCanvas\n const ctx = canvas.getContext('2d')\n\n // Draw the image onto the OffscreenCanvas with calculated dimensions\n ctx.drawImage(img, 0, 0, drawWidth, drawHeight)\n\n // Convert the OffscreenCanvas to a Blob and free up memory\n canvas\n .convertToBlob({ type: 'image/jpeg', quality: 0.25 })\n .then((blob) => {\n URL.revokeObjectURL(img.src) // Release the Object URL\n const reader = new FileReader()\n reader.onload = () => resolve(reader.result as string) // Resolve as data URL\n reader.onerror = reject\n reader.readAsDataURL(blob)\n })\n .catch(reject)\n }\n\n img.onerror = (error) => {\n URL.revokeObjectURL(img.src) // Release Object URL on error\n // eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors\n reject(error)\n }\n })\n}\n"],"mappings":"AAAA;;GAGA,OAAO,MAAMA,eAAA,GAAmBC,IAAA;EAC9B,OAAO,IAAIC,OAAA,CAAQ,CAACC,OAAA,EAASC,MAAA;IAC3B,MAAMC,GAAA,GAAM,IAAIC,KAAA;IAChBD,GAAA,CAAIE,GAAG,GAAGC,GAAA,CAAIC,eAAe,CAACR,IAAA,EAAM;IAAA;IAEpCI,GAAA,CAAIK,MAAM,GAAG;MACX,MAAMC,YAAA,GAAe;MACrB,IAAIC,UAAA,EAAoBC,SAAA;MAExB;MACA,MAAMC,WAAA,GAAcT,GAAA,CAAIU,KAAK,GAAGV,GAAA,CAAIW,MAAM;MAE1C;MACA,IAAIF,WAAA,GAAc,GAAG;QACnB;QACAD,SAAA,GAAYF,YAAA;QACZC,UAAA,GAAaD,YAAA,GAAeG,WAAA;MAC9B,OAAO;QACL;QACAD,SAAA,GAAYF,YAAA,GAAeG,WAAA;QAC3BF,UAAA,GAAaD,YAAA;MACf;MAEA,MAAMM,MAAA,GAAS,IAAIC,eAAA,CAAgBL,SAAA,EAAWD,UAAA,EAAY;MAAA;MAC1D,MAAMO,GAAA,GAAMF,MAAA,CAAOG,UAAU,CAAC;MAE9B;MACAD,GAAA,CAAIE,SAAS,CAAChB,GAAA,EAAK,GAAG,GAAGQ,SAAA,EAAWD,UAAA;MAEpC;MACAK,MAAA,CACGK,aAAa,CAAC;QAAEC,IAAA,EAAM;QAAcC,OAAA,EAAS;MAAK,GAClDC,IAAI,CAAEC,IAAA;QACLlB,GAAA,CAAImB,eAAe,CAACtB,GAAA,CAAIE,GAAG,EAAE;QAAA;QAC7B,MAAMqB,MAAA,GAAS,IAAIC,UAAA;QACnBD,MAAA,CAAOlB,MAAM,GAAG,MAAMP,OAAA,CAAQyB,MAAA,CAAOE,MAAM,EAAY;QAAA;QACvDF,MAAA,CAAOG,OAAO,GAAG3B,MAAA;QACjBwB,MAAA,CAAOI,aAAa,CAACN,IAAA;MACvB,GACCO,KAAK,CAAC7B,MAAA;IACX;IAEAC,GAAA,CAAI0B,OAAO,GAAIG,KAAA;MACb1B,GAAA,CAAImB,eAAe,CAACtB,GAAA,CAAIE,GAAG,EAAE;MAAA;MAC7B;MACAH,MAAA,CAAO8B,KAAA;IACT;EACF;AACF","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Thumbnail/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Thumbnail/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAMxD,MAAM,MAAM,cAAc,GAAG;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC9C,YAAY,CAAC,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CACnD,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAmC9C,CAAA;AAED,KAAK,uBAAuB,GAAG;IAC7B,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACxD,CAAA;AACD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,qBAgChE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","React","baseClass","File","ShimmerEffect","Thumbnail","props","$","className","t0","doc","t1","fileSrc","imageCacheTag","size","undefined","t2","filename","fileExists","setFileExists","useState","t3","t4","classNames","join","t5","t6","img","Image","src","onload","onerror","useEffect","t7","t8","_jsx","alt","_jsxs","children","height","ThumbnailComponent"],"sources":["../../../src/elements/Thumbnail/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'thumbnail'\n\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport { File } from '../../graphics/File/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nexport type ThumbnailProps = {\n className?: string\n collectionSlug?: string\n doc?: Record<string, unknown>\n fileSrc?: string\n imageCacheTag?: string\n size?: 'expand' | 'large' | 'medium' | 'small'\n uploadConfig?: SanitizedCollectionConfig['upload']\n}\n\nexport const Thumbnail: React.FC<ThumbnailProps> = (props) => {\n const { className = '', doc: { filename } = {}, fileSrc, imageCacheTag, size } = props\n const [fileExists, setFileExists] = React.useState(undefined)\n\n const classNames = [baseClass, `${baseClass}--size-${size || 'medium'}`, className].join(' ')\n\n React.useEffect(() => {\n if (!fileSrc) {\n setFileExists(false)\n return\n }\n\n const img = new Image()\n img.src = fileSrc\n img.onload = () => {\n setFileExists(true)\n }\n img.onerror = () => {\n setFileExists(false)\n }\n }, [fileSrc])\n\n return (\n <div className={classNames}>\n {fileExists === undefined && <ShimmerEffect height=\"100%\" />}\n {fileExists && (\n <img\n alt={filename as string}\n src={`${fileSrc}${imageCacheTag ? `?${imageCacheTag}` : ''}`}\n />\n )}\n {fileExists === false && <File />}\n </div>\n )\n}\n\ntype ThumbnailComponentProps = {\n readonly alt?: string\n readonly className?: string\n readonly filename: string\n readonly fileSrc: string\n readonly imageCacheTag?: string\n readonly size?: 'expand' | 'large' | 'medium' | 'small'\n}\nexport function ThumbnailComponent(props: ThumbnailComponentProps) {\n const { alt, className = '', filename, fileSrc, imageCacheTag, size } = props\n const [fileExists, setFileExists] = React.useState(undefined)\n\n const classNames = [baseClass, `${baseClass}--size-${size || 'medium'}`, className].join(' ')\n\n React.useEffect(() => {\n if (!fileSrc) {\n setFileExists(false)\n return\n }\n\n const img = new Image()\n img.src = fileSrc\n img.onload = () => {\n setFileExists(true)\n }\n img.onerror = () => {\n setFileExists(false)\n }\n }, [fileSrc])\n\n return (\n <div className={classNames}>\n {fileExists === undefined && <ShimmerEffect height=\"100%\" />}\n {fileExists && (\n <img alt={alt || filename} src={`${fileSrc}${imageCacheTag ? `?${imageCacheTag}` : ''}`} />\n )}\n {fileExists === false && <File />}\n </div>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAIlB,SAASC,IAAI,QAAQ;
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","React","baseClass","File","ShimmerEffect","Thumbnail","props","$","className","t0","doc","t1","fileSrc","imageCacheTag","size","undefined","t2","filename","fileExists","setFileExists","useState","t3","t4","classNames","join","t5","t6","img","Image","src","onload","onerror","useEffect","t7","t8","_jsx","alt","_jsxs","children","height","ThumbnailComponent"],"sources":["../../../src/elements/Thumbnail/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'thumbnail'\n\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport { File } from '../../graphics/File/index.js'\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nexport type ThumbnailProps = {\n className?: string\n collectionSlug?: string\n doc?: Record<string, unknown>\n fileSrc?: string\n imageCacheTag?: string\n size?: 'expand' | 'large' | 'medium' | 'small'\n uploadConfig?: SanitizedCollectionConfig['upload']\n}\n\nexport const Thumbnail: React.FC<ThumbnailProps> = (props) => {\n const { className = '', doc: { filename } = {}, fileSrc, imageCacheTag, size } = props\n const [fileExists, setFileExists] = React.useState(undefined)\n\n const classNames = [baseClass, `${baseClass}--size-${size || 'medium'}`, className].join(' ')\n\n React.useEffect(() => {\n if (!fileSrc) {\n // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect\n setFileExists(false)\n return\n }\n\n const img = new Image()\n img.src = fileSrc\n img.onload = () => {\n setFileExists(true)\n }\n img.onerror = () => {\n setFileExists(false)\n }\n }, [fileSrc])\n\n return (\n <div className={classNames}>\n {fileExists === undefined && <ShimmerEffect height=\"100%\" />}\n {fileExists && (\n <img\n alt={filename as string}\n src={`${fileSrc}${imageCacheTag ? `?${imageCacheTag}` : ''}`}\n />\n )}\n {fileExists === false && <File />}\n </div>\n )\n}\n\ntype ThumbnailComponentProps = {\n readonly alt?: string\n readonly className?: string\n readonly filename: string\n readonly fileSrc: string\n readonly imageCacheTag?: string\n readonly size?: 'expand' | 'large' | 'medium' | 'small'\n}\nexport function ThumbnailComponent(props: ThumbnailComponentProps) {\n const { alt, className = '', filename, fileSrc, imageCacheTag, size } = props\n const [fileExists, setFileExists] = React.useState(undefined)\n\n const classNames = [baseClass, `${baseClass}--size-${size || 'medium'}`, className].join(' ')\n\n React.useEffect(() => {\n if (!fileSrc) {\n // eslint-disable-next-line @eslint-react/hooks-extra/no-direct-set-state-in-use-effect\n setFileExists(false)\n return\n }\n\n const img = new Image()\n img.src = fileSrc\n img.onload = () => {\n setFileExists(true)\n }\n img.onerror = () => {\n setFileExists(false)\n }\n }, [fileSrc])\n\n return (\n <div className={classNames}>\n {fileExists === undefined && <ShimmerEffect height=\"100%\" />}\n {fileExists && (\n <img alt={alt || filename} src={`${fileSrc}${imageCacheTag ? `?${imageCacheTag}` : ''}`} />\n )}\n {fileExists === false && <File />}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|