@visns-studio/visns-components 2.6.8 → 2.6.10
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.
|
@@ -129,25 +129,6 @@ function VisnsDropZone({ fetchData, files, settings }) {
|
|
|
129
129
|
<>
|
|
130
130
|
{settings.type === 'gallery' ? (
|
|
131
131
|
<div className="image-container">
|
|
132
|
-
{/* {files && files.length > 0
|
|
133
|
-
? files.map((a) => (
|
|
134
|
-
<div class="image-with-close">
|
|
135
|
-
<img src={a.file_url} />
|
|
136
|
-
<span
|
|
137
|
-
class="close-icon"
|
|
138
|
-
onClick={(event) => {
|
|
139
|
-
handleDelete(
|
|
140
|
-
event,
|
|
141
|
-
a.id,
|
|
142
|
-
a.file_name
|
|
143
|
-
);
|
|
144
|
-
}}
|
|
145
|
-
>
|
|
146
|
-
×
|
|
147
|
-
</span>
|
|
148
|
-
</div>
|
|
149
|
-
))
|
|
150
|
-
: null} */}
|
|
151
132
|
{data && data.length > 0 ? (
|
|
152
133
|
<SortableList
|
|
153
134
|
items={data}
|
|
@@ -156,7 +137,7 @@ function VisnsDropZone({ fetchData, files, settings }) {
|
|
|
156
137
|
helperClass="dragitem"
|
|
157
138
|
transitionDuration={250}
|
|
158
139
|
handleDelete={handleDelete}
|
|
159
|
-
|
|
140
|
+
useDragHandle
|
|
160
141
|
/>
|
|
161
142
|
) : null}
|
|
162
143
|
</div>
|
|
@@ -40,6 +40,7 @@ const ChildSort = ({ item, url }) => {
|
|
|
40
40
|
axis="xy"
|
|
41
41
|
helperClass="dragitem"
|
|
42
42
|
transitionDuration={250}
|
|
43
|
+
useDragHandle
|
|
43
44
|
/>
|
|
44
45
|
</>
|
|
45
46
|
);
|
|
@@ -100,6 +101,7 @@ const CmsSort = ({ setting, category = false }) => {
|
|
|
100
101
|
axis="xy"
|
|
101
102
|
helperClass="dragitem"
|
|
102
103
|
transitionDuration={250}
|
|
104
|
+
useDragHandle
|
|
103
105
|
/>
|
|
104
106
|
) : (
|
|
105
107
|
data.length > 0 &&
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { SortableElement } from 'react-sortable-hoc';
|
|
2
|
+
import { SortableElement, sortableHandle } from 'react-sortable-hoc';
|
|
3
3
|
import { ChevronVertical, TrashCan } from 'akar-icons';
|
|
4
4
|
|
|
5
|
+
const DragHandle = sortableHandle(() => (
|
|
6
|
+
<ChevronVertical strokeWidth={1} size={26} />
|
|
7
|
+
));
|
|
8
|
+
|
|
5
9
|
const SortableItem = ({ containerIndex, handleClick, handleDelete, value }) => {
|
|
6
10
|
return (
|
|
7
11
|
<li
|
|
@@ -13,7 +17,7 @@ const SortableItem = ({ containerIndex, handleClick, handleDelete, value }) => {
|
|
|
13
17
|
}
|
|
14
18
|
}}
|
|
15
19
|
>
|
|
16
|
-
<
|
|
20
|
+
<DragHandle />
|
|
17
21
|
{value.label}
|
|
18
22
|
|
|
19
23
|
{value.hasOwnProperty('image_url') && value.image_url !== '' ? (
|
|
@@ -29,7 +33,7 @@ const SortableItem = ({ containerIndex, handleClick, handleDelete, value }) => {
|
|
|
29
33
|
) : null}
|
|
30
34
|
{handleDelete && (
|
|
31
35
|
<TrashCan
|
|
32
|
-
className="delete"
|
|
36
|
+
className="delete trash-delete"
|
|
33
37
|
strokeWidth={1}
|
|
34
38
|
size={26}
|
|
35
39
|
onClick={(e) => {
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import React, {useEffect, useState, useCallback} from 'react';
|
|
1
|
+
import React, { useEffect, useState, useCallback } from 'react';
|
|
2
2
|
import CustomFetch from './Fetch';
|
|
3
3
|
import SelectList from './SelectList';
|
|
4
4
|
import AsyncSelect from 'react-select/async';
|
|
5
|
-
import {debounce} from 'lodash';
|
|
6
|
-
|
|
7
|
-
function VisnsAsyncSelect({inputValue, onChange, settings}) {
|
|
5
|
+
import { debounce } from 'lodash';
|
|
8
6
|
|
|
7
|
+
function VisnsAsyncSelect({ inputValue, onChange, settings }) {
|
|
9
8
|
const loadSuggestedOptions = useCallback(
|
|
10
9
|
debounce((inputValue, callback) => {
|
|
11
10
|
if (inputValue !== '') {
|
|
@@ -70,12 +69,16 @@ function VisnsAsyncSelect({inputValue, onChange, settings}) {
|
|
|
70
69
|
onChange={(inputValue, action) => {
|
|
71
70
|
onChange(inputValue, action, settings.id);
|
|
72
71
|
}}
|
|
73
|
-
components={{SelectList}}
|
|
72
|
+
components={{ SelectList }}
|
|
74
73
|
styles={{
|
|
75
|
-
menu: (
|
|
76
|
-
...
|
|
74
|
+
menu: (styles) => ({
|
|
75
|
+
...styles,
|
|
77
76
|
zIndex: 9999,
|
|
78
77
|
}),
|
|
78
|
+
input: (styles) => ({
|
|
79
|
+
...styles,
|
|
80
|
+
padding: 0,
|
|
81
|
+
}),
|
|
79
82
|
}}
|
|
80
83
|
value={inputValue}
|
|
81
84
|
/>
|
package/package.json
CHANGED