reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2024-09-21 11:29:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(devui): fix style of Select (#721)

Browse Source 
* fix(devui): fix style of Select

* Upgrade @types/react-select

* Update snapshots
This commit is contained in:
Nathan Bierema 2021-06-06 16:42:40 -04:00 committed by GitHub
parent bc5523f14f
commit bb72311e1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 135 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/devui/package.json
View File

@ -40,7 +40,7 @@
"@types/base16": "^1.0.2",
"@types/codemirror": "^0.0.97",
"@types/prop-types": "^15.7.3",
"@types/react-select": "^3.0.19",
"@types/react-select": "^3.1.2",
"@types/redux-devtools-themes": "^1.0.0",
"@types/simple-element-resize-detector": "^1.3.0",
"@types/styled-components": "^5.1.2",

12
packages/devui/src/Select/Select.tsx
View File

@ -44,6 +44,18 @@ export class Select extends (PureComponent || Component)<SelectProps> {
controlHeight: this.props.theme.inputHeight,
},
})}
styles={{
container: (base, props) => ({
...base,
flexGrow: 1,
}),
control: (base, props) => ({
...base,
backgroundColor: props.isDisabled
? props.theme.colors.neutral10
: props.theme.colors.neutral5,
}),
}}
/>
);
}

146
packages/devui/tests/__snapshots__/Select.test.tsx.snap
View File

@ -2,7 +2,7 @@
exports[`Select renders correctly 1`] = `
<div
class=" css-2b097c-container"
class=" css-butsr4-container"
>
<div
class=" css-vmgz7k-control"
@ -70,7 +70,7 @@ exports[`Select renders correctly 1`] = `
exports[`Select renders with props 1`] = `
<div
class=" css-2b097c-container"
class=" css-butsr4-container"
>
<div
class=" css-vmgz7k-control"
@ -312,6 +312,12 @@ exports[`Select should select another option 1`] = `
},
]
}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
theme={[Function]}
>
<Select
@ -368,7 +374,12 @@ exports[`Select should select another option 1`] = `
pageSize={5}
placeholder="Select..."
screenReaderStatus={[Function]}
styles={Object {}}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
tabIndex="0"
tabSelectsValue={true}
theme={[Function]}
@ -460,7 +471,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -506,6 +520,7 @@ exports[`Select should select another option 1`] = `
Object {
"boxSizing": "border-box",
"direction": null,
"flexGrow": 1,
"label": "container",
"pointerEvents": null,
"position": "relative",
@ -514,7 +529,7 @@ exports[`Select should select another option 1`] = `
onKeyDown={[Function]}
>
<div
className=" css-2b097c-container"
className=" css-butsr4-container"
onKeyDown={[Function]}
>
<Control
@ -605,7 +620,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -758,7 +776,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -884,7 +905,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1112,7 +1136,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1247,7 +1274,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1393,7 +1423,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1585,7 +1618,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1715,7 +1751,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -1867,7 +1906,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2023,7 +2065,10 @@ exports[`Select should select another option 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2216,6 +2261,12 @@ exports[`Select shouldn't find any results 1`] = `
},
]
}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
theme={[Function]}
>
<Select
@ -2272,7 +2323,12 @@ exports[`Select shouldn't find any results 1`] = `
pageSize={5}
placeholder="Select..."
screenReaderStatus={[Function]}
styles={Object {}}
styles={
Object {
"container": [Function],
"control": [Function],
}
}
tabIndex="0"
tabSelectsValue={true}
theme={[Function]}
@ -2364,7 +2420,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2410,6 +2469,7 @@ exports[`Select shouldn't find any results 1`] = `
Object {
"boxSizing": "border-box",
"direction": null,
"flexGrow": 1,
"label": "container",
"pointerEvents": null,
"position": "relative",
@ -2418,7 +2478,7 @@ exports[`Select shouldn't find any results 1`] = `
onKeyDown={[Function]}
>
<div
className=" css-2b097c-container"
className=" css-butsr4-container"
onKeyDown={[Function]}
>
<Control
@ -2509,7 +2569,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2662,7 +2725,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -2788,7 +2854,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3016,7 +3085,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3151,7 +3223,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3297,7 +3372,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3489,7 +3567,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3619,7 +3700,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3771,7 +3855,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],
@ -3906,7 +3993,10 @@ exports[`Select shouldn't find any results 1`] = `
"pageSize": 5,
"placeholder": "Select...",
"screenReaderStatus": [Function],
"styles": Object {},
"styles": Object {
"container": [Function],
"control": [Function],
},
"tabIndex": "0",
"tabSelectsValue": true,
"theme": [Function],

8
yarn.lock
View File

@ -4035,10 +4035,10 @@
"@types/history" "*"
"@types/react" "*"
"@types/react-select@^3.0.19":
version "3.0.19"
resolved "https://registry.yarnpkg.com/@types/react-select/-/react-select-3.0.19.tgz#f73b04b8113451b0597df8a8315f9bf8ce03eb44"
integrity sha512-d+6qtfFXZeIOAABlVL1e50RZn8ctOABE4tFDxM6KW4lKuXgTTgLVrSik5AX9XjBjV7N80FtS6GTN/WeoXL9Jww==
"@types/react-select@^3.1.2":
version "3.1.2"
resolved "https://registry.yarnpkg.com/@types/react-select/-/react-select-3.1.2.tgz#38627df4b49be9b28f800ed72b35d830369a624b"
integrity sha512-ygvR/2FL87R2OLObEWFootYzkvm67LRA+URYEAcBuvKk7IXmdsnIwSGm60cVXGaqkJQHozb2Cy1t94tCYb6rJA==
dependencies:
"@types/react" "*"
"@types/react-dom" "*"