@wireapp/react-ui-kit 9.11.1 → 9.12.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/lib/Form/Select.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Form/Select.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,YAAY,EAAC,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAC,SAAS,EAAW,MAAM,gBAAgB,CAAC;AACnD,OAAoB,EAAC,SAAS,EAAe,MAAM,cAAc,CAAC;AAClE,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iDAAiD,CAAC;
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Form/Select.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,YAAY,EAAC,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAC,SAAS,EAAW,MAAM,gBAAgB,CAAC;AACnD,OAAoB,EAAC,SAAS,EAAe,MAAM,cAAc,CAAC;AAClE,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iDAAiD,CAAC;AAiBvF,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,UAAU,WAAW,CAAC,OAAO,SAAS,OAAO,EAAE,KAAK,SAAS,SAAS,CAAC,MAAM,CAAC,CAC5E,SAAQ,iBAAiB,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC;IACjD,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IAC5B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,MAAM,iSA2ElB,CAAC"}
|
package/lib/Form/Select.js
CHANGED
|
@@ -26,7 +26,9 @@ const Select = (_a) => {
|
|
|
26
26
|
var { id, label, error, helperText, disabled = false, dataUieName, options, isMulti, wrapperCSS = {}, markInvalid = false, required = false } = _a, props = __rest(_a, ["id", "label", "error", "helperText", "disabled", "dataUieName", "options", "isMulti", "wrapperCSS", "markInvalid", "required"]);
|
|
27
27
|
const theme = (0, react_1.useTheme)();
|
|
28
28
|
const hasError = !!error;
|
|
29
|
-
return ((0, jsx_runtime_1.jsxs)("div", {
|
|
29
|
+
return ((0, jsx_runtime_1.jsxs)("div", {
|
|
30
|
+
// eslint-disable-next-line jsx-a11y/no-autofocus
|
|
31
|
+
autoFocus: (0, SelectComponents_1.isGroup)(options), css: (theme) => (Object.assign({ marginBottom: markInvalid ? '2px' : '20px', width: '100%', '&:focus-within label': {
|
|
30
32
|
color: theme.general.primaryColor,
|
|
31
33
|
} }, wrapperCSS)), "data-uie-name": dataUieName, children: [label && ((0, jsx_runtime_1.jsx)(InputLabel_1.InputLabel, { htmlFor: id, markInvalid: markInvalid, isRequired: required, children: label })), (0, jsx_runtime_1.jsx)(react_select_1.default, Object.assign({ id: id, styles: (0, SelectStyles_1.customStyles)(theme, markInvalid), components: {
|
|
32
34
|
SelectContainer: SelectComponents_1.SelectContainer,
|
|
@@ -944,6 +944,8 @@ export declare const customStyles: (theme: Theme, markInvalid?: boolean) => {
|
|
|
944
944
|
control: (_provided: any, { options }: {
|
|
945
945
|
options: any;
|
|
946
946
|
}) => {
|
|
947
|
+
position: string;
|
|
948
|
+
zIndex: number;
|
|
947
949
|
display: string;
|
|
948
950
|
alignItems: string;
|
|
949
951
|
appearance: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectStyles.d.ts","sourceRoot":"","sources":["../../src/Form/SelectStyles.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAEhC,eAAO,MAAM,YAAY,UAAW,KAAK
|
|
1
|
+
{"version":3,"file":"SelectStyles.d.ts","sourceRoot":"","sources":["../../src/Form/SelectStyles.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAC;AAEhC,eAAO,MAAM,YAAY,UAAW,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyMvC,CAAC"}
|
package/lib/Form/SelectStyles.js
CHANGED
|
@@ -55,14 +55,10 @@ const customStyles = (theme, markInvalid = false) => ({
|
|
|
55
55
|
} }),
|
|
56
56
|
};
|
|
57
57
|
},
|
|
58
|
-
control: (_provided, { options }) => ({
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
padding: '0 8px 0 16px',
|
|
63
|
-
height: 'auto',
|
|
64
|
-
minHeight: '48px',
|
|
65
|
-
}),
|
|
58
|
+
control: (_provided, { options }) => (Object.assign({ display: 'flex', alignItems: 'center', appearance: 'none', padding: '0 8px 0 16px', height: 'auto', minHeight: '48px' }, ((0, SelectComponents_1.isGroup)(options) && {
|
|
59
|
+
position: 'absolute',
|
|
60
|
+
zIndex: -9999,
|
|
61
|
+
}))),
|
|
66
62
|
dropdownIndicator: (provided, selectProps) => {
|
|
67
63
|
const isSelectDisabled = selectProps.isDisabled;
|
|
68
64
|
return Object.assign(Object.assign({}, provided), { '& > svg': {
|
|
@@ -74,7 +70,7 @@ const customStyles = (theme, markInvalid = false) => ({
|
|
|
74
70
|
menu: (provided, { options }) => (Object.assign(Object.assign(Object.assign({}, provided), { boxShadow: `0 0 0 1px ${theme.general.primaryColor}, 0 4px 11px hsl(0deg 0% 0% / 10%)`, borderRadius: 12, marginBottom: 0, marginTop: 4, overflowY: 'overlay' }), ((0, SelectComponents_1.isGroup)(options) && {
|
|
75
71
|
minWidth: '400px',
|
|
76
72
|
}))),
|
|
77
|
-
menuList: provided => (Object.assign(Object.assign({}, provided), { borderRadius: 12, paddingBottom: 0, paddingTop: 0 })),
|
|
73
|
+
menuList: provided => (Object.assign(Object.assign({}, provided), { borderRadius: 12, paddingBottom: 0, paddingTop: 0, maxHeight: 'fit-content' })),
|
|
78
74
|
option: (provided, { isMulti, isDisabled, isFocused, isSelected, options, data }) => (Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, provided), { backgroundColor: theme.Input.backgroundColor, color: theme.general.color, padding: (0, SelectComponents_1.isGroup)(options) ? '6px 16px' : '10px 18px', cursor: isDisabled ? 'not-allowed' : 'pointer', fontSize: theme.fontSizes.base, fontWeight: isSelected && (0, SelectComponents_1.isGroup)(options) ? 600 : 400, lineHeight: '1.5rem' }), (isSelected &&
|
|
79
75
|
!isDisabled &&
|
|
80
76
|
!isMulti && {
|
package/package.json
CHANGED