diff --git a/desktop/flipper-common/src/plugin-external-modules.tsx b/desktop/flipper-common/src/plugin-external-modules.tsx index 15468468c..59ba41383 100644 --- a/desktop/flipper-common/src/plugin-external-modules.tsx +++ b/desktop/flipper-common/src/plugin-external-modules.tsx @@ -18,6 +18,7 @@ export const pluginExternalModules = { antd: 'antd', immer: 'Immer', '@emotion/styled': 'emotion_styled', + '@emotion/css': 'emotion_css', '@ant-design/icons': 'antdesign_icons', // Used by "bloks-logger" (see its bundle's content) 'react/jsx-runtime': 'ReactJsxRuntime', diff --git a/desktop/flipper-frontend-core/src/globalObject.tsx b/desktop/flipper-frontend-core/src/globalObject.tsx index 52d0eca7d..4e67f8fb9 100644 --- a/desktop/flipper-frontend-core/src/globalObject.tsx +++ b/desktop/flipper-frontend-core/src/globalObject.tsx @@ -18,6 +18,7 @@ export interface GlobalObject { Immer: any; antd: any; emotion_styled: any; + emotion_css: any; antdesign_icons: any; ReactJsxRuntime: any; } @@ -32,6 +33,7 @@ declare module globalThis { let Immer: any; let antd: any; let emotion_styled: any; + let emotion_css: any; let antdesign_icons: any; let ReactJsxRuntime: any; } diff --git a/desktop/flipper-server-companion/src/globalsReplacements/fakeEmotionCss.tsx b/desktop/flipper-server-companion/src/globalsReplacements/fakeEmotionCss.tsx new file mode 100644 index 000000000..7fe4ab506 --- /dev/null +++ b/desktop/flipper-server-companion/src/globalsReplacements/fakeEmotionCss.tsx @@ -0,0 +1,10 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + */ + +export const css = () => () => ({}); diff --git a/desktop/flipper-server-companion/src/init.tsx b/desktop/flipper-server-companion/src/init.tsx index 10954758d..de8e3d156 100644 --- a/desktop/flipper-server-companion/src/init.tsx +++ b/desktop/flipper-server-companion/src/init.tsx @@ -17,6 +17,7 @@ import {initializeRenderHost} from './initializeRenderHost'; import * as React from './globalsReplacements/fakeReact'; import * as ReactDOM from './globalsReplacements/fakeReactDOM'; import {styled} from './globalsReplacements/fakeEmotionStyled'; +import * as emotionCss from './globalsReplacements/fakeEmotionCss'; import * as legacyExports from './globalsReplacements/fakeLegacyExports'; import Module from 'module'; @@ -38,6 +39,7 @@ export const initCompanionEnv = async ( Immer, antd: {}, emotion_styled: {default: styled}, + emotion_css: emotionCss, antdesign_icons: {}, ReactJsxRuntime: {}, }); diff --git a/desktop/flipper-ui-core/src/dispatcher/plugins.tsx b/desktop/flipper-ui-core/src/dispatcher/plugins.tsx index f968bf350..852594ad5 100644 --- a/desktop/flipper-ui-core/src/dispatcher/plugins.tsx +++ b/desktop/flipper-ui-core/src/dispatcher/plugins.tsx @@ -35,6 +35,7 @@ import {_SandyPluginDefinition} from 'flipper-plugin'; import * as Immer from 'immer'; import * as antd from 'antd'; import * as emotion_styled from '@emotion/styled'; +import * as emotion_css from '@emotion/css'; import * as antdesign_icons from '@ant-design/icons'; import isPluginCompatible from '../utils/isPluginCompatible'; import {createSandyPluginWrapper} from '../utils/createSandyPluginWrapper'; @@ -113,6 +114,7 @@ export default async (store: Store, _logger: Logger) => { Immer, antd, emotion_styled, + emotion_css, antdesign_icons, ReactJsxRuntime, }); diff --git a/desktop/pkg-lib/src/runBuild.tsx b/desktop/pkg-lib/src/runBuild.tsx index 291f89b53..f6efab600 100644 --- a/desktop/pkg-lib/src/runBuild.tsx +++ b/desktop/pkg-lib/src/runBuild.tsx @@ -62,6 +62,7 @@ async function runBuild({ 'antd', 'immer', '@emotion/styled', + '@emotion/css', '@ant-design/icons', // It is an optional dependency for rollup that we use in react-devtools 'fsevents',