react-table-edit 0.6.3 → 0.6.5
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/index.js +29 -21
- package/dist/index.mjs +29 -21
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1522,8 +1522,8 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
|
|
|
1522
1522
|
};
|
|
1523
1523
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react12.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "r-pager", children: [
|
|
1524
1524
|
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "r-pagercontainer", children: [
|
|
1525
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage
|
|
1526
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage
|
|
1525
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage <= 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronsLeft, { fontSize: 16 }) }),
|
|
1526
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage <= 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage - 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronLeft, { fontSize: 16 }) }),
|
|
1527
1527
|
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1528
1528
|
"button",
|
|
1529
1529
|
{
|
|
@@ -1549,8 +1549,8 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
|
|
|
1549
1549
|
children: "..."
|
|
1550
1550
|
}
|
|
1551
1551
|
),
|
|
1552
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage
|
|
1553
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage
|
|
1552
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage <= 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage + 1, old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronRight, { fontSize: 16 }) }),
|
|
1553
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { className: "r-button", type: "button", disabled: countPage <= 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1), old: currentPage }), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_becoxy_icons4.ChevronsRight, { fontSize: 16 }) }),
|
|
1554
1554
|
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "r-pagesize", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
1555
1555
|
import_react_select2.default,
|
|
1556
1556
|
{
|
|
@@ -1600,9 +1600,9 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
1600
1600
|
handleAdd,
|
|
1601
1601
|
isClearable,
|
|
1602
1602
|
component,
|
|
1603
|
-
isDisabled,
|
|
1604
1603
|
formatOptionLabel,
|
|
1605
1604
|
isMulti,
|
|
1605
|
+
isDisabled,
|
|
1606
1606
|
showFooter
|
|
1607
1607
|
} = props;
|
|
1608
1608
|
const selectTableRef = (0, import_react13.useRef)();
|
|
@@ -1658,7 +1658,7 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
1658
1658
|
}, [dropdownOpen]);
|
|
1659
1659
|
let timeOutBlur;
|
|
1660
1660
|
(0, import_react13.useEffect)(() => {
|
|
1661
|
-
if (inputRef) {
|
|
1661
|
+
if (inputRef && !isDisabled) {
|
|
1662
1662
|
inputRef.current.addEventListener("blur", function() {
|
|
1663
1663
|
timeOutBlur = setTimeout(() => {
|
|
1664
1664
|
if (!selectTableRef.current?.contains(document.activeElement)) {
|
|
@@ -1999,22 +1999,25 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
1999
1999
|
}) }) })
|
|
2000
2000
|
] }),
|
|
2001
2001
|
countDisplay === 0 && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "r-no-data", children: [
|
|
2002
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("g", { transform: "translate(0 1)", fill: "none",
|
|
2002
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [
|
|
2003
2003
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }),
|
|
2004
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("g", {
|
|
2004
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [
|
|
2005
2005
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }),
|
|
2006
2006
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", fill: "#fafafa" })
|
|
2007
2007
|
] })
|
|
2008
2008
|
] }) }),
|
|
2009
2009
|
t("No data available.")
|
|
2010
2010
|
] }),
|
|
2011
|
-
isLoading && /* @__PURE__ */ (0, import_jsx_runtime13.
|
|
2011
|
+
isLoading && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "r-no-data", children: [
|
|
2012
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.Spinner, { className: "me-1", children: " " }),
|
|
2013
|
+
t("Loading...")
|
|
2014
|
+
] })
|
|
2012
2015
|
] });
|
|
2013
2016
|
};
|
|
2014
2017
|
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2015
2018
|
"div",
|
|
2016
2019
|
{
|
|
2017
|
-
className: (0, import_classnames11.default)("react-select-table"),
|
|
2020
|
+
className: (0, import_classnames11.default)("react-select-table", { "is-invalid": invalid }),
|
|
2018
2021
|
ref,
|
|
2019
2022
|
id,
|
|
2020
2023
|
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { ref: selectTableRef, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
@@ -2028,15 +2031,17 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
2028
2031
|
import_reactstrap8.DropdownToggle,
|
|
2029
2032
|
{
|
|
2030
2033
|
onClick: () => {
|
|
2031
|
-
|
|
2032
|
-
|
|
2033
|
-
|
|
2034
|
+
if (!isDisabled) {
|
|
2035
|
+
inputRef?.current.focus();
|
|
2036
|
+
if (dropdownOpen) {
|
|
2037
|
+
clearTimeout(timeOutBlur);
|
|
2038
|
+
}
|
|
2039
|
+
handleOpenClose();
|
|
2034
2040
|
}
|
|
2035
|
-
handleOpenClose();
|
|
2036
2041
|
},
|
|
2037
2042
|
tabIndex: 0,
|
|
2038
2043
|
tag: "div",
|
|
2039
|
-
className: (0, import_classnames11.default)("select-table-control", { "r-select-is-
|
|
2044
|
+
className: (0, import_classnames11.default)("select-table-control", { "r-select-is-disabled": isDisabled }, { "r-select-is-open": dropdownOpen }, { "r-select-is-focus": isFocus }, { "r-select-is-invalid": invalid }),
|
|
2040
2045
|
children: [
|
|
2041
2046
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "select-table-container", children: [
|
|
2042
2047
|
isMulti ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: (0, import_classnames11.default)("select-value is-mutil", { "d-none": searchTerm }), children: value?.map((ele, index) => {
|
|
@@ -2051,13 +2056,14 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
2051
2056
|
value ? formatOptionLabel ? formatOptionLabel(value) : value[fieldLabel ?? "label"] : "",
|
|
2052
2057
|
" "
|
|
2053
2058
|
] }) }),
|
|
2054
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: (0, import_classnames11.default)("select-placeholder"
|
|
2059
|
+
!((isMulti ? value?.length > 0 : value) || isDisabled || searchTerm) && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: (0, import_classnames11.default)("select-placeholder"), children: placeholder }),
|
|
2055
2060
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "input-container", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2056
2061
|
"input",
|
|
2057
2062
|
{
|
|
2058
2063
|
style: { textAlign: textAlign ?? "left" },
|
|
2059
2064
|
ref: inputRef,
|
|
2060
2065
|
className: (0, import_classnames11.default)("select-input"),
|
|
2066
|
+
readOnly: isDisabled,
|
|
2061
2067
|
value: searchTerm,
|
|
2062
2068
|
onChange: (val) => {
|
|
2063
2069
|
if (!isMulti && loadOptions && val.target.value) {
|
|
@@ -2075,7 +2081,7 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
2075
2081
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.Spinner, { style: { width: 4, height: 4, marginRight: 3 }, type: "grow" }),
|
|
2076
2082
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_reactstrap8.Spinner, { style: { width: 4, height: 4, marginRight: 3 }, type: "grow" })
|
|
2077
2083
|
] }),
|
|
2078
|
-
|
|
2084
|
+
isClearable && value && !isDisabled && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2079
2085
|
"div",
|
|
2080
2086
|
{
|
|
2081
2087
|
className: (0, import_classnames11.default)("cursor-pointer"),
|
|
@@ -2086,7 +2092,7 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
2086
2092
|
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { height: "20", width: "20", fill: "#c4c4c4", color: "#c4c4c4", viewBox: "0 0 20 20", "aria-hidden": "true", focusable: "false", className: "css-tj5bde-Svg", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z" }) })
|
|
2087
2093
|
}
|
|
2088
2094
|
),
|
|
2089
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "select-table-indicator", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })
|
|
2095
|
+
!isDisabled && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "select-table-indicator", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })
|
|
2090
2096
|
]
|
|
2091
2097
|
}
|
|
2092
2098
|
),
|
|
@@ -2104,9 +2110,11 @@ var SelectTable = (0, import_react13.forwardRef)((props, ref) => {
|
|
|
2104
2110
|
"div",
|
|
2105
2111
|
{
|
|
2106
2112
|
onMouseDown: (e) => {
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2113
|
+
if (!isDisabled) {
|
|
2114
|
+
inputRef?.current.focus();
|
|
2115
|
+
clearTimeout(timeOutBlur);
|
|
2116
|
+
e.preventDefault();
|
|
2117
|
+
}
|
|
2110
2118
|
},
|
|
2111
2119
|
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "r-select-grid", children: [
|
|
2112
2120
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "r-select-gridtable", ref: selectMenuTableRef, style: { minWidth: selectTableRef?.current?.clientWidth, maxHeight: maxHeight ?? defaultMaxHeight }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RenderTable, {}) }),
|
package/dist/index.mjs
CHANGED
|
@@ -1479,8 +1479,8 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
|
|
|
1479
1479
|
};
|
|
1480
1480
|
return /* @__PURE__ */ jsx12(Fragment12, { children: /* @__PURE__ */ jsxs11("div", { className: "r-pager", children: [
|
|
1481
1481
|
/* @__PURE__ */ jsxs11("div", { className: "r-pagercontainer", children: [
|
|
1482
|
-
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage
|
|
1483
|
-
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage
|
|
1482
|
+
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage <= 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronsLeft, { fontSize: 16 }) }),
|
|
1483
|
+
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage <= 1 || currentPage === 1, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage - 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronLeft2, { fontSize: 16 }) }),
|
|
1484
1484
|
/* @__PURE__ */ jsx12(
|
|
1485
1485
|
"button",
|
|
1486
1486
|
{
|
|
@@ -1506,8 +1506,8 @@ var PagingComponent = ({ totalItem, pageSize, currentPage, onChangePage, pageOpt
|
|
|
1506
1506
|
children: "..."
|
|
1507
1507
|
}
|
|
1508
1508
|
),
|
|
1509
|
-
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage
|
|
1510
|
-
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage
|
|
1509
|
+
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage <= 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: currentPage + 1, old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronRight2, { fontSize: 16 }) }),
|
|
1510
|
+
/* @__PURE__ */ jsx12("button", { className: "r-button", type: "button", disabled: countPage <= 1 || countPage === currentPage, onClick: () => onChangePage({ totalItem, pageSize, currentPage: Math.floor(totalItem / pageSize) + (Math.floor(totalItem / pageSize) === totalItem / pageSize ? 0 : 1), old: currentPage }), children: /* @__PURE__ */ jsx12(ChevronsRight, { fontSize: 16 }) }),
|
|
1511
1511
|
/* @__PURE__ */ jsx12("div", { className: "r-pagesize", children: /* @__PURE__ */ jsx12(
|
|
1512
1512
|
Select2,
|
|
1513
1513
|
{
|
|
@@ -1565,9 +1565,9 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
1565
1565
|
handleAdd,
|
|
1566
1566
|
isClearable,
|
|
1567
1567
|
component,
|
|
1568
|
-
isDisabled,
|
|
1569
1568
|
formatOptionLabel,
|
|
1570
1569
|
isMulti,
|
|
1570
|
+
isDisabled,
|
|
1571
1571
|
showFooter
|
|
1572
1572
|
} = props;
|
|
1573
1573
|
const selectTableRef = useRef2();
|
|
@@ -1623,7 +1623,7 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
1623
1623
|
}, [dropdownOpen]);
|
|
1624
1624
|
let timeOutBlur;
|
|
1625
1625
|
useEffect7(() => {
|
|
1626
|
-
if (inputRef) {
|
|
1626
|
+
if (inputRef && !isDisabled) {
|
|
1627
1627
|
inputRef.current.addEventListener("blur", function() {
|
|
1628
1628
|
timeOutBlur = setTimeout(() => {
|
|
1629
1629
|
if (!selectTableRef.current?.contains(document.activeElement)) {
|
|
@@ -1964,22 +1964,25 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
1964
1964
|
}) }) })
|
|
1965
1965
|
] }),
|
|
1966
1966
|
countDisplay === 0 && !isLoading && /* @__PURE__ */ jsxs12("div", { className: "r-no-data", children: [
|
|
1967
|
-
/* @__PURE__ */ jsx13("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxs12("g", { transform: "translate(0 1)", fill: "none",
|
|
1967
|
+
/* @__PURE__ */ jsx13("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxs12("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [
|
|
1968
1968
|
/* @__PURE__ */ jsx13("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }),
|
|
1969
|
-
/* @__PURE__ */ jsxs12("g", {
|
|
1969
|
+
/* @__PURE__ */ jsxs12("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [
|
|
1970
1970
|
/* @__PURE__ */ jsx13("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }),
|
|
1971
1971
|
/* @__PURE__ */ jsx13("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", fill: "#fafafa" })
|
|
1972
1972
|
] })
|
|
1973
1973
|
] }) }),
|
|
1974
1974
|
t("No data available.")
|
|
1975
1975
|
] }),
|
|
1976
|
-
isLoading && /* @__PURE__ */
|
|
1976
|
+
isLoading && /* @__PURE__ */ jsxs12("div", { className: "r-no-data", children: [
|
|
1977
|
+
/* @__PURE__ */ jsx13(Spinner, { className: "me-1", children: " " }),
|
|
1978
|
+
t("Loading...")
|
|
1979
|
+
] })
|
|
1977
1980
|
] });
|
|
1978
1981
|
};
|
|
1979
1982
|
return /* @__PURE__ */ jsx13(
|
|
1980
1983
|
"div",
|
|
1981
1984
|
{
|
|
1982
|
-
className: classnames6("react-select-table"),
|
|
1985
|
+
className: classnames6("react-select-table", { "is-invalid": invalid }),
|
|
1983
1986
|
ref,
|
|
1984
1987
|
id,
|
|
1985
1988
|
children: /* @__PURE__ */ jsx13("div", { ref: selectTableRef, children: /* @__PURE__ */ jsxs12(
|
|
@@ -1993,15 +1996,17 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
1993
1996
|
DropdownToggle2,
|
|
1994
1997
|
{
|
|
1995
1998
|
onClick: () => {
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
|
|
1999
|
+
if (!isDisabled) {
|
|
2000
|
+
inputRef?.current.focus();
|
|
2001
|
+
if (dropdownOpen) {
|
|
2002
|
+
clearTimeout(timeOutBlur);
|
|
2003
|
+
}
|
|
2004
|
+
handleOpenClose();
|
|
1999
2005
|
}
|
|
2000
|
-
handleOpenClose();
|
|
2001
2006
|
},
|
|
2002
2007
|
tabIndex: 0,
|
|
2003
2008
|
tag: "div",
|
|
2004
|
-
className: classnames6("select-table-control", { "r-select-is-
|
|
2009
|
+
className: classnames6("select-table-control", { "r-select-is-disabled": isDisabled }, { "r-select-is-open": dropdownOpen }, { "r-select-is-focus": isFocus }, { "r-select-is-invalid": invalid }),
|
|
2005
2010
|
children: [
|
|
2006
2011
|
/* @__PURE__ */ jsxs12("div", { className: "select-table-container", children: [
|
|
2007
2012
|
isMulti ? /* @__PURE__ */ jsx13(Fragment14, { children: /* @__PURE__ */ jsx13("div", { className: classnames6("select-value is-mutil", { "d-none": searchTerm }), children: value?.map((ele, index) => {
|
|
@@ -2016,13 +2021,14 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
2016
2021
|
value ? formatOptionLabel ? formatOptionLabel(value) : value[fieldLabel ?? "label"] : "",
|
|
2017
2022
|
" "
|
|
2018
2023
|
] }) }),
|
|
2019
|
-
/* @__PURE__ */ jsx13("div", { className: classnames6("select-placeholder"
|
|
2024
|
+
!((isMulti ? value?.length > 0 : value) || isDisabled || searchTerm) && /* @__PURE__ */ jsx13("div", { className: classnames6("select-placeholder"), children: placeholder }),
|
|
2020
2025
|
/* @__PURE__ */ jsx13("div", { className: "input-container", children: /* @__PURE__ */ jsx13(
|
|
2021
2026
|
"input",
|
|
2022
2027
|
{
|
|
2023
2028
|
style: { textAlign: textAlign ?? "left" },
|
|
2024
2029
|
ref: inputRef,
|
|
2025
2030
|
className: classnames6("select-input"),
|
|
2031
|
+
readOnly: isDisabled,
|
|
2026
2032
|
value: searchTerm,
|
|
2027
2033
|
onChange: (val) => {
|
|
2028
2034
|
if (!isMulti && loadOptions && val.target.value) {
|
|
@@ -2040,7 +2046,7 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
2040
2046
|
/* @__PURE__ */ jsx13(Spinner, { style: { width: 4, height: 4, marginRight: 3 }, type: "grow" }),
|
|
2041
2047
|
/* @__PURE__ */ jsx13(Spinner, { style: { width: 4, height: 4, marginRight: 3 }, type: "grow" })
|
|
2042
2048
|
] }),
|
|
2043
|
-
|
|
2049
|
+
isClearable && value && !isDisabled && /* @__PURE__ */ jsx13(
|
|
2044
2050
|
"div",
|
|
2045
2051
|
{
|
|
2046
2052
|
className: classnames6("cursor-pointer"),
|
|
@@ -2051,7 +2057,7 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
2051
2057
|
children: /* @__PURE__ */ jsx13("svg", { height: "20", width: "20", fill: "#c4c4c4", color: "#c4c4c4", viewBox: "0 0 20 20", "aria-hidden": "true", focusable: "false", className: "css-tj5bde-Svg", children: /* @__PURE__ */ jsx13("path", { d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z" }) })
|
|
2052
2058
|
}
|
|
2053
2059
|
),
|
|
2054
|
-
/* @__PURE__ */ jsx13("div", { className: "select-table-indicator", children: /* @__PURE__ */ jsx13("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx13("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })
|
|
2060
|
+
!isDisabled && /* @__PURE__ */ jsx13("div", { className: "select-table-indicator", children: /* @__PURE__ */ jsx13("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx13("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })
|
|
2055
2061
|
]
|
|
2056
2062
|
}
|
|
2057
2063
|
),
|
|
@@ -2069,9 +2075,11 @@ var SelectTable = forwardRef2((props, ref) => {
|
|
|
2069
2075
|
"div",
|
|
2070
2076
|
{
|
|
2071
2077
|
onMouseDown: (e) => {
|
|
2072
|
-
|
|
2073
|
-
|
|
2074
|
-
|
|
2078
|
+
if (!isDisabled) {
|
|
2079
|
+
inputRef?.current.focus();
|
|
2080
|
+
clearTimeout(timeOutBlur);
|
|
2081
|
+
e.preventDefault();
|
|
2082
|
+
}
|
|
2075
2083
|
},
|
|
2076
2084
|
children: /* @__PURE__ */ jsxs12("div", { className: "r-select-grid", children: [
|
|
2077
2085
|
/* @__PURE__ */ jsx13("div", { className: "r-select-gridtable", ref: selectMenuTableRef, style: { minWidth: selectTableRef?.current?.clientWidth, maxHeight: maxHeight ?? defaultMaxHeight }, children: /* @__PURE__ */ jsx13(RenderTable, {}) }),
|