@orfium/ictinus 4.16.0 → 4.17.0
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/dist/components/DatePicker/DatePickInput/DatePickInput.d.ts +15 -1
- package/dist/components/DatePicker/DatePickInput/DatePickInput.js +52 -26
- package/dist/components/DatePicker/DatePicker.d.ts +10 -0
- package/dist/components/DatePicker/DatePicker.js +21 -10
- package/dist/components/Filter/Filter.js +22 -65
- package/dist/components/Filter/Filter.style.d.ts +6 -9
- package/dist/components/Filter/Filter.style.js +11 -14
- package/dist/components/Filter/components/FilterBase/FilterBase.d.ts +15 -0
- package/dist/components/Filter/components/FilterBase/FilterBase.js +118 -0
- package/dist/components/Filter/components/FilterBase/index.d.ts +1 -0
- package/dist/components/Filter/components/FilterBase/index.js +10 -0
- package/dist/components/Icon/assets/iconSelector.js +5 -4
- package/package.json +1 -1
|
@@ -1,15 +1,29 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { FilterType, StyleType } from '../../Filter/types';
|
|
2
3
|
import { Props as TextFieldProps } from '../../TextField/TextField';
|
|
3
4
|
import { DateFormatType } from '../DatePicker';
|
|
4
5
|
import { Range } from '../OverlayComponent/OverlayComponent';
|
|
5
6
|
declare type Props = {
|
|
7
|
+
/** Handles the focus state of the component */
|
|
6
8
|
handleFocus: () => void;
|
|
7
|
-
|
|
9
|
+
/** Handles the clear action for the datepicker */
|
|
10
|
+
handleClear: (event?: React.KeyboardEvent) => void;
|
|
11
|
+
/** Defines whether the component selects a single date or a range */
|
|
8
12
|
isRangePicker: boolean;
|
|
13
|
+
/** Style properties for the DatePicker with a filter base */
|
|
14
|
+
filterConfig?: {
|
|
15
|
+
buttonType?: 'primary' | 'secondary';
|
|
16
|
+
styleType?: StyleType;
|
|
17
|
+
filterType?: FilterType;
|
|
18
|
+
};
|
|
19
|
+
/** The selected day */
|
|
9
20
|
selectedDay: Range;
|
|
10
21
|
/** Props for styling the input */
|
|
11
22
|
inputProps?: TextFieldProps;
|
|
23
|
+
/** Overrides the default date format */
|
|
12
24
|
dateFormatOverride?: DateFormatType;
|
|
25
|
+
/** Defines whether the component is open */
|
|
26
|
+
isOpen: boolean;
|
|
13
27
|
};
|
|
14
28
|
declare const DatePickInput: React.ForwardRefExoticComponent<Props & Partial<Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">> & React.RefAttributes<HTMLInputElement>>;
|
|
15
29
|
export default DatePickInput;
|
|
@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _helpers = require("../../../utils/helpers");
|
|
11
11
|
|
|
12
|
+
var _FilterBase = _interopRequireDefault(require("../../Filter/components/FilterBase"));
|
|
13
|
+
|
|
12
14
|
var _Icon = _interopRequireDefault(require("../../Icon"));
|
|
13
15
|
|
|
14
16
|
var _TextField = _interopRequireDefault(require("../../TextField/TextField"));
|
|
@@ -26,12 +28,14 @@ var ON_CHANGE_MOCK = function ON_CHANGE_MOCK() {};
|
|
|
26
28
|
|
|
27
29
|
var DatePickInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
|
|
28
30
|
var handleFocus = _ref.handleFocus,
|
|
31
|
+
filterConfig = _ref.filterConfig,
|
|
29
32
|
handleClear = _ref.handleClear,
|
|
30
33
|
isRangePicker = _ref.isRangePicker,
|
|
31
34
|
inputProps = _ref.inputProps,
|
|
32
35
|
selectedDay = _ref.selectedDay,
|
|
33
36
|
_ref$dateFormatOverri = _ref.dateFormatOverride,
|
|
34
|
-
dateFormatOverride = _ref$dateFormatOverri === void 0 ? 'MM/DD/YYYY' : _ref$dateFormatOverri
|
|
37
|
+
dateFormatOverride = _ref$dateFormatOverri === void 0 ? 'MM/DD/YYYY' : _ref$dateFormatOverri,
|
|
38
|
+
isOpen = _ref.isOpen;
|
|
35
39
|
|
|
36
40
|
var formatDate = function formatDate(date) {
|
|
37
41
|
return date ? (0, _dayjs["default"])(date).format((0, _helpers.getLocaleFormat)(dateFormatOverride)) : '';
|
|
@@ -39,33 +43,55 @@ var DatePickInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, re
|
|
|
39
43
|
|
|
40
44
|
var getDateFormatted = _react["default"].useCallback(formatDate, []);
|
|
41
45
|
|
|
46
|
+
var renderBase = function renderBase() {
|
|
47
|
+
if (filterConfig != null && filterConfig.filterType) {
|
|
48
|
+
return (0, _react2.jsx)(_FilterBase["default"], {
|
|
49
|
+
isDatePicker: true,
|
|
50
|
+
dataTestId: 'filter',
|
|
51
|
+
disabled: false,
|
|
52
|
+
buttonType: (filterConfig == null ? void 0 : filterConfig.buttonType) || 'primary',
|
|
53
|
+
styleType: (filterConfig == null ? void 0 : filterConfig.styleType) || 'filled',
|
|
54
|
+
handleOpen: handleFocus,
|
|
55
|
+
filterType: filterConfig.filterType,
|
|
56
|
+
onClear: handleClear,
|
|
57
|
+
selectedItemLabel: selectedDay.from && "Select Date" + (isRangePicker ? 's' : '') + " : " + getDateFormatted(selectedDay.from) + " " + (isRangePicker ? "- " + getDateFormatted(selectedDay.to) : ''),
|
|
58
|
+
open: isOpen,
|
|
59
|
+
hasSelectedValue: Boolean(selectedDay.from && getDateFormatted(selectedDay.from) + " - " + getDateFormatted(selectedDay.to)),
|
|
60
|
+
label: !selectedDay.from ? "Select Date" + (isRangePicker ? 's' : '') : '',
|
|
61
|
+
iconName: selectedDay.from ? 'calendarFilled' : 'calendarEmpty'
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
return isRangePicker ? (0, _react2.jsx)(_TextField["default"], _extends({
|
|
66
|
+
ref: ref
|
|
67
|
+
}, inputProps, {
|
|
68
|
+
onFocus: handleFocus,
|
|
69
|
+
onKeyDown: handleClear,
|
|
70
|
+
onChange: ON_CHANGE_MOCK,
|
|
71
|
+
placeholder: "Date (start) - Date (end)",
|
|
72
|
+
value: selectedDay.from && getDateFormatted(selectedDay.from) + " - " + getDateFormatted(selectedDay.to),
|
|
73
|
+
rightIcon: (0, _react2.jsx)(_Icon["default"], {
|
|
74
|
+
name: 'calendarEmpty',
|
|
75
|
+
color: '#676767'
|
|
76
|
+
})
|
|
77
|
+
})) : (0, _react2.jsx)(_TextField["default"], _extends({
|
|
78
|
+
ref: ref
|
|
79
|
+
}, inputProps, {
|
|
80
|
+
onFocus: handleFocus,
|
|
81
|
+
onKeyDown: handleClear,
|
|
82
|
+
onChange: ON_CHANGE_MOCK,
|
|
83
|
+
placeholder: "Select date",
|
|
84
|
+
value: selectedDay.to && getDateFormatted(selectedDay.to),
|
|
85
|
+
rightIcon: (0, _react2.jsx)(_Icon["default"], {
|
|
86
|
+
name: 'calendarEmpty',
|
|
87
|
+
color: '#676767'
|
|
88
|
+
})
|
|
89
|
+
}));
|
|
90
|
+
};
|
|
91
|
+
|
|
42
92
|
return (0, _react2.jsx)("div", {
|
|
43
93
|
css: (0, _DatePickInput.rangeInputsWrapper)()
|
|
44
|
-
},
|
|
45
|
-
ref: ref
|
|
46
|
-
}, inputProps, {
|
|
47
|
-
onFocus: handleFocus,
|
|
48
|
-
onKeyDown: handleClear,
|
|
49
|
-
onChange: ON_CHANGE_MOCK,
|
|
50
|
-
placeholder: "Date (start) - Date (end)",
|
|
51
|
-
value: selectedDay.from && getDateFormatted(selectedDay.from) + " - " + getDateFormatted(selectedDay.to),
|
|
52
|
-
rightIcon: (0, _react2.jsx)(_Icon["default"], {
|
|
53
|
-
name: 'calendarEmpty',
|
|
54
|
-
color: '#676767'
|
|
55
|
-
})
|
|
56
|
-
})) : (0, _react2.jsx)(_TextField["default"], _extends({
|
|
57
|
-
ref: ref
|
|
58
|
-
}, inputProps, {
|
|
59
|
-
onFocus: handleFocus,
|
|
60
|
-
onKeyDown: handleClear,
|
|
61
|
-
onChange: ON_CHANGE_MOCK,
|
|
62
|
-
placeholder: "Select date",
|
|
63
|
-
value: selectedDay.to && getDateFormatted(selectedDay.to),
|
|
64
|
-
rightIcon: (0, _react2.jsx)(_Icon["default"], {
|
|
65
|
-
name: 'calendarEmpty',
|
|
66
|
-
color: '#676767'
|
|
67
|
-
})
|
|
68
|
-
})));
|
|
94
|
+
}, renderBase());
|
|
69
95
|
});
|
|
70
96
|
|
|
71
97
|
DatePickInput.displayName = 'DatePickInput';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Dayjs } from 'dayjs';
|
|
2
2
|
import React from 'react';
|
|
3
|
+
import { FilterType, StyleType } from '../Filter/types';
|
|
3
4
|
import { Props as TextFieldProps } from '../TextField/TextField';
|
|
4
5
|
import { Range } from './OverlayComponent/OverlayComponent';
|
|
5
6
|
export declare type DisabledDates = {
|
|
@@ -28,6 +29,15 @@ export declare type Props = {
|
|
|
28
29
|
isClearable?: boolean;
|
|
29
30
|
/** if the datepicker's default date is today instead of placeholder text */
|
|
30
31
|
isDefaultNow?: boolean;
|
|
32
|
+
/** Style properties for the DatePicker with a filter base */
|
|
33
|
+
filterConfig?: {
|
|
34
|
+
/** The type of the filter button's palette - defaults to "primary" */
|
|
35
|
+
buttonType?: 'primary' | 'secondary';
|
|
36
|
+
/** Defines the style type of the filter button */
|
|
37
|
+
styleType?: StyleType;
|
|
38
|
+
/** This property defines the Filter's type */
|
|
39
|
+
filterType?: FilterType;
|
|
40
|
+
};
|
|
31
41
|
};
|
|
32
42
|
export declare type ExtraOption = {
|
|
33
43
|
value: string;
|
|
@@ -57,12 +57,13 @@ var DatePicker = function DatePicker(_ref) {
|
|
|
57
57
|
dateFormatOverride = _ref$dateFormatOverri === void 0 ? undefined : _ref$dateFormatOverri,
|
|
58
58
|
_ref$isClearable = _ref.isClearable,
|
|
59
59
|
isClearable = _ref$isClearable === void 0 ? false : _ref$isClearable,
|
|
60
|
+
filterConfig = _ref.filterConfig,
|
|
60
61
|
_ref$isDefaultNow = _ref.isDefaultNow,
|
|
61
62
|
isDefaultNow = _ref$isDefaultNow === void 0 ? true : _ref$isDefaultNow;
|
|
62
63
|
|
|
63
64
|
var _useState = (0, _react.useState)(false),
|
|
64
|
-
|
|
65
|
-
|
|
65
|
+
isOpen = _useState[0],
|
|
66
|
+
setIsOpen = _useState[1];
|
|
66
67
|
|
|
67
68
|
var _useState2 = (0, _react.useState)(''),
|
|
68
69
|
selectedOption = _useState2[0],
|
|
@@ -104,7 +105,7 @@ var DatePicker = function DatePicker(_ref) {
|
|
|
104
105
|
};
|
|
105
106
|
|
|
106
107
|
if (newRange.to) {
|
|
107
|
-
|
|
108
|
+
setIsOpen(false);
|
|
108
109
|
}
|
|
109
110
|
|
|
110
111
|
setSelectedRange(newRange);
|
|
@@ -159,19 +160,27 @@ var DatePicker = function DatePicker(_ref) {
|
|
|
159
160
|
});
|
|
160
161
|
}, [isRangePicker]);
|
|
161
162
|
var onCancel = (0, _react.useCallback)(function () {
|
|
162
|
-
|
|
163
|
+
setIsOpen(false);
|
|
163
164
|
}, []);
|
|
164
165
|
var handleFocus = (0, _react.useCallback)(function () {
|
|
165
|
-
|
|
166
|
+
setIsOpen(true);
|
|
166
167
|
}, []);
|
|
167
168
|
var handleClear = (0, _react.useCallback)(function (e) {
|
|
168
|
-
if (!isClearable) {
|
|
169
|
+
if (!isClearable && (filterConfig == null ? void 0 : filterConfig.filterType) !== 'added') {
|
|
169
170
|
return false;
|
|
170
171
|
}
|
|
171
172
|
|
|
173
|
+
if (filterConfig != null && filterConfig.filterType) {
|
|
174
|
+
setIsOpen(false);
|
|
175
|
+
return setSelectedRange({
|
|
176
|
+
to: undefined,
|
|
177
|
+
from: undefined
|
|
178
|
+
});
|
|
179
|
+
}
|
|
180
|
+
|
|
172
181
|
if (e.keyCode === 27) {
|
|
173
182
|
// if escape
|
|
174
|
-
return
|
|
183
|
+
return setIsOpen(false);
|
|
175
184
|
}
|
|
176
185
|
|
|
177
186
|
if (e.keyCode === 8) {
|
|
@@ -190,22 +199,24 @@ var DatePicker = function DatePicker(_ref) {
|
|
|
190
199
|
};
|
|
191
200
|
});
|
|
192
201
|
}
|
|
193
|
-
}, [isClearable]);
|
|
202
|
+
}, [isClearable, filterConfig == null ? void 0 : filterConfig.filterType]);
|
|
194
203
|
var onApply = (0, _react.useCallback)(function () {
|
|
195
204
|
applyRangeAndClose(range);
|
|
196
205
|
}, [applyRangeAndClose, range]);
|
|
197
206
|
return (0, _react2.jsx)(_ClickAwayListener["default"], {
|
|
198
207
|
onClick: onCancel
|
|
199
208
|
}, (0, _react2.jsx)(_PositionInScreen["default"], {
|
|
200
|
-
visible:
|
|
209
|
+
visible: isOpen,
|
|
201
210
|
parent: function parent() {
|
|
202
211
|
return (0, _react2.jsx)(_DatePickInput["default"], {
|
|
212
|
+
filterConfig: filterConfig,
|
|
203
213
|
isRangePicker: isRangePicker,
|
|
204
214
|
selectedDay: selectedRange,
|
|
205
215
|
inputProps: inputProps,
|
|
206
216
|
dateFormatOverride: dateFormatOverride,
|
|
207
217
|
handleFocus: handleFocus,
|
|
208
|
-
handleClear: handleClear
|
|
218
|
+
handleClear: handleClear,
|
|
219
|
+
isOpen: isOpen
|
|
209
220
|
});
|
|
210
221
|
}
|
|
211
222
|
}, (0, _react2.jsx)("div", {
|
|
@@ -13,10 +13,10 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
13
13
|
|
|
14
14
|
var _helpers = require("../../utils/helpers");
|
|
15
15
|
|
|
16
|
-
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
17
|
-
|
|
18
16
|
var _ClickAwayListener = _interopRequireDefault(require("../utils/ClickAwayListener"));
|
|
19
17
|
|
|
18
|
+
var _FilterBase = _interopRequireDefault(require("./components/FilterBase"));
|
|
19
|
+
|
|
20
20
|
var _Options = _interopRequireDefault(require("./components/Options/Options"));
|
|
21
21
|
|
|
22
22
|
var _SearchInput = _interopRequireDefault(require("./components/SearchInput/SearchInput"));
|
|
@@ -65,8 +65,8 @@ var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
|
65
65
|
onClear = _props$onClear === void 0 ? function () {} : _props$onClear;
|
|
66
66
|
|
|
67
67
|
var _React$useState = _react["default"].useState(false),
|
|
68
|
-
|
|
69
|
-
|
|
68
|
+
isOpen = _React$useState[0],
|
|
69
|
+
setIsOpen = _React$useState[1];
|
|
70
70
|
|
|
71
71
|
var _React$useState2 = _react["default"].useState(''),
|
|
72
72
|
searchValue = _React$useState2[0],
|
|
@@ -80,15 +80,15 @@ var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
|
80
80
|
var hasSelectedValue = Boolean(selectedItem == null ? void 0 : selectedItem.value) && (selectedItem == null ? void 0 : selectedItem.value) !== defaultValue.value;
|
|
81
81
|
var calculatedColor = calculateColorBetweenColorAndType('', buttonType);
|
|
82
82
|
var iconColor = (0, _utils.getTextColor)({
|
|
83
|
-
open:
|
|
83
|
+
open: isOpen,
|
|
84
84
|
theme: theme,
|
|
85
85
|
calculatedColor: calculatedColor,
|
|
86
86
|
hasSelectedValue: hasSelectedValue
|
|
87
87
|
});
|
|
88
|
-
var iconName =
|
|
88
|
+
var iconName = isOpen ? 'triangleUp' : 'triangleDown';
|
|
89
89
|
|
|
90
90
|
var handleSelect = function handleSelect(option) {
|
|
91
|
-
|
|
91
|
+
setIsOpen(false);
|
|
92
92
|
onSelect(option);
|
|
93
93
|
};
|
|
94
94
|
|
|
@@ -117,34 +117,12 @@ var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
|
117
117
|
|
|
118
118
|
var handleOpen = function handleOpen() {
|
|
119
119
|
setSearchValue('');
|
|
120
|
-
|
|
120
|
+
setIsOpen(!isOpen);
|
|
121
121
|
};
|
|
122
122
|
|
|
123
123
|
var debouncedOnChange = _react["default"].useCallback((0, _lodash.debounce)(function (value) {
|
|
124
124
|
onAsyncSearch == null ? void 0 : onAsyncSearch(value);
|
|
125
125
|
}, 400), []);
|
|
126
|
-
|
|
127
|
-
var buttonStyleProps = {
|
|
128
|
-
calculatedColor: calculatedColor,
|
|
129
|
-
buttonType: buttonType,
|
|
130
|
-
disabled: disabled,
|
|
131
|
-
open: open,
|
|
132
|
-
styleType: styleType,
|
|
133
|
-
hasSelectedValue: hasSelectedValue,
|
|
134
|
-
filterType: filterType
|
|
135
|
-
};
|
|
136
|
-
|
|
137
|
-
var pickIconColor = function pickIconColor() {
|
|
138
|
-
if (open) {
|
|
139
|
-
return theme.utils.getColor('neutralWhite', 100);
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
if (hasSelectedValue) {
|
|
143
|
-
return theme.utils.getColor(calculatedColor.color, 550);
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
return theme.utils.getColor('darkGrey', 400);
|
|
147
|
-
};
|
|
148
126
|
/**
|
|
149
127
|
* for 'added' type design team decided that is not needed therefore in order not having to maintain
|
|
150
128
|
* one more special case we dont render it
|
|
@@ -157,44 +135,23 @@ var Filter = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
|
157
135
|
|
|
158
136
|
return (0, _react2.jsx)(_ClickAwayListener["default"], {
|
|
159
137
|
onClick: function onClick() {
|
|
160
|
-
return
|
|
138
|
+
return setIsOpen(false);
|
|
161
139
|
}
|
|
162
|
-
}, (0, _react2.jsx)("
|
|
163
|
-
css: (0, _Filter.wrapperStyle)(),
|
|
164
|
-
"data-testid": dataTestId
|
|
165
|
-
}, (0, _react2.jsx)("button", {
|
|
140
|
+
}, (0, _react2.jsx)(_FilterBase["default"], {
|
|
166
141
|
ref: ref,
|
|
167
|
-
|
|
168
|
-
|
|
142
|
+
dataTestId: dataTestId,
|
|
143
|
+
handleOpen: handleOpen,
|
|
169
144
|
disabled: disabled,
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
},
|
|
180
|
-
css: (0, _Filter.valueSpanStyle)()
|
|
181
|
-
}, (_selectedItem$label = selectedItem == null ? void 0 : selectedItem.label) != null ? _selectedItem$label : defaultValue.label))), (0, _react2.jsx)(_Icon["default"], {
|
|
182
|
-
name: iconName,
|
|
183
|
-
color: iconColor,
|
|
184
|
-
size: 6
|
|
185
|
-
}))), filterType === 'added' && (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)("span", {
|
|
186
|
-
css: (0, _Filter.divider)(buttonStyleProps)
|
|
187
|
-
}), (0, _react2.jsx)("div", {
|
|
188
|
-
css: (0, _Filter.dividedButtonStyle)(buttonStyleProps)
|
|
189
|
-
}, (0, _react2.jsx)(_Icon["default"], {
|
|
190
|
-
size: 19,
|
|
191
|
-
name: 'closeTag',
|
|
192
|
-
color: pickIconColor(),
|
|
193
|
-
onClick: function onClick(e) {
|
|
194
|
-
e.stopPropagation();
|
|
195
|
-
onClear();
|
|
196
|
-
}
|
|
197
|
-
})))), open && (0, _react2.jsx)("div", {
|
|
145
|
+
onClear: onClear,
|
|
146
|
+
selectedItemLabel: (_selectedItem$label = selectedItem == null ? void 0 : selectedItem.label) != null ? _selectedItem$label : defaultValue.label,
|
|
147
|
+
open: isOpen,
|
|
148
|
+
hasSelectedValue: hasSelectedValue,
|
|
149
|
+
label: label,
|
|
150
|
+
iconName: iconName,
|
|
151
|
+
filterType: filterType,
|
|
152
|
+
buttonType: buttonType,
|
|
153
|
+
styleType: styleType
|
|
154
|
+
}, isOpen && (0, _react2.jsx)("div", {
|
|
198
155
|
css: (0, _Filter.menuStyle)(),
|
|
199
156
|
"data-testid": (0, _helpers.generateTestDataId)('filter-menu', dataTestId)
|
|
200
157
|
}, isSearchable && (0, _react2.jsx)(_SearchInput["default"], {
|
|
@@ -8,6 +8,7 @@ export declare const wrapperStyle: () => () => {
|
|
|
8
8
|
export declare const buttonSpanStyle: () => () => {
|
|
9
9
|
display: string;
|
|
10
10
|
alignItems: string;
|
|
11
|
+
gap: string;
|
|
11
12
|
height: string;
|
|
12
13
|
};
|
|
13
14
|
export declare const buttonWrapperStyle: ({ disabled, open, hasSelectedValue, calculatedColor, }: ButtonStyleProps) => (theme: Theme) => {
|
|
@@ -17,7 +18,6 @@ export declare const buttonWrapperStyle: ({ disabled, open, hasSelectedValue, ca
|
|
|
17
18
|
padding: string;
|
|
18
19
|
alignItems: string;
|
|
19
20
|
height: string;
|
|
20
|
-
maxWidth: string;
|
|
21
21
|
minWidth: string;
|
|
22
22
|
':hover > div, :active > div': {
|
|
23
23
|
backgroundColor: string | undefined;
|
|
@@ -50,6 +50,8 @@ export declare const buttonBaseStyle: ({ calculatedColor, disabled, open, styleT
|
|
|
50
50
|
export declare const divider: (props: ButtonStyleProps) => (theme: Theme) => {
|
|
51
51
|
height: string;
|
|
52
52
|
width: string;
|
|
53
|
+
position: "relative";
|
|
54
|
+
minWidth: string;
|
|
53
55
|
transition: string;
|
|
54
56
|
backgroundColor: string;
|
|
55
57
|
borderTop: string;
|
|
@@ -57,6 +59,7 @@ export declare const divider: (props: ButtonStyleProps) => (theme: Theme) => {
|
|
|
57
59
|
};
|
|
58
60
|
export declare const dividedButtonStyle: (props: ButtonStyleProps) => (theme: Theme) => {
|
|
59
61
|
borderLeft: string;
|
|
62
|
+
paddingLeft: string;
|
|
60
63
|
paddingRight: string;
|
|
61
64
|
display: string;
|
|
62
65
|
alignItems: string;
|
|
@@ -64,9 +67,6 @@ export declare const dividedButtonStyle: (props: ButtonStyleProps) => (theme: Th
|
|
|
64
67
|
width: string;
|
|
65
68
|
borderTopRightRadius: "24";
|
|
66
69
|
borderBottomRightRadius: "24";
|
|
67
|
-
'> span': {
|
|
68
|
-
marginLeft: string;
|
|
69
|
-
};
|
|
70
70
|
fontSize: string;
|
|
71
71
|
cursor: string;
|
|
72
72
|
height: string;
|
|
@@ -100,21 +100,18 @@ export declare const buttonStyle: (props: ButtonStyleProps) => (theme: Theme) =>
|
|
|
100
100
|
border: string;
|
|
101
101
|
};
|
|
102
102
|
};
|
|
103
|
-
export declare const childrenWrapperStyle: () => (
|
|
103
|
+
export declare const childrenWrapperStyle: () => () => {
|
|
104
|
+
lineHeight: string;
|
|
104
105
|
marginLeft: number;
|
|
105
|
-
marginRight: "8";
|
|
106
|
-
maxWidth: string;
|
|
107
106
|
};
|
|
108
107
|
export declare const labelSpanStyle: (open: boolean, hasSelectedValue: boolean) => (theme: Theme) => {
|
|
109
108
|
fontWeight: 400 | 700;
|
|
110
|
-
maxWidth: string;
|
|
111
109
|
display: string;
|
|
112
110
|
alignItems: string;
|
|
113
111
|
div: {
|
|
114
112
|
flex: string;
|
|
115
113
|
};
|
|
116
114
|
span: {
|
|
117
|
-
marginLeft: "4";
|
|
118
115
|
fontWeight: 700;
|
|
119
116
|
};
|
|
120
117
|
};
|
|
@@ -30,6 +30,7 @@ var buttonSpanStyle = function buttonSpanStyle() {
|
|
|
30
30
|
return {
|
|
31
31
|
display: 'flex',
|
|
32
32
|
alignItems: 'center',
|
|
33
|
+
gap: (0, _utils.rem)(4),
|
|
33
34
|
height: '100%'
|
|
34
35
|
};
|
|
35
36
|
};
|
|
@@ -50,7 +51,6 @@ var buttonWrapperStyle = function buttonWrapperStyle(_ref2) {
|
|
|
50
51
|
padding: '0',
|
|
51
52
|
alignItems: 'center',
|
|
52
53
|
height: '100%',
|
|
53
|
-
maxWidth: (0, _utils.rem)(270),
|
|
54
54
|
minWidth: (0, _utils.rem)(110),
|
|
55
55
|
':hover > div, :active > div': {
|
|
56
56
|
backgroundColor: !disabled && !open ? hasSelectedValue ? theme.utils.getColor(calculatedColor.color, 100) : theme.utils.getColor('darkGrey', null, 'pale') : undefined
|
|
@@ -136,6 +136,8 @@ var divider = function divider(props) {
|
|
|
136
136
|
return {
|
|
137
137
|
height: '100%',
|
|
138
138
|
width: (0, _utils.rem)(1),
|
|
139
|
+
position: 'relative',
|
|
140
|
+
minWidth: (0, _utils.rem)(1),
|
|
139
141
|
transition: 'all 150ms linear',
|
|
140
142
|
backgroundColor: (0, _utils2.getBorder)({
|
|
141
143
|
styleType: styleType,
|
|
@@ -172,16 +174,14 @@ var dividedButtonStyle = function dividedButtonStyle(props) {
|
|
|
172
174
|
return function (theme) {
|
|
173
175
|
return _extends({}, buttonBaseStyle(props)(theme), {
|
|
174
176
|
borderLeft: '0 !important',
|
|
175
|
-
|
|
177
|
+
paddingLeft: (0, _utils.rem)(4),
|
|
178
|
+
paddingRight: (0, _utils.rem)(4),
|
|
176
179
|
display: 'flex',
|
|
177
180
|
alignItems: 'center',
|
|
178
181
|
justifyContent: 'center',
|
|
179
182
|
width: (0, _utils.rem)(34),
|
|
180
183
|
borderTopRightRadius: theme.spacing.lg,
|
|
181
|
-
borderBottomRightRadius: theme.spacing.lg
|
|
182
|
-
'> span': {
|
|
183
|
-
marginLeft: (0, _utils.rem)(-5)
|
|
184
|
-
}
|
|
184
|
+
borderBottomRightRadius: theme.spacing.lg
|
|
185
185
|
});
|
|
186
186
|
};
|
|
187
187
|
};
|
|
@@ -205,11 +205,10 @@ var buttonStyle = function buttonStyle(props) {
|
|
|
205
205
|
exports.buttonStyle = buttonStyle;
|
|
206
206
|
|
|
207
207
|
var childrenWrapperStyle = function childrenWrapperStyle() {
|
|
208
|
-
return function (
|
|
208
|
+
return function () {
|
|
209
209
|
return {
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
maxWidth: (0, _utils.rem)(270)
|
|
210
|
+
lineHeight: (0, _utils.rem)(15),
|
|
211
|
+
marginLeft: 0
|
|
213
212
|
};
|
|
214
213
|
};
|
|
215
214
|
};
|
|
@@ -220,14 +219,12 @@ var labelSpanStyle = function labelSpanStyle(open, hasSelectedValue) {
|
|
|
220
219
|
return function (theme) {
|
|
221
220
|
return {
|
|
222
221
|
fontWeight: open || hasSelectedValue ? theme.typography.weights.bold : theme.typography.weights.regular,
|
|
223
|
-
maxWidth: (0, _utils.rem)(210),
|
|
224
222
|
display: 'flex',
|
|
225
223
|
alignItems: 'center',
|
|
226
224
|
div: {
|
|
227
225
|
flex: 'none'
|
|
228
226
|
},
|
|
229
227
|
span: {
|
|
230
|
-
marginLeft: theme.spacing.xsm,
|
|
231
228
|
fontWeight: theme.typography.weights.bold
|
|
232
229
|
}
|
|
233
230
|
};
|
|
@@ -242,7 +239,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
242
239
|
} : {
|
|
243
240
|
name: "aqyt6f-valueSpanStyle",
|
|
244
241
|
styles: "text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:inline-block;label:valueSpanStyle;",
|
|
245
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
242
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0ZpbHRlci9GaWx0ZXIuc3R5bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBK011QyIsImZpbGUiOiIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9GaWx0ZXIvRmlsdGVyLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgcmVtIH0gZnJvbSAndGhlbWUvdXRpbHMnO1xuXG5pbXBvcnQgeyBUaGVtZSB9IGZyb20gJy4uLy4uL3RoZW1lJztcbmltcG9ydCB7IEJ1dHRvblN0eWxlUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcbmltcG9ydCB7XG4gIGJvcmRlclN0eWxlUGFyYW1zLFxuICBmb2N1c0JvcmRlclN0eWxlUGFyYW1zLFxuICBnZXRCYWNrZ3JvdW5kQ29sb3IsXG4gIGdldEJvcmRlcixcbiAgZ2V0VGV4dENvbG9yLFxufSBmcm9tICcuL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IHdyYXBwZXJTdHlsZSA9ICgpID0+ICgpID0+IHtcbiAgcmV0dXJuIHtcbiAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyBhcyBjb25zdCxcbiAgICBkaXNwbGF5OiAnaW5saW5lLWJsb2NrJyxcbiAgICBoZWlnaHQ6IHJlbSgzNiksXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uU3BhblN0eWxlID0gKCkgPT4gKCkgPT4ge1xuICByZXR1cm4ge1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBnYXA6IHJlbSg0KSxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgfTtcbn07XG5cbmV4cG9ydCBjb25zdCBidXR0b25XcmFwcGVyU3R5bGUgPSAoe1xuICBkaXNhYmxlZCxcbiAgb3BlbixcbiAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgY2FsY3VsYXRlZENvbG9yLFxufTogQnV0dG9uU3R5bGVQcm9wcykgPT4gKHRoZW1lOiBUaGVtZSkgPT4ge1xuICByZXR1cm4ge1xuICAgIGJhY2tncm91bmQ6ICdub25lJyxcbiAgICBib3JkZXI6ICdub25lJyxcbiAgICBkaXNwbGF5OiAnZmxleCcsXG4gICAgcGFkZGluZzogJzAnLFxuICAgIGFsaWduSXRlbXM6ICdjZW50ZXInLFxuICAgIGhlaWdodDogJzEwMCUnLFxuICAgIG1pbldpZHRoOiByZW0oMTEwKSxcblxuICAgICc6aG92ZXIgPiBkaXYsIDphY3RpdmUgPiBkaXYnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6XG4gICAgICAgICFkaXNhYmxlZCAmJiAhb3BlblxuICAgICAgICAgID8gaGFzU2VsZWN0ZWRWYWx1ZVxuICAgICAgICAgICAgPyB0aGVtZS51dGlscy5nZXRDb2xvcihjYWxjdWxhdGVkQ29sb3IuY29sb3IsIDEwMClcbiAgICAgICAgICAgIDogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2RhcmtHcmV5JywgbnVsbCwgJ3BhbGUnKVxuICAgICAgICAgIDogdW5kZWZpbmVkLFxuICAgIH0sXG4gICAgLy8gb24gZm9jdXMgY2hhbmdlIHRoZSB0d28gZGl2cyBvZiBhZGRlZFxuICAgICc6Zm9jdXMgPiBkaXYnOiAhb3BlbiAmJlxuICAgICAgIWhhc1NlbGVjdGVkVmFsdWUgJiYge1xuICAgICAgICBib3JkZXI6IGAke2ZvY3VzQm9yZGVyU3R5bGVQYXJhbXN9ICR7dGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2JsdWUnLCA1NTApfWAsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2JsdWUnLCA1MCksXG4gICAgICB9LFxuICAgIC8vIHRhcmdldCB0aGUgZGl2aWRlciBvbiBmb2N1c1xuICAgICc6Zm9jdXMgPiBzcGFuJzogIW9wZW4gJiYge1xuICAgICAgYm9yZGVyVG9wOiBgJHtmb2N1c0JvcmRlclN0eWxlUGFyYW1zfSAke3RoZW1lLnV0aWxzLmdldENvbG9yKCdibHVlJywgNTUwKX1gLFxuICAgICAgYm9yZGVyQm90dG9tOiBgJHtmb2N1c0JvcmRlclN0eWxlUGFyYW1zfSAke3RoZW1lLnV0aWxzLmdldENvbG9yKCdibHVlJywgNTUwKX1gLFxuICAgIH0sXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uQmFzZVN0eWxlID0gKHtcbiAgY2FsY3VsYXRlZENvbG9yLFxuICBkaXNhYmxlZCxcbiAgb3BlbixcbiAgc3R5bGVUeXBlLFxuICBoYXNTZWxlY3RlZFZhbHVlLFxuICBmaWx0ZXJUeXBlLFxufTogQnV0dG9uU3R5bGVQcm9wcykgPT4gKHRoZW1lOiBUaGVtZSkgPT4ge1xuICByZXR1cm4ge1xuICAgIGZvbnRTaXplOiB0aGVtZS50eXBvZ3JhcGh5LmZvbnRTaXplc1snMTMnXSxcbiAgICBjdXJzb3I6IGRpc2FibGVkID8gJ25vdC1hbGxvd2VkJyA6ICdwb2ludGVyJyxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICBvcGFjaXR5OiBkaXNhYmxlZCA/IDAuNSA6IDEsXG4gICAgdHJhbnNpdGlvbjogJ2FsbCAxNTBtcyBsaW5lYXInLFxuICAgIGNvbG9yOiBnZXRUZXh0Q29sb3Ioe1xuICAgICAgdGhlbWUsXG4gICAgICBvcGVuLFxuICAgICAgY2FsY3VsYXRlZENvbG9yLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICB9KSxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IGdldEJhY2tncm91bmRDb2xvcih7XG4gICAgICB0aGVtZSxcbiAgICAgIG9wZW4sXG4gICAgICBzdHlsZVR5cGUsXG4gICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgY2FsY3VsYXRlZENvbG9yLFxuICAgIH0pLFxuICAgIGJvcmRlcjogYCR7Ym9yZGVyU3R5bGVQYXJhbXN9ICR7Z2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgIH0pfWAsXG4gICAgZGlzcGxheTogJ2ZsZXgnLFxuICAgIGp1c3RpZnlDb250ZW50OiAnY2VudGVyJyxcbiAgICB3aWR0aDogJzEwMCUnLFxuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm9yZGVyOiBgJHtib3JkZXJTdHlsZVBhcmFtc30gJHtnZXRCb3JkZXIoe1xuICAgICAgICBzdHlsZVR5cGUsXG4gICAgICAgIHRoZW1lLFxuICAgICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgICBmaWx0ZXJUeXBlLFxuICAgICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICAgIG9wZW4sXG4gICAgICAgIHN0YXRlOiAnaG92ZXInLFxuICAgICAgfSl9YCxcbiAgICB9LFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IGRpdmlkZXIgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgY29uc3QgeyBvcGVuLCBjYWxjdWxhdGVkQ29sb3IsIHN0eWxlVHlwZSwgaGFzU2VsZWN0ZWRWYWx1ZSwgZmlsdGVyVHlwZSB9ID0gcHJvcHM7XG5cbiAgcmV0dXJuIHtcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICB3aWR0aDogcmVtKDEpLFxuICAgIHBvc2l0aW9uOiAncmVsYXRpdmUnIGFzIGNvbnN0LFxuICAgIG1pbldpZHRoOiByZW0oMSksXG4gICAgdHJhbnNpdGlvbjogJ2FsbCAxNTBtcyBsaW5lYXInLFxuICAgIGJhY2tncm91bmRDb2xvcjogZ2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgICAgaXNEaXZpZGVyOiB0cnVlLFxuICAgIH0pLFxuICAgIGJvcmRlclRvcDogYCR7Ym9yZGVyU3R5bGVQYXJhbXN9ICR7Z2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgIH0pfWAsXG4gICAgYm9yZGVyQm90dG9tOiBgJHtib3JkZXJTdHlsZVBhcmFtc30gJHtnZXRCb3JkZXIoe1xuICAgICAgc3R5bGVUeXBlLFxuICAgICAgdGhlbWUsXG4gICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgZmlsdGVyVHlwZSxcbiAgICAgIGNhbGN1bGF0ZWRDb2xvcixcbiAgICAgIG9wZW4sXG4gICAgfSl9YCxcbiAgfTtcbn07XG5cbmV4cG9ydCBjb25zdCBkaXZpZGVkQnV0dG9uU3R5bGUgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgcmV0dXJuIHtcbiAgICAuLi5idXR0b25CYXNlU3R5bGUocHJvcHMpKHRoZW1lKSxcbiAgICBib3JkZXJMZWZ0OiAnMCAhaW1wb3J0YW50JyxcbiAgICBwYWRkaW5nTGVmdDogcmVtKDQpLFxuICAgIHBhZGRpbmdSaWdodDogcmVtKDQpLFxuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBqdXN0aWZ5Q29udGVudDogJ2NlbnRlcicsXG4gICAgd2lkdGg6IHJlbSgzNCksXG4gICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6IHRoZW1lLnNwYWNpbmcubGcsXG4gICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6IHRoZW1lLnNwYWNpbmcubGcsXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uU3R5bGUgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgY29uc3QgeyBmaWx0ZXJUeXBlIH0gPSBwcm9wcztcbiAgY29uc3QgaXNQcmVzZXQgPSBmaWx0ZXJUeXBlID09PSAncHJlc2V0JztcblxuICByZXR1cm4ge1xuICAgIC4uLmJ1dHRvbkJhc2VTdHlsZShwcm9wcykodGhlbWUpLFxuICAgIHBhZGRpbmc6IGAwICR7IWlzUHJlc2V0ID8gdGhlbWUuc3BhY2luZy54c20gOiB0aGVtZS5zcGFjaW5nLm1kfSAwICR7dGhlbWUuc3BhY2luZy5tZH1gLFxuICAgIGJvcmRlclJhZGl1czogdGhlbWUuc3BhY2luZy5sZyxcbiAgICBib3JkZXJSaWdodDogIWlzUHJlc2V0ID8gJzAgIWltcG9ydGFudCcgOiB1bmRlZmluZWQsXG4gICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6ICFpc1ByZXNldCA/IDAgOiB1bmRlZmluZWQsXG4gICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6ICFpc1ByZXNldCA/IDAgOiB1bmRlZmluZWQsXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgY2hpbGRyZW5XcmFwcGVyU3R5bGUgPSAoKSA9PiAoKSA9PiB7XG4gIHJldHVybiB7XG4gICAgbGluZUhlaWdodDogcmVtKDE1KSxcbiAgICBtYXJnaW5MZWZ0OiAwLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IGxhYmVsU3BhblN0eWxlID0gKG9wZW46IGJvb2xlYW4sIGhhc1NlbGVjdGVkVmFsdWU6IGJvb2xlYW4pID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgcmV0dXJuIHtcbiAgICBmb250V2VpZ2h0OlxuICAgICAgb3BlbiB8fCBoYXNTZWxlY3RlZFZhbHVlID8gdGhlbWUudHlwb2dyYXBoeS53ZWlnaHRzLmJvbGQgOiB0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMucmVndWxhcixcbiAgICBkaXNwbGF5OiAnZmxleCcsXG4gICAgYWxpZ25JdGVtczogJ2NlbnRlcicsXG4gICAgZGl2OiB7XG4gICAgICBmbGV4OiAnbm9uZScsXG4gICAgfSxcbiAgICBzcGFuOiB7XG4gICAgICBmb250V2VpZ2h0OiB0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMuYm9sZCxcbiAgICB9LFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IHZhbHVlU3BhblN0eWxlID0gKCkgPT4gY3NzYFxuICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IG1lbnVTdHlsZSA9ICgpID0+ICh0aGVtZTogVGhlbWUpID0+IGNzc2BcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6ICR7cmVtKDQ4KX07XG4gIG1pbi13aWR0aDogJHtyZW0oMjgwKX07XG4gIGxlZnQ6IDA7XG4gIGhlaWdodDogYXV0bztcbiAgYm9yZGVyLXJhZGl1czogJHt0aGVtZS5zcGFjaW5nLnhzbX07XG4gIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUucGFsZXR0ZS53aGl0ZX07XG4gIGJveC1zaGFkb3c6ICR7dGhlbWUuZWxldmF0aW9uWycwMiddfTtcbiAgei1pbmRleDogMTtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgbWluLXdpZHRoOiAxMDAlO1xuICBtYXgtd2lkdGg6ICR7cmVtKDYyMCl9O1xuYDtcbiJdfQ== */",
|
|
246
243
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
247
244
|
};
|
|
248
245
|
|
|
@@ -258,7 +255,7 @@ var menuStyle = function menuStyle() {
|
|
|
258
255
|
/*#__PURE__*/
|
|
259
256
|
|
|
260
257
|
/*#__PURE__*/
|
|
261
|
-
(0, _react.css)("position:absolute;top:", (0, _utils.rem)(48), ";min-width:", (0, _utils.rem)(280), ";left:0;height:auto;border-radius:", theme.spacing.xsm, ";background-color:", theme.palette.white, ";box-shadow:", theme.elevation['02'], ";z-index:1;overflow:hidden;min-width:100%;max-width:", (0, _utils.rem)(620), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:menuStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
258
|
+
(0, _react.css)("position:absolute;top:", (0, _utils.rem)(48), ";min-width:", (0, _utils.rem)(280), ";left:0;height:auto;border-radius:", theme.spacing.xsm, ";background-color:", theme.palette.white, ";box-shadow:", theme.elevation['02'], ";z-index:1;overflow:hidden;min-width:100%;max-width:", (0, _utils.rem)(620), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:menuStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0ZpbHRlci9GaWx0ZXIuc3R5bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc05vRCIsImZpbGUiOiIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9GaWx0ZXIvRmlsdGVyLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgcmVtIH0gZnJvbSAndGhlbWUvdXRpbHMnO1xuXG5pbXBvcnQgeyBUaGVtZSB9IGZyb20gJy4uLy4uL3RoZW1lJztcbmltcG9ydCB7IEJ1dHRvblN0eWxlUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcbmltcG9ydCB7XG4gIGJvcmRlclN0eWxlUGFyYW1zLFxuICBmb2N1c0JvcmRlclN0eWxlUGFyYW1zLFxuICBnZXRCYWNrZ3JvdW5kQ29sb3IsXG4gIGdldEJvcmRlcixcbiAgZ2V0VGV4dENvbG9yLFxufSBmcm9tICcuL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IHdyYXBwZXJTdHlsZSA9ICgpID0+ICgpID0+IHtcbiAgcmV0dXJuIHtcbiAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyBhcyBjb25zdCxcbiAgICBkaXNwbGF5OiAnaW5saW5lLWJsb2NrJyxcbiAgICBoZWlnaHQ6IHJlbSgzNiksXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uU3BhblN0eWxlID0gKCkgPT4gKCkgPT4ge1xuICByZXR1cm4ge1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBnYXA6IHJlbSg0KSxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgfTtcbn07XG5cbmV4cG9ydCBjb25zdCBidXR0b25XcmFwcGVyU3R5bGUgPSAoe1xuICBkaXNhYmxlZCxcbiAgb3BlbixcbiAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgY2FsY3VsYXRlZENvbG9yLFxufTogQnV0dG9uU3R5bGVQcm9wcykgPT4gKHRoZW1lOiBUaGVtZSkgPT4ge1xuICByZXR1cm4ge1xuICAgIGJhY2tncm91bmQ6ICdub25lJyxcbiAgICBib3JkZXI6ICdub25lJyxcbiAgICBkaXNwbGF5OiAnZmxleCcsXG4gICAgcGFkZGluZzogJzAnLFxuICAgIGFsaWduSXRlbXM6ICdjZW50ZXInLFxuICAgIGhlaWdodDogJzEwMCUnLFxuICAgIG1pbldpZHRoOiByZW0oMTEwKSxcblxuICAgICc6aG92ZXIgPiBkaXYsIDphY3RpdmUgPiBkaXYnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6XG4gICAgICAgICFkaXNhYmxlZCAmJiAhb3BlblxuICAgICAgICAgID8gaGFzU2VsZWN0ZWRWYWx1ZVxuICAgICAgICAgICAgPyB0aGVtZS51dGlscy5nZXRDb2xvcihjYWxjdWxhdGVkQ29sb3IuY29sb3IsIDEwMClcbiAgICAgICAgICAgIDogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2RhcmtHcmV5JywgbnVsbCwgJ3BhbGUnKVxuICAgICAgICAgIDogdW5kZWZpbmVkLFxuICAgIH0sXG4gICAgLy8gb24gZm9jdXMgY2hhbmdlIHRoZSB0d28gZGl2cyBvZiBhZGRlZFxuICAgICc6Zm9jdXMgPiBkaXYnOiAhb3BlbiAmJlxuICAgICAgIWhhc1NlbGVjdGVkVmFsdWUgJiYge1xuICAgICAgICBib3JkZXI6IGAke2ZvY3VzQm9yZGVyU3R5bGVQYXJhbXN9ICR7dGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2JsdWUnLCA1NTApfWAsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2JsdWUnLCA1MCksXG4gICAgICB9LFxuICAgIC8vIHRhcmdldCB0aGUgZGl2aWRlciBvbiBmb2N1c1xuICAgICc6Zm9jdXMgPiBzcGFuJzogIW9wZW4gJiYge1xuICAgICAgYm9yZGVyVG9wOiBgJHtmb2N1c0JvcmRlclN0eWxlUGFyYW1zfSAke3RoZW1lLnV0aWxzLmdldENvbG9yKCdibHVlJywgNTUwKX1gLFxuICAgICAgYm9yZGVyQm90dG9tOiBgJHtmb2N1c0JvcmRlclN0eWxlUGFyYW1zfSAke3RoZW1lLnV0aWxzLmdldENvbG9yKCdibHVlJywgNTUwKX1gLFxuICAgIH0sXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uQmFzZVN0eWxlID0gKHtcbiAgY2FsY3VsYXRlZENvbG9yLFxuICBkaXNhYmxlZCxcbiAgb3BlbixcbiAgc3R5bGVUeXBlLFxuICBoYXNTZWxlY3RlZFZhbHVlLFxuICBmaWx0ZXJUeXBlLFxufTogQnV0dG9uU3R5bGVQcm9wcykgPT4gKHRoZW1lOiBUaGVtZSkgPT4ge1xuICByZXR1cm4ge1xuICAgIGZvbnRTaXplOiB0aGVtZS50eXBvZ3JhcGh5LmZvbnRTaXplc1snMTMnXSxcbiAgICBjdXJzb3I6IGRpc2FibGVkID8gJ25vdC1hbGxvd2VkJyA6ICdwb2ludGVyJyxcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICBvcGFjaXR5OiBkaXNhYmxlZCA/IDAuNSA6IDEsXG4gICAgdHJhbnNpdGlvbjogJ2FsbCAxNTBtcyBsaW5lYXInLFxuICAgIGNvbG9yOiBnZXRUZXh0Q29sb3Ioe1xuICAgICAgdGhlbWUsXG4gICAgICBvcGVuLFxuICAgICAgY2FsY3VsYXRlZENvbG9yLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICB9KSxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IGdldEJhY2tncm91bmRDb2xvcih7XG4gICAgICB0aGVtZSxcbiAgICAgIG9wZW4sXG4gICAgICBzdHlsZVR5cGUsXG4gICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgY2FsY3VsYXRlZENvbG9yLFxuICAgIH0pLFxuICAgIGJvcmRlcjogYCR7Ym9yZGVyU3R5bGVQYXJhbXN9ICR7Z2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgIH0pfWAsXG4gICAgZGlzcGxheTogJ2ZsZXgnLFxuICAgIGp1c3RpZnlDb250ZW50OiAnY2VudGVyJyxcbiAgICB3aWR0aDogJzEwMCUnLFxuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm9yZGVyOiBgJHtib3JkZXJTdHlsZVBhcmFtc30gJHtnZXRCb3JkZXIoe1xuICAgICAgICBzdHlsZVR5cGUsXG4gICAgICAgIHRoZW1lLFxuICAgICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgICBmaWx0ZXJUeXBlLFxuICAgICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICAgIG9wZW4sXG4gICAgICAgIHN0YXRlOiAnaG92ZXInLFxuICAgICAgfSl9YCxcbiAgICB9LFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IGRpdmlkZXIgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgY29uc3QgeyBvcGVuLCBjYWxjdWxhdGVkQ29sb3IsIHN0eWxlVHlwZSwgaGFzU2VsZWN0ZWRWYWx1ZSwgZmlsdGVyVHlwZSB9ID0gcHJvcHM7XG5cbiAgcmV0dXJuIHtcbiAgICBoZWlnaHQ6ICcxMDAlJyxcbiAgICB3aWR0aDogcmVtKDEpLFxuICAgIHBvc2l0aW9uOiAncmVsYXRpdmUnIGFzIGNvbnN0LFxuICAgIG1pbldpZHRoOiByZW0oMSksXG4gICAgdHJhbnNpdGlvbjogJ2FsbCAxNTBtcyBsaW5lYXInLFxuICAgIGJhY2tncm91bmRDb2xvcjogZ2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgICAgaXNEaXZpZGVyOiB0cnVlLFxuICAgIH0pLFxuICAgIGJvcmRlclRvcDogYCR7Ym9yZGVyU3R5bGVQYXJhbXN9ICR7Z2V0Qm9yZGVyKHtcbiAgICAgIHN0eWxlVHlwZSxcbiAgICAgIHRoZW1lLFxuICAgICAgaGFzU2VsZWN0ZWRWYWx1ZSxcbiAgICAgIGZpbHRlclR5cGUsXG4gICAgICBjYWxjdWxhdGVkQ29sb3IsXG4gICAgICBvcGVuLFxuICAgIH0pfWAsXG4gICAgYm9yZGVyQm90dG9tOiBgJHtib3JkZXJTdHlsZVBhcmFtc30gJHtnZXRCb3JkZXIoe1xuICAgICAgc3R5bGVUeXBlLFxuICAgICAgdGhlbWUsXG4gICAgICBoYXNTZWxlY3RlZFZhbHVlLFxuICAgICAgZmlsdGVyVHlwZSxcbiAgICAgIGNhbGN1bGF0ZWRDb2xvcixcbiAgICAgIG9wZW4sXG4gICAgfSl9YCxcbiAgfTtcbn07XG5cbmV4cG9ydCBjb25zdCBkaXZpZGVkQnV0dG9uU3R5bGUgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgcmV0dXJuIHtcbiAgICAuLi5idXR0b25CYXNlU3R5bGUocHJvcHMpKHRoZW1lKSxcbiAgICBib3JkZXJMZWZ0OiAnMCAhaW1wb3J0YW50JyxcbiAgICBwYWRkaW5nTGVmdDogcmVtKDQpLFxuICAgIHBhZGRpbmdSaWdodDogcmVtKDQpLFxuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgICBqdXN0aWZ5Q29udGVudDogJ2NlbnRlcicsXG4gICAgd2lkdGg6IHJlbSgzNCksXG4gICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6IHRoZW1lLnNwYWNpbmcubGcsXG4gICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6IHRoZW1lLnNwYWNpbmcubGcsXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgYnV0dG9uU3R5bGUgPSAocHJvcHM6IEJ1dHRvblN0eWxlUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgY29uc3QgeyBmaWx0ZXJUeXBlIH0gPSBwcm9wcztcbiAgY29uc3QgaXNQcmVzZXQgPSBmaWx0ZXJUeXBlID09PSAncHJlc2V0JztcblxuICByZXR1cm4ge1xuICAgIC4uLmJ1dHRvbkJhc2VTdHlsZShwcm9wcykodGhlbWUpLFxuICAgIHBhZGRpbmc6IGAwICR7IWlzUHJlc2V0ID8gdGhlbWUuc3BhY2luZy54c20gOiB0aGVtZS5zcGFjaW5nLm1kfSAwICR7dGhlbWUuc3BhY2luZy5tZH1gLFxuICAgIGJvcmRlclJhZGl1czogdGhlbWUuc3BhY2luZy5sZyxcbiAgICBib3JkZXJSaWdodDogIWlzUHJlc2V0ID8gJzAgIWltcG9ydGFudCcgOiB1bmRlZmluZWQsXG4gICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6ICFpc1ByZXNldCA/IDAgOiB1bmRlZmluZWQsXG4gICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6ICFpc1ByZXNldCA/IDAgOiB1bmRlZmluZWQsXG4gIH07XG59O1xuXG5leHBvcnQgY29uc3QgY2hpbGRyZW5XcmFwcGVyU3R5bGUgPSAoKSA9PiAoKSA9PiB7XG4gIHJldHVybiB7XG4gICAgbGluZUhlaWdodDogcmVtKDE1KSxcbiAgICBtYXJnaW5MZWZ0OiAwLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IGxhYmVsU3BhblN0eWxlID0gKG9wZW46IGJvb2xlYW4sIGhhc1NlbGVjdGVkVmFsdWU6IGJvb2xlYW4pID0+ICh0aGVtZTogVGhlbWUpID0+IHtcbiAgcmV0dXJuIHtcbiAgICBmb250V2VpZ2h0OlxuICAgICAgb3BlbiB8fCBoYXNTZWxlY3RlZFZhbHVlID8gdGhlbWUudHlwb2dyYXBoeS53ZWlnaHRzLmJvbGQgOiB0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMucmVndWxhcixcbiAgICBkaXNwbGF5OiAnZmxleCcsXG4gICAgYWxpZ25JdGVtczogJ2NlbnRlcicsXG4gICAgZGl2OiB7XG4gICAgICBmbGV4OiAnbm9uZScsXG4gICAgfSxcbiAgICBzcGFuOiB7XG4gICAgICBmb250V2VpZ2h0OiB0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMuYm9sZCxcbiAgICB9LFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IHZhbHVlU3BhblN0eWxlID0gKCkgPT4gY3NzYFxuICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IG1lbnVTdHlsZSA9ICgpID0+ICh0aGVtZTogVGhlbWUpID0+IGNzc2BcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6ICR7cmVtKDQ4KX07XG4gIG1pbi13aWR0aDogJHtyZW0oMjgwKX07XG4gIGxlZnQ6IDA7XG4gIGhlaWdodDogYXV0bztcbiAgYm9yZGVyLXJhZGl1czogJHt0aGVtZS5zcGFjaW5nLnhzbX07XG4gIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUucGFsZXR0ZS53aGl0ZX07XG4gIGJveC1zaGFkb3c6ICR7dGhlbWUuZWxldmF0aW9uWycwMiddfTtcbiAgei1pbmRleDogMTtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgbWluLXdpZHRoOiAxMDAlO1xuICBtYXgtd2lkdGg6ICR7cmVtKDYyMCl9O1xuYDtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:menuStyle;")
|
|
262
259
|
);
|
|
263
260
|
};
|
|
264
261
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { AcceptedIconNames } from '../../../Icon/types';
|
|
3
|
+
import { Props } from '../../types';
|
|
4
|
+
declare type FilterBaseProps = {
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
isDatePicker?: boolean;
|
|
7
|
+
handleOpen: () => void;
|
|
8
|
+
iconName: AcceptedIconNames;
|
|
9
|
+
onClear: () => void;
|
|
10
|
+
selectedItemLabel?: string;
|
|
11
|
+
open: boolean;
|
|
12
|
+
hasSelectedValue: boolean;
|
|
13
|
+
};
|
|
14
|
+
export declare const FilterBase: React.ForwardRefExoticComponent<FilterBaseProps & Pick<Props, "disabled" | "label" | "dataTestId" | "styleType" | "buttonType" | "filterType"> & React.RefAttributes<HTMLButtonElement>>;
|
|
15
|
+
export default FilterBase;
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports["default"] = exports.FilterBase = void 0;
|
|
5
|
+
|
|
6
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
+
|
|
8
|
+
var _useTheme = _interopRequireDefault(require("../../../../hooks/useTheme"));
|
|
9
|
+
|
|
10
|
+
var _useTypeColorToColorMatch = require("../../../../hooks/useTypeColorToColorMatch");
|
|
11
|
+
|
|
12
|
+
var _helpers = require("../../../../utils/helpers");
|
|
13
|
+
|
|
14
|
+
var _Icon = _interopRequireDefault(require("../../../Icon"));
|
|
15
|
+
|
|
16
|
+
var _Filter = require("../../Filter.style");
|
|
17
|
+
|
|
18
|
+
var _react2 = require("@emotion/react");
|
|
19
|
+
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
21
|
+
|
|
22
|
+
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); }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
26
|
+
var FilterBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
27
|
+
var dataTestId = props.dataTestId,
|
|
28
|
+
_props$isDatePicker = props.isDatePicker,
|
|
29
|
+
isDatePicker = _props$isDatePicker === void 0 ? false : _props$isDatePicker,
|
|
30
|
+
handleOpen = props.handleOpen,
|
|
31
|
+
disabled = props.disabled,
|
|
32
|
+
onClear = props.onClear,
|
|
33
|
+
selectedItemLabel = props.selectedItemLabel,
|
|
34
|
+
open = props.open,
|
|
35
|
+
hasSelectedValue = props.hasSelectedValue,
|
|
36
|
+
label = props.label,
|
|
37
|
+
iconName = props.iconName,
|
|
38
|
+
_props$buttonType = props.buttonType,
|
|
39
|
+
buttonType = _props$buttonType === void 0 ? 'primary' : _props$buttonType,
|
|
40
|
+
_props$filterType = props.filterType,
|
|
41
|
+
filterType = _props$filterType === void 0 ? 'preset' : _props$filterType,
|
|
42
|
+
styleType = props.styleType,
|
|
43
|
+
children = props.children;
|
|
44
|
+
|
|
45
|
+
var _useTypeColorToColorM = (0, _useTypeColorToColorMatch.useTypeColorToColorMatch)(),
|
|
46
|
+
calculateColorBetweenColorAndType = _useTypeColorToColorM.calculateColorBetweenColorAndType;
|
|
47
|
+
|
|
48
|
+
var calculatedColor = calculateColorBetweenColorAndType('', buttonType);
|
|
49
|
+
var theme = (0, _useTheme["default"])();
|
|
50
|
+
var buttonStyleProps = {
|
|
51
|
+
calculatedColor: calculatedColor,
|
|
52
|
+
buttonType: buttonType,
|
|
53
|
+
disabled: disabled,
|
|
54
|
+
open: open,
|
|
55
|
+
styleType: styleType,
|
|
56
|
+
hasSelectedValue: hasSelectedValue,
|
|
57
|
+
filterType: filterType
|
|
58
|
+
};
|
|
59
|
+
var pickIconColor = (0, _react.useCallback)(function (isCloseButton) {
|
|
60
|
+
if (isCloseButton === void 0) {
|
|
61
|
+
isCloseButton = false;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
if (open) {
|
|
65
|
+
return theme.utils.getColor('neutralWhite', 100);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
if (isCloseButton) {
|
|
69
|
+
if (hasSelectedValue) {
|
|
70
|
+
return theme.utils.getColor(calculatedColor.color, 550);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
return theme.utils.getColor('darkGrey', 400);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
return theme.utils.getColor('darkGrey', 850);
|
|
77
|
+
}, [calculatedColor.color, hasSelectedValue, open, theme.utils]);
|
|
78
|
+
return (0, _react2.jsx)("div", {
|
|
79
|
+
css: (0, _Filter.wrapperStyle)(),
|
|
80
|
+
"data-testid": dataTestId
|
|
81
|
+
}, (0, _react2.jsx)("button", {
|
|
82
|
+
ref: ref,
|
|
83
|
+
"data-testid": (0, _helpers.generateTestDataId)('filter', dataTestId),
|
|
84
|
+
onClick: handleOpen,
|
|
85
|
+
disabled: disabled,
|
|
86
|
+
css: (0, _Filter.buttonWrapperStyle)(buttonStyleProps)
|
|
87
|
+
}, (0, _react2.jsx)("div", {
|
|
88
|
+
css: (0, _Filter.buttonStyle)(buttonStyleProps)
|
|
89
|
+
}, (0, _react2.jsx)("div", {
|
|
90
|
+
css: (0, _Filter.buttonSpanStyle)()
|
|
91
|
+
}, (0, _react2.jsx)("div", {
|
|
92
|
+
css: (0, _Filter.childrenWrapperStyle)()
|
|
93
|
+
}, (0, _react2.jsx)("span", {
|
|
94
|
+
css: (0, _Filter.labelSpanStyle)(open, hasSelectedValue)
|
|
95
|
+
}, label && (0, _react2.jsx)("div", null, label, " ", !isDatePicker ? ':' : ''), selectedItemLabel && (0, _react2.jsx)("span", {
|
|
96
|
+
css: (0, _Filter.valueSpanStyle)()
|
|
97
|
+
}, selectedItemLabel))), (0, _react2.jsx)(_Icon["default"], {
|
|
98
|
+
name: iconName,
|
|
99
|
+
size: 14,
|
|
100
|
+
color: pickIconColor()
|
|
101
|
+
}))), filterType === 'added' && (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)("span", {
|
|
102
|
+
css: (0, _Filter.divider)(buttonStyleProps)
|
|
103
|
+
}), (0, _react2.jsx)("div", {
|
|
104
|
+
css: (0, _Filter.dividedButtonStyle)(buttonStyleProps)
|
|
105
|
+
}, (0, _react2.jsx)(_Icon["default"], {
|
|
106
|
+
size: 19,
|
|
107
|
+
name: 'closeTag',
|
|
108
|
+
color: pickIconColor(true),
|
|
109
|
+
onClick: function onClick(e) {
|
|
110
|
+
e.stopPropagation();
|
|
111
|
+
onClear();
|
|
112
|
+
}
|
|
113
|
+
})))), children);
|
|
114
|
+
});
|
|
115
|
+
exports.FilterBase = FilterBase;
|
|
116
|
+
FilterBase.displayName = 'FilterBase';
|
|
117
|
+
var _default = FilterBase;
|
|
118
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './FilterBase';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
exports["default"] = void 0;
|
|
5
|
+
|
|
6
|
+
var _FilterBase = _interopRequireDefault(require("./FilterBase"));
|
|
7
|
+
|
|
8
|
+
exports["default"] = _FilterBase["default"];
|
|
9
|
+
|
|
10
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -192,14 +192,15 @@ CalendarEmptyIcon.defaultProps = {
|
|
|
192
192
|
|
|
193
193
|
var CalendarFilledIcon = function CalendarFilledIcon(props) {
|
|
194
194
|
return (0, _react2.jsx)("svg", props, (0, _react2.jsx)("path", {
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
195
|
+
fillRule: "evenodd",
|
|
196
|
+
clipRule: "evenodd",
|
|
197
|
+
d: "M6.593 2h2v2h8V2h2v2h3v18h-18V4h3V2zm13 18V8h-14v12h14zm-13-10h8v2h-8v-2zm12 6h-8v2h8v-2zm-12-3h12v2h-12v-2z",
|
|
198
|
+
fill: "#0E0E17"
|
|
198
199
|
}));
|
|
199
200
|
};
|
|
200
201
|
|
|
201
202
|
CalendarFilledIcon.defaultProps = {
|
|
202
|
-
viewBox: "0 0
|
|
203
|
+
viewBox: "0 0 24 24",
|
|
203
204
|
xmlns: "http://www.w3.org/2000/svg"
|
|
204
205
|
};
|
|
205
206
|
|