@wireapp/react-ui-kit 8.3.0 → 8.5.1
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/CHANGELOG.md +36 -3
- package/package.json +2 -2
- package/src/Form/CodeInput.js +10 -4
- package/src/Form/CodeInput.js.map +1 -1
- package/src/Form/CodeInput.md +9 -1
- package/src/Form/Form.md +3 -3
- package/src/Form/Input.d.ts +0 -1
- package/src/Form/Input.js +14 -22
- package/src/Form/Input.js.map +1 -1
- package/src/Form/InputLabel.d.js +2 -0
- package/src/Form/InputLabel.d.js.map +1 -0
- package/src/Form/InputLabel.d.ts +9 -0
- package/src/Form/InputLabel.js +47 -0
- package/src/Form/InputLabel.js.map +1 -0
- package/src/Form/InputLabel.md +33 -0
- package/src/Form/Select.d.js +4 -0
- package/src/Form/Select.d.ts +18 -4
- package/src/Form/Select.js +285 -12
- package/src/Form/Select.js.map +1 -1
- package/src/Form/Select.md +56 -13
- package/src/Form/index.d.js +13 -0
- package/src/Form/index.d.js.map +1 -1
- package/src/Form/index.d.ts +1 -0
- package/src/Form/index.js +13 -0
- package/src/Form/index.js.map +1 -1
- package/src/Layout/Theme.js +3 -1
- package/src/Layout/Theme.js.map +1 -1
- package/src/Text/Label.md +18 -18
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
|
|
10
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
|
|
12
|
+
var _react = require("@emotion/react");
|
|
13
|
+
|
|
14
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
|
+
|
|
16
|
+
var _Identity = require("../Identity");
|
|
17
|
+
|
|
18
|
+
var _react2 = _interopRequireDefault(require("react"));
|
|
19
|
+
|
|
20
|
+
var _excluded = ["htmlFor", "markInvalid", "isRequired", "children"];
|
|
21
|
+
|
|
22
|
+
var InputLabel = function InputLabel(_ref) {
|
|
23
|
+
var htmlFor = _ref.htmlFor,
|
|
24
|
+
markInvalid = _ref.markInvalid,
|
|
25
|
+
isRequired = _ref.isRequired,
|
|
26
|
+
children = _ref.children,
|
|
27
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
28
|
+
return (0, _react.jsx)("label", (0, _extends2["default"])({
|
|
29
|
+
htmlFor: htmlFor,
|
|
30
|
+
css: /*#__PURE__*/(0, _react.css)({
|
|
31
|
+
fontSize: '14px',
|
|
32
|
+
fontWeight: 400,
|
|
33
|
+
lineHeight: '16px',
|
|
34
|
+
color: markInvalid ? _Identity.COLOR_V2.RED_LIGHT_500 : _Identity.COLOR_V2.GRAY_80
|
|
35
|
+
}, process.env.NODE_ENV === "production" ? "" : ";label:InputLabel;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIklucHV0TGFiZWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtDSSIsImZpbGUiOiJJbnB1dExhYmVsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBXaXJlXG4gKiBDb3B5cmlnaHQgKEMpIDIwMjIgV2lyZSBTd2lzcyBHbWJIXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGZyZWUgc29mdHdhcmU6IHlvdSBjYW4gcmVkaXN0cmlidXRlIGl0IGFuZC9vciBtb2RpZnlcbiAqIGl0IHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgYXMgcHVibGlzaGVkIGJ5XG4gKiB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uLCBlaXRoZXIgdmVyc2lvbiAzIG9mIHRoZSBMaWNlbnNlLCBvclxuICogKGF0IHlvdXIgb3B0aW9uKSBhbnkgbGF0ZXIgdmVyc2lvbi5cbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCxcbiAqIGJ1dCBXSVRIT1VUIEFOWSBXQVJSQU5UWTsgd2l0aG91dCBldmVuIHRoZSBpbXBsaWVkIHdhcnJhbnR5IG9mXG4gKiBNRVJDSEFOVEFCSUxJVFkgb3IgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UuIFNlZSB0aGVcbiAqIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGZvciBtb3JlIGRldGFpbHMuXG4gKlxuICogWW91IHNob3VsZCBoYXZlIHJlY2VpdmVkIGEgY29weSBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2VcbiAqIGFsb25nIHdpdGggdGhpcyBwcm9ncmFtLiBJZiBub3QsIHNlZSBodHRwOi8vd3d3LmdudS5vcmcvbGljZW5zZXMvLlxuICpcbiAqL1xuXG4vKiogQGpzeCBqc3ggKi9cbmltcG9ydCB7anN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQge0NPTE9SX1YyfSBmcm9tICcuLi9JZGVudGl0eSc7XG5pbXBvcnQgUmVhY3QsIHtGQywgUmVhY3ROb2RlfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSW5wdXRMYWJlbFByb3BzIHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZSB8IHN0cmluZztcbiAgaHRtbEZvcj86IHN0cmluZztcbiAgbWFya0ludmFsaWQ/OiBib29sZWFuO1xuICBpc1JlcXVpcmVkPzogYm9vbGVhbjtcbn1cblxuY29uc3QgSW5wdXRMYWJlbDogRkM8SW5wdXRMYWJlbFByb3BzPiA9ICh7aHRtbEZvciwgbWFya0ludmFsaWQsIGlzUmVxdWlyZWQsIGNoaWxkcmVuLCAuLi5wcm9wc30pID0+IChcbiAgPGxhYmVsXG4gICAgaHRtbEZvcj17aHRtbEZvcn1cbiAgICBjc3M9e3tcbiAgICAgIGZvbnRTaXplOiAnMTRweCcsXG4gICAgICBmb250V2VpZ2h0OiA0MDAsXG4gICAgICBsaW5lSGVpZ2h0OiAnMTZweCcsXG4gICAgICBjb2xvcjogbWFya0ludmFsaWQgPyBDT0xPUl9WMi5SRURfTElHSFRfNTAwIDogQ09MT1JfVjIuR1JBWV84MCxcbiAgICB9fVxuICAgIHsuLi5wcm9wc31cbiAgPlxuICAgIHtjaGlsZHJlbn1cblxuICAgIHtpc1JlcXVpcmVkICYmIDxzcGFuIGNzcz17e2ZvbnRTaXplOiAnMTZweCcsIG1hcmdpbkxlZnQ6ICc0cHgnLCBjb2xvcjogQ09MT1JfVjIuUkVEX0xJR0hUXzUwMH19Pio8L3NwYW4+fVxuICA8L2xhYmVsPlxuKTtcblxuZXhwb3J0IGRlZmF1bHQgSW5wdXRMYWJlbDtcbiJdfQ== */")
|
|
36
|
+
}, props), children, isRequired && (0, _react.jsx)("span", {
|
|
37
|
+
css: /*#__PURE__*/(0, _react.css)({
|
|
38
|
+
fontSize: '16px',
|
|
39
|
+
marginLeft: '4px',
|
|
40
|
+
color: _Identity.COLOR_V2.RED_LIGHT_500
|
|
41
|
+
}, process.env.NODE_ENV === "production" ? "" : ";label:InputLabel;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIklucHV0TGFiZWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTRDeUIiLCJmaWxlIjoiSW5wdXRMYWJlbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogV2lyZVxuICogQ29weXJpZ2h0IChDKSAyMDIyIFdpcmUgU3dpc3MgR21iSFxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBmcmVlIHNvZnR3YXJlOiB5b3UgY2FuIHJlZGlzdHJpYnV0ZSBpdCBhbmQvb3IgbW9kaWZ5XG4gKiBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGFzIHB1Ymxpc2hlZCBieVxuICogdGhlIEZyZWUgU29mdHdhcmUgRm91bmRhdGlvbiwgZWl0aGVyIHZlcnNpb24gMyBvZiB0aGUgTGljZW5zZSwgb3JcbiAqIChhdCB5b3VyIG9wdGlvbikgYW55IGxhdGVyIHZlcnNpb24uXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGRpc3RyaWJ1dGVkIGluIHRoZSBob3BlIHRoYXQgaXQgd2lsbCBiZSB1c2VmdWwsXG4gKiBidXQgV0lUSE9VVCBBTlkgV0FSUkFOVFk7IHdpdGhvdXQgZXZlbiB0aGUgaW1wbGllZCB3YXJyYW50eSBvZlxuICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiBTZWUgdGhlXG4gKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLlxuICpcbiAqIFlvdSBzaG91bGQgaGF2ZSByZWNlaXZlZCBhIGNvcHkgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlXG4gKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbS4gSWYgbm90LCBzZWUgaHR0cDovL3d3dy5nbnUub3JnL2xpY2Vuc2VzLy5cbiAqXG4gKi9cblxuLyoqIEBqc3gganN4ICovXG5pbXBvcnQge2pzeH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHtDT0xPUl9WMn0gZnJvbSAnLi4vSWRlbnRpdHknO1xuaW1wb3J0IFJlYWN0LCB7RkMsIFJlYWN0Tm9kZX0gZnJvbSAncmVhY3QnO1xuXG5leHBvcnQgaW50ZXJmYWNlIElucHV0TGFiZWxQcm9wcyB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGUgfCBzdHJpbmc7XG4gIGh0bWxGb3I/OiBzdHJpbmc7XG4gIG1hcmtJbnZhbGlkPzogYm9vbGVhbjtcbiAgaXNSZXF1aXJlZD86IGJvb2xlYW47XG59XG5cbmNvbnN0IElucHV0TGFiZWw6IEZDPElucHV0TGFiZWxQcm9wcz4gPSAoe2h0bWxGb3IsIG1hcmtJbnZhbGlkLCBpc1JlcXVpcmVkLCBjaGlsZHJlbiwgLi4ucHJvcHN9KSA9PiAoXG4gIDxsYWJlbFxuICAgIGh0bWxGb3I9e2h0bWxGb3J9XG4gICAgY3NzPXt7XG4gICAgICBmb250U2l6ZTogJzE0cHgnLFxuICAgICAgZm9udFdlaWdodDogNDAwLFxuICAgICAgbGluZUhlaWdodDogJzE2cHgnLFxuICAgICAgY29sb3I6IG1hcmtJbnZhbGlkID8gQ09MT1JfVjIuUkVEX0xJR0hUXzUwMCA6IENPTE9SX1YyLkdSQVlfODAsXG4gICAgfX1cbiAgICB7Li4ucHJvcHN9XG4gID5cbiAgICB7Y2hpbGRyZW59XG5cbiAgICB7aXNSZXF1aXJlZCAmJiA8c3BhbiBjc3M9e3tmb250U2l6ZTogJzE2cHgnLCBtYXJnaW5MZWZ0OiAnNHB4JywgY29sb3I6IENPTE9SX1YyLlJFRF9MSUdIVF81MDB9fT4qPC9zcGFuPn1cbiAgPC9sYWJlbD5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IElucHV0TGFiZWw7XG4iXX0= */")
|
|
42
|
+
}, "*"));
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
var _default = InputLabel;
|
|
46
|
+
exports["default"] = _default;
|
|
47
|
+
//# sourceMappingURL=InputLabel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["InputLabel.tsx"],"names":["InputLabel","htmlFor","markInvalid","isRequired","children","props","fontSize","fontWeight","lineHeight","color","COLOR_V2","RED_LIGHT_500","GRAY_80","marginLeft"],"mappings":";;;;;;;;;;;AAoBA;;;;AACA;;AACA;;;;AASA,IAAMA,UAA+B,GAAG,SAAlCA,UAAkC;AAAA,MAAEC,OAAF,QAAEA,OAAF;AAAA,MAAWC,WAAX,QAAWA,WAAX;AAAA,MAAwBC,UAAxB,QAAwBA,UAAxB;AAAA,MAAoCC,QAApC,QAAoCA,QAApC;AAAA,MAAiDC,KAAjD;AAAA,SACtC;AACE,IAAA,OAAO,EAAEJ,OADX;AAEE,IAAA,GAAG,+BAAE;AACHK,MAAAA,QAAQ,EAAE,MADP;AAEHC,MAAAA,UAAU,EAAE,GAFT;AAGHC,MAAAA,UAAU,EAAE,MAHT;AAIHC,MAAAA,KAAK,EAAEP,WAAW,GAAGQ,mBAASC,aAAZ,GAA4BD,mBAASE;AAJpD,KAAF;AAFL,KAQMP,KARN,GAUGD,QAVH,EAYGD,UAAU,IAAI;AAAM,IAAA,GAAG,+BAAE;AAACG,MAAAA,QAAQ,EAAE,MAAX;AAAmBO,MAAAA,UAAU,EAAE,KAA/B;AAAsCJ,MAAAA,KAAK,EAAEC,mBAASC;AAAtD,KAAF;AAAT,SAZjB,CADsC;AAAA,CAAxC;;eAiBeX,U","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx} from '@emotion/react';\nimport {COLOR_V2} from '../Identity';\nimport React, {FC, ReactNode} from 'react';\n\nexport interface InputLabelProps {\n children: ReactNode | string;\n htmlFor?: string;\n markInvalid?: boolean;\n isRequired?: boolean;\n}\n\nconst InputLabel: FC<InputLabelProps> = ({htmlFor, markInvalid, isRequired, children, ...props}) => (\n <label\n htmlFor={htmlFor}\n css={{\n fontSize: '14px',\n fontWeight: 400,\n lineHeight: '16px',\n color: markInvalid ? COLOR_V2.RED_LIGHT_500 : COLOR_V2.GRAY_80,\n }}\n {...props}\n >\n {children}\n\n {isRequired && <span css={{fontSize: '16px', marginLeft: '4px', color: COLOR_V2.RED_LIGHT_500}}>*</span>}\n </label>\n);\n\nexport default InputLabel;\n"],"file":"InputLabel.js"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
Demo:
|
|
2
|
+
|
|
3
|
+
```js
|
|
4
|
+
import {Fragment} from 'react';
|
|
5
|
+
import {Columns, Column} from '@wireapp/react-ui-kit';
|
|
6
|
+
import InputLabel from './InputLabel';
|
|
7
|
+
|
|
8
|
+
<Fragment>
|
|
9
|
+
<Columns>
|
|
10
|
+
<Column>InputLabel Default</Column>
|
|
11
|
+
|
|
12
|
+
<Column>
|
|
13
|
+
<InputLabel>InputLabel</InputLabel>
|
|
14
|
+
</Column>
|
|
15
|
+
</Columns>
|
|
16
|
+
|
|
17
|
+
<Columns>
|
|
18
|
+
<Column>InputLabel - Mandatory</Column>
|
|
19
|
+
|
|
20
|
+
<Column>
|
|
21
|
+
<InputLabel isRequired>InputLabel</InputLabel>
|
|
22
|
+
</Column>
|
|
23
|
+
</Columns>
|
|
24
|
+
|
|
25
|
+
<Columns>
|
|
26
|
+
<Column>InputLabel - Invalid</Column>
|
|
27
|
+
|
|
28
|
+
<Column>
|
|
29
|
+
<InputLabel markInvalid>InputLabel</InputLabel>
|
|
30
|
+
</Column>
|
|
31
|
+
</Columns>
|
|
32
|
+
</Fragment>;
|
|
33
|
+
```
|
package/src/Form/Select.d.js
CHANGED
package/src/Form/Select.d.ts
CHANGED
|
@@ -1,10 +1,24 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { CSSObject, jsx } from '@emotion/react';
|
|
3
3
|
import type { Theme } from '../Layout';
|
|
4
|
-
import {
|
|
5
|
-
|
|
4
|
+
import { ReactElement } from 'react';
|
|
5
|
+
declare type Option = {
|
|
6
|
+
value: string | number;
|
|
7
|
+
label: string;
|
|
8
|
+
};
|
|
9
|
+
export interface SelectProps {
|
|
10
|
+
id: string;
|
|
11
|
+
onChange: (selectedOption: string | number) => void;
|
|
12
|
+
dataUieName: string;
|
|
13
|
+
options: Option[];
|
|
14
|
+
value?: Option | null;
|
|
15
|
+
helperText?: string;
|
|
16
|
+
label?: string;
|
|
6
17
|
disabled?: boolean;
|
|
18
|
+
required?: boolean;
|
|
7
19
|
markInvalid?: boolean;
|
|
20
|
+
error?: ReactElement;
|
|
8
21
|
}
|
|
9
|
-
export declare const selectStyle: <T>(theme: Theme, props:
|
|
10
|
-
export declare const Select: (props: SelectProps) => jsx.JSX.Element;
|
|
22
|
+
export declare const selectStyle: <T>(theme: Theme, props: any, error?: boolean) => CSSObject;
|
|
23
|
+
export declare const Select: ({ id, label, error, helperText, options, value, onChange, required, markInvalid, dataUieName, ...props }: SelectProps) => jsx.JSX.Element;
|
|
24
|
+
export {};
|
package/src/Form/Select.js
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
5
7
|
Object.defineProperty(exports, "__esModule", {
|
|
6
8
|
value: true
|
|
7
9
|
});
|
|
@@ -9,26 +11,39 @@ exports.Select = exports.selectStyle = void 0;
|
|
|
9
11
|
|
|
10
12
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
13
|
|
|
14
|
+
var _react = require("@emotion/react");
|
|
15
|
+
|
|
16
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
|
+
|
|
12
18
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
19
|
|
|
14
20
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
15
21
|
|
|
16
|
-
var _react = require("@emotion/react");
|
|
17
|
-
|
|
18
22
|
var _Identity = require("../Identity");
|
|
19
23
|
|
|
20
24
|
var _util = require("../util");
|
|
21
25
|
|
|
22
26
|
var _Input = require("./Input");
|
|
23
27
|
|
|
24
|
-
var
|
|
28
|
+
var _react2 = _interopRequireWildcard(require("react"));
|
|
29
|
+
|
|
30
|
+
var _InputLabel = _interopRequireDefault(require("./InputLabel"));
|
|
31
|
+
|
|
32
|
+
var _excluded = ["disabled", "markInvalid"],
|
|
33
|
+
_excluded2 = ["id", "label", "error", "helperText", "options", "value", "onChange", "required", "markInvalid", "dataUieName"];
|
|
34
|
+
|
|
35
|
+
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); }
|
|
36
|
+
|
|
37
|
+
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; }
|
|
38
|
+
|
|
39
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
25
40
|
|
|
26
41
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
27
42
|
|
|
28
43
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
29
44
|
|
|
30
45
|
var ArrowDown = function ArrowDown(theme) {
|
|
31
|
-
return "\n
|
|
46
|
+
return "\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <path fill=\"".concat(theme.general.color, "\" fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.99963 12.5711L15.6565 4.91421L14.2423 3.5L7.99963 9.74264L1.75699 3.5L0.342773 4.91421L7.99963 12.5711Z\"/>\n </svg>\n");
|
|
32
47
|
};
|
|
33
48
|
|
|
34
49
|
var selectStyle = function selectStyle(theme, _ref) {
|
|
@@ -36,36 +51,294 @@ var selectStyle = function selectStyle(theme, _ref) {
|
|
|
36
51
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
37
52
|
markInvalid = _ref.markInvalid,
|
|
38
53
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
54
|
+
var error = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
39
55
|
return _objectSpread(_objectSpread({}, (0, _Input.inputStyle)(theme, props)), {}, {
|
|
40
56
|
'&:-moz-focusring': {
|
|
41
57
|
color: 'transparent',
|
|
42
58
|
textShadow: '0 0 0 #000'
|
|
43
59
|
},
|
|
44
60
|
'&:disabled': {
|
|
45
|
-
color: _Identity.
|
|
61
|
+
color: _Identity.COLOR_V2.GRAY
|
|
46
62
|
},
|
|
47
63
|
appearance: 'none',
|
|
48
|
-
background: disabled ? theme.Input.backgroundColorDisabled : "".concat(theme.Input.backgroundColor, " center right 16px no-repeat url(\"").concat((0, _util.inlineSVG)(ArrowDown(theme)), "\")"),
|
|
49
|
-
boxShadow: markInvalid ? "0 0 0 1px ".concat(_Identity.
|
|
64
|
+
background: disabled ? "".concat(theme.Input.backgroundColorDisabled, " center right 16px no-repeat url(\"").concat((0, _util.inlineSVG)(ArrowDown(theme)), "\")") : "".concat(theme.Input.backgroundColor, " center right 16px no-repeat url(\"").concat((0, _util.inlineSVG)(ArrowDown(theme)), "\")"),
|
|
65
|
+
boxShadow: markInvalid ? "0 0 0 1px ".concat(_Identity.COLOR_V2.RED) : "0 0 0 1px ".concat(_Identity.COLOR_V2.GRAY_40),
|
|
50
66
|
cursor: disabled ? 'normal' : 'pointer',
|
|
51
67
|
fontSize: '16px',
|
|
52
68
|
fontWeight: 300,
|
|
53
|
-
paddingRight: '30px'
|
|
69
|
+
paddingRight: '30px',
|
|
70
|
+
textAlign: 'left',
|
|
71
|
+
marginBottom: error && '8px',
|
|
72
|
+
'&:invalid, option:first-of-type': {
|
|
73
|
+
color: _Identity.COLOR_V2.RED
|
|
74
|
+
}
|
|
75
|
+
}, !disabled && {
|
|
76
|
+
'&:hover': {
|
|
77
|
+
boxShadow: "0 0 0 1px ".concat(_Identity.COLOR_V2.GRAY_60)
|
|
78
|
+
},
|
|
79
|
+
'&:focus, &:active': {
|
|
80
|
+
boxShadow: "0 0 0 1px ".concat(_Identity.COLOR_V2.BLUE)
|
|
81
|
+
}
|
|
54
82
|
});
|
|
55
83
|
};
|
|
56
84
|
|
|
57
85
|
exports.selectStyle = selectStyle;
|
|
58
86
|
|
|
87
|
+
var dropdownStyles = function dropdownStyles(theme, isDropdownOpen) {
|
|
88
|
+
return {
|
|
89
|
+
height: isDropdownOpen ? 'auto' : 0,
|
|
90
|
+
visibility: isDropdownOpen ? 'visible' : 'hidden',
|
|
91
|
+
margin: '3px 0 0',
|
|
92
|
+
padding: 0,
|
|
93
|
+
borderRadius: '10px',
|
|
94
|
+
border: "1px solid ".concat(_Identity.COLOR_V2.BLUE),
|
|
95
|
+
position: 'absolute',
|
|
96
|
+
top: '100%',
|
|
97
|
+
left: 0,
|
|
98
|
+
width: '100%',
|
|
99
|
+
maxHeight: '240px',
|
|
100
|
+
overflowY: 'auto',
|
|
101
|
+
zIndex: 9
|
|
102
|
+
};
|
|
103
|
+
};
|
|
104
|
+
|
|
105
|
+
var dropdownOptionStyles = function dropdownOptionStyles(theme, isSelected) {
|
|
106
|
+
return {
|
|
107
|
+
background: isSelected ? _Identity.COLOR_V2.BLUE : _Identity.COLOR_V2.WHITE,
|
|
108
|
+
listStyle: 'none',
|
|
109
|
+
padding: '10px 20px 14px',
|
|
110
|
+
cursor: 'pointer',
|
|
111
|
+
fontSize: '16px',
|
|
112
|
+
fontWeight: 300,
|
|
113
|
+
lineHeight: '24px',
|
|
114
|
+
letterSpacing: '0.05px',
|
|
115
|
+
color: isSelected ? _Identity.COLOR_V2.WHITE : _Identity.COLOR_V2.BLACK,
|
|
116
|
+
'&:first-of-type': {
|
|
117
|
+
borderRadius: '10px 10px 0 0'
|
|
118
|
+
},
|
|
119
|
+
'&:last-of-type': {
|
|
120
|
+
borderRadius: '0 0 10px 10px'
|
|
121
|
+
},
|
|
122
|
+
'&:not(:last-of-type)': {
|
|
123
|
+
borderBottom: "1px solid ".concat(_Identity.COLOR_V2.GRAY_40)
|
|
124
|
+
},
|
|
125
|
+
'&:hover, &:active, &:focus': {
|
|
126
|
+
background: _Identity.COLOR_V2.BLUE,
|
|
127
|
+
borderColor: _Identity.COLOR_V2.BLUE,
|
|
128
|
+
color: _Identity.COLOR_V2.WHITE
|
|
129
|
+
}
|
|
130
|
+
};
|
|
131
|
+
};
|
|
132
|
+
|
|
59
133
|
var filterSelectProps = function filterSelectProps(props) {
|
|
60
134
|
return (0, _util.filterProps)(props, ['markInvalid']);
|
|
61
135
|
};
|
|
62
136
|
|
|
63
|
-
var
|
|
64
|
-
|
|
137
|
+
var placeholderText = '- Please select -';
|
|
138
|
+
|
|
139
|
+
var _ref3 = process.env.NODE_ENV === "production" ? {
|
|
140
|
+
name: "bjn8wh",
|
|
141
|
+
styles: "position:relative"
|
|
142
|
+
} : {
|
|
143
|
+
name: "tvi1yf-Select",
|
|
144
|
+
styles: "position:relative;label:Select;",
|
|
145
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNlbGVjdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcVFXIiwiZmlsZSI6IlNlbGVjdC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogV2lyZVxuICogQ29weXJpZ2h0IChDKSAyMDE4IFdpcmUgU3dpc3MgR21iSFxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBmcmVlIHNvZnR3YXJlOiB5b3UgY2FuIHJlZGlzdHJpYnV0ZSBpdCBhbmQvb3IgbW9kaWZ5XG4gKiBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGFzIHB1Ymxpc2hlZCBieVxuICogdGhlIEZyZWUgU29mdHdhcmUgRm91bmRhdGlvbiwgZWl0aGVyIHZlcnNpb24gMyBvZiB0aGUgTGljZW5zZSwgb3JcbiAqIChhdCB5b3VyIG9wdGlvbikgYW55IGxhdGVyIHZlcnNpb24uXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGRpc3RyaWJ1dGVkIGluIHRoZSBob3BlIHRoYXQgaXQgd2lsbCBiZSB1c2VmdWwsXG4gKiBidXQgV0lUSE9VVCBBTlkgV0FSUkFOVFk7IHdpdGhvdXQgZXZlbiB0aGUgaW1wbGllZCB3YXJyYW50eSBvZlxuICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiBTZWUgdGhlXG4gKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLlxuICpcbiAqIFlvdSBzaG91bGQgaGF2ZSByZWNlaXZlZCBhIGNvcHkgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlXG4gKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbS4gSWYgbm90LCBzZWUgaHR0cDovL3d3dy5nbnUub3JnL2xpY2Vuc2VzLy5cbiAqXG4gKi9cblxuLyoqIEBqc3gganN4ICovXG5pbXBvcnQge0NTU09iamVjdCwganN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7Q09MT1JfVjJ9IGZyb20gJy4uL0lkZW50aXR5JztcbmltcG9ydCB0eXBlIHtUaGVtZX0gZnJvbSAnLi4vTGF5b3V0JztcbmltcG9ydCB7ZmlsdGVyUHJvcHMsIGlubGluZVNWR30gZnJvbSAnLi4vdXRpbCc7XG5pbXBvcnQge2lucHV0U3R5bGV9IGZyb20gJy4vSW5wdXQnO1xuaW1wb3J0IFJlYWN0LCB7UmVhY3RFbGVtZW50LCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBJbnB1dExhYmVsIGZyb20gJy4vSW5wdXRMYWJlbCc7XG5cbnR5cGUgT3B0aW9uID0ge1xuICB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyO1xuICBsYWJlbDogc3RyaW5nO1xufTtcblxuZXhwb3J0IGludGVyZmFjZSBTZWxlY3RQcm9wcyB7XG4gIGlkOiBzdHJpbmc7XG4gIG9uQ2hhbmdlOiAoc2VsZWN0ZWRPcHRpb246IHN0cmluZyB8IG51bWJlcikgPT4gdm9pZDtcbiAgZGF0YVVpZU5hbWU6IHN0cmluZztcbiAgb3B0aW9uczogT3B0aW9uW107XG4gIHZhbHVlPzogT3B0aW9uIHwgbnVsbDtcbiAgaGVscGVyVGV4dD86IHN0cmluZztcbiAgbGFiZWw/OiBzdHJpbmc7XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICBtYXJrSW52YWxpZD86IGJvb2xlYW47XG4gIGVycm9yPzogUmVhY3RFbGVtZW50O1xufVxuXG5jb25zdCBBcnJvd0Rvd24gPSAodGhlbWU6IFRoZW1lKSA9PiBgXG4gICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiPlxuICAgICAgICA8cGF0aCBmaWxsPVwiJHt0aGVtZS5nZW5lcmFsLmNvbG9yfVwiIGZpbGwtcnVsZT1cImV2ZW5vZGRcIiBjbGlwLXJ1bGU9XCJldmVub2RkXCIgZD1cIk03Ljk5OTYzIDEyLjU3MTFMMTUuNjU2NSA0LjkxNDIxTDE0LjI0MjMgMy41TDcuOTk5NjMgOS43NDI2NEwxLjc1Njk5IDMuNUwwLjM0Mjc3MyA0LjkxNDIxTDcuOTk5NjMgMTIuNTcxMVpcIi8+XG4gICAgPC9zdmc+XG5gO1xuXG5leHBvcnQgY29uc3Qgc2VsZWN0U3R5bGU6IDxUPih0aGVtZTogVGhlbWUsIHByb3BzLCBlcnJvcj86IGJvb2xlYW4pID0+IENTU09iamVjdCA9IChcbiAgdGhlbWUsXG4gIHtkaXNhYmxlZCA9IGZhbHNlLCBtYXJrSW52YWxpZCwgLi4ucHJvcHN9LFxuICBlcnJvciA9IGZhbHNlLFxuKSA9PiAoe1xuICAuLi5pbnB1dFN0eWxlKHRoZW1lLCBwcm9wcyksXG4gICcmOi1tb3otZm9jdXNyaW5nJzoge1xuICAgIGNvbG9yOiAndHJhbnNwYXJlbnQnLFxuICAgIHRleHRTaGFkb3c6ICcwIDAgMCAjMDAwJyxcbiAgfSxcbiAgJyY6ZGlzYWJsZWQnOiB7XG4gICAgY29sb3I6IENPTE9SX1YyLkdSQVksXG4gIH0sXG4gIGFwcGVhcmFuY2U6ICdub25lJyxcbiAgYmFja2dyb3VuZDogZGlzYWJsZWRcbiAgICA/IGAke3RoZW1lLklucHV0LmJhY2tncm91bmRDb2xvckRpc2FibGVkfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYFxuICAgIDogYCR7dGhlbWUuSW5wdXQuYmFja2dyb3VuZENvbG9yfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYCxcbiAgYm94U2hhZG93OiBtYXJrSW52YWxpZCA/IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5SRUR9YCA6IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5HUkFZXzQwfWAsXG4gIGN1cnNvcjogZGlzYWJsZWQgPyAnbm9ybWFsJyA6ICdwb2ludGVyJyxcbiAgZm9udFNpemU6ICcxNnB4JyxcbiAgZm9udFdlaWdodDogMzAwLFxuICBwYWRkaW5nUmlnaHQ6ICczMHB4JyxcbiAgdGV4dEFsaWduOiAnbGVmdCcsXG4gIG1hcmdpbkJvdHRvbTogZXJyb3IgJiYgJzhweCcsXG4gICcmOmludmFsaWQsIG9wdGlvbjpmaXJzdC1vZi10eXBlJzoge1xuICAgIGNvbG9yOiBDT0xPUl9WMi5SRUQsXG4gIH0sXG4gIC4uLighZGlzYWJsZWQgJiYge1xuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuR1JBWV82MH1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMsICY6YWN0aXZlJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuQkxVRX1gLFxuICAgIH0sXG4gIH0pLFxufSk7XG5cbmNvbnN0IGRyb3Bkb3duU3R5bGVzID0gKHRoZW1lOiBUaGVtZSwgaXNEcm9wZG93bk9wZW46IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgaGVpZ2h0OiBpc0Ryb3Bkb3duT3BlbiA/ICdhdXRvJyA6IDAsXG4gIHZpc2liaWxpdHk6IGlzRHJvcGRvd25PcGVuID8gJ3Zpc2libGUnIDogJ2hpZGRlbicsXG4gIG1hcmdpbjogJzNweCAwIDAnLFxuICBwYWRkaW5nOiAwLFxuICBib3JkZXJSYWRpdXM6ICcxMHB4JyxcbiAgYm9yZGVyOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuQkxVRX1gLFxuICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgdG9wOiAnMTAwJScsXG4gIGxlZnQ6IDAsXG4gIHdpZHRoOiAnMTAwJScsXG4gIG1heEhlaWdodDogJzI0MHB4JyxcbiAgb3ZlcmZsb3dZOiAnYXV0bycsXG4gIHpJbmRleDogOSxcbn0pO1xuXG5jb25zdCBkcm9wZG93bk9wdGlvblN0eWxlcyA9ICh0aGVtZTogVGhlbWUsIGlzU2VsZWN0ZWQ6IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgYmFja2dyb3VuZDogaXNTZWxlY3RlZCA/IENPTE9SX1YyLkJMVUUgOiBDT0xPUl9WMi5XSElURSxcbiAgbGlzdFN0eWxlOiAnbm9uZScsXG4gIHBhZGRpbmc6ICcxMHB4IDIwcHggMTRweCcsXG4gIGN1cnNvcjogJ3BvaW50ZXInLFxuICBmb250U2l6ZTogJzE2cHgnLFxuICBmb250V2VpZ2h0OiAzMDAsXG4gIGxpbmVIZWlnaHQ6ICcyNHB4JyxcbiAgbGV0dGVyU3BhY2luZzogJzAuMDVweCcsXG4gIGNvbG9yOiBpc1NlbGVjdGVkID8gQ09MT1JfVjIuV0hJVEUgOiBDT0xPUl9WMi5CTEFDSyxcbiAgJyY6Zmlyc3Qtb2YtdHlwZSc6IHtcbiAgICBib3JkZXJSYWRpdXM6ICcxMHB4IDEwcHggMCAwJyxcbiAgfSxcbiAgJyY6bGFzdC1vZi10eXBlJzoge1xuICAgIGJvcmRlclJhZGl1czogJzAgMCAxMHB4IDEwcHgnLFxuICB9LFxuICAnJjpub3QoOmxhc3Qtb2YtdHlwZSknOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuR1JBWV80MH1gLFxuICB9LFxuICAnJjpob3ZlciwgJjphY3RpdmUsICY6Zm9jdXMnOiB7XG4gICAgYmFja2dyb3VuZDogQ09MT1JfVjIuQkxVRSxcbiAgICBib3JkZXJDb2xvcjogQ09MT1JfVjIuQkxVRSxcbiAgICBjb2xvcjogQ09MT1JfVjIuV0hJVEUsXG4gIH0sXG59KTtcblxuY29uc3QgZmlsdGVyU2VsZWN0UHJvcHMgPSBwcm9wcyA9PiBmaWx0ZXJQcm9wcyhwcm9wcywgWydtYXJrSW52YWxpZCddKTtcblxuY29uc3QgcGxhY2Vob2xkZXJUZXh0ID0gJy0gUGxlYXNlIHNlbGVjdCAtJztcblxuZXhwb3J0IGNvbnN0IFNlbGVjdCA9ICh7XG4gIGlkLFxuICBsYWJlbCxcbiAgZXJyb3IsXG4gIGhlbHBlclRleHQsXG4gIG9wdGlvbnMgPSBbXSxcbiAgdmFsdWUgPSBudWxsLFxuICBvbkNoYW5nZSxcbiAgcmVxdWlyZWQsXG4gIG1hcmtJbnZhbGlkLFxuICBkYXRhVWllTmFtZSxcbiAgLi4ucHJvcHNcbn06IFNlbGVjdFByb3BzKSA9PiB7XG4gIGNvbnN0IHNlbGVjdENvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGxpc3RSZWYgPSB1c2VSZWY8SFRNTFVMaXN0RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IFtpc0Ryb3Bkb3duT3Blbiwgc2V0SXNEcm9wZG93bk9wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBbc2VsZWN0ZWRPcHRpb24sIHNldFNlbGVjdGVkT3B0aW9uXSA9IHVzZVN0YXRlPG51bWJlciB8IG51bGw+KCgpID0+ICh2YWx1ZSA/IG9wdGlvbnMuaW5kZXhPZih2YWx1ZSkgOiBudWxsKSk7XG5cbiAgY29uc3Qgb25Ub2dnbGVEcm9wZG93biA9ICgpID0+IHNldElzRHJvcGRvd25PcGVuKHByZXZTdGF0ZSA9PiAhcHJldlN0YXRlKTtcblxuICBjb25zdCBzY3JvbGxUb0N1cnJlbnRPcHRpb24gPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBpZiAobGlzdFJlZi5jdXJyZW50KSB7XG4gICAgICBjb25zdCBsaXN0U2VsZWN0ZWRPcHRpb24gPSBsaXN0UmVmLmN1cnJlbnQuY2hpbGRyZW5baWR4XSBhcyBIVE1MTElFbGVtZW50O1xuICAgICAgY29uc3QgZ2V0WVBvc2l0aW9uID0gbGlzdFNlbGVjdGVkT3B0aW9uICYmIGxpc3RTZWxlY3RlZE9wdGlvbi5vZmZzZXRUb3A7XG5cbiAgICAgIGxpc3RSZWYuY3VycmVudC5zY3JvbGwoe1xuICAgICAgICB0b3A6IGdldFlQb3NpdGlvbiA/PyAwLFxuICAgICAgICBiZWhhdmlvcjogJ3Ntb290aCcsXG4gICAgICB9KTtcbiAgICB9XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25TZWxlY3QgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBzZXRTZWxlY3RlZE9wdGlvbihpZHgpO1xuICAgIG9uQ2hhbmdlKG9wdGlvbnNbaWR4XS52YWx1ZSk7XG4gICAgc2Nyb2xsVG9DdXJyZW50T3B0aW9uKGlkeCk7XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25DaGFuZ2UgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBvbk9wdGlvblNlbGVjdChpZHgpO1xuICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVMaXN0S2V5RG93biA9IGUgPT4ge1xuICAgIHN3aXRjaCAoZS5rZXkpIHtcbiAgICAgIGNhc2UgJ0VzY2FwZSc6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4oZmFsc2UpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ0Fycm93VXAnOlxuICAgICAgY2FzZSAnQXJyb3dMZWZ0JzpcbiAgICAgICAgaWYgKCFpc0Ryb3Bkb3duT3Blbikge1xuICAgICAgICAgIHNldElzRHJvcGRvd25PcGVuKHRydWUpO1xuICAgICAgICB9XG5cbiAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICBvbk9wdGlvblNlbGVjdChzZWxlY3RlZE9wdGlvbiAtIDEgPj0gMCA/IHNlbGVjdGVkT3B0aW9uIC0gMSA6IG9wdGlvbnMubGVuZ3RoIC0gMSk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnQXJyb3dEb3duJzpcbiAgICAgIGNhc2UgJ0Fycm93UmlnaHQnOlxuICAgICAgICBpZiAoIWlzRHJvcGRvd25PcGVuKSB7XG4gICAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4odHJ1ZSk7XG4gICAgICAgIH1cblxuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGlmIChzZWxlY3RlZE9wdGlvbiA9PT0gbnVsbCkge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KDApO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KHNlbGVjdGVkT3B0aW9uID09PSBvcHRpb25zLmxlbmd0aCAtIDEgPyAwIDogc2VsZWN0ZWRPcHRpb24gKyAxKTtcbiAgICAgICAgfVxuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVLZXlEb3duID0gaW5kZXggPT4gZSA9PiB7XG4gICAgc3dpdGNoIChlLmtleSkge1xuICAgICAgY2FzZSAnICc6XG4gICAgICBjYXNlICdTcGFjZUJhcic6XG4gICAgICBjYXNlICdFbnRlcic6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgb25PcHRpb25DaGFuZ2UoaW5kZXgpO1xuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYXNFcnJvciA9ICEhZXJyb3I7XG5cbiAgY29uc3QgaGFzU2VsZWN0ZWRPcHRpb24gPSBvcHRpb25zICYmICEhb3B0aW9uc1tzZWxlY3RlZE9wdGlvbl07XG5cbiAgY29uc3QgaGFuZGxlT3V0c2lkZUNsaWNrID0gKGV2ZW50OiBNb3VzZUV2ZW50KSA9PiB7XG4gICAgaWYgKHNlbGVjdENvbnRhaW5lclJlZi5jdXJyZW50ICYmICFzZWxlY3RDb250YWluZXJSZWYuY3VycmVudC5jb250YWlucyhldmVudC50YXJnZXQgYXMgTm9kZSkpIHtcbiAgICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgICB9XG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICB3aW5kb3cuYWRkRXZlbnRMaXN0ZW5lcignY2xpY2snLCBoYW5kbGVPdXRzaWRlQ2xpY2spO1xuXG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIHdpbmRvdy5yZW1vdmVFdmVudExpc3RlbmVyKCdjbGljaycsIGhhbmRsZU91dHNpZGVDbGljayk7XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY3NzPXt7XG4gICAgICAgIG1hcmdpbkJvdHRvbTogbWFya0ludmFsaWQgPyAnMnB4JyA6ICcyMHB4JyxcbiAgICAgICAgJyY6Zm9jdXMtd2l0aGluIGxhYmVsJzoge1xuICAgICAgICAgIGNvbG9yOiBDT0xPUl9WMi5CTFVFLFxuICAgICAgICB9LFxuICAgICAgfX1cbiAgICAgIGRhdGEtdWllLW5hbWU9e2RhdGFVaWVOYW1lfVxuICAgICAgcmVmPXtzZWxlY3RDb250YWluZXJSZWZ9XG4gICAgPlxuICAgICAge2xhYmVsICYmIChcbiAgICAgICAgPElucHV0TGFiZWwgaHRtbEZvcj17aWR9IGlzUmVxdWlyZWQ9e3JlcXVpcmVkfSBtYXJrSW52YWxpZD17bWFya0ludmFsaWR9PlxuICAgICAgICAgIHtsYWJlbH1cbiAgICAgICAgPC9JbnB1dExhYmVsPlxuICAgICAgKX1cblxuICAgICAgPGRpdiBjc3M9e3twb3NpdGlvbjogJ3JlbGF0aXZlJ319PlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgYXJpYS1hY3RpdmVkZXNjZW5kYW50PXtoYXNTZWxlY3RlZE9wdGlvbiA/IG9wdGlvbnNbc2VsZWN0ZWRPcHRpb25dLmxhYmVsIDogJyd9XG4gICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNEcm9wZG93bk9wZW59XG4gICAgICAgICAgYXJpYS1oYXNwb3B1cD1cImxpc3Rib3hcIlxuICAgICAgICAgIGFyaWEtbGFiZWxsZWRieT17aWR9XG4gICAgICAgICAgaWQ9e2lkfVxuICAgICAgICAgIG9uQ2xpY2s9e29uVG9nZ2xlRHJvcGRvd259XG4gICAgICAgICAgb25LZXlEb3duPXtoYW5kbGVMaXN0S2V5RG93bn1cbiAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IHNlbGVjdFN0eWxlKHRoZW1lLCBwcm9wcywgaGFzRXJyb3IpfVxuICAgICAgICAgIHsuLi5maWx0ZXJTZWxlY3RQcm9wcyhwcm9wcyl9XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT17ZGF0YVVpZU5hbWV9XG4gICAgICAgID5cbiAgICAgICAgICB7aGFzU2VsZWN0ZWRPcHRpb24gPyBvcHRpb25zW3NlbGVjdGVkT3B0aW9uXS5sYWJlbCA6IHBsYWNlaG9sZGVyVGV4dH1cbiAgICAgICAgPC9idXR0b24+XG5cbiAgICAgICAgPHVsXG4gICAgICAgICAgcmVmPXtsaXN0UmVmfVxuICAgICAgICAgIHJvbGU9XCJsaXN0Ym94XCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9e2lkfVxuICAgICAgICAgIHRhYkluZGV4PXstMX1cbiAgICAgICAgICBvbktleURvd249e2hhbmRsZUxpc3RLZXlEb3dufVxuICAgICAgICAgIGNzcz17KHRoZW1lOiBUaGVtZSkgPT4gZHJvcGRvd25TdHlsZXModGhlbWUsIGlzRHJvcGRvd25PcGVuKX1cbiAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYGRyb3Bkb3duLSR7ZGF0YVVpZU5hbWV9YCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHtvcHRpb25zLm1hcCgob3B0aW9uLCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgY29uc3QgaXNTZWxlY3RlZCA9IHNlbGVjdGVkT3B0aW9uID09IGluZGV4O1xuXG4gICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICA8bGlcbiAgICAgICAgICAgICAgICBrZXk9e29wdGlvbi52YWx1ZX1cbiAgICAgICAgICAgICAgICBpZD17b3B0aW9uLnZhbHVlLnRvU3RyaW5nKCl9XG4gICAgICAgICAgICAgICAgcm9sZT1cIm9wdGlvblwiXG4gICAgICAgICAgICAgICAgYXJpYS1zZWxlY3RlZD17aXNTZWxlY3RlZH1cbiAgICAgICAgICAgICAgICB0YWJJbmRleD17MH1cbiAgICAgICAgICAgICAgICBvbktleURvd249e2hhbmRsZUtleURvd24oaW5kZXgpfVxuICAgICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IG9uT3B0aW9uQ2hhbmdlKGluZGV4KX1cbiAgICAgICAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IGRyb3Bkb3duT3B0aW9uU3R5bGVzKHRoZW1lLCBpc1NlbGVjdGVkKX1cbiAgICAgICAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYG9wdGlvbi0ke2RhdGFVaWVOYW1lfWAsXG4gICAgICAgICAgICAgICAgICAnZGF0YS11aWUtdmFsdWUnOiBvcHRpb24ubGFiZWwsXG4gICAgICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7b3B0aW9uLmxhYmVsfVxuICAgICAgICAgICAgICA8L2xpPlxuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9KX1cbiAgICAgICAgPC91bD5cbiAgICAgIDwvZGl2PlxuXG4gICAgICB7IWhhc0Vycm9yICYmIGhlbHBlclRleHQgJiYgKFxuICAgICAgICA8cCBjc3M9e3tmb250U2l6ZTogJzEycHgnLCBmb250V2VpZ2h0OiA0MDAsIGNvbG9yOiBDT0xPUl9WMi5HUkFZXzgwLCBtYXJnaW5Ub3A6IDh9fT57aGVscGVyVGV4dH08L3A+XG4gICAgICApfVxuXG4gICAgICB7ZXJyb3J9XG4gICAgPC9kaXY+XG4gICk7XG59O1xuIl19 */",
|
|
146
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
var Select = function Select(_ref2) {
|
|
150
|
+
var id = _ref2.id,
|
|
151
|
+
label = _ref2.label,
|
|
152
|
+
error = _ref2.error,
|
|
153
|
+
helperText = _ref2.helperText,
|
|
154
|
+
_ref2$options = _ref2.options,
|
|
155
|
+
options = _ref2$options === void 0 ? [] : _ref2$options,
|
|
156
|
+
_ref2$value = _ref2.value,
|
|
157
|
+
value = _ref2$value === void 0 ? null : _ref2$value,
|
|
158
|
+
onChange = _ref2.onChange,
|
|
159
|
+
required = _ref2.required,
|
|
160
|
+
markInvalid = _ref2.markInvalid,
|
|
161
|
+
dataUieName = _ref2.dataUieName,
|
|
162
|
+
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
|
|
163
|
+
var selectContainerRef = (0, _react2.useRef)(null);
|
|
164
|
+
var listRef = (0, _react2.useRef)(null);
|
|
165
|
+
|
|
166
|
+
var _useState = (0, _react2.useState)(false),
|
|
167
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
168
|
+
isDropdownOpen = _useState2[0],
|
|
169
|
+
setIsDropdownOpen = _useState2[1];
|
|
170
|
+
|
|
171
|
+
var _useState3 = (0, _react2.useState)(function () {
|
|
172
|
+
return value ? options.indexOf(value) : null;
|
|
173
|
+
}),
|
|
174
|
+
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
175
|
+
selectedOption = _useState4[0],
|
|
176
|
+
setSelectedOption = _useState4[1];
|
|
177
|
+
|
|
178
|
+
var onToggleDropdown = function onToggleDropdown() {
|
|
179
|
+
return setIsDropdownOpen(function (prevState) {
|
|
180
|
+
return !prevState;
|
|
181
|
+
});
|
|
182
|
+
};
|
|
183
|
+
|
|
184
|
+
var scrollToCurrentOption = function scrollToCurrentOption(idx) {
|
|
185
|
+
if (listRef.current) {
|
|
186
|
+
var listSelectedOption = listRef.current.children[idx];
|
|
187
|
+
var getYPosition = listSelectedOption && listSelectedOption.offsetTop;
|
|
188
|
+
listRef.current.scroll({
|
|
189
|
+
top: getYPosition !== null && getYPosition !== void 0 ? getYPosition : 0,
|
|
190
|
+
behavior: 'smooth'
|
|
191
|
+
});
|
|
192
|
+
}
|
|
193
|
+
};
|
|
194
|
+
|
|
195
|
+
var onOptionSelect = function onOptionSelect(idx) {
|
|
196
|
+
setSelectedOption(idx);
|
|
197
|
+
onChange(options[idx].value);
|
|
198
|
+
scrollToCurrentOption(idx);
|
|
199
|
+
};
|
|
200
|
+
|
|
201
|
+
var onOptionChange = function onOptionChange(idx) {
|
|
202
|
+
onOptionSelect(idx);
|
|
203
|
+
setIsDropdownOpen(false);
|
|
204
|
+
};
|
|
205
|
+
|
|
206
|
+
var handleListKeyDown = function handleListKeyDown(e) {
|
|
207
|
+
switch (e.key) {
|
|
208
|
+
case 'Escape':
|
|
209
|
+
e.preventDefault();
|
|
210
|
+
setIsDropdownOpen(false);
|
|
211
|
+
break;
|
|
212
|
+
|
|
213
|
+
case 'ArrowUp':
|
|
214
|
+
case 'ArrowLeft':
|
|
215
|
+
if (!isDropdownOpen) {
|
|
216
|
+
setIsDropdownOpen(true);
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
e.preventDefault();
|
|
220
|
+
onOptionSelect(selectedOption - 1 >= 0 ? selectedOption - 1 : options.length - 1);
|
|
221
|
+
break;
|
|
222
|
+
|
|
223
|
+
case 'ArrowDown':
|
|
224
|
+
case 'ArrowRight':
|
|
225
|
+
if (!isDropdownOpen) {
|
|
226
|
+
setIsDropdownOpen(true);
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
e.preventDefault();
|
|
230
|
+
|
|
231
|
+
if (selectedOption === null) {
|
|
232
|
+
onOptionSelect(0);
|
|
233
|
+
} else {
|
|
234
|
+
onOptionSelect(selectedOption === options.length - 1 ? 0 : selectedOption + 1);
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
break;
|
|
238
|
+
|
|
239
|
+
default:
|
|
240
|
+
break;
|
|
241
|
+
}
|
|
242
|
+
};
|
|
243
|
+
|
|
244
|
+
var handleKeyDown = function handleKeyDown(index) {
|
|
245
|
+
return function (e) {
|
|
246
|
+
switch (e.key) {
|
|
247
|
+
case ' ':
|
|
248
|
+
case 'SpaceBar':
|
|
249
|
+
case 'Enter':
|
|
250
|
+
e.preventDefault();
|
|
251
|
+
onOptionChange(index);
|
|
252
|
+
break;
|
|
253
|
+
|
|
254
|
+
default:
|
|
255
|
+
break;
|
|
256
|
+
}
|
|
257
|
+
};
|
|
258
|
+
};
|
|
259
|
+
|
|
260
|
+
var hasError = !!error;
|
|
261
|
+
var hasSelectedOption = options && !!options[selectedOption];
|
|
262
|
+
|
|
263
|
+
var handleOutsideClick = function handleOutsideClick(event) {
|
|
264
|
+
if (selectContainerRef.current && !selectContainerRef.current.contains(event.target)) {
|
|
265
|
+
setIsDropdownOpen(false);
|
|
266
|
+
}
|
|
267
|
+
};
|
|
268
|
+
|
|
269
|
+
(0, _react2.useEffect)(function () {
|
|
270
|
+
window.addEventListener('click', handleOutsideClick);
|
|
271
|
+
return function () {
|
|
272
|
+
window.removeEventListener('click', handleOutsideClick);
|
|
273
|
+
};
|
|
274
|
+
}, []);
|
|
275
|
+
return (0, _react.jsx)("div", {
|
|
276
|
+
css: /*#__PURE__*/(0, _react.css)({
|
|
277
|
+
marginBottom: markInvalid ? '2px' : '20px',
|
|
278
|
+
'&:focus-within label': {
|
|
279
|
+
color: _Identity.COLOR_V2.BLUE
|
|
280
|
+
}
|
|
281
|
+
}, process.env.NODE_ENV === "production" ? "" : ";label:Select;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNlbGVjdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc1BNIiwiZmlsZSI6IlNlbGVjdC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogV2lyZVxuICogQ29weXJpZ2h0IChDKSAyMDE4IFdpcmUgU3dpc3MgR21iSFxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBmcmVlIHNvZnR3YXJlOiB5b3UgY2FuIHJlZGlzdHJpYnV0ZSBpdCBhbmQvb3IgbW9kaWZ5XG4gKiBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGFzIHB1Ymxpc2hlZCBieVxuICogdGhlIEZyZWUgU29mdHdhcmUgRm91bmRhdGlvbiwgZWl0aGVyIHZlcnNpb24gMyBvZiB0aGUgTGljZW5zZSwgb3JcbiAqIChhdCB5b3VyIG9wdGlvbikgYW55IGxhdGVyIHZlcnNpb24uXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGRpc3RyaWJ1dGVkIGluIHRoZSBob3BlIHRoYXQgaXQgd2lsbCBiZSB1c2VmdWwsXG4gKiBidXQgV0lUSE9VVCBBTlkgV0FSUkFOVFk7IHdpdGhvdXQgZXZlbiB0aGUgaW1wbGllZCB3YXJyYW50eSBvZlxuICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiBTZWUgdGhlXG4gKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLlxuICpcbiAqIFlvdSBzaG91bGQgaGF2ZSByZWNlaXZlZCBhIGNvcHkgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlXG4gKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbS4gSWYgbm90LCBzZWUgaHR0cDovL3d3dy5nbnUub3JnL2xpY2Vuc2VzLy5cbiAqXG4gKi9cblxuLyoqIEBqc3gganN4ICovXG5pbXBvcnQge0NTU09iamVjdCwganN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7Q09MT1JfVjJ9IGZyb20gJy4uL0lkZW50aXR5JztcbmltcG9ydCB0eXBlIHtUaGVtZX0gZnJvbSAnLi4vTGF5b3V0JztcbmltcG9ydCB7ZmlsdGVyUHJvcHMsIGlubGluZVNWR30gZnJvbSAnLi4vdXRpbCc7XG5pbXBvcnQge2lucHV0U3R5bGV9IGZyb20gJy4vSW5wdXQnO1xuaW1wb3J0IFJlYWN0LCB7UmVhY3RFbGVtZW50LCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBJbnB1dExhYmVsIGZyb20gJy4vSW5wdXRMYWJlbCc7XG5cbnR5cGUgT3B0aW9uID0ge1xuICB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyO1xuICBsYWJlbDogc3RyaW5nO1xufTtcblxuZXhwb3J0IGludGVyZmFjZSBTZWxlY3RQcm9wcyB7XG4gIGlkOiBzdHJpbmc7XG4gIG9uQ2hhbmdlOiAoc2VsZWN0ZWRPcHRpb246IHN0cmluZyB8IG51bWJlcikgPT4gdm9pZDtcbiAgZGF0YVVpZU5hbWU6IHN0cmluZztcbiAgb3B0aW9uczogT3B0aW9uW107XG4gIHZhbHVlPzogT3B0aW9uIHwgbnVsbDtcbiAgaGVscGVyVGV4dD86IHN0cmluZztcbiAgbGFiZWw/OiBzdHJpbmc7XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICBtYXJrSW52YWxpZD86IGJvb2xlYW47XG4gIGVycm9yPzogUmVhY3RFbGVtZW50O1xufVxuXG5jb25zdCBBcnJvd0Rvd24gPSAodGhlbWU6IFRoZW1lKSA9PiBgXG4gICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiPlxuICAgICAgICA8cGF0aCBmaWxsPVwiJHt0aGVtZS5nZW5lcmFsLmNvbG9yfVwiIGZpbGwtcnVsZT1cImV2ZW5vZGRcIiBjbGlwLXJ1bGU9XCJldmVub2RkXCIgZD1cIk03Ljk5OTYzIDEyLjU3MTFMMTUuNjU2NSA0LjkxNDIxTDE0LjI0MjMgMy41TDcuOTk5NjMgOS43NDI2NEwxLjc1Njk5IDMuNUwwLjM0Mjc3MyA0LjkxNDIxTDcuOTk5NjMgMTIuNTcxMVpcIi8+XG4gICAgPC9zdmc+XG5gO1xuXG5leHBvcnQgY29uc3Qgc2VsZWN0U3R5bGU6IDxUPih0aGVtZTogVGhlbWUsIHByb3BzLCBlcnJvcj86IGJvb2xlYW4pID0+IENTU09iamVjdCA9IChcbiAgdGhlbWUsXG4gIHtkaXNhYmxlZCA9IGZhbHNlLCBtYXJrSW52YWxpZCwgLi4ucHJvcHN9LFxuICBlcnJvciA9IGZhbHNlLFxuKSA9PiAoe1xuICAuLi5pbnB1dFN0eWxlKHRoZW1lLCBwcm9wcyksXG4gICcmOi1tb3otZm9jdXNyaW5nJzoge1xuICAgIGNvbG9yOiAndHJhbnNwYXJlbnQnLFxuICAgIHRleHRTaGFkb3c6ICcwIDAgMCAjMDAwJyxcbiAgfSxcbiAgJyY6ZGlzYWJsZWQnOiB7XG4gICAgY29sb3I6IENPTE9SX1YyLkdSQVksXG4gIH0sXG4gIGFwcGVhcmFuY2U6ICdub25lJyxcbiAgYmFja2dyb3VuZDogZGlzYWJsZWRcbiAgICA/IGAke3RoZW1lLklucHV0LmJhY2tncm91bmRDb2xvckRpc2FibGVkfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYFxuICAgIDogYCR7dGhlbWUuSW5wdXQuYmFja2dyb3VuZENvbG9yfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYCxcbiAgYm94U2hhZG93OiBtYXJrSW52YWxpZCA/IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5SRUR9YCA6IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5HUkFZXzQwfWAsXG4gIGN1cnNvcjogZGlzYWJsZWQgPyAnbm9ybWFsJyA6ICdwb2ludGVyJyxcbiAgZm9udFNpemU6ICcxNnB4JyxcbiAgZm9udFdlaWdodDogMzAwLFxuICBwYWRkaW5nUmlnaHQ6ICczMHB4JyxcbiAgdGV4dEFsaWduOiAnbGVmdCcsXG4gIG1hcmdpbkJvdHRvbTogZXJyb3IgJiYgJzhweCcsXG4gICcmOmludmFsaWQsIG9wdGlvbjpmaXJzdC1vZi10eXBlJzoge1xuICAgIGNvbG9yOiBDT0xPUl9WMi5SRUQsXG4gIH0sXG4gIC4uLighZGlzYWJsZWQgJiYge1xuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuR1JBWV82MH1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMsICY6YWN0aXZlJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuQkxVRX1gLFxuICAgIH0sXG4gIH0pLFxufSk7XG5cbmNvbnN0IGRyb3Bkb3duU3R5bGVzID0gKHRoZW1lOiBUaGVtZSwgaXNEcm9wZG93bk9wZW46IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgaGVpZ2h0OiBpc0Ryb3Bkb3duT3BlbiA/ICdhdXRvJyA6IDAsXG4gIHZpc2liaWxpdHk6IGlzRHJvcGRvd25PcGVuID8gJ3Zpc2libGUnIDogJ2hpZGRlbicsXG4gIG1hcmdpbjogJzNweCAwIDAnLFxuICBwYWRkaW5nOiAwLFxuICBib3JkZXJSYWRpdXM6ICcxMHB4JyxcbiAgYm9yZGVyOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuQkxVRX1gLFxuICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgdG9wOiAnMTAwJScsXG4gIGxlZnQ6IDAsXG4gIHdpZHRoOiAnMTAwJScsXG4gIG1heEhlaWdodDogJzI0MHB4JyxcbiAgb3ZlcmZsb3dZOiAnYXV0bycsXG4gIHpJbmRleDogOSxcbn0pO1xuXG5jb25zdCBkcm9wZG93bk9wdGlvblN0eWxlcyA9ICh0aGVtZTogVGhlbWUsIGlzU2VsZWN0ZWQ6IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgYmFja2dyb3VuZDogaXNTZWxlY3RlZCA/IENPTE9SX1YyLkJMVUUgOiBDT0xPUl9WMi5XSElURSxcbiAgbGlzdFN0eWxlOiAnbm9uZScsXG4gIHBhZGRpbmc6ICcxMHB4IDIwcHggMTRweCcsXG4gIGN1cnNvcjogJ3BvaW50ZXInLFxuICBmb250U2l6ZTogJzE2cHgnLFxuICBmb250V2VpZ2h0OiAzMDAsXG4gIGxpbmVIZWlnaHQ6ICcyNHB4JyxcbiAgbGV0dGVyU3BhY2luZzogJzAuMDVweCcsXG4gIGNvbG9yOiBpc1NlbGVjdGVkID8gQ09MT1JfVjIuV0hJVEUgOiBDT0xPUl9WMi5CTEFDSyxcbiAgJyY6Zmlyc3Qtb2YtdHlwZSc6IHtcbiAgICBib3JkZXJSYWRpdXM6ICcxMHB4IDEwcHggMCAwJyxcbiAgfSxcbiAgJyY6bGFzdC1vZi10eXBlJzoge1xuICAgIGJvcmRlclJhZGl1czogJzAgMCAxMHB4IDEwcHgnLFxuICB9LFxuICAnJjpub3QoOmxhc3Qtb2YtdHlwZSknOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuR1JBWV80MH1gLFxuICB9LFxuICAnJjpob3ZlciwgJjphY3RpdmUsICY6Zm9jdXMnOiB7XG4gICAgYmFja2dyb3VuZDogQ09MT1JfVjIuQkxVRSxcbiAgICBib3JkZXJDb2xvcjogQ09MT1JfVjIuQkxVRSxcbiAgICBjb2xvcjogQ09MT1JfVjIuV0hJVEUsXG4gIH0sXG59KTtcblxuY29uc3QgZmlsdGVyU2VsZWN0UHJvcHMgPSBwcm9wcyA9PiBmaWx0ZXJQcm9wcyhwcm9wcywgWydtYXJrSW52YWxpZCddKTtcblxuY29uc3QgcGxhY2Vob2xkZXJUZXh0ID0gJy0gUGxlYXNlIHNlbGVjdCAtJztcblxuZXhwb3J0IGNvbnN0IFNlbGVjdCA9ICh7XG4gIGlkLFxuICBsYWJlbCxcbiAgZXJyb3IsXG4gIGhlbHBlclRleHQsXG4gIG9wdGlvbnMgPSBbXSxcbiAgdmFsdWUgPSBudWxsLFxuICBvbkNoYW5nZSxcbiAgcmVxdWlyZWQsXG4gIG1hcmtJbnZhbGlkLFxuICBkYXRhVWllTmFtZSxcbiAgLi4ucHJvcHNcbn06IFNlbGVjdFByb3BzKSA9PiB7XG4gIGNvbnN0IHNlbGVjdENvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGxpc3RSZWYgPSB1c2VSZWY8SFRNTFVMaXN0RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IFtpc0Ryb3Bkb3duT3Blbiwgc2V0SXNEcm9wZG93bk9wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBbc2VsZWN0ZWRPcHRpb24sIHNldFNlbGVjdGVkT3B0aW9uXSA9IHVzZVN0YXRlPG51bWJlciB8IG51bGw+KCgpID0+ICh2YWx1ZSA/IG9wdGlvbnMuaW5kZXhPZih2YWx1ZSkgOiBudWxsKSk7XG5cbiAgY29uc3Qgb25Ub2dnbGVEcm9wZG93biA9ICgpID0+IHNldElzRHJvcGRvd25PcGVuKHByZXZTdGF0ZSA9PiAhcHJldlN0YXRlKTtcblxuICBjb25zdCBzY3JvbGxUb0N1cnJlbnRPcHRpb24gPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBpZiAobGlzdFJlZi5jdXJyZW50KSB7XG4gICAgICBjb25zdCBsaXN0U2VsZWN0ZWRPcHRpb24gPSBsaXN0UmVmLmN1cnJlbnQuY2hpbGRyZW5baWR4XSBhcyBIVE1MTElFbGVtZW50O1xuICAgICAgY29uc3QgZ2V0WVBvc2l0aW9uID0gbGlzdFNlbGVjdGVkT3B0aW9uICYmIGxpc3RTZWxlY3RlZE9wdGlvbi5vZmZzZXRUb3A7XG5cbiAgICAgIGxpc3RSZWYuY3VycmVudC5zY3JvbGwoe1xuICAgICAgICB0b3A6IGdldFlQb3NpdGlvbiA/PyAwLFxuICAgICAgICBiZWhhdmlvcjogJ3Ntb290aCcsXG4gICAgICB9KTtcbiAgICB9XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25TZWxlY3QgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBzZXRTZWxlY3RlZE9wdGlvbihpZHgpO1xuICAgIG9uQ2hhbmdlKG9wdGlvbnNbaWR4XS52YWx1ZSk7XG4gICAgc2Nyb2xsVG9DdXJyZW50T3B0aW9uKGlkeCk7XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25DaGFuZ2UgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBvbk9wdGlvblNlbGVjdChpZHgpO1xuICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVMaXN0S2V5RG93biA9IGUgPT4ge1xuICAgIHN3aXRjaCAoZS5rZXkpIHtcbiAgICAgIGNhc2UgJ0VzY2FwZSc6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4oZmFsc2UpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ0Fycm93VXAnOlxuICAgICAgY2FzZSAnQXJyb3dMZWZ0JzpcbiAgICAgICAgaWYgKCFpc0Ryb3Bkb3duT3Blbikge1xuICAgICAgICAgIHNldElzRHJvcGRvd25PcGVuKHRydWUpO1xuICAgICAgICB9XG5cbiAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICBvbk9wdGlvblNlbGVjdChzZWxlY3RlZE9wdGlvbiAtIDEgPj0gMCA/IHNlbGVjdGVkT3B0aW9uIC0gMSA6IG9wdGlvbnMubGVuZ3RoIC0gMSk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnQXJyb3dEb3duJzpcbiAgICAgIGNhc2UgJ0Fycm93UmlnaHQnOlxuICAgICAgICBpZiAoIWlzRHJvcGRvd25PcGVuKSB7XG4gICAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4odHJ1ZSk7XG4gICAgICAgIH1cblxuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGlmIChzZWxlY3RlZE9wdGlvbiA9PT0gbnVsbCkge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KDApO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KHNlbGVjdGVkT3B0aW9uID09PSBvcHRpb25zLmxlbmd0aCAtIDEgPyAwIDogc2VsZWN0ZWRPcHRpb24gKyAxKTtcbiAgICAgICAgfVxuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVLZXlEb3duID0gaW5kZXggPT4gZSA9PiB7XG4gICAgc3dpdGNoIChlLmtleSkge1xuICAgICAgY2FzZSAnICc6XG4gICAgICBjYXNlICdTcGFjZUJhcic6XG4gICAgICBjYXNlICdFbnRlcic6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgb25PcHRpb25DaGFuZ2UoaW5kZXgpO1xuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYXNFcnJvciA9ICEhZXJyb3I7XG5cbiAgY29uc3QgaGFzU2VsZWN0ZWRPcHRpb24gPSBvcHRpb25zICYmICEhb3B0aW9uc1tzZWxlY3RlZE9wdGlvbl07XG5cbiAgY29uc3QgaGFuZGxlT3V0c2lkZUNsaWNrID0gKGV2ZW50OiBNb3VzZUV2ZW50KSA9PiB7XG4gICAgaWYgKHNlbGVjdENvbnRhaW5lclJlZi5jdXJyZW50ICYmICFzZWxlY3RDb250YWluZXJSZWYuY3VycmVudC5jb250YWlucyhldmVudC50YXJnZXQgYXMgTm9kZSkpIHtcbiAgICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgICB9XG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICB3aW5kb3cuYWRkRXZlbnRMaXN0ZW5lcignY2xpY2snLCBoYW5kbGVPdXRzaWRlQ2xpY2spO1xuXG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIHdpbmRvdy5yZW1vdmVFdmVudExpc3RlbmVyKCdjbGljaycsIGhhbmRsZU91dHNpZGVDbGljayk7XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY3NzPXt7XG4gICAgICAgIG1hcmdpbkJvdHRvbTogbWFya0ludmFsaWQgPyAnMnB4JyA6ICcyMHB4JyxcbiAgICAgICAgJyY6Zm9jdXMtd2l0aGluIGxhYmVsJzoge1xuICAgICAgICAgIGNvbG9yOiBDT0xPUl9WMi5CTFVFLFxuICAgICAgICB9LFxuICAgICAgfX1cbiAgICAgIGRhdGEtdWllLW5hbWU9e2RhdGFVaWVOYW1lfVxuICAgICAgcmVmPXtzZWxlY3RDb250YWluZXJSZWZ9XG4gICAgPlxuICAgICAge2xhYmVsICYmIChcbiAgICAgICAgPElucHV0TGFiZWwgaHRtbEZvcj17aWR9IGlzUmVxdWlyZWQ9e3JlcXVpcmVkfSBtYXJrSW52YWxpZD17bWFya0ludmFsaWR9PlxuICAgICAgICAgIHtsYWJlbH1cbiAgICAgICAgPC9JbnB1dExhYmVsPlxuICAgICAgKX1cblxuICAgICAgPGRpdiBjc3M9e3twb3NpdGlvbjogJ3JlbGF0aXZlJ319PlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgYXJpYS1hY3RpdmVkZXNjZW5kYW50PXtoYXNTZWxlY3RlZE9wdGlvbiA/IG9wdGlvbnNbc2VsZWN0ZWRPcHRpb25dLmxhYmVsIDogJyd9XG4gICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNEcm9wZG93bk9wZW59XG4gICAgICAgICAgYXJpYS1oYXNwb3B1cD1cImxpc3Rib3hcIlxuICAgICAgICAgIGFyaWEtbGFiZWxsZWRieT17aWR9XG4gICAgICAgICAgaWQ9e2lkfVxuICAgICAgICAgIG9uQ2xpY2s9e29uVG9nZ2xlRHJvcGRvd259XG4gICAgICAgICAgb25LZXlEb3duPXtoYW5kbGVMaXN0S2V5RG93bn1cbiAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IHNlbGVjdFN0eWxlKHRoZW1lLCBwcm9wcywgaGFzRXJyb3IpfVxuICAgICAgICAgIHsuLi5maWx0ZXJTZWxlY3RQcm9wcyhwcm9wcyl9XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT17ZGF0YVVpZU5hbWV9XG4gICAgICAgID5cbiAgICAgICAgICB7aGFzU2VsZWN0ZWRPcHRpb24gPyBvcHRpb25zW3NlbGVjdGVkT3B0aW9uXS5sYWJlbCA6IHBsYWNlaG9sZGVyVGV4dH1cbiAgICAgICAgPC9idXR0b24+XG5cbiAgICAgICAgPHVsXG4gICAgICAgICAgcmVmPXtsaXN0UmVmfVxuICAgICAgICAgIHJvbGU9XCJsaXN0Ym94XCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9e2lkfVxuICAgICAgICAgIHRhYkluZGV4PXstMX1cbiAgICAgICAgICBvbktleURvd249e2hhbmRsZUxpc3RLZXlEb3dufVxuICAgICAgICAgIGNzcz17KHRoZW1lOiBUaGVtZSkgPT4gZHJvcGRvd25TdHlsZXModGhlbWUsIGlzRHJvcGRvd25PcGVuKX1cbiAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYGRyb3Bkb3duLSR7ZGF0YVVpZU5hbWV9YCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHtvcHRpb25zLm1hcCgob3B0aW9uLCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgY29uc3QgaXNTZWxlY3RlZCA9IHNlbGVjdGVkT3B0aW9uID09IGluZGV4O1xuXG4gICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICA8bGlcbiAgICAgICAgICAgICAgICBrZXk9e29wdGlvbi52YWx1ZX1cbiAgICAgICAgICAgICAgICBpZD17b3B0aW9uLnZhbHVlLnRvU3RyaW5nKCl9XG4gICAgICAgICAgICAgICAgcm9sZT1cIm9wdGlvblwiXG4gICAgICAgICAgICAgICAgYXJpYS1zZWxlY3RlZD17aXNTZWxlY3RlZH1cbiAgICAgICAgICAgICAgICB0YWJJbmRleD17MH1cbiAgICAgICAgICAgICAgICBvbktleURvd249e2hhbmRsZUtleURvd24oaW5kZXgpfVxuICAgICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IG9uT3B0aW9uQ2hhbmdlKGluZGV4KX1cbiAgICAgICAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IGRyb3Bkb3duT3B0aW9uU3R5bGVzKHRoZW1lLCBpc1NlbGVjdGVkKX1cbiAgICAgICAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYG9wdGlvbi0ke2RhdGFVaWVOYW1lfWAsXG4gICAgICAgICAgICAgICAgICAnZGF0YS11aWUtdmFsdWUnOiBvcHRpb24ubGFiZWwsXG4gICAgICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7b3B0aW9uLmxhYmVsfVxuICAgICAgICAgICAgICA8L2xpPlxuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9KX1cbiAgICAgICAgPC91bD5cbiAgICAgIDwvZGl2PlxuXG4gICAgICB7IWhhc0Vycm9yICYmIGhlbHBlclRleHQgJiYgKFxuICAgICAgICA8cCBjc3M9e3tmb250U2l6ZTogJzEycHgnLCBmb250V2VpZ2h0OiA0MDAsIGNvbG9yOiBDT0xPUl9WMi5HUkFZXzgwLCBtYXJnaW5Ub3A6IDh9fT57aGVscGVyVGV4dH08L3A+XG4gICAgICApfVxuXG4gICAgICB7ZXJyb3J9XG4gICAgPC9kaXY+XG4gICk7XG59O1xuIl19 */"),
|
|
282
|
+
"data-uie-name": dataUieName,
|
|
283
|
+
ref: selectContainerRef
|
|
284
|
+
}, label && (0, _react.jsx)(_InputLabel["default"], {
|
|
285
|
+
htmlFor: id,
|
|
286
|
+
isRequired: required,
|
|
287
|
+
markInvalid: markInvalid
|
|
288
|
+
}, label), (0, _react.jsx)("div", {
|
|
289
|
+
css: _ref3
|
|
290
|
+
}, (0, _react.jsx)("button", (0, _extends2["default"])({
|
|
291
|
+
type: "button",
|
|
292
|
+
"aria-activedescendant": hasSelectedOption ? options[selectedOption].label : '',
|
|
293
|
+
"aria-expanded": isDropdownOpen,
|
|
294
|
+
"aria-haspopup": "listbox",
|
|
295
|
+
"aria-labelledby": id,
|
|
296
|
+
id: id,
|
|
297
|
+
onClick: onToggleDropdown,
|
|
298
|
+
onKeyDown: handleListKeyDown,
|
|
299
|
+
css: function css(theme) {
|
|
300
|
+
return selectStyle(theme, props, hasError);
|
|
301
|
+
}
|
|
302
|
+
}, filterSelectProps(props), {
|
|
303
|
+
"data-uie-name": dataUieName
|
|
304
|
+
}), hasSelectedOption ? options[selectedOption].label : placeholderText), (0, _react.jsx)("ul", (0, _extends2["default"])({
|
|
305
|
+
ref: listRef,
|
|
306
|
+
role: "listbox",
|
|
307
|
+
"aria-labelledby": id,
|
|
308
|
+
tabIndex: -1,
|
|
309
|
+
onKeyDown: handleListKeyDown,
|
|
65
310
|
css: function css(theme) {
|
|
66
|
-
return
|
|
311
|
+
return dropdownStyles(theme, isDropdownOpen);
|
|
67
312
|
}
|
|
68
|
-
},
|
|
313
|
+
}, dataUieName && {
|
|
314
|
+
'data-uie-name': "dropdown-".concat(dataUieName)
|
|
315
|
+
}), options.map(function (option, index) {
|
|
316
|
+
var isSelected = selectedOption == index;
|
|
317
|
+
return (0, _react.jsx)("li", (0, _extends2["default"])({
|
|
318
|
+
key: option.value,
|
|
319
|
+
id: option.value.toString(),
|
|
320
|
+
role: "option",
|
|
321
|
+
"aria-selected": isSelected,
|
|
322
|
+
tabIndex: 0,
|
|
323
|
+
onKeyDown: handleKeyDown(index),
|
|
324
|
+
onClick: function onClick() {
|
|
325
|
+
return onOptionChange(index);
|
|
326
|
+
},
|
|
327
|
+
css: function css(theme) {
|
|
328
|
+
return dropdownOptionStyles(theme, isSelected);
|
|
329
|
+
}
|
|
330
|
+
}, dataUieName && {
|
|
331
|
+
'data-uie-name': "option-".concat(dataUieName),
|
|
332
|
+
'data-uie-value': option.label
|
|
333
|
+
}), option.label);
|
|
334
|
+
}))), !hasError && helperText && (0, _react.jsx)("p", {
|
|
335
|
+
css: /*#__PURE__*/(0, _react.css)({
|
|
336
|
+
fontSize: '12px',
|
|
337
|
+
fontWeight: 400,
|
|
338
|
+
color: _Identity.COLOR_V2.GRAY_80,
|
|
339
|
+
marginTop: 8
|
|
340
|
+
}, process.env.NODE_ENV === "production" ? "" : ";label:Select;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNlbGVjdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMlRXIiwiZmlsZSI6IlNlbGVjdC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogV2lyZVxuICogQ29weXJpZ2h0IChDKSAyMDE4IFdpcmUgU3dpc3MgR21iSFxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBmcmVlIHNvZnR3YXJlOiB5b3UgY2FuIHJlZGlzdHJpYnV0ZSBpdCBhbmQvb3IgbW9kaWZ5XG4gKiBpdCB1bmRlciB0aGUgdGVybXMgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGFzIHB1Ymxpc2hlZCBieVxuICogdGhlIEZyZWUgU29mdHdhcmUgRm91bmRhdGlvbiwgZWl0aGVyIHZlcnNpb24gMyBvZiB0aGUgTGljZW5zZSwgb3JcbiAqIChhdCB5b3VyIG9wdGlvbikgYW55IGxhdGVyIHZlcnNpb24uXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGRpc3RyaWJ1dGVkIGluIHRoZSBob3BlIHRoYXQgaXQgd2lsbCBiZSB1c2VmdWwsXG4gKiBidXQgV0lUSE9VVCBBTlkgV0FSUkFOVFk7IHdpdGhvdXQgZXZlbiB0aGUgaW1wbGllZCB3YXJyYW50eSBvZlxuICogTUVSQ0hBTlRBQklMSVRZIG9yIEZJVE5FU1MgRk9SIEEgUEFSVElDVUxBUiBQVVJQT1NFLiBTZWUgdGhlXG4gKiBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBmb3IgbW9yZSBkZXRhaWxzLlxuICpcbiAqIFlvdSBzaG91bGQgaGF2ZSByZWNlaXZlZCBhIGNvcHkgb2YgdGhlIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlXG4gKiBhbG9uZyB3aXRoIHRoaXMgcHJvZ3JhbS4gSWYgbm90LCBzZWUgaHR0cDovL3d3dy5nbnUub3JnL2xpY2Vuc2VzLy5cbiAqXG4gKi9cblxuLyoqIEBqc3gganN4ICovXG5pbXBvcnQge0NTU09iamVjdCwganN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7Q09MT1JfVjJ9IGZyb20gJy4uL0lkZW50aXR5JztcbmltcG9ydCB0eXBlIHtUaGVtZX0gZnJvbSAnLi4vTGF5b3V0JztcbmltcG9ydCB7ZmlsdGVyUHJvcHMsIGlubGluZVNWR30gZnJvbSAnLi4vdXRpbCc7XG5pbXBvcnQge2lucHV0U3R5bGV9IGZyb20gJy4vSW5wdXQnO1xuaW1wb3J0IFJlYWN0LCB7UmVhY3RFbGVtZW50LCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGV9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBJbnB1dExhYmVsIGZyb20gJy4vSW5wdXRMYWJlbCc7XG5cbnR5cGUgT3B0aW9uID0ge1xuICB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyO1xuICBsYWJlbDogc3RyaW5nO1xufTtcblxuZXhwb3J0IGludGVyZmFjZSBTZWxlY3RQcm9wcyB7XG4gIGlkOiBzdHJpbmc7XG4gIG9uQ2hhbmdlOiAoc2VsZWN0ZWRPcHRpb246IHN0cmluZyB8IG51bWJlcikgPT4gdm9pZDtcbiAgZGF0YVVpZU5hbWU6IHN0cmluZztcbiAgb3B0aW9uczogT3B0aW9uW107XG4gIHZhbHVlPzogT3B0aW9uIHwgbnVsbDtcbiAgaGVscGVyVGV4dD86IHN0cmluZztcbiAgbGFiZWw/OiBzdHJpbmc7XG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgcmVxdWlyZWQ/OiBib29sZWFuO1xuICBtYXJrSW52YWxpZD86IGJvb2xlYW47XG4gIGVycm9yPzogUmVhY3RFbGVtZW50O1xufVxuXG5jb25zdCBBcnJvd0Rvd24gPSAodGhlbWU6IFRoZW1lKSA9PiBgXG4gICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgd2lkdGg9XCIxNlwiIGhlaWdodD1cIjE2XCIgdmlld0JveD1cIjAgMCAxNiAxNlwiPlxuICAgICAgICA8cGF0aCBmaWxsPVwiJHt0aGVtZS5nZW5lcmFsLmNvbG9yfVwiIGZpbGwtcnVsZT1cImV2ZW5vZGRcIiBjbGlwLXJ1bGU9XCJldmVub2RkXCIgZD1cIk03Ljk5OTYzIDEyLjU3MTFMMTUuNjU2NSA0LjkxNDIxTDE0LjI0MjMgMy41TDcuOTk5NjMgOS43NDI2NEwxLjc1Njk5IDMuNUwwLjM0Mjc3MyA0LjkxNDIxTDcuOTk5NjMgMTIuNTcxMVpcIi8+XG4gICAgPC9zdmc+XG5gO1xuXG5leHBvcnQgY29uc3Qgc2VsZWN0U3R5bGU6IDxUPih0aGVtZTogVGhlbWUsIHByb3BzLCBlcnJvcj86IGJvb2xlYW4pID0+IENTU09iamVjdCA9IChcbiAgdGhlbWUsXG4gIHtkaXNhYmxlZCA9IGZhbHNlLCBtYXJrSW52YWxpZCwgLi4ucHJvcHN9LFxuICBlcnJvciA9IGZhbHNlLFxuKSA9PiAoe1xuICAuLi5pbnB1dFN0eWxlKHRoZW1lLCBwcm9wcyksXG4gICcmOi1tb3otZm9jdXNyaW5nJzoge1xuICAgIGNvbG9yOiAndHJhbnNwYXJlbnQnLFxuICAgIHRleHRTaGFkb3c6ICcwIDAgMCAjMDAwJyxcbiAgfSxcbiAgJyY6ZGlzYWJsZWQnOiB7XG4gICAgY29sb3I6IENPTE9SX1YyLkdSQVksXG4gIH0sXG4gIGFwcGVhcmFuY2U6ICdub25lJyxcbiAgYmFja2dyb3VuZDogZGlzYWJsZWRcbiAgICA/IGAke3RoZW1lLklucHV0LmJhY2tncm91bmRDb2xvckRpc2FibGVkfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYFxuICAgIDogYCR7dGhlbWUuSW5wdXQuYmFja2dyb3VuZENvbG9yfSBjZW50ZXIgcmlnaHQgMTZweCBuby1yZXBlYXQgdXJsKFwiJHtpbmxpbmVTVkcoQXJyb3dEb3duKHRoZW1lKSl9XCIpYCxcbiAgYm94U2hhZG93OiBtYXJrSW52YWxpZCA/IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5SRUR9YCA6IGAwIDAgMCAxcHggJHtDT0xPUl9WMi5HUkFZXzQwfWAsXG4gIGN1cnNvcjogZGlzYWJsZWQgPyAnbm9ybWFsJyA6ICdwb2ludGVyJyxcbiAgZm9udFNpemU6ICcxNnB4JyxcbiAgZm9udFdlaWdodDogMzAwLFxuICBwYWRkaW5nUmlnaHQ6ICczMHB4JyxcbiAgdGV4dEFsaWduOiAnbGVmdCcsXG4gIG1hcmdpbkJvdHRvbTogZXJyb3IgJiYgJzhweCcsXG4gICcmOmludmFsaWQsIG9wdGlvbjpmaXJzdC1vZi10eXBlJzoge1xuICAgIGNvbG9yOiBDT0xPUl9WMi5SRUQsXG4gIH0sXG4gIC4uLighZGlzYWJsZWQgJiYge1xuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuR1JBWV82MH1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMsICY6YWN0aXZlJzoge1xuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMXB4ICR7Q09MT1JfVjIuQkxVRX1gLFxuICAgIH0sXG4gIH0pLFxufSk7XG5cbmNvbnN0IGRyb3Bkb3duU3R5bGVzID0gKHRoZW1lOiBUaGVtZSwgaXNEcm9wZG93bk9wZW46IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgaGVpZ2h0OiBpc0Ryb3Bkb3duT3BlbiA/ICdhdXRvJyA6IDAsXG4gIHZpc2liaWxpdHk6IGlzRHJvcGRvd25PcGVuID8gJ3Zpc2libGUnIDogJ2hpZGRlbicsXG4gIG1hcmdpbjogJzNweCAwIDAnLFxuICBwYWRkaW5nOiAwLFxuICBib3JkZXJSYWRpdXM6ICcxMHB4JyxcbiAgYm9yZGVyOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuQkxVRX1gLFxuICBwb3NpdGlvbjogJ2Fic29sdXRlJyxcbiAgdG9wOiAnMTAwJScsXG4gIGxlZnQ6IDAsXG4gIHdpZHRoOiAnMTAwJScsXG4gIG1heEhlaWdodDogJzI0MHB4JyxcbiAgb3ZlcmZsb3dZOiAnYXV0bycsXG4gIHpJbmRleDogOSxcbn0pO1xuXG5jb25zdCBkcm9wZG93bk9wdGlvblN0eWxlcyA9ICh0aGVtZTogVGhlbWUsIGlzU2VsZWN0ZWQ6IGJvb2xlYW4pOiBDU1NPYmplY3QgPT4gKHtcbiAgYmFja2dyb3VuZDogaXNTZWxlY3RlZCA/IENPTE9SX1YyLkJMVUUgOiBDT0xPUl9WMi5XSElURSxcbiAgbGlzdFN0eWxlOiAnbm9uZScsXG4gIHBhZGRpbmc6ICcxMHB4IDIwcHggMTRweCcsXG4gIGN1cnNvcjogJ3BvaW50ZXInLFxuICBmb250U2l6ZTogJzE2cHgnLFxuICBmb250V2VpZ2h0OiAzMDAsXG4gIGxpbmVIZWlnaHQ6ICcyNHB4JyxcbiAgbGV0dGVyU3BhY2luZzogJzAuMDVweCcsXG4gIGNvbG9yOiBpc1NlbGVjdGVkID8gQ09MT1JfVjIuV0hJVEUgOiBDT0xPUl9WMi5CTEFDSyxcbiAgJyY6Zmlyc3Qtb2YtdHlwZSc6IHtcbiAgICBib3JkZXJSYWRpdXM6ICcxMHB4IDEwcHggMCAwJyxcbiAgfSxcbiAgJyY6bGFzdC1vZi10eXBlJzoge1xuICAgIGJvcmRlclJhZGl1czogJzAgMCAxMHB4IDEwcHgnLFxuICB9LFxuICAnJjpub3QoOmxhc3Qtb2YtdHlwZSknOiB7XG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuR1JBWV80MH1gLFxuICB9LFxuICAnJjpob3ZlciwgJjphY3RpdmUsICY6Zm9jdXMnOiB7XG4gICAgYmFja2dyb3VuZDogQ09MT1JfVjIuQkxVRSxcbiAgICBib3JkZXJDb2xvcjogQ09MT1JfVjIuQkxVRSxcbiAgICBjb2xvcjogQ09MT1JfVjIuV0hJVEUsXG4gIH0sXG59KTtcblxuY29uc3QgZmlsdGVyU2VsZWN0UHJvcHMgPSBwcm9wcyA9PiBmaWx0ZXJQcm9wcyhwcm9wcywgWydtYXJrSW52YWxpZCddKTtcblxuY29uc3QgcGxhY2Vob2xkZXJUZXh0ID0gJy0gUGxlYXNlIHNlbGVjdCAtJztcblxuZXhwb3J0IGNvbnN0IFNlbGVjdCA9ICh7XG4gIGlkLFxuICBsYWJlbCxcbiAgZXJyb3IsXG4gIGhlbHBlclRleHQsXG4gIG9wdGlvbnMgPSBbXSxcbiAgdmFsdWUgPSBudWxsLFxuICBvbkNoYW5nZSxcbiAgcmVxdWlyZWQsXG4gIG1hcmtJbnZhbGlkLFxuICBkYXRhVWllTmFtZSxcbiAgLi4ucHJvcHNcbn06IFNlbGVjdFByb3BzKSA9PiB7XG4gIGNvbnN0IHNlbGVjdENvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGxpc3RSZWYgPSB1c2VSZWY8SFRNTFVMaXN0RWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IFtpc0Ryb3Bkb3duT3Blbiwgc2V0SXNEcm9wZG93bk9wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBbc2VsZWN0ZWRPcHRpb24sIHNldFNlbGVjdGVkT3B0aW9uXSA9IHVzZVN0YXRlPG51bWJlciB8IG51bGw+KCgpID0+ICh2YWx1ZSA/IG9wdGlvbnMuaW5kZXhPZih2YWx1ZSkgOiBudWxsKSk7XG5cbiAgY29uc3Qgb25Ub2dnbGVEcm9wZG93biA9ICgpID0+IHNldElzRHJvcGRvd25PcGVuKHByZXZTdGF0ZSA9PiAhcHJldlN0YXRlKTtcblxuICBjb25zdCBzY3JvbGxUb0N1cnJlbnRPcHRpb24gPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBpZiAobGlzdFJlZi5jdXJyZW50KSB7XG4gICAgICBjb25zdCBsaXN0U2VsZWN0ZWRPcHRpb24gPSBsaXN0UmVmLmN1cnJlbnQuY2hpbGRyZW5baWR4XSBhcyBIVE1MTElFbGVtZW50O1xuICAgICAgY29uc3QgZ2V0WVBvc2l0aW9uID0gbGlzdFNlbGVjdGVkT3B0aW9uICYmIGxpc3RTZWxlY3RlZE9wdGlvbi5vZmZzZXRUb3A7XG5cbiAgICAgIGxpc3RSZWYuY3VycmVudC5zY3JvbGwoe1xuICAgICAgICB0b3A6IGdldFlQb3NpdGlvbiA/PyAwLFxuICAgICAgICBiZWhhdmlvcjogJ3Ntb290aCcsXG4gICAgICB9KTtcbiAgICB9XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25TZWxlY3QgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBzZXRTZWxlY3RlZE9wdGlvbihpZHgpO1xuICAgIG9uQ2hhbmdlKG9wdGlvbnNbaWR4XS52YWx1ZSk7XG4gICAgc2Nyb2xsVG9DdXJyZW50T3B0aW9uKGlkeCk7XG4gIH07XG5cbiAgY29uc3Qgb25PcHRpb25DaGFuZ2UgPSAoaWR4OiBudW1iZXIpID0+IHtcbiAgICBvbk9wdGlvblNlbGVjdChpZHgpO1xuICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVMaXN0S2V5RG93biA9IGUgPT4ge1xuICAgIHN3aXRjaCAoZS5rZXkpIHtcbiAgICAgIGNhc2UgJ0VzY2FwZSc6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4oZmFsc2UpO1xuICAgICAgICBicmVhaztcbiAgICAgIGNhc2UgJ0Fycm93VXAnOlxuICAgICAgY2FzZSAnQXJyb3dMZWZ0JzpcbiAgICAgICAgaWYgKCFpc0Ryb3Bkb3duT3Blbikge1xuICAgICAgICAgIHNldElzRHJvcGRvd25PcGVuKHRydWUpO1xuICAgICAgICB9XG5cbiAgICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICBvbk9wdGlvblNlbGVjdChzZWxlY3RlZE9wdGlvbiAtIDEgPj0gMCA/IHNlbGVjdGVkT3B0aW9uIC0gMSA6IG9wdGlvbnMubGVuZ3RoIC0gMSk7XG4gICAgICAgIGJyZWFrO1xuICAgICAgY2FzZSAnQXJyb3dEb3duJzpcbiAgICAgIGNhc2UgJ0Fycm93UmlnaHQnOlxuICAgICAgICBpZiAoIWlzRHJvcGRvd25PcGVuKSB7XG4gICAgICAgICAgc2V0SXNEcm9wZG93bk9wZW4odHJ1ZSk7XG4gICAgICAgIH1cblxuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGlmIChzZWxlY3RlZE9wdGlvbiA9PT0gbnVsbCkge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KDApO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgIG9uT3B0aW9uU2VsZWN0KHNlbGVjdGVkT3B0aW9uID09PSBvcHRpb25zLmxlbmd0aCAtIDEgPyAwIDogc2VsZWN0ZWRPcHRpb24gKyAxKTtcbiAgICAgICAgfVxuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVLZXlEb3duID0gaW5kZXggPT4gZSA9PiB7XG4gICAgc3dpdGNoIChlLmtleSkge1xuICAgICAgY2FzZSAnICc6XG4gICAgICBjYXNlICdTcGFjZUJhcic6XG4gICAgICBjYXNlICdFbnRlcic6XG4gICAgICAgIGUucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgb25PcHRpb25DaGFuZ2UoaW5kZXgpO1xuICAgICAgICBicmVhaztcbiAgICAgIGRlZmF1bHQ6XG4gICAgICAgIGJyZWFrO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYXNFcnJvciA9ICEhZXJyb3I7XG5cbiAgY29uc3QgaGFzU2VsZWN0ZWRPcHRpb24gPSBvcHRpb25zICYmICEhb3B0aW9uc1tzZWxlY3RlZE9wdGlvbl07XG5cbiAgY29uc3QgaGFuZGxlT3V0c2lkZUNsaWNrID0gKGV2ZW50OiBNb3VzZUV2ZW50KSA9PiB7XG4gICAgaWYgKHNlbGVjdENvbnRhaW5lclJlZi5jdXJyZW50ICYmICFzZWxlY3RDb250YWluZXJSZWYuY3VycmVudC5jb250YWlucyhldmVudC50YXJnZXQgYXMgTm9kZSkpIHtcbiAgICAgIHNldElzRHJvcGRvd25PcGVuKGZhbHNlKTtcbiAgICB9XG4gIH07XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICB3aW5kb3cuYWRkRXZlbnRMaXN0ZW5lcignY2xpY2snLCBoYW5kbGVPdXRzaWRlQ2xpY2spO1xuXG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIHdpbmRvdy5yZW1vdmVFdmVudExpc3RlbmVyKCdjbGljaycsIGhhbmRsZU91dHNpZGVDbGljayk7XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY3NzPXt7XG4gICAgICAgIG1hcmdpbkJvdHRvbTogbWFya0ludmFsaWQgPyAnMnB4JyA6ICcyMHB4JyxcbiAgICAgICAgJyY6Zm9jdXMtd2l0aGluIGxhYmVsJzoge1xuICAgICAgICAgIGNvbG9yOiBDT0xPUl9WMi5CTFVFLFxuICAgICAgICB9LFxuICAgICAgfX1cbiAgICAgIGRhdGEtdWllLW5hbWU9e2RhdGFVaWVOYW1lfVxuICAgICAgcmVmPXtzZWxlY3RDb250YWluZXJSZWZ9XG4gICAgPlxuICAgICAge2xhYmVsICYmIChcbiAgICAgICAgPElucHV0TGFiZWwgaHRtbEZvcj17aWR9IGlzUmVxdWlyZWQ9e3JlcXVpcmVkfSBtYXJrSW52YWxpZD17bWFya0ludmFsaWR9PlxuICAgICAgICAgIHtsYWJlbH1cbiAgICAgICAgPC9JbnB1dExhYmVsPlxuICAgICAgKX1cblxuICAgICAgPGRpdiBjc3M9e3twb3NpdGlvbjogJ3JlbGF0aXZlJ319PlxuICAgICAgICA8YnV0dG9uXG4gICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgYXJpYS1hY3RpdmVkZXNjZW5kYW50PXtoYXNTZWxlY3RlZE9wdGlvbiA/IG9wdGlvbnNbc2VsZWN0ZWRPcHRpb25dLmxhYmVsIDogJyd9XG4gICAgICAgICAgYXJpYS1leHBhbmRlZD17aXNEcm9wZG93bk9wZW59XG4gICAgICAgICAgYXJpYS1oYXNwb3B1cD1cImxpc3Rib3hcIlxuICAgICAgICAgIGFyaWEtbGFiZWxsZWRieT17aWR9XG4gICAgICAgICAgaWQ9e2lkfVxuICAgICAgICAgIG9uQ2xpY2s9e29uVG9nZ2xlRHJvcGRvd259XG4gICAgICAgICAgb25LZXlEb3duPXtoYW5kbGVMaXN0S2V5RG93bn1cbiAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IHNlbGVjdFN0eWxlKHRoZW1lLCBwcm9wcywgaGFzRXJyb3IpfVxuICAgICAgICAgIHsuLi5maWx0ZXJTZWxlY3RQcm9wcyhwcm9wcyl9XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT17ZGF0YVVpZU5hbWV9XG4gICAgICAgID5cbiAgICAgICAgICB7aGFzU2VsZWN0ZWRPcHRpb24gPyBvcHRpb25zW3NlbGVjdGVkT3B0aW9uXS5sYWJlbCA6IHBsYWNlaG9sZGVyVGV4dH1cbiAgICAgICAgPC9idXR0b24+XG5cbiAgICAgICAgPHVsXG4gICAgICAgICAgcmVmPXtsaXN0UmVmfVxuICAgICAgICAgIHJvbGU9XCJsaXN0Ym94XCJcbiAgICAgICAgICBhcmlhLWxhYmVsbGVkYnk9e2lkfVxuICAgICAgICAgIHRhYkluZGV4PXstMX1cbiAgICAgICAgICBvbktleURvd249e2hhbmRsZUxpc3RLZXlEb3dufVxuICAgICAgICAgIGNzcz17KHRoZW1lOiBUaGVtZSkgPT4gZHJvcGRvd25TdHlsZXModGhlbWUsIGlzRHJvcGRvd25PcGVuKX1cbiAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYGRyb3Bkb3duLSR7ZGF0YVVpZU5hbWV9YCxcbiAgICAgICAgICB9KX1cbiAgICAgICAgPlxuICAgICAgICAgIHtvcHRpb25zLm1hcCgob3B0aW9uLCBpbmRleCkgPT4ge1xuICAgICAgICAgICAgY29uc3QgaXNTZWxlY3RlZCA9IHNlbGVjdGVkT3B0aW9uID09IGluZGV4O1xuXG4gICAgICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgICA8bGlcbiAgICAgICAgICAgICAgICBrZXk9e29wdGlvbi52YWx1ZX1cbiAgICAgICAgICAgICAgICBpZD17b3B0aW9uLnZhbHVlLnRvU3RyaW5nKCl9XG4gICAgICAgICAgICAgICAgcm9sZT1cIm9wdGlvblwiXG4gICAgICAgICAgICAgICAgYXJpYS1zZWxlY3RlZD17aXNTZWxlY3RlZH1cbiAgICAgICAgICAgICAgICB0YWJJbmRleD17MH1cbiAgICAgICAgICAgICAgICBvbktleURvd249e2hhbmRsZUtleURvd24oaW5kZXgpfVxuICAgICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IG9uT3B0aW9uQ2hhbmdlKGluZGV4KX1cbiAgICAgICAgICAgICAgICBjc3M9eyh0aGVtZTogVGhlbWUpID0+IGRyb3Bkb3duT3B0aW9uU3R5bGVzKHRoZW1lLCBpc1NlbGVjdGVkKX1cbiAgICAgICAgICAgICAgICB7Li4uKGRhdGFVaWVOYW1lICYmIHtcbiAgICAgICAgICAgICAgICAgICdkYXRhLXVpZS1uYW1lJzogYG9wdGlvbi0ke2RhdGFVaWVOYW1lfWAsXG4gICAgICAgICAgICAgICAgICAnZGF0YS11aWUtdmFsdWUnOiBvcHRpb24ubGFiZWwsXG4gICAgICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7b3B0aW9uLmxhYmVsfVxuICAgICAgICAgICAgICA8L2xpPlxuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9KX1cbiAgICAgICAgPC91bD5cbiAgICAgIDwvZGl2PlxuXG4gICAgICB7IWhhc0Vycm9yICYmIGhlbHBlclRleHQgJiYgKFxuICAgICAgICA8cCBjc3M9e3tmb250U2l6ZTogJzEycHgnLCBmb250V2VpZ2h0OiA0MDAsIGNvbG9yOiBDT0xPUl9WMi5HUkFZXzgwLCBtYXJnaW5Ub3A6IDh9fT57aGVscGVyVGV4dH08L3A+XG4gICAgICApfVxuXG4gICAgICB7ZXJyb3J9XG4gICAgPC9kaXY+XG4gICk7XG59O1xuIl19 */")
|
|
341
|
+
}, helperText), error);
|
|
69
342
|
};
|
|
70
343
|
|
|
71
344
|
exports.Select = Select;
|
package/src/Form/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Select.tsx"],"names":["ArrowDown","theme","general","color","selectStyle","disabled","markInvalid","props","textShadow","COLOR","GRAY","appearance","background","Input","backgroundColorDisabled","backgroundColor","boxShadow","RED","cursor","fontSize","fontWeight","paddingRight","filterSelectProps","Select"],"mappings":";;;;;;;;;;;;;;;AAoBA;;AAEA;;AAEA;;AACA;;;;;;;;AAOA,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAACC,KAAD;AAAA,iIAEAA,KAAK,CAACC,OAAN,CAAcC,KAFd;AAAA,CAAlB;;AAMO,IAAMC,WAAkE,GAAG,SAArEA,WAAqE,CAChFH,KADgF;AAAA,2BAE/EI,QAF+E;AAAA,MAE/EA,QAF+E,8BAEpE,KAFoE;AAAA,MAE7DC,WAF6D,QAE7DA,WAF6D;AAAA,MAE7CC,KAF6C;AAAA,yCAI7E,uBAAWN,KAAX,EAAkBM,KAAlB,CAJ6E;AAKhF,wBAAoB;AAClBJ,MAAAA,KAAK,EAAE,aADW;AAElBK,MAAAA,UAAU,EAAE;AAFM,KAL4D;AAShF,kBAAc;AACZL,MAAAA,KAAK,EAAEM,gBAAMC;AADD,KATkE;AAYhFC,IAAAA,UAAU,EAAE,MAZoE;AAahFC,IAAAA,UAAU,EAAEP,QAAQ,GAChBJ,KAAK,CAACY,KAAN,CAAYC,uBADI,aAEbb,KAAK,CAACY,KAAN,CAAYE,eAFC,gDAEmD,qBAAUf,SAAS,CAACC,KAAD,CAAnB,CAFnD,QAb4D;AAgBhFe,IAAAA,SAAS,EAAEV,WAAW,uBAAgBG,gBAAMQ,GAAtB,wBAA2CR,gBAAMC,IAAjD,CAhB0D;AAiBhFQ,IAAAA,MAAM,EAAEb,QAAQ,GAAG,QAAH,GAAc,SAjBkD;AAkBhFc,IAAAA,QAAQ,EAAE,MAlBsE;AAmBhFC,IAAAA,UAAU,EAAE,GAnBoE;AAoBhFC,IAAAA,YAAY,EAAE;AApBkE;AAAA,CAA3E;;;;AAuBP,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACf,KAAD;AAAA,SAAwB,uBAAYA,KAAZ,EAAmB,CAAC,aAAD,CAAnB,CAAxB;AAAA,CAA1B;;AAEO,IAAMgB,MAAM,GAAG,SAATA,MAAS,CAAChB,KAAD;AAAA,SACpB;AAAQ,IAAA,GAAG,EAAE,aAACN,KAAD;AAAA,aAAkBG,WAAW,CAACH,KAAD,EAAQM,KAAR,CAA7B;AAAA;AAAb,KAA8De,iBAAiB,CAACf,KAAD,CAA/E,EADoB;AAAA,CAAf","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {COLOR} from '../Identity';\nimport type {Theme} from '../Layout';\nimport {filterProps, inlineSVG} from '../util';\nimport {InputProps, inputStyle} from './Input';\n\nexport interface SelectProps<T = HTMLSelectElement> extends InputProps<T> {\n disabled?: boolean;\n markInvalid?: boolean;\n}\n\nconst ArrowDown = (theme: Theme) => `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\">\n <path fill=\"${theme.general.color}\" fillRule=\"evenodd\" d=\"M0 2h8L4 7\" />\n </svg>\n`;\n\nexport const selectStyle: <T>(theme: Theme, props: SelectProps<T>) => CSSObject = (\n theme,\n {disabled = false, markInvalid, ...props},\n) => ({\n ...inputStyle(theme, props),\n '&:-moz-focusring': {\n color: 'transparent',\n textShadow: '0 0 0 #000',\n },\n '&:disabled': {\n color: COLOR.GRAY,\n },\n appearance: 'none',\n background: disabled\n ? theme.Input.backgroundColorDisabled\n : `${theme.Input.backgroundColor} center right 16px no-repeat url(\"${inlineSVG(ArrowDown(theme))}\")`,\n boxShadow: markInvalid ? `0 0 0 1px ${COLOR.RED}` : `0 0 0 1px ${COLOR.GRAY}`,\n cursor: disabled ? 'normal' : 'pointer',\n fontSize: '16px',\n fontWeight: 300,\n paddingRight: '30px',\n});\n\nconst filterSelectProps = (props: SelectProps) => filterProps(props, ['markInvalid']);\n\nexport const Select = (props: SelectProps) => (\n <select css={(theme: Theme) => selectStyle(theme, props)} {...filterSelectProps(props)} />\n);\n"],"file":"Select.js"}
|
|
1
|
+
{"version":3,"sources":["Select.tsx"],"names":["ArrowDown","theme","general","color","selectStyle","disabled","markInvalid","props","error","textShadow","COLOR_V2","GRAY","appearance","background","Input","backgroundColorDisabled","backgroundColor","boxShadow","RED","GRAY_40","cursor","fontSize","fontWeight","paddingRight","textAlign","marginBottom","GRAY_60","BLUE","dropdownStyles","isDropdownOpen","height","visibility","margin","padding","borderRadius","border","position","top","left","width","maxHeight","overflowY","zIndex","dropdownOptionStyles","isSelected","WHITE","listStyle","lineHeight","letterSpacing","BLACK","borderBottom","borderColor","filterSelectProps","placeholderText","Select","id","label","helperText","options","value","onChange","required","dataUieName","selectContainerRef","listRef","setIsDropdownOpen","indexOf","selectedOption","setSelectedOption","onToggleDropdown","prevState","scrollToCurrentOption","idx","current","listSelectedOption","children","getYPosition","offsetTop","scroll","behavior","onOptionSelect","onOptionChange","handleListKeyDown","e","key","preventDefault","length","handleKeyDown","index","hasError","hasSelectedOption","handleOutsideClick","event","contains","target","window","addEventListener","removeEventListener","map","option","toString","GRAY_80","marginTop"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {COLOR_V2} from '../Identity';\nimport type {Theme} from '../Layout';\nimport {filterProps, inlineSVG} from '../util';\nimport {inputStyle} from './Input';\nimport React, {ReactElement, useEffect, useRef, useState} from 'react';\nimport InputLabel from './InputLabel';\n\ntype Option = {\n value: string | number;\n label: string;\n};\n\nexport interface SelectProps {\n id: string;\n onChange: (selectedOption: string | number) => void;\n dataUieName: string;\n options: Option[];\n value?: Option | null;\n helperText?: string;\n label?: string;\n disabled?: boolean;\n required?: boolean;\n markInvalid?: boolean;\n error?: ReactElement;\n}\n\nconst ArrowDown = (theme: Theme) => `\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <path fill=\"${theme.general.color}\" fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.99963 12.5711L15.6565 4.91421L14.2423 3.5L7.99963 9.74264L1.75699 3.5L0.342773 4.91421L7.99963 12.5711Z\"/>\n </svg>\n`;\n\nexport const selectStyle: <T>(theme: Theme, props, error?: boolean) => CSSObject = (\n theme,\n {disabled = false, markInvalid, ...props},\n error = false,\n) => ({\n ...inputStyle(theme, props),\n '&:-moz-focusring': {\n color: 'transparent',\n textShadow: '0 0 0 #000',\n },\n '&:disabled': {\n color: COLOR_V2.GRAY,\n },\n appearance: 'none',\n background: disabled\n ? `${theme.Input.backgroundColorDisabled} center right 16px no-repeat url(\"${inlineSVG(ArrowDown(theme))}\")`\n : `${theme.Input.backgroundColor} center right 16px no-repeat url(\"${inlineSVG(ArrowDown(theme))}\")`,\n boxShadow: markInvalid ? `0 0 0 1px ${COLOR_V2.RED}` : `0 0 0 1px ${COLOR_V2.GRAY_40}`,\n cursor: disabled ? 'normal' : 'pointer',\n fontSize: '16px',\n fontWeight: 300,\n paddingRight: '30px',\n textAlign: 'left',\n marginBottom: error && '8px',\n '&:invalid, option:first-of-type': {\n color: COLOR_V2.RED,\n },\n ...(!disabled && {\n '&:hover': {\n boxShadow: `0 0 0 1px ${COLOR_V2.GRAY_60}`,\n },\n '&:focus, &:active': {\n boxShadow: `0 0 0 1px ${COLOR_V2.BLUE}`,\n },\n }),\n});\n\nconst dropdownStyles = (theme: Theme, isDropdownOpen: boolean): CSSObject => ({\n height: isDropdownOpen ? 'auto' : 0,\n visibility: isDropdownOpen ? 'visible' : 'hidden',\n margin: '3px 0 0',\n padding: 0,\n borderRadius: '10px',\n border: `1px solid ${COLOR_V2.BLUE}`,\n position: 'absolute',\n top: '100%',\n left: 0,\n width: '100%',\n maxHeight: '240px',\n overflowY: 'auto',\n zIndex: 9,\n});\n\nconst dropdownOptionStyles = (theme: Theme, isSelected: boolean): CSSObject => ({\n background: isSelected ? COLOR_V2.BLUE : COLOR_V2.WHITE,\n listStyle: 'none',\n padding: '10px 20px 14px',\n cursor: 'pointer',\n fontSize: '16px',\n fontWeight: 300,\n lineHeight: '24px',\n letterSpacing: '0.05px',\n color: isSelected ? COLOR_V2.WHITE : COLOR_V2.BLACK,\n '&:first-of-type': {\n borderRadius: '10px 10px 0 0',\n },\n '&:last-of-type': {\n borderRadius: '0 0 10px 10px',\n },\n '&:not(:last-of-type)': {\n borderBottom: `1px solid ${COLOR_V2.GRAY_40}`,\n },\n '&:hover, &:active, &:focus': {\n background: COLOR_V2.BLUE,\n borderColor: COLOR_V2.BLUE,\n color: COLOR_V2.WHITE,\n },\n});\n\nconst filterSelectProps = props => filterProps(props, ['markInvalid']);\n\nconst placeholderText = '- Please select -';\n\nexport const Select = ({\n id,\n label,\n error,\n helperText,\n options = [],\n value = null,\n onChange,\n required,\n markInvalid,\n dataUieName,\n ...props\n}: SelectProps) => {\n const selectContainerRef = useRef<HTMLDivElement>(null);\n const listRef = useRef<HTMLUListElement>(null);\n const [isDropdownOpen, setIsDropdownOpen] = useState(false);\n const [selectedOption, setSelectedOption] = useState<number | null>(() => (value ? options.indexOf(value) : null));\n\n const onToggleDropdown = () => setIsDropdownOpen(prevState => !prevState);\n\n const scrollToCurrentOption = (idx: number) => {\n if (listRef.current) {\n const listSelectedOption = listRef.current.children[idx] as HTMLLIElement;\n const getYPosition = listSelectedOption && listSelectedOption.offsetTop;\n\n listRef.current.scroll({\n top: getYPosition ?? 0,\n behavior: 'smooth',\n });\n }\n };\n\n const onOptionSelect = (idx: number) => {\n setSelectedOption(idx);\n onChange(options[idx].value);\n scrollToCurrentOption(idx);\n };\n\n const onOptionChange = (idx: number) => {\n onOptionSelect(idx);\n setIsDropdownOpen(false);\n };\n\n const handleListKeyDown = e => {\n switch (e.key) {\n case 'Escape':\n e.preventDefault();\n setIsDropdownOpen(false);\n break;\n case 'ArrowUp':\n case 'ArrowLeft':\n if (!isDropdownOpen) {\n setIsDropdownOpen(true);\n }\n\n e.preventDefault();\n onOptionSelect(selectedOption - 1 >= 0 ? selectedOption - 1 : options.length - 1);\n break;\n case 'ArrowDown':\n case 'ArrowRight':\n if (!isDropdownOpen) {\n setIsDropdownOpen(true);\n }\n\n e.preventDefault();\n if (selectedOption === null) {\n onOptionSelect(0);\n } else {\n onOptionSelect(selectedOption === options.length - 1 ? 0 : selectedOption + 1);\n }\n break;\n default:\n break;\n }\n };\n\n const handleKeyDown = index => e => {\n switch (e.key) {\n case ' ':\n case 'SpaceBar':\n case 'Enter':\n e.preventDefault();\n onOptionChange(index);\n break;\n default:\n break;\n }\n };\n\n const hasError = !!error;\n\n const hasSelectedOption = options && !!options[selectedOption];\n\n const handleOutsideClick = (event: MouseEvent) => {\n if (selectContainerRef.current && !selectContainerRef.current.contains(event.target as Node)) {\n setIsDropdownOpen(false);\n }\n };\n\n useEffect(() => {\n window.addEventListener('click', handleOutsideClick);\n\n return () => {\n window.removeEventListener('click', handleOutsideClick);\n };\n }, []);\n\n return (\n <div\n css={{\n marginBottom: markInvalid ? '2px' : '20px',\n '&:focus-within label': {\n color: COLOR_V2.BLUE,\n },\n }}\n data-uie-name={dataUieName}\n ref={selectContainerRef}\n >\n {label && (\n <InputLabel htmlFor={id} isRequired={required} markInvalid={markInvalid}>\n {label}\n </InputLabel>\n )}\n\n <div css={{position: 'relative'}}>\n <button\n type=\"button\"\n aria-activedescendant={hasSelectedOption ? options[selectedOption].label : ''}\n aria-expanded={isDropdownOpen}\n aria-haspopup=\"listbox\"\n aria-labelledby={id}\n id={id}\n onClick={onToggleDropdown}\n onKeyDown={handleListKeyDown}\n css={(theme: Theme) => selectStyle(theme, props, hasError)}\n {...filterSelectProps(props)}\n data-uie-name={dataUieName}\n >\n {hasSelectedOption ? options[selectedOption].label : placeholderText}\n </button>\n\n <ul\n ref={listRef}\n role=\"listbox\"\n aria-labelledby={id}\n tabIndex={-1}\n onKeyDown={handleListKeyDown}\n css={(theme: Theme) => dropdownStyles(theme, isDropdownOpen)}\n {...(dataUieName && {\n 'data-uie-name': `dropdown-${dataUieName}`,\n })}\n >\n {options.map((option, index) => {\n const isSelected = selectedOption == index;\n\n return (\n <li\n key={option.value}\n id={option.value.toString()}\n role=\"option\"\n aria-selected={isSelected}\n tabIndex={0}\n onKeyDown={handleKeyDown(index)}\n onClick={() => onOptionChange(index)}\n css={(theme: Theme) => dropdownOptionStyles(theme, isSelected)}\n {...(dataUieName && {\n 'data-uie-name': `option-${dataUieName}`,\n 'data-uie-value': option.label,\n })}\n >\n {option.label}\n </li>\n );\n })}\n </ul>\n </div>\n\n {!hasError && helperText && (\n <p css={{fontSize: '12px', fontWeight: 400, color: COLOR_V2.GRAY_80, marginTop: 8}}>{helperText}</p>\n )}\n\n {error}\n </div>\n );\n};\n"],"file":"Select.js"}
|