glints-aries 4.0.354 → 4.0.356

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.
Files changed (9) hide show
  1. package/es/@next/Select/Select.js +5 -1
  2. package/es/Input/Select/Select.js +16 -2
  3. package/es/Input/Select/Select.numberChecking.test.d.ts +2 -0
  4. package/es/Input/Select/SelectList.d.ts +1 -1
  5. package/lib/@next/Select/Select.js +5 -1
  6. package/lib/Input/Select/Select.js +16 -2
  7. package/lib/Input/Select/Select.numberChecking.test.d.ts +2 -0
  8. package/lib/Input/Select/SelectList.d.ts +1 -1
  9. package/package.json +1 -1
package/es/@next/Select/Select.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import React, { useEffect, useState } from 'react';
2
+ import { isEmpty } from 'lodash-es';
2
3
  import { Popover } from '../Popover';
3
4
  import { Typography } from '../Typography';
4
5
  import { Neutral } from '../utilities/colors';
@@ -90,12 +91,15 @@ export var Select = function Select(_ref) {
90
91
  var handleSelectClick = function handleSelectClick() {
91
92
  setPopoverActive(!popoverActive);
92
93
  };
94
+ useEffect(function syncInputValueFromSearchableProps() {
95
+ setInputValue(searchableProps == null ? void 0 : searchableProps.inputValue);
96
+ }, [searchableProps == null ? void 0 : searchableProps.inputValue]);
93
97
  useEffect(function () {
94
98
  setMenuOptions(options);
95
99
  }, [options]);
96
100
  useEffect(function () {
97
101
  if (showPopoverOnFocus) return;
98
- if (inputValue != '' && optionsLength > 0) {
102
+ if (!isEmpty(inputValue) && optionsLength > 0) {
99
103
  setPopoverActive(true);
100
104
  }
101
105
  if (inputValue === '' && optionsLength < 1) {
package/es/Input/Select/Select.js CHANGED
@@ -102,7 +102,14 @@ var Select = function Select(props) {
102
102
  }
103
103
  }
104
104
  var matchedChildrenOptions = childrenOptions.filter(function (data) {
105
- return filterFunction(data.props.children, inputValue);
105
+ var children = data.props.children;
106
+ if (typeof children === 'string') {
107
+ return filterFunction(children, inputValue);
108
+ }
109
+ if (typeof children === 'number') {
110
+ return filterFunction(String(children), inputValue);
111
+ }
112
+ return true;
106
113
  });
107
114
  return matchedChildrenOptions;
108
115
  }, [children, inputValue, disableTyping, isInputChange, filterFunction]);
@@ -113,7 +120,14 @@ var Select = function Select(props) {
113
120
  setOptions(availableOptions);
114
121
  if (!isFocus) {
115
122
  var selectedOptionIndex = availableOptions.findIndex(function (option) {
116
- return toLower(option.props.children).includes(toLower(inputValue));
123
+ var children = option.props.children;
124
+ if (typeof children === 'string') {
125
+ return toLower(children).includes(toLower(inputValue));
126
+ }
127
+ if (typeof children === 'number') {
128
+ return toLower(String(children)).includes(toLower(inputValue));
129
+ }
130
+ return false;
117
131
  });
118
132
  if (activeOptionIndex !== selectedOptionIndex) {
119
133
  setActiveOptionIndex(selectedOptionIndex);
package/es/Input/Select/Select.numberChecking.test.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import 'jest-styled-components';
2
+ import '@testing-library/jest-dom/extend-expect';
package/es/Input/Select/SelectList.d.ts CHANGED
@@ -11,7 +11,7 @@ interface Props {
11
11
  handleMouseEnterOption(event: React.MouseEvent<HTMLLIElement, MouseEvent>): void;
12
12
  }
13
13
  export interface SelectItemProps {
14
- children: string;
14
+ children: string | number | React.ReactNode;
15
15
  value?: string;
16
16
  onOptionClick?(e: React.ChangeEvent<HTMLInputElement>): void;
17
17
  }
package/lib/@next/Select/Select.js CHANGED
@@ -3,6 +3,7 @@
3
3
  exports.__esModule = true;
4
4
  exports.Select = void 0;
5
5
  var _react = _interopRequireWildcard(require("react"));
6
+ var _lodash = require("lodash");
6
7
  var _Popover = require("../Popover");
7
8
  var _Typography = require("../Typography");
8
9
  var _colors = require("../utilities/colors");
@@ -96,12 +97,15 @@ var Select = function Select(_ref) {
96
97
  var handleSelectClick = function handleSelectClick() {
97
98
  setPopoverActive(!popoverActive);
98
99
  };
100
+ (0, _react.useEffect)(function syncInputValueFromSearchableProps() {
101
+ setInputValue(searchableProps == null ? void 0 : searchableProps.inputValue);
102
+ }, [searchableProps == null ? void 0 : searchableProps.inputValue]);
99
103
  (0, _react.useEffect)(function () {
100
104
  setMenuOptions(options);
101
105
  }, [options]);
102
106
  (0, _react.useEffect)(function () {
103
107
  if (showPopoverOnFocus) return;
104
- if (inputValue != '' && optionsLength > 0) {
108
+ if (!(0, _lodash.isEmpty)(inputValue) && optionsLength > 0) {
105
109
  setPopoverActive(true);
106
110
  }
107
111
  if (inputValue === '' && optionsLength < 1) {
package/lib/Input/Select/Select.js CHANGED
@@ -109,7 +109,14 @@ var Select = function Select(props) {
109
109
  }
110
110
  }
111
111
  var matchedChildrenOptions = childrenOptions.filter(function (data) {
112
- return filterFunction(data.props.children, inputValue);
112
+ var children = data.props.children;
113
+ if (typeof children === 'string') {
114
+ return filterFunction(children, inputValue);
115
+ }
116
+ if (typeof children === 'number') {
117
+ return filterFunction(String(children), inputValue);
118
+ }
119
+ return true;
113
120
  });
114
121
  return matchedChildrenOptions;
115
122
  }, [children, inputValue, disableTyping, isInputChange, filterFunction]);
@@ -120,7 +127,14 @@ var Select = function Select(props) {
120
127
  setOptions(availableOptions);
121
128
  if (!isFocus) {
122
129
  var selectedOptionIndex = availableOptions.findIndex(function (option) {
123
- return (0, _lodash.toLower)(option.props.children).includes((0, _lodash.toLower)(inputValue));
130
+ var children = option.props.children;
131
+ if (typeof children === 'string') {
132
+ return (0, _lodash.toLower)(children).includes((0, _lodash.toLower)(inputValue));
133
+ }
134
+ if (typeof children === 'number') {
135
+ return (0, _lodash.toLower)(String(children)).includes((0, _lodash.toLower)(inputValue));
136
+ }
137
+ return false;
124
138
  });
125
139
  if (activeOptionIndex !== selectedOptionIndex) {
126
140
  setActiveOptionIndex(selectedOptionIndex);
package/lib/Input/Select/Select.numberChecking.test.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ import 'jest-styled-components';
2
+ import '@testing-library/jest-dom/extend-expect';
package/lib/Input/Select/SelectList.d.ts CHANGED
@@ -11,7 +11,7 @@ interface Props {
11
11
  handleMouseEnterOption(event: React.MouseEvent<HTMLLIElement, MouseEvent>): void;
12
12
  }
13
13
  export interface SelectItemProps {
14
- children: string;
14
+ children: string | number | React.ReactNode;
15
15
  value?: string;
16
16
  onOptionClick?(e: React.ChangeEvent<HTMLInputElement>): void;
17
17
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "glints-aries",
3
- "version": "4.0.354",
3
+ "version": "4.0.356",
4
4
  "description": "Glints ui-kit for frontend",
5
5
  "main": "./lib/index.js",
6
6
  "module": "./es/index.js",