@chayns-components/gallery 5.0.0-beta.303 → 5.0.0-beta.308

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.
@@ -1,4 +1,277 @@
1
- export declare const StyledAddFile: import("styled-components").StyledComponent<"div", any, {}, never>;
2
- export declare const StyledAddFIleIconWrapper: import("styled-components").StyledComponent<"button", any, {
1
+ /// <reference types="react" />
2
+ /// <reference types="react" />
3
+ export declare const StyledAddFile: import("styled-components").IStyledComponent<"web", {
4
+ ref?: import("react").LegacyRef<HTMLDivElement> | undefined;
5
+ key?: import("react").Key | null | undefined;
6
+ defaultChecked?: boolean | undefined;
7
+ defaultValue?: string | number | readonly string[] | undefined;
8
+ suppressContentEditableWarning?: boolean | undefined;
9
+ suppressHydrationWarning?: boolean | undefined;
10
+ accessKey?: string | undefined;
11
+ autoFocus?: boolean | undefined;
12
+ className?: string | undefined;
13
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
14
+ contextMenu?: string | undefined;
15
+ dir?: string | undefined;
16
+ draggable?: (boolean | "true" | "false") | undefined;
17
+ hidden?: boolean | undefined;
18
+ id?: string | undefined;
19
+ lang?: string | undefined;
20
+ nonce?: string | undefined;
21
+ placeholder?: string | undefined;
22
+ slot?: string | undefined;
23
+ spellCheck?: (boolean | "true" | "false") | undefined;
24
+ style?: import("react").CSSProperties | undefined;
25
+ tabIndex?: number | undefined;
26
+ title?: string | undefined;
27
+ translate?: "yes" | "no" | undefined;
28
+ radioGroup?: string | undefined;
29
+ role?: import("react").AriaRole | undefined;
30
+ about?: string | undefined;
31
+ content?: string | undefined;
32
+ datatype?: string | undefined;
33
+ inlist?: any;
34
+ prefix?: string | undefined;
35
+ property?: string | undefined;
36
+ rel?: string | undefined;
37
+ resource?: string | undefined;
38
+ rev?: string | undefined;
39
+ typeof?: string | undefined;
40
+ vocab?: string | undefined;
41
+ autoCapitalize?: string | undefined;
42
+ autoCorrect?: string | undefined;
43
+ autoSave?: string | undefined;
44
+ color?: string | undefined;
45
+ itemProp?: string | undefined;
46
+ itemScope?: boolean | undefined;
47
+ itemType?: string | undefined;
48
+ itemID?: string | undefined;
49
+ itemRef?: string | undefined;
50
+ results?: number | undefined;
51
+ security?: string | undefined;
52
+ unselectable?: "on" | "off" | undefined;
53
+ inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
54
+ is?: string | undefined;
55
+ "aria-activedescendant"?: string | undefined;
56
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
57
+ "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
58
+ "aria-braillelabel"?: string | undefined;
59
+ "aria-brailleroledescription"?: string | undefined;
60
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
61
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
62
+ "aria-colcount"?: number | undefined;
63
+ "aria-colindex"?: number | undefined;
64
+ "aria-colindextext"?: string | undefined;
65
+ "aria-colspan"?: number | undefined;
66
+ "aria-controls"?: string | undefined;
67
+ "aria-current"?: boolean | "time" | "step" | "true" | "false" | "page" | "location" | "date" | undefined;
68
+ "aria-describedby"?: string | undefined;
69
+ "aria-description"?: string | undefined;
70
+ "aria-details"?: string | undefined;
71
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
72
+ "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ "aria-errormessage"?: string | undefined;
74
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
75
+ "aria-flowto"?: string | undefined;
76
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
77
+ "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
78
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
79
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
80
+ "aria-keyshortcuts"?: string | undefined;
81
+ "aria-label"?: string | undefined;
82
+ "aria-labelledby"?: string | undefined;
83
+ "aria-level"?: number | undefined;
84
+ "aria-live"?: "off" | "assertive" | "polite" | undefined;
85
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
86
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
87
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
88
+ "aria-orientation"?: "horizontal" | "vertical" | undefined;
89
+ "aria-owns"?: string | undefined;
90
+ "aria-placeholder"?: string | undefined;
91
+ "aria-posinset"?: number | undefined;
92
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
93
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
94
+ "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
95
+ "aria-required"?: (boolean | "true" | "false") | undefined;
96
+ "aria-roledescription"?: string | undefined;
97
+ "aria-rowcount"?: number | undefined;
98
+ "aria-rowindex"?: number | undefined;
99
+ "aria-rowindextext"?: string | undefined;
100
+ "aria-rowspan"?: number | undefined;
101
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
102
+ "aria-setsize"?: number | undefined;
103
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
104
+ "aria-valuemax"?: number | undefined;
105
+ "aria-valuemin"?: number | undefined;
106
+ "aria-valuenow"?: number | undefined;
107
+ "aria-valuetext"?: string | undefined;
108
+ children?: import("react").ReactNode;
109
+ dangerouslySetInnerHTML?: {
110
+ __html: string | TrustedHTML;
111
+ } | undefined;
112
+ onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
113
+ onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
114
+ onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
115
+ onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
116
+ onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
117
+ onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
118
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
119
+ onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
120
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
121
+ onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
122
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
123
+ onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
124
+ onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
125
+ onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
126
+ onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
127
+ onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
128
+ onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
129
+ onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
130
+ onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
131
+ onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
132
+ onInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
133
+ onInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
134
+ onReset?: import("react").FormEventHandler<HTMLDivElement> | undefined;
135
+ onResetCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
136
+ onSubmit?: import("react").FormEventHandler<HTMLDivElement> | undefined;
137
+ onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
138
+ onInvalid?: import("react").FormEventHandler<HTMLDivElement> | undefined;
139
+ onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
140
+ onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
141
+ onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
142
+ onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
143
+ onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
144
+ onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
145
+ onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
146
+ onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
147
+ onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
148
+ onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
149
+ onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
150
+ onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
151
+ onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
152
+ onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
153
+ onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
154
+ onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
155
+ onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
156
+ onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
157
+ onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
158
+ onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
159
+ onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
160
+ onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
161
+ onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
162
+ onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
163
+ onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
164
+ onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
165
+ onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
166
+ onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
167
+ onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
168
+ onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
169
+ onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
170
+ onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
171
+ onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
172
+ onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
173
+ onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
174
+ onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
175
+ onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
176
+ onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
177
+ onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
178
+ onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
179
+ onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
180
+ onResize?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
181
+ onResizeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
182
+ onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
183
+ onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
184
+ onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
185
+ onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
186
+ onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
187
+ onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
188
+ onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
189
+ onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
190
+ onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
191
+ onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
192
+ onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
193
+ onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
194
+ onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
195
+ onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
196
+ onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
197
+ onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
198
+ onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
199
+ onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
200
+ onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
201
+ onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
202
+ onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
203
+ onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
204
+ onDrag?: import("react").DragEventHandler<HTMLDivElement> | undefined;
205
+ onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
206
+ onDragEnd?: import("react").DragEventHandler<HTMLDivElement> | undefined;
207
+ onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
208
+ onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
209
+ onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
210
+ onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
211
+ onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
212
+ onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
213
+ onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
214
+ onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
215
+ onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
216
+ onDragStart?: import("react").DragEventHandler<HTMLDivElement> | undefined;
217
+ onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
218
+ onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
219
+ onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
220
+ onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
221
+ onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
222
+ onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
223
+ onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
224
+ onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
225
+ onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
226
+ onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
227
+ onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
228
+ onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
229
+ onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
230
+ onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
231
+ onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
232
+ onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
233
+ onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
234
+ onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
235
+ onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
236
+ onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
237
+ onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
238
+ onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
239
+ onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
240
+ onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
241
+ onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
242
+ onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
243
+ onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
244
+ onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
245
+ onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
246
+ onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
247
+ onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
248
+ onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
249
+ onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
250
+ onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
251
+ onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
252
+ onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
253
+ onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
254
+ onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
255
+ onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
256
+ onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
257
+ onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
258
+ onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
259
+ onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
260
+ onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
261
+ onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
262
+ onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
263
+ onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
264
+ onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
265
+ onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
266
+ onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
267
+ onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
268
+ onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
269
+ onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
270
+ onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
271
+ onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
272
+ onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
273
+ onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
274
+ }>;
275
+ export declare const StyledAddFIleIconWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
3
276
  theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
4
- }, never>;
277
+ }>>;
@@ -21,25 +21,22 @@ const GalleryItem = _ref => {
21
21
  remainingItemsLength,
22
22
  onClick
23
23
  } = _ref;
24
- return (0, _react.useMemo)(() => {
25
- var _fileItem$id, _fileItem$id2;
26
- return /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItem, null, isEditMode && /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItemDeleteButton, {
27
- onClick: () => handleDeleteFile(fileItem.id)
28
- }, /*#__PURE__*/_react.default.createElement(_core.Icon, {
29
- size: 20,
30
- icons: ['ts-wrong']
31
- })), !fileItem.state || fileItem.state === 'none' || !fileItem.previewUrl && !fileItem.uploadedFile ? null : /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
32
- initial: false
33
- }, fileItem.state === 'uploading' ? /*#__PURE__*/_react.default.createElement(_PreviewItem.default, {
34
- key: `uploading_${(_fileItem$id = fileItem.id) !== null && _fileItem$id !== void 0 ? _fileItem$id : ''}`,
35
- fileItem: fileItem
36
- }) : /*#__PURE__*/_react.default.createElement(_MediaItem.default, {
37
- key: `uploaded_${(_fileItem$id2 = fileItem.id) !== null && _fileItem$id2 !== void 0 ? _fileItem$id2 : ''}`,
38
- fileItem: fileItem,
39
- isEditMode: isEditMode,
40
- openSelectedFile: onClick
41
- })), remainingItemsLength && /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItemMoreItemsIndicator, null, /*#__PURE__*/_react.default.createElement("p", null, `+ ${remainingItemsLength - 3}`)));
42
- }, [fileItem, handleDeleteFile, isEditMode, onClick, remainingItemsLength]);
24
+ return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItem, null, isEditMode && /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItemDeleteButton, {
25
+ onClick: () => handleDeleteFile(fileItem.id)
26
+ }, /*#__PURE__*/_react.default.createElement(_core.Icon, {
27
+ size: 20,
28
+ icons: ['ts-wrong']
29
+ })), !fileItem.state || fileItem.state === 'none' || !fileItem.previewUrl && !fileItem.uploadedFile ? null : /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
30
+ initial: false
31
+ }, fileItem.state === 'uploading' ? /*#__PURE__*/_react.default.createElement(_PreviewItem.default, {
32
+ key: `uploading_${fileItem.id ?? ''}`,
33
+ fileItem: fileItem
34
+ }) : /*#__PURE__*/_react.default.createElement(_MediaItem.default, {
35
+ key: `uploaded_${fileItem.id ?? ''}`,
36
+ fileItem: fileItem,
37
+ isEditMode: isEditMode,
38
+ openSelectedFile: onClick
39
+ })), remainingItemsLength && /*#__PURE__*/_react.default.createElement(_GalleryItem.StyledGalleryItemMoreItemsIndicator, null, /*#__PURE__*/_react.default.createElement("p", null, `+ ${remainingItemsLength - 3}`))), [fileItem, handleDeleteFile, isEditMode, onClick, remainingItemsLength]);
43
40
  };
44
41
  GalleryItem.displayName = 'GalleryItem';
45
42
  var _default = exports.default = GalleryItem;
@@ -1 +1 @@
1
- {"version":3,"file":"GalleryItem.js","names":["_core","require","_framerMotion","_react","_interopRequireWildcard","_GalleryItem","_MediaItem","_interopRequireDefault","_PreviewItem","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","GalleryItem","_ref","fileItem","handleDeleteFile","isEditMode","remainingItemsLength","onClick","useMemo","_fileItem$id","_fileItem$id2","createElement","StyledGalleryItem","StyledGalleryItemDeleteButton","id","Icon","size","icons","state","previewUrl","uploadedFile","AnimatePresence","initial","key","openSelectedFile","StyledGalleryItemMoreItemsIndicator","displayName","_default","exports"],"sources":["../../../src/components/gallery-item/GalleryItem.tsx"],"sourcesContent":["import { Icon } from '@chayns-components/core';\nimport type { FileItem } from '@chayns-components/core/lib/types/file';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, useMemo } from 'react';\nimport {\n StyledGalleryItem,\n StyledGalleryItemDeleteButton,\n StyledGalleryItemMoreItemsIndicator,\n} from './GalleryItem.styles';\nimport MediaItem from './media-item/MediaItem';\nimport PreviewItem from './preview-item/PreviewItem';\n\nexport type GalleryItemProps = {\n /**\n * Images and videos which should be displayed\n */\n fileItem: FileItem;\n /**\n * Whether images and videos can be edited\n */\n isEditMode: boolean;\n /**\n * Function to be executed when a file is deleted\n */\n handleDeleteFile: (id?: string) => void;\n /**\n * Length of the uploaded files\n */\n remainingItemsLength?: number;\n /**\n * Function to be executed if a file should be opened\n */\n onClick: (file: FileItem) => void;\n};\n\nconst GalleryItem: FC<GalleryItemProps> = ({\n fileItem,\n handleDeleteFile,\n isEditMode,\n remainingItemsLength,\n onClick,\n}) =>\n useMemo(\n () => (\n <StyledGalleryItem>\n {isEditMode && (\n <StyledGalleryItemDeleteButton onClick={() => handleDeleteFile(fileItem.id)}>\n <Icon size={20} icons={['ts-wrong']} />\n </StyledGalleryItemDeleteButton>\n )}\n {!fileItem.state ||\n fileItem.state === 'none' ||\n (!fileItem.previewUrl && !fileItem.uploadedFile) ? null : (\n <AnimatePresence initial={false}>\n {fileItem.state === 'uploading' ? (\n <PreviewItem\n key={`uploading_${fileItem.id ?? ''}`}\n fileItem={fileItem}\n />\n ) : (\n <MediaItem\n key={`uploaded_${fileItem.id ?? ''}`}\n fileItem={fileItem}\n isEditMode={isEditMode}\n openSelectedFile={onClick}\n />\n )}\n </AnimatePresence>\n )}\n {remainingItemsLength && (\n <StyledGalleryItemMoreItemsIndicator>\n <p>{`+ ${remainingItemsLength - 3}`}</p>\n </StyledGalleryItemMoreItemsIndicator>\n )}\n </StyledGalleryItem>\n ),\n [fileItem, handleDeleteFile, isEditMode, onClick, remainingItemsLength]\n );\n\nGalleryItem.displayName = 'GalleryItem';\n\nexport default GalleryItem;\n"],"mappings":"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"}
1
+ {"version":3,"file":"GalleryItem.js","names":["_core","require","_framerMotion","_react","_interopRequireWildcard","_GalleryItem","_MediaItem","_interopRequireDefault","_PreviewItem","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","GalleryItem","_ref","fileItem","handleDeleteFile","isEditMode","remainingItemsLength","onClick","useMemo","createElement","StyledGalleryItem","StyledGalleryItemDeleteButton","id","Icon","size","icons","state","previewUrl","uploadedFile","AnimatePresence","initial","key","openSelectedFile","StyledGalleryItemMoreItemsIndicator","displayName","_default","exports"],"sources":["../../../src/components/gallery-item/GalleryItem.tsx"],"sourcesContent":["import { Icon } from '@chayns-components/core';\nimport type { FileItem } from '@chayns-components/core/lib/types/file';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, useMemo } from 'react';\nimport {\n StyledGalleryItem,\n StyledGalleryItemDeleteButton,\n StyledGalleryItemMoreItemsIndicator,\n} from './GalleryItem.styles';\nimport MediaItem from './media-item/MediaItem';\nimport PreviewItem from './preview-item/PreviewItem';\n\nexport type GalleryItemProps = {\n /**\n * Images and videos which should be displayed\n */\n fileItem: FileItem;\n /**\n * Whether images and videos can be edited\n */\n isEditMode: boolean;\n /**\n * Function to be executed when a file is deleted\n */\n handleDeleteFile: (id?: string) => void;\n /**\n * Length of the uploaded files\n */\n remainingItemsLength?: number;\n /**\n * Function to be executed if a file should be opened\n */\n onClick: (file: FileItem) => void;\n};\n\nconst GalleryItem: FC<GalleryItemProps> = ({\n fileItem,\n handleDeleteFile,\n isEditMode,\n remainingItemsLength,\n onClick,\n}) =>\n useMemo(\n () => (\n <StyledGalleryItem>\n {isEditMode && (\n <StyledGalleryItemDeleteButton onClick={() => handleDeleteFile(fileItem.id)}>\n <Icon size={20} icons={['ts-wrong']} />\n </StyledGalleryItemDeleteButton>\n )}\n {!fileItem.state ||\n fileItem.state === 'none' ||\n (!fileItem.previewUrl && !fileItem.uploadedFile) ? null : (\n <AnimatePresence initial={false}>\n {fileItem.state === 'uploading' ? (\n <PreviewItem\n key={`uploading_${fileItem.id ?? ''}`}\n fileItem={fileItem}\n />\n ) : (\n <MediaItem\n key={`uploaded_${fileItem.id ?? ''}`}\n fileItem={fileItem}\n isEditMode={isEditMode}\n openSelectedFile={onClick}\n />\n )}\n </AnimatePresence>\n )}\n {remainingItemsLength && (\n <StyledGalleryItemMoreItemsIndicator>\n <p>{`+ ${remainingItemsLength - 3}`}</p>\n </StyledGalleryItemMoreItemsIndicator>\n )}\n </StyledGalleryItem>\n ),\n [fileItem, handleDeleteFile, isEditMode, onClick, remainingItemsLength]\n );\n\nGalleryItem.displayName = 'GalleryItem';\n\nexport default GalleryItem;\n"],"mappings":"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"}