qaema-ui 0.0.71 → 0.0.73
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/_virtual/index.js +5 -5
- package/dist/_virtual/index2.js +4 -4
- package/dist/_virtual/index3.js +5 -5
- package/dist/_virtual/index4.js +4 -4
- package/dist/components/DropDownWithTable/DropDownWithTable.js +86 -84
- package/dist/components/DropDownWithTable/DropDownWithTable.types.d.ts +1 -0
- package/dist/components/DropDownWithTable/Table/Table.d.ts +1 -1
- package/dist/components/DropDownWithTable/Table/Table.js +103 -94
- package/dist/components/DropDownWithTable/Table/Table.types.d.ts +1 -0
- package/dist/components/PriceCard.js +1 -1
- package/dist/components/StepperProcess.d.ts +78 -0
- package/dist/node_modules/@floating-ui/core/dist/floating-ui.core.js +377 -0
- package/dist/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +400 -0
- package/dist/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +136 -0
- package/dist/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +127 -0
- package/dist/node_modules/react-bootstrap/esm/Alert.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/AlertHeading.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/AlertLink.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Button.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/CloseButton.js +2 -2
- package/dist/node_modules/react-bootstrap/esm/Col.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Collapse.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Dropdown.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownDivider.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownHeader.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownItem.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownItemText.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownMenu.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/DropdownToggle.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Fade.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Feedback.js +2 -2
- package/dist/node_modules/react-bootstrap/esm/FloatingLabel.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Form.js +2 -2
- package/dist/node_modules/react-bootstrap/esm/FormCheck.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormCheckInput.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormCheckLabel.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormControl.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormFloating.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormLabel.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormRange.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormSelect.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/FormText.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Image.js +2 -2
- package/dist/node_modules/react-bootstrap/esm/Nav.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/NavItem.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/NavLink.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Navbar.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/NavbarBrand.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/NavbarText.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/NavbarToggle.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Offcanvas.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/OffcanvasBody.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/OffcanvasHeader.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/OffcanvasTitle.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/OffcanvasToggling.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/Toast.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/ToastBody.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/ToastHeader.js +1 -1
- package/dist/node_modules/react-bootstrap/esm/divWithClassName.js +1 -1
- package/dist/node_modules/react-helmet-async/lib/index.esm.js +2 -2
- package/dist/node_modules/react-smooth/es6/Animate.js +1 -1
- package/dist/node_modules/react-tooltip/dist/react-tooltip.min.js +548 -0
- package/dist/node_modules/react-transition-group/esm/Transition.js +1 -1
- package/dist/node_modules/react-transition-group/esm/utils/PropTypes.js +1 -1
- package/package.json +3 -2
package/dist/_virtual/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { getDefaultExportFromCjs as
|
|
2
|
-
import { __require as
|
|
3
|
-
var a =
|
|
4
|
-
const
|
|
1
|
+
import { getDefaultExportFromCjs as s } from "./_commonjsHelpers.js";
|
|
2
|
+
import { __require as r } from "../node_modules/classnames/index.js";
|
|
3
|
+
var a = r();
|
|
4
|
+
const t = /* @__PURE__ */ s(a);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
t as default
|
|
7
7
|
};
|
package/dist/_virtual/index2.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
|
|
2
|
-
import { __require as o } from "../node_modules/
|
|
3
|
-
var
|
|
4
|
-
const
|
|
2
|
+
import { __require as o } from "../node_modules/prop-types/index.js";
|
|
3
|
+
var p = /* @__PURE__ */ o();
|
|
4
|
+
const s = /* @__PURE__ */ r(p);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
s as default
|
|
7
7
|
};
|
package/dist/_virtual/index3.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { getDefaultExportFromCjs as
|
|
2
|
-
import { __require as
|
|
3
|
-
var a =
|
|
4
|
-
const
|
|
1
|
+
import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
|
|
2
|
+
import { __require as t } from "../node_modules/react-helmet-async/node_modules/react-fast-compare/index.js";
|
|
3
|
+
var a = t();
|
|
4
|
+
const m = /* @__PURE__ */ r(a);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
m as default
|
|
7
7
|
};
|
package/dist/_virtual/index4.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
|
|
2
|
-
import { __require as o } from "../node_modules/
|
|
3
|
-
var
|
|
4
|
-
const
|
|
2
|
+
import { __require as o } from "../node_modules/shallowequal/index.js";
|
|
3
|
+
var a = o();
|
|
4
|
+
const t = /* @__PURE__ */ r(a);
|
|
5
5
|
export {
|
|
6
|
-
|
|
6
|
+
t as default
|
|
7
7
|
};
|
|
@@ -1,126 +1,127 @@
|
|
|
1
1
|
import { j as t } from "../../_virtual/jsx-runtime.js";
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { createPortal as
|
|
4
|
-
import { FaTimes as
|
|
5
|
-
import { useTheme as
|
|
6
|
-
import { HelperTextWrapper as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import { useQaemaCoreTranslation as
|
|
12
|
-
import { StyledDropDownContainer as
|
|
13
|
-
import
|
|
14
|
-
const
|
|
2
|
+
import { useRef as y, useState as v, useCallback as le, useEffect as T } from "react";
|
|
3
|
+
import { createPortal as ie } from "react-dom";
|
|
4
|
+
import { FaTimes as P, FaAngleDown as se } from "../../node_modules/react-icons/fa/index.js";
|
|
5
|
+
import { useTheme as ae } from "styled-components";
|
|
6
|
+
import { HelperTextWrapper as ce } from "../PhoneInputField.js";
|
|
7
|
+
import de from "../SearchBar.js";
|
|
8
|
+
import ue from "../Spinner.js";
|
|
9
|
+
import fe from "../Typography.js";
|
|
10
|
+
import me from "../../hooks/useZIndex.js";
|
|
11
|
+
import { useQaemaCoreTranslation as he } from "../../i18n/i18n.js";
|
|
12
|
+
import { StyledDropDownContainer as pe, StyledlabelContainer as xe, StyledDropDown as Se, StyledDropDownToggle as je, StyledDropDownTitle as we, IconsContainer as ge, StyledDropDownMenu as ye, SearchContainer as ve, StyledOptionsContainer as Ce, SpinnerRow as be, SelectedTagsContainer as De, SelectedTag as Te } from "../../styles/Dropdown.styles.js";
|
|
13
|
+
import Ie from "./Table/Table.js";
|
|
14
|
+
const Be = (d) => {
|
|
15
15
|
const {
|
|
16
|
-
label:
|
|
17
|
-
options:
|
|
18
|
-
placeholder:
|
|
19
|
-
optional:
|
|
16
|
+
label: I,
|
|
17
|
+
options: W,
|
|
18
|
+
placeholder: z = "Select Something",
|
|
19
|
+
optional: F = !1,
|
|
20
20
|
error: s = "",
|
|
21
21
|
disabled: f = !1,
|
|
22
22
|
selectIdentifier: j,
|
|
23
23
|
keyIdentifier: r = "id",
|
|
24
24
|
selectCallBack: w,
|
|
25
|
-
showLeadIcon:
|
|
26
|
-
icon:
|
|
27
|
-
allowSearch:
|
|
28
|
-
searchHandler:
|
|
29
|
-
searchPlaceholder:
|
|
25
|
+
showLeadIcon: H,
|
|
26
|
+
icon: M,
|
|
27
|
+
allowSearch: N,
|
|
28
|
+
searchHandler: B,
|
|
29
|
+
searchPlaceholder: A,
|
|
30
30
|
onToggle: i,
|
|
31
31
|
multiSelect: m = !1,
|
|
32
|
-
isLoading:
|
|
32
|
+
isLoading: V = !1,
|
|
33
33
|
currentSelectedOptions: p = [],
|
|
34
|
-
isInteractive:
|
|
34
|
+
isInteractive: L = !1,
|
|
35
35
|
//Table related props
|
|
36
|
-
columns:
|
|
37
|
-
isTableHeadVisible:
|
|
38
|
-
getDisplayValue:
|
|
39
|
-
isRowDisabled:
|
|
40
|
-
rowClassName:
|
|
41
|
-
endIcon: E
|
|
42
|
-
|
|
36
|
+
columns: Q,
|
|
37
|
+
isTableHeadVisible: X = !1,
|
|
38
|
+
getDisplayValue: g,
|
|
39
|
+
isRowDisabled: Y,
|
|
40
|
+
rowClassName: Z,
|
|
41
|
+
endIcon: E,
|
|
42
|
+
optionTooltipLabel: C
|
|
43
|
+
} = d, x = ae(), { t: $ } = he(), b = y(null), a = y(null), q = y(null), G = y(d.currentSelectedOptions !== void 0), [u, D] = v(!1), [J, K] = v(0), [O, U] = v({ top: 0, left: 0 }), [l, S] = v(p), k = M ?? /* @__PURE__ */ t.jsx(t.Fragment, {}), _ = me("dropdown"), h = le(() => {
|
|
43
44
|
if (a != null && a.current) {
|
|
44
45
|
const e = a.current.getBoundingClientRect();
|
|
45
|
-
|
|
46
|
+
K(a.current.offsetWidth / 16), U({
|
|
46
47
|
top: e.bottom + window.scrollY,
|
|
47
48
|
left: e.left + window.scrollX
|
|
48
49
|
});
|
|
49
50
|
}
|
|
50
51
|
}, []);
|
|
51
|
-
|
|
52
|
+
T(() => (u && (h(), window.addEventListener("resize", h), window.addEventListener("scroll", h, !0)), () => {
|
|
52
53
|
window.removeEventListener("resize", h), window.removeEventListener("scroll", h, !0);
|
|
53
|
-
}), [u, h]),
|
|
54
|
-
if (!
|
|
54
|
+
}), [u, h]), T(() => {
|
|
55
|
+
if (!G.current) return;
|
|
55
56
|
(p.length !== l.length || p.some((n, o) => {
|
|
56
57
|
var c;
|
|
57
58
|
return n[r] !== ((c = l[o]) == null ? void 0 : c[r]);
|
|
58
59
|
})) && S(p);
|
|
59
60
|
}, [p]);
|
|
60
|
-
const
|
|
61
|
+
const ee = (e, n, o, c = "default") => o ? x.colors.grey.n400 : e ? x.colors.state.error.n450 : n ? x.colors.primary.dark.n600 : c === "light-primary" ? x.colors.primary.purple.n450 : x.colors.grey.n300, R = (e) => l.some((n) => typeof n == "object" && typeof e == "object" ? n[r] === e[r] : n.value === e.value), te = (e) => {
|
|
61
62
|
if (m) {
|
|
62
|
-
const n =
|
|
63
|
+
const n = R(e);
|
|
63
64
|
let o;
|
|
64
65
|
n ? o = l.filter((c) => typeof c == "object" && typeof e == "object" ? c[r] !== e[r] : c.value !== e.value) : o = [...l, e], S(o), w(o);
|
|
65
66
|
} else
|
|
66
|
-
S([e]), w(e),
|
|
67
|
-
},
|
|
67
|
+
S([e]), w(e), D(!1), i == null || i(!1);
|
|
68
|
+
}, ne = (e) => {
|
|
68
69
|
const n = l.filter((o) => typeof o == "object" && typeof e == "object" ? o[r] !== e[r] : o.value !== e.value);
|
|
69
70
|
S(n), w(n);
|
|
70
|
-
},
|
|
71
|
-
if (e.length === 0) return
|
|
71
|
+
}, re = (e) => {
|
|
72
|
+
if (e.length === 0) return z;
|
|
72
73
|
if (!m) {
|
|
73
74
|
const n = e[0];
|
|
74
|
-
if (
|
|
75
|
-
return
|
|
75
|
+
if (g)
|
|
76
|
+
return g(n);
|
|
76
77
|
if (j)
|
|
77
78
|
return String(n == null ? void 0 : n[j]);
|
|
78
79
|
if (r)
|
|
79
80
|
return String(n == null ? void 0 : n[r]);
|
|
80
81
|
}
|
|
81
|
-
return `${e.length} ${
|
|
82
|
+
return `${e.length} ${$("SELECTED")}`;
|
|
82
83
|
};
|
|
83
|
-
|
|
84
|
+
T(() => {
|
|
84
85
|
const e = (n) => {
|
|
85
|
-
|
|
86
|
+
b.current && a.current && !b.current.contains(n.target) && !a.current.contains(n.target) && (D(!1), i == null || i(!1));
|
|
86
87
|
};
|
|
87
88
|
return u && document.addEventListener("mousedown", e), () => {
|
|
88
89
|
document.removeEventListener("mousedown", e);
|
|
89
90
|
};
|
|
90
91
|
}, [u, i]);
|
|
91
|
-
const
|
|
92
|
-
return /* @__PURE__ */ t.jsxs(
|
|
93
|
-
|
|
94
|
-
/* @__PURE__ */ t.jsx("label", { children:
|
|
95
|
-
|
|
92
|
+
const oe = () => L || (s == null ? void 0 : s.length) === 0 ? null : /* @__PURE__ */ t.jsx(ce, { error: s, children: s });
|
|
93
|
+
return /* @__PURE__ */ t.jsxs(pe, { children: [
|
|
94
|
+
I && /* @__PURE__ */ t.jsxs(xe, { children: [
|
|
95
|
+
/* @__PURE__ */ t.jsx("label", { children: I }),
|
|
96
|
+
F && /* @__PURE__ */ t.jsx("span", { children: $("OPTIONAL") })
|
|
96
97
|
] }),
|
|
97
98
|
/* @__PURE__ */ t.jsxs(
|
|
98
|
-
|
|
99
|
+
Se,
|
|
99
100
|
{
|
|
100
101
|
show: u,
|
|
101
102
|
onToggle: () => {
|
|
102
|
-
i == null || i(!u),
|
|
103
|
+
i == null || i(!u), D((e) => !e);
|
|
103
104
|
},
|
|
104
105
|
placement: "bottom-start",
|
|
105
106
|
autoClose: m ? "outside" : !0,
|
|
106
107
|
children: [
|
|
107
|
-
/* @__PURE__ */ t.jsx(
|
|
108
|
+
/* @__PURE__ */ t.jsx(je, { disabled: f, ref: a, $valid: !s, $variant: d.variant || "default", children: /* @__PURE__ */ t.jsx(we, { $valid: !s, $isInteractive: L, $hasDyncWidth: !f, children: /* @__PURE__ */ t.jsxs("div", { className: "title-container", children: [
|
|
108
109
|
/* @__PURE__ */ t.jsxs("div", { className: "heading-container", children: [
|
|
109
|
-
|
|
110
|
+
H && typeof k == "function" && /* @__PURE__ */ t.jsx(k, {}),
|
|
110
111
|
/* @__PURE__ */ t.jsx(
|
|
111
|
-
|
|
112
|
+
fe,
|
|
112
113
|
{
|
|
113
114
|
component: "span",
|
|
114
115
|
variant: "mdText",
|
|
115
|
-
color:
|
|
116
|
-
children:
|
|
116
|
+
color: ee(s, l.length > 0, f, d.variant || "default"),
|
|
117
|
+
children: re(l)
|
|
117
118
|
}
|
|
118
119
|
)
|
|
119
120
|
] }),
|
|
120
|
-
(E || !f) && /* @__PURE__ */ t.jsxs(
|
|
121
|
+
(E || !f) && /* @__PURE__ */ t.jsxs(ge, { children: [
|
|
121
122
|
E,
|
|
122
123
|
!m && l.length > 0 && !f && /* @__PURE__ */ t.jsx(
|
|
123
|
-
|
|
124
|
+
P,
|
|
124
125
|
{
|
|
125
126
|
style: { cursor: "pointer", marginLeft: "0.5rem" },
|
|
126
127
|
onClick: (e) => {
|
|
@@ -128,46 +129,47 @@ const Ne = (d) => {
|
|
|
128
129
|
}
|
|
129
130
|
}
|
|
130
131
|
),
|
|
131
|
-
!f && /* @__PURE__ */ t.jsx(
|
|
132
|
+
!f && /* @__PURE__ */ t.jsx(se, {})
|
|
132
133
|
] })
|
|
133
134
|
] }) }) }),
|
|
134
|
-
u &&
|
|
135
|
+
u && ie(
|
|
135
136
|
/* @__PURE__ */ t.jsxs(
|
|
136
137
|
ye,
|
|
137
138
|
{
|
|
138
|
-
ref:
|
|
139
|
-
$menuWidth:
|
|
140
|
-
$zIndex:
|
|
139
|
+
ref: b,
|
|
140
|
+
$menuWidth: J,
|
|
141
|
+
$zIndex: _,
|
|
141
142
|
style: {
|
|
142
143
|
position: "fixed",
|
|
143
|
-
top: `${
|
|
144
|
-
left: `${
|
|
144
|
+
top: `${O.top}px`,
|
|
145
|
+
left: `${O.left}px`
|
|
145
146
|
},
|
|
146
147
|
children: [
|
|
147
|
-
|
|
148
|
+
N && /* @__PURE__ */ t.jsx(ve, { children: /* @__PURE__ */ t.jsx(de, { placeholder: A, onSearch: B }) }),
|
|
148
149
|
/* @__PURE__ */ t.jsxs(
|
|
149
|
-
|
|
150
|
+
Ce,
|
|
150
151
|
{
|
|
151
|
-
ref:
|
|
152
|
+
ref: q,
|
|
152
153
|
onScroll: (e) => {
|
|
153
154
|
var n;
|
|
154
155
|
(n = d.onScroll) == null || n.call(d, e);
|
|
155
156
|
},
|
|
156
157
|
children: [
|
|
157
158
|
/* @__PURE__ */ t.jsx(
|
|
158
|
-
|
|
159
|
+
Ie,
|
|
159
160
|
{
|
|
160
161
|
keyField: r,
|
|
161
|
-
data:
|
|
162
|
-
columns:
|
|
163
|
-
onRowClick: (e) =>
|
|
164
|
-
isRowSelected: (e) =>
|
|
165
|
-
isTableHeadVisible:
|
|
166
|
-
isRowDisabled:
|
|
167
|
-
rowClassName:
|
|
162
|
+
data: W,
|
|
163
|
+
columns: Q,
|
|
164
|
+
onRowClick: (e) => te(e),
|
|
165
|
+
isRowSelected: (e) => R(e),
|
|
166
|
+
isTableHeadVisible: X,
|
|
167
|
+
isRowDisabled: Y,
|
|
168
|
+
rowClassName: Z,
|
|
169
|
+
getRowTooltip: C ? (e) => e[C] != null ? String(e[C]) : void 0 : void 0
|
|
168
170
|
}
|
|
169
171
|
),
|
|
170
|
-
|
|
172
|
+
V && /* @__PURE__ */ t.jsx(be, { children: /* @__PURE__ */ t.jsx(ue, {}) })
|
|
171
173
|
]
|
|
172
174
|
}
|
|
173
175
|
)
|
|
@@ -179,13 +181,13 @@ const Ne = (d) => {
|
|
|
179
181
|
]
|
|
180
182
|
}
|
|
181
183
|
),
|
|
182
|
-
m && l.length > 0 && /* @__PURE__ */ t.jsx(
|
|
183
|
-
|
|
184
|
-
/* @__PURE__ */ t.jsx(
|
|
184
|
+
m && l.length > 0 && /* @__PURE__ */ t.jsx(De, { children: l.map((e) => /* @__PURE__ */ t.jsxs(Te, { children: [
|
|
185
|
+
g ? g(e) : String(j ? e[j] : e[r]),
|
|
186
|
+
/* @__PURE__ */ t.jsx(P, { onClick: () => ne(e) })
|
|
185
187
|
] }, String(e[r]))) }),
|
|
186
|
-
|
|
188
|
+
oe()
|
|
187
189
|
] });
|
|
188
190
|
};
|
|
189
191
|
export {
|
|
190
|
-
|
|
192
|
+
Be as default
|
|
191
193
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { TableProps } from './Table.types';
|
|
2
|
-
declare function Table<T extends Record<string, unknown>>({ columns, data, keyField, selectable, onRowSelect, rowActions, stickyHeader, loading, emptyStateMessage, pagination, onRowClick, rowClassName, isRowDisabled, breakpoint, alignHeader, isTableHeadVisible, isRowSelected: externalIsRowSelected, }: Readonly<TableProps<T>>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
declare function Table<T extends Record<string, unknown>>({ columns, data, keyField, selectable, onRowSelect, rowActions, stickyHeader, loading, emptyStateMessage, pagination, onRowClick, rowClassName, isRowDisabled, breakpoint, alignHeader, isTableHeadVisible, isRowSelected: externalIsRowSelected, getRowTooltip, }: Readonly<TableProps<T>>): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default Table;
|
|
@@ -1,100 +1,103 @@
|
|
|
1
1
|
import { j as t } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
-
import { useState as
|
|
3
|
-
import { useTranslation as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import z from "./components/
|
|
9
|
-
import
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
2
|
+
import { useState as b, useId as X, useEffect as O, useMemo as Y } from "react";
|
|
3
|
+
import { useTranslation as H } from "react-i18next";
|
|
4
|
+
import { Tooltip as D } from "../../../node_modules/react-tooltip/dist/react-tooltip.min.js";
|
|
5
|
+
import k from "../../Spinner.js";
|
|
6
|
+
import F from "../../Pagination.js";
|
|
7
|
+
import R from "../../Typography.js";
|
|
8
|
+
import z, { CheckboxCell as w } from "./components/CellComponents.js";
|
|
9
|
+
import W from "./components/TableHead.js";
|
|
10
|
+
import { TableContainer as ee, LoadingOverlay as te, TablesWrapper as ne, DataScrollBox as se, StyledTable as re, TableBody as y, EmptyState as le, TableRow as N, TableCellContainer as C, ActionsTable as ie, TableFooter as ce } from "./Table.styles.js";
|
|
11
|
+
function ge({
|
|
12
|
+
columns: S,
|
|
13
|
+
data: n,
|
|
14
|
+
keyField: i,
|
|
15
|
+
selectable: p = !1,
|
|
16
|
+
onRowSelect: x,
|
|
17
|
+
rowActions: u,
|
|
18
|
+
stickyHeader: T = !1,
|
|
18
19
|
loading: f = !1,
|
|
19
|
-
emptyStateMessage:
|
|
20
|
-
pagination:
|
|
21
|
-
onRowClick:
|
|
22
|
-
rowClassName:
|
|
23
|
-
isRowDisabled:
|
|
24
|
-
breakpoint:
|
|
25
|
-
alignHeader:
|
|
20
|
+
emptyStateMessage: K,
|
|
21
|
+
pagination: l,
|
|
22
|
+
onRowClick: j,
|
|
23
|
+
rowClassName: a,
|
|
24
|
+
isRowDisabled: o,
|
|
25
|
+
breakpoint: _ = "md",
|
|
26
|
+
alignHeader: B = "start",
|
|
26
27
|
// Dropdown related props
|
|
27
|
-
isTableHeadVisible:
|
|
28
|
-
isRowSelected:
|
|
28
|
+
isTableHeadVisible: M = !1,
|
|
29
|
+
isRowSelected: A,
|
|
30
|
+
getRowTooltip: m
|
|
29
31
|
}) {
|
|
30
|
-
const [h,
|
|
31
|
-
|
|
32
|
+
const [h, $] = b([]), [E, g] = b(_), [V, I] = b(null), { t: Z } = H(), L = X();
|
|
33
|
+
O(() => {
|
|
32
34
|
const e = () => {
|
|
33
|
-
|
|
35
|
+
I(null);
|
|
34
36
|
};
|
|
35
37
|
return document.addEventListener("click", e), () => {
|
|
36
38
|
document.removeEventListener("click", e);
|
|
37
39
|
};
|
|
38
|
-
}, []),
|
|
40
|
+
}, []), O(() => {
|
|
39
41
|
const e = () => {
|
|
40
|
-
const
|
|
41
|
-
|
|
42
|
+
const s = window.innerWidth;
|
|
43
|
+
s < 576 ? g("sm") : s < 992 ? g("md") : g("lg");
|
|
42
44
|
};
|
|
43
45
|
return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
|
|
44
46
|
}, []);
|
|
45
|
-
const
|
|
46
|
-
h.length ===
|
|
47
|
-
}, q = (e) => {
|
|
48
|
-
const i = h.filter((r) => e[l] === r[l]);
|
|
49
|
-
return i && i.length > 0;
|
|
47
|
+
const v = Y(() => S.filter((e) => typeof e.hidden == "function" ? !e.hidden(E) : !e.hidden), [S, E]), q = () => {
|
|
48
|
+
h.length === n.length ? $([]) : $([...n]), x && x(h.length === n.length ? [] : [...n]);
|
|
50
49
|
}, G = (e) => {
|
|
51
|
-
const
|
|
50
|
+
const s = h.filter((r) => e[i] === r[i]);
|
|
51
|
+
return s && s.length > 0;
|
|
52
|
+
}, J = (e) => {
|
|
53
|
+
const s = h.some((d) => d[i] === e[i]);
|
|
52
54
|
let r;
|
|
53
|
-
|
|
55
|
+
s ? r = h.filter((d) => d[i] !== e[i]) : r = [...h, e], $(r), x && x(r);
|
|
54
56
|
};
|
|
55
|
-
return /* @__PURE__ */ t.jsxs(
|
|
56
|
-
f && /* @__PURE__ */ t.jsx(
|
|
57
|
-
/* @__PURE__ */ t.jsxs(
|
|
58
|
-
/* @__PURE__ */ t.jsx(
|
|
59
|
-
|
|
60
|
-
|
|
57
|
+
return /* @__PURE__ */ t.jsxs(ee, { children: [
|
|
58
|
+
f && /* @__PURE__ */ t.jsx(te, { children: /* @__PURE__ */ t.jsx(k, { size: "3rem" }) }),
|
|
59
|
+
/* @__PURE__ */ t.jsxs(ne, { children: [
|
|
60
|
+
/* @__PURE__ */ t.jsx(se, { children: /* @__PURE__ */ t.jsxs(re, { children: [
|
|
61
|
+
M && /* @__PURE__ */ t.jsx(
|
|
62
|
+
W,
|
|
61
63
|
{
|
|
62
|
-
data:
|
|
63
|
-
handleSelectAll:
|
|
64
|
+
data: n,
|
|
65
|
+
handleSelectAll: q,
|
|
64
66
|
selectedRows: h,
|
|
65
|
-
visibleColumns:
|
|
66
|
-
alignHeader:
|
|
67
|
+
visibleColumns: v,
|
|
68
|
+
alignHeader: B,
|
|
67
69
|
rowActions: void 0,
|
|
68
|
-
stickyHeader:
|
|
69
|
-
selectable:
|
|
70
|
+
stickyHeader: T,
|
|
71
|
+
selectable: p,
|
|
70
72
|
loading: f
|
|
71
73
|
}
|
|
72
74
|
),
|
|
73
|
-
/* @__PURE__ */ t.jsx(
|
|
74
|
-
const r = (
|
|
75
|
+
/* @__PURE__ */ t.jsx(y, { children: n.length === 0 ? /* @__PURE__ */ t.jsx("tr", { children: /* @__PURE__ */ t.jsx("td", { colSpan: (p ? 1 : 0) + v.length, children: /* @__PURE__ */ t.jsx(le, { children: /* @__PURE__ */ t.jsx(R, { variant: "mdText", children: K ?? Z("NO_DATA_AVAILABLE") }) }) }) }) : n == null ? void 0 : n.map((e, s) => {
|
|
76
|
+
const r = (o == null ? void 0 : o(e)) ?? !1, d = A ? A(e) : h.some((c) => c[i] === e[i]), P = e[i], Q = (a == null ? void 0 : a(e, s)) ?? "", U = (m == null ? void 0 : m(e)) ? `${L}-${String(P)}` : void 0;
|
|
75
77
|
return /* @__PURE__ */ t.jsxs(
|
|
76
|
-
|
|
78
|
+
N,
|
|
77
79
|
{
|
|
78
|
-
$selected:
|
|
80
|
+
$selected: d,
|
|
79
81
|
$disabled: r,
|
|
80
|
-
$clickable: !!
|
|
81
|
-
onClick: () => !r && (
|
|
82
|
-
className:
|
|
82
|
+
$clickable: !!j && !r,
|
|
83
|
+
onClick: () => !r && (j == null ? void 0 : j(e)),
|
|
84
|
+
className: Q,
|
|
85
|
+
"data-tooltip-id": U,
|
|
83
86
|
children: [
|
|
84
|
-
|
|
85
|
-
|
|
87
|
+
p && /* @__PURE__ */ t.jsx(C, { $align: "center", $isFirstColumn: !0, children: /* @__PURE__ */ t.jsx(
|
|
88
|
+
w,
|
|
86
89
|
{
|
|
87
90
|
checkBoxOptions: {
|
|
88
|
-
checked:
|
|
91
|
+
checked: G(e),
|
|
89
92
|
$variant: "primary",
|
|
90
93
|
$disabled: r,
|
|
91
94
|
$size: "sm",
|
|
92
|
-
onChange: () => !r &&
|
|
95
|
+
onChange: () => !r && J(e)
|
|
93
96
|
}
|
|
94
97
|
}
|
|
95
98
|
) }),
|
|
96
|
-
|
|
97
|
-
|
|
99
|
+
v.map((c) => /* @__PURE__ */ t.jsx(C, { $align: c.align, children: /* @__PURE__ */ t.jsx(
|
|
100
|
+
z,
|
|
98
101
|
{
|
|
99
102
|
column: c,
|
|
100
103
|
row: e,
|
|
@@ -105,66 +108,72 @@ function xe({
|
|
|
105
108
|
minWidth: c.minWidth ?? "",
|
|
106
109
|
maxWidth: c.maxWidth ?? ""
|
|
107
110
|
}
|
|
108
|
-
) }, `${
|
|
111
|
+
) }, `${P}-${c.id}`))
|
|
109
112
|
]
|
|
110
113
|
},
|
|
111
|
-
|
|
114
|
+
P
|
|
112
115
|
);
|
|
113
116
|
}) })
|
|
114
117
|
] }) }),
|
|
115
|
-
|
|
118
|
+
u && u.length > 0 && /* @__PURE__ */ t.jsxs(ie, { children: [
|
|
116
119
|
/* @__PURE__ */ t.jsx(
|
|
117
|
-
|
|
120
|
+
W,
|
|
118
121
|
{
|
|
119
|
-
data:
|
|
122
|
+
data: n,
|
|
120
123
|
handleSelectAll: () => {
|
|
121
124
|
},
|
|
122
125
|
selectedRows: h,
|
|
123
126
|
visibleColumns: [],
|
|
124
|
-
alignHeader:
|
|
125
|
-
rowActions:
|
|
126
|
-
stickyHeader:
|
|
127
|
+
alignHeader: B,
|
|
128
|
+
rowActions: u,
|
|
129
|
+
stickyHeader: T,
|
|
127
130
|
selectable: !1,
|
|
128
131
|
loading: f
|
|
129
132
|
}
|
|
130
133
|
),
|
|
131
|
-
/* @__PURE__ */ t.jsx(
|
|
132
|
-
const
|
|
133
|
-
return /* @__PURE__ */ t.jsx(
|
|
134
|
-
|
|
134
|
+
/* @__PURE__ */ t.jsx(y, { children: n.length === 0 ? /* @__PURE__ */ t.jsx("tr", { children: /* @__PURE__ */ t.jsx("td", { children: /* @__PURE__ */ t.jsx("div", { style: { height: "3.5rem" } }) }) }) : n == null ? void 0 : n.map((e) => {
|
|
135
|
+
const s = (o == null ? void 0 : o(e)) ?? !1;
|
|
136
|
+
return /* @__PURE__ */ t.jsx(N, { $disabled: s, children: /* @__PURE__ */ t.jsx(C, { $align: "center", $isActionCell: !0, children: /* @__PURE__ */ t.jsx(
|
|
137
|
+
z,
|
|
135
138
|
{
|
|
136
139
|
row: e,
|
|
137
140
|
type: "icon",
|
|
138
141
|
iconOptions: {
|
|
139
|
-
keyField:
|
|
140
|
-
rowActions:
|
|
141
|
-
activeDropdown:
|
|
142
|
-
setActiveDropdown:
|
|
142
|
+
keyField: i,
|
|
143
|
+
rowActions: u,
|
|
144
|
+
activeDropdown: V,
|
|
145
|
+
setActiveDropdown: I
|
|
143
146
|
}
|
|
144
147
|
}
|
|
145
|
-
) }) }, `action-${e[
|
|
148
|
+
) }) }, `action-${e[i]}`);
|
|
146
149
|
}) })
|
|
147
150
|
] })
|
|
148
151
|
] }),
|
|
149
|
-
|
|
150
|
-
|
|
152
|
+
m && n.map((e) => {
|
|
153
|
+
const s = m(e);
|
|
154
|
+
if (!s) return null;
|
|
155
|
+
const r = e[i], d = `${L}-${String(r)}`;
|
|
156
|
+
return /* @__PURE__ */ t.jsx(D, { id: d, content: s }, d);
|
|
157
|
+
}),
|
|
158
|
+
l && l.enabled && /* @__PURE__ */ t.jsx(ce, { children: /* @__PURE__ */ t.jsx(
|
|
159
|
+
F,
|
|
151
160
|
{
|
|
152
|
-
currentPage:
|
|
153
|
-
totalPages:
|
|
154
|
-
onChange:
|
|
161
|
+
currentPage: l.currentPage,
|
|
162
|
+
totalPages: l.totalPages,
|
|
163
|
+
onChange: l.onPageChange,
|
|
155
164
|
disabled: f,
|
|
156
|
-
hidePrevButton:
|
|
157
|
-
hideNextButton:
|
|
158
|
-
siblingCount:
|
|
159
|
-
boundaryCount:
|
|
160
|
-
itemsPerPage:
|
|
161
|
-
totalItems:
|
|
162
|
-
itemsPerPageOptions:
|
|
163
|
-
onItemsPerPageChange:
|
|
165
|
+
hidePrevButton: l.hidePrevButton,
|
|
166
|
+
hideNextButton: l.hideNextButton,
|
|
167
|
+
siblingCount: l.siblingCount,
|
|
168
|
+
boundaryCount: l.boundaryCount,
|
|
169
|
+
itemsPerPage: l.pageSize,
|
|
170
|
+
totalItems: l.totalItems,
|
|
171
|
+
itemsPerPageOptions: l.itemsPerPageOptions,
|
|
172
|
+
onItemsPerPageChange: l.onItemsPerPageChange
|
|
164
173
|
}
|
|
165
174
|
) })
|
|
166
175
|
] });
|
|
167
176
|
}
|
|
168
177
|
export {
|
|
169
|
-
|
|
178
|
+
ge as default
|
|
170
179
|
};
|
|
@@ -56,6 +56,7 @@ export type TableProps<T> = {
|
|
|
56
56
|
alignHeader?: ColumnAlignment;
|
|
57
57
|
isTableHeadVisible?: boolean;
|
|
58
58
|
isRowSelected?: (row: T) => boolean;
|
|
59
|
+
getRowTooltip?: (row: T) => string | undefined;
|
|
59
60
|
};
|
|
60
61
|
export type CurrencyCode = 'SAR';
|
|
61
62
|
export type CellType = 'user' | 'product' | 'flag' | 'text' | 'amount' | 'badge' | 'progress' | 'icon' | 'header' | 'checkbox' | 'radioButton' | 'custom' | 'transaction';
|
|
@@ -156,7 +156,7 @@ const N = {
|
|
|
156
156
|
letter-spacing: ${({ theme: e }) => e.typography.letterSpacings.balancedNarrow};
|
|
157
157
|
color: ${({ theme: e }) => e.colors.grey.n350};
|
|
158
158
|
`, oe = t(d)`
|
|
159
|
-
text-decoration: line-through;
|
|
159
|
+
text-decoration: line-through !important;
|
|
160
160
|
font-size: 1.5rem;
|
|
161
161
|
`, te = t.span`
|
|
162
162
|
font-family: ${({ theme: e }) => e.fonts.arabic};
|