jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update to Emotion 11

Browse Source 
Summary: Per title

Reviewed By: passy

Differential Revision: D24994086

fbshipit-source-id: 84d83638ec518a39ea2d80f56b8c794c8b86a9d4
This commit is contained in:
Michel Weststrate
2020-11-18 06:47:40 -08:00
committed by Facebook GitHub Bot
parent 339a5280ac
commit f7c40c315c
30 changed files with 439 additions and 369 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
desktop/app/package.json
View File

@@ -11,8 +11,9 @@
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@ant-design/icons": "^4.2.2", "@ant-design/icons": "^4.2.2",
"@emotion/core": "^10.0.22", "@emotion/css": "^11.0.0",
"@emotion/styled": "^10.0.23", "@emotion/react": "^11.1.1",
"@emotion/styled": "^11.0.0",
"@iarna/toml": "^2.2.5", "@iarna/toml": "^2.2.5",
"@types/archiver": "^3.1.0", "@types/archiver": "^3.1.0",
"@types/uuid": "^8.0.1", "@types/uuid": "^8.0.1",
@@ -25,7 +26,6 @@
"axios": "^0.20.0", "axios": "^0.20.0",
"console-feed": "^3.1.10", "console-feed": "^3.1.10",
"deep-equal": "^2.0.1", "deep-equal": "^2.0.1",
"emotion": "^10.0.23",
"expand-tilde": "^2.0.2", "expand-tilde": "^2.0.2",
"flipper-client-sdk": "^0.0.3", "flipper-client-sdk": "^0.0.3",
"flipper-doctor": "0.66.0", "flipper-doctor": "0.66.0",

40
desktop/app/src/__tests__/PluginContainer.node.tsx
View File

@@ -65,7 +65,7 @@ test('Plugin container can render plugin and receive updates', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<h1> <h1>
Hello: Hello:
@@ -78,7 +78,7 @@ test('Plugin container can render plugin and receive updates', async () => {
</h1> </h1>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -162,7 +162,7 @@ test('PluginContainer can render Sandy plugins', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<div> <div>
Hello from Sandy Hello from Sandy
@@ -170,7 +170,7 @@ test('PluginContainer can render Sandy plugins', async () => {
</div> </div>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -193,7 +193,7 @@ test('PluginContainer can render Sandy plugins', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<div> <div>
Hello from Sandy Hello from Sandy
@@ -201,7 +201,7 @@ test('PluginContainer can render Sandy plugins', async () => {
</div> </div>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -261,7 +261,7 @@ test('PluginContainer can render Sandy plugins', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<div> <div>
Hello from Sandy Hello from Sandy
@@ -269,7 +269,7 @@ test('PluginContainer can render Sandy plugins', async () => {
</div> </div>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -502,7 +502,7 @@ test('PluginContainer + Sandy plugin supports deeplink', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<h1> <h1>
hello hello
@@ -510,7 +510,7 @@ test('PluginContainer + Sandy plugin supports deeplink', async () => {
</h1> </h1>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -532,7 +532,7 @@ test('PluginContainer + Sandy plugin supports deeplink', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<h1> <h1>
hello hello
@@ -540,7 +540,7 @@ test('PluginContainer + Sandy plugin supports deeplink', async () => {
</h1> </h1>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -652,14 +652,14 @@ test('PluginContainer can render Sandy device plugins', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<div> <div>
Hello from Sandy: Hello from Sandy:
</div> </div>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -683,7 +683,7 @@ test('PluginContainer can render Sandy device plugins', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<div> <div>
Hello from Sandy: Hello from Sandy:
@@ -691,7 +691,7 @@ test('PluginContainer can render Sandy device plugins', async () => {
</div> </div>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -776,7 +776,7 @@ test('PluginContainer + Sandy device plugin supports deeplink', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<h1> <h1>
hello hello
@@ -784,7 +784,7 @@ test('PluginContainer + Sandy device plugin supports deeplink', async () => {
</h1> </h1>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>
@@ -806,7 +806,7 @@ test('PluginContainer + Sandy device plugin supports deeplink', async () => {
<body> <body>
<div> <div>
<div <div
class="css-1orvm1g-View-FlexBox-FlexColumn" class="css-w6yhx2-View-FlexBox-FlexColumn"
> >
<h1> <h1>
hello hello
@@ -814,7 +814,7 @@ test('PluginContainer + Sandy device plugin supports deeplink', async () => {
</h1> </h1>
</div> </div>
<div <div
class="css-bxcvv9-View-FlexBox-FlexRow" class="css-o0040c-View-FlexBox-FlexRow"
id="detailsSidebar" id="detailsSidebar"
/> />
</div> </div>

76
desktop/app/src/chrome/__tests__/__snapshots__/ExportDataPluginSheet.node.tsx.snap
View File

@@ -2,13 +2,13 @@
exports[`SettingsSheet snapshot with nothing enabled 1`] = ` exports[`SettingsSheet snapshot with nothing enabled 1`] = `
<div <div
className="css-12h374y-View-FlexBox-FlexColumn" className="css-p0wmbe-View-FlexBox-FlexColumn"
> >
<div <div
className="css-8h6kz5-View-FlexBox-FlexColumn" className="css-1edwc8r-View-FlexBox-FlexColumn"
> >
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<span <span
className="css-meh2qi-Text" className="css-meh2qi-Text"
@@ -16,13 +16,13 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
Select the plugins for which you want to export the data Select the plugins for which you want to export the data
</span> </span>
<div <div
className="css-1k23ouh-View-FlexBox-FlexColumn" className="css-1houjzq-View-FlexBox-FlexColumn"
> >
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
@@ -30,7 +30,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
className="css-1jrm6r3" className="css-1jrm6r3"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
style={ style={
Object { Object {
"alignItems": "center", "alignItems": "center",
@@ -43,11 +43,11 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
TestDevicePlugin TestDevicePlugin
</span> </span>
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<input <input
checked={false} checked={false}
className="css-yvyra-CheckboxContainer e28aqfo0" className="css-1pxrk7-CheckboxContainer e28aqfo0"
disabled={false} disabled={false}
onChange={[Function]} onChange={[Function]}
type="checkbox" type="checkbox"
@@ -60,10 +60,10 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
</div> </div>
</div> </div>
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
@@ -71,7 +71,7 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
className="css-1jrm6r3" className="css-1jrm6r3"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
style={ style={
Object { Object {
"alignItems": "center", "alignItems": "center",
@@ -84,11 +84,11 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
TestPlugin TestPlugin
</span> </span>
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<input <input
checked={false} checked={false}
className="css-yvyra-CheckboxContainer e28aqfo0" className="css-1pxrk7-CheckboxContainer e28aqfo0"
disabled={false} disabled={false}
onChange={[Function]} onChange={[Function]}
type="checkbox" type="checkbox"
@@ -106,16 +106,16 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
className="css-1yqvjo0" className="css-1yqvjo0"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<div <div
className="css-12n892b" className="css-12n892b"
> >
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}
@@ -124,12 +124,12 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
</div> </div>
</div> </div>
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
<div <div
className="css-ia8nd7-StyledButton enfqd40" className="css-ia8nd7-StyledButton enfqd41"
disabled={true} disabled={true}
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
@@ -147,13 +147,13 @@ exports[`SettingsSheet snapshot with nothing enabled 1`] = `
exports[`SettingsSheet snapshot with one plugin enabled 1`] = ` exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
<div <div
className="css-12h374y-View-FlexBox-FlexColumn" className="css-p0wmbe-View-FlexBox-FlexColumn"
> >
<div <div
className="css-8h6kz5-View-FlexBox-FlexColumn" className="css-1edwc8r-View-FlexBox-FlexColumn"
> >
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<span <span
className="css-meh2qi-Text" className="css-meh2qi-Text"
@@ -161,13 +161,13 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
Select the plugins for which you want to export the data Select the plugins for which you want to export the data
</span> </span>
<div <div
className="css-1k23ouh-View-FlexBox-FlexColumn" className="css-1houjzq-View-FlexBox-FlexColumn"
> >
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
@@ -175,7 +175,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
className="css-1jrm6r3" className="css-1jrm6r3"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
style={ style={
Object { Object {
"alignItems": "center", "alignItems": "center",
@@ -188,11 +188,11 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
TestDevicePlugin TestDevicePlugin
</span> </span>
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<input <input
checked={false} checked={false}
className="css-yvyra-CheckboxContainer e28aqfo0" className="css-1pxrk7-CheckboxContainer e28aqfo0"
disabled={false} disabled={false}
onChange={[Function]} onChange={[Function]}
type="checkbox" type="checkbox"
@@ -205,10 +205,10 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
</div> </div>
</div> </div>
<div <div
className="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" className="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
@@ -216,7 +216,7 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
className="css-1jrm6r3" className="css-1jrm6r3"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
style={ style={
Object { Object {
"alignItems": "center", "alignItems": "center",
@@ -229,11 +229,11 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
TestPlugin TestPlugin
</span> </span>
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<input <input
checked={true} checked={true}
className="css-yvyra-CheckboxContainer e28aqfo0" className="css-1pxrk7-CheckboxContainer e28aqfo0"
disabled={false} disabled={false}
onChange={[Function]} onChange={[Function]}
type="checkbox" type="checkbox"
@@ -251,16 +251,16 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
className="css-1yqvjo0" className="css-1yqvjo0"
> >
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<div <div
className="css-12n892b" className="css-12n892b"
> >
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}
@@ -269,12 +269,12 @@ exports[`SettingsSheet snapshot with one plugin enabled 1`] = `
</div> </div>
</div> </div>
<div <div
className="css-yzqaun-TooltipContainer e1abcqbd0" className="css-auhar3-TooltipContainer e1abcqbd0"
onMouseEnter={[Function]} onMouseEnter={[Function]}
onMouseLeave={[Function]} onMouseLeave={[Function]}
> >
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
disabled={false} disabled={false}
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}

24
desktop/app/src/chrome/__tests__/__snapshots__/ShareSheetPendingDialog.node.tsx.snap
View File

@@ -2,7 +2,7 @@
exports[`ShareSheetPendingDialog is rendered with status update 1`] = ` exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
<div <div
className="css-75dkqw-View-FlexBox-FlexColumn" className="css-1lvu114-View-FlexBox-FlexColumn"
style={ style={
Object { Object {
"width": undefined, "width": undefined,
@@ -10,7 +10,7 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
} }
> >
<div <div
className="css-t9ud5p-View-FlexBox-FlexColumn" className="css-1tg2qwm-View-FlexBox-FlexColumn"
> >
<div <div
className="css-hs91vy-LoadingIndicator eq9prj20" className="css-hs91vy-LoadingIndicator eq9prj20"
@@ -24,13 +24,13 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
</span> </span>
</div> </div>
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}
@@ -38,7 +38,7 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
Cancel Cancel
</div> </div>
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}
@@ -52,7 +52,7 @@ exports[`ShareSheetPendingDialog is rendered with status update 1`] = `
exports[`ShareSheetPendingDialog is rendered without status update 1`] = ` exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
<div <div
className="css-75dkqw-View-FlexBox-FlexColumn" className="css-1lvu114-View-FlexBox-FlexColumn"
style={ style={
Object { Object {
"width": undefined, "width": undefined,
@@ -60,7 +60,7 @@ exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
} }
> >
<div <div
className="css-t9ud5p-View-FlexBox-FlexColumn" className="css-1tg2qwm-View-FlexBox-FlexColumn"
> >
<div <div
className="css-hs91vy-LoadingIndicator eq9prj20" className="css-hs91vy-LoadingIndicator eq9prj20"
@@ -74,13 +74,13 @@ exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
</span> </span>
</div> </div>
<div <div
className="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" className="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
className="css-te359u-View-FlexBox-Spacer e13mj6h82" className="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}
@@ -88,7 +88,7 @@ exports[`ShareSheetPendingDialog is rendered without status update 1`] = `
Cancel Cancel
</div> </div>
<div <div
className="css-xing9h-StyledButton enfqd40" className="css-xing9h-StyledButton enfqd41"
onClick={[Function]} onClick={[Function]}
onMouseDown={[Function]} onMouseDown={[Function]}
onMouseUp={[Function]} onMouseUp={[Function]}

4
desktop/app/src/chrome/mainsidebar/sidebarUtils.tsx
View File

@@ -20,7 +20,7 @@ import {
Spacer, Spacer,
Heading, Heading,
} from '../../ui'; } from '../../ui';
import {BackgroundColorProperty} from 'csstype'; import {Property} from 'csstype';
import {getPluginTitle} from '../../utils/pluginUtils'; import {getPluginTitle} from '../../utils/pluginUtils';
import {PluginDefinition} from '../../plugin'; import {PluginDefinition} from '../../plugin';
import {StaticView} from '../../reducers/connections'; import {StaticView} from '../../reducers/connections';
@@ -70,7 +70,7 @@ export function PluginIcon({
} }
const PluginShape = styled(FlexBox)<{ const PluginShape = styled(FlexBox)<{
backgroundColor?: BackgroundColorProperty; backgroundColor?: Property.BackgroundColor;
}>(({backgroundColor}) => ({ }>(({backgroundColor}) => ({
marginRight: 8, marginRight: 8,
backgroundColor, backgroundColor,

200
desktop/app/src/chrome/plugin-manager/__tests__/__snapshots__/PluginInstaller.node.tsx.snap
View File

@@ -3,16 +3,16 @@
exports[`load PluginInstaller list 1`] = ` exports[`load PluginInstaller list 1`] = `
<div> <div>
<div <div
class="css-13jp8bd-View-FlexBox-FlexColumn" class="css-9dawc5-View-FlexBox-FlexColumn"
> >
<div <div
class="css-1qqef1i-View-FlexBox-FlexRow-ToolbarContainer e13mj6h80" class="css-cjspgc-View-FlexBox-FlexRow-ToolbarContainer e13mj6h82"
> >
<div <div
class="css-bl14sl-View-FlexBox-SearchBox e271nro1" class="css-bl14sl-View-FlexBox-SearchBox e271nro4"
> >
<input <input
class="css-184o3nx-Input-SearchInput e271nro2" class="css-184o3nx-Input-SearchInput e271nro3"
placeholder="Search Flipper plugins..." placeholder="Search Flipper plugins..."
type="text" type="text"
value="" value=""
@@ -20,73 +20,73 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1s2tz3g-View-FlexBox-FlexColumn-Container e11hk09w0" class="css-1n5hbjk-View-FlexBox-FlexColumn-Container e11hk09w0"
> >
<div <div
class="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" class="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
class="css-guwxm6-View-FlexBox-FlexRow-TableHeadContainer ejga3103" class="css-nzypyq-View-FlexBox-FlexRow-TableHeadContainer ejga3101"
> >
<div <div
class="css-zk363n-TableHeadColumnContainer ejga3104" class="css-zk363n-TableHeadColumnContainer ejga3100"
title="name" title="name"
width="25%" width="25%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Name Name
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-1243222-TableHeadColumnContainer ejga3104" class="css-1243222-TableHeadColumnContainer ejga3100"
title="version" title="version"
width="10%" width="10%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Version Version
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-nyra6d-TableHeadColumnContainer ejga3104" class="css-nyra6d-TableHeadColumnContainer ejga3100"
title="description" title="description"
width="flex" width="flex"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Description Description
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-hyjqmu-TableHeadColumnContainer ejga3104" class="css-hyjqmu-TableHeadColumnContainer ejga3100"
title="install" title="install"
width="15%" width="15%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
</div> </div>
@@ -95,14 +95,14 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1s2tz3g-View-FlexBox-FlexColumn-Container e11hk09w0" class="css-1n5hbjk-View-FlexBox-FlexColumn-Container e11hk09w0"
> >
<div <div
class="css-1gi2nc1-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum0" class="css-1xll39b-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum1"
data-key="flipper-plugin-hello" data-key="flipper-plugin-hello"
> >
<div <div
class="css-hdg6vt-TableBodyColumnContainer ehuguum1" class="css-hdg6vt-TableBodyColumnContainer ehuguum0"
title="" title=""
width="25%" width="25%"
> >
@@ -113,7 +113,7 @@ exports[`load PluginInstaller list 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1rdsust-TableBodyColumnContainer ehuguum1" class="css-1rdsust-TableBodyColumnContainer ehuguum0"
title="" title=""
width="10%" width="10%"
> >
@@ -124,12 +124,12 @@ exports[`load PluginInstaller list 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1bw2bjn-TableBodyColumnContainer ehuguum1" class="css-1bw2bjn-TableBodyColumnContainer ehuguum0"
title="" title=""
width="flex" width="flex"
> >
<div <div
class="css-wxxfdj-View-FlexBox-FlexRow epz0qe20" class="css-4yiclo-View-FlexBox-FlexRow epz0qe20"
> >
<span <span
class="css-fyize4-Text" class="css-fyize4-Text"
@@ -137,13 +137,13 @@ exports[`load PluginInstaller list 1`] = `
World? World?
</span> </span>
<div <div
class="css-te359u-View-FlexBox-Spacer e13mj6h82" class="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<span <span
class="css-ad6n9d-StyledLink e1mzoj7l0" class="css-ad6n9d-StyledLink e1mzoj7l0"
> >
<div <div
class="css-1tfjvvq-ColoredIconCustom e528dze1" class="css-1tfjvvq-ColoredIconCustom e528dze0"
color="#bec2c9" color="#bec2c9"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -152,12 +152,12 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-4dx1ef-TableBodyColumnContainer ehuguum1" class="css-4dx1ef-TableBodyColumnContainer ehuguum0"
title="" title=""
width="15%" width="15%"
> >
<div <div
class="css-1pccuw6-StyledButton enfqd40" class="css-iby3qx-StyledButton enfqd41"
type="primary" type="primary"
> >
Install Install
@@ -165,11 +165,11 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-14d4692-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum0" class="css-1k1evb9-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum1"
data-key="flipper-plugin-world" data-key="flipper-plugin-world"
> >
<div <div
class="css-hdg6vt-TableBodyColumnContainer ehuguum1" class="css-hdg6vt-TableBodyColumnContainer ehuguum0"
title="" title=""
width="25%" width="25%"
> >
@@ -180,7 +180,7 @@ exports[`load PluginInstaller list 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1rdsust-TableBodyColumnContainer ehuguum1" class="css-1rdsust-TableBodyColumnContainer ehuguum0"
title="" title=""
width="10%" width="10%"
> >
@@ -191,12 +191,12 @@ exports[`load PluginInstaller list 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1bw2bjn-TableBodyColumnContainer ehuguum1" class="css-1bw2bjn-TableBodyColumnContainer ehuguum0"
title="" title=""
width="flex" width="flex"
> >
<div <div
class="css-wxxfdj-View-FlexBox-FlexRow epz0qe20" class="css-4yiclo-View-FlexBox-FlexRow epz0qe20"
> >
<span <span
class="css-fyize4-Text" class="css-fyize4-Text"
@@ -204,13 +204,13 @@ exports[`load PluginInstaller list 1`] = `
Hello? Hello?
</span> </span>
<div <div
class="css-te359u-View-FlexBox-Spacer e13mj6h82" class="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<span <span
class="css-ad6n9d-StyledLink e1mzoj7l0" class="css-ad6n9d-StyledLink e1mzoj7l0"
> >
<div <div
class="css-1tfjvvq-ColoredIconCustom e528dze1" class="css-1tfjvvq-ColoredIconCustom e528dze0"
color="#bec2c9" color="#bec2c9"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -219,12 +219,12 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-4dx1ef-TableBodyColumnContainer ehuguum1" class="css-4dx1ef-TableBodyColumnContainer ehuguum0"
title="" title=""
width="15%" width="15%"
> >
<div <div
class="css-1pccuw6-StyledButton enfqd40" class="css-iby3qx-StyledButton enfqd41"
type="primary" type="primary"
> >
Install Install
@@ -235,36 +235,36 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1qqef1i-View-FlexBox-FlexRow-ToolbarContainer e13mj6h80" class="css-cjspgc-View-FlexBox-FlexRow-ToolbarContainer e13mj6h82"
> >
<div <div
class="css-1stmykz-View-FlexBox-FlexRow-Container ersmi541" class="css-1spj5hr-View-FlexBox-FlexRow-Container ersmi542"
> >
<input <input
class="css-phqpi-Input-FileInputBox ersmi543" class="css-phqpi-Input-FileInputBox ersmi540"
placeholder="Specify path to a Flipper package or just drag and drop it here..." placeholder="Specify path to a Flipper package or just drag and drop it here..."
type="text" type="text"
value="" value=""
/> />
<div <div
class="css-1juns87-View-FlexBox-FlexRow-GlyphContainer ersmi542" class="css-ccdckn-View-FlexBox-FlexRow-GlyphContainer ersmi541"
> >
<img <img
alt="dots-3-circle" alt="dots-3-circle"
class="ersmi540 css-6iptsk-ColoredIconBlack-CenteredGlyph e528dze0" class="ersmi543 css-6iptsk-ColoredIconBlack-CenteredGlyph e528dze1"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=dots-3-circle&variant=outline&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=dots-3-circle&variant=outline&size=16&set=facebook_icons&density=1x"
title="Open file selection dialog" title="Open file selection dialog"
/> />
</div> </div>
<div <div
class="css-1juns87-View-FlexBox-FlexRow-GlyphContainer ersmi542" class="css-ccdckn-View-FlexBox-FlexRow-GlyphContainer ersmi541"
> >
<div <div
class="css-yzqaun-TooltipContainer e1abcqbd0" class="css-auhar3-TooltipContainer e1abcqbd0"
> >
<div <div
class="ersmi540 css-1vos16e-ColoredIconCustom-CenteredGlyph e528dze1" class="ersmi543 css-1vos16e-ColoredIconCustom-CenteredGlyph e528dze0"
color="#D79651" color="#D79651"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=caution-triangle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=caution-triangle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -273,13 +273,13 @@ exports[`load PluginInstaller list 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-16kzr4q-View-FlexBox-FlexRow-ButtonContainer evd5j492" class="css-5ukfaz-View-FlexBox-FlexRow-ButtonContainer evd5j491"
> >
<div <div
class="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" class="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
class="css-1rxpsn8-StyledButton enfqd40" class="css-1rxpsn8-StyledButton enfqd41"
disabled="" disabled=""
title="Cannot install plugin package by the specified path" title="Cannot install plugin package by the specified path"
type="primary" type="primary"
@@ -287,7 +287,7 @@ exports[`load PluginInstaller list 1`] = `
Install Install
</div> </div>
<div <div
class="css-ywl8lj-View-FlexBox-FlexRow-ErrorGlyphContainer evd5j493" class="css-170i4ha-View-FlexBox-FlexRow-ErrorGlyphContainer evd5j490"
/> />
</div> </div>
</div> </div>
@@ -298,16 +298,16 @@ exports[`load PluginInstaller list 1`] = `
exports[`load PluginInstaller list with one plugin installed 1`] = ` exports[`load PluginInstaller list with one plugin installed 1`] = `
<div> <div>
<div <div
class="css-13jp8bd-View-FlexBox-FlexColumn" class="css-9dawc5-View-FlexBox-FlexColumn"
> >
<div <div
class="css-1qqef1i-View-FlexBox-FlexRow-ToolbarContainer e13mj6h80" class="css-cjspgc-View-FlexBox-FlexRow-ToolbarContainer e13mj6h82"
> >
<div <div
class="css-bl14sl-View-FlexBox-SearchBox e271nro1" class="css-bl14sl-View-FlexBox-SearchBox e271nro4"
> >
<input <input
class="css-184o3nx-Input-SearchInput e271nro2" class="css-184o3nx-Input-SearchInput e271nro3"
placeholder="Search Flipper plugins..." placeholder="Search Flipper plugins..."
type="text" type="text"
value="" value=""
@@ -315,73 +315,73 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1s2tz3g-View-FlexBox-FlexColumn-Container e11hk09w0" class="css-1n5hbjk-View-FlexBox-FlexColumn-Container e11hk09w0"
> >
<div <div
class="css-k28k5g-View-FlexBox-FlexColumn ecr18to0" class="css-18abd42-View-FlexBox-FlexColumn ecr18to0"
> >
<div <div
class="css-guwxm6-View-FlexBox-FlexRow-TableHeadContainer ejga3103" class="css-nzypyq-View-FlexBox-FlexRow-TableHeadContainer ejga3101"
> >
<div <div
class="css-zk363n-TableHeadColumnContainer ejga3104" class="css-zk363n-TableHeadColumnContainer ejga3100"
title="name" title="name"
width="25%" width="25%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Name Name
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-1243222-TableHeadColumnContainer ejga3104" class="css-1243222-TableHeadColumnContainer ejga3100"
title="version" title="version"
width="10%" width="10%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Version Version
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-nyra6d-TableHeadColumnContainer ejga3104" class="css-nyra6d-TableHeadColumnContainer ejga3100"
title="description" title="description"
width="flex" width="flex"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
Description Description
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-hyjqmu-TableHeadColumnContainer ejga3104" class="css-hyjqmu-TableHeadColumnContainer ejga3100"
title="install" title="install"
width="15%" width="15%"
> >
<div <div
class="ejga3101 css-1859yug-InteractiveContainer-TableHeaderColumnInteractive etmd34w0" class="ejga3103 css-x4q70f-InteractiveContainer-TableHeaderColumnInteractive etmd34w0"
style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;" style="z-index: auto; right: 0px; bottom: 0px; width: 100%; height: 100%;"
> >
<div <div
class="css-1yopr4n-TableHeaderColumnContainer ejga3102" class="css-1054ash-TableHeaderColumnContainer ejga3102"
> >
</div> </div>
@@ -390,14 +390,14 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1s2tz3g-View-FlexBox-FlexColumn-Container e11hk09w0" class="css-1n5hbjk-View-FlexBox-FlexColumn-Container e11hk09w0"
> >
<div <div
class="css-1gi2nc1-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum0" class="css-1xll39b-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum1"
data-key="flipper-plugin-hello" data-key="flipper-plugin-hello"
> >
<div <div
class="css-hdg6vt-TableBodyColumnContainer ehuguum1" class="css-hdg6vt-TableBodyColumnContainer ehuguum0"
title="" title=""
width="25%" width="25%"
> >
@@ -408,7 +408,7 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1rdsust-TableBodyColumnContainer ehuguum1" class="css-1rdsust-TableBodyColumnContainer ehuguum0"
title="" title=""
width="10%" width="10%"
> >
@@ -419,12 +419,12 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1bw2bjn-TableBodyColumnContainer ehuguum1" class="css-1bw2bjn-TableBodyColumnContainer ehuguum0"
title="" title=""
width="flex" width="flex"
> >
<div <div
class="css-wxxfdj-View-FlexBox-FlexRow epz0qe20" class="css-4yiclo-View-FlexBox-FlexRow epz0qe20"
> >
<span <span
class="css-fyize4-Text" class="css-fyize4-Text"
@@ -432,13 +432,13 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
World? World?
</span> </span>
<div <div
class="css-te359u-View-FlexBox-Spacer e13mj6h82" class="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<span <span
class="css-ad6n9d-StyledLink e1mzoj7l0" class="css-ad6n9d-StyledLink e1mzoj7l0"
> >
<div <div
class="css-1tfjvvq-ColoredIconCustom e528dze1" class="css-1tfjvvq-ColoredIconCustom e528dze0"
color="#bec2c9" color="#bec2c9"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -447,23 +447,23 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-4dx1ef-TableBodyColumnContainer ehuguum1" class="css-4dx1ef-TableBodyColumnContainer ehuguum0"
title="" title=""
width="15%" width="15%"
> >
<div <div
class="css-1pccuw6-StyledButton enfqd40" class="css-iby3qx-StyledButton enfqd41"
> >
Remove Remove
</div> </div>
</div> </div>
</div> </div>
<div <div
class="css-14d4692-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum0" class="css-1k1evb9-View-FlexBox-FlexRow-TableBodyRowContainer ehuguum1"
data-key="flipper-plugin-world" data-key="flipper-plugin-world"
> >
<div <div
class="css-hdg6vt-TableBodyColumnContainer ehuguum1" class="css-hdg6vt-TableBodyColumnContainer ehuguum0"
title="" title=""
width="25%" width="25%"
> >
@@ -474,7 +474,7 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1rdsust-TableBodyColumnContainer ehuguum1" class="css-1rdsust-TableBodyColumnContainer ehuguum0"
title="" title=""
width="10%" width="10%"
> >
@@ -485,12 +485,12 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</span> </span>
</div> </div>
<div <div
class="css-1bw2bjn-TableBodyColumnContainer ehuguum1" class="css-1bw2bjn-TableBodyColumnContainer ehuguum0"
title="" title=""
width="flex" width="flex"
> >
<div <div
class="css-wxxfdj-View-FlexBox-FlexRow epz0qe20" class="css-4yiclo-View-FlexBox-FlexRow epz0qe20"
> >
<span <span
class="css-fyize4-Text" class="css-fyize4-Text"
@@ -498,13 +498,13 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
Hello? Hello?
</span> </span>
<div <div
class="css-te359u-View-FlexBox-Spacer e13mj6h82" class="css-t4wmtk-View-FlexBox-Spacer e13mj6h80"
/> />
<span <span
class="css-ad6n9d-StyledLink e1mzoj7l0" class="css-ad6n9d-StyledLink e1mzoj7l0"
> >
<div <div
class="css-1tfjvvq-ColoredIconCustom e528dze1" class="css-1tfjvvq-ColoredIconCustom e528dze0"
color="#bec2c9" color="#bec2c9"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=info-circle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -513,12 +513,12 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-4dx1ef-TableBodyColumnContainer ehuguum1" class="css-4dx1ef-TableBodyColumnContainer ehuguum0"
title="" title=""
width="15%" width="15%"
> >
<div <div
class="css-1pccuw6-StyledButton enfqd40" class="css-iby3qx-StyledButton enfqd41"
type="primary" type="primary"
> >
Install Install
@@ -529,36 +529,36 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-1qqef1i-View-FlexBox-FlexRow-ToolbarContainer e13mj6h80" class="css-cjspgc-View-FlexBox-FlexRow-ToolbarContainer e13mj6h82"
> >
<div <div
class="css-1stmykz-View-FlexBox-FlexRow-Container ersmi541" class="css-1spj5hr-View-FlexBox-FlexRow-Container ersmi542"
> >
<input <input
class="css-phqpi-Input-FileInputBox ersmi543" class="css-phqpi-Input-FileInputBox ersmi540"
placeholder="Specify path to a Flipper package or just drag and drop it here..." placeholder="Specify path to a Flipper package or just drag and drop it here..."
type="text" type="text"
value="" value=""
/> />
<div <div
class="css-1juns87-View-FlexBox-FlexRow-GlyphContainer ersmi542" class="css-ccdckn-View-FlexBox-FlexRow-GlyphContainer ersmi541"
> >
<img <img
alt="dots-3-circle" alt="dots-3-circle"
class="ersmi540 css-6iptsk-ColoredIconBlack-CenteredGlyph e528dze0" class="ersmi543 css-6iptsk-ColoredIconBlack-CenteredGlyph e528dze1"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=dots-3-circle&variant=outline&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=dots-3-circle&variant=outline&size=16&set=facebook_icons&density=1x"
title="Open file selection dialog" title="Open file selection dialog"
/> />
</div> </div>
<div <div
class="css-1juns87-View-FlexBox-FlexRow-GlyphContainer ersmi542" class="css-ccdckn-View-FlexBox-FlexRow-GlyphContainer ersmi541"
> >
<div <div
class="css-yzqaun-TooltipContainer e1abcqbd0" class="css-auhar3-TooltipContainer e1abcqbd0"
> >
<div <div
class="ersmi540 css-1vos16e-ColoredIconCustom-CenteredGlyph e528dze1" class="ersmi543 css-1vos16e-ColoredIconCustom-CenteredGlyph e528dze0"
color="#D79651" color="#D79651"
size="16" size="16"
src="https://external.xx.fbcdn.net/assets/?name=caution-triangle&variant=filled&size=16&set=facebook_icons&density=1x" src="https://external.xx.fbcdn.net/assets/?name=caution-triangle&variant=filled&size=16&set=facebook_icons&density=1x"
@@ -567,13 +567,13 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
</div> </div>
</div> </div>
<div <div
class="css-16kzr4q-View-FlexBox-FlexRow-ButtonContainer evd5j492" class="css-5ukfaz-View-FlexBox-FlexRow-ButtonContainer evd5j491"
> >
<div <div
class="css-17wo7w2-View-FlexBox-FlexRow epz0qe20" class="css-wospjg-View-FlexBox-FlexRow epz0qe20"
> >
<div <div
class="css-1rxpsn8-StyledButton enfqd40" class="css-1rxpsn8-StyledButton enfqd41"
disabled="" disabled=""
title="Cannot install plugin package by the specified path" title="Cannot install plugin package by the specified path"
type="primary" type="primary"
@@ -581,7 +581,7 @@ exports[`load PluginInstaller list with one plugin installed 1`] = `
Install Install
</div> </div>
<div <div
class="css-ywl8lj-View-FlexBox-FlexRow-ErrorGlyphContainer evd5j493" class="css-170i4ha-View-FlexBox-FlexRow-ErrorGlyphContainer evd5j490"
/> />
</div> </div>
</div> </div>

2
desktop/app/src/index.tsx
View File

@@ -8,7 +8,7 @@
*/ */
export {default as styled} from '@emotion/styled'; export {default as styled} from '@emotion/styled';
export {keyframes} from 'emotion'; export {keyframes} from '@emotion/css';
export {produce} from 'immer'; export {produce} from 'immer';
export * from './ui/index'; export * from './ui/index';

4
desktop/app/src/init.tsx
View File

@@ -26,8 +26,8 @@ import React from 'react';
import path from 'path'; import path from 'path';
import {store} from './store'; import {store} from './store';
import {registerRecordingHooks} from './utils/pluginStateRecorder'; import {registerRecordingHooks} from './utils/pluginStateRecorder';
import {cache} from 'emotion'; import {cache} from '@emotion/css';
import {CacheProvider} from '@emotion/core'; import {CacheProvider} from '@emotion/react';
import {enableMapSet} from 'immer'; import {enableMapSet} from 'immer';
import os from 'os'; import os from 'os';
import {PopoverProvider} from './ui/components/PopoverProvider'; import {PopoverProvider} from './ui/components/PopoverProvider';

2
desktop/app/src/sandy-chrome/SandyDesignSystem.tsx
View File

@@ -11,7 +11,7 @@ import React from 'react';
import {Typography, Button, Space, Input, Card, Alert, List} from 'antd'; import {Typography, Button, Space, Input, Card, Alert, List} from 'antd';
import {Layout} from '../ui'; import {Layout} from '../ui';
import {theme} from 'flipper-plugin'; import {theme} from 'flipper-plugin';
import {css} from 'emotion'; import {css} from '@emotion/css';
import {DesignComponentDemos} from './DesignComponentDemos'; import {DesignComponentDemos} from './DesignComponentDemos';
const {Title, Text, Link} = Typography; const {Title, Text, Link} = Typography;

2
desktop/app/src/ui/components/Button.tsx
View File

@@ -11,7 +11,7 @@ import React, {useContext, useState, useRef, useCallback, useMemo} from 'react';
import electron, {MenuItemConstructorOptions} from 'electron'; import electron, {MenuItemConstructorOptions} from 'electron';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {findDOMNode} from 'react-dom'; import {findDOMNode} from 'react-dom';
import {keyframes} from 'emotion'; import {keyframes} from '@emotion/css';
import {Button as AntdButton, Dropdown, Menu} from 'antd'; import {Button as AntdButton, Dropdown, Menu} from 'antd';
import {colors} from './colors'; import {colors} from './colors';

2
desktop/app/src/ui/components/Interactive.tsx
View File

@@ -43,7 +43,7 @@ const ALL_RESIZABLE: ResizingSides = {
top: true, top: true,
}; };
type InteractiveProps = { export type InteractiveProps = {
isMovableAnchor?: (event: React.MouseEvent) => boolean; isMovableAnchor?: (event: React.MouseEvent) => boolean;
onMoveStart?: () => void; onMoveStart?: () => void;
onMoveEnd?: () => void; onMoveEnd?: () => void;

2
desktop/app/src/ui/components/LoadingIndicator.tsx
View File

@@ -8,7 +8,7 @@
*/ */
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {keyframes} from 'emotion'; import {keyframes} from '@emotion/css';
const animation = keyframes({ const animation = keyframes({
'0%': { '0%': {

4
desktop/app/src/ui/components/Scrollable.tsx
View File

@@ -9,9 +9,9 @@
import React from 'react'; import React from 'react';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {BackgroundProperty} from 'csstype'; import {Property} from 'csstype';
type Props = {children: React.ReactNode; background?: BackgroundProperty<any>}; type Props = {children: React.ReactNode; background?: Property.Background<any>};
const Scrollable = styled.div<Props>(({background}) => ({ const Scrollable = styled.div<Props>(({background}) => ({
width: '100%', width: '100%',

19
desktop/app/src/ui/components/Sidebar.tsx
View File

@@ -7,23 +7,18 @@
* @format * @format
*/ */
import Interactive from './Interactive'; import Interactive, {InteractiveProps} from './Interactive';
import FlexColumn from './FlexColumn'; import FlexColumn from './FlexColumn';
import {colors} from './colors'; import {colors} from './colors';
import {Component, ReactNode} from 'react'; import {Component, ReactNode} from 'react';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import { import {Property} from 'csstype';
BackgroundClipProperty,
HeightProperty,
WidthProperty,
BackgroundColorProperty,
} from 'csstype';
import React from 'react'; import React from 'react';
import FlexRow from './FlexRow'; import FlexRow from './FlexRow';
import {MoreOutlined} from '@ant-design/icons'; import {MoreOutlined} from '@ant-design/icons';
import {theme} from 'flipper-plugin'; import {theme} from 'flipper-plugin';
const SidebarInteractiveContainer = styled(Interactive)({ const SidebarInteractiveContainer = styled(Interactive)<InteractiveProps>({
flex: 'none', flex: 'none',
}); });
SidebarInteractiveContainer.displayName = 'Sidebar:SidebarInteractiveContainer'; SidebarInteractiveContainer.displayName = 'Sidebar:SidebarInteractiveContainer';
@@ -32,7 +27,7 @@ type SidebarPosition = 'left' | 'top' | 'right' | 'bottom';
const SidebarContainer = styled(FlexColumn)<{ const SidebarContainer = styled(FlexColumn)<{
position: 'right' | 'top' | 'left' | 'bottom'; position: 'right' | 'top' | 'left' | 'bottom';
backgroundColor?: BackgroundClipProperty; backgroundColor?: Property.BackgroundClip;
overflow?: boolean; overflow?: boolean;
unstyled?: boolean; unstyled?: boolean;
}>((props) => ({ }>((props) => ({
@@ -89,7 +84,7 @@ type SidebarProps = {
/** /**
* Background color. * Background color.
*/ */
backgroundColor?: BackgroundColorProperty; backgroundColor?: Property.BackgroundColor;
/** /**
* Callback when the sidebar size ahs changed. * Callback when the sidebar size ahs changed.
*/ */
@@ -109,8 +104,8 @@ type SidebarProps = {
}; };
type SidebarState = { type SidebarState = {
width?: WidthProperty<number>; width?: Property.Width<number>;
height?: HeightProperty<number>; height?: Property.Height<number>;
userChange: boolean; userChange: boolean;
}; };

4
desktop/app/src/ui/components/StackTrace.tsx
View File

@@ -15,7 +15,7 @@ import FlexRow from './FlexRow';
import Glyph from './Glyph'; import Glyph from './Glyph';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import React from 'react'; import React from 'react';
import {BackgroundColorProperty} from 'csstype'; import {Property} from 'csstype';
import { import {
TableBodyRow, TableBodyRow,
TableColumnSizes, TableColumnSizes,
@@ -25,7 +25,7 @@ import {
const Padder = styled.div<{ const Padder = styled.div<{
padded?: boolean; padded?: boolean;
backgroundColor?: BackgroundColorProperty; backgroundColor?: Property.BackgroundColor;
}>(({padded, backgroundColor}) => ({ }>(({padded, backgroundColor}) => ({
padding: padded ? 10 : 0, padding: padded ? 10 : 0,
backgroundColor, backgroundColor,

6
desktop/app/src/ui/components/StatusIndicator.tsx
View File

@@ -10,11 +10,11 @@
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {colors} from './colors'; import {colors} from './colors';
import {BackgroundColorProperty, HeightProperty} from 'csstype'; import {Property} from 'csstype';
type Props = { type Props = {
statusColor: BackgroundColorProperty; statusColor: Property.BackgroundColor;
diameter?: HeightProperty<number>; diameter?: Property.Height<number>;
title?: string; title?: string;
}; };

4
desktop/app/src/ui/components/Tab.tsx
View File

@@ -7,7 +7,7 @@
* @format * @format
*/ */
import {WidthProperty} from 'csstype'; import {Property} from 'csstype';
export type Props = { export type Props = {
/** /**
@@ -37,7 +37,7 @@ export type Props = {
* Contents of this tab. * Contents of this tab.
*/ */
children?: React.ReactNode; children?: React.ReactNode;
width?: WidthProperty<number>; width?: Property.Width<number>;
}; };
export default function Tab(_props: Props): JSX.Element { export default function Tab(_props: Props): JSX.Element {

4
desktop/app/src/ui/components/Tabs.tsx
View File

@@ -13,7 +13,7 @@ import Orderable from './Orderable';
import FlexRow from './FlexRow'; import FlexRow from './FlexRow';
import {colors} from './colors'; import {colors} from './colors';
import Tab, {Props as TabProps} from './Tab'; import Tab, {Props as TabProps} from './Tab';
import {WidthProperty} from 'csstype'; import {Property} from 'csstype';
import React, {useContext} from 'react'; import React, {useContext} from 'react';
import {TabsContext} from './TabsContainer'; import {TabsContext} from './TabsContainer';
@@ -25,7 +25,7 @@ TabList.displayName = 'Tabs:TabList';
const TabListItem = styled.div<{ const TabListItem = styled.div<{
active?: boolean; active?: boolean;
width?: WidthProperty<number>; width?: Property.Width<number>;
container?: boolean; container?: boolean;
}>((props) => ({ }>((props) => ({
userSelect: 'none', userSelect: 'none',

24
desktop/app/src/ui/components/Text.tsx
View File

@@ -8,32 +8,24 @@
*/ */
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import { import {Property} from 'csstype';
ColorProperty,
FontSizeProperty,
TextAlignProperty,
FontFamilyProperty,
WhiteSpaceProperty,
WordWrapProperty,
CursorProperty,
} from 'csstype';
/** /**
* A Text component. * A Text component.
*/ */
const Text = styled.span<{ const Text = styled.span<{
color?: ColorProperty; color?: Property.Color;
bold?: boolean; bold?: boolean;
italic?: boolean; italic?: boolean;
underline?: boolean; underline?: boolean;
align?: TextAlignProperty; align?: Property.TextAlign;
size?: FontSizeProperty<number>; size?: Property.FontSize<number>;
code?: boolean; code?: boolean;
family?: FontFamilyProperty; family?: Property.FontFamily;
selectable?: boolean; selectable?: boolean;
wordWrap?: WordWrapProperty; wordWrap?: Property.WordWrap;
whiteSpace?: WhiteSpaceProperty; whiteSpace?: Property.WhiteSpace;
cursor?: CursorProperty; cursor?: Property.Cursor;
}>((props) => ({ }>((props) => ({
color: props.color ? props.color : 'inherit', color: props.color ? props.color : 'inherit',
cursor: props.cursor ? props.cursor : 'auto', cursor: props.cursor ? props.cursor : 'auto',

62
desktop/app/src/ui/components/TooltipProvider.tsx
View File

@@ -10,19 +10,7 @@
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {colors} from './colors'; import {colors} from './colors';
import {memo, createContext, useMemo, useState, useRef} from 'react'; import {memo, createContext, useMemo, useState, useRef} from 'react';
import { import {Property} from 'csstype';
TopProperty,
LeftProperty,
BottomProperty,
RightProperty,
BackgroundColorProperty,
LineHeightProperty,
PaddingProperty,
BorderRadiusProperty,
MaxWidthProperty,
ColorProperty,
WidthProperty,
} from 'csstype';
import React from 'react'; import React from 'react';
const defaultOptions = { const defaultOptions = {
@@ -52,18 +40,18 @@ export type TooltipOptions = {
}; };
const TooltipBubble = styled.div<{ const TooltipBubble = styled.div<{
top: TopProperty<number>; top: Property.Top<number>;
left: LeftProperty<number>; left: Property.Left<number>;
bottom: BottomProperty<number>; bottom: Property.Bottom<number>;
right: RightProperty<number>; right: Property.Right<number>;
options: { options: {
backgroundColor: BackgroundColorProperty; backgroundColor: Property.BackgroundColor;
lineHeight: LineHeightProperty<number>; lineHeight: Property.LineHeight<number>;
padding: PaddingProperty<number>; padding: Property.Padding<number>;
borderRadius: BorderRadiusProperty<number>; borderRadius: Property.BorderRadius<number>;
width: WidthProperty<number>; width: Property.Width<number>;
maxWidth: MaxWidthProperty<number>; maxWidth: Property.MaxWidth<number>;
color: ColorProperty; color: Property.Color;
}; };
}>((props) => ({ }>((props) => ({
position: 'absolute', position: 'absolute',
@@ -96,12 +84,12 @@ const TAIL_LR_POSITION_HORIZONTAL_OFFSET = 5;
const TAIL_LR_POSITION_VERTICAL_OFFSET = 12; const TAIL_LR_POSITION_VERTICAL_OFFSET = 12;
const TooltipTail = styled.div<{ const TooltipTail = styled.div<{
top: TopProperty<number>; top: Property.Top<number>;
left: LeftProperty<number>; left: Property.Left<number>;
bottom: BottomProperty<number>; bottom: Property.Bottom<number>;
right: RightProperty<number>; right: Property.Right<number>;
options: { options: {
backgroundColor: BackgroundColorProperty; backgroundColor: Property.BackgroundColor;
}; };
}>((props) => ({ }>((props) => ({
position: 'absolute', position: 'absolute',
@@ -209,10 +197,10 @@ function getTooltipTail(tooltip: TooltipObject) {
return null; return null;
} }
let left: LeftProperty<number> = 'auto'; let left: Property.Left<number> = 'auto';
let top: TopProperty<number> = 'auto'; let top: Property.Top<number> = 'auto';
let bottom: BottomProperty<number> = 'auto'; let bottom: Property.Bottom<number> = 'auto';
let right: RightProperty<number> = 'auto'; let right: Property.Right<number> = 'auto';
if (opts.position === 'below') { if (opts.position === 'below') {
left = tooltip.rect.left + TAIL_AB_POSITION_HORIZONTAL_OFFSET; left = tooltip.rect.left + TAIL_AB_POSITION_HORIZONTAL_OFFSET;
@@ -245,10 +233,10 @@ function getTooltipTail(tooltip: TooltipObject) {
function getTooltipBubble(tooltip: TooltipObject) { function getTooltipBubble(tooltip: TooltipObject) {
const opts = Object.assign(defaultOptions, tooltip.options); const opts = Object.assign(defaultOptions, tooltip.options);
let left: LeftProperty<number> = 'auto'; let left: Property.Left<number> = 'auto';
let top: TopProperty<number> = 'auto'; let top: Property.Top<number> = 'auto';
let bottom: BottomProperty<number> = 'auto'; let bottom: Property.Bottom<number> = 'auto';
let right: RightProperty<number> = 'auto'; let right: Property.Right<number> = 'auto';
if (opts.position === 'below') { if (opts.position === 'below') {
left = tooltip.rect.left + BUBBLE_BELOW_POSITION_VERTICAL_OFFSET; left = tooltip.rect.left + BUBBLE_BELOW_POSITION_VERTICAL_OFFSET;

6
desktop/app/src/ui/components/VirtualList.tsx
View File

@@ -12,9 +12,9 @@ import {Component} from 'react';
import View from './View'; import View from './View';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import React from 'react'; import React from 'react';
import {HeightProperty, TopProperty} from 'csstype'; import {Property} from 'csstype';
const Inner = styled(FlexColumn)<{height: HeightProperty<number>}>( const Inner = styled(FlexColumn)<{height: Property.Height<number>}>(
({height}) => ({ ({height}) => ({
alignItems: 'flex-start', alignItems: 'flex-start',
height, height,
@@ -26,7 +26,7 @@ const Inner = styled(FlexColumn)<{height: HeightProperty<number>}>(
); );
Inner.displayName = 'VirtualList:Inner'; Inner.displayName = 'VirtualList:Inner';
const Content = styled(FlexColumn)<{top: TopProperty<number>}>(({top}) => ({ const Content = styled(FlexColumn)<{top: Property.Top<number>}>(({top}) => ({
alignItems: 'flex-start', alignItems: 'flex-start',
height: '100%', height: '100%',
marginTop: top, marginTop: top,

4
desktop/app/src/ui/components/searchable/FilterToken.tsx
View File

@@ -14,9 +14,9 @@ import styled from '@emotion/styled';
import {colors} from '../colors'; import {colors} from '../colors';
import electron, {MenuItemConstructorOptions} from 'electron'; import electron, {MenuItemConstructorOptions} from 'electron';
import React from 'react'; import React from 'react';
import {ColorProperty} from 'csstype'; import {Property} from 'csstype';
const Token = styled(Text)<{focused?: boolean; color?: ColorProperty}>( const Token = styled(Text)<{focused?: boolean; color?: Property.Color}>(
(props) => ({ (props) => ({
display: 'inline-flex', display: 'inline-flex',
alignItems: 'center', alignItems: 'center',

4
desktop/app/src/ui/components/table/TableHead.tsx
View File

@@ -18,7 +18,7 @@ import {
import {normaliseColumnWidth, isPercentage} from './utils'; import {normaliseColumnWidth, isPercentage} from './utils';
import {PureComponent} from 'react'; import {PureComponent} from 'react';
import ContextMenu from '../ContextMenu'; import ContextMenu from '../ContextMenu';
import Interactive from '../Interactive'; import Interactive, {InteractiveProps} from '../Interactive';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {colors} from '../colors'; import {colors} from '../colors';
import FlexRow from '../FlexRow'; import FlexRow from '../FlexRow';
@@ -31,7 +31,7 @@ const TableHeaderArrow = styled.span({
}); });
TableHeaderArrow.displayName = 'TableHead:TableHeaderArrow'; TableHeaderArrow.displayName = 'TableHead:TableHeaderArrow';
const TableHeaderColumnInteractive = styled(Interactive)({ const TableHeaderColumnInteractive = styled(Interactive)<InteractiveProps>({
display: 'inline-block', display: 'inline-block',
overflow: 'hidden', overflow: 'hidden',
textOverflow: 'ellipsis', textOverflow: 'ellipsis',

29
desktop/app/src/ui/components/table/TableRow.tsx
View File

@@ -20,12 +20,7 @@ import FlexRow from '../FlexRow';
import {colors} from '../colors'; import {colors} from '../colors';
import {normaliseColumnWidth} from './utils'; import {normaliseColumnWidth} from './utils';
import {DEFAULT_ROW_HEIGHT} from './types'; import {DEFAULT_ROW_HEIGHT} from './types';
import { import {Property} from 'csstype';
FontWeightProperty,
ColorProperty,
JustifyContentProperty,
BackgroundColorProperty,
} from 'csstype';
type TableBodyRowContainerProps = { type TableBodyRowContainerProps = {
even?: boolean; even?: boolean;
@@ -33,12 +28,12 @@ type TableBodyRowContainerProps = {
highlighted?: boolean; highlighted?: boolean;
rowLineHeight?: number; rowLineHeight?: number;
multiline?: boolean; multiline?: boolean;
fontWeight?: FontWeightProperty; fontWeight?: Property.FontWeight;
color?: ColorProperty; color?: Property.Color;
highlightOnHover?: boolean; highlightOnHover?: boolean;
backgroundColor?: BackgroundColorProperty; backgroundColor?: Property.BackgroundColor;
highlightedBackgroundColor?: BackgroundColorProperty; highlightedBackgroundColor?: Property.BackgroundColor;
zebraBackgroundColor?: BackgroundColorProperty; zebraBackgroundColor?: Property.BackgroundColor;
}; };
const backgroundColor = (props: TableBodyRowContainerProps) => { const backgroundColor = (props: TableBodyRowContainerProps) => {
@@ -91,13 +86,8 @@ TableBodyRowContainer.displayName = 'TableRow:TableBodyRowContainer';
const TableBodyColumnContainer = styled.div<{ const TableBodyColumnContainer = styled.div<{
width?: any; width?: any;
multiline?: boolean; multiline?: boolean;
justifyContent: JustifyContentProperty; justifyContent: Property.JustifyContent;
}>( }>((props) => ({
(props: {
width?: any;
multiline?: boolean;
justifyContent: JustifyContentProperty;
}) => ({
display: 'flex', display: 'flex',
flexShrink: props.width === 'flex' ? 1 : 0, flexShrink: props.width === 'flex' ? 1 : 0,
overflow: 'hidden', overflow: 'hidden',
@@ -109,8 +99,7 @@ const TableBodyColumnContainer = styled.div<{
width: props.width === 'flex' ? '100%' : props.width, width: props.width === 'flex' ? '100%' : props.width,
maxWidth: '100%', maxWidth: '100%',
justifyContent: props.justifyContent, justifyContent: props.justifyContent,
}), }));
);
TableBodyColumnContainer.displayName = 'TableRow:TableBodyColumnContainer'; TableBodyColumnContainer.displayName = 'TableRow:TableBodyColumnContainer';
type Props = { type Props = {

6
desktop/app/src/ui/components/table/types.tsx
View File

@@ -9,7 +9,7 @@
import {Filter} from '../filter/types'; import {Filter} from '../filter/types';
import {List} from 'immutable'; import {List} from 'immutable';
import {BackgroundColorProperty} from 'csstype'; import {Property} from 'csstype';
export const MINIMUM_COLUMN_WIDTH = 100; export const MINIMUM_COLUMN_WIDTH = 100;
export const DEFAULT_COLUMN_WIDTH = 200; export const DEFAULT_COLUMN_WIDTH = 200;
@@ -52,8 +52,8 @@ export type TableBodyRow = {
sortKey?: string | number; sortKey?: string | number;
style?: Object; style?: Object;
type?: string | undefined; type?: string | undefined;
highlightedBackgroundColor?: BackgroundColorProperty | undefined; highlightedBackgroundColor?: Property.BackgroundColor | undefined;
zebraBackgroundColor?: BackgroundColorProperty | undefined; zebraBackgroundColor?: Property.BackgroundColor | undefined;
onDoubleClick?: (e: React.MouseEvent) => void; onDoubleClick?: (e: React.MouseEvent) => void;
copyText?: string | (() => string); copyText?: string | (() => string);
getSearchContent?: () => string; getSearchContent?: () => string;

2
desktop/babel-transformer/package.json
View File

@@ -23,9 +23,9 @@
"@babel/preset-react": "^7.10.4", "@babel/preset-react": "^7.10.4",
"@babel/traverse": "^7.11.0", "@babel/traverse": "^7.11.0",
"@babel/types": "^7.11.0", "@babel/types": "^7.11.0",
"@emotion/babel-plugin": "^11.0.0",
"@types/fs-extra": "^9.0.1", "@types/fs-extra": "^9.0.1",
"@types/node": "^14.14.6", "@types/node": "^14.14.6",
"babel-plugin-emotion": "^10.0.33",
"fs-extra": "^9.0.1", "fs-extra": "^9.0.1",
"tslib": "^2" "tslib": "^2"
}, },

6
desktop/babel-transformer/src/transform.ts
View File

@@ -41,7 +41,7 @@ const objectRestSpreadPlugin = require('@babel/plugin-proposal-object-rest-sprea
const flowStripTypesPlugin = require('@babel/plugin-transform-flow-strip-types'); const flowStripTypesPlugin = require('@babel/plugin-transform-flow-strip-types');
const dynamicRequiresPlugin = require('./dynamic-requires'); const dynamicRequiresPlugin = require('./dynamic-requires');
const typeScriptPlugin = require('@babel/plugin-transform-typescript'); const typeScriptPlugin = require('@babel/plugin-transform-typescript');
const emotionPlugin = require('babel-plugin-emotion'); const emotionPlugin = require('@emotion/babel-plugin');
const tsTransformPlugins = [ const tsTransformPlugins = [
typeScriptPlugin, typeScriptPlugin,
classPropertiesPlugin, classPropertiesPlugin,
@@ -51,7 +51,7 @@ const tsTransformPlugins = [
// Sourcemap disabled because // Sourcemap disabled because
// https://github.com/electron/electron/issues/17772#issuecomment-570795784 // https://github.com/electron/electron/issues/17772#issuecomment-570795784
// https://github.com/emotion-js/emotion/issues/1838 // https://github.com/emotion-js/emotion/issues/1838
[emotionPlugin, {autoLabel: true, sourceMap: false}], [emotionPlugin, {autoLabel: 'always', sourceMap: false}],
]; ];
const jsTransformPlugins = [ const jsTransformPlugins = [
commonJsPlugin, commonJsPlugin,
@@ -61,7 +61,7 @@ const jsTransformPlugins = [
optionalChainingPlugin, optionalChainingPlugin,
coalescingOperatorPlugin, coalescingOperatorPlugin,
dynamicRequiresPlugin, dynamicRequiresPlugin,
[emotionPlugin, {autoLabel: true, sourceMap: false}], [emotionPlugin, {autoLabel: 'always', sourceMap: false}],
]; ];
export default function transform({ export default function transform({

3
desktop/flipper-plugin/package.json
View File

@@ -9,6 +9,8 @@
"license": "MIT", "license": "MIT",
"bugs": "https://github.com/facebook/flipper/issues", "bugs": "https://github.com/facebook/flipper/issues",
"dependencies": { "dependencies": {
"@emotion/css": "^11.0.0",
"@emotion/react": "^11.1.1",
"react-element-to-jsx-string": "^14.3.2" "react-element-to-jsx-string": "^14.3.2"
}, },
"devDependencies": { "devDependencies": {
@@ -20,7 +22,6 @@
"@testing-library/dom": "^7.26.3", "@testing-library/dom": "^7.26.3",
"@testing-library/react": "^11.1.0", "@testing-library/react": "^11.1.0",
"antd": "^4.8.0", "antd": "^4.8.0",
"emotion": "^10.0.27",
"immer": "^7.0.5" "immer": "^7.0.5"
}, },
"scripts": { "scripts": {

2
desktop/flipper-plugin/src/ui/NUX.tsx
View File

@@ -10,7 +10,7 @@
import React, {createContext, useCallback, useContext} from 'react'; import React, {createContext, useCallback, useContext} from 'react';
import {Badge, Tooltip, Typography, Button} from 'antd'; import {Badge, Tooltip, Typography, Button} from 'antd';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import {keyframes} from 'emotion'; import {keyframes} from '@emotion/css';
import reactElementToJSXString from 'react-element-to-jsx-string'; import reactElementToJSXString from 'react-element-to-jsx-string';
import {SandyPluginContext} from '../plugin/PluginContext'; import {SandyPluginContext} from '../plugin/PluginContext';
import {createState, useValue} from '../state/atom'; import {createState, useValue} from '../state/atom';

169
desktop/yarn.lock
View File

@@ -372,7 +372,14 @@
dependencies: dependencies:
"@babel/types" "^7.12.1" "@babel/types" "^7.12.1"
"@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.12.1", "@babel/helper-module-imports@^7.8.3": "@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.7.0":
version "7.12.5"
resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.12.5.tgz#1bfc0229f794988f76ed0a4d4e90860850b54dfb"
integrity sha512-SR713Ogqg6++uexFRORf/+nPXMmWIn80TALu0uaFb+iQIUoR7bOC7zBWyzBs5b3tBBJXuyD0cRu1F15GyzjOWA==
dependencies:
"@babel/types" "^7.12.5"
"@babel/helper-module-imports@^7.12.1", "@babel/helper-module-imports@^7.8.3":
version "7.12.1" version "7.12.1"
resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.12.1.tgz#1644c01591a15a2f084dd6d092d9430eb1d1216c" resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.12.1.tgz#1644c01591a15a2f084dd6d092d9430eb1d1216c"
integrity sha512-ZeC1TlMSvikvJNy1v/wPIazCu3NdOwgYZLIkmIyAsGhqkNpiDoQQRmaCK8YP4Pq3GPTLPV9WXaPCJKvx06JxKA== integrity sha512-ZeC1TlMSvikvJNy1v/wPIazCu3NdOwgYZLIkmIyAsGhqkNpiDoQQRmaCK8YP4Pq3GPTLPV9WXaPCJKvx06JxKA==
@@ -1240,6 +1247,15 @@
lodash "^4.17.19" lodash "^4.17.19"
to-fast-properties "^2.0.0" to-fast-properties "^2.0.0"
"@babel/types@^7.12.5":
version "7.12.6"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.12.6.tgz#ae0e55ef1cce1fbc881cd26f8234eb3e657edc96"
integrity sha512-hwyjw6GvjBLiyy3W0YQf0Z5Zf4NpYejUnKFcfcUhZCSffoBBp30w6wP2Wn6pk31jMYZvcOrB/1b7cGXvEoKogA==
dependencies:
"@babel/helper-validator-identifier" "^7.10.4"
lodash "^4.17.19"
to-fast-properties "^2.0.0"
"@base2/pretty-print-object@1.0.0": "@base2/pretty-print-object@1.0.0":
version "1.0.0" version "1.0.0"
resolved "https://registry.yarnpkg.com/@base2/pretty-print-object/-/pretty-print-object-1.0.0.tgz#860ce718b0b73f4009e153541faff2cb6b85d047" resolved "https://registry.yarnpkg.com/@base2/pretty-print-object/-/pretty-print-object-1.0.0.tgz#860ce718b0b73f4009e153541faff2cb6b85d047"
@@ -1282,6 +1298,24 @@
global-agent "^2.0.2" global-agent "^2.0.2"
global-tunnel-ng "^2.7.1" global-tunnel-ng "^2.7.1"
"@emotion/babel-plugin@^11.0.0":
version "11.0.0"
resolved "https://registry.yarnpkg.com/@emotion/babel-plugin/-/babel-plugin-11.0.0.tgz#e6f40fa81ef52775773a53d50220c597ebc5c2ef"
integrity sha512-w3YP0jlqrNwBBaSI6W+r80fOKF6l9QmsPfLNx5YWSHwrxjVZhM+L50gY7YCVAvlfr1/qdD1vsFN+PDZmLvt42Q==
dependencies:
"@babel/helper-module-imports" "^7.7.0"
"@babel/plugin-syntax-jsx" "^7.12.1"
"@babel/runtime" "^7.7.2"
"@emotion/hash" "^0.8.0"
"@emotion/memoize" "^0.7.4"
"@emotion/serialize" "^1.0.0"
babel-plugin-macros "^2.6.1"
convert-source-map "^1.5.0"
escape-string-regexp "^4.0.0"
find-root "^1.1.0"
source-map "^0.5.7"
stylis "^4.0.3"
"@emotion/cache@^10.0.27": "@emotion/cache@^10.0.27":
version "10.0.29" version "10.0.29"
resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0" resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0"
@@ -1292,10 +1326,21 @@
"@emotion/utils" "0.11.3" "@emotion/utils" "0.11.3"
"@emotion/weak-memoize" "0.2.5" "@emotion/weak-memoize" "0.2.5"
"@emotion/core@^10.0.10", "@emotion/core@^10.0.22": "@emotion/cache@^11.0.0":
version "10.0.35" version "11.0.0"
resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.0.35.tgz#513fcf2e22cd4dfe9d3894ed138c9d7a859af9b3" resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.0.0.tgz#473adcaf9e04c6a0e30fb1421e79a209a96818f8"
integrity sha512-sH++vJCdk025fBlRZSAhkRlSUoqSqgCzYf5fMOmqqi3bM6how+sQpg3hkgJonj8GxXM4WbD7dRO+4tegDB9fUw== integrity sha512-NStfcnLkL5vj3mBILvkR2m/5vFxo3G0QEreYKDGHNHm9IMYoT/t3j6xwjx6lMI/S1LUJfVHQqn0m9wSINttTTQ==
dependencies:
"@emotion/memoize" "^0.7.4"
"@emotion/sheet" "^1.0.0"
"@emotion/utils" "^1.0.0"
"@emotion/weak-memoize" "^0.2.5"
stylis "^4.0.3"
"@emotion/core@^10.0.10":
version "10.1.1"
resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.1.1.tgz#c956c1365f2f2481960064bcb8c4732e5fb612c3"
integrity sha512-ZMLG6qpXR8x031NXD8HJqugy/AZSkAuMxxqB46pmAR7ze47MhNJ56cdoX243QPZdGctrdfo+s08yZTiwaUcRKA==
dependencies: dependencies:
"@babel/runtime" "^7.5.5" "@babel/runtime" "^7.5.5"
"@emotion/cache" "^10.0.27" "@emotion/cache" "^10.0.27"
@@ -1313,7 +1358,18 @@
"@emotion/utils" "0.11.3" "@emotion/utils" "0.11.3"
babel-plugin-emotion "^10.0.27" babel-plugin-emotion "^10.0.27"
"@emotion/hash@0.8.0": "@emotion/css@^11.0.0":
version "11.0.0"
resolved "https://registry.yarnpkg.com/@emotion/css/-/css-11.0.0.tgz#804dcec7e4990019a08e678c1145d34208923acb"
integrity sha512-i7/uzTYcoP0hIW9V4YobD/mYAt6rjNySr9g6CS7JEFsRDfskg4nUczzIehALfacDaHbHaOQYaNDHBGuD/AtW5A==
dependencies:
"@emotion/babel-plugin" "^11.0.0"
"@emotion/cache" "^11.0.0"
"@emotion/serialize" "^1.0.0"
"@emotion/sheet" "^1.0.0"
"@emotion/utils" "^1.0.0"
"@emotion/hash@0.8.0", "@emotion/hash@^0.8.0":
version "0.8.0" version "0.8.0"
resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413" resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"
integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow== integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
@@ -1325,11 +1381,31 @@
dependencies: dependencies:
"@emotion/memoize" "0.7.4" "@emotion/memoize" "0.7.4"
"@emotion/memoize@0.7.4": "@emotion/is-prop-valid@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.0.0.tgz#1dbe82e52a12c065d416a702e2d106e552cde5be"
integrity sha512-G5X0t7eR9pkhUvAY32QS3lToP9JyNF8It5CcmMvbWjmC9/Yq7IhevaKqxl+me2BKR93iTPiL/h3En1ZX/1G3PQ==
dependencies:
"@emotion/memoize" "^0.7.4"
"@emotion/memoize@0.7.4", "@emotion/memoize@^0.7.4":
version "0.7.4" version "0.7.4"
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb" resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw== integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
"@emotion/react@^11.1.1":
version "11.1.1"
resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.1.1.tgz#4b304d494af321b0179e6763830e07cf674f0423"
integrity sha512-otA0Np8OnOeU9ChkOS9iuLB6vIxiM+bJiU0id33CsQn3R2Pk9ijVHnxevENIKV/P2S7AhrD8cFbUGysEciWlEA==
dependencies:
"@babel/runtime" "^7.7.2"
"@emotion/cache" "^11.0.0"
"@emotion/serialize" "^1.0.0"
"@emotion/sheet" "^1.0.0"
"@emotion/utils" "^1.0.0"
"@emotion/weak-memoize" "^0.2.5"
hoist-non-react-statics "^3.3.1"
"@emotion/serialize@^0.11.15", "@emotion/serialize@^0.11.16": "@emotion/serialize@^0.11.15", "@emotion/serialize@^0.11.16":
version "0.11.16" version "0.11.16"
resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.16.tgz#dee05f9e96ad2fb25a5206b6d759b2d1ed3379ad" resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.16.tgz#dee05f9e96ad2fb25a5206b6d759b2d1ed3379ad"
@@ -1341,11 +1417,27 @@
"@emotion/utils" "0.11.3" "@emotion/utils" "0.11.3"
csstype "^2.5.7" csstype "^2.5.7"
"@emotion/serialize@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.0.0.tgz#1a61f4f037cf39995c97fc80ebe99abc7b191ca9"
integrity sha512-zt1gm4rhdo5Sry8QpCOpopIUIKU+mUSpV9WNmFILUraatm5dttNEaYzUWWSboSMUE6PtN2j1cAsuvcugfdI3mw==
dependencies:
"@emotion/hash" "^0.8.0"
"@emotion/memoize" "^0.7.4"
"@emotion/unitless" "^0.7.5"
"@emotion/utils" "^1.0.0"
csstype "^3.0.2"
"@emotion/sheet@0.9.4": "@emotion/sheet@0.9.4":
version "0.9.4" version "0.9.4"
resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.4.tgz#894374bea39ec30f489bbfc3438192b9774d32e5" resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.4.tgz#894374bea39ec30f489bbfc3438192b9774d32e5"
integrity sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA== integrity sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA==
"@emotion/sheet@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.0.0.tgz#a0ef06080f339477ad4ba7f56e1c931f7ba50822"
integrity sha512-cdCHfZtf/0rahPDCZ9zyq+36EqfD/6c0WUqTFZ/hv9xadTUv2lGE5QK7/Z6Dnx2oRxC0usfVM2/BYn9q9B9wZA==
"@emotion/styled-base@^10.0.27": "@emotion/styled-base@^10.0.27":
version "10.0.31" version "10.0.31"
resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.31.tgz#940957ee0aa15c6974adc7d494ff19765a2f742a" resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.0.31.tgz#940957ee0aa15c6974adc7d494ff19765a2f742a"
@@ -1356,7 +1448,7 @@
"@emotion/serialize" "^0.11.15" "@emotion/serialize" "^0.11.15"
"@emotion/utils" "0.11.3" "@emotion/utils" "0.11.3"
"@emotion/styled@^10.0.12", "@emotion/styled@^10.0.23": "@emotion/styled@^10.0.12":
version "10.0.27" version "10.0.27"
resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.27.tgz#12cb67e91f7ad7431e1875b1d83a94b814133eaf" resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-10.0.27.tgz#12cb67e91f7ad7431e1875b1d83a94b814133eaf"
integrity sha512-iK/8Sh7+NLJzyp9a5+vIQIXTYxfT4yB/OJbjzQanB2RZpvmzBQOHZWhpAMZWYEKRNNbsD6WfBw5sVWkb6WzS/Q== integrity sha512-iK/8Sh7+NLJzyp9a5+vIQIXTYxfT4yB/OJbjzQanB2RZpvmzBQOHZWhpAMZWYEKRNNbsD6WfBw5sVWkb6WzS/Q==
@@ -1364,12 +1456,23 @@
"@emotion/styled-base" "^10.0.27" "@emotion/styled-base" "^10.0.27"
babel-plugin-emotion "^10.0.27" babel-plugin-emotion "^10.0.27"
"@emotion/styled@^11.0.0":
version "11.0.0"
resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.0.0.tgz#698196c2822746360a8644a73a5d842b2d1a78a5"
integrity sha512-498laccxJlBiJqrr2r/fx9q+Pr55D0URP2UyOkoSGLjevb8LLAFWueqthsQ5XijE66iGo7y3rzzEYdA7CHmZEQ==
dependencies:
"@babel/runtime" "^7.7.2"
"@emotion/babel-plugin" "^11.0.0"
"@emotion/is-prop-valid" "^1.0.0"
"@emotion/serialize" "^1.0.0"
"@emotion/utils" "^1.0.0"
"@emotion/stylis@0.8.5": "@emotion/stylis@0.8.5":
version "0.8.5" version "0.8.5"
resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04" resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ== integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
"@emotion/unitless@0.7.5": "@emotion/unitless@0.7.5", "@emotion/unitless@^0.7.5":
version "0.7.5" version "0.7.5"
resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed" resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg== integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
@@ -1379,7 +1482,12 @@
resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.3.tgz#a759863867befa7e583400d322652a3f44820924" resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.3.tgz#a759863867befa7e583400d322652a3f44820924"
integrity sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw== integrity sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw==
"@emotion/weak-memoize@0.2.5": "@emotion/utils@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.0.0.tgz#abe06a83160b10570816c913990245813a2fd6af"
integrity sha512-mQC2b3XLDs6QCW+pDQDiyO/EdGZYOygE8s5N5rrzjSI4M3IejPE/JPndCBwRT9z982aqQNi6beWs1UeayrQxxA==
"@emotion/weak-memoize@0.2.5", "@emotion/weak-memoize@^0.2.5":
version "0.2.5" version "0.2.5"
resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46" resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"
integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA== integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==
@@ -3453,7 +3561,7 @@ babel-plugin-dynamic-import-node@^2.3.3:
dependencies: dependencies:
object.assign "^4.1.0" object.assign "^4.1.0"
babel-plugin-emotion@^10.0.27, babel-plugin-emotion@^10.0.33: babel-plugin-emotion@^10.0.27:
version "10.0.33" version "10.0.33"
resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.33.tgz#ce1155dcd1783bbb9286051efee53f4e2be63e03" resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.33.tgz#ce1155dcd1783bbb9286051efee53f4e2be63e03"
integrity sha512-bxZbTTGz0AJQDHm8k6Rf3RQJ8tX2scsfsRyKVgAbiUPUNIRtlK+7JxP+TAd1kRLABFxe0CFm2VdK4ePkoA9FxQ== integrity sha512-bxZbTTGz0AJQDHm8k6Rf3RQJ8tX2scsfsRyKVgAbiUPUNIRtlK+7JxP+TAd1kRLABFxe0CFm2VdK4ePkoA9FxQ==
@@ -3499,7 +3607,7 @@ babel-plugin-jest-hoist@^26.5.0:
"@types/babel__core" "^7.0.0" "@types/babel__core" "^7.0.0"
"@types/babel__traverse" "^7.0.6" "@types/babel__traverse" "^7.0.6"
babel-plugin-macros@^2.0.0: babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.6.1:
version "2.8.0" version "2.8.0"
resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138" resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138"
integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg== integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==
@@ -4483,16 +4591,6 @@ crc@^3.4.4:
dependencies: dependencies:
buffer "^5.1.0" buffer "^5.1.0"
create-emotion@^10.0.27:
version "10.0.27"
resolved "https://registry.yarnpkg.com/create-emotion/-/create-emotion-10.0.27.tgz#cb4fa2db750f6ca6f9a001a33fbf1f6c46789503"
integrity sha512-fIK73w82HPPn/RsAij7+Zt8eCE8SptcJ3WoRMfxMtjteYxud8GDTKKld7MYwAX2TVhrw29uR1N/bVGxeStHILg==
dependencies:
"@emotion/cache" "^10.0.27"
"@emotion/serialize" "^0.11.15"
"@emotion/sheet" "0.9.4"
"@emotion/utils" "0.11.3"
cross-env@^7.0.2: cross-env@^7.0.2:
version "7.0.2" version "7.0.2"
resolved "https://registry.yarnpkg.com/cross-env/-/cross-env-7.0.2.tgz#bd5ed31339a93a3418ac4f3ca9ca3403082ae5f9" resolved "https://registry.yarnpkg.com/cross-env/-/cross-env-7.0.2.tgz#bd5ed31339a93a3418ac4f3ca9ca3403082ae5f9"
@@ -4580,7 +4678,12 @@ cssstyle@^2.2.0:
dependencies: dependencies:
cssom "~0.3.6" cssom "~0.3.6"
csstype@^2.5.7, csstype@^2.6.7: csstype@^2.5.7:
version "2.6.14"
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.14.tgz#004822a4050345b55ad4dcc00be1d9cf2f4296de"
integrity sha512-2mSc+VEpGPblzAxyeR+vZhJKgYg0Og0nnRi7pmRXFYYxSfnOnW8A5wwQb4n4cE2nIOzqKOAzLCaEX6aBmNEv8A==
csstype@^2.6.7:
version "2.6.13" version "2.6.13"
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.13.tgz#a6893015b90e84dd6e85d0e3b442a1e84f2dbe0f" resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.13.tgz#a6893015b90e84dd6e85d0e3b442a1e84f2dbe0f"
integrity sha512-ul26pfSQTZW8dcOnD2iiJssfXw0gdNVX9IJDH/X3K5DGPfj+fUYe3kB+swUY6BF3oZDxaID3AJt+9/ojSAE05A== integrity sha512-ul26pfSQTZW8dcOnD2iiJssfXw0gdNVX9IJDH/X3K5DGPfj+fUYe3kB+swUY6BF3oZDxaID3AJt+9/ojSAE05A==
@@ -5201,14 +5304,6 @@ emotion-theming@^10.0.10:
"@emotion/weak-memoize" "0.2.5" "@emotion/weak-memoize" "0.2.5"
hoist-non-react-statics "^3.3.0" hoist-non-react-statics "^3.3.0"
emotion@^10.0.23:
version "10.0.27"
resolved "https://registry.yarnpkg.com/emotion/-/emotion-10.0.27.tgz#f9ca5df98630980a23c819a56262560562e5d75e"
integrity sha512-2xdDzdWWzue8R8lu4G76uWX5WhyQuzATon9LmNeCy/2BHVC6dsEpfhN1a0qhELgtDVdjyEA6J8Y/VlI5ZnaH0g==
dependencies:
babel-plugin-emotion "^10.0.27"
create-emotion "^10.0.27"
encodeurl@^1.0.2, encodeurl@~1.0.2: encodeurl@^1.0.2, encodeurl@~1.0.2:
version "1.0.2" version "1.0.2"
resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -5408,6 +5503,11 @@ escape-string-regexp@^2.0.0:
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344" resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344"
integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w== integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
escape-string-regexp@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
escodegen@^1.14.1: escodegen@^1.14.1:
version "1.14.3" version "1.14.3"
resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.14.3.tgz#4e7b81fba61581dc97582ed78cab7f0e8d63f503" resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.14.3.tgz#4e7b81fba61581dc97582ed78cab7f0e8d63f503"
@@ -6646,7 +6746,7 @@ has@^1.0.3:
dependencies: dependencies:
function-bind "^1.1.1" function-bind "^1.1.1"
hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2: hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1, hoist-non-react-statics@^3.3.2:
version "3.3.2" version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -12215,6 +12315,11 @@ strip-json-comments@~2.0.1:
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a" resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
integrity sha1-PFMZQukIwml8DsNEhYwobHygpgo= integrity sha1-PFMZQukIwml8DsNEhYwobHygpgo=
stylis@^4.0.3:
version "4.0.3"
resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.0.3.tgz#0d714765f3f694a685550f0c45411ebf90a9bded"
integrity sha512-iAxdFyR9cHKp4H5M2dJlDnvcb/3TvPprzlKjvYVbH7Sh+y8hjY/mUu/ssdcvVz6Z4lKI3vsoS0jAkMYmX7ozfA==
sumchecker@^3.0.1: sumchecker@^3.0.1:
version "3.0.1" version "3.0.1"
resolved "https://registry.yarnpkg.com/sumchecker/-/sumchecker-3.0.1.tgz#6377e996795abb0b6d348e9b3e1dfb24345a8e42" resolved "https://registry.yarnpkg.com/sumchecker/-/sumchecker-3.0.1.tgz#6377e996795abb0b6d348e9b3e1dfb24345a8e42"