@commercetools-uikit/select-utils 17.0.1 → 18.0.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.
|
@@ -51,8 +51,8 @@ var messages$1 = reactIntl.defineMessages({
|
|
|
51
51
|
});
|
|
52
52
|
|
|
53
53
|
const _excluded = ["ref", "onMouseDown"];
|
|
54
|
-
function ownKeys$6(
|
|
55
|
-
function _objectSpread$6(
|
|
54
|
+
function ownKeys$6(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
55
|
+
function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$6(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
56
56
|
const ClearIndicator = props => {
|
|
57
57
|
const intl = reactIntl.useIntl();
|
|
58
58
|
const getStyles = props.getStyles,
|
|
@@ -62,7 +62,7 @@ const ClearIndicator = props => {
|
|
|
62
62
|
restInnerProps = _objectWithoutProperties(_props$innerProps, _excluded);
|
|
63
63
|
return jsxRuntime.jsx("button", _objectSpread$6(_objectSpread$6({}, restInnerProps), {}, {
|
|
64
64
|
ref: ref,
|
|
65
|
-
css: /*#__PURE__*/react.css("border:none;cursor:pointer;background:none;box-sizing:border-box;text-decoration:none;fill:", designSystem.designTokens.
|
|
65
|
+
css: /*#__PURE__*/react.css("border:none;cursor:pointer;background:none;box-sizing:border-box;text-decoration:none;fill:", designSystem.designTokens.colorNeutral40, ";:hover svg *{fill:", designSystem.designTokens.colorError, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:ClearIndicator;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNsZWFyLWluZGljYXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMEJjIiwiZmlsZSI6ImNsZWFyLWluZGljYXRvci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Byb3BlcnRpZXMsIExlZ2FjeVJlZiB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHsgQ2xlYXJJbmRpY2F0b3JQcm9wcyB9IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyB1c2VJbnRsIH0gZnJvbSAncmVhY3QtaW50bCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7IENsb3NlSWNvbiB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2ljb25zJztcbmltcG9ydCBtZXNzYWdlcyBmcm9tICcuL21lc3NhZ2VzJztcblxudHlwZSBUSW5uZXJQcm9wcyA9IHtcbiAgcmVmOiBMZWdhY3lSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+O1xufSAmIEpTWC5JbnRyaW5zaWNFbGVtZW50c1snYnV0dG9uJ107XG5cbmV4cG9ydCB0eXBlIFRDbGVhckluZGljYXRvclByb3BzID0ge1xuICBpbm5lclByb3BzOiBUSW5uZXJQcm9wcztcbn0gJiBDbGVhckluZGljYXRvclByb3BzO1xuXG5jb25zdCBDbGVhckluZGljYXRvciA9IChwcm9wczogVENsZWFySW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgaW50bCA9IHVzZUludGwoKTtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IHJlZiwgb25Nb3VzZURvd24sIC4uLnJlc3RJbm5lclByb3BzIH0sXG4gIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8YnV0dG9uXG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlZn1cbiAgICAgIGNzcz17Y3NzYFxuICAgICAgICBib3JkZXI6IG5vbmU7XG4gICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgYmFja2dyb3VuZDogbm9uZTtcbiAgICAgICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICAgICAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICAgICAgICBmaWxsOiAke2Rlc2lnblRva2Vucy5jb2xvck5ldXRyYWw0MH07XG4gICAgICAgIDpob3ZlciBzdmcgKiB7XG4gICAgICAgICAgZmlsbDogJHtkZXNpZ25Ub2tlbnMuY29sb3JFcnJvcn07XG4gICAgICAgIH1cbiAgICAgIGB9XG4gICAgICBzdHlsZT17Z2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBDU1NQcm9wZXJ0aWVzfVxuICAgICAgdGl0bGU9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICAgIGFyaWEtbGFiZWw9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICAgIC8vIG92ZXJyaWRpbmcgdGhlIGRlZmF1bHQgYGFyaWEtaGlkZGVuYCBwcm9wIHZhbHVlIHRvIG1ha2UgdGhlIGNvbXBvbmVudCBhY2Nlc3NpYmxlIGJ5IGtleWJvYXJkIC0gaHR0cHM6Ly9naXRodWIuY29tL0plZFdhdHNvbi9yZWFjdC1zZWxlY3QvaXNzdWVzLzQ3OTNcbiAgICAgIGFyaWEtaGlkZGVuPXtmYWxzZX1cbiAgICAgIC8vIG9ubHkgb25Nb3VzZURvd24gYW5kIG9uVG91Y2hFbmQgZXZlbnQgaGFuZGxlcnMgYXJlIHBhc3NlZCBieSBgcmVhY3Qtc2VsZWN0YCB0byB0aGUgY29tcG9uZW50IGJ5IGRlZmF1bHQsIHdoaWNoIG1ha2VzIGl0IG5vdCBhY2Nlc3NpYmxlIGJ5IGtleWJvYXJkXG4gICAgICBvbkNsaWNrPXtvbk1vdXNlRG93bn1cbiAgICA+XG4gICAgICA8Q2xvc2VJY29uIHNpemU9XCJtZWRpdW1cIiAvPlxuICAgIDwvYnV0dG9uPlxuICApO1xufTtcblxuQ2xlYXJJbmRpY2F0b3IuZGlzcGxheU5hbWUgPSAnQ2xlYXJJbmRpY2F0b3InO1xuXG5leHBvcnQgZGVmYXVsdCBDbGVhckluZGljYXRvcjtcbiJdfQ== */"),
|
|
66
66
|
style: getStyles('clearIndicator', props),
|
|
67
67
|
title: intl.formatMessage(messages$1.clearButtonLabel),
|
|
68
68
|
"aria-label": intl.formatMessage(messages$1.clearButtonLabel)
|
|
@@ -80,8 +80,8 @@ const ClearIndicator = props => {
|
|
|
80
80
|
ClearIndicator.displayName = 'ClearIndicator';
|
|
81
81
|
var ClearIndicator$1 = ClearIndicator;
|
|
82
82
|
|
|
83
|
-
function ownKeys$5(
|
|
84
|
-
function _objectSpread$5(
|
|
83
|
+
function ownKeys$5(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
84
|
+
function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$5(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$5(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
85
85
|
// see https://github.com/JedWatson/react-select/blob/44e9fb29b230e49a754a2f0d6f30c2250aa45009/src/components/MultiValue.js
|
|
86
86
|
const removeProps = ['onClick', 'onTouchEnd', 'onMouseDown'];
|
|
87
87
|
const TagRemove = props => {
|
|
@@ -101,8 +101,8 @@ const TagRemove = props => {
|
|
|
101
101
|
TagRemove.displayName = 'TagRemove';
|
|
102
102
|
var TagRemove$1 = TagRemove;
|
|
103
103
|
|
|
104
|
-
function ownKeys$4(
|
|
105
|
-
function _objectSpread$4(
|
|
104
|
+
function ownKeys$4(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
105
|
+
function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$4(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
106
106
|
const DropdownIndicator = props => jsxRuntime.jsx(reactSelect.components.DropdownIndicator, _objectSpread$4(_objectSpread$4({}, props), {}, {
|
|
107
107
|
children: jsxRuntime.jsx(icons.CaretDownIcon, {
|
|
108
108
|
color: props.isDisabled ? 'neutral60' : undefined,
|
|
@@ -112,8 +112,8 @@ const DropdownIndicator = props => jsxRuntime.jsx(reactSelect.components.Dropdow
|
|
|
112
112
|
DropdownIndicator.displayName = 'DropdownIndicator';
|
|
113
113
|
var DropdownIndicator$1 = DropdownIndicator;
|
|
114
114
|
|
|
115
|
-
function ownKeys$3(
|
|
116
|
-
function _objectSpread$3(
|
|
115
|
+
function ownKeys$3(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
116
|
+
function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$3(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$3(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
117
117
|
const SearchIconDropdownIndicator = props => {
|
|
118
118
|
return jsxRuntime.jsx(reactSelect.components.DropdownIndicator, _objectSpread$3(_objectSpread$3({}, props), {}, {
|
|
119
119
|
children: jsxRuntime.jsx(icons.SearchIcon, {
|
|
@@ -125,8 +125,8 @@ const SearchIconDropdownIndicator = props => {
|
|
|
125
125
|
SearchIconDropdownIndicator.displayName = 'SearchIconDropdownIndicator';
|
|
126
126
|
var SearchIconDropdownIndicator$1 = SearchIconDropdownIndicator;
|
|
127
127
|
|
|
128
|
-
function ownKeys$2(
|
|
129
|
-
function _objectSpread$2(
|
|
128
|
+
function ownKeys$2(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
129
|
+
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
130
130
|
const getDefaultComponent = type => {
|
|
131
131
|
if (type === 'singleValue') return reactSelect.components.SingleValue;
|
|
132
132
|
if (type === 'placeholder') return reactSelect.components.Placeholder;
|
|
@@ -144,7 +144,7 @@ const WrapperWithIcon = props => {
|
|
|
144
144
|
// react-select uses absolute positioning for the SingleValue/Placeholder
|
|
145
145
|
// the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
|
|
146
146
|
// spacingsXs is the margin between the icon and value
|
|
147
|
-
css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.
|
|
147
|
+
css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.spacing20, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUErRGdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIHR5cGUgU2luZ2xlVmFsdWVQcm9wcyxcbiAgdHlwZSBQbGFjZWhvbGRlclByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5leHBvcnQgdHlwZSBUV3JhcHBlcldpdGhJY29uU2VsZWN0UHJvcHMgPSB7XG4gIGljb25MZWZ0PzogUmVhY3RFbGVtZW50O1xufTtcbmV4cG9ydCB0eXBlIFRTaW5nbGVWYWx1ZVdyYXBwZXJXaXRoSWNvblByb3BzID0ge1xuICB0eXBlOiAnc2luZ2xlVmFsdWUnO1xuICBzZWxlY3RQcm9wcz86IFRXcmFwcGVyV2l0aEljb25TZWxlY3RQcm9wcztcbn0gJiBTaW5nbGVWYWx1ZVByb3BzO1xuZXhwb3J0IHR5cGUgVFBsYWNlaG9sZGVyV3JhcHBlcldpdGhJY29uUHJvcHMgPSB7XG4gIHR5cGU6ICdwbGFjZWhvbGRlcic7XG4gIHNlbGVjdFByb3BzPzogVFdyYXBwZXJXaXRoSWNvblNlbGVjdFByb3BzO1xufSAmIFBsYWNlaG9sZGVyUHJvcHM7XG5leHBvcnQgdHlwZSBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPiA9XG4gIFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnXG4gICAgPyBUU2luZ2xlVmFsdWVXcmFwcGVyV2l0aEljb25Qcm9wc1xuICAgIDogVHlwZSBleHRlbmRzICdwbGFjZWhvbGRlcidcbiAgICA/IFRQbGFjZWhvbGRlcldyYXBwZXJXaXRoSWNvblByb3BzXG4gICAgOiBuZXZlcjtcbmV4cG9ydCB0eXBlIFREZWZhdWx0Q29tcG9uZW50PFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4gPSAoXG4gIHByb3BzOiBUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJ1xuICAgID8gU2luZ2xlVmFsdWVQcm9wc1xuICAgIDogVHlwZSBleHRlbmRzICdwbGFjZWhvbGRlcidcbiAgICA/IFBsYWNlaG9sZGVyUHJvcHNcbiAgICA6IG5ldmVyXG4pID0+IEpTWC5FbGVtZW50O1xuXG5jb25zdCBnZXREZWZhdWx0Q29tcG9uZW50ID0gPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4oXG4gIHR5cGU6IFRXcmFwcGVyV2l0aEljb25Qcm9wczxUeXBlPlsndHlwZSddXG4pOiBURGVmYXVsdENvbXBvbmVudDxUeXBlPiB8IG51bGwgPT4ge1xuICBpZiAodHlwZSA9PT0gJ3NpbmdsZVZhbHVlJylcbiAgICByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuU2luZ2xlVmFsdWUgYXMgVERlZmF1bHRDb21wb25lbnQ8VHlwZT47XG4gIGlmICh0eXBlID09PSAncGxhY2Vob2xkZXInKVxuICAgIHJldHVybiBkZWZhdWx0Q29tcG9uZW50cy5QbGFjZWhvbGRlciBhcyBURGVmYXVsdENvbXBvbmVudDxUeXBlPjtcbiAgcmV0dXJuIG51bGw7XG59O1xuXG5jb25zdCBXcmFwcGVyV2l0aEljb24gPSA8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPihcbiAgcHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wczxUeXBlPlxuKSA9PiB7XG4gIGNvbnN0IERlZmF1bHRDb21wb25lbnQgPSBnZXREZWZhdWx0Q29tcG9uZW50PFR5cGU+KHByb3BzLnR5cGUpO1xuXG4gIGlmICghRGVmYXVsdENvbXBvbmVudCkge1xuICAgIHJldHVybiBudWxsO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8PlxuICAgICAge3Byb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0ICYmXG4gICAgICAgIGNsb25lRWxlbWVudChwcm9wcy5zZWxlY3RQcm9wcy5pY29uTGVmdCwge1xuICAgICAgICAgIHNpemU6ICdiaWcnLFxuICAgICAgICB9KX1cbiAgICAgIDxzcGFuXG4gICAgICAgIC8vIHJlYWN0LXNlbGVjdCB1c2VzIGFic29sdXRlIHBvc2l0aW9uaW5nIGZvciB0aGUgU2luZ2xlVmFsdWUvUGxhY2Vob2xkZXJcbiAgICAgICAgLy8gdGhlIGljb24gaGFzIGEgZml4ZWQgc2l6ZSBvZiAyNHB4ICg9PSBTcGFjaW5nc1hsKSwgdGhlcmVmb3JlIHdlIGNhbiB1c2UgYSBmaXhlZCBtYXJnaW5cbiAgICAgICAgLy8gc3BhY2luZ3NYcyBpcyB0aGUgbWFyZ2luIGJldHdlZW4gdGhlIGljb24gYW5kIHZhbHVlXG4gICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgIG1hcmdpbi1sZWZ0OiAke2Rlc2lnblRva2Vucy5zcGFjaW5nMjB9O1xuICAgICAgICBgfVxuICAgICAgPlxuICAgICAgICB7LyogQHRzLWlnbm9yZSAqL31cbiAgICAgICAgPERlZmF1bHRDb21wb25lbnQgey4uLnByb3BzfSAvPlxuICAgICAgPC9zcGFuPlxuICAgIDwvPlxuICApO1xufTtcblxuV3JhcHBlcldpdGhJY29uLmRpc3BsYXlOYW1lID0gJ1dyYXBwZXJXaXRoSWNvbic7XG5cbmV4cG9ydCBkZWZhdWx0IFdyYXBwZXJXaXRoSWNvbjtcblxuY29uc3QgY3VzdG9tQ29tcG9uZW50cyA9IHtcbiAgU2luZ2xlVmFsdWU6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPCdzaW5nbGVWYWx1ZSc+KSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbjwnc2luZ2xlVmFsdWUnPiB7Li4ucHJvcHN9IHR5cGU9XCJzaW5nbGVWYWx1ZVwiIC8+XG4gICksXG4gIFBsYWNlaG9sZGVyOiAocHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wczwncGxhY2Vob2xkZXInPikgPT4gKFxuICAgIDxXcmFwcGVyV2l0aEljb248J3BsYWNlaG9sZGVyJz4gey4uLnByb3BzfSB0eXBlPVwicGxhY2Vob2xkZXJcIiAvPlxuICApLFxufTtcblxuZXhwb3J0IHsgY3VzdG9tQ29tcG9uZW50cyB9O1xuIl19 */"),
|
|
148
148
|
children: jsxRuntime.jsx(DefaultComponent, _objectSpread$2({}, props))
|
|
149
149
|
})]
|
|
150
150
|
});
|
|
@@ -167,8 +167,8 @@ const SELECT_DROPDOWN_OPTION_TYPES = {
|
|
|
167
167
|
MULTIPLE_PROPERTIES: 'multiple-properties'
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
-
function ownKeys$1(
|
|
171
|
-
function _objectSpread$1(
|
|
170
|
+
function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
171
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
172
172
|
const MultiplePropertiesSelectInputOption = props => {
|
|
173
173
|
const data = props.data;
|
|
174
174
|
const noValueFallback = props.noValueFallback || NO_VALUE_FALLBACK;
|
|
@@ -253,8 +253,8 @@ var messages = reactIntl.defineMessages({
|
|
|
253
253
|
}
|
|
254
254
|
});
|
|
255
255
|
|
|
256
|
-
function ownKeys(
|
|
257
|
-
function _objectSpread(
|
|
256
|
+
function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
257
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context9, _context10; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(t), !0)).call(_context9, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(t))).call(_context10, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
|
|
258
258
|
const getHorizontalConstraintValue = value => {
|
|
259
259
|
switch (value) {
|
|
260
260
|
case 'auto':
|
|
@@ -283,7 +283,7 @@ const getInputBorderColor = (props, state) => {
|
|
|
283
283
|
return designSystem.designTokens.borderColorForInputWhenDisabled;
|
|
284
284
|
}
|
|
285
285
|
if (props.isReadOnly) {
|
|
286
|
-
return designSystem.designTokens.
|
|
286
|
+
return designSystem.designTokens.colorNeutral95;
|
|
287
287
|
}
|
|
288
288
|
if (state.isFocused) {
|
|
289
289
|
return designSystem.designTokens.borderColorForInputWhenFocused;
|
|
@@ -304,7 +304,7 @@ const getHoverInputBorderColor = props => {
|
|
|
304
304
|
return designSystem.designTokens.borderColorForInputWhenDisabled;
|
|
305
305
|
}
|
|
306
306
|
if (props.isReadOnly) {
|
|
307
|
-
return designSystem.designTokens.
|
|
307
|
+
return designSystem.designTokens.colorNeutral95;
|
|
308
308
|
}
|
|
309
309
|
if (props.hasError) {
|
|
310
310
|
return designSystem.designTokens.borderColorForInputWhenError;
|
|
@@ -317,12 +317,12 @@ const getHoverInputBorderColor = props => {
|
|
|
317
317
|
const controlStyles = props => (base, state) => {
|
|
318
318
|
var _context;
|
|
319
319
|
return _objectSpread(_objectSpread(_objectSpread({}, base), {}, {
|
|
320
|
-
fontSize: designSystem.designTokens.
|
|
320
|
+
fontSize: designSystem.designTokens.fontSize30,
|
|
321
321
|
backgroundColor: getInputBackgroundColor(props),
|
|
322
322
|
borderColor: getInputBorderColor(props, state),
|
|
323
323
|
borderWidth: (() => {
|
|
324
324
|
if (props.hasWarning || props.hasError || state.isFocused || props.appearance === 'quiet') {
|
|
325
|
-
return designSystem.designTokens.
|
|
325
|
+
return designSystem.designTokens.borderWidth2;
|
|
326
326
|
}
|
|
327
327
|
return designSystem.designTokens.borderWidth1;
|
|
328
328
|
})(),
|
|
@@ -333,7 +333,7 @@ const controlStyles = props => (base, state) => {
|
|
|
333
333
|
if (props.isReadOnly) return 'default';
|
|
334
334
|
return 'pointer';
|
|
335
335
|
})(),
|
|
336
|
-
padding: props.appearance === 'quiet' ?
|
|
336
|
+
padding: props.appearance === 'quiet' ? designSystem.designTokens.paddingForInputAsQuiet : designSystem.designTokens.paddingForInput,
|
|
337
337
|
transition: _concatInstanceProperty__default["default"](_context = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n box-shadow ")).call(_context, designSystem.designTokens.transitionStandard),
|
|
338
338
|
outline: 0,
|
|
339
339
|
boxShadow: 'none'
|
|
@@ -365,16 +365,17 @@ const controlStyles = props => (base, state) => {
|
|
|
365
365
|
};
|
|
366
366
|
const menuStyles = props => base => {
|
|
367
367
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
368
|
-
border: "1px solid ".concat(designSystem.designTokens.
|
|
368
|
+
border: "1px solid ".concat(designSystem.designTokens.colorSurface),
|
|
369
369
|
borderRadius: designSystem.designTokens.borderRadiusForInput,
|
|
370
370
|
backgroundColor: designSystem.designTokens.backgroundColorForInput,
|
|
371
|
-
boxShadow:
|
|
372
|
-
fontSize: designSystem.designTokens.
|
|
371
|
+
boxShadow: '0 2px 5px 0px rgba(0, 0, 0, 0.15)',
|
|
372
|
+
fontSize: designSystem.designTokens.fontSize30,
|
|
373
373
|
fontFamily: 'inherit',
|
|
374
374
|
margin: "".concat(designSystem.designTokens.spacing10, " 0 0 0"),
|
|
375
375
|
borderColor: (() => {
|
|
376
|
-
if (props.hasError
|
|
377
|
-
|
|
376
|
+
if (props.hasError || props.hasWarning) {
|
|
377
|
+
return designSystem.designTokens.colorSurface;
|
|
378
|
+
}
|
|
378
379
|
return base.borderColorForInput;
|
|
379
380
|
})(),
|
|
380
381
|
width: props.horizontalConstraint === 'auto' ? 'auto' : '100%',
|
|
@@ -395,36 +396,33 @@ const dropdownIndicatorStyles = props => base => {
|
|
|
395
396
|
color: designSystem.designTokens.fontColorForInput,
|
|
396
397
|
margin: '0',
|
|
397
398
|
padding: '0',
|
|
398
|
-
marginLeft: designSystem.designTokens.
|
|
399
|
+
marginLeft: designSystem.designTokens.spacing20,
|
|
399
400
|
fill: (() => {
|
|
400
401
|
if (props.isDisabled || props.isReadOnly) return designSystem.designTokens.fontColorForInputWhenDisabled;
|
|
401
|
-
if (props.hasError) return designSystem.designTokens.
|
|
402
|
-
if (props.hasWarning) return designSystem.designTokens.
|
|
403
|
-
return designSystem.designTokens.
|
|
402
|
+
if (props.hasError) return designSystem.designTokens.colorError;
|
|
403
|
+
if (props.hasWarning) return designSystem.designTokens.colorWarning;
|
|
404
|
+
return designSystem.designTokens.colorNeutral60;
|
|
404
405
|
})()
|
|
405
406
|
});
|
|
406
407
|
};
|
|
407
408
|
const clearIndicatorStyles = () => base => _objectSpread(_objectSpread({}, base), {}, {
|
|
408
409
|
display: 'flex',
|
|
409
410
|
padding: 0,
|
|
410
|
-
marginLeft: designSystem.designTokens.
|
|
411
|
+
marginLeft: designSystem.designTokens.spacing20
|
|
411
412
|
});
|
|
412
413
|
const menuListStyles = () => base => {
|
|
413
414
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
414
|
-
padding: designSystem.designTokens.
|
|
415
|
+
padding: "".concat(designSystem.designTokens.spacing10, " 0"),
|
|
415
416
|
borderRadius: designSystem.designTokens.borderRadiusForInput,
|
|
416
417
|
backgroundColor: designSystem.designTokens.backgroundColorForInput
|
|
417
418
|
});
|
|
418
419
|
};
|
|
419
420
|
const optionStyles = () => (base, state) => {
|
|
420
|
-
var _context2, _context3;
|
|
421
|
+
var _context2, _context3, _context4;
|
|
421
422
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
422
423
|
transition: _concatInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](_context3 = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n background-color ")).call(_context3, designSystem.designTokens.transitionStandard, ",\n color ")).call(_context2, designSystem.designTokens.transitionStandard),
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
paddingTop: designSystem.designTokens.paddingTopForSelectInputOptions,
|
|
426
|
-
paddingBottom: designSystem.designTokens.paddingBottomForSelectInputOptions,
|
|
427
|
-
lineHeight: designSystem.designTokens.lineHeightForSelectInputOptions,
|
|
424
|
+
padding: _concatInstanceProperty__default["default"](_context4 = "".concat(designSystem.designTokens.spacing20, " ")).call(_context4, designSystem.designTokens.spacing30),
|
|
425
|
+
lineHeight: designSystem.designTokens.lineHeight40,
|
|
428
426
|
color: (() => {
|
|
429
427
|
if (!state.isDisabled) return designSystem.designTokens.fontColorForInput;
|
|
430
428
|
if (state.isSelected) return designSystem.designTokens.fontColorForInput;
|
|
@@ -432,7 +430,7 @@ const optionStyles = () => (base, state) => {
|
|
|
432
430
|
})(),
|
|
433
431
|
backgroundColor: (() => {
|
|
434
432
|
if (state.isSelected) return designSystem.designTokens.backgroundColorForInputWhenSelected;
|
|
435
|
-
if (state.isFocused) return designSystem.designTokens.
|
|
433
|
+
if (state.isFocused) return designSystem.designTokens.colorNeutral98;
|
|
436
434
|
return base.backgroundColor;
|
|
437
435
|
})(),
|
|
438
436
|
'&:active': {
|
|
@@ -449,13 +447,13 @@ const placeholderStyles = props => base => {
|
|
|
449
447
|
color: (() => {
|
|
450
448
|
if (props.appearance === 'quiet' && !props.isReadOnly && !props.isDisabled) {
|
|
451
449
|
if (props.hasError) {
|
|
452
|
-
return designSystem.designTokens.
|
|
450
|
+
return designSystem.designTokens.colorError;
|
|
453
451
|
}
|
|
454
452
|
if (props.hasWarning) {
|
|
455
|
-
return designSystem.designTokens.
|
|
453
|
+
return designSystem.designTokens.colorWarning;
|
|
456
454
|
}
|
|
457
455
|
}
|
|
458
|
-
return designSystem.designTokens.
|
|
456
|
+
return designSystem.designTokens.colorNeutral60;
|
|
459
457
|
})(),
|
|
460
458
|
width: '100%',
|
|
461
459
|
overflow: 'hidden',
|
|
@@ -474,7 +472,7 @@ const valueContainerStyles = props => base => {
|
|
|
474
472
|
// Display property should be Flex when there is an iconLeft, also when the input has some values when isMulti.
|
|
475
473
|
// See PR from react select for more insight https://github.com/JedWatson/react-select/pull/4833
|
|
476
474
|
display: props.iconLeft && !props.isMulti || props.isMulti && props.hasValue && ((_props$controlShouldR = props.controlShouldRenderValue) !== null && _props$controlShouldR !== void 0 ? _props$controlShouldR : true) ? 'flex' : 'grid',
|
|
477
|
-
fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : designSystem.designTokens.
|
|
475
|
+
fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : designSystem.designTokens.colorNeutral60
|
|
478
476
|
});
|
|
479
477
|
};
|
|
480
478
|
const singleValueStyles = props => base => {
|
|
@@ -486,8 +484,8 @@ const singleValueStyles = props => base => {
|
|
|
486
484
|
if (props.isReadOnly) {
|
|
487
485
|
return designSystem.designTokens.fontColorForInputWhenReadonly;
|
|
488
486
|
}
|
|
489
|
-
if (props.hasError) return designSystem.designTokens.
|
|
490
|
-
if (props.hasWarning) return designSystem.designTokens.
|
|
487
|
+
if (props.hasError) return designSystem.designTokens.colorError;
|
|
488
|
+
if (props.hasWarning) return designSystem.designTokens.colorWarning;
|
|
491
489
|
return designSystem.designTokens.fontColorForInput;
|
|
492
490
|
})()
|
|
493
491
|
});
|
|
@@ -496,19 +494,19 @@ const groupStyles = props => base => {
|
|
|
496
494
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
497
495
|
padding: 0,
|
|
498
496
|
'&:not(:first-of-type)': {
|
|
499
|
-
borderTop: props.showOptionGroupDivider ? "1px solid ".concat(designSystem.designTokens.
|
|
497
|
+
borderTop: props.showOptionGroupDivider ? "1px solid ".concat(designSystem.designTokens.colorNeutral90) : base.borderTop
|
|
500
498
|
}
|
|
501
499
|
});
|
|
502
500
|
};
|
|
503
501
|
const groupHeadingStyles = () => base => {
|
|
504
|
-
var
|
|
502
|
+
var _context5;
|
|
505
503
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
506
504
|
color: designSystem.designTokens.fontColorForInputWhenReadonly,
|
|
507
|
-
fontSize: designSystem.designTokens.
|
|
508
|
-
borderBottom: "1px solid ".concat(designSystem.designTokens.
|
|
505
|
+
fontSize: designSystem.designTokens.fontSize30,
|
|
506
|
+
borderBottom: "1px solid ".concat(designSystem.designTokens.colorNeutral90),
|
|
509
507
|
textTransform: 'none',
|
|
510
508
|
fontWeight: designSystem.designTokens.fontWeight500,
|
|
511
|
-
padding: _concatInstanceProperty__default["default"](
|
|
509
|
+
padding: _concatInstanceProperty__default["default"](_context5 = "".concat(designSystem.designTokens.spacing20, " ")).call(_context5, designSystem.designTokens.spacing30),
|
|
512
510
|
'&:empty': {
|
|
513
511
|
padding: 0
|
|
514
512
|
}
|
|
@@ -517,7 +515,7 @@ const groupHeadingStyles = () => base => {
|
|
|
517
515
|
const containerStyles = () => (base, state) => {
|
|
518
516
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
519
517
|
fontFamily: 'inherit',
|
|
520
|
-
minHeight: designSystem.designTokens.
|
|
518
|
+
minHeight: designSystem.designTokens.heightForInputAsSmall,
|
|
521
519
|
borderRadius: designSystem.designTokens.borderRadiusForInput,
|
|
522
520
|
borderColor: state.isFocused ? designSystem.designTokens.borderColorForInputWhenFocused : base.borderColor,
|
|
523
521
|
boxShadow: state.isFocused ? 'none' : base.boxShadow
|
|
@@ -534,50 +532,50 @@ const menuPortalStyles = props => base => _objectSpread(_objectSpread({}, base),
|
|
|
534
532
|
const multiValueStyles = () => base => {
|
|
535
533
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
536
534
|
display: 'flex',
|
|
537
|
-
alignItems:
|
|
538
|
-
height:
|
|
539
|
-
backgroundColor: designSystem.designTokens.
|
|
535
|
+
alignItems: 'center',
|
|
536
|
+
height: '32px',
|
|
537
|
+
backgroundColor: designSystem.designTokens.colorNeutral95,
|
|
540
538
|
padding: '0',
|
|
541
|
-
border: designSystem.designTokens.
|
|
539
|
+
border: "1px solid ".concat(designSystem.designTokens.colorNeutral85)
|
|
542
540
|
});
|
|
543
541
|
};
|
|
544
542
|
const multiValueLabelStyles = props => base => {
|
|
545
|
-
var
|
|
543
|
+
var _context6, _context7;
|
|
546
544
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
547
|
-
fontSize: designSystem.designTokens.
|
|
545
|
+
fontSize: designSystem.designTokens.fontSize30,
|
|
548
546
|
color: (() => {
|
|
549
547
|
if (props.isDisabled) return designSystem.designTokens.fontColorForInputWhenDisabled;
|
|
550
548
|
if (props.isReadOnly) return designSystem.designTokens.fontColorForInputWhenReadonly;
|
|
551
549
|
return base.color;
|
|
552
550
|
})(),
|
|
553
|
-
padding: _concatInstanceProperty__default["default"](
|
|
554
|
-
borderRadius: _concatInstanceProperty__default["default"](
|
|
551
|
+
padding: _concatInstanceProperty__default["default"](_context6 = "".concat(designSystem.designTokens.spacing10, " ")).call(_context6, designSystem.designTokens.spacing20),
|
|
552
|
+
borderRadius: _concatInstanceProperty__default["default"](_context7 = "".concat(designSystem.designTokens.borderRadius2, " 0 0 ")).call(_context7, designSystem.designTokens.borderRadius2),
|
|
555
553
|
border: 'none',
|
|
556
554
|
borderWidth: '1px 0 1px 1px',
|
|
557
555
|
'&:last-child': {
|
|
558
|
-
borderRadius: designSystem.designTokens.
|
|
556
|
+
borderRadius: designSystem.designTokens.borderRadius2,
|
|
559
557
|
borderWidth: designSystem.designTokens.borderWidth1
|
|
560
558
|
}
|
|
561
559
|
});
|
|
562
560
|
};
|
|
563
561
|
const multiValueRemoveStyles = props => (base, state) => {
|
|
564
|
-
var
|
|
562
|
+
var _context8;
|
|
565
563
|
return _objectSpread(_objectSpread({}, base), {}, {
|
|
566
|
-
borderColor: designSystem.designTokens.
|
|
564
|
+
borderColor: designSystem.designTokens.colorNeutral,
|
|
567
565
|
padding: "0 ".concat(designSystem.designTokens.spacing10),
|
|
568
|
-
borderRadius: _concatInstanceProperty__default["default"](
|
|
566
|
+
borderRadius: _concatInstanceProperty__default["default"](_context8 = "0 ".concat(designSystem.designTokens.borderRadius2, " ")).call(_context8, designSystem.designTokens.borderRadius2, " 0"),
|
|
569
567
|
borderStyle: 'none',
|
|
570
568
|
borderWidth: '0',
|
|
571
569
|
pointerEvents: state.isDisabled || props.isReadOnly ? 'none' : base.pointerEvents,
|
|
572
|
-
backgroundColor: designSystem.designTokens.
|
|
570
|
+
backgroundColor: designSystem.designTokens.colorNeutral95,
|
|
573
571
|
'svg *': {
|
|
574
572
|
fill: props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenReadonly : ''
|
|
575
573
|
},
|
|
576
574
|
'&:hover, &:focus': {
|
|
577
|
-
borderColor: designSystem.designTokens.
|
|
578
|
-
backgroundColor: designSystem.designTokens.
|
|
575
|
+
borderColor: designSystem.designTokens.colorWarning,
|
|
576
|
+
backgroundColor: designSystem.designTokens.colorNeutral95,
|
|
579
577
|
'svg *': {
|
|
580
|
-
fill: designSystem.designTokens.
|
|
578
|
+
fill: designSystem.designTokens.colorError
|
|
581
579
|
}
|
|
582
580
|
}
|
|
583
581
|
});
|
|
@@ -614,7 +612,7 @@ const warnIfMenuPortalPropsAreMissing = props => {
|
|
|
614
612
|
};
|
|
615
613
|
|
|
616
614
|
// NOTE: This string will be replaced on build time with the package version.
|
|
617
|
-
var version = "
|
|
615
|
+
var version = "18.0.0";
|
|
618
616
|
|
|
619
617
|
exports.ClearIndicator = ClearIndicator$1;
|
|
620
618
|
exports.CustomSelectInputOption = CustomSelectInputOption;
|