tabler-react-2 0.1.101 → 0.1.103
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/input/dropdown.js +14 -4
- package/package.json +1 -1
package/dist/input/dropdown.js
CHANGED
|
@@ -7,7 +7,7 @@ exports.DropdownInput = void 0;
|
|
|
7
7
|
var _react = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _index = require("../index");
|
|
10
|
-
var _excluded = ["prompt", "values", "items", "value", "onChange", "aprops", "showSearch", "loading", "disabled", "disabledText", "label", "showLabel", "color", "outline"];
|
|
10
|
+
var _excluded = ["prompt", "values", "items", "value", "onChange", "aprops", "showSearch", "loading", "disabled", "disabledText", "label", "showLabel", "color", "outline", "maxHeight"];
|
|
11
11
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
12
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
13
13
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
@@ -40,6 +40,8 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
|
|
|
40
40
|
showLabel = _ref$showLabel === void 0 ? true : _ref$showLabel,
|
|
41
41
|
color = _ref.color,
|
|
42
42
|
outline = _ref.outline,
|
|
43
|
+
_ref$maxHeight = _ref.maxHeight,
|
|
44
|
+
maxHeight = _ref$maxHeight === void 0 ? "300px" : _ref$maxHeight,
|
|
43
45
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
44
46
|
// Allow aliasing: pass either `values` or `items`
|
|
45
47
|
var values = ivalues || items || [];
|
|
@@ -102,11 +104,14 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
|
|
|
102
104
|
}) || null;
|
|
103
105
|
setSelectedValue(matchedValue);
|
|
104
106
|
}, [value, values]);
|
|
107
|
+
var normalize = function normalize(str) {
|
|
108
|
+
return str.toLowerCase().replace(/[\s_\-+]+/g, "");
|
|
109
|
+
};
|
|
105
110
|
|
|
106
111
|
// Filter values based on the search query using getLabelText
|
|
107
112
|
(0, _react.useEffect)(function () {
|
|
108
113
|
setFilteredValues(values.filter(function (val) {
|
|
109
|
-
return getLabelText(val).toLowerCase().includes(searchQuery.toLowerCase());
|
|
114
|
+
return getLabelText(val).toLowerCase().includes(searchQuery.toLowerCase()) || normalize(val.searchIndex.toLowerCase()).includes(normalize(searchQuery).toLowerCase());
|
|
110
115
|
}));
|
|
111
116
|
}, [searchQuery, values]);
|
|
112
117
|
var handleSelection = function handleSelection(val) {
|
|
@@ -131,7 +136,12 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
|
|
|
131
136
|
onChange: function onChange(value) {
|
|
132
137
|
return setSearchQuery(value);
|
|
133
138
|
}
|
|
134
|
-
})),
|
|
139
|
+
})), /*#__PURE__*/_react["default"].createElement("div", {
|
|
140
|
+
style: {
|
|
141
|
+
maxHeight: maxHeight,
|
|
142
|
+
overflowY: "auto"
|
|
143
|
+
}
|
|
144
|
+
}, filteredValues.map(function (val, index) {
|
|
135
145
|
var _val$dropdownText2;
|
|
136
146
|
return /*#__PURE__*/_react["default"].createElement("a", {
|
|
137
147
|
key: index,
|
|
@@ -145,7 +155,7 @@ var DropdownInput = exports.DropdownInput = function DropdownInput(_ref) {
|
|
|
145
155
|
}, (_val$dropdownText2 = val.dropdownText) !== null && _val$dropdownText2 !== void 0 ? _val$dropdownText2 : val.label);
|
|
146
156
|
}), filteredValues.length === 0 && /*#__PURE__*/_react["default"].createElement("div", {
|
|
147
157
|
className: "dropdown-item text-muted"
|
|
148
|
-
}, "No results found")));
|
|
158
|
+
}, "No results found"))));
|
|
149
159
|
|
|
150
160
|
// If a label is provided, wrap the dropdown with the label inside a container.
|
|
151
161
|
return label && showLabel ? /*#__PURE__*/_react["default"].createElement(_index.Util.Col, null, /*#__PURE__*/_react["default"].createElement("label", {
|