@visns-studio/visns-components 3.9.9 → 4.0.1
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,6 +1,25 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import styles from './TableFilter.module.css';
|
|
3
|
+
|
|
4
|
+
function TableFilter({
|
|
5
|
+
collapsible = false,
|
|
6
|
+
filters,
|
|
7
|
+
setFilters,
|
|
8
|
+
setSettings,
|
|
9
|
+
type,
|
|
10
|
+
}) {
|
|
11
|
+
const [visibleChildren, setVisibleChildren] = useState(null);
|
|
12
|
+
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
if (
|
|
15
|
+
filters.length > 0 &&
|
|
16
|
+
filters[0].children &&
|
|
17
|
+
filters[0].children.length > 0
|
|
18
|
+
) {
|
|
19
|
+
setVisibleChildren(filters[0].id);
|
|
20
|
+
}
|
|
21
|
+
}, [filters]);
|
|
2
22
|
|
|
3
|
-
function TableFilter({ filters, setFilters, setSettings, type }) {
|
|
4
23
|
const filterTable = (e) => {
|
|
5
24
|
const { id, parent, filtertype, url, value } = e.target.dataset;
|
|
6
25
|
|
|
@@ -89,6 +108,11 @@ function TableFilter({ filters, setFilters, setSettings, type }) {
|
|
|
89
108
|
});
|
|
90
109
|
}
|
|
91
110
|
}
|
|
111
|
+
|
|
112
|
+
// Handle collapsible functionality
|
|
113
|
+
if (collapsible && filtertype === 'parent') {
|
|
114
|
+
setVisibleChildren((prevState) => (prevState === id ? null : id));
|
|
115
|
+
}
|
|
92
116
|
};
|
|
93
117
|
|
|
94
118
|
const renderContent = (d) => {
|
|
@@ -119,8 +143,14 @@ function TableFilter({ filters, setFilters, setSettings, type }) {
|
|
|
119
143
|
>
|
|
120
144
|
{d.label}
|
|
121
145
|
</a>
|
|
122
|
-
{d.children && d.children.length > 0
|
|
123
|
-
<ul
|
|
146
|
+
{d.children && d.children.length > 0 && (
|
|
147
|
+
<ul
|
|
148
|
+
className={`${styles.collapsibleMenu} ${
|
|
149
|
+
visibleChildren === d.id
|
|
150
|
+
? styles.visibleMenu
|
|
151
|
+
: ''
|
|
152
|
+
}`}
|
|
153
|
+
>
|
|
124
154
|
{d.children.map((child, key) => (
|
|
125
155
|
<li key={`table-filter-child-${d.id}-${key}`}>
|
|
126
156
|
<a
|
|
@@ -141,7 +171,7 @@ function TableFilter({ filters, setFilters, setSettings, type }) {
|
|
|
141
171
|
</li>
|
|
142
172
|
))}
|
|
143
173
|
</ul>
|
|
144
|
-
)
|
|
174
|
+
)}
|
|
145
175
|
</li>
|
|
146
176
|
);
|
|
147
177
|
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/* TableFilter.module.css */
|
|
2
|
+
.collapsibleMenu {
|
|
3
|
+
max-height: 0;
|
|
4
|
+
overflow: hidden;
|
|
5
|
+
transition: max-height 0.3s ease-out;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
.collapsibleMenu li {
|
|
9
|
+
transition: opacity 0.3s ease-out;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.visibleMenu {
|
|
13
|
+
max-height: 500px; /* Adjust this value based on the expected height of your child menu */
|
|
14
|
+
opacity: 1;
|
|
15
|
+
}
|
package/package.json
CHANGED
|
@@ -10,10 +10,10 @@
|
|
|
10
10
|
"akar-icons": "^1.9.31",
|
|
11
11
|
"array-move": "^4.0.0",
|
|
12
12
|
"awesome-debounce-promise": "^2.1.0",
|
|
13
|
-
"axios": "^1.
|
|
13
|
+
"axios": "^1.7.2",
|
|
14
14
|
"dayjs": "^1.11.11",
|
|
15
15
|
"file-saver": "^2.0.5",
|
|
16
|
-
"framer-motion": "^11.
|
|
16
|
+
"framer-motion": "^11.2.6",
|
|
17
17
|
"html-react-parser": "^5.1.10",
|
|
18
18
|
"lodash": "^4.17.21",
|
|
19
19
|
"lodash.debounce": "^4.0.8",
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"reactjs-popup": "^2.0.6",
|
|
45
45
|
"truncate": "^3.0.0",
|
|
46
46
|
"uuid": "^9.0.1",
|
|
47
|
-
"validator": "^13.
|
|
47
|
+
"validator": "^13.12.0",
|
|
48
48
|
"yarn": "^1.22.22"
|
|
49
49
|
},
|
|
50
50
|
"devDependecies": {
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"react-dom": "^17.0.1"
|
|
57
57
|
},
|
|
58
58
|
"name": "@visns-studio/visns-components",
|
|
59
|
-
"version": "
|
|
59
|
+
"version": "4.0.1",
|
|
60
60
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
61
61
|
"main": "index.js",
|
|
62
62
|
"scripts": {
|