@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.
- package/build/cjs/external/fast-equals/dist/esm/index.mjs.js +619 -0
- package/build/cjs/external/fast-equals/dist/esm/index.mjs.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js +22 -10
- package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/controls/select_control/select_control.js +3 -3
- package/build/cjs/packages/aurora/src/components/select/components/select_content.js +35 -43
- package/build/cjs/packages/aurora/src/components/select/components/select_content.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/select/components/select_group_label.js +4 -4
- package/build/cjs/packages/aurora/src/components/select/components/select_item.js +12 -8
- package/build/cjs/packages/aurora/src/components/select/components/select_item.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/select/components/select_search.js +36 -0
- package/build/cjs/packages/aurora/src/components/select/components/select_search.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/select/components/select_trigger.js +7 -4
- package/build/cjs/packages/aurora/src/components/select/components/select_trigger.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js +49 -0
- package/build/cjs/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/select/hooks/use_select_value.js +39 -0
- package/build/cjs/packages/aurora/src/components/select/hooks/use_select_value.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/select/select.js +56 -83
- package/build/cjs/packages/aurora/src/components/select/select.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/select/select_utils.js +39 -0
- package/build/cjs/packages/aurora/src/components/select/select_utils.js.map +1 -0
- package/build/esm/external/fast-equals/dist/esm/index.mjs.js +606 -0
- package/build/esm/external/fast-equals/dist/esm/index.mjs.js.map +1 -0
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js +22 -10
- package/build/esm/packages/aurora/src/components/color_picker/components/color_picker_mode_toggler.js.map +1 -1
- package/build/esm/packages/aurora/src/components/controls/select_control/select_control.js +3 -3
- package/build/esm/packages/aurora/src/components/select/components/select_content.js +39 -47
- package/build/esm/packages/aurora/src/components/select/components/select_content.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/components/select_group_label.d.ts +2 -2
- package/build/esm/packages/aurora/src/components/select/components/select_group_label.js +4 -4
- package/build/esm/packages/aurora/src/components/select/components/select_item.js +13 -9
- package/build/esm/packages/aurora/src/components/select/components/select_item.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/components/select_search.d.ts +3 -0
- package/build/esm/packages/aurora/src/components/select/components/select_search.js +28 -0
- 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
- package/build/esm/packages/aurora/src/components/select/components/select_trigger.js +7 -4
- package/build/esm/packages/aurora/src/components/select/components/select_trigger.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.d.ts +4 -0
- package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js +45 -0
- package/build/esm/packages/aurora/src/components/select/hooks/use_prevent_search_blur.js.map +1 -0
- package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.d.ts +5 -0
- package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.js +35 -0
- package/build/esm/packages/aurora/src/components/select/hooks/use_select_value.js.map +1 -0
- package/build/esm/packages/aurora/src/components/select/select.d.ts +1 -1
- package/build/esm/packages/aurora/src/components/select/select.js +57 -84
- package/build/esm/packages/aurora/src/components/select/select.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/select_types.d.ts +23 -7
- package/build/esm/packages/aurora/src/components/select/select_types.js +1 -0
- package/build/esm/packages/aurora/src/components/select/select_types.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/select_utils.d.ts +6 -0
- package/build/esm/packages/aurora/src/components/select/select_utils.js +35 -0
- package/build/esm/packages/aurora/src/components/select/select_utils.js.map +1 -0
- package/build/index.css +1 -1
- package/package.json +2 -1
- package/build/cjs/packages/aurora/src/components/select/components/select_value.js +0 -10
- package/build/esm/packages/aurora/src/components/select/components/select_value.d.ts +0 -3
- package/build/esm/packages/aurora/src/components/select/components/select_value.js +0 -6
- 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:
|
|
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:
|
|
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:
|
|
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", "
|
|
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
|
-
|
|
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
|
|
2
|
-
import { objectWithoutProperties as _objectWithoutProperties,
|
|
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 {
|
|
5
|
-
import {
|
|
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", "
|
|
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
|
-
|
|
19
|
-
|
|
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
|
|
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
|
-
|
|
34
|
-
|
|
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(
|
|
55
|
-
|
|
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
|
-
|
|
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
|
-
|
|
70
|
-
}))),
|
|
71
|
-
|
|
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:
|
|
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
|
-
}),
|
|
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))
|
|
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
|
|
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
|
|
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 {
|
|
2
|
+
import { TBoxProps } from "../../box/box_types";
|
|
3
3
|
export declare const SelectGroupLabel: {
|
|
4
|
-
({ children, ...props }: PropsWithChildren<
|
|
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,
|
|
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", "
|
|
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-
|
|
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
|
-
|
|
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,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-
|
|
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(
|
|
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,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,
|
|
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
|
};
|