pixelize-design-library 2.0.18 → 2.0.19

package/dist/Components/SearchSelect/SearchSelect.js

@@ -45,6 +45,18 @@ var ErrorMessage_1 = __importDefault(require("../Common/ErrorMessage"));
 var HelperText_1 = __importDefault(require("../Common/HelperText"));
 var ToolTip_1 = __importDefault(require("../ToolTip/ToolTip"));
 var SelectTruncatedLabel_1 = __importDefault(require("./SelectTruncatedLabel"));
+var normalizeSingleValue = function (val) {
+    if (typeof val === 'object' && val !== null && 'id' in val && 'label' in val) {
+        return val;
+    }
+    return undefined;
+};
+var normalizeMultiValue = function (val) {
+    if (Array.isArray(val)) {
+        return val.filter(function (v) { return v && typeof v === 'object' && 'id' in v && 'label' in v; });
+    }
+    return [];
+};
 var SearchSelect = function (_a) {
     var _b, _c, _d, _e, _f;
     var id = _a.id, label = _a.label, options = _a.options, onSelect = _a.onSelect, onSearch = _a.onSearch, _g = _a.isOptionLoading, isOptionLoading = _g === void 0 ? false : _g, _h = _a.isLoading, isLoading = _h === void 0 ? false : _h, _j = _a.loadingText, loadingText = _j === void 0 ? 'Loading...' : _j, _k = _a.placeholder, placeholder = _k === void 0 ? 'Select' : _k, value = _a.value, _l = _a.searchQuery, searchQuery = _l === void 0 ? '' : _l, _m = _a.isMultiple, isMultiple = _m === void 0 ? false : _m, _o = _a.isRequired, isRequired = _o === void 0 ? false : _o, _p = _a.error, error = _p === void 0 ? false : _p, errorMessage = _a.errorMessage, helperText = _a.helperText, _q = _a.width, width = _q === void 0 ? '100%' : _q, _r = _a.height, height = _r === void 0 ? "2.75rem" : _r, _s = _a.size, size = _s === void 0 ? 'md' : _s, chip = _a.chip, information = _a.information, rightIcon = _a.rightIcon, addNew = _a.addNew, _t = _a.isSelectAll, isSelectAll = _t === void 0 ? false : _t, pagination = _a.pagination, insideSelect = _a.insideSelect;
@@ -66,11 +78,9 @@ var SearchSelect = function (_a) {
         },
     });
     var selectedValues = isMultiple
-        ? Array.isArray(value)
-            ? value
-            : []
-        : value
-            ? [value]
+        ? normalizeMultiValue(value)
+        : normalizeSingleValue(value)
+            ? [normalizeSingleValue(value)]
             : [];
     var filteredOptions = options.filter(function (option) {
         return option.label.toLowerCase().includes(inputValue.toLowerCase());
@@ -147,10 +157,6 @@ var SearchSelect = function (_a) {
             }, 200);
         }
     }, [pagination, options.length, inputValue, hasMore]);
-    // useOutsideClick({
-    //   ref: customSelectRef,
-    //   handler: () => setCustomSelectOpen(false),
-    // });
     (0, react_2.useOutsideClick)({
         ref: customSelectRef,
         handler: function (e) {
@@ -176,7 +182,7 @@ var SearchSelect = function (_a) {
             });
         }
     }, [customSelectOpen]);
-    return (react_1.default.createElement(react_2.Box, { ref: containerRef, width: width, position: "relative", height: height },
+    return (react_1.default.createElement(react_2.Box, { ref: containerRef, width: width, position: "relative" },
         label && (react_1.default.createElement(FormLabel_1.TextLabel, { label: label, id: id, isRequired: isRequired, isInformation: information === null || information === void 0 ? void 0 : information.isInformation, informationMessage: information === null || information === void 0 ? void 0 : information.informationMessage })),
         react_1.default.createElement(react_2.InputGroup, { size: size },
             react_1.default.createElement(react_2.Box, { as: "div", w: "100%", minH: "2.375rem", px: 3, display: "flex", alignItems: "center", flexWrap: "wrap", gap: "0.375rem", border: "0.063rem solid", borderColor: error ? theme.colors.semantic.error[500] : theme.colors.primary[500], borderRadius: "0.25rem", bg: "white", boxShadow: focused ? error ? "0 0 0 0.125rem ".concat((_b = theme.colors.boxShadow) === null || _b === void 0 ? void 0 : _b.error) : "0 0 0 0.125rem ".concat((_c = theme.colors.boxShadow) === null || _c === void 0 ? void 0 : _c.primary) : 'none', transition: "box-shadow 0.2s, border-color 0.2s" },

package/dist/Pages/searchSelect.js

@@ -83,13 +83,17 @@ var rrr = function (start, limit) {
 };
 var delay = function (ms) { return new Promise(function (resolve) { return setTimeout(resolve, ms); }); };
 var SearchSelect = function () {
-    var _a = (0, react_1.useState)([{ id: "300", label: "mahesh" }]), selectedOptions = _a[0], setselectedOptions = _a[1];
+    var _a = (0, react_1.useState)({}), selectedOptions = _a[0], setselectedOptions = _a[1];
     var _b = (0, react_1.useState)(rrr(1, 50)), soptions = _b[0], setSoptions = _b[1]; // initial 50
     var _c = (0, react_1.useState)(""), search = _c[0], setSearch = _c[1];
     var _d = (0, react_1.useState)(false), paginationLoading = _d[0], setpaginationLoading = _d[1];
     var _e = (0, react_1.useState)({ id: "3", label: "Hariharan J" }), customSelectValue = _e[0], setCustomSelectValue = _e[1];
     return (react_1.default.createElement("div", null,
-        react_1.default.createElement(SearchSelect_1.default, { width: "250px", label: "Users", id: "user-select", options: soptions, value: selectedOptions, isMultiple: true, onSelect: function (val) {
+        react_1.default.createElement(SearchSelect_1.default
+        // width={"250px"}
+        , { 
+            // width={"250px"}
+            label: "Users", id: "user-select", options: soptions, value: selectedOptions, isMultiple: true, onSelect: function (val) {
                 console.log("val", val);
                 setselectedOptions(val);
             }, onSearch: function (query) { return setSearch(query); }, searchQuery: search, isOptionLoading: false, placeholder: "Search users...", chip: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",