@cashub/ui 0.6.4 → 0.6.6

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.
@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var Heading1 = _styledComponents.default.h1(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h1);\n word-break: break-word;\n white-space: pre;\n\n ", "\n"])), function (_ref) {
16
+ var Heading1 = _styledComponents.default.h1(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h1);\n word-break: break-word;\n white-space: pre-wrap;\n\n ", "\n"])), function (_ref) {
17
17
  var center = _ref.center;
18
18
  return center && 'text-align: center;';
19
19
  });
@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var Heading2 = _styledComponents.default.h2(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h2);\n word-break: break-word;\n white-space: pre;\n\n ", "\n\n ", "\n"])), function (_ref) {
16
+ var Heading2 = _styledComponents.default.h2(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h2);\n word-break: break-word;\n white-space: pre-wrap;\n\n ", "\n\n ", "\n"])), function (_ref) {
17
17
  var center = _ref.center;
18
18
  return center && 'text-align: center;';
19
19
  }, function (_ref2) {
@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var Heading3 = _styledComponents.default.h3(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h3);\n word-break: break-word;\n white-space: pre;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref) {
16
+ var Heading3 = _styledComponents.default.h3(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h3);\n word-break: break-word;\n white-space: pre-wrap;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref) {
17
17
  var center = _ref.center;
18
18
  return center && 'text-align: center;';
19
19
  }, function (_ref2) {
package/index.js CHANGED
@@ -6,7 +6,8 @@ Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
8
  var _exportNames = {
9
- Dropdown: true
9
+ Dropdown: true,
10
+ Tab: true
10
11
  };
11
12
  Object.defineProperty(exports, "Dropdown", {
12
13
  enumerable: true,
@@ -14,6 +15,12 @@ Object.defineProperty(exports, "Dropdown", {
14
15
  return _dropdown.default;
15
16
  }
16
17
  });
18
+ Object.defineProperty(exports, "Tab", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _Tab.default;
22
+ }
23
+ });
17
24
 
18
25
  var _animate = require("./animate");
19
26
 
@@ -477,19 +484,7 @@ Object.keys(_table).forEach(function (key) {
477
484
  });
478
485
  });
479
486
 
480
- var _Tab = require("./Tab");
481
-
482
- Object.keys(_Tab).forEach(function (key) {
483
- if (key === "default" || key === "__esModule") return;
484
- if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
485
- if (key in exports && exports[key] === _Tab[key]) return;
486
- Object.defineProperty(exports, key, {
487
- enumerable: true,
488
- get: function get() {
489
- return _Tab[key];
490
- }
491
- });
492
- });
487
+ var _Tab = _interopRequireDefault(require("./Tab"));
493
488
 
494
489
  var _tagify = require("./tagify");
495
490
 
@@ -575,6 +570,8 @@ Object.keys(_wizard).forEach(function (key) {
575
570
  });
576
571
  });
577
572
 
573
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
574
+
578
575
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
579
576
 
580
577
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cashub/ui",
3
- "version": "0.6.4",
3
+ "version": "0.6.6",
4
4
  "private": false,
5
5
  "author": "CASHUB Team",
6
6
  "description": "CASHUB UI components library",
@@ -0,0 +1,383 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = require("react");
9
+
10
+ var _reactOutsideClickHandler = _interopRequireDefault(require("react-outside-click-handler"));
11
+
12
+ var _useCustomPopper2 = _interopRequireDefault(require("../utils/hooks/useCustomPopper"));
13
+
14
+ var _keycode = _interopRequireDefault(require("../utils/aria/keycode"));
15
+
16
+ var _Input = _interopRequireDefault(require("../form/Input"));
17
+
18
+ var _ListBox = _interopRequireDefault(require("./ListBox"));
19
+
20
+ var _Option = _interopRequireDefault(require("./Option"));
21
+
22
+ var _Options = _interopRequireDefault(require("./Options"));
23
+
24
+ var _jsxRuntime = require("react/jsx-runtime");
25
+
26
+ var _excluded = ["options", "onSelect", "value", "disabled", "onChange"];
27
+
28
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
+
30
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
31
+
32
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
33
+
34
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
35
+
36
+ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
37
+
38
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
39
+
40
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
41
+
42
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
43
+
44
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
45
+
46
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
47
+
48
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
49
+
50
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
51
+
52
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
53
+
54
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
55
+
56
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
57
+
58
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
59
+
60
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
61
+
62
+ var InputSelect = function InputSelect(_ref) {
63
+ var _ref$options = _ref.options,
64
+ options = _ref$options === void 0 ? [] : _ref$options,
65
+ onSelect = _ref.onSelect,
66
+ value = _ref.value,
67
+ disabled = _ref.disabled,
68
+ _onChange = _ref.onChange,
69
+ props = _objectWithoutProperties(_ref, _excluded);
70
+
71
+ var _useState = (0, _react.useState)(false),
72
+ _useState2 = _slicedToArray(_useState, 2),
73
+ displayListBox = _useState2[0],
74
+ setDisplayListBox = _useState2[1];
75
+
76
+ var _useState3 = (0, _react.useState)([]),
77
+ _useState4 = _slicedToArray(_useState3, 2),
78
+ filteredOptions = _useState4[0],
79
+ setFilteredOptions = _useState4[1]; // render時使用的資料
80
+
81
+
82
+ var _useState5 = (0, _react.useState)([]),
83
+ _useState6 = _slicedToArray(_useState5, 2),
84
+ optionList = _useState6[0],
85
+ setOptionList = _useState6[1];
86
+
87
+ var _useState7 = (0, _react.useState)(null),
88
+ _useState8 = _slicedToArray(_useState7, 2),
89
+ focusedOption = _useState8[0],
90
+ setFocusedOption = _useState8[1];
91
+
92
+ var optionsElementRef = (0, _react.useRef)(null);
93
+
94
+ var _useState9 = (0, _react.useState)(null),
95
+ _useState10 = _slicedToArray(_useState9, 2),
96
+ listBoxElement = _useState10[0],
97
+ setListBoxElement = _useState10[1];
98
+
99
+ var _useState11 = (0, _react.useState)(null),
100
+ _useState12 = _slicedToArray(_useState11, 2),
101
+ dropdownElement = _useState12[0],
102
+ setDropdownElement = _useState12[1];
103
+
104
+ var _useState13 = (0, _react.useState)(0),
105
+ _useState14 = _slicedToArray(_useState13, 2),
106
+ listBoxWidth = _useState14[0],
107
+ setListBoxWidth = _useState14[1];
108
+
109
+ var _useCustomPopper = (0, _useCustomPopper2.default)(listBoxElement, dropdownElement),
110
+ styles = _useCustomPopper.styles,
111
+ attributes = _useCustomPopper.attributes,
112
+ state = _useCustomPopper.state,
113
+ update = _useCustomPopper.update;
114
+
115
+ var handleKeyUp = function handleKeyUp(e) {
116
+ var key = e.keyCode;
117
+
118
+ switch (key) {
119
+ case _keycode.default.ENTER:
120
+ if (!displayListBox) {
121
+ handleDisplay();
122
+ } else if (focusedOption) {
123
+ handleClickOption(focusedOption.id);
124
+ }
125
+
126
+ break;
127
+
128
+ case _keycode.default.ESCAPE:
129
+ setDisplayListBox(false);
130
+ break;
131
+
132
+ case _keycode.default.UP:
133
+ {
134
+ if (!focusedOption) return;
135
+ var previousItem = findPreviousItem(focusedOption);
136
+
137
+ if (previousItem) {
138
+ handleFocusItem(previousItem);
139
+ }
140
+
141
+ break;
142
+ }
143
+
144
+ case _keycode.default.DOWN:
145
+ {
146
+ if (!focusedOption) return;
147
+ var nextItem = findNextItem(focusedOption);
148
+
149
+ if (nextItem) {
150
+ handleFocusItem(nextItem);
151
+ }
152
+
153
+ break;
154
+ }
155
+
156
+ case _keycode.default.HOME:
157
+ e.preventDefault();
158
+ focusFirstItem();
159
+ break;
160
+
161
+ case _keycode.default.END:
162
+ {
163
+ e.preventDefault();
164
+ var lastItem = dropdownElement.querySelectorAll('[role="option"]');
165
+
166
+ if (lastItem.length) {
167
+ handleFocusItem(lastItem[lastItem.length - 1]);
168
+ }
169
+
170
+ break;
171
+ }
172
+
173
+ default:
174
+ break;
175
+ }
176
+ };
177
+
178
+ var handleKeyDown = function handleKeyDown(e) {
179
+ var key = e.keyCode;
180
+
181
+ switch (key) {
182
+ case _keycode.default.ENTER:
183
+ case _keycode.default.ESCAPE:
184
+ case _keycode.default.UP:
185
+ case _keycode.default.DOWN:
186
+ case _keycode.default.END:
187
+ case _keycode.default.HOME:
188
+ e.preventDefault();
189
+ break;
190
+
191
+ default:
192
+ break;
193
+ }
194
+ };
195
+
196
+ var findPreviousItem = (0, _react.useCallback)(function (currentItem) {
197
+ var allItem = _toConsumableArray(dropdownElement.querySelectorAll('[role="option"]'));
198
+
199
+ var currentItemIndex = allItem.indexOf(currentItem);
200
+ var previousItem = null;
201
+
202
+ if (currentItemIndex !== -1 && currentItemIndex > 0) {
203
+ previousItem = allItem[currentItemIndex - 1];
204
+ }
205
+
206
+ return previousItem;
207
+ }, [dropdownElement]);
208
+ var findNextItem = (0, _react.useCallback)(function (currentItem) {
209
+ var allItem = _toConsumableArray(dropdownElement.querySelectorAll('[role="option"]'));
210
+
211
+ var currentItemIndex = allItem.indexOf(currentItem);
212
+ var nextItem = null;
213
+
214
+ if (currentItemIndex !== -1 && currentItemIndex !== allItem.length - 1) {
215
+ nextItem = allItem[currentItemIndex + 1];
216
+ }
217
+
218
+ return nextItem;
219
+ }, [dropdownElement]); //set focused option
220
+
221
+ var handleFocusItem = (0, _react.useCallback)(function (element) {
222
+ if (!optionsElementRef.current) return;
223
+ setFocusedOption(element);
224
+ }, []);
225
+ var focusFirstItem = (0, _react.useCallback)(function () {
226
+ var firstItem = dropdownElement.querySelector('[role="option"]');
227
+
228
+ if (firstItem) {
229
+ handleFocusItem(firstItem);
230
+ }
231
+ }, [dropdownElement, handleFocusItem]);
232
+ var setupFocus = (0, _react.useCallback)(function () {
233
+ if (!dropdownElement) return;
234
+ var selectedItem = dropdownElement.querySelector('[aria-selected="true"]');
235
+
236
+ if (selectedItem) {
237
+ handleFocusItem(selectedItem);
238
+ } else if (optionList.length > 0) {
239
+ focusFirstItem();
240
+ }
241
+ }, [dropdownElement, focusFirstItem, handleFocusItem, optionList]);
242
+
243
+ var handleDisplay = function handleDisplay() {
244
+ if (filteredOptions.length > 0) {
245
+ setDisplayListBox(true);
246
+ update();
247
+ }
248
+ };
249
+
250
+ var handleClickOption = (0, _react.useCallback)(function (packageName) {
251
+ if (disabled === true) return;
252
+ onSelect(packageName);
253
+ setDisplayListBox(false);
254
+ }, [onSelect, disabled]); // all option
255
+
256
+ var optionItem = (0, _react.useMemo)(function () {
257
+ return optionList.map(function (option) {
258
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Option.default, {
259
+ role: "option",
260
+ tabIndex: "0",
261
+ id: option.package_name,
262
+ selected: option.selected,
263
+ "aria-selected": option.selected,
264
+ onClick: function onClick() {
265
+ handleClickOption(option.package_name);
266
+ },
267
+ focus: focusedOption && focusedOption.id === option.package_name.toString(),
268
+ children: option.package_name
269
+ }, option.package_name);
270
+ });
271
+ }, [optionList, handleClickOption, focusedOption]); // parse all value to string
272
+ // for subsequently determine whether it is a selected item
273
+
274
+ var parsedSelected = (0, _react.useMemo)(function () {
275
+ if (value || value === 0) {
276
+ return value.toString();
277
+ }
278
+ }, [value]); // observe element resized
279
+
280
+ (0, _react.useEffect)(function () {
281
+ if (!listBoxElement) return;
282
+ setListBoxWidth(listBoxElement.clientWidth);
283
+ }, [listBoxElement]); //過濾搜尋關鍵字資料
284
+
285
+ (0, _react.useEffect)(function () {
286
+ if (!options.length) return;
287
+ var tmpFilteredChildOptions = options.filter(function (option) {
288
+ return option.package_name.toLowerCase().includes(value.toLowerCase());
289
+ });
290
+ setFilteredOptions(tmpFilteredChildOptions);
291
+ }, [options, value]);
292
+ (0, _react.useEffect)(function () {
293
+ if (update) {
294
+ setTimeout(function () {
295
+ update();
296
+ }, 100);
297
+ }
298
+ }, [update, listBoxWidth]); // observe element resized
299
+
300
+ (0, _react.useEffect)(function () {
301
+ if (!listBoxElement) return;
302
+ var resizeObserverInstance = new ResizeObserver(function (entries) {
303
+ var _iterator = _createForOfIteratorHelper(entries),
304
+ _step;
305
+
306
+ try {
307
+ for (_iterator.s(); !(_step = _iterator.n()).done;) {
308
+ var entry = _step.value;
309
+
310
+ if (entry.target) {
311
+ var borderBoxSize = entry.target.clientWidth;
312
+ setListBoxWidth(borderBoxSize);
313
+ }
314
+ }
315
+ } catch (err) {
316
+ _iterator.e(err);
317
+ } finally {
318
+ _iterator.f();
319
+ }
320
+ });
321
+ resizeObserverInstance.observe(listBoxElement);
322
+ return function () {
323
+ resizeObserverInstance.unobserve(listBoxElement);
324
+ };
325
+ }, [listBoxElement]);
326
+ (0, _react.useEffect)(function () {
327
+ var selected = false;
328
+ setOptionList(filteredOptions.map(function (option) {
329
+ if (parsedSelected === option.package_name) {
330
+ selected = true;
331
+ } else {
332
+ selected = false;
333
+ }
334
+
335
+ return _objectSpread(_objectSpread({}, option), {}, {
336
+ selected: selected
337
+ });
338
+ }));
339
+ }, [filteredOptions, parsedSelected]);
340
+ (0, _react.useEffect)(function () {
341
+ if (displayListBox) {
342
+ setupFocus();
343
+ }
344
+ }, [displayListBox, setupFocus, value]);
345
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactOutsideClickHandler.default, {
346
+ onOutsideClick: function onOutsideClick() {
347
+ setDisplayListBox(false);
348
+ },
349
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Input.default, _objectSpread(_objectSpread(_objectSpread({
350
+ autoComplete: "off"
351
+ }, props), {}, {
352
+ onChange: function onChange(e) {
353
+ _onChange(e);
354
+
355
+ if (!displayListBox) setDisplayListBox(true);
356
+ },
357
+ value: value,
358
+ ref: setListBoxElement
359
+ }, attributes.popper), {}, {
360
+ placement: state && state.placement,
361
+ onClick: handleDisplay,
362
+ onKeyUp: handleKeyUp,
363
+ onFocus: function onFocus() {
364
+ setDisplayListBox(true);
365
+ },
366
+ onKeyDown: handleKeyDown
367
+ })), optionItem.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListBox.default, {
368
+ style: styles.popper,
369
+ $display: displayListBox,
370
+ ref: setDropdownElement,
371
+ width: listBoxWidth,
372
+ onKeyUp: handleKeyUp,
373
+ onKeyDown: handleKeyDown,
374
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Options.default, {
375
+ ref: optionsElementRef,
376
+ children: optionItem
377
+ })
378
+ })]
379
+ });
380
+ };
381
+
382
+ var _default = InputSelect;
383
+ exports.default = _default;
package/select/ListBox.js CHANGED
@@ -13,7 +13,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var ListBox = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n visibility: ", ";\n background: var(--color-background1);\n color: var(--color-white);\n border: var(--border-width) solid var(--border-color);\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n width: ", "px;\n z-index: 20;\n"])), function (_ref) {
16
+ var ListBox = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n visibility: ", ";\n background: var(--color-background1);\n color: var(--color-white);\n border: var(--border-width) solid var(--border-color);\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n width: ", "px;\n z-index: 31;\n"])), function (_ref) {
17
17
  var $display = _ref.$display;
18
18
  return $display ? 'visible' : 'hidden';
19
19
  }, function (_ref2) {
package/select/index.js CHANGED
@@ -3,6 +3,12 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ Object.defineProperty(exports, "InputSelect", {
7
+ enumerable: true,
8
+ get: function get() {
9
+ return _InputSelect.default;
10
+ }
11
+ });
6
12
  Object.defineProperty(exports, "Select", {
7
13
  enumerable: true,
8
14
  get: function get() {
@@ -12,4 +18,6 @@ Object.defineProperty(exports, "Select", {
12
18
 
13
19
  var _Select = _interopRequireDefault(require("./Select"));
14
20
 
21
+ var _InputSelect = _interopRequireDefault(require("./InputSelect"));
22
+
15
23
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }