@dreamcommerce/aurora 3.0.0-262 → 3.0.0-264

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 (59) hide show
  1. package/build/cjs/external/fast-equals/dist/esm/index.mjs.js +619 -0
  2. package/build/cjs/external/fast-equals/dist/esm/index.mjs.js.map +1 -0
  3. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js +22 -10
  4. package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js.map +1 -1
  5. package/build/cjs/packages/aurora/src/components/controls/select_control/select_control.js +3 -3
  6. package/build/cjs/packages/aurora/src/components/select/components/select_content.js +35 -43
  7. package/build/cjs/packages/aurora/src/components/select/components/select_content.js.map +1 -1
  8. package/build/cjs/packages/aurora/src/components/select/components/select_group_label.js +4 -4
  9. package/build/cjs/packages/aurora/src/components/select/components/select_item.js +12 -8
  10. package/build/cjs/packages/aurora/src/components/select/components/select_item.js.map +1 -1
  11. package/build/cjs/packages/aurora/src/components/select/components/select_search.js +36 -0
  12. package/build/cjs/packages/aurora/src/components/select/components/select_search.js.map +1 -0
  13. package/build/cjs/packages/aurora/src/components/select/components/select_trigger.js +7 -4
  14. package/build/cjs/packages/aurora/src/components/select/components/select_trigger.js.map +1 -1
  15. package/build/cjs/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js +49 -0
  16. package/build/cjs/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js.map +1 -0
  17. package/build/cjs/packages/aurora/src/components/select/hooks/use_select_value.js +39 -0
  18. package/build/cjs/packages/aurora/src/components/select/hooks/use_select_value.js.map +1 -0
  19. package/build/cjs/packages/aurora/src/components/select/select.js +56 -83
  20. package/build/cjs/packages/aurora/src/components/select/select.js.map +1 -1
  21. package/build/cjs/packages/aurora/src/components/select/select_utils.js +39 -0
  22. package/build/cjs/packages/aurora/src/components/select/select_utils.js.map +1 -0
  23. package/build/esm/external/fast-equals/dist/esm/index.mjs.js +606 -0
  24. package/build/esm/external/fast-equals/dist/esm/index.mjs.js.map +1 -0
  25. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js +22 -10
  26. package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js.map +1 -1
  27. package/build/esm/packages/aurora/src/components/controls/select_control/select_control.js +3 -3
  28. package/build/esm/packages/aurora/src/components/select/components/select_content.js +39 -47
  29. package/build/esm/packages/aurora/src/components/select/components/select_content.js.map +1 -1
  30. package/build/esm/packages/aurora/src/components/select/components/select_group_label.d.ts +2 -2
  31. package/build/esm/packages/aurora/src/components/select/components/select_group_label.js +4 -4
  32. package/build/esm/packages/aurora/src/components/select/components/select_item.js +13 -9
  33. package/build/esm/packages/aurora/src/components/select/components/select_item.js.map +1 -1
  34. package/build/esm/packages/aurora/src/components/select/components/select_search.d.ts +3 -0
  35. package/build/esm/packages/aurora/src/components/select/components/select_search.js +28 -0
  36. package/build/{cjs/packages/aurora/src/components/select/components/select_value.js.map → esm/packages/aurora/src/components/select/components/select_search.js.map} +1 -1
  37. package/build/esm/packages/aurora/src/components/select/components/select_trigger.js +7 -4
  38. package/build/esm/packages/aurora/src/components/select/components/select_trigger.js.map +1 -1
  39. package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.d.ts +4 -0
  40. package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js +45 -0
  41. package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js.map +1 -0
  42. package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.d.ts +5 -0
  43. package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.js +35 -0
  44. package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.js.map +1 -0
  45. package/build/esm/packages/aurora/src/components/select/select.d.ts +1 -1
  46. package/build/esm/packages/aurora/src/components/select/select.js +57 -84
  47. package/build/esm/packages/aurora/src/components/select/select.js.map +1 -1
  48. package/build/esm/packages/aurora/src/components/select/select_types.d.ts +23 -7
  49. package/build/esm/packages/aurora/src/components/select/select_types.js +1 -0
  50. package/build/esm/packages/aurora/src/components/select/select_types.js.map +1 -1
  51. package/build/esm/packages/aurora/src/components/select/select_utils.d.ts +6 -0
  52. package/build/esm/packages/aurora/src/components/select/select_utils.js +35 -0
  53. package/build/esm/packages/aurora/src/components/select/select_utils.js.map +1 -0
  54. package/build/index.css +1 -1
  55. package/package.json +2 -1
  56. package/build/cjs/packages/aurora/src/components/select/components/select_value.js +0 -10
  57. package/build/esm/packages/aurora/src/components/select/components/select_value.d.ts +0 -3
  58. package/build/esm/packages/aurora/src/components/select/components/select_value.js +0 -6
  59. package/build/esm/packages/aurora/src/components/select/components/select_value.js.map +0 -1
@@ -20,17 +20,33 @@ var ColorPickerModeToggler = function ColorPickerModeToggler() {
20
20
  setRadial = _useColorPicker.setRadial,
21
21
  setLinear = _useColorPicker.setLinear,
22
22
  previousSolidColor = _useColorPicker.previousSolidColor,
23
- previousGradientColor = _useColorPicker.previousGradientColor;
23
+ previousGradientColor = _useColorPicker.previousGradientColor,
24
+ color = _useColorPicker.color;
24
25
  var commonClassNames = 'aurora-block aurora-w-6 aurora-h-6 aurora-border aurora-border-solid aurora-rounded-4 aurora-cursor-pointer hover:aurora-border-strong hover:aurora-border-2';
25
26
  var activeClassNames = 'aurora-border-2 aurora-border-solid !aurora-border-active';
27
+ var changeToSolid = function changeToSolid() {
28
+ setSolid(previousSolidColor);
29
+ };
30
+ var changeToLinear = function changeToLinear() {
31
+ if (!isCurrentValueGradient) {
32
+ setLinear(previousGradientColor);
33
+ return;
34
+ }
35
+ setLinear(color.value);
36
+ };
37
+ var changeToRadial = function changeToRadial() {
38
+ if (!isCurrentValueGradient) {
39
+ setRadial(previousGradientColor);
40
+ return;
41
+ }
42
+ setRadial(color.value);
43
+ };
26
44
  return /*#__PURE__*/React.createElement(Stack, {
27
45
  spacing: "1",
28
46
  className: "aurora-flex aurora-list-none"
29
47
  }, /*#__PURE__*/React.createElement(TooltipProvider, null, /*#__PURE__*/React.createElement(Tooltip, null, /*#__PURE__*/React.createElement(TooltipTrigger, null, /*#__PURE__*/React.createElement("button", {
30
48
  type: "button",
31
- onClick: function onClick() {
32
- return setSolid(previousSolidColor);
33
- },
49
+ onClick: changeToSolid,
34
50
  "aria-label": "Color picker solid mode",
35
51
  className: cn('aurora-bg-neutral-700', commonClassNames, !isCurrentValueGradient && activeClassNames)
36
52
  })), /*#__PURE__*/React.createElement(TooltipContent, {
@@ -41,9 +57,7 @@ var ColorPickerModeToggler = function ColorPickerModeToggler() {
41
57
  color: CSS_TEXT_COLOR_TOKENS.inverse
42
58
  }, "".concat(t('Solid')))))), /*#__PURE__*/React.createElement(TooltipProvider, null, /*#__PURE__*/React.createElement(Tooltip, null, /*#__PURE__*/React.createElement(TooltipTrigger, null, /*#__PURE__*/React.createElement("button", {
43
59
  type: "button",
44
- onClick: function onClick() {
45
- return setLinear(previousGradientColor);
46
- },
60
+ onClick: changeToLinear,
47
61
  "aria-label": "Color picker linear gradient mode",
48
62
  className: cn('color-picker-mode-toggler__button_gradient_linear', commonClassNames, gradientType === 'linear-gradient' && activeClassNames)
49
63
  })), /*#__PURE__*/React.createElement(TooltipContent, {
@@ -54,9 +68,7 @@ var ColorPickerModeToggler = function ColorPickerModeToggler() {
54
68
  color: CSS_TEXT_COLOR_TOKENS.inverse
55
69
  }, "".concat(t('Linear gradient')))))), /*#__PURE__*/React.createElement(TooltipProvider, null, /*#__PURE__*/React.createElement(Tooltip, null, /*#__PURE__*/React.createElement(TooltipTrigger, null, /*#__PURE__*/React.createElement("button", {
56
70
  type: "button",
57
- onClick: function onClick() {
58
- return setRadial(previousGradientColor);
59
- },
71
+ onClick: changeToRadial,
60
72
  "aria-label": "Color picker radial gradient mode",
61
73
  className: cn('color-picker-mode-toggler__button_gradient_radial', commonClassNames, gradientType === 'radial-gradient' && activeClassNames)
62
74
  })), /*#__PURE__*/React.createElement(TooltipContent, {
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -7,7 +7,7 @@ import { ErrorList } from '../../error_list/error_list.js';
7
7
  import { Control } from '../../control/control.js';
8
8
  import { Select } from '../../select/select.js';
9
9
 
10
- var _excluded = ["options", "id", "name", "label", "helperText", "tooltip", "placeholder", "searchPlaceholder", "hasSearch", "hasClearValueButton", "errors", "disabled", "defaultValue", "onValueChange", "onScroll", "innerAdditionalContent", "required"];
10
+ var _excluded = ["options", "id", "name", "label", "helperText", "tooltip", "placeholder", "searchPlaceholder", "hasSearch", "hasClearValueButton", "errors", "disabled", "value", "onValueChange", "onScroll", "innerAdditionalContent", "required"];
11
11
  var SelectControl = function SelectControl(_ref) {
12
12
  var options = _ref.options,
13
13
  id = _ref.id,
@@ -21,7 +21,7 @@ var SelectControl = function SelectControl(_ref) {
21
21
  hasClearValueButton = _ref.hasClearValueButton,
22
22
  errors = _ref.errors,
23
23
  disabled = _ref.disabled,
24
- defaultValue = _ref.defaultValue,
24
+ value = _ref.value,
25
25
  onValueChange = _ref.onValueChange,
26
26
  onScroll = _ref.onScroll,
27
27
  innerAdditionalContent = _ref.innerAdditionalContent,
@@ -36,7 +36,6 @@ var SelectControl = function SelectControl(_ref) {
36
36
  }, label)) : null, /*#__PURE__*/React.createElement(Select, _objectSpread2({
37
37
  id: id,
38
38
  name: name,
39
- defaultValue: defaultValue,
40
39
  options: options,
41
40
  disabled: disabled,
42
41
  placeholder: placeholder,
@@ -45,6 +44,7 @@ var SelectControl = function SelectControl(_ref) {
45
44
  innerAdditionalContent: innerAdditionalContent,
46
45
  hasClearValueButton: hasClearValueButton,
47
46
  errors: errors,
47
+ value: value,
48
48
  onValueChange: onValueChange,
49
49
  onScroll: onScroll
50
50
  }, props)), helperText ? /*#__PURE__*/React.createElement(HelperText, {
@@ -1,89 +1,81 @@
1
- import React, { useRef, useState } from 'react';
2
- import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, defineProperty as _defineProperty } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
1
+ import React from 'react';
2
+ import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
3
3
  import { cn } from '../../../utilities/cn.js';
4
- import { Input } from '../../input/input.js';
5
- import { Portal, Content, Viewport } from '@radix-ui/react-select';
6
- import { Root, Viewport as Viewport$1, Scrollbar, Thumb } from '../../../../../../external/@radix-ui/react-scroll-area/dist/index.mjs.js';
7
- import { SearchLineIcon } from '../../../assets/icons/search_icon.js';
4
+ import { Portal, Content, Viewport as Viewport$1 } from '@radix-ui/react-select';
5
+ import { Root, Viewport, Scrollbar, Thumb } from '../../../../../../external/@radix-ui/react-scroll-area/dist/index.mjs.js';
8
6
  import { SelectGroupLabel } from './select_group_label.js';
9
7
  import { SelectItem } from './select_item.js';
8
+ import { SelectSearch } from './select_search.js';
9
+ import { SelectUtils } from '../select_utils.js';
10
10
 
11
- var _excluded = ["className", "options", "selectedValue", "hasSearch", "searchPlaceholder", "filterTerm", "setFilterTerm", "innerAdditionalContent", "triggerWidth", "position", "onScroll"];
11
+ var _excluded = ["className", "options", "hasSearch", "searchPlaceholder", "search", "onSearch", "innerAdditionalContent", "position", "onScroll", "enableLocalSearch", "localSearchNotFoundContent"];
12
12
  var SelectContent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
13
13
  var className = _ref.className,
14
14
  options = _ref.options,
15
- selectedValue = _ref.selectedValue,
16
15
  hasSearch = _ref.hasSearch,
17
16
  searchPlaceholder = _ref.searchPlaceholder,
18
- filterTerm = _ref.filterTerm,
19
- setFilterTerm = _ref.setFilterTerm,
17
+ search = _ref.search,
18
+ onSearch = _ref.onSearch,
20
19
  innerAdditionalContent = _ref.innerAdditionalContent,
21
- triggerWidth = _ref.triggerWidth,
22
20
  _ref$position = _ref.position,
23
21
  position = _ref$position === void 0 ? 'popper' : _ref$position,
24
22
  onScroll = _ref.onScroll,
23
+ enableLocalSearch = _ref.enableLocalSearch,
24
+ localSearchNotFoundContent = _ref.localSearchNotFoundContent,
25
25
  props = _objectWithoutProperties(_ref, _excluded);
26
- var inputRef = useRef(null);
27
- var _useState = useState(false),
28
- _useState2 = _slicedToArray(_useState, 2),
29
- isHovered = _useState2[0],
30
- setIsHovered = _useState2[1];
26
+ var localSearchVisibleItems = 0;
31
27
  return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(Content, _objectSpread2({
32
28
  ref: ref,
33
- style: {
34
- width: triggerWidth ? "".concat(triggerWidth, "px") : 'auto'
35
- },
36
- className: cn('aurora-relative aurora-z-[1000] aurora-max-h-96 aurora-min-w-[fit-content] aurora-overflow-y-hidden aurora-rounded-8 aurora-border aurora-bg-neutral-0 aurora-text-s aurora-shadow-m data-[state=open]:aurora-animate-in data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-0 data-[state=open]:aurora-fade-in-0 data-[state=closed]:aurora-zoom-out-95 data-[state=open]:aurora-zoom-in-95 data-[side=bottom]:aurora-slide-in-from-top-2 data-[side=left]:aurora-slide-in-from-right-2 data-[side=right]:aurora-slide-in-from-left-2 data-[side=top]:aurora-slide-in-from-bottom-2 aurora-p-1 js__aurora-select-dropdown', position === 'popper' && 'data-[side=bottom]:aurora-translate-y-1 data-[side=left]:-aurora-translate-x-1 data-[side=right]:aurora-translate-x-1 data-[side=top]:-aurora-translate-y-1', className),
37
- position: position,
38
- onMouseEnter: function onMouseEnter() {
39
- return setIsHovered(true);
40
- },
41
- onMouseLeave: function onMouseLeave() {
42
- return setIsHovered(false);
43
- }
29
+ className: cn('aurora-w-[--radix-select-trigger-width] aurora-relative aurora-z-[1000] aurora-min-w-[20rem] aurora-max-h-96 aurora-overflow-y-hidden aurora-rounded-8 aurora-border aurora-bg-neutral-0 aurora-text-s aurora-shadow-m data-[state=open]:aurora-animate-in data-[state=closed]:aurora-animate-out data-[state=closed]:aurora-fade-out-0 data-[state=open]:aurora-fade-in-0 data-[state=closed]:aurora-zoom-out-95 data-[state=open]:aurora-zoom-in-95 data-[side=bottom]:aurora-slide-in-from-top-2 data-[side=left]:aurora-slide-in-from-right-2 data-[side=right]:aurora-slide-in-from-left-2 data-[side=top]:aurora-slide-in-from-bottom-2 aurora-p-1 js__aurora-select-dropdown aurora-group', position === 'popper' && 'data-[side=bottom]:aurora-translate-y-1 data-[side=left]:-aurora-translate-x-1 data-[side=right]:aurora-translate-x-1 data-[side=top]:-aurora-translate-y-1', className),
30
+ position: position
44
31
  }, props), /*#__PURE__*/React.createElement(Root, {
45
32
  type: "auto",
46
33
  className: "aurora-w-full aurora-max-h-60 relative"
47
34
  }, /*#__PURE__*/React.createElement(Viewport, {
48
- asChild: true
49
- }, /*#__PURE__*/React.createElement(Viewport$1, {
50
35
  className: cn('aurora-p-1 aurora-max-h-60 aurora-w-full'),
51
36
  onScroll: onScroll
52
37
  }, hasSearch && (/*#__PURE__*/React.createElement("div", {
53
38
  className: "aurora-p-2"
54
- }, /*#__PURE__*/React.createElement(Input, {
55
- type: "text",
56
- preElement: /*#__PURE__*/React.createElement(SearchLineIcon, {
57
- className: "aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light"
58
- }),
59
- value: filterTerm,
60
- tabIndex: 0,
39
+ }, /*#__PURE__*/React.createElement(SelectSearch, {
40
+ value: search,
61
41
  onChange: function onChange(e) {
62
42
  e.stopPropagation();
63
- setFilterTerm === null || setFilterTerm === void 0 ? void 0 : setFilterTerm(e.target.value);
43
+ onSearch === null || onSearch === void 0 ? void 0 : onSearch(e.target.value);
64
44
  },
65
45
  onKeyDown: function onKeyDown(e) {
66
46
  e.stopPropagation();
67
47
  },
68
48
  placeholder: searchPlaceholder,
69
- ref: inputRef
70
- }))), options === null || options === void 0 ? void 0 : options.map(function (option, index) {
71
- var isSelected = selectedValue ? option.value === selectedValue : false;
49
+ options: options
50
+ }))), /*#__PURE__*/React.createElement(Viewport$1, {
51
+ className: "aurora-flex aurora-flex-col aurora-gap-1"
52
+ }, options === null || options === void 0 ? void 0 : options.map(function (option, index) {
53
+ var visible = true;
54
+ if (enableLocalSearch && hasSearch && search && !option.isHeader) {
55
+ visible = SelectUtils.localSearchIsOptionVisible(option, search);
56
+ if (visible) localSearchVisibleItems++;
57
+ }
58
+ if (enableLocalSearch && hasSearch && search && option.isHeader) {
59
+ visible = SelectUtils.localSearchIsHeaderVisible(search, options, index);
60
+ }
72
61
  return option.isHeader ? (/*#__PURE__*/React.createElement(SelectGroupLabel, {
73
- key: "select-label-".concat(option.text, "-").concat(index)
62
+ key: "select-label-".concat(option.text, "-").concat(index),
63
+ className: cn(!visible && 'aurora-hidden')
74
64
  }, option.text)) : (/*#__PURE__*/React.createElement(SelectItem, {
75
65
  key: "select-item-".concat(option.value, "-").concat(index),
76
- value: "".concat(option.value, "-").concat(index),
77
- isSelected: isSelected,
66
+ value: option.value,
78
67
  isDisabled: option.isDisabled,
79
68
  isReadonly: option.isReadonly,
80
- additionalInfo: option.additionalInfo
69
+ additionalInfo: option.additionalInfo,
70
+ className: cn(!visible && 'aurora-hidden')
81
71
  }, option.text));
82
- }), innerAdditionalContent && /*#__PURE__*/React.createElement("div", {
72
+ })), enableLocalSearch && !!localSearchNotFoundContent && !!search && !localSearchVisibleItems && (/*#__PURE__*/React.createElement("div", {
73
+ className: "aurora-p-2"
74
+ }, localSearchNotFoundContent)), innerAdditionalContent && /*#__PURE__*/React.createElement("div", {
83
75
  className: "aurora-p-2"
84
- }, innerAdditionalContent))), /*#__PURE__*/React.createElement(Scrollbar, {
76
+ }, innerAdditionalContent)), /*#__PURE__*/React.createElement(Scrollbar, {
85
77
  orientation: "vertical",
86
- className: cn('aurora-w-2 aurora-absolute aurora-right-0 aurora-top-0 aurora-bottom-0 aurora-py-1 aurora-pr-[2px] aurora-transition-opacity aurora-duration-200', _defineProperty(_defineProperty(_defineProperty({}, 'aurora-pt-16', hasSearch), 'aurora-opacity-75', isHovered), 'aurora-opacity-0', !isHovered))
78
+ className: cn('aurora-w-2 aurora-absolute aurora-right-0 aurora-top-0 aurora-bottom-0 aurora-py-1 aurora-pr-[2px] aurora-transition-opacity aurora-duration-200 aurora-opacity-0 group-hover:aurora-opacity-75')
87
79
  }, /*#__PURE__*/React.createElement(Thumb, {
88
80
  className: "aurora-bg-neutral-700 aurora-rounded-full"
89
81
  })))));
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,+DAA+D,0EAA8E;AAC7I;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,iDAAiD,0EAA8E;AAC/H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -1,6 +1,6 @@
1
1
  import React, { PropsWithChildren } from 'react';
2
- import { TDividerProps } from "../../divider/divider_types";
2
+ import { TBoxProps } from "../../box/box_types";
3
3
  export declare const SelectGroupLabel: {
4
- ({ children, ...props }: PropsWithChildren<TDividerProps>): React.JSX.Element;
4
+ ({ children, ...props }: PropsWithChildren<TBoxProps>): React.JSX.Element;
5
5
  displayName: string;
6
6
  };
@@ -9,22 +9,22 @@ var _excluded = ["children"];
9
9
  var SelectGroupLabel = function SelectGroupLabel(_ref) {
10
10
  var children = _ref.children,
11
11
  props = _objectWithoutProperties(_ref, _excluded);
12
- return /*#__PURE__*/React.createElement(Box, {
12
+ return /*#__PURE__*/React.createElement(Box, _objectSpread2({
13
13
  paddings: {
14
14
  pl: '2',
15
15
  pt: '2',
16
16
  pb: '2',
17
17
  pr: '0'
18
18
  }
19
- }, /*#__PURE__*/React.createElement(Stack, {
19
+ }, props), /*#__PURE__*/React.createElement(Stack, {
20
20
  align: "center",
21
21
  spacing: "2.5"
22
22
  }, /*#__PURE__*/React.createElement(Typography, {
23
- className: "aurora-whitespace-nowrap",
23
+ className: "aurora-whitespace-nowrap first-letter:aurora-uppercase",
24
24
  size: "s",
25
25
  color: "subtle",
26
26
  weight: "bold"
27
- }, children), /*#__PURE__*/React.createElement(Divider, _objectSpread2({}, props))));
27
+ }, children), /*#__PURE__*/React.createElement(Divider, null)));
28
28
  };
29
29
  SelectGroupLabel.displayName = 'SelectGroupLabel';
30
30
 
@@ -2,28 +2,32 @@ import React from 'react';
2
2
  import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
3
3
  import { cn } from '../../../utilities/cn.js';
4
4
  import { CheckLineIcon } from '../../../assets/icons/check_icon.js';
5
- import { Item, ItemText } from '@radix-ui/react-select';
5
+ import { Item, ItemIndicator, ItemText } from '@radix-ui/react-select';
6
6
 
7
- var _excluded = ["children", "className", "isDisabled", "isReadonly", "isSelected", "additionalInfo"];
7
+ var _excluded = ["children", "className", "isDisabled", "isReadonly", "additionalInfo"];
8
8
  var SelectItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
9
9
  var children = _ref.children,
10
10
  className = _ref.className,
11
11
  isDisabled = _ref.isDisabled,
12
12
  isReadonly = _ref.isReadonly,
13
- isSelected = _ref.isSelected,
14
13
  additionalInfo = _ref.additionalInfo,
15
14
  props = _objectWithoutProperties(_ref, _excluded);
16
15
  return /*#__PURE__*/React.createElement(Item, _objectSpread2(_objectSpread2({
17
- className: cn('aurora-relative aurora-flex aurora-w-full aurora-rounded-6 aurora-cursor-default aurora-select-none aurora-items-center aurora-rounded-sm aurora-py-1.5 aurora-pl-9 aurora-pr-8 aurora-text-sm aurora-outline-none active:aurora-bg-active focus:aurora-bg-accent focus:aurora-text-accent-foreground data-[disabled]:aurora-pointer-events-none data-[disabled]:aurora-opacity-50 hover:aurora-bg-hover', {
18
- 'aurora-cursor-pointer active:aurora-bg-active': !isDisabled && !isReadonly,
19
- 'aurora-bg-hover aurora-font-semibold': isSelected
16
+ className: cn('aurora-relative aurora-flex aurora-w-full aurora-rounded-6 aurora-cursor-default aurora-select-none aurora-items-center aurora-rounded-sm aurora-py-1.5 aurora-pl-9 aurora-pr-8 aurora-text-s aurora-outline-none aurora-break-words aurora-text-wrap focus:aurora-bg-hover focus:aurora-text-accent-foreground data-[disabled]:aurora-pointer-events-none data-[disabled]:aurora-opacity-50 hover:aurora-bg-hover data-[state=checked]:aurora-bg-hover data-[state=checked]:aurora-font-semibold', {
17
+ 'aurora-cursor-pointer active:aurora-bg-active': !isDisabled && !isReadonly
20
18
  }, className),
19
+ style: {
20
+ wordBreak: 'break-word'
21
+ },
21
22
  disabled: isDisabled || isReadonly
22
23
  }, props), {}, {
23
- ref: ref
24
- }), isSelected && /*#__PURE__*/React.createElement(CheckLineIcon, {
24
+ ref: ref,
25
+ onPointerMove: function onPointerMove(e) {
26
+ e.preventDefault();
27
+ }
28
+ }), /*#__PURE__*/React.createElement(ItemIndicator, null, /*#__PURE__*/React.createElement(CheckLineIcon, {
25
29
  className: "aurora-h-5 aurora-w-5 -aurora-ml-7 aurora-mr-2"
26
- }), /*#__PURE__*/React.createElement("div", {
30
+ })), /*#__PURE__*/React.createElement("div", {
27
31
  className: "aurora-flex aurora-flex-col"
28
32
  }, /*#__PURE__*/React.createElement(ItemText, null, children), !!additionalInfo && /*#__PURE__*/React.createElement("p", {
29
33
  className: "aurora-text-xs aurora-text-subtle-light"
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { TSelectSearchProps } from '../select_types';
3
+ export declare const SelectSearch: ({ options, ...props }: TSelectSearchProps) => React.JSX.Element;
@@ -0,0 +1,28 @@
1
+ import React, { useRef } from 'react';
2
+ import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
3
+ import { Input } from '../../input/input.js';
4
+ import { SearchLineIcon } from '../../../assets/icons/search_icon.js';
5
+ import { usePreventSearchBlur } from '../hooks/use_prevent_search_blur.js';
6
+
7
+ var _excluded = ["options"];
8
+ var SelectSearch = function SelectSearch(_ref) {
9
+ var options = _ref.options,
10
+ props = _objectWithoutProperties(_ref, _excluded);
11
+ var inputRef = useRef(null);
12
+ var _usePreventSearchBlur = usePreventSearchBlur({
13
+ options: options,
14
+ inputRef: inputRef
15
+ }),
16
+ handleBlur = _usePreventSearchBlur.handleBlur;
17
+ return /*#__PURE__*/React.createElement(Input, _objectSpread2({
18
+ ref: inputRef,
19
+ type: "text",
20
+ preElement: /*#__PURE__*/React.createElement(SearchLineIcon, {
21
+ className: "aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light"
22
+ }),
23
+ onBlur: handleBlur
24
+ }, props));
25
+ };
26
+
27
+ export { SelectSearch };
28
+ //# sourceMappingURL=select_search.js.map
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -4,22 +4,25 @@ import { cn } from '../../../utilities/cn.js';
4
4
  import { ArrowDownSFillIcon } from '../../../assets/icons/arrow_down_s_fill.js';
5
5
  import { Trigger, Icon } from '@radix-ui/react-select';
6
6
 
7
- var _excluded = ["className", "hasError", "children"];
7
+ var _excluded = ["className", "hasError", "children", "clearValueButton"];
8
8
  var SelectTrigger = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
9
9
  var className = _ref.className,
10
10
  hasError = _ref.hasError,
11
11
  children = _ref.children,
12
+ clearValueButton = _ref.clearValueButton,
12
13
  props = _objectWithoutProperties(_ref, _excluded);
13
14
  return /*#__PURE__*/React.createElement(Trigger, _objectSpread2({
14
15
  ref: ref,
15
- className: cn('aurora-flex aurora-h-10 aurora-w-full aurora-items-center aurora-justify-between aurora-rounded-8 aurora-border aurora-border-input aurora-bg-neutral-0 aurora-px-3 aurora-py-2 aurora-text-s hover:aurora-border-strong focus:focus disabled:aurora-cursor-not-allowed disabled:aurora-bg-subtle disabled:aurora-text-subtle-light disabled:aurora-border-subtle [&>span]:aurora-line-clamp-1 focus:aurora-border-active focus:aurora-border-2 active:aurora-border-active active:aurora-border-2', {
16
+ className: cn('aurora-flex aurora-h-10 aurora-w-full aurora-items-center aurora-justify-between aurora-rounded-8 aurora-border aurora-border-input aurora-bg-neutral-0 aurora-px-3 aurora-py-2 aurora-text-s hover:aurora-border-strong focus-visible:focus disabled:aurora-cursor-not-allowed disabled:aurora-bg-subtle disabled:aurora-text-subtle-light disabled:aurora-border-subtle [&>span]:aurora-text-ellipsis [&>span]:aurora-whitespace-nowrap [&>span]:aurora-overflow-hidden focus-visible:aurora-border-active -visible:aurora-border-2 data-[state=open]:aurora-border-active data-[state=open]:aurora-border-2', {
16
17
  '!aurora-border-danger aurora-border-2': hasError
17
18
  }, className)
18
- }, props), children, /*#__PURE__*/React.createElement(Icon, {
19
+ }, props), children, /*#__PURE__*/React.createElement("div", {
20
+ className: "aurora-flex aurora-flex-none aurora-items-center"
21
+ }, clearValueButton, /*#__PURE__*/React.createElement(Icon, {
19
22
  asChild: true
20
23
  }, /*#__PURE__*/React.createElement(ArrowDownSFillIcon, {
21
24
  className: "aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light"
22
- })));
25
+ }))));
23
26
  });
24
27
  SelectTrigger.displayName = Trigger.displayName;
25
28
 
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,4 @@
1
+ import { TUsePreventSearchBlurProps } from "../select_types";
2
+ export declare const usePreventSearchBlur: ({ options, inputRef }: TUsePreventSearchBlurProps) => {
3
+ handleBlur: () => void;
4
+ };
@@ -0,0 +1,45 @@
1
+ import { useMemo, useRef, useCallback, useLayoutEffect } from 'react';
2
+ import { deepEqual } from '../../../../../../external/fast-equals/dist/esm/index.mjs.js';
3
+
4
+ var BLUR_GUARD_TIMEOUT = 100;
5
+ var usePreventSearchBlur = function usePreventSearchBlur(_ref) {
6
+ var options = _ref.options,
7
+ inputRef = _ref.inputRef;
8
+ // SHOPSVE-1360 (bardzo slaby hack)
9
+ // Radix w momencie usuniecia z dom aktualnie wybranego itemu przenosi focus na body
10
+ var blurGuardRef = useRef(false);
11
+ var handleBlur = useCallback(function () {
12
+ var _inputRef$current;
13
+ if (!blurGuardRef.current) return;
14
+ (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
15
+ }, [inputRef]);
16
+ var optionsRef = useRef();
17
+ var timeoutRef = useRef();
18
+ // Uzycie useLayoutEffect ze wzgledu na to ze itemy na liscie moga sie zmienic po dluzszym czasie po wpisaniu w search
19
+ // np. moga byc wczytane z serwera
20
+ // Wiec nie mozemy sie podpiac pod onKeyDown i wtedy ustawiac timeout
21
+ useLayoutEffect(function () {
22
+ if (optionsRef.current === undefined) {
23
+ optionsRef.current = options;
24
+ return;
25
+ }
26
+ if (!deepEqual(optionsRef.current, options)) {
27
+ optionsRef.current = options;
28
+ blurGuardRef.current = true;
29
+ timeoutRef.current = setTimeout(function () {
30
+ blurGuardRef.current = false;
31
+ }, BLUR_GUARD_TIMEOUT);
32
+ }
33
+ return function () {
34
+ return timeoutRef.current && clearTimeout(timeoutRef.current);
35
+ };
36
+ }, [options]);
37
+ return useMemo(function () {
38
+ return {
39
+ handleBlur: handleBlur
40
+ };
41
+ }, [handleBlur]);
42
+ };
43
+
44
+ export { usePreventSearchBlur };
45
+ //# sourceMappingURL=use_prevent_search_blur.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,0BAA0B,8DAAkE;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -0,0 +1,5 @@
1
+ import { TSelectOption, TUseSelectValueProps } from "../select_types";
2
+ export declare const useSelectValue: ({ value, options }: TUseSelectValueProps) => {
3
+ selectedOption: TSelectOption | undefined;
4
+ setSelectedOption: (option: TSelectOption | undefined) => void;
5
+ };
@@ -0,0 +1,35 @@
1
+ import { useMemo, useState, useRef, useCallback, useEffect } from 'react';
2
+ import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
3
+ import { SelectUtils } from '../select_utils.js';
4
+
5
+ var useSelectValue = function useSelectValue(_ref) {
6
+ var value = _ref.value,
7
+ options = _ref.options;
8
+ // Przechowanie aktualnie wybranej opcji w razie jakby przy wyszukiwaniu aktualna opcja zniknela z listy options
9
+ var _useState = useState(function () {
10
+ return SelectUtils.findValueInOptions(value, options);
11
+ }),
12
+ _useState2 = _slicedToArray(_useState, 2),
13
+ selectedOption = _useState2[0],
14
+ _setSelectedOption = _useState2[1];
15
+ var selectedOptionRef = useRef(selectedOption);
16
+ var setSelectedOption = useCallback(function (option) {
17
+ selectedOptionRef.current = option;
18
+ _setSelectedOption(option);
19
+ }, []);
20
+ useEffect(function () {
21
+ var _selectedOptionRef$cu;
22
+ if (value === ((_selectedOptionRef$cu = selectedOptionRef.current) === null || _selectedOptionRef$cu === void 0 ? void 0 : _selectedOptionRef$cu.value)) return;
23
+ var option = SelectUtils.findValueInOptions(value, options);
24
+ setSelectedOption(option);
25
+ }, [options, setSelectedOption, value]);
26
+ return useMemo(function () {
27
+ return {
28
+ selectedOption: selectedOption,
29
+ setSelectedOption: setSelectedOption
30
+ };
31
+ }, [selectedOption, setSelectedOption]);
32
+ };
33
+
34
+ export { useSelectValue };
35
+ //# sourceMappingURL=use_select_value.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
@@ -1,6 +1,6 @@
1
1
  import React, { PropsWithChildren } from 'react';
2
2
  import { TSelectProps } from './select_types';
3
3
  export declare const Select: {
4
- ({ children, id, defaultValue, options, disabled, placeholder, hasSearch, searchPlaceholder, hasClearValueButton, innerAdditionalContent, errors, onValueChange, onScroll, ...props }: PropsWithChildren<TSelectProps>): React.JSX.Element;
4
+ ({ children, id, value, options, disabled, placeholder, hasSearch, searchPlaceholder, hasClearValueButton, innerAdditionalContent, enableLocalSearch, localSearchNotFoundContent, errors, onValueChange, onScroll, onSearch, onClose, hasError, ...props }: PropsWithChildren<TSelectProps>): React.JSX.Element;
5
5
  displayName: string | undefined;
6
6
  };