@semcore/select 16.0.0-prerelease.4 → 16.0.0-prerelease.7

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.
@@ -1,101 +1,129 @@
1
- import B from "@babel/runtime/helpers/esm/slicedToArray";
2
- import M from "@babel/runtime/helpers/esm/extends";
3
- import J from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
- import u from "@babel/runtime/helpers/esm/objectSpread2";
5
- import Q from "@babel/runtime/helpers/esm/classCallCheck";
6
- import V from "@babel/runtime/helpers/esm/createClass";
7
- import D from "@babel/runtime/helpers/esm/assertThisInitialized";
8
- import y from "@babel/runtime/helpers/esm/get";
9
- import C from "@babel/runtime/helpers/esm/getPrototypeOf";
10
- import U from "@babel/runtime/helpers/esm/inherits";
11
- import X from "@babel/runtime/helpers/esm/createSuper";
12
- import b from "@babel/runtime/helpers/esm/defineProperty";
13
- import { sstyled as w, createComponent as F, lastInteraction as q, assignProps as S } from "@semcore/core";
14
- import g from "react";
15
- import Y from "classnames";
16
- import f from "@semcore/dropdown-menu";
17
- import T, { enhance as ee, selectedIndexContext as te, AbstractDropdown as re } from "@semcore/dropdown";
18
- import { ButtonTrigger as I } from "@semcore/base-trigger";
19
- import ne from "@semcore/divider";
20
- import ie, { isAdvanceMode as k } from "@semcore/core/lib/utils/findComponent";
21
- import oe from "@semcore/core/lib/utils/logger";
22
- import le from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
23
- import ae from "@semcore/core/lib/utils/addonTextChildren";
24
- import z from "./InputSearch.mjs";
25
- import { useBox as de } from "@semcore/flex-box";
26
- import { selectContext as se } from "./context.mjs";
27
- import { localizedMessages as ce } from "./translations/__intergalactic-dynamic-locales.mjs";
28
- import { isInputTriggerTag as _e } from "@semcore/popper";
29
- import { callAllEventHandlers as N } from "@semcore/core/lib/utils/assignProps";
30
- var ge = ["Children", "options", "multiselect", "value", "uid", "forcedAdvancedMode"], he = (
1
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
+ import _extends from "@babel/runtime/helpers/esm/extends";
3
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
+ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
5
+ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
6
+ import _createClass from "@babel/runtime/helpers/esm/createClass";
7
+ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
8
+ import _get from "@babel/runtime/helpers/esm/get";
9
+ import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
10
+ import _inherits from "@babel/runtime/helpers/esm/inherits";
11
+ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
12
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
13
+ import { sstyled, createComponent, lastInteraction, assignProps } from "@semcore/core";
14
+ import React from "react";
15
+ import cn from "classnames";
16
+ import DropdownMenu from "@semcore/dropdown-menu";
17
+ import Dropdown, { enhance, selectedIndexContext, AbstractDropdown } from "@semcore/dropdown";
18
+ import { ButtonTrigger } from "@semcore/base-trigger";
19
+ import Divider from "@semcore/divider";
20
+ import findComponent, { isAdvanceMode } from "@semcore/core/lib/utils/findComponent";
21
+ import logger from "@semcore/core/lib/utils/logger";
22
+ import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
23
+ import addonTextChildren from "@semcore/core/lib/utils/addonTextChildren";
24
+ import InputSearch from "./InputSearch.mjs";
25
+ import { useBox } from "@semcore/flex-box";
26
+ import { selectContext } from "./context.mjs";
27
+ import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
28
+ import { isInputTriggerTag } from "@semcore/popper";
29
+ import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
30
+ var _excluded = ["Children", "options", "multiselect", "value", "uid", "forcedAdvancedMode"];
31
+ var style = (
31
32
  /*__reshadow_css_start__*/
32
- (w.insert(
33
+ (sstyled.insert(
33
34
  /*__inner_css_start__*/
34
35
  '.___SOptionCheckbox_1dlne_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_1dlne_gg_::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_1dlne_gg_::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center}.___SOptionCheckbox_1dlne_gg_.__selected_1dlne_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1dlne_gg_._size_l_1dlne_gg_{width:20px;height:20px}.___SOptionCheckbox_1dlne_gg_._size_l_1dlne_gg_.__selected_1dlne_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1dlne_gg_.__indeterminate_1dlne_gg_:before,.___SOptionCheckbox_1dlne_gg_.__selected_1dlne_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_1dlne_gg_.__theme_1dlne_gg_:before{border-color:var(--theme_1dlne)}.___SOptionCheckbox_1dlne_gg_.__theme_1dlne_gg_.__indeterminate_1dlne_gg_:before,.___SOptionCheckbox_1dlne_gg_.__theme_1dlne_gg_.__selected_1dlne_gg_:before{background-color:var(--theme_1dlne);border-color:var(--theme_1dlne)}.___SOptionCheckbox_1dlne_gg_.__selected_1dlne_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_1dlne_gg_.__selected_1dlne_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SOptionCheckbox_1dlne_gg_.__indeterminate_1dlne_gg_:after{background-color:#fff;background-image:none;margin:auto;border-radius:1px}.___SOptionCheckbox_1dlne_gg_.__indeterminate_1dlne_gg_._size_l_1dlne_gg_:after{width:12px;height:2px}.___SOptionCheckbox_1dlne_gg_.__indeterminate_1dlne_gg_._size_m_1dlne_gg_:after{width:8px;height:2px}',
35
36
  "1dlne_gg_"
36
37
  ), {
37
- __SOptionCheckbox: "___SOptionCheckbox_1dlne_gg_",
38
- _selected: "__selected_1dlne_gg_",
39
- _size_l: "_size_l_1dlne_gg_",
40
- _indeterminate: "__indeterminate_1dlne_gg_",
41
- _theme: "__theme_1dlne_gg_",
38
+ "__SOptionCheckbox": "___SOptionCheckbox_1dlne_gg_",
39
+ "_selected": "__selected_1dlne_gg_",
40
+ "_size_l": "_size_l_1dlne_gg_",
41
+ "_indeterminate": "__indeterminate_1dlne_gg_",
42
+ "_theme": "__theme_1dlne_gg_",
42
43
  "--theme": "--theme_1dlne",
43
- _size_m: "_size_m_1dlne_gg_"
44
+ "_size_m": "_size_m_1dlne_gg_"
44
45
  })
45
46
  );
46
- function E(n, a) {
47
- return Array.isArray(n) ? n.includes(a) : a === n;
47
+ function isSelectedOption(value, valueOption) {
48
+ return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;
48
49
  }
49
- function ue(n) {
50
- return Array.isArray(n) ? n.length === 0 : n === null;
50
+ function isEmptyValue(value) {
51
+ return Array.isArray(value) ? value.length === 0 : value === null;
51
52
  }
52
- function $(n) {
53
- return n ? [] : null;
53
+ function getEmptyValue(multiselect) {
54
+ return multiselect ? [] : null;
54
55
  }
55
- var O = /* @__PURE__ */ function(n) {
56
- U(i, n);
57
- var a = X(i);
58
- function i() {
59
- var o;
60
- Q(this, i);
61
- for (var e = arguments.length, t = new Array(e), r = 0; r < e; r++)
62
- t[r] = arguments[r];
63
- return o = a.call.apply(a, [this].concat(t)), b(D(o), "role", "listbox"), b(D(o), "bindHandlerOptionClick", function(l, d) {
64
- return function(s) {
65
- var c = l, h = o.asProps, _ = h.value, v = h.multiselect;
66
- Array.isArray(_) && (_.includes(l) ? c = _.filter(function(m) {
67
- return m !== l;
68
- }) : c = _.concat(l)), o.handlers.value(c, s), v || (o.handlers.visible(!1), s.preventDefault());
56
+ var RootSelect = /* @__PURE__ */ function(_AbstractDropdown) {
57
+ _inherits(RootSelect2, _AbstractDropdown);
58
+ var _super = _createSuper(RootSelect2);
59
+ function RootSelect2() {
60
+ var _this;
61
+ _classCallCheck(this, RootSelect2);
62
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
63
+ args[_key] = arguments[_key];
64
+ }
65
+ _this = _super.call.apply(_super, [this].concat(args));
66
+ _defineProperty(_assertThisInitialized(_this), "role", "listbox");
67
+ _defineProperty(_assertThisInitialized(_this), "bindHandlerOptionClick", function(optionValue, index) {
68
+ return function(e) {
69
+ var newValue = optionValue;
70
+ var _this$asProps = _this.asProps, value = _this$asProps.value, multiselect = _this$asProps.multiselect;
71
+ if (Array.isArray(value)) {
72
+ if (value.includes(optionValue)) {
73
+ newValue = value.filter(function(v) {
74
+ return v !== optionValue;
75
+ });
76
+ } else {
77
+ newValue = value.concat(optionValue);
78
+ }
79
+ }
80
+ _this.handlers.value(newValue, e);
81
+ if (!multiselect) {
82
+ _this.handlers.visible(false);
83
+ e.preventDefault();
84
+ }
69
85
  };
70
- }), b(D(o), "handlerClear", function(l) {
71
- var d = o.asProps.value, s = $(Array.isArray(d));
72
- o.handlers.value(s, l), o.handlers.visible(!1);
73
- }), o;
86
+ });
87
+ _defineProperty(_assertThisInitialized(_this), "handlerClear", function(e) {
88
+ var value = _this.asProps.value;
89
+ var emptyValue = getEmptyValue(Array.isArray(value));
90
+ _this.handlers.value(emptyValue, e);
91
+ _this.handlers.visible(false);
92
+ });
93
+ return _this;
74
94
  }
75
- return V(i, [{
95
+ _createClass(RootSelect2, [{
76
96
  key: "itemRef",
77
- value: function(e, t, r) {
78
- y(C(i.prototype), "itemRef", this).call(this, e, t, r);
79
- var l = this.asProps.highlightedIndex, d = t === l;
80
- d && this.scrollToNode(r);
97
+ value: function itemRef(props, index, node) {
98
+ _get(_getPrototypeOf(RootSelect2.prototype), "itemRef", this).call(this, props, index, node);
99
+ var highlightedIndex = this.asProps.highlightedIndex;
100
+ var isHighlighted = index === highlightedIndex;
101
+ if (isHighlighted) {
102
+ this.scrollToNode(node);
103
+ }
81
104
  }
82
105
  }, {
83
106
  key: "uncontrolledProps",
84
- value: function() {
85
- var e = this;
86
- return u(u({}, y(C(i.prototype), "uncontrolledProps", this).call(this)), {}, {
87
- visible: [null, function(t) {
88
- if (t === !0) {
89
- var r = k(e.asProps.Children, [p.InputSearch.displayName], !0), l = r ? null : e.props.defaultHighlightedIndex;
90
- e.handlers.highlightedIndex(l), setTimeout(function() {
91
- var d, s, c = (d = e.menuRef.current) === null || d === void 0 ? void 0 : d.querySelectorAll('[role="option"]'), h = (s = e.menuRef.current) === null || s === void 0 ? void 0 : s.querySelector('[aria-selected="true"]');
92
- if (h && c) {
93
- e.scrollToNode(h);
94
- for (var _ = 0; _ < c.length; _++)
95
- if (c[_] === h) {
96
- e.handlers.highlightedIndex(_);
107
+ value: function uncontrolledProps() {
108
+ var _this2 = this;
109
+ return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(RootSelect2.prototype), "uncontrolledProps", this).call(this)), {}, {
110
+ visible: [null, function(visible) {
111
+ if (visible === true) {
112
+ var hasInputSearch = isAdvanceMode(_this2.asProps.Children, [Select.InputSearch.displayName], true);
113
+ var defaultIndex = hasInputSearch ? null : _this2.props.defaultHighlightedIndex;
114
+ _this2.handlers.highlightedIndex(defaultIndex);
115
+ setTimeout(function() {
116
+ var _this2$menuRef$curren, _this2$menuRef$curren2;
117
+ var options = (_this2$menuRef$curren = _this2.menuRef.current) === null || _this2$menuRef$curren === void 0 ? void 0 : _this2$menuRef$curren.querySelectorAll('[role="option"]');
118
+ var selected = (_this2$menuRef$curren2 = _this2.menuRef.current) === null || _this2$menuRef$curren2 === void 0 ? void 0 : _this2$menuRef$curren2.querySelector('[aria-selected="true"]');
119
+ if (selected && options) {
120
+ _this2.scrollToNode(selected);
121
+ for (var i = 0; i < options.length; i++) {
122
+ if (options[i] === selected) {
123
+ _this2.handlers.highlightedIndex(i);
97
124
  break;
98
125
  }
126
+ }
99
127
  }
100
128
  }, 30);
101
129
  }
@@ -105,81 +133,90 @@ var O = /* @__PURE__ */ function(n) {
105
133
  }
106
134
  }, {
107
135
  key: "getTriggerProps",
108
- value: function() {
109
- var e = this, t = this.asProps, r = t.disabled, l = t.visible, d = t.state, s = t.placeholder, c = t.value, h = t.options, _ = t.forwardRef, v = t.name, m = t.multiselect, x = t.getI18nText, P = t.highlightedIndex, A = t.uid, G = t.Children, Z = t.children, R = k(G, [p.Menu.displayName], !0) || !Z, j = R ? "igc-".concat(A, "-list") : "igc-".concat(A, "-popper");
110
- return u(u({}, y(C(i.prototype), "getTriggerProps", this).call(this)), {}, {
111
- onKeyDown: N(this.handlePreventCommonKeyDown.bind(this), this.handleOpenKeyDown.bind(this), this.handleArrowKeyDown.bind(this)),
112
- "aria-controls": l ? j : void 0,
113
- "aria-haspopup": R ? "listbox" : "dialog",
114
- "aria-disabled": r ? "true" : "false",
115
- "aria-activedescendant": l && P !== null && this.itemRefs[P] ? "igc-".concat(A, "-option-").concat(P) : void 0,
116
- empty: ue(c),
117
- value: c,
118
- name: v,
119
- $hiddenRef: _,
120
- multiselect: m,
121
- state: d,
122
- placeholder: s,
123
- disabled: r,
124
- active: l,
136
+ value: function getTriggerProps() {
137
+ var _this3 = this;
138
+ var _this$asProps2 = this.asProps, disabled = _this$asProps2.disabled, visible = _this$asProps2.visible, state = _this$asProps2.state, placeholder = _this$asProps2.placeholder, value = _this$asProps2.value, options = _this$asProps2.options, forwardRef = _this$asProps2.forwardRef, name = _this$asProps2.name, multiselect = _this$asProps2.multiselect, getI18nText = _this$asProps2.getI18nText, highlightedIndex = _this$asProps2.highlightedIndex, uid = _this$asProps2.uid, Children = _this$asProps2.Children, hasChildren = _this$asProps2.children;
139
+ var isMenu = isAdvanceMode(Children, [Select.Menu.displayName], true) || !hasChildren;
140
+ var ariaControls = isMenu ? "igc-".concat(uid, "-list") : "igc-".concat(uid, "-popper");
141
+ return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(RootSelect2.prototype), "getTriggerProps", this).call(this)), {}, {
142
+ onKeyDown: callAllEventHandlers(this.handlePreventCommonKeyDown.bind(this), this.handleOpenKeyDown.bind(this), this.handleArrowKeyDown.bind(this)),
143
+ "aria-controls": visible ? ariaControls : void 0,
144
+ "aria-haspopup": isMenu ? "listbox" : "dialog",
145
+ "aria-disabled": disabled ? "true" : "false",
146
+ "aria-activedescendant": visible && highlightedIndex !== null && this.itemRefs[highlightedIndex] ? "igc-".concat(uid, "-option-").concat(highlightedIndex) : void 0,
147
+ empty: isEmptyValue(value),
148
+ value,
149
+ name,
150
+ $hiddenRef: forwardRef,
151
+ multiselect,
152
+ state,
153
+ placeholder,
154
+ disabled,
155
+ active: visible,
125
156
  onClear: this.handlerClear,
126
- children: this.renderChildrenTrigger(c, h),
127
- getI18nText: x,
128
- onBlur: function() {
129
- e.asProps.visible && (e.prevHighlightedIndex = e.asProps.highlightedIndex, e.handlers.highlightedIndex(null));
157
+ children: this.renderChildrenTrigger(value, options),
158
+ getI18nText,
159
+ onBlur: function onBlur() {
160
+ if (_this3.asProps.visible) {
161
+ _this3.prevHighlightedIndex = _this3.asProps.highlightedIndex;
162
+ _this3.handlers.highlightedIndex(null);
163
+ }
130
164
  },
131
- onFocus: function() {
132
- if (e.asProps.visible) {
133
- var W = e.prevHighlightedIndex;
134
- e.handlers.highlightedIndex(W);
165
+ onFocus: function onFocus() {
166
+ if (_this3.asProps.visible) {
167
+ var index = _this3.prevHighlightedIndex;
168
+ _this3.handlers.highlightedIndex(index);
135
169
  }
136
170
  }
137
171
  });
138
172
  }
139
173
  }, {
140
174
  key: "getListProps",
141
- value: function() {
142
- var e = this.asProps.multiselect;
143
- return u(u({}, y(C(i.prototype), "getListProps", this).call(this)), {}, {
144
- "aria-multiselectable": e ? "true" : void 0
175
+ value: function getListProps() {
176
+ var multiselect = this.asProps.multiselect;
177
+ return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(RootSelect2.prototype), "getListProps", this).call(this)), {}, {
178
+ "aria-multiselectable": multiselect ? "true" : void 0
145
179
  });
146
180
  }
147
181
  }, {
148
182
  key: "getPopperProps",
149
- value: function() {
150
- return u(u({}, y(C(i.prototype), "getPopperProps", this).call(this)), {}, {
151
- onKeyDown: N(this.handlePreventCommonKeyDown.bind(this), this.handlePreventPopperKeyDown.bind(this), this.handleArrowKeyDown.bind(this))
183
+ value: function getPopperProps() {
184
+ return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(RootSelect2.prototype), "getPopperProps", this).call(this)), {}, {
185
+ onKeyDown: callAllEventHandlers(this.handlePreventCommonKeyDown.bind(this), this.handlePreventPopperKeyDown.bind(this), this.handleArrowKeyDown.bind(this))
152
186
  });
153
187
  }
154
188
  }, {
155
189
  key: "getOptionProps",
156
- value: function(e, t) {
157
- var r, l = this, d = this.asProps, s = d.value, c = d.highlightedIndex, h = d.size, _ = h === void 0 ? "m" : h, v = t === c && q.isKeyboard() && !e.disabled, m = (r = e.selected) !== null && r !== void 0 ? r : E(s, e.value);
158
- return u(u({}, y(C(i.prototype), "getItemProps", this).call(this, e, t)), {}, {
159
- highlighted: v,
160
- selected: m,
161
- "aria-selected": m ? "true" : "false",
162
- "aria-disabled": e.disabled ? "true" : "false",
190
+ value: function getOptionProps(props, index) {
191
+ var _props$selected, _this4 = this;
192
+ var _this$asProps3 = this.asProps, value = _this$asProps3.value, highlightedIndex = _this$asProps3.highlightedIndex, _this$asProps3$size = _this$asProps3.size, size = _this$asProps3$size === void 0 ? "m" : _this$asProps3$size;
193
+ var highlighted = index === highlightedIndex && lastInteraction.isKeyboard() && !props.disabled;
194
+ var selected = (_props$selected = props.selected) !== null && _props$selected !== void 0 ? _props$selected : isSelectedOption(value, props.value);
195
+ return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(RootSelect2.prototype), "getItemProps", this).call(this, props, index)), {}, {
196
+ highlighted,
197
+ selected,
198
+ "aria-selected": selected ? "true" : "false",
199
+ "aria-disabled": props.disabled ? "true" : "false",
163
200
  role: "option",
164
- onClick: this.bindHandlerOptionClick(e.value, t),
165
- ref: function(P) {
166
- return l.itemRef(e, t, P);
201
+ onClick: this.bindHandlerOptionClick(props.value, index),
202
+ ref: function ref(node) {
203
+ return _this4.itemRef(props, index, node);
167
204
  },
168
- size: _
205
+ size
169
206
  });
170
207
  }
171
208
  }, {
172
209
  key: "getOptionCheckboxProps",
173
- value: function() {
174
- var e = this.asProps, t = e.size, r = e.resolveColor;
210
+ value: function getOptionCheckboxProps() {
211
+ var _this$asProps4 = this.asProps, size = _this$asProps4.size, resolveColor = _this$asProps4.resolveColor;
175
212
  return {
176
- size: t,
177
- resolveColor: r
213
+ size,
214
+ resolveColor
178
215
  };
179
216
  }
180
217
  }, {
181
218
  key: "getDividerProps",
182
- value: function() {
219
+ value: function getDividerProps() {
183
220
  return {
184
221
  my: 1,
185
222
  "aria-disabled": "true"
@@ -187,126 +224,155 @@ var O = /* @__PURE__ */ function(n) {
187
224
  }
188
225
  }, {
189
226
  key: "renderChildrenTrigger",
190
- value: function(e, t) {
191
- return t ? [].concat(e).reduce(function(r, l) {
192
- var d = t.find(function(s) {
193
- return E(l, s.value);
194
- });
195
- return d && (r.length && r.push(", "), r.push(d.label || d.value)), r;
196
- }, []) : Array.isArray(e) ? e.reduce(function(r, l) {
197
- return r.length && r.push(", "), r.push(l), r;
198
- }, []) : e;
227
+ value: function renderChildrenTrigger(value, options) {
228
+ if (options) {
229
+ return [].concat(value).reduce(function(acc, value2) {
230
+ var selectedOption = options.find(function(o) {
231
+ return isSelectedOption(value2, o.value);
232
+ });
233
+ if (!selectedOption) return acc;
234
+ if (acc.length) acc.push(", ");
235
+ acc.push(selectedOption.label || selectedOption.value);
236
+ return acc;
237
+ }, []);
238
+ }
239
+ return Array.isArray(value) ? value.reduce(function(acc, value2) {
240
+ if (acc.length) acc.push(", ");
241
+ acc.push(value2);
242
+ return acc;
243
+ }, []) : value;
199
244
  }
200
245
  }, {
201
246
  key: "render",
202
- value: function() {
203
- var e = this.asProps, t = this.asProps, r = t.Children, l = t.options, d = t.multiselect;
204
- t.value;
205
- var s = t.uid, c = t.forcedAdvancedMode, h = J(t, ge), _ = c || ie(r, [p.Trigger.displayName, p.Popper.displayName]);
206
- if (oe.warn(l && _, "Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'", h["data-ui-name"] || p.displayName), this.itemProps = [], l) {
207
- var v = this.asProps;
208
- return /* @__PURE__ */ g.createElement(f, S({}, v), /* @__PURE__ */ g.createElement(p.Trigger, h), /* @__PURE__ */ g.createElement(p.Menu, null, l.map(function(m, x) {
209
- return /* @__PURE__ */ g.createElement(p.Option, M({
210
- key: m.value,
211
- id: "igc-".concat(s, "-option-").concat(x)
212
- }, m), d && /* @__PURE__ */ g.createElement(p.Option.Checkbox, null), m.children);
247
+ value: function render() {
248
+ var _ref2 = this.asProps;
249
+ var _this$asProps5 = this.asProps, Children = _this$asProps5.Children, options = _this$asProps5.options, multiselect = _this$asProps5.multiselect;
250
+ _this$asProps5.value;
251
+ var uid = _this$asProps5.uid, forcedAdvancedMode = _this$asProps5.forcedAdvancedMode, other = _objectWithoutProperties(_this$asProps5, _excluded);
252
+ var advancedMode = forcedAdvancedMode || findComponent(Children, [Select.Trigger.displayName, Select.Popper.displayName]);
253
+ logger.warn(options && advancedMode, "Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'", other["data-ui-name"] || Select.displayName);
254
+ this.itemProps = [];
255
+ if (options) {
256
+ var _ref = this.asProps;
257
+ return /* @__PURE__ */ React.createElement(DropdownMenu, assignProps({}, _ref), /* @__PURE__ */ React.createElement(Select.Trigger, other), /* @__PURE__ */ React.createElement(Select.Menu, null, options.map(function(option, index) {
258
+ return /* @__PURE__ */ React.createElement(Select.Option, _extends({
259
+ key: option.value,
260
+ id: "igc-".concat(uid, "-option-").concat(index)
261
+ }, option), multiselect && /* @__PURE__ */ React.createElement(Select.Option.Checkbox, null), option.children);
213
262
  })));
214
263
  }
215
- return /* @__PURE__ */ g.createElement(f, S({}, e), /* @__PURE__ */ g.createElement(r, null));
264
+ return /* @__PURE__ */ React.createElement(DropdownMenu, assignProps({}, _ref2), /* @__PURE__ */ React.createElement(Children, null));
216
265
  }
217
- }]), i;
218
- }(re);
219
- b(O, "displayName", "Select");
220
- b(O, "style", he);
221
- b(O, "enhance", Object.values(ee).concat([le()]));
222
- b(O, "defaultProps", function(n) {
223
- var a, i, o, e, t = n.children && k(n.children, [p.InputSearch.displayName], !0), r = t ? null : 0;
266
+ }]);
267
+ return RootSelect2;
268
+ }(AbstractDropdown);
269
+ _defineProperty(RootSelect, "displayName", "Select");
270
+ _defineProperty(RootSelect, "style", style);
271
+ _defineProperty(RootSelect, "enhance", Object.values(enhance).concat([resolveColorEnhance()]));
272
+ _defineProperty(RootSelect, "defaultProps", function(props) {
273
+ var _props$highlightedInd, _props$selectedIndex, _props$interaction, _props$timeout;
274
+ var hasInputSearch = props.children && isAdvanceMode(props.children, [Select.InputSearch.displayName], true);
275
+ var defaultIndex = hasInputSearch ? null : 0;
224
276
  return {
225
- placeholder: n.multiselect ? "Select options" : "Select option",
277
+ placeholder: props.multiselect ? "Select options" : "Select option",
226
278
  size: "m",
227
- defaultValue: $(n.multiselect),
228
- defaultVisible: !1,
229
- defaultHighlightedIndex: (a = n.highlightedIndex) !== null && a !== void 0 ? a : r,
230
- defaultSelectedIndex: (i = n.selectedIndex) !== null && i !== void 0 ? i : r,
231
- scrollToSelected: !0,
232
- i18n: ce,
279
+ defaultValue: getEmptyValue(props.multiselect),
280
+ defaultVisible: false,
281
+ defaultHighlightedIndex: (_props$highlightedInd = props.highlightedIndex) !== null && _props$highlightedInd !== void 0 ? _props$highlightedInd : defaultIndex,
282
+ defaultSelectedIndex: (_props$selectedIndex = props.selectedIndex) !== null && _props$selectedIndex !== void 0 ? _props$selectedIndex : defaultIndex,
283
+ scrollToSelected: true,
284
+ i18n: localizedMessages,
233
285
  locale: "en",
234
- interaction: (o = n.interaction) !== null && o !== void 0 ? o : "click",
235
- inlineActions: !1,
236
- timeout: (e = n.timeout) !== null && e !== void 0 ? e : 0
286
+ interaction: (_props$interaction = props.interaction) !== null && _props$interaction !== void 0 ? _props$interaction : "click",
287
+ inlineActions: false,
288
+ timeout: (_props$timeout = props.timeout) !== null && _props$timeout !== void 0 ? _props$timeout : 0
237
289
  };
238
290
  });
239
- function pe(n) {
240
- var a = arguments[0], i, o = n.Children, e = n.name, t = n.value, r = n.styles, l = n.$hiddenRef, d = n.tag, s = d === void 0 ? I : d, c = n.getI18nText, h = _e(s), _ = T.Trigger;
241
- return i = w(r), /* @__PURE__ */ g.createElement(_, i.cn("SSelectTrigger", u({}, S({
242
- tag: s,
243
- placeholder: c("selectPlaceholder"),
244
- role: "combobox",
245
- "aria-autocomplete": h && "list" || void 0
246
- }, a))), ae(o, s.Text || I.Text, s.Value || I.Text, s.Addon || I.Addon, !0), e && /* @__PURE__ */ g.createElement("input", i.cn("input", {
247
- type: "hidden",
248
- defaultValue: t,
249
- name: e,
250
- ref: l
291
+ function Trigger(_ref8) {
292
+ var _ref3 = arguments[0], _ref6;
293
+ var Children = _ref8.Children, name = _ref8.name, value = _ref8.value, styles = _ref8.styles, $hiddenRef = _ref8.$hiddenRef, _ref8$tag = _ref8.tag, Tag = _ref8$tag === void 0 ? ButtonTrigger : _ref8$tag, getI18nText = _ref8.getI18nText;
294
+ var hasInputTrigger = isInputTriggerTag(Tag);
295
+ var SSelectTrigger = Dropdown.Trigger;
296
+ return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SSelectTrigger, _ref6.cn("SSelectTrigger", _objectSpread({}, assignProps({
297
+ "tag": Tag,
298
+ "placeholder": getI18nText("selectPlaceholder"),
299
+ "role": "combobox",
300
+ "aria-autocomplete": hasInputTrigger && "list" || void 0
301
+ }, _ref3))), addonTextChildren(Children, Tag.Text || ButtonTrigger.Text, Tag.Value || ButtonTrigger.Text, Tag.Addon || ButtonTrigger.Addon, true), name && /* @__PURE__ */ React.createElement("input", _ref6.cn("input", {
302
+ "type": "hidden",
303
+ "defaultValue": value,
304
+ "name": name,
305
+ "ref": $hiddenRef
251
306
  })));
252
307
  }
253
- var L = /* @__PURE__ */ g.createContext({});
254
- function me(n) {
255
- var a = arguments[0], i, o = T.Item, e = n.styles, t = n.Children, r = k(t, [p.Option.Checkbox.displayName]), l = k(t, [p.Option.Content.displayName]);
256
- return i = w(e), /* @__PURE__ */ g.createElement(o, i.cn("SSelectOption", u({}, S({}, a))), /* @__PURE__ */ g.createElement(L.Provider, {
257
- value: n
258
- }, r && !l ? /* @__PURE__ */ g.createElement(p.Option.Content, null, /* @__PURE__ */ g.createElement(t, i.cn("Children", {}))) : /* @__PURE__ */ g.createElement(t, i.cn("Children", {}))));
308
+ var optionPropsContext = /* @__PURE__ */ React.createContext({});
309
+ function Option(props) {
310
+ var _ref4 = arguments[0], _ref7;
311
+ var SSelectOption = Dropdown.Item;
312
+ var styles = props.styles, Children = props.Children;
313
+ var hasCheckbox = isAdvanceMode(Children, [Select.Option.Checkbox.displayName]);
314
+ var hasContent = isAdvanceMode(Children, [Select.Option.Content.displayName]);
315
+ return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SSelectOption, _ref7.cn("SSelectOption", _objectSpread({}, assignProps({}, _ref4))), /* @__PURE__ */ React.createElement(optionPropsContext.Provider, {
316
+ value: props
317
+ }, hasCheckbox && !hasContent ? /* @__PURE__ */ React.createElement(Select.Option.Content, null, /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {}))) : /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {}))));
259
318
  }
260
- function ve(n) {
261
- var a = g.useContext(L), i = g.useMemo(function() {
262
- return u({
263
- selected: a == null ? void 0 : a.selected,
264
- disabled: a == null ? void 0 : a.disabled,
265
- size: a == null ? void 0 : a.size
266
- }, n || {});
267
- }, [n, a]), o = de(i, i.forwardRef), e = B(o, 2), t = e[0], r = e[1], l = i.size, d = i.theme, s = i.selected, c = i.resolveColor, h = i.indeterminate, _ = w(i.styles), v = _.cn("SOptionCheckbox", {
268
- size: l,
269
- "use:theme": c(d),
270
- indeterminate: h,
271
- selected: s
272
- }), m = v.className, x = v.style;
273
- return /* @__PURE__ */ g.createElement(t, M({}, r, {
274
- className: Y(m, r.className) || void 0,
275
- style: u(u({}, x), r.style),
319
+ function Checkbox(providedProps) {
320
+ var optionProps = React.useContext(optionPropsContext);
321
+ var props = React.useMemo(function() {
322
+ return _objectSpread({
323
+ selected: optionProps === null || optionProps === void 0 ? void 0 : optionProps.selected,
324
+ disabled: optionProps === null || optionProps === void 0 ? void 0 : optionProps.disabled,
325
+ size: optionProps === null || optionProps === void 0 ? void 0 : optionProps.size
326
+ }, providedProps || {});
327
+ }, [providedProps, optionProps]);
328
+ var _useBox = useBox(props, props.forwardRef), _useBox2 = _slicedToArray(_useBox, 2), SOptionCheckbox = _useBox2[0], componentProps = _useBox2[1];
329
+ var size = props.size, theme = props.theme, selected = props.selected, resolveColor = props.resolveColor, indeterminate = props.indeterminate;
330
+ var styles = sstyled(props.styles);
331
+ var _styles$cn = styles.cn("SOptionCheckbox", {
332
+ size,
333
+ "use:theme": resolveColor(theme),
334
+ indeterminate,
335
+ selected
336
+ }), className = _styles$cn.className, style2 = _styles$cn.style;
337
+ return /* @__PURE__ */ React.createElement(SOptionCheckbox, _extends({}, componentProps, {
338
+ className: cn(className, componentProps.className) || void 0,
339
+ style: _objectSpread(_objectSpread({}, style2), componentProps.style),
276
340
  tabIndex: -1
277
341
  }));
278
342
  }
279
- var H = function() {
280
- var a = arguments[0];
281
- return /* @__PURE__ */ g.createElement(z, S({}, a));
282
- }, p = F(O, {
283
- Trigger: [pe, {
284
- Addon: I.Addon,
285
- Text: I.Text
343
+ var InputSearchWrapper = function InputSearchWrapper2() {
344
+ var _ref5 = arguments[0];
345
+ return /* @__PURE__ */ React.createElement(InputSearch, assignProps({}, _ref5));
346
+ };
347
+ var Select = createComponent(RootSelect, {
348
+ Trigger: [Trigger, {
349
+ Addon: ButtonTrigger.Addon,
350
+ Text: ButtonTrigger.Text
286
351
  }],
287
- Popper: T.Popper,
288
- List: f.List,
289
- Menu: f.Menu,
290
- Option: [me, {
291
- Addon: f.Item.Addon,
292
- Content: f.Item.Content,
293
- Hint: f.Item.Hint,
294
- Checkbox: ve
352
+ Popper: Dropdown.Popper,
353
+ List: DropdownMenu.List,
354
+ Menu: DropdownMenu.Menu,
355
+ Option: [Option, {
356
+ Addon: DropdownMenu.Item.Addon,
357
+ Content: DropdownMenu.Item.Content,
358
+ Hint: DropdownMenu.Item.Hint,
359
+ Checkbox
295
360
  }],
296
- Group: T.Group,
297
- OptionTitle: f.ItemTitle,
298
- OptionHint: f.ItemHint,
299
- Divider: ne,
300
- InputSearch: [H, z._______childrenComponents],
301
- Input: [H, z._______childrenComponents]
361
+ Group: Dropdown.Group,
362
+ OptionTitle: DropdownMenu.ItemTitle,
363
+ OptionHint: DropdownMenu.ItemHint,
364
+ Divider,
365
+ InputSearch: [InputSearchWrapper, InputSearch._______childrenComponents],
366
+ Input: [InputSearchWrapper, InputSearch._______childrenComponents]
302
367
  }, {
303
- parent: f,
304
- context: se
305
- }), Qe = function(a) {
306
- return a;
368
+ parent: DropdownMenu,
369
+ context: selectContext
370
+ });
371
+ var wrapSelect = function wrapSelect2(wrapper) {
372
+ return wrapper;
307
373
  };
308
- p.selectedIndexContext = te;
374
+ Select.selectedIndexContext = selectedIndexContext;
309
375
  export {
310
- p as default,
311
- Qe as wrapSelect
376
+ Select as default,
377
+ wrapSelect
312
378
  };