glints-aries 4.1.10 → 4.1.12

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 (7) hide show
  1. package/es/@next/Select/Select.d.ts +3 -2
  2. package/es/@next/Select/Select.js +15 -11
  3. package/es/@next/Tabs/Tab.js +6 -4
  4. package/lib/@next/Select/Select.d.ts +3 -2
  5. package/lib/@next/Select/Select.js +15 -11
  6. package/lib/@next/Tabs/Tab.js +6 -4
  7. package/package.json +1 -1
package/es/@next/Select/Select.d.ts CHANGED
@@ -33,6 +33,8 @@ export interface SelectProps {
33
33
  }): void;
34
34
  /** callback function when select component is clicked (opened) */
35
35
  onSelectClick?: () => void;
36
+ isPopoverActive?: boolean;
37
+ onPopoverActiveChange?: (isActive: boolean) => void;
36
38
  options?: Option[];
37
39
  /** sets whether OptionList will follow content's width */
38
40
  optionListFitContent?: boolean;
@@ -56,8 +58,7 @@ export interface SelectProps {
56
58
  border?: string;
57
59
  borderRadius?: string;
58
60
  required?: boolean;
59
- isPopoverActive?: boolean;
60
61
  isPlaceholderFloating?: boolean;
61
62
  }
62
- export declare const Select: ({ allowMultiple, customActivatorIcon, disabled, hasError, helpText, label, listHeight, loadingOptions, name, onBlur, onClose, onFocus, onRemoveTag, onSelect, onSelectClick, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, optionsPlaceholderProps, showPopoverOnFocus, scrollable, sections, selectedValues, width, height, zIndexOverride, border, borderRadius, required, isPlaceholderFloating, isPopoverActive, }: SelectProps) => JSX.Element;
63
+ export declare const Select: ({ allowMultiple, customActivatorIcon, disabled, hasError, helpText, label, listHeight, loadingOptions, name, onBlur, onClose, onFocus, onRemoveTag, onSelect, onSelectClick, isPopoverActive, onPopoverActiveChange, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, optionsPlaceholderProps, showPopoverOnFocus, scrollable, sections, selectedValues, width, height, zIndexOverride, border, borderRadius, required, isPlaceholderFloating, }: SelectProps) => JSX.Element;
63
64
  export {};
package/es/@next/Select/Select.js CHANGED
@@ -27,6 +27,8 @@ export var Select = function Select(_ref) {
27
27
  onRemoveTag = _ref.onRemoveTag,
28
28
  onSelect = _ref.onSelect,
29
29
  onSelectClick = _ref.onSelectClick,
30
+ isPopoverActive = _ref.isPopoverActive,
31
+ onPopoverActiveChange = _ref.onPopoverActiveChange,
30
32
  _ref$optionListFitCon = _ref.optionListFitContent,
31
33
  optionListFitContent = _ref$optionListFitCon === void 0 ? false : _ref$optionListFitCon,
32
34
  _ref$options = _ref.options,
@@ -48,11 +50,18 @@ export var Select = function Select(_ref) {
48
50
  border = _ref.border,
49
51
  borderRadius = _ref.borderRadius,
50
52
  required = _ref.required,
51
- isPlaceholderFloating = _ref.isPlaceholderFloating,
52
- isPopoverActive = _ref.isPopoverActive;
53
+ isPlaceholderFloating = _ref.isPlaceholderFloating;
53
54
  var _useState = useState(false),
54
- popoverActive = _useState[0],
55
- setPopoverActive = _useState[1];
55
+ internalPopoverActive = _useState[0],
56
+ setInternalPopoverActive = _useState[1];
57
+ var popoverActive = isPopoverActive !== undefined ? isPopoverActive : internalPopoverActive;
58
+ var setPopoverActive = function setPopoverActive(newState) {
59
+ if (isPopoverActive != undefined) {
60
+ onPopoverActiveChange == null ? void 0 : onPopoverActiveChange(newState);
61
+ } else {
62
+ setInternalPopoverActive(newState);
63
+ }
64
+ };
56
65
  var _useState2 = useState(''),
57
66
  optionListHeight = _useState2[0],
58
67
  setOptionListHeight = _useState2[1];
@@ -79,11 +88,6 @@ export var Select = function Select(_ref) {
79
88
  var updateMenuOptions = function updateMenuOptions(newState) {
80
89
  setMenuOptions(newState);
81
90
  };
82
- useEffect(function () {
83
- if (isPopoverActive === false && popoverActive) {
84
- setPopoverActive(false);
85
- }
86
- }, [isPopoverActive, popoverActive]);
87
91
  var handleClose = function handleClose() {
88
92
  setPopoverActive(false);
89
93
  onClose == null ? void 0 : onClose();
@@ -112,10 +116,10 @@ export var Select = function Select(_ref) {
112
116
  useEffect(function () {
113
117
  if (showPopoverOnFocus) return;
114
118
  if (!isEmpty(inputValue) && optionsLength > 0) {
115
- setPopoverActive(true);
119
+ setInternalPopoverActive(true);
116
120
  }
117
121
  if (inputValue === '' && optionsLength < 1) {
118
- setPopoverActive(false);
122
+ setInternalPopoverActive(false);
119
123
  }
120
124
  }, [inputValue, optionsLength, showPopoverOnFocus]);
121
125
  useEffect(function () {
package/es/@next/Tabs/Tab.js CHANGED
@@ -12,11 +12,13 @@ export var Tab = function Tab(_ref) {
12
12
  onSelect = _ref.onSelect;
13
13
  var tabRef = useRef(null);
14
14
  var handleClick = function handleClick(event) {
15
- if (disabled || disabledScrollToTab) return;
15
+ if (disabled) return;
16
16
  event.preventDefault();
17
- tabRef.current.scrollIntoView({
18
- behavior: 'smooth'
19
- });
17
+ if (!disabledScrollToTab) {
18
+ tabRef.current.scrollIntoView({
19
+ behavior: 'smooth'
20
+ });
21
+ }
20
22
  onSelect();
21
23
  };
22
24
  return /*#__PURE__*/React.createElement(StyledTabButton, {
package/lib/@next/Select/Select.d.ts CHANGED
@@ -33,6 +33,8 @@ export interface SelectProps {
33
33
  }): void;
34
34
  /** callback function when select component is clicked (opened) */
35
35
  onSelectClick?: () => void;
36
+ isPopoverActive?: boolean;
37
+ onPopoverActiveChange?: (isActive: boolean) => void;
36
38
  options?: Option[];
37
39
  /** sets whether OptionList will follow content's width */
38
40
  optionListFitContent?: boolean;
@@ -56,8 +58,7 @@ export interface SelectProps {
56
58
  border?: string;
57
59
  borderRadius?: string;
58
60
  required?: boolean;
59
- isPopoverActive?: boolean;
60
61
  isPlaceholderFloating?: boolean;
61
62
  }
62
- export declare const Select: ({ allowMultiple, customActivatorIcon, disabled, hasError, helpText, label, listHeight, loadingOptions, name, onBlur, onClose, onFocus, onRemoveTag, onSelect, onSelectClick, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, optionsPlaceholderProps, showPopoverOnFocus, scrollable, sections, selectedValues, width, height, zIndexOverride, border, borderRadius, required, isPlaceholderFloating, isPopoverActive, }: SelectProps) => JSX.Element;
63
+ export declare const Select: ({ allowMultiple, customActivatorIcon, disabled, hasError, helpText, label, listHeight, loadingOptions, name, onBlur, onClose, onFocus, onRemoveTag, onSelect, onSelectClick, isPopoverActive, onPopoverActiveChange, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, optionsPlaceholderProps, showPopoverOnFocus, scrollable, sections, selectedValues, width, height, zIndexOverride, border, borderRadius, required, isPlaceholderFloating, }: SelectProps) => JSX.Element;
63
64
  export {};
package/lib/@next/Select/Select.js CHANGED
@@ -33,6 +33,8 @@ var Select = function Select(_ref) {
33
33
  onRemoveTag = _ref.onRemoveTag,
34
34
  onSelect = _ref.onSelect,
35
35
  onSelectClick = _ref.onSelectClick,
36
+ isPopoverActive = _ref.isPopoverActive,
37
+ onPopoverActiveChange = _ref.onPopoverActiveChange,
36
38
  _ref$optionListFitCon = _ref.optionListFitContent,
37
39
  optionListFitContent = _ref$optionListFitCon === void 0 ? false : _ref$optionListFitCon,
38
40
  _ref$options = _ref.options,
@@ -54,11 +56,18 @@ var Select = function Select(_ref) {
54
56
  border = _ref.border,
55
57
  borderRadius = _ref.borderRadius,
56
58
  required = _ref.required,
57
- isPlaceholderFloating = _ref.isPlaceholderFloating,
58
- isPopoverActive = _ref.isPopoverActive;
59
+ isPlaceholderFloating = _ref.isPlaceholderFloating;
59
60
  var _useState = (0, _react.useState)(false),
60
- popoverActive = _useState[0],
61
- setPopoverActive = _useState[1];
61
+ internalPopoverActive = _useState[0],
62
+ setInternalPopoverActive = _useState[1];
63
+ var popoverActive = isPopoverActive !== undefined ? isPopoverActive : internalPopoverActive;
64
+ var setPopoverActive = function setPopoverActive(newState) {
65
+ if (isPopoverActive != undefined) {
66
+ onPopoverActiveChange == null ? void 0 : onPopoverActiveChange(newState);
67
+ } else {
68
+ setInternalPopoverActive(newState);
69
+ }
70
+ };
62
71
  var _useState2 = (0, _react.useState)(''),
63
72
  optionListHeight = _useState2[0],
64
73
  setOptionListHeight = _useState2[1];
@@ -85,11 +94,6 @@ var Select = function Select(_ref) {
85
94
  var updateMenuOptions = function updateMenuOptions(newState) {
86
95
  setMenuOptions(newState);
87
96
  };
88
- (0, _react.useEffect)(function () {
89
- if (isPopoverActive === false && popoverActive) {
90
- setPopoverActive(false);
91
- }
92
- }, [isPopoverActive, popoverActive]);
93
97
  var handleClose = function handleClose() {
94
98
  setPopoverActive(false);
95
99
  onClose == null ? void 0 : onClose();
@@ -118,10 +122,10 @@ var Select = function Select(_ref) {
118
122
  (0, _react.useEffect)(function () {
119
123
  if (showPopoverOnFocus) return;
120
124
  if (!(0, _lodash.isEmpty)(inputValue) && optionsLength > 0) {
121
- setPopoverActive(true);
125
+ setInternalPopoverActive(true);
122
126
  }
123
127
  if (inputValue === '' && optionsLength < 1) {
124
- setPopoverActive(false);
128
+ setInternalPopoverActive(false);
125
129
  }
126
130
  }, [inputValue, optionsLength, showPopoverOnFocus]);
127
131
  (0, _react.useEffect)(function () {
package/lib/@next/Tabs/Tab.js CHANGED
@@ -18,11 +18,13 @@ var Tab = function Tab(_ref) {
18
18
  onSelect = _ref.onSelect;
19
19
  var tabRef = (0, _react.useRef)(null);
20
20
  var handleClick = function handleClick(event) {
21
- if (disabled || disabledScrollToTab) return;
21
+ if (disabled) return;
22
22
  event.preventDefault();
23
- tabRef.current.scrollIntoView({
24
- behavior: 'smooth'
25
- });
23
+ if (!disabledScrollToTab) {
24
+ tabRef.current.scrollIntoView({
25
+ behavior: 'smooth'
26
+ });
27
+ }
26
28
  onSelect();
27
29
  };
28
30
  return /*#__PURE__*/_react["default"].createElement(_TabStyle.StyledTabButton, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "glints-aries",
3
- "version": "4.1.10",
3
+ "version": "4.1.12",
4
4
  "description": "Glints ui-kit for frontend",
5
5
  "main": "./lib/index.js",
6
6
  "module": "./es/index.js",