From e4990f444497ba9b6ee4357bb1d814d1f710205a Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:27:05 -0400 Subject: [PATCH 1/7] Replace styled-components with Emotion in ui --- packages/redux-devtools-ui/.stylelintrc | 7 --- packages/redux-devtools-ui/package.json | 15 ++--- .../src/Button/Button.stories.tsx | 2 +- .../src/Button/styles/common.ts | 6 +- .../src/Button/styles/default.ts | 4 +- .../src/Button/styles/material.ts | 4 +- .../redux-devtools-ui/src/Container/index.tsx | 2 +- .../src/Container/styles/index.ts | 7 +-- .../src/ContextMenu/ContextMenu.stories.tsx | 2 +- .../src/ContextMenu/styles/index.ts | 4 +- .../src/Dialog/styles/default.ts | 4 +- .../src/Dialog/styles/material.ts | 4 +- .../redux-devtools-ui/src/Editor/Editor.tsx | 8 +-- .../src/Editor/styles/index.ts | 6 +- .../src/Form/styles/index.ts | 5 +- .../src/Notification/Notification.stories.tsx | 2 +- .../src/Notification/styles/index.ts | 4 +- .../SegmentedControl.stories.tsx | 2 +- .../src/SegmentedControl/styles/index.ts | 7 +-- .../src/Select/Select.stories.tsx | 2 +- .../src/Slider/Slider.stories.tsx | 2 +- .../src/Slider/styles/common.ts | 5 +- .../src/Slider/styles/default.ts | 4 +- .../src/Slider/styles/material.ts | 4 +- .../src/Tabs/Tabs.stories.tsx | 2 +- .../src/Tabs/styles/common.ts | 2 +- .../src/Tabs/styles/default.ts | 7 +-- .../src/Tabs/styles/material.ts | 7 +-- .../src/Toolbar/Toolbar.stories.tsx | 2 +- .../src/Toolbar/styles/Divider.ts | 5 +- .../src/Toolbar/styles/Spacer.ts | 2 +- .../src/Toolbar/styles/Toolbar.ts | 16 +++-- .../redux-devtools-ui/src/utils/animations.ts | 2 +- .../src/utils/createStyledComponent.ts | 63 ++++++------------- .../src/utils/createThemedComponent.tsx | 8 ++- pnpm-lock.yaml | 37 +++++++++-- 36 files changed, 123 insertions(+), 142 deletions(-) delete mode 100644 packages/redux-devtools-ui/.stylelintrc diff --git a/packages/redux-devtools-ui/.stylelintrc b/packages/redux-devtools-ui/.stylelintrc deleted file mode 100644 index 9e72e47c61..0000000000 --- a/packages/redux-devtools-ui/.stylelintrc +++ /dev/null @@ -1,7 +0,0 @@ -{ - "processors": ["stylelint-processor-styled-components"], - "extends": [ - "stylelint-config-recommended", - "stylelint-config-styled-components" - ] -} diff --git a/packages/redux-devtools-ui/package.json b/packages/redux-devtools-ui/package.json index 6394e80386..6ee4f49f9a 100644 --- a/packages/redux-devtools-ui/package.json +++ b/packages/redux-devtools-ui/package.json @@ -36,7 +36,6 @@ "clean": "rimraf lib storybook-static", "test": "jest", "lint": "eslint .", - "lint:css": "stylelint \"./src/**/*.js\"", "type-check": "tsc --noEmit", "prepack": "pnpm run clean && pnpm run build", "prepublish": "pnpm run type-check && pnpm run lint && pnpm run test" @@ -64,6 +63,8 @@ "@babel/preset-env": "^7.27.2", "@babel/preset-react": "^7.27.1", "@babel/preset-typescript": "^7.27.1", + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@storybook/addon-onboarding": "^9.0.2", "@storybook/react-vite": "^9.0.2", "@testing-library/dom": "^10.4.0", @@ -73,7 +74,6 @@ "@types/node": "^22.15.21", "@types/jest": "^29.5.14", "@types/react": "^19.1.6", - "@types/styled-components": "^5.1.34", "babel-loader": "^10.0.0", "csstype": "^3.1.3", "jest": "^29.7.0", @@ -84,19 +84,14 @@ "react-is": "^19.1.0", "rimraf": "^6.0.1", "storybook": "^9.0.2", - "styled-components": "^5.3.11", - "stylelint": "^16.19.1", - "stylelint-config-standard": "^38.0.0", - "stylelint-config-styled-components": "^0.1.1", - "stylelint-processor-styled-components": "^1.10.0", "ts-jest": "^29.3.4", "typescript": "~5.8.3", "vite": "^6.3.5" }, "peerDependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@types/react": "^16.3.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", - "react": "^16.3.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "styled-components": "^5.3.11" + "react": "^16.3.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } } diff --git a/packages/redux-devtools-ui/src/Button/Button.stories.tsx b/packages/redux-devtools-ui/src/Button/Button.stories.tsx index b31dc24f8f..e5a8e022ae 100644 --- a/packages/redux-devtools-ui/src/Button/Button.stories.tsx +++ b/packages/redux-devtools-ui/src/Button/Button.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { MdFiberManualRecord } from 'react-icons/md'; import { Meta, StoryObj } from '@storybook/react-vite'; import Button from './'; diff --git a/packages/redux-devtools-ui/src/Button/styles/common.ts b/packages/redux-devtools-ui/src/Button/styles/common.ts index cc2dc519ab..0ecae4f483 100644 --- a/packages/redux-devtools-ui/src/Button/styles/common.ts +++ b/packages/redux-devtools-ui/src/Button/styles/common.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { fadeIn } from '../../utils/animations'; import colorEffect from '../../utils/color'; import { Mark, Size, TooltipPosition } from '../Button'; @@ -138,7 +138,7 @@ export const commonStyle = ({ theme, mark, size, -}: ThemedStyledProps) => css` +}: CommonStyleProps & { theme: Theme }) => css` display: inline-block; position: relative; flex-shrink: 0; @@ -188,7 +188,7 @@ export const tooltipStyle = ({ tooltipPosition, mark, size, -}: ThemedStyledProps) => css` +}: TooltipStyleProps & { theme: Theme }) => css` ${commonStyle({ theme, mark, size })} &:before { diff --git a/packages/redux-devtools-ui/src/Button/styles/default.ts b/packages/redux-devtools-ui/src/Button/styles/default.ts index 8439f3566b..c0e11f7af4 100644 --- a/packages/redux-devtools-ui/src/Button/styles/default.ts +++ b/packages/redux-devtools-ui/src/Button/styles/default.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; export interface StyleProps { @@ -10,7 +10,7 @@ export const style = ({ theme, primary, disabled, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` box-sizing: border-box; -webkit-font-smoothing: antialiased; outline: none; diff --git a/packages/redux-devtools-ui/src/Button/styles/material.ts b/packages/redux-devtools-ui/src/Button/styles/material.ts index 5ecb635199..c06e4d75d0 100644 --- a/packages/redux-devtools-ui/src/Button/styles/material.ts +++ b/packages/redux-devtools-ui/src/Button/styles/material.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { ripple } from '../../utils/animations'; import { StyleProps } from './default'; import { Theme } from '../../themes/default'; @@ -7,7 +7,7 @@ export const style = ({ theme, primary, disabled, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` box-sizing: border-box; -webkit-font-smoothing: antialiased; outline: none; diff --git a/packages/redux-devtools-ui/src/Container/index.tsx b/packages/redux-devtools-ui/src/Container/index.tsx index ae7b73dd59..5a0a106089 100644 --- a/packages/redux-devtools-ui/src/Container/index.tsx +++ b/packages/redux-devtools-ui/src/Container/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ThemeProvider } from 'styled-components'; +import { ThemeProvider } from '@emotion/react'; import { useTheme, ThemeData } from '../utils/theme'; import { MainContainerWrapper, ContainerWrapper } from './styles'; import { Theme } from '../themes/default'; diff --git a/packages/redux-devtools-ui/src/Container/styles/index.ts b/packages/redux-devtools-ui/src/Container/styles/index.ts index c101c40b26..4bb1b68159 100644 --- a/packages/redux-devtools-ui/src/Container/styles/index.ts +++ b/packages/redux-devtools-ui/src/Container/styles/index.ts @@ -1,4 +1,4 @@ -import styled, { ThemedStyledProps } from 'styled-components'; +import styled from '@emotion/styled'; import color from '../../utils/color'; import { Theme } from '../../themes/default'; @@ -8,9 +8,8 @@ export const MainContainerWrapper = styled.div` width: 100%; flex-flow: column nowrap; overflow: auto; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - background-color: ${(props: ThemedStyledProps<{}, Theme>) => - color(props.theme.base00, 'lighten', 0.03)}; + background-color: ${(props: { theme?: Theme }) => + color(props.theme!.base00, 'lighten', 0.03)}; color: ${(props) => props.theme.base07}; font-size: 12px; diff --git a/packages/redux-devtools-ui/src/ContextMenu/ContextMenu.stories.tsx b/packages/redux-devtools-ui/src/ContextMenu/ContextMenu.stories.tsx index 74d431e8b4..cf3c5dbf48 100644 --- a/packages/redux-devtools-ui/src/ContextMenu/ContextMenu.stories.tsx +++ b/packages/redux-devtools-ui/src/ContextMenu/ContextMenu.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import ContextMenu from './'; import { items } from './data'; diff --git a/packages/redux-devtools-ui/src/ContextMenu/styles/index.ts b/packages/redux-devtools-ui/src/ContextMenu/styles/index.ts index 1555419c5e..c928d27cdf 100644 --- a/packages/redux-devtools-ui/src/ContextMenu/styles/index.ts +++ b/packages/redux-devtools-ui/src/ContextMenu/styles/index.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; interface StyleProps { @@ -12,7 +12,7 @@ export default ({ left, top, visible, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` ${visible ? ` visibility: visible; diff --git a/packages/redux-devtools-ui/src/Dialog/styles/default.ts b/packages/redux-devtools-ui/src/Dialog/styles/default.ts index 664cb45209..69e6fd47e1 100644 --- a/packages/redux-devtools-ui/src/Dialog/styles/default.ts +++ b/packages/redux-devtools-ui/src/Dialog/styles/default.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; export interface StyleProps { @@ -10,7 +10,7 @@ export const style = ({ theme, open, fullWidth, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` position: fixed; top: 0px; right: 0px; diff --git a/packages/redux-devtools-ui/src/Dialog/styles/material.ts b/packages/redux-devtools-ui/src/Dialog/styles/material.ts index d348518ce3..e194a69f2e 100644 --- a/packages/redux-devtools-ui/src/Dialog/styles/material.ts +++ b/packages/redux-devtools-ui/src/Dialog/styles/material.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { StyleProps } from './default'; import { Theme } from '../../themes/default'; @@ -6,7 +6,7 @@ export const style = ({ theme, open, fullWidth, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` position: fixed; top: 0px; right: 0px; diff --git a/packages/redux-devtools-ui/src/Editor/Editor.tsx b/packages/redux-devtools-ui/src/Editor/Editor.tsx index d9e1e5c51c..1e2b9b4623 100644 --- a/packages/redux-devtools-ui/src/Editor/Editor.tsx +++ b/packages/redux-devtools-ui/src/Editor/Editor.tsx @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import CodeMirror, { EditorChange } from 'codemirror'; import type { Base16Theme } from 'react-base16-styling'; import { defaultStyle, themedStyle } from './styles'; @@ -16,10 +16,10 @@ import 'codemirror/addon/fold/foldgutter.css'; const EditorContainer = styled.div( '' as unknown as TemplateStringsArray, - ({ theme }: { theme: Theme }) => - theme.scheme === 'default' && theme.light + ({ theme }: { theme?: Base16Theme }) => + theme!.scheme === 'default' && (theme as Theme).light ? defaultStyle - : themedStyle(theme), + : themedStyle(theme!), ); export interface EditorProps { diff --git a/packages/redux-devtools-ui/src/Editor/styles/index.ts b/packages/redux-devtools-ui/src/Editor/styles/index.ts index bfeffcc816..9550e687e2 100644 --- a/packages/redux-devtools-ui/src/Editor/styles/index.ts +++ b/packages/redux-devtools-ui/src/Editor/styles/index.ts @@ -1,5 +1,5 @@ -import { css } from 'styled-components'; -import { Theme } from '../../themes/default'; +import { css } from '@emotion/react'; +import { Base16Theme } from 'react-base16-styling'; export const defaultStyle = ` height: 100%; @@ -11,7 +11,7 @@ export const defaultStyle = ` } `; -export const themedStyle = (theme: Theme) => css` +export const themedStyle = (theme: Base16Theme) => css` height: 100%; > div { diff --git a/packages/redux-devtools-ui/src/Form/styles/index.ts b/packages/redux-devtools-ui/src/Form/styles/index.ts index f9ad52a1b0..b8f4ddbe78 100644 --- a/packages/redux-devtools-ui/src/Form/styles/index.ts +++ b/packages/redux-devtools-ui/src/Form/styles/index.ts @@ -1,8 +1,7 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; -// eslint-disable-next-line @typescript-eslint/no-empty-object-type -export default ({ theme }: ThemedStyledProps<{}, Theme>) => css` +export default ({ theme }: { theme: Theme }) => css` padding: 10px; line-height: 1.846; font-size: 14px; diff --git a/packages/redux-devtools-ui/src/Notification/Notification.stories.tsx b/packages/redux-devtools-ui/src/Notification/Notification.stories.tsx index 0f5f9798aa..d55aa27b50 100644 --- a/packages/redux-devtools-ui/src/Notification/Notification.stories.tsx +++ b/packages/redux-devtools-ui/src/Notification/Notification.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import Notification from './'; diff --git a/packages/redux-devtools-ui/src/Notification/styles/index.ts b/packages/redux-devtools-ui/src/Notification/styles/index.ts index 509cda5225..7b2bcc17d9 100644 --- a/packages/redux-devtools-ui/src/Notification/styles/index.ts +++ b/packages/redux-devtools-ui/src/Notification/styles/index.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; import { Type } from '../Notification'; @@ -19,7 +19,7 @@ interface StyleProps { type: Type; } -export default ({ theme, type }: ThemedStyledProps) => css` +export default ({ theme, type }: StyleProps & { theme: Theme }) => css` display: flex; align-items: flex-start; flex-shrink: 0; diff --git a/packages/redux-devtools-ui/src/SegmentedControl/SegmentedControl.stories.tsx b/packages/redux-devtools-ui/src/SegmentedControl/SegmentedControl.stories.tsx index f7e9293301..1b9e508799 100644 --- a/packages/redux-devtools-ui/src/SegmentedControl/SegmentedControl.stories.tsx +++ b/packages/redux-devtools-ui/src/SegmentedControl/SegmentedControl.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import SegmentedControl from './'; diff --git a/packages/redux-devtools-ui/src/SegmentedControl/styles/index.ts b/packages/redux-devtools-ui/src/SegmentedControl/styles/index.ts index 7a48ee5094..6a9b95f50f 100644 --- a/packages/redux-devtools-ui/src/SegmentedControl/styles/index.ts +++ b/packages/redux-devtools-ui/src/SegmentedControl/styles/index.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import color from '../../utils/color'; import { Theme } from '../../themes/default'; @@ -6,10 +6,7 @@ interface StyleProps { disabled: boolean | undefined; } -export default ({ - theme, - disabled, -}: ThemedStyledProps) => css` +export default ({ theme, disabled }: StyleProps & { theme: Theme }) => css` display: flex; flex-shrink: 0; diff --git a/packages/redux-devtools-ui/src/Select/Select.stories.tsx b/packages/redux-devtools-ui/src/Select/Select.stories.tsx index e9c6b3e723..c12b461cd5 100644 --- a/packages/redux-devtools-ui/src/Select/Select.stories.tsx +++ b/packages/redux-devtools-ui/src/Select/Select.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import Select from './'; import { options } from './options'; import { Meta, StoryObj } from '@storybook/react-vite'; diff --git a/packages/redux-devtools-ui/src/Slider/Slider.stories.tsx b/packages/redux-devtools-ui/src/Slider/Slider.stories.tsx index 1d39d376a0..27fae999bf 100644 --- a/packages/redux-devtools-ui/src/Slider/Slider.stories.tsx +++ b/packages/redux-devtools-ui/src/Slider/Slider.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import Slider from './'; diff --git a/packages/redux-devtools-ui/src/Slider/styles/common.ts b/packages/redux-devtools-ui/src/Slider/styles/common.ts index 20360d0362..0ab18a4391 100644 --- a/packages/redux-devtools-ui/src/Slider/styles/common.ts +++ b/packages/redux-devtools-ui/src/Slider/styles/common.ts @@ -1,8 +1,7 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; -// eslint-disable-next-line @typescript-eslint/no-empty-object-type -export const containerStyle = ({ theme }: ThemedStyledProps<{}, Theme>) => css` +export const containerStyle = ({ theme }: { theme: Theme }) => css` display: flex; align-items: center; diff --git a/packages/redux-devtools-ui/src/Slider/styles/default.ts b/packages/redux-devtools-ui/src/Slider/styles/default.ts index 8b985b9aea..3f85e0422e 100644 --- a/packages/redux-devtools-ui/src/Slider/styles/default.ts +++ b/packages/redux-devtools-ui/src/Slider/styles/default.ts @@ -6,7 +6,7 @@ Based on: http://codepen.io/thebabydino/pen/YPOPxr */ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { prefixSelectors } from '../../utils/autoPrefix'; import { Theme } from '../../themes/default'; @@ -21,7 +21,7 @@ export const style = ({ percent, disabled, withLabel, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` display: block; width: 100%; position: relative; diff --git a/packages/redux-devtools-ui/src/Slider/styles/material.ts b/packages/redux-devtools-ui/src/Slider/styles/material.ts index 0bf7970116..48fa155a40 100644 --- a/packages/redux-devtools-ui/src/Slider/styles/material.ts +++ b/packages/redux-devtools-ui/src/Slider/styles/material.ts @@ -1,4 +1,4 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { prefixSelectors } from '../../utils/autoPrefix'; import color from '../../utils/color'; import { animationCurve } from '../../utils/animations'; @@ -10,7 +10,7 @@ export const style = ({ percent, disabled, withLabel, -}: ThemedStyledProps) => css` +}: StyleProps & { theme: Theme }) => css` display: block; width: 100%; position: relative; diff --git a/packages/redux-devtools-ui/src/Tabs/Tabs.stories.tsx b/packages/redux-devtools-ui/src/Tabs/Tabs.stories.tsx index 364b7a4cfe..24a69b2ecd 100644 --- a/packages/redux-devtools-ui/src/Tabs/Tabs.stories.tsx +++ b/packages/redux-devtools-ui/src/Tabs/Tabs.stories.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import Tabs from './'; import { tabs, simple10Tabs } from './data'; diff --git a/packages/redux-devtools-ui/src/Tabs/styles/common.ts b/packages/redux-devtools-ui/src/Tabs/styles/common.ts index d85259b719..29b5a127aa 100644 --- a/packages/redux-devtools-ui/src/Tabs/styles/common.ts +++ b/packages/redux-devtools-ui/src/Tabs/styles/common.ts @@ -1,4 +1,4 @@ -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Position } from '../Tabs'; interface StyleProps { diff --git a/packages/redux-devtools-ui/src/Tabs/styles/default.ts b/packages/redux-devtools-ui/src/Tabs/styles/default.ts index 1d3da379f5..3bd52d9f67 100644 --- a/packages/redux-devtools-ui/src/Tabs/styles/default.ts +++ b/packages/redux-devtools-ui/src/Tabs/styles/default.ts @@ -1,14 +1,11 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { Theme } from '../../themes/default'; export interface StyleProps { main: boolean | undefined; } -export const style = ({ - theme, - main, -}: ThemedStyledProps) => css` +export const style = ({ theme, main }: StyleProps & { theme: Theme }) => css` display: flex; flex: 0 0 1; padding-left: 1px; diff --git a/packages/redux-devtools-ui/src/Tabs/styles/material.ts b/packages/redux-devtools-ui/src/Tabs/styles/material.ts index a55bda86bc..f44ce8426e 100644 --- a/packages/redux-devtools-ui/src/Tabs/styles/material.ts +++ b/packages/redux-devtools-ui/src/Tabs/styles/material.ts @@ -1,12 +1,9 @@ -import { css, ThemedStyledProps } from 'styled-components'; +import { css } from '@emotion/react'; import { ripple } from '../../utils/animations'; import { Theme } from '../../themes/default'; import { StyleProps } from './default'; -export const style = ({ - theme, - main, -}: ThemedStyledProps) => css` +export const style = ({ theme, main }: StyleProps & { theme: Theme }) => css` display: flex; flex: 0 0 1; padding-left: 1px; diff --git a/packages/redux-devtools-ui/src/Toolbar/Toolbar.stories.tsx b/packages/redux-devtools-ui/src/Toolbar/Toolbar.stories.tsx index 64a13d5fd2..1cc8f4628b 100644 --- a/packages/redux-devtools-ui/src/Toolbar/Toolbar.stories.tsx +++ b/packages/redux-devtools-ui/src/Toolbar/Toolbar.stories.tsx @@ -1,5 +1,5 @@ import React, { ReactNode } from 'react'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Meta, StoryObj } from '@storybook/react-vite'; import { MdPlayArrow } from 'react-icons/md'; import { MdFiberManualRecord } from 'react-icons/md'; diff --git a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts index 9838c56d44..2f109eda6e 100644 --- a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts +++ b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts @@ -1,7 +1,8 @@ -import styled from 'styled-components'; +import styled from '@emotion/styled'; +import { Theme } from '../../themes/default'; const Divider = styled.div` - background-color: ${(props) => props.theme.base02}; + background-color: ${(props: { theme?: Theme }) => props.theme!.base02}; box-shadow: 1px 1px 2px ${(props) => props.theme.base00}; height: ${(props) => props.theme.inputHeight || '30'}px; width: 1px; diff --git a/packages/redux-devtools-ui/src/Toolbar/styles/Spacer.ts b/packages/redux-devtools-ui/src/Toolbar/styles/Spacer.ts index 73068d5b13..be6b98205d 100644 --- a/packages/redux-devtools-ui/src/Toolbar/styles/Spacer.ts +++ b/packages/redux-devtools-ui/src/Toolbar/styles/Spacer.ts @@ -1,4 +1,4 @@ -import styled from 'styled-components'; +import styled from '@emotion/styled'; const Spacer = styled.div` flex-grow: 1; diff --git a/packages/redux-devtools-ui/src/Toolbar/styles/Toolbar.ts b/packages/redux-devtools-ui/src/Toolbar/styles/Toolbar.ts index 5ca7c7c778..80c9231b9e 100644 --- a/packages/redux-devtools-ui/src/Toolbar/styles/Toolbar.ts +++ b/packages/redux-devtools-ui/src/Toolbar/styles/Toolbar.ts @@ -1,4 +1,4 @@ -import styled, { ThemedStyledInterface } from 'styled-components'; +import styled from '@emotion/styled'; import type { Base16Theme } from 'react-base16-styling'; import * as CSS from 'csstype'; @@ -11,11 +11,9 @@ export interface Props { noBorder?: boolean; } -const Toolbar = ( - styled as ThemedStyledInterface< - Base16Theme & { fontFamily?: CSS.Property.FontFamily } - > -).div` +const Toolbar = styled.div< + Props & { theme?: Base16Theme & { fontFamily?: CSS.Property.FontFamily } } +>` display: flex; flex-shrink: 0; box-sizing: border-box; @@ -30,11 +28,11 @@ const Toolbar = ( position: relative; ${({ borderPosition, theme }) => borderPosition && `border-${borderPosition}: 1px solid ${theme.base02};`} - + & > div { margin: auto ${(props) => (props.noBorder ? '0' : '1px;')}; } - + & button { border-radius: 0; ${(props) => props.noBorder && 'border-color: transparent;'} @@ -47,7 +45,7 @@ const Toolbar = ( text-align: left; margin: auto 1px; flex-grow: 1; - + .Select-control { cursor: pointer; border-radius: 0 !important; diff --git a/packages/redux-devtools-ui/src/utils/animations.ts b/packages/redux-devtools-ui/src/utils/animations.ts index da6db22bbb..f1d60830ab 100644 --- a/packages/redux-devtools-ui/src/utils/animations.ts +++ b/packages/redux-devtools-ui/src/utils/animations.ts @@ -1,4 +1,4 @@ -import { css, keyframes } from 'styled-components'; +import { css, keyframes } from '@emotion/react'; import { Theme } from '../themes/default'; export const spin = keyframes` diff --git a/packages/redux-devtools-ui/src/utils/createStyledComponent.ts b/packages/redux-devtools-ui/src/utils/createStyledComponent.ts index 5f44632e5f..c2f2d2b9d5 100644 --- a/packages/redux-devtools-ui/src/utils/createStyledComponent.ts +++ b/packages/redux-devtools-ui/src/utils/createStyledComponent.ts @@ -1,53 +1,29 @@ import React from 'react'; import styled, { - InterpolationFunction, + FunctionInterpolation, StyledComponent, - StyledComponentPropsWithRef, - ThemedStyledInterface, - ThemedStyledProps, -} from 'styled-components'; +} from '@emotion/styled'; +import { PropsOf } from '@emotion/react'; import type { Base16Theme } from 'react-base16-styling'; import getDefaultTheme, { Theme } from '../themes/default'; import { ThemeFromProvider } from './theme'; -type StyleFunction< - C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, -> = InterpolationFunction< - ThemedStyledProps & O, Theme> ->; +type StyleFunction = FunctionInterpolation; -interface StylesObject< - C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, -> { - [type: string]: StyleFunction; +interface StylesObject { + [type: string]: StyleFunction; } -type Styles< - C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, -> = StylesObject | StyleFunction; +type Styles = StylesObject | StyleFunction; -function isStylesObject< - C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, ->(styles: Styles): styles is StylesObject { +function isStylesObject( + styles: Styles, +): styles is StylesObject { return typeof styles === 'object'; } -const getStyle = < - C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, ->( - styles: Styles, - type: string, -) => (isStylesObject(styles) ? styles[type] || styles.default : styles); +const getStyle = (styles: Styles, type: string) => + isStylesObject(styles) ? styles[type] || styles.default : styles; function isThemeFromProvider( theme: Theme | Base16Theme, @@ -57,14 +33,15 @@ function isThemeFromProvider( export default function createStyledComponent< C extends keyof React.JSX.IntrinsicElements | React.ComponentType, - // eslint-disable-next-line @typescript-eslint/no-empty-object-type - O extends object = {}, + O extends object, >( - styles: Styles, + styles: Styles & O & { theme: Theme }>, component?: C, -): StyledComponent { - return (styled as ThemedStyledInterface)((component || 'div') as C)` - ${(props: ThemedStyledProps & O, Theme>) => +): StyledComponent & O & { theme?: Theme | Base16Theme }> { + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + return styled((component || 'div') as C)` + ${(props: PropsOf & { theme: Theme | Base16Theme }) => isThemeFromProvider(props.theme as Theme | Base16Theme) ? getStyle(styles, props.theme.type as string) : // used outside of container (theme provider) @@ -75,7 +52,7 @@ export default function createStyledComponent< ...props, theme: getDefaultTheme(props.theme as Base16Theme), })} - ` as StyledComponent; + ` as StyledComponent & O & { theme?: Theme | Base16Theme }>; } // TODO: memoize it? diff --git a/packages/redux-devtools-ui/src/utils/createThemedComponent.tsx b/packages/redux-devtools-ui/src/utils/createThemedComponent.tsx index 02ec5f0148..f6afcefed2 100644 --- a/packages/redux-devtools-ui/src/utils/createThemedComponent.tsx +++ b/packages/redux-devtools-ui/src/utils/createThemedComponent.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { withTheme } from 'styled-components'; +import { withTheme } from '@emotion/react'; import type { Base16Theme } from 'react-base16-styling'; import getDefaultTheme, { Theme } from '../themes/default'; @@ -8,10 +8,14 @@ export default >( ? C : never, ) => { - return withTheme((props) => { + return withTheme((props: { theme?: Theme }) => { return props.theme && props.theme.type ? ( + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore ) : ( + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore =16.8.0' + peerDependenciesMeta: + '@types/react': + optional: true + '@emotion/stylis@0.8.5': resolution: {integrity: sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==} @@ -11626,6 +11636,21 @@ snapshots: '@emotion/sheet@1.4.0': {} + '@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0)': + dependencies: + '@babel/runtime': 7.27.1 + '@emotion/babel-plugin': 11.13.5 + '@emotion/is-prop-valid': 1.3.1 + '@emotion/react': 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/serialize': 1.3.3 + '@emotion/use-insertion-effect-with-fallbacks': 1.2.0(react@19.1.0) + '@emotion/utils': 1.4.2 + react: 19.1.0 + optionalDependencies: + '@types/react': 19.1.6 + transitivePeerDependencies: + - supports-color + '@emotion/stylis@0.8.5': {} '@emotion/unitless@0.10.0': {} From 9ba88afd9ce792579b176fc40f227fb1109db98a Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:29:05 -0400 Subject: [PATCH 2/7] react-dock --- packages/react-dock/demo/package.json | 5 +- packages/react-dock/demo/src/App.tsx | 2 +- pnpm-lock.yaml | 394 +------------------------- 3 files changed, 6 insertions(+), 395 deletions(-) diff --git a/packages/react-dock/demo/package.json b/packages/react-dock/demo/package.json index 4f1c012257..07c774e7d6 100644 --- a/packages/react-dock/demo/package.json +++ b/packages/react-dock/demo/package.json @@ -10,13 +10,13 @@ "type-check": "tsc --noEmit" }, "dependencies": { + "@emotion/styled": "^11.14.0", "react": "^19.1.0", "react-bootstrap": "^2.10.10", "react-dock": "workspace:^", "react-dom": "^19.1.0", "react-icons": "^5.5.0", - "react-is": "^19.1.0", - "styled-components": "^5.3.11" + "react-is": "^19.1.0" }, "devDependencies": { "@babel/core": "^7.27.1", @@ -26,7 +26,6 @@ "@types/node": "^22.15.21", "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", - "@types/styled-components": "^5.1.34", "babel-loader": "^10.0.0", "cross-env": "^7.0.3", "fork-ts-checker-webpack-plugin": "^9.1.0", diff --git a/packages/react-dock/demo/src/App.tsx b/packages/react-dock/demo/src/App.tsx index b3699c7204..da93c54088 100644 --- a/packages/react-dock/demo/src/App.tsx +++ b/packages/react-dock/demo/src/App.tsx @@ -2,7 +2,7 @@ import React, { Component } from 'react'; import Button from 'react-bootstrap/Button'; import Form from 'react-bootstrap/Form'; import { BsX } from 'react-icons/bs'; -import styled from 'styled-components'; +import styled from '@emotion/styled'; import { Dock } from 'react-dock'; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f615f22581..47ab0856e1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -403,6 +403,9 @@ importers: packages/react-dock/demo: dependencies: + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) react: specifier: ^19.1.0 version: 19.1.0 @@ -421,9 +424,6 @@ importers: react-is: specifier: ^19.1.0 version: 19.1.0 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/core': specifier: ^7.27.1 @@ -446,9 +446,6 @@ importers: '@types/react-dom': specifier: ^19.1.5 version: 19.1.5(@types/react@19.1.6) - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 babel-loader: specifier: ^10.0.0 version: 10.0.0(@babel/core@7.27.1)(webpack@5.99.9) @@ -2505,18 +2502,6 @@ importers: storybook: specifier: ^9.0.2 version: 9.0.2(@testing-library/dom@10.4.0)(prettier@3.5.3) - stylelint: - specifier: ^16.19.1 - version: 16.19.1(typescript@5.8.3) - stylelint-config-standard: - specifier: ^38.0.0 - version: 38.0.0(stylelint@16.19.1(typescript@5.8.3)) - stylelint-config-styled-components: - specifier: ^0.1.1 - version: 0.1.1 - stylelint-processor-styled-components: - specifier: ^1.10.0 - version: 1.10.0 ts-jest: specifier: ^29.3.4 version: 29.3.4(@babel/core@7.27.1)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.27.1))(esbuild@0.25.4)(jest@29.7.0(@types/node@22.15.21)(babel-plugin-macros@3.1.0)(ts-node@10.9.2(@swc/core@1.11.29(@swc/helpers@0.5.17))(@types/node@22.15.21)(typescript@5.8.3)))(typescript@5.8.3) @@ -3580,29 +3565,6 @@ packages: resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==} engines: {node: '>=12'} - '@csstools/css-parser-algorithms@3.0.4': - resolution: {integrity: sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==} - engines: {node: '>=18'} - peerDependencies: - '@csstools/css-tokenizer': ^3.0.3 - - '@csstools/css-tokenizer@3.0.3': - resolution: {integrity: sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw==} - engines: {node: '>=18'} - - '@csstools/media-query-list-parser@4.0.2': - resolution: {integrity: sha512-EUos465uvVvMJehckATTlNqGj4UJWkTmdWuDMjqvSUkjGpmOyFZBVwb4knxCm/k2GMTXY+c/5RkdndzFYWeX5A==} - engines: {node: '>=18'} - peerDependencies: - '@csstools/css-parser-algorithms': ^3.0.4 - '@csstools/css-tokenizer': ^3.0.3 - - '@csstools/selector-specificity@5.0.0': - resolution: {integrity: sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==} - engines: {node: '>=18'} - peerDependencies: - postcss-selector-parser: ^7.0.0 - '@discoveryjs/json-ext@0.6.3': resolution: {integrity: sha512-4B4OijXeVNOPZlYA2oEwWOTkzyltLao+xbotHQeqN++Rv27Y6s818+n2Qkp8q+Fxhn0t/5lA5X1Mxktud8eayQ==} engines: {node: '>=14.17.0'} @@ -3638,9 +3600,6 @@ packages: peerDependencies: react: '>=16.8.0' - '@dual-bundle/import-meta-resolve@4.1.0': - resolution: {integrity: sha512-+nxncfwHM5SgAtrVzgpzJOI1ol0PkumhVo469KCf9lUi21IGcY90G98VuHm9VRrUypmAzawAHO9bs6hqeADaVg==} - '@electron/get@2.0.3': resolution: {integrity: sha512-Qkzpg2s9GnVV2I2BjRksUi43U5e6+zaQMcjoJy0C+C5oxaKl+fmckGDQFtRpZpZV0NQekuZZ+tGz7EA9TVnQtQ==} engines: {node: '>=12'} @@ -4133,9 +4092,6 @@ packages: peerDependencies: tslib: '2' - '@keyv/serialize@1.0.3': - resolution: {integrity: sha512-qnEovoOp5Np2JDGonIDL6Ayihw0RhnRh6vxPuHo4RDn1UOzwEo4AeIfpL6UGIrsceWrCMiVPgwRjbHu4vYFc3g==} - '@leichtgewicht/ip-codec@2.0.5': resolution: {integrity: sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==} @@ -5602,10 +5558,6 @@ packages: resolution: {integrity: sha512-6t10qk83GOG8p0vKmaCr8eiilZwO171AvbROMtvvNiwrTly62t+7XkA8RdIIVbpMhCASAsxgAzdRSwh6nw/5Dg==} engines: {node: '>=4'} - astral-regex@2.0.0: - resolution: {integrity: sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==} - engines: {node: '>=8'} - async-function@1.0.0: resolution: {integrity: sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==} engines: {node: '>= 0.4'} @@ -5692,9 +5644,6 @@ packages: balanced-match@1.0.2: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} - balanced-match@2.0.0: - resolution: {integrity: sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==} - base64-js@1.5.1: resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==} @@ -5782,9 +5731,6 @@ packages: buffer@5.7.1: resolution: {integrity: sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==} - buffer@6.0.3: - resolution: {integrity: sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==} - bundle-name@4.1.0: resolution: {integrity: sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==} engines: {node: '>=18'} @@ -5805,9 +5751,6 @@ packages: resolution: {integrity: sha512-v+p6ongsrp0yTGbJXjgxPow2+DL93DASP4kXCDKb8/bwRtt9OEF3whggkkDkGNzgcWy2XaF4a8nZglC7uElscg==} engines: {node: '>=8'} - cacheable@1.9.0: - resolution: {integrity: sha512-8D5htMCxPDUULux9gFzv30f04Xo3wCnik0oOxKoRTPIBoqA7HtOcJ87uBhQTs3jCfZZTrUBGsYIZOgE0ZRgMAg==} - call-bind-apply-helpers@1.0.2: resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==} engines: {node: '>= 0.4'} @@ -5968,9 +5911,6 @@ packages: resolution: {integrity: sha512-16BlyiuyLq3MLxpRWyOTiWsO3ii/eLQLJUQXBSNcxMBBSnyt1ee9YUdaozQp03ifwm5woztEZGDbk9RGVuCsdw==} engines: {node: '>=18'} - colord@2.9.3: - resolution: {integrity: sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==} - colorette@2.0.19: resolution: {integrity: sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==} @@ -6107,15 +6047,6 @@ packages: typescript: optional: true - cosmiconfig@9.0.0: - resolution: {integrity: sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==} - engines: {node: '>=14'} - peerDependencies: - typescript: '>=4.9.5' - peerDependenciesMeta: - typescript: - optional: true - create-jest@29.7.0: resolution: {integrity: sha512-Adz2bdH0Vq3F53KEMJOoftQFutWCukm6J24wbPWRO4k1kMY7gS7ds/uoJkNuV8wDCtWWnuwGcJwpWcih+zEW1Q==} engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0} @@ -6140,10 +6071,6 @@ packages: resolution: {integrity: sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==} engines: {node: '>=4'} - css-functions-list@3.2.3: - resolution: {integrity: sha512-IQOkD3hbR5KrN93MtcYuad6YPuTSUhntLHDuLEbFWE+ff2/XSZNdZG+LcbbIW5AXKg/WFIfYItIzVoHngHXZzA==} - engines: {node: '>=12 || >=16'} - css-loader@7.1.2: resolution: {integrity: sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==} engines: {node: '>= 18.12.0'} @@ -6162,10 +6089,6 @@ packages: css-to-react-native@3.2.0: resolution: {integrity: sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==} - css-tree@3.1.0: - resolution: {integrity: sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==} - engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0} - css-what@6.1.0: resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==} engines: {node: '>= 6'} @@ -6901,9 +6824,6 @@ packages: picomatch: optional: true - file-entry-cache@10.1.0: - resolution: {integrity: sha512-Et/ex6smi3wOOB+n5mek+Grf7P2AxZR5ueqRUvAAn4qkyatXi3cUC1cuQXVkX0VlzBVsN4BkWJFmY/fYiRTdww==} - file-entry-cache@8.0.0: resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==} engines: {node: '>=16.0.0'} @@ -6945,9 +6865,6 @@ packages: resolution: {integrity: sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==} engines: {node: '>=16'} - flat-cache@6.1.9: - resolution: {integrity: sha512-DUqiKkTlAfhtl7g78IuwqYM+YqvT+as0mY+EVk6mfimy19U79pJCzDZQsnqk3Ou/T6hFXWLGbwbADzD/c8Tydg==} - flat@5.0.2: resolution: {integrity: sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==} hasBin: true @@ -7124,14 +7041,6 @@ packages: resolution: {integrity: sha512-PT6XReJ+D07JvGoxQMkT6qji/jVNfX/h364XHZOWeRzy64sSFr+xJ5OX7LI3b4MPQzdL4H8Y8M0xzPpsVMwA8Q==} engines: {node: '>=10.0'} - global-modules@2.0.0: - resolution: {integrity: sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==} - engines: {node: '>=6'} - - global-prefix@3.0.0: - resolution: {integrity: sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==} - engines: {node: '>=6'} - globals@11.12.0: resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==} engines: {node: '>=4'} @@ -7152,9 +7061,6 @@ packages: resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==} engines: {node: '>=10'} - globjoin@0.1.4: - resolution: {integrity: sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==} - gopd@1.2.0: resolution: {integrity: sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==} engines: {node: '>= 0.4'} @@ -7223,9 +7129,6 @@ packages: hoist-non-react-statics@3.3.2: resolution: {integrity: sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==} - hookified@1.9.0: - resolution: {integrity: sha512-2yEEGqphImtKIe1NXWEhu6yD3hlFR4Mxk4Mtp3XEyScpSt4pQ4ymmXA1zzxZpj99QkFK+nN0nzjeb2+RUi/6CQ==} - hpack.js@2.1.6: resolution: {integrity: sha512-zJxVehUdMGIKsRaNt7apO2Gqp0BdqW5yaiGHXXmbpvxgBYVZnAql+BJb4RO5ad2MgpbZKn5G6nMnegrH1FcNYQ==} @@ -7255,10 +7158,6 @@ packages: engines: {node: ^14.13.1 || >=16.0.0} hasBin: true - html-tags@3.3.1: - resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==} - engines: {node: '>=8'} - html-webpack-plugin@5.6.3: resolution: {integrity: sha512-QSf1yjtSAsmf7rYBV7XX86uua4W/vkhIt0xNXKbsi2foEeW7vjJQz4bhnpL3xH+l1ryl1680uNv968Z+X6jSYg==} engines: {node: '>=10.13.0'} @@ -7563,10 +7462,6 @@ packages: resolution: {integrity: sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==} engines: {node: '>=0.10.0'} - is-plain-object@5.0.0: - resolution: {integrity: sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==} - engines: {node: '>=0.10.0'} - is-potential-custom-element-name@1.0.1: resolution: {integrity: sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==} @@ -7950,9 +7845,6 @@ packages: keyv@4.5.4: resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==} - keyv@5.3.3: - resolution: {integrity: sha512-Rwu4+nXI9fqcxiEHtbkvoes2X+QfkTRo1TMkPfwzipGsJlJO/z69vqB4FNl9xJ3xCpAcbkvmEabZfPzrwN3+gQ==} - kind-of@6.0.3: resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==} engines: {node: '>=0.10.0'} @@ -7989,9 +7881,6 @@ packages: tedious: optional: true - known-css-properties@0.36.0: - resolution: {integrity: sha512-A+9jP+IUmuQsNdsLdcg6Yt7voiMF/D4K83ew0OpJtpu+l34ef7LaohWV0Rc6KNvzw6ZDizkqfyB5JznZnzuKQA==} - launch-editor@2.10.0: resolution: {integrity: sha512-D7dBRJo/qcGX9xlvt/6wUYzQxjh5G1RvZPgPv8vi4KRU99DVQL/oW7tnVOCCTm2HGeo3C5HvGE5Yrh6UBoZ0vA==} @@ -8076,9 +7965,6 @@ packages: lodash.startcase@4.4.0: resolution: {integrity: sha512-+WKqsK294HMSc2jEbNgpHpd0JfIBhp7rEV4aqXWqFr6AlXov+SlcgB1Fv01y2kGe3Gc8nMW7VA0SrGuSkRfIEg==} - lodash.truncate@4.4.2: - resolution: {integrity: sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==} - lodash@4.17.21: resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==} @@ -8166,15 +8052,9 @@ packages: resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==} engines: {node: '>= 0.4'} - mathml-tag-names@2.1.3: - resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==} - md5@2.3.0: resolution: {integrity: sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==} - mdn-data@2.12.2: - resolution: {integrity: sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==} - media-typer@0.3.0: resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==} engines: {node: '>= 0.6'} @@ -8190,10 +8070,6 @@ packages: memoize-one@6.0.0: resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==} - meow@13.2.0: - resolution: {integrity: sha512-pxQJQzB6djGPXh08dacEloMFopsOqGVRKFPYvPOt9XDZ1HasbgDZA74CJGreSU4G3Ak7EFJGoiH2auq+yXISgA==} - engines: {node: '>=18'} - merge-descriptors@1.0.3: resolution: {integrity: sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==} @@ -8674,9 +8550,6 @@ packages: pg-connection-string@2.6.2: resolution: {integrity: sha512-ch6OwaeaPYcova4kKZ15sbJ2hKb/VP48ZD2gE7i1J+L4MspCtBMAx8nMgz7bksc7IojCIIWuEhHibSMFH8m8oA==} - picocolors@0.2.1: - resolution: {integrity: sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==} - picocolors@1.1.1: resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} @@ -8736,15 +8609,6 @@ packages: peerDependencies: postcss: ^8.1.0 - postcss-resolve-nested-selector@0.1.6: - resolution: {integrity: sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==} - - postcss-safe-parser@7.0.1: - resolution: {integrity: sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==} - engines: {node: '>=18.0'} - peerDependencies: - postcss: ^8.4.31 - postcss-selector-parser@7.1.0: resolution: {integrity: sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==} engines: {node: '>=4'} @@ -8752,10 +8616,6 @@ packages: postcss-value-parser@4.2.0: resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==} - postcss@7.0.39: - resolution: {integrity: sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==} - engines: {node: '>=6.0.0'} - postcss@8.5.3: resolution: {integrity: sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==} engines: {node: ^10 || ^12 || >=14} @@ -9388,10 +9248,6 @@ packages: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} - slice-ansi@4.0.0: - resolution: {integrity: sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==} - engines: {node: '>=10'} - sliced@1.0.1: resolution: {integrity: sha512-VZBmZP8WU3sMOZm1bdgTadsQbcscK0UM8oKxKVBs4XAhUo2Xxzm/OFMGBkPusxw9xL3Uy8LrzEqGqJhclsr0yA==} @@ -9575,29 +9431,6 @@ packages: react-dom: '>= 16.8.0' react-is: '>= 16.8.0' - stylelint-config-recommended@16.0.0: - resolution: {integrity: sha512-4RSmPjQegF34wNcK1e1O3Uz91HN8P1aFdFzio90wNK9mjgAI19u5vsU868cVZboKzCaa5XbpvtTzAAGQAxpcXA==} - engines: {node: '>=18.12.0'} - peerDependencies: - stylelint: ^16.16.0 - - stylelint-config-standard@38.0.0: - resolution: {integrity: sha512-uj3JIX+dpFseqd/DJx8Gy3PcRAJhlEZ2IrlFOc4LUxBX/PNMEQ198x7LCOE2Q5oT9Vw8nyc4CIL78xSqPr6iag==} - engines: {node: '>=18.12.0'} - peerDependencies: - stylelint: ^16.18.0 - - stylelint-config-styled-components@0.1.1: - resolution: {integrity: sha512-z5Xz/9GmvxO6e/DLzBMwkB85zHxEEjN6K7Cj80Bi+o/9vR9eS3GX3E9VuMnX9WLFYulqbqLtTapGGY28JBiy9Q==} - - stylelint-processor-styled-components@1.10.0: - resolution: {integrity: sha512-g4HpN9rm0JD0LoHuIOcd/FIjTZCJ0ErQ+dC3VTxp+dSvnkV+MklKCCmCQEdz5K5WxF4vPuzfVgdbSDuPYGZhoA==} - - stylelint@16.19.1: - resolution: {integrity: sha512-C1SlPZNMKl+d/C867ZdCRthrS+6KuZ3AoGW113RZCOL0M8xOGpgx7G70wq7lFvqvm4dcfdGFVLB/mNaLFChRKw==} - engines: {node: '>=18.12.0'} - hasBin: true - stylis@4.2.0: resolution: {integrity: sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==} @@ -9625,24 +9458,13 @@ packages: resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==} engines: {node: '>=10'} - supports-hyperlinks@3.2.0: - resolution: {integrity: sha512-zFObLMyZeEwzAoKCyu1B91U79K2t7ApXuQfo8OuxwXLDgcKxuwM+YvcbIhm6QWqz7mHUH1TVytR1PwVVjEuMig==} - engines: {node: '>=14.18'} - supports-preserve-symlinks-flag@1.0.0: resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==} engines: {node: '>= 0.4'} - svg-tags@1.0.0: - resolution: {integrity: sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==} - symbol-tree@3.2.4: resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==} - table@6.9.0: - resolution: {integrity: sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==} - engines: {node: '>=10.0.0'} - tapable@2.2.2: resolution: {integrity: sha512-Re10+NauLTMCudc7T5WLFLAwDhQ0JWdrMK+9B2M8zR5hRExKmsRDCBA7/aV/pNJFltmBFO5BAMlQFi/vq3nKOg==} engines: {node: '>=6'} @@ -10197,10 +10019,6 @@ packages: resolution: {integrity: sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==} engines: {node: '>= 0.4'} - which@1.3.1: - resolution: {integrity: sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==} - hasBin: true - which@2.0.2: resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==} engines: {node: '>= 8'} @@ -10242,10 +10060,6 @@ packages: resolution: {integrity: sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==} engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0} - write-file-atomic@5.0.1: - resolution: {integrity: sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==} - engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} - ws@8.18.2: resolution: {integrity: sha512-DMricUmwGZUVr++AEAe2uiVM7UoO9MAVZMDu05UQOaUII0lp+zOzLLU4Xqh/JvTqklB1T4uELaaPBKyjE1r4fQ==} engines: {node: '>=10.0.0'} @@ -11496,21 +11310,6 @@ snapshots: dependencies: '@jridgewell/trace-mapping': 0.3.9 - '@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3)': - dependencies: - '@csstools/css-tokenizer': 3.0.3 - - '@csstools/css-tokenizer@3.0.3': {} - - '@csstools/media-query-list-parser@4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)': - dependencies: - '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3) - '@csstools/css-tokenizer': 3.0.3 - - '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.0)': - dependencies: - postcss-selector-parser: 7.1.0 - '@discoveryjs/json-ext@0.6.3': {} '@dmsnell/diff-match-patch@1.1.0': {} @@ -11547,8 +11346,6 @@ snapshots: react: 19.1.0 tslib: 2.8.1 - '@dual-bundle/import-meta-resolve@4.1.0': {} - '@electron/get@2.0.3': dependencies: debug: 4.4.1(supports-color@5.5.0) @@ -12111,10 +11908,6 @@ snapshots: dependencies: tslib: 2.8.1 - '@keyv/serialize@1.0.3': - dependencies: - buffer: 6.0.3 - '@leichtgewicht/ip-codec@2.0.5': {} '@manypkg/find-root@1.1.0': @@ -14021,8 +13814,6 @@ snapshots: dependencies: tslib: 2.8.1 - astral-regex@2.0.0: {} - async-function@1.0.0: {} async-retry@1.3.3: @@ -14164,8 +13955,6 @@ snapshots: balanced-match@1.0.2: {} - balanced-match@2.0.0: {} - base64-js@1.5.1: {} base64id@2.0.0: {} @@ -14269,11 +14058,6 @@ snapshots: base64-js: 1.5.1 ieee754: 1.2.1 - buffer@6.0.3: - dependencies: - base64-js: 1.5.1 - ieee754: 1.2.1 - bundle-name@4.1.0: dependencies: run-applescript: 7.0.0 @@ -14316,11 +14100,6 @@ snapshots: normalize-url: 6.1.0 responselike: 2.0.1 - cacheable@1.9.0: - dependencies: - hookified: 1.9.0 - keyv: 5.3.3 - call-bind-apply-helpers@1.0.2: dependencies: es-errors: 1.3.0 @@ -14481,8 +14260,6 @@ snapshots: color-convert: 3.1.0 color-string: 2.0.1 - colord@2.9.3: {} - colorette@2.0.19: {} colorette@2.0.20: {} @@ -14611,15 +14388,6 @@ snapshots: optionalDependencies: typescript: 5.8.3 - cosmiconfig@9.0.0(typescript@5.8.3): - dependencies: - env-paths: 2.2.1 - import-fresh: 3.3.1 - js-yaml: 4.1.0 - parse-json: 5.2.0 - optionalDependencies: - typescript: 5.8.3 - create-jest@29.7.0(@types/node@22.15.21)(babel-plugin-macros@3.1.0)(ts-node@10.9.2(@swc/core@1.11.29(@swc/helpers@0.5.17))(@types/node@22.15.21)(typescript@5.8.3)): dependencies: '@jest/types': 29.6.3 @@ -14651,8 +14419,6 @@ snapshots: css-color-keywords@1.0.0: {} - css-functions-list@3.2.3: {} - css-loader@7.1.2(webpack@5.99.9): dependencies: icss-utils: 5.1.0(postcss@8.5.3) @@ -14680,11 +14446,6 @@ snapshots: css-color-keywords: 1.0.0 postcss-value-parser: 4.2.0 - css-tree@3.1.0: - dependencies: - mdn-data: 2.12.2 - source-map-js: 1.2.1 - css-what@6.1.0: {} css.escape@1.5.1: {} @@ -15536,10 +15297,6 @@ snapshots: optionalDependencies: picomatch: 4.0.2 - file-entry-cache@10.1.0: - dependencies: - flat-cache: 6.1.9 - file-entry-cache@8.0.0: dependencies: flat-cache: 4.0.1 @@ -15593,12 +15350,6 @@ snapshots: flatted: 3.3.3 keyv: 4.5.4 - flat-cache@6.1.9: - dependencies: - cacheable: 1.9.0 - flatted: 3.3.3 - hookified: 1.9.0 - flat@5.0.2: {} flatted@3.3.3: {} @@ -15807,16 +15558,6 @@ snapshots: serialize-error: 7.0.1 optional: true - global-modules@2.0.0: - dependencies: - global-prefix: 3.0.0 - - global-prefix@3.0.0: - dependencies: - ini: 1.3.8 - kind-of: 6.0.3 - which: 1.3.1 - globals@11.12.0: {} globals@14.0.0: {} @@ -15837,8 +15578,6 @@ snapshots: merge2: 1.4.1 slash: 3.0.0 - globjoin@0.1.4: {} - gopd@1.2.0: {} got@11.8.6: @@ -15900,8 +15639,6 @@ snapshots: dependencies: react-is: 16.13.1 - hookified@1.9.0: {} - hpack.js@2.1.6: dependencies: inherits: 2.0.4 @@ -15943,8 +15680,6 @@ snapshots: relateurl: 0.2.7 terser: 5.39.2 - html-tags@3.3.1: {} - html-webpack-plugin@5.6.3(webpack@5.99.9): dependencies: '@types/html-minifier-terser': 6.1.0 @@ -16242,8 +15977,6 @@ snapshots: dependencies: isobject: 3.0.1 - is-plain-object@5.0.0: {} - is-potential-custom-element-name@1.0.1: {} is-promise@2.2.2: {} @@ -16866,10 +16599,6 @@ snapshots: dependencies: json-buffer: 3.0.1 - keyv@5.3.3: - dependencies: - '@keyv/serialize': 1.0.3 - kind-of@6.0.3: {} kleur@3.0.3: {} @@ -16895,8 +16624,6 @@ snapshots: transitivePeerDependencies: - supports-color - known-css-properties@0.36.0: {} - launch-editor@2.10.0: dependencies: picocolors: 1.1.1 @@ -16968,8 +16695,6 @@ snapshots: lodash.startcase@4.4.0: {} - lodash.truncate@4.4.2: {} - lodash@4.17.21: {} loglevel@1.9.2: {} @@ -17064,16 +16789,12 @@ snapshots: math-intrinsics@1.1.0: {} - mathml-tag-names@2.1.3: {} - md5@2.3.0: dependencies: charenc: 0.0.2 crypt: 0.0.2 is-buffer: 1.1.6 - mdn-data@2.12.2: {} - media-typer@0.3.0: {} memfs@3.5.3: @@ -17089,8 +16810,6 @@ snapshots: memoize-one@6.0.0: {} - meow@13.2.0: {} - merge-descriptors@1.0.3: {} merge-stream@2.0.0: {} @@ -17563,8 +17282,6 @@ snapshots: pg-connection-string@2.6.2: {} - picocolors@0.2.1: {} - picocolors@1.1.1: {} picomatch@2.3.1: {} @@ -17608,12 +17325,6 @@ snapshots: icss-utils: 5.1.0(postcss@8.5.3) postcss: 8.5.3 - postcss-resolve-nested-selector@0.1.6: {} - - postcss-safe-parser@7.0.1(postcss@8.5.3): - dependencies: - postcss: 8.5.3 - postcss-selector-parser@7.1.0: dependencies: cssesc: 3.0.0 @@ -17621,11 +17332,6 @@ snapshots: postcss-value-parser@4.2.0: {} - postcss@7.0.39: - dependencies: - picocolors: 0.2.1 - source-map: 0.6.1 - postcss@8.5.3: dependencies: nanoid: 3.3.11 @@ -18415,12 +18121,6 @@ snapshots: slash@3.0.0: {} - slice-ansi@4.0.0: - dependencies: - ansi-styles: 4.3.0 - astral-regex: 2.0.0 - is-fullwidth-code-point: 3.0.0 - sliced@1.0.1: {} smart-buffer@4.2.0: {} @@ -18705,70 +18405,6 @@ snapshots: transitivePeerDependencies: - '@babel/core' - stylelint-config-recommended@16.0.0(stylelint@16.19.1(typescript@5.8.3)): - dependencies: - stylelint: 16.19.1(typescript@5.8.3) - - stylelint-config-standard@38.0.0(stylelint@16.19.1(typescript@5.8.3)): - dependencies: - stylelint: 16.19.1(typescript@5.8.3) - stylelint-config-recommended: 16.0.0(stylelint@16.19.1(typescript@5.8.3)) - - stylelint-config-styled-components@0.1.1: {} - - stylelint-processor-styled-components@1.10.0: - dependencies: - '@babel/parser': 7.27.2 - '@babel/traverse': 7.27.1(supports-color@5.5.0) - micromatch: 4.0.8 - postcss: 7.0.39 - transitivePeerDependencies: - - supports-color - - stylelint@16.19.1(typescript@5.8.3): - dependencies: - '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3) - '@csstools/css-tokenizer': 3.0.3 - '@csstools/media-query-list-parser': 4.0.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3) - '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.0) - '@dual-bundle/import-meta-resolve': 4.1.0 - balanced-match: 2.0.0 - colord: 2.9.3 - cosmiconfig: 9.0.0(typescript@5.8.3) - css-functions-list: 3.2.3 - css-tree: 3.1.0 - debug: 4.4.1(supports-color@5.5.0) - fast-glob: 3.3.3 - fastest-levenshtein: 1.0.16 - file-entry-cache: 10.1.0 - global-modules: 2.0.0 - globby: 11.1.0 - globjoin: 0.1.4 - html-tags: 3.3.1 - ignore: 7.0.4 - imurmurhash: 0.1.4 - is-plain-object: 5.0.0 - known-css-properties: 0.36.0 - mathml-tag-names: 2.1.3 - meow: 13.2.0 - micromatch: 4.0.8 - normalize-path: 3.0.0 - picocolors: 1.1.1 - postcss: 8.5.3 - postcss-resolve-nested-selector: 0.1.6 - postcss-safe-parser: 7.0.1(postcss@8.5.3) - postcss-selector-parser: 7.1.0 - postcss-value-parser: 4.2.0 - resolve-from: 5.0.0 - string-width: 4.2.3 - supports-hyperlinks: 3.2.0 - svg-tags: 1.0.0 - table: 6.9.0 - write-file-atomic: 5.0.1 - transitivePeerDependencies: - - supports-color - - typescript - stylis@4.2.0: {} sumchecker@3.0.1: @@ -18810,25 +18446,10 @@ snapshots: dependencies: has-flag: 4.0.0 - supports-hyperlinks@3.2.0: - dependencies: - has-flag: 4.0.0 - supports-color: 7.2.0 - supports-preserve-symlinks-flag@1.0.0: {} - svg-tags@1.0.0: {} - symbol-tree@3.2.4: {} - table@6.9.0: - dependencies: - ajv: 8.17.1 - lodash.truncate: 4.4.2 - slice-ansi: 4.0.0 - string-width: 4.2.3 - strip-ansi: 6.0.1 - tapable@2.2.2: {} tar-fs@2.1.3: @@ -19529,10 +19150,6 @@ snapshots: gopd: 1.2.0 has-tostringtag: 1.0.2 - which@1.3.1: - dependencies: - isexe: 2.0.0 - which@2.0.2: dependencies: isexe: 2.0.0 @@ -19582,11 +19199,6 @@ snapshots: imurmurhash: 0.1.4 signal-exit: 3.0.7 - write-file-atomic@5.0.1: - dependencies: - imurmurhash: 0.1.4 - signal-exit: 4.1.0 - ws@8.18.2: {} xml-name-validator@4.0.0: {} From 282a9bf9f7f1978c811d806cc7a775d40fd7ed6d Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:38:05 -0400 Subject: [PATCH 3/7] Remainder --- extension/package.json | 5 +- packages/redux-devtools-app-core/package.json | 8 +- .../src/containers/DevTools.tsx | 2 +- .../src/containers/monitors/Dispatcher.tsx | 14 +- .../monitors/InspectorWrapper/ChartTab.tsx | 2 +- .../InspectorWrapper/VisualDiffTab.tsx | 32 +- .../src/containers/monitors/Slider.tsx | 7 +- packages/redux-devtools-app/package.json | 8 +- packages/redux-devtools-cli/package.json | 3 +- .../demo/package.json | 5 +- .../package.json | 6 +- .../demo/package.json | 5 +- .../package.json | 6 +- .../examples/todomvc/package.json | 4 +- .../package.json | 6 +- pnpm-lock.yaml | 299 ++++++------------ 16 files changed, 141 insertions(+), 271 deletions(-) diff --git a/extension/package.json b/extension/package.json index 7d325845ca..4af769fc59 100644 --- a/extension/package.json +++ b/extension/package.json @@ -25,6 +25,7 @@ }, "dependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/app": "workspace:^", "@redux-devtools/core": "workspace:^", "@redux-devtools/instrument": "workspace:^", @@ -44,8 +45,7 @@ "react-json-tree": "workspace:^", "react-redux": "^9.2.0", "redux": "^5.0.1", - "redux-persist": "^6.0.0", - "styled-components": "^5.3.11" + "redux-persist": "^6.0.0" }, "devDependencies": { "@babel/core": "^7.27.1", @@ -60,7 +60,6 @@ "@types/lodash-es": "^4.17.12", "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", - "@types/styled-components": "^5.1.34", "chromedriver": "^126.0.5", "cross-env": "^7.0.3", "electron": "^31.7.7", diff --git a/packages/redux-devtools-app-core/package.json b/packages/redux-devtools-app-core/package.json index 446ec77b20..1943b2692f 100644 --- a/packages/redux-devtools-app-core/package.json +++ b/packages/redux-devtools-app-core/package.json @@ -61,6 +61,7 @@ "@babel/preset-react": "^7.27.1", "@babel/preset-typescript": "^7.27.1", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@reduxjs/toolkit": "^2.8.2", "@rjsf/core": "^5.24.10", "@testing-library/dom": "^10.4.0", @@ -72,7 +73,6 @@ "@types/node": "^22.15.21", "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", - "@types/styled-components": "^5.1.34", "cross-env": "^7.0.3", "esbuild": "^0.25.4", "jest": "^29.7.0", @@ -83,21 +83,19 @@ "redux": "^5.0.1", "redux-persist": "^6.0.0", "rimraf": "^6.0.1", - "styled-components": "^5.3.11", "ts-jest": "^29.3.4", "ts-node": "^10.9.2", "typescript": "~5.8.3" }, "peerDependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@reduxjs/toolkit": "^1.0.0 || ^2.0.0", "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", "react": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-redux": "^8.0.0 || ^9.0.0", "redux": "^4.0.0 || ^5.0.0", - "redux-persist": "^6.0.0", - "styled-components": "^5.3.11" + "redux-persist": "^6.0.0" } } diff --git a/packages/redux-devtools-app-core/src/containers/DevTools.tsx b/packages/redux-devtools-app-core/src/containers/DevTools.tsx index abebcec651..0f95f635fe 100644 --- a/packages/redux-devtools-app-core/src/containers/DevTools.tsx +++ b/packages/redux-devtools-app-core/src/containers/DevTools.tsx @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import { withTheme } from 'styled-components'; +import { withTheme } from '@emotion/react'; import { LiftedAction, LiftedState } from '@redux-devtools/core'; import { Action } from 'redux'; import getMonitor from '../utils/getMonitor'; diff --git a/packages/redux-devtools-app-core/src/containers/monitors/Dispatcher.tsx b/packages/redux-devtools-app-core/src/containers/monitors/Dispatcher.tsx index 4e339fae78..15f4d65f1c 100644 --- a/packages/redux-devtools-app-core/src/containers/monitors/Dispatcher.tsx +++ b/packages/redux-devtools-app-core/src/containers/monitors/Dispatcher.tsx @@ -1,8 +1,14 @@ // Based on https://github.com/YoruNoHikage/redux-devtools-dispatch import React, { Component } from 'react'; -import styled from 'styled-components'; -import { Button, Select, Editor, Toolbar } from '@redux-devtools/ui'; +import styled from '@emotion/styled'; +import { + Button, + Select, + Editor, + Toolbar, + Base16Theme, +} from '@redux-devtools/ui'; import { connect, ResolveThunks } from 'react-redux'; import { dispatchRemotely } from '../../actions'; import { Options } from '../../reducers/instances'; @@ -12,7 +18,7 @@ export const DispatcherContainer = styled.div` flex-direction: column; flex-shrink: 0; padding-top: 2px; - background: ${(props) => props.theme.base01}; + background: ${(props: { theme?: Base16Theme }) => props.theme!.base01}; `; export const CodeContainer = styled.div` @@ -24,7 +30,7 @@ export const CodeContainer = styled.div` export const ActionContainer = styled.div` display: table; width: 100%; - color: ${(props) => props.theme.base06}; + color: ${(props: { theme?: Base16Theme }) => props.theme!.base06}; > div { display: table-row; diff --git a/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/ChartTab.tsx b/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/ChartTab.tsx index 15a00cf98d..a116d15c3c 100644 --- a/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/ChartTab.tsx +++ b/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/ChartTab.tsx @@ -1,6 +1,6 @@ import React, { Component, RefCallback } from 'react'; import { connect, ResolveThunks } from 'react-redux'; -import { withTheme } from 'styled-components'; +import { withTheme } from '@emotion/react'; import { tree } from 'd3-state-visualizer'; import type { HierarchyPointNode, Node, Options } from 'd3-state-visualizer'; import { getPath } from '../ChartMonitorWrapper'; diff --git a/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/VisualDiffTab.tsx b/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/VisualDiffTab.tsx index 60a84aaa40..e696fdcb16 100644 --- a/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/VisualDiffTab.tsx +++ b/packages/redux-devtools-app-core/src/containers/monitors/InspectorWrapper/VisualDiffTab.tsx @@ -1,8 +1,8 @@ import React, { Component } from 'react'; import type { Delta } from 'jsondiffpatch'; import * as htmlFormatter from 'jsondiffpatch/formatters/html'; -import styled, { ThemedStyledProps } from 'styled-components'; -import { effects, Theme } from '@redux-devtools/ui'; +import styled from '@emotion/styled'; +import { Base16Theme, effects } from '@redux-devtools/ui'; export const StyledContainer = styled.div` .jsondiffpatch-delta { @@ -19,8 +19,7 @@ export const StyledContainer = styled.div` padding: 2px 3px; border-radius: 3px; position: relative; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - color: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base07}; + color: ${(props: { theme?: Base16Theme }) => props.theme!.base07}; display: inline-block; } @@ -44,25 +43,22 @@ export const StyledContainer = styled.div` .jsondiffpatch-modified .jsondiffpatch-right-value:before { vertical-align: top; padding: 2px; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - color: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base0E}; + color: ${(props) => props.theme.base0E}; content: ' => '; } .jsondiffpatch-added .jsondiffpatch-value pre, .jsondiffpatch-modified .jsondiffpatch-right-value pre, .jsondiffpatch-textdiff-added { - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - background: ${(props: ThemedStyledProps<{}, Theme>) => - effects.color(props.theme.base0B, 'alpha', 0.2)}; + background: ${(props: { theme?: Base16Theme }) => + effects.color(props.theme!.base0B, 'alpha', 0.2)}; } .jsondiffpatch-deleted pre, .jsondiffpatch-modified .jsondiffpatch-left-value pre, .jsondiffpatch-textdiff-deleted { - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - background: ${(props: ThemedStyledProps<{}, Theme>) => - effects.color(props.theme.base08, 'alpha', 0.2)}; + background: ${(props: { theme?: Base16Theme }) => + effects.color(props.theme!.base08, 'alpha', 0.2)}; text-decoration: line-through; } @@ -129,14 +125,12 @@ export const StyledContainer = styled.div` padding: 2px 0; padding-right: 5px; vertical-align: top; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - color: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base0D}; + color: ${(props) => props.theme.base0D}; } .jsondiffpatch-property-name:after { content: ': '; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - color: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base07}; + color: ${(props) => props.theme.base07}; } .jsondiffpatch-child-node-type-array > .jsondiffpatch-property-name:after { @@ -172,8 +166,7 @@ export const StyledContainer = styled.div` } .jsondiffpatch-value pre:after { - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - color: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base07}; + color: ${(props) => props.theme.base07}; content: ','; } @@ -196,8 +189,7 @@ export const StyledContainer = styled.div` .jsondiffpatch-moved .jsondiffpatch-moved-destination { display: inline-block; - ${/* eslint-disable-next-line @typescript-eslint/no-empty-object-type */ ''} - background: ${(props: ThemedStyledProps<{}, Theme>) => props.theme.base0A}; + background: ${(props) => props.theme.base0A}; } .jsondiffpatch-moved .jsondiffpatch-moved-destination:before { diff --git a/packages/redux-devtools-app-core/src/containers/monitors/Slider.tsx b/packages/redux-devtools-app-core/src/containers/monitors/Slider.tsx index 74a5f11d57..44ba7cd8f6 100644 --- a/packages/redux-devtools-app-core/src/containers/monitors/Slider.tsx +++ b/packages/redux-devtools-app-core/src/containers/monitors/Slider.tsx @@ -1,13 +1,14 @@ import React, { Component } from 'react'; -import styled, { withTheme } from 'styled-components'; +import styled from '@emotion/styled'; +import { withTheme } from '@emotion/react'; import { SliderMonitor } from '@redux-devtools/slider-monitor'; import { LiftedAction } from '@redux-devtools/core'; import { Action } from 'redux'; -import { ThemeFromProvider } from '@redux-devtools/ui'; +import { Base16Theme, ThemeFromProvider } from '@redux-devtools/ui'; import { State } from '../../reducers/instances'; const SliderWrapper = styled.div` - border-color: ${(props) => props.theme.base02}; + border-color: ${(props: { theme?: Base16Theme }) => props.theme!.base02}; border-style: solid; border-width: 1px 0; `; diff --git a/packages/redux-devtools-app/package.json b/packages/redux-devtools-app/package.json index e2a1b89e9a..9529e4e70a 100644 --- a/packages/redux-devtools-app/package.json +++ b/packages/redux-devtools-app/package.json @@ -57,6 +57,7 @@ "@babel/preset-react": "^7.27.1", "@babel/preset-typescript": "^7.27.1", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@reduxjs/toolkit": "^2.8.2", "@rjsf/core": "^5.24.10", "@types/jsan": "^3.1.5", @@ -65,7 +66,6 @@ "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", "@types/socketcluster-client": "^19.1.0", - "@types/styled-components": "^5.1.34", "@types/webpack-env": "^1.18.8", "babel-loader": "^10.0.0", "cross-env": "^7.0.3", @@ -79,7 +79,6 @@ "react-dom": "^19.1.0", "rimraf": "^6.0.1", "style-loader": "^4.0.0", - "styled-components": "^5.3.11", "ts-jest": "^29.3.4", "ts-node": "^10.9.2", "typescript": "~5.8.3", @@ -89,11 +88,10 @@ }, "peerDependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@reduxjs/toolkit": "^1.0.0 || ^2.0.0", "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", "react": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "react-dom": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "styled-components": "^5.3.11" + "react-dom": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0" } } diff --git a/packages/redux-devtools-cli/package.json b/packages/redux-devtools-cli/package.json index b322846417..26a778595a 100644 --- a/packages/redux-devtools-cli/package.json +++ b/packages/redux-devtools-cli/package.json @@ -43,6 +43,7 @@ "dependencies": { "@apollo/server": "^4.12.1", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/app": "workspace:^", "@reduxjs/toolkit": "^2.8.2", "@types/react": "^19.1.6", @@ -65,7 +66,6 @@ "semver": "^7.7.2", "socketcluster-server": "^19.1.1", "sqlite3": "^5.1.7", - "styled-components": "^5.3.11", "uuid": "^11.1.0" }, "devDependencies": { @@ -81,7 +81,6 @@ "@types/semver": "^7.7.0", "@types/socketcluster-client": "^19.1.0", "@types/socketcluster-server": "^19.0.1", - "@types/styled-components": "^5.1.34", "@types/supertest": "^6.0.3", "@types/uuid": "^10.0.0", "globals": "^16.1.0", diff --git a/packages/redux-devtools-inspector-monitor-test-tab/demo/package.json b/packages/redux-devtools-inspector-monitor-test-tab/demo/package.json index db5cecde43..4f727ceec4 100644 --- a/packages/redux-devtools-inspector-monitor-test-tab/demo/package.json +++ b/packages/redux-devtools-inspector-monitor-test-tab/demo/package.json @@ -11,6 +11,7 @@ }, "dependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@redux-devtools/dock-monitor": "workspace:^", "@redux-devtools/inspector-monitor": "workspace:^", @@ -24,8 +25,7 @@ "react-redux": "^9.2.0", "react-router-dom": "^7.6.1", "redux": "^5.0.1", - "redux-logger": "^3.0.6", - "styled-components": "^5.3.11" + "redux-logger": "^3.0.6" }, "devDependencies": { "@babel/core": "^7.27.1", @@ -37,7 +37,6 @@ "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", "@types/redux-logger": "^3.0.13", - "@types/styled-components": "^5.1.34", "@types/webpack-env": "^1.18.8", "babel-loader": "^10.0.0", "cross-env": "^7.0.3", diff --git a/packages/redux-devtools-inspector-monitor-test-tab/package.json b/packages/redux-devtools-inspector-monitor-test-tab/package.json index 2959967854..f3762d44bb 100644 --- a/packages/redux-devtools-inspector-monitor-test-tab/package.json +++ b/packages/redux-devtools-inspector-monitor-test-tab/package.json @@ -61,6 +61,7 @@ "@babel/preset-react": "^7.27.1", "@babel/preset-typescript": "^7.27.1", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@redux-devtools/inspector-monitor": "workspace:^", "@testing-library/dom": "^10.4.0", @@ -81,12 +82,11 @@ }, "peerDependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/inspector-monitor": "workspace:^", "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", "react": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "redux": "^3.4.0 || ^4.0.0 || ^5.0.0", - "styled-components": "^5.3.11" + "redux": "^3.4.0 || ^4.0.0 || ^5.0.0" } } diff --git a/packages/redux-devtools-rtk-query-monitor/demo/package.json b/packages/redux-devtools-rtk-query-monitor/demo/package.json index e4f18afb07..0255660f6e 100644 --- a/packages/redux-devtools-rtk-query-monitor/demo/package.json +++ b/packages/redux-devtools-rtk-query-monitor/demo/package.json @@ -13,6 +13,7 @@ "@babel/runtime": "^7.27.1", "@chakra-ui/react": "^3.19.1", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@mswjs/data": "^0.16.2", "@redux-devtools/core": "workspace:^", "@redux-devtools/dock-monitor": "workspace:^", @@ -24,8 +25,7 @@ "react-icons": "^5.5.0", "react-is": "^19.1.0", "react-redux": "^9.2.0", - "react-router-dom": "^7.6.1", - "styled-components": "^5.3.11" + "react-router-dom": "^7.6.1" }, "devDependencies": { "@babel/core": "^7.27.1", @@ -36,7 +36,6 @@ "@types/node": "^22.15.21", "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", - "@types/styled-components": "^5.1.34", "babel-loader": "^10.0.0", "copy-webpack-plugin": "^13.0.0", "cross-env": "^7.0.3", diff --git a/packages/redux-devtools-rtk-query-monitor/package.json b/packages/redux-devtools-rtk-query-monitor/package.json index 24e51c2259..98c36129e3 100644 --- a/packages/redux-devtools-rtk-query-monitor/package.json +++ b/packages/redux-devtools-rtk-query-monitor/package.json @@ -63,6 +63,7 @@ "@babel/preset-typescript": "^7.27.1", "@emotion/babel-preset-css-prop": "^11.12.0", "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@reduxjs/toolkit": "^2.8.2", "@testing-library/dom": "^10.4.0", @@ -84,12 +85,11 @@ }, "peerDependencies": { "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@reduxjs/toolkit": "^1.0.0 || ^2.0.0", "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", "react": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "redux": "^3.4.0 || ^4.0.0 || ^5.0.0", - "styled-components": "^5.3.11" + "redux": "^3.4.0 || ^4.0.0 || ^5.0.0" } } diff --git a/packages/redux-devtools-slider-monitor/examples/todomvc/package.json b/packages/redux-devtools-slider-monitor/examples/todomvc/package.json index 6932b03beb..b2b6bbebed 100644 --- a/packages/redux-devtools-slider-monitor/examples/todomvc/package.json +++ b/packages/redux-devtools-slider-monitor/examples/todomvc/package.json @@ -15,6 +15,8 @@ "type-check": "tsc --noEmit" }, "dependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@redux-devtools/dock-monitor": "workspace:^", "@redux-devtools/log-monitor": "workspace:^", @@ -25,7 +27,6 @@ "react-is": "^19.1.0", "react-redux": "^9.2.0", "redux": "^5.0.1", - "styled-components": "^5.3.11", "todomvc-app-css": "^2.4.3" }, "devDependencies": { @@ -36,7 +37,6 @@ "@types/node": "^22.15.21", "@types/react": "^19.1.6", "@types/react-dom": "^19.1.5", - "@types/styled-components": "^5.1.34", "@types/webpack-env": "^1.18.8", "babel-loader": "^10.0.0", "cross-env": "^7.0.3", diff --git a/packages/redux-devtools-slider-monitor/package.json b/packages/redux-devtools-slider-monitor/package.json index f63b77df93..a55aef97dc 100644 --- a/packages/redux-devtools-slider-monitor/package.json +++ b/packages/redux-devtools-slider-monitor/package.json @@ -52,11 +52,11 @@ "typescript": "~5.8.3" }, "peerDependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", "@redux-devtools/core": "workspace:^", "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "@types/styled-components": "^5.1.34", "react": "^16.8.4 || ^17.0.0 || ^18.0.0 || ^19.0.0", - "redux": "^3.4.0 || ^4.0.0 || ^5.0.0", - "styled-components": "^5.3.11" + "redux": "^3.4.0 || ^4.0.0 || ^5.0.0" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 47ab0856e1..44849e1812 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -64,6 +64,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/app': specifier: workspace:^ version: link:../packages/redux-devtools-app @@ -124,9 +127,6 @@ importers: redux-persist: specifier: ^6.0.0 version: 6.0.0(react@19.1.0)(redux@5.0.1) - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/core': specifier: ^7.27.1 @@ -164,9 +164,6 @@ importers: '@types/react-dom': specifier: ^19.1.5 version: 19.1.5(@types/react@19.1.6) - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 chromedriver: specifier: ^126.0.5 version: 126.0.5 @@ -687,6 +684,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@reduxjs/toolkit': specifier: ^2.8.2 version: 2.8.2(react-redux@9.2.0(@types/react@19.1.6)(react@19.1.0)(redux@5.0.1))(react@19.1.0) @@ -711,9 +711,6 @@ importers: '@types/socketcluster-client': specifier: ^19.1.0 version: 19.1.0 - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 '@types/webpack-env': specifier: ^1.18.8 version: 1.18.8 @@ -753,9 +750,6 @@ importers: style-loader: specifier: ^4.0.0 version: 4.0.0(webpack@5.99.9) - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) ts-jest: specifier: ^29.3.4 version: 29.3.4(@babel/core@7.27.1)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.27.1))(esbuild@0.25.4)(jest@29.7.0(@types/node@22.15.21)(babel-plugin-macros@3.1.0)(ts-node@10.9.2(@swc/core@1.11.29(@swc/helpers@0.5.17))(@types/node@22.15.21)(typescript@5.8.3)))(typescript@5.8.3) @@ -850,6 +844,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@reduxjs/toolkit': specifier: ^2.8.2 version: 2.8.2(react-redux@9.2.0(@types/react@19.1.6)(react@19.1.0)(redux@5.0.1))(react@19.1.0) @@ -883,9 +880,6 @@ importers: '@types/react-dom': specifier: ^19.1.5 version: 19.1.5(@types/react@19.1.6) - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 cross-env: specifier: ^7.0.3 version: 7.0.3 @@ -916,9 +910,6 @@ importers: rimraf: specifier: ^6.0.1 version: 6.0.1 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) ts-jest: specifier: ^29.3.4 version: 29.3.4(@babel/core@7.27.1)(@jest/transform@29.7.0)(@jest/types@29.6.3)(babel-jest@29.7.0(@babel/core@7.27.1))(esbuild@0.25.4)(jest@29.7.0(@types/node@22.15.21)(babel-plugin-macros@3.1.0)(ts-node@10.9.2(@swc/core@1.11.29(@swc/helpers@0.5.17))(@types/node@22.15.21)(typescript@5.8.3)))(typescript@5.8.3) @@ -992,6 +983,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/app': specifier: workspace:^ version: link:../redux-devtools-app @@ -1058,9 +1052,6 @@ importers: sqlite3: specifier: ^5.1.7 version: 5.1.7 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) uuid: specifier: ^11.1.0 version: 11.1.0 @@ -1101,9 +1092,6 @@ importers: '@types/socketcluster-server': specifier: ^19.0.1 version: 19.0.1 - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 '@types/supertest': specifier: ^6.0.3 version: 6.0.3 @@ -1335,9 +1323,6 @@ importers: '@redux-devtools/ui': specifier: workspace:^ version: link:../redux-devtools-ui - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 es6template: specifier: ^1.0.5 version: 1.0.5 @@ -1356,9 +1341,6 @@ importers: simple-diff: specifier: ^1.7.2 version: 1.7.2 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/cli': specifier: ^7.27.2 @@ -1384,6 +1366,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/core': specifier: workspace:^ version: link:../redux-devtools @@ -1441,6 +1426,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/core': specifier: workspace:^ version: link:../../redux-devtools @@ -1483,9 +1471,6 @@ importers: redux-logger: specifier: ^3.0.6 version: 3.0.6 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/core': specifier: ^7.27.1 @@ -1514,9 +1499,6 @@ importers: '@types/redux-logger': specifier: ^3.0.13 version: 3.0.13 - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 '@types/webpack-env': specifier: ^1.18.8 version: 1.18.8 @@ -1950,9 +1932,6 @@ importers: '@types/lodash': specifier: ^4.17.17 version: 4.17.17 - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 hex-rgba: specifier: ^1.0.2 version: 1.0.2 @@ -1968,9 +1947,6 @@ importers: react-json-tree: specifier: workspace:^ version: link:../react-json-tree - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/cli': specifier: ^7.27.2 @@ -1999,6 +1975,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/core': specifier: workspace:^ version: link:../redux-devtools @@ -2065,6 +2044,9 @@ importers: '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@mswjs/data': specifier: ^0.16.2 version: 0.16.2(@types/node@22.15.21)(typescript@5.8.3) @@ -2101,9 +2083,6 @@ importers: react-router-dom: specifier: ^7.6.1 version: 7.6.1(react-dom@19.1.0(react@19.1.0))(react@19.1.0) - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/core': specifier: ^7.27.1 @@ -2129,9 +2108,6 @@ importers: '@types/react-dom': specifier: ^19.1.5 version: 19.1.5(@types/react@19.1.6) - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 babel-loader: specifier: ^10.0.0 version: 10.0.0(@babel/core@7.27.1)(webpack@5.99.9) @@ -2223,18 +2199,18 @@ importers: '@babel/runtime': specifier: ^7.27.1 version: 7.27.1 + '@emotion/react': + specifier: ^11.14.0 + version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/ui': specifier: workspace:^ version: link:../redux-devtools-ui - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 react-base16-styling: specifier: workspace:^ version: link:../react-base16-styling - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) devDependencies: '@babel/cli': specifier: ^7.27.2 @@ -2278,6 +2254,12 @@ importers: packages/redux-devtools-slider-monitor/examples/todomvc: dependencies: + '@emotion/react': + specifier: ^11.14.0 + version: 11.14.0(@types/react@19.1.6)(react@19.1.0) + '@emotion/styled': + specifier: ^11.14.0 + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.1.6)(react@19.1.0))(@types/react@19.1.6)(react@19.1.0) '@redux-devtools/core': specifier: workspace:^ version: link:../../../redux-devtools @@ -2308,9 +2290,6 @@ importers: redux: specifier: ^5.0.1 version: 5.0.1 - styled-components: - specifier: ^5.3.11 - version: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) todomvc-app-css: specifier: ^2.4.3 version: 2.4.3 @@ -2336,9 +2315,6 @@ importers: '@types/react-dom': specifier: ^19.1.5 version: 19.1.5(@types/react@19.1.6) - '@types/styled-components': - specifier: ^5.1.34 - version: 5.1.34 '@types/webpack-env': specifier: ^1.18.8 version: 1.18.8 @@ -3654,15 +3630,9 @@ packages: '@types/react': optional: true - '@emotion/stylis@0.8.5': - resolution: {integrity: sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==} - '@emotion/unitless@0.10.0': resolution: {integrity: sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==} - '@emotion/unitless@0.7.5': - resolution: {integrity: sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==} - '@emotion/use-insertion-effect-with-fallbacks@1.2.0': resolution: {integrity: sha512-yJMtVdH59sxi/aVJBpk9FQq+OR8ll5GT8oWd57UpeaKEVGab41JWaCFA7FRLoMLloOZF/c/wsPoe+bfGmRKgDg==} peerDependencies: @@ -4782,9 +4752,6 @@ packages: '@types/hex-rgba@1.0.3': resolution: {integrity: sha512-yUcRdf2uwKR97Kv/l/UeOg+rfB7HAI/vLdctkQntJTWJyx/ParAekUtKgSrzLgZzURCPEa/SY1Py9HKeAo4cPA==} - '@types/hoist-non-react-statics@3.3.6': - resolution: {integrity: sha512-lPByRJUer/iN/xa4qpyL0qmL11DqNW81iU/IG1S3uvRUq4oKagz8VCxZjiWkumgt66YT3vOdDgZ0o32sGKtCEw==} - '@types/html-minifier-terser@6.1.0': resolution: {integrity: sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==} @@ -4966,9 +4933,6 @@ packages: '@types/stream-demux@10.0.0': resolution: {integrity: sha512-BQD0DEq7o07IROdAaKrj8GQS1QBKKRhXE18vCT3HgDF6HHk8z3wMKLQw+5rGm3snnyUHOepQd25p4U40hkJRhQ==} - '@types/styled-components@5.1.34': - resolution: {integrity: sha512-mmiVvwpYklFIv9E8qfxuPyIt/OuyIrn6gMOAMOFUO3WJfSrSE+sGUoa4PiZj77Ut7bKZpaa6o1fBKS/4TOEvnA==} - '@types/superagent@8.1.9': resolution: {integrity: sha512-pTVjI73witn+9ILmoJdajHGW2jkSaOzhiFYF1Rd3EQ94kymLqB9PjD9ISg7WaALC7+dCHT0FGe9T2LktLq/3GQ==} @@ -5621,11 +5585,6 @@ packages: peerDependencies: '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0 - babel-plugin-styled-components@2.1.4: - resolution: {integrity: sha512-Xgp9g+A/cG47sUyRwwYxGM4bR/jDRg5N6it/8+HxCnbT5XNKSKDT9xm4oag/osgqjC2It/vH0yXsomOG6k558g==} - peerDependencies: - styled-components: '>= 2' - babel-preset-current-node-syntax@1.1.0: resolution: {integrity: sha512-ldYss8SbBlWva1bs28q78Ju5Zq1F+8BrqBZZ0VFhLBvhh6lCpC2o3gDJi/5DRLs9FgYZCnmPYIVFU4lRXCkyUw==} peerDependencies: @@ -5778,9 +5737,6 @@ packages: resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==} engines: {node: '>=10'} - camelize@1.0.1: - resolution: {integrity: sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==} - caniuse-lite@1.0.30001718: resolution: {integrity: sha512-AflseV1ahcSunK53NfEs9gFWgOEmzr0f+kaMFA4xiLZlr9Hzt7HxcSpIFcnNCUkz6R6dWKa54rUz3HUmI3nVcw==} @@ -6067,10 +6023,6 @@ packages: crypt@0.0.2: resolution: {integrity: sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow==} - css-color-keywords@1.0.0: - resolution: {integrity: sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==} - engines: {node: '>=4'} - css-loader@7.1.2: resolution: {integrity: sha512-6WvYYn7l/XEGN8Xu2vWFt9nVzrCn39vKyTEFf/ExEyoksJjjSZV/0/35XPlMbpnr6VGhZIUg5yJrL8tGfes/FA==} engines: {node: '>= 18.12.0'} @@ -6086,9 +6038,6 @@ packages: css-select@4.3.0: resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==} - css-to-react-native@3.2.0: - resolution: {integrity: sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==} - css-what@6.1.0: resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==} engines: {node: '>= 6'} @@ -9180,9 +9129,6 @@ packages: resolution: {integrity: sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==} engines: {node: '>=8'} - shallowequal@1.1.0: - resolution: {integrity: sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==} - shebang-command@2.0.0: resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==} engines: {node: '>=8'} @@ -9423,14 +9369,6 @@ packages: peerDependencies: webpack: ^5.27.0 - styled-components@5.3.11: - resolution: {integrity: sha512-uuzIIfnVkagcVHv9nE0VPlHPSCmXIUGKfJ42LNjxCCTDTL5sgnJ8Z7GZBq0EnLYGln77tPpEpExt2+qa+cZqSw==} - engines: {node: '>=10'} - peerDependencies: - react: '>= 16.8.0' - react-dom: '>= 16.8.0' - react-is: '>= 16.8.0' - stylis@4.2.0: resolution: {integrity: sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==} @@ -10340,10 +10278,10 @@ snapshots: '@babel/helpers': 7.27.1 '@babel/parser': 7.27.2 '@babel/template': 7.27.2 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 convert-source-map: 2.0.0 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -10386,7 +10324,7 @@ snapshots: '@babel/helper-optimise-call-expression': 7.27.1 '@babel/helper-replace-supers': 7.27.1(@babel/core@7.27.1) '@babel/helper-skip-transparent-expression-wrappers': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 semver: 6.3.1 transitivePeerDependencies: - supports-color @@ -10403,7 +10341,7 @@ snapshots: '@babel/core': 7.27.1 '@babel/helper-compilation-targets': 7.27.2 '@babel/helper-plugin-utils': 7.27.1 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 lodash.debounce: 4.0.8 resolve: 1.22.10 transitivePeerDependencies: @@ -10411,14 +10349,14 @@ snapshots: '@babel/helper-member-expression-to-functions@7.27.1': dependencies: - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 transitivePeerDependencies: - supports-color - '@babel/helper-module-imports@7.27.1(supports-color@5.5.0)': + '@babel/helper-module-imports@7.27.1': dependencies: - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 transitivePeerDependencies: - supports-color @@ -10426,9 +10364,9 @@ snapshots: '@babel/helper-module-transforms@7.27.1(@babel/core@7.27.1)': dependencies: '@babel/core': 7.27.1 - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) + '@babel/helper-module-imports': 7.27.1 '@babel/helper-validator-identifier': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10443,7 +10381,7 @@ snapshots: '@babel/core': 7.27.1 '@babel/helper-annotate-as-pure': 7.27.1 '@babel/helper-wrap-function': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10452,13 +10390,13 @@ snapshots: '@babel/core': 7.27.1 '@babel/helper-member-expression-to-functions': 7.27.1 '@babel/helper-optimise-call-expression': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color '@babel/helper-skip-transparent-expression-wrappers@7.27.1': dependencies: - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 transitivePeerDependencies: - supports-color @@ -10474,7 +10412,7 @@ snapshots: '@babel/helper-wrap-function@7.27.1': dependencies: '@babel/template': 7.27.2 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 transitivePeerDependencies: - supports-color @@ -10492,7 +10430,7 @@ snapshots: dependencies: '@babel/core': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10519,7 +10457,7 @@ snapshots: dependencies: '@babel/core': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10633,14 +10571,14 @@ snapshots: '@babel/core': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 '@babel/helper-remap-async-to-generator': 7.27.1(@babel/core@7.27.1) - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color '@babel/plugin-transform-async-to-generator@7.27.1(@babel/core@7.27.1)': dependencies: '@babel/core': 7.27.1 - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) + '@babel/helper-module-imports': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 '@babel/helper-remap-async-to-generator': 7.27.1(@babel/core@7.27.1) transitivePeerDependencies: @@ -10679,7 +10617,7 @@ snapshots: '@babel/helper-compilation-targets': 7.27.2 '@babel/helper-plugin-utils': 7.27.1 '@babel/helper-replace-supers': 7.27.1(@babel/core@7.27.1) - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 globals: 11.12.0 transitivePeerDependencies: - supports-color @@ -10740,7 +10678,7 @@ snapshots: '@babel/core': 7.27.1 '@babel/helper-compilation-targets': 7.27.2 '@babel/helper-plugin-utils': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10786,7 +10724,7 @@ snapshots: '@babel/helper-module-transforms': 7.27.1(@babel/core@7.27.1) '@babel/helper-plugin-utils': 7.27.1 '@babel/helper-validator-identifier': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 transitivePeerDependencies: - supports-color @@ -10891,7 +10829,7 @@ snapshots: dependencies: '@babel/core': 7.27.1 '@babel/helper-annotate-as-pure': 7.27.1 - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) + '@babel/helper-module-imports': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 '@babel/plugin-syntax-jsx': 7.27.1(@babel/core@7.27.1) '@babel/types': 7.27.1 @@ -10923,7 +10861,7 @@ snapshots: '@babel/plugin-transform-runtime@7.27.1(@babel/core@7.27.1)': dependencies: '@babel/core': 7.27.1 - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) + '@babel/helper-module-imports': 7.27.1 '@babel/helper-plugin-utils': 7.27.1 babel-plugin-polyfill-corejs2: 0.4.13(@babel/core@7.27.1) babel-plugin-polyfill-corejs3: 0.11.1(@babel/core@7.27.1) @@ -11116,14 +11054,14 @@ snapshots: '@babel/parser': 7.27.2 '@babel/types': 7.27.1 - '@babel/traverse@7.27.1(supports-color@5.5.0)': + '@babel/traverse@7.27.1': dependencies: '@babel/code-frame': 7.27.1 '@babel/generator': 7.27.1 '@babel/parser': 7.27.2 '@babel/template': 7.27.2 '@babel/types': 7.27.1 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 globals: 11.12.0 transitivePeerDependencies: - supports-color @@ -11348,7 +11286,7 @@ snapshots: '@electron/get@2.0.3': dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 env-paths: 2.2.1 fs-extra: 8.1.0 got: 11.8.6 @@ -11367,7 +11305,7 @@ snapshots: '@emotion/babel-plugin@11.13.5': dependencies: - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) + '@babel/helper-module-imports': 7.27.1 '@babel/runtime': 7.27.1 '@emotion/hash': 0.9.2 '@emotion/memoize': 0.9.0 @@ -11448,12 +11386,8 @@ snapshots: transitivePeerDependencies: - supports-color - '@emotion/stylis@0.8.5': {} - '@emotion/unitless@0.10.0': {} - '@emotion/unitless@0.7.5': {} - '@emotion/use-insertion-effect-with-fallbacks@1.2.0(react@19.1.0)': dependencies: react: 19.1.0 @@ -11551,7 +11485,7 @@ snapshots: '@eslint/config-array@0.20.0': dependencies: '@eslint/object-schema': 2.1.6 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 minimatch: 3.1.2 transitivePeerDependencies: - supports-color @@ -11565,7 +11499,7 @@ snapshots: '@eslint/eslintrc@3.3.1': dependencies: ajv: 6.12.6 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 espree: 10.3.0 globals: 14.0.0 ignore: 5.3.2 @@ -11933,7 +11867,7 @@ snapshots: '@types/pluralize': 0.0.29 '@types/uuid': 8.3.4 date-fns: 2.30.0 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 graphql: 16.11.0 lodash: 4.17.21 md5: 2.3.0 @@ -12649,11 +12583,6 @@ snapshots: '@types/hex-rgba@1.0.3': {} - '@types/hoist-non-react-statics@3.3.6': - dependencies: - '@types/react': 19.1.6 - hoist-non-react-statics: 3.3.2 - '@types/html-minifier-terser@6.1.0': {} '@types/http-cache-semantics@4.0.4': {} @@ -12853,12 +12782,6 @@ snapshots: '@types/consumable-stream': 3.0.0 '@types/writable-consumable-stream': 4.1.0 - '@types/styled-components@5.1.34': - dependencies: - '@types/hoist-non-react-statics': 3.3.6 - '@types/react': 19.1.6 - csstype: 3.1.3 - '@types/superagent@8.1.9': dependencies: '@types/cookiejar': 2.1.5 @@ -12929,7 +12852,7 @@ snapshots: '@typescript-eslint/types': 8.32.1 '@typescript-eslint/typescript-estree': 8.32.1(typescript@5.8.3) '@typescript-eslint/visitor-keys': 8.32.1 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 eslint: 9.27.0 typescript: 5.8.3 transitivePeerDependencies: @@ -12944,7 +12867,7 @@ snapshots: dependencies: '@typescript-eslint/typescript-estree': 8.32.1(typescript@5.8.3) '@typescript-eslint/utils': 8.32.1(eslint@9.27.0)(typescript@5.8.3) - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 eslint: 9.27.0 ts-api-utils: 2.1.0(typescript@5.8.3) typescript: 5.8.3 @@ -12957,7 +12880,7 @@ snapshots: dependencies: '@typescript-eslint/types': 8.32.1 '@typescript-eslint/visitor-keys': 8.32.1 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 fast-glob: 3.3.3 is-glob: 4.0.3 minimatch: 9.0.5 @@ -13645,7 +13568,7 @@ snapshots: agent-base@6.0.2: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color @@ -13912,18 +13835,6 @@ snapshots: transitivePeerDependencies: - supports-color - babel-plugin-styled-components@2.1.4(@babel/core@7.27.1)(styled-components@5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0))(supports-color@5.5.0): - dependencies: - '@babel/helper-annotate-as-pure': 7.27.1 - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) - '@babel/plugin-syntax-jsx': 7.27.1(@babel/core@7.27.1) - lodash: 4.17.21 - picomatch: 2.3.1 - styled-components: 5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0) - transitivePeerDependencies: - - '@babel/core' - - supports-color - babel-preset-current-node-syntax@1.1.0(@babel/core@7.27.1): dependencies: '@babel/core': 7.27.1 @@ -14128,8 +14039,6 @@ snapshots: camelcase@6.3.0: {} - camelize@1.0.1: {} - caniuse-lite@1.0.30001718: {} chai@5.2.0: @@ -14417,8 +14326,6 @@ snapshots: crypt@0.0.2: {} - css-color-keywords@1.0.0: {} - css-loader@7.1.2(webpack@5.99.9): dependencies: icss-utils: 5.1.0(postcss@8.5.3) @@ -14440,12 +14347,6 @@ snapshots: domutils: 2.8.0 nth-check: 2.1.1 - css-to-react-native@3.2.0: - dependencies: - camelize: 1.0.1 - css-color-keywords: 1.0.0 - postcss-value-parser: 4.2.0 - css-what@6.1.0: {} css.escape@1.5.1: {} @@ -14658,11 +14559,9 @@ snapshots: dependencies: ms: 2.1.2 - debug@4.4.1(supports-color@5.5.0): + debug@4.4.1: dependencies: ms: 2.1.3 - optionalDependencies: - supports-color: 5.5.0 decimal.js@10.5.0: {} @@ -14997,7 +14896,7 @@ snapshots: esbuild-register@3.6.0(esbuild@0.25.4): dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 esbuild: 0.25.4 transitivePeerDependencies: - supports-color @@ -15121,7 +15020,7 @@ snapshots: ajv: 6.12.6 chalk: 4.1.2 cross-spawn: 7.0.6 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 escape-string-regexp: 4.0.0 eslint-scope: 8.3.0 eslint-visitor-keys: 4.2.0 @@ -15249,7 +15148,7 @@ snapshots: extract-zip@2.0.1: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 get-stream: 5.2.0 yauzl: 2.10.0 optionalDependencies: @@ -15501,7 +15400,7 @@ snapshots: dependencies: basic-ftp: 5.0.5 data-uri-to-buffer: 6.0.2 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color @@ -15722,7 +15621,7 @@ snapshots: dependencies: '@tootallnate/once': 1.1.2 agent-base: 6.0.2 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color optional: true @@ -15731,14 +15630,14 @@ snapshots: dependencies: '@tootallnate/once': 2.0.0 agent-base: 6.0.2 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color http-proxy-agent@7.0.2: dependencies: agent-base: 7.1.3 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color @@ -15770,14 +15669,14 @@ snapshots: https-proxy-agent@5.0.1: dependencies: agent-base: 6.0.2 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color https-proxy-agent@7.0.6: dependencies: agent-base: 7.1.3 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color @@ -16084,7 +15983,7 @@ snapshots: istanbul-lib-source-maps@4.0.1: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 istanbul-lib-coverage: 3.2.2 source-map: 0.6.1 transitivePeerDependencies: @@ -17191,7 +17090,7 @@ snapshots: dependencies: '@tootallnate/quickjs-emscripten': 0.23.0 agent-base: 7.1.3 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 get-uri: 6.0.4 http-proxy-agent: 7.0.2 https-proxy-agent: 7.0.6 @@ -17418,7 +17317,7 @@ snapshots: proxy-agent@6.5.0: dependencies: agent-base: 7.1.3 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 http-proxy-agent: 7.0.2 https-proxy-agent: 7.0.6 lru-cache: 7.18.3 @@ -17581,7 +17480,7 @@ snapshots: react-docgen@8.0.0: dependencies: '@babel/core': 7.27.1 - '@babel/traverse': 7.27.1(supports-color@5.5.0) + '@babel/traverse': 7.27.1 '@babel/types': 7.27.1 '@types/babel__core': 7.20.5 '@types/babel__traverse': 7.20.7 @@ -18045,8 +17944,6 @@ snapshots: dependencies: kind-of: 6.0.3 - shallowequal@1.1.0: {} - shebang-command@2.0.0: dependencies: shebang-regex: 3.0.0 @@ -18170,7 +18067,7 @@ snapshots: socks-proxy-agent@6.2.1: dependencies: agent-base: 6.0.2 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 socks: 2.8.4 transitivePeerDependencies: - supports-color @@ -18179,7 +18076,7 @@ snapshots: socks-proxy-agent@8.0.5: dependencies: agent-base: 7.1.3 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 socks: 2.8.4 transitivePeerDependencies: - supports-color @@ -18212,7 +18109,7 @@ snapshots: spdy-transport@3.0.0: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 detect-node: 2.1.0 hpack.js: 2.1.6 obuf: 1.1.2 @@ -18223,7 +18120,7 @@ snapshots: spdy@4.0.2: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 handle-thing: 2.0.1 http-deceiver: 1.2.7 select-hose: 2.0.0 @@ -18387,29 +18284,11 @@ snapshots: dependencies: webpack: 5.99.9(@swc/core@1.11.29(@swc/helpers@0.5.17))(esbuild@0.25.4)(webpack-cli@6.0.1) - styled-components@5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0): - dependencies: - '@babel/helper-module-imports': 7.27.1(supports-color@5.5.0) - '@babel/traverse': 7.27.1(supports-color@5.5.0) - '@emotion/is-prop-valid': 1.3.1 - '@emotion/stylis': 0.8.5 - '@emotion/unitless': 0.7.5 - babel-plugin-styled-components: 2.1.4(@babel/core@7.27.1)(styled-components@5.3.11(@babel/core@7.27.1)(react-dom@19.1.0(react@19.1.0))(react-is@19.1.0)(react@19.1.0))(supports-color@5.5.0) - css-to-react-native: 3.2.0 - hoist-non-react-statics: 3.3.2 - react: 19.1.0 - react-dom: 19.1.0(react@19.1.0) - react-is: 19.1.0 - shallowequal: 1.1.0 - supports-color: 5.5.0 - transitivePeerDependencies: - - '@babel/core' - stylis@4.2.0: {} sumchecker@3.0.1: dependencies: - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 transitivePeerDependencies: - supports-color @@ -18417,7 +18296,7 @@ snapshots: dependencies: component-emitter: 1.3.1 cookiejar: 2.1.4 - debug: 4.4.1(supports-color@5.5.0) + debug: 4.4.1 fast-safe-stringify: 2.1.1 form-data: 4.0.2 formidable: 3.5.4 From 446d6e8363b0a0d05da6e2a0c167f86e7fa406b9 Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:41:50 -0400 Subject: [PATCH 4/7] Fix --- packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts index 2f109eda6e..c6bdc02b40 100644 --- a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts +++ b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts @@ -1,8 +1,8 @@ import styled from '@emotion/styled'; -import { Theme } from '../../themes/default'; +import { Base16Theme } from 'react-base16-styling'; const Divider = styled.div` - background-color: ${(props: { theme?: Theme }) => props.theme!.base02}; + background-color: ${(props: { theme?: Base16Theme & { inputHeight?: number } }) => props.theme!.base02}; box-shadow: 1px 1px 2px ${(props) => props.theme.base00}; height: ${(props) => props.theme.inputHeight || '30'}px; width: 1px; From 8c616e45658641b5d927eb5d676d97e940dc669b Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:43:55 -0400 Subject: [PATCH 5/7] Format --- packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts index c6bdc02b40..764fdba89e 100644 --- a/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts +++ b/packages/redux-devtools-ui/src/Toolbar/styles/Divider.ts @@ -2,7 +2,9 @@ import styled from '@emotion/styled'; import { Base16Theme } from 'react-base16-styling'; const Divider = styled.div` - background-color: ${(props: { theme?: Base16Theme & { inputHeight?: number } }) => props.theme!.base02}; + background-color: ${(props: { + theme?: Base16Theme & { inputHeight?: number }; + }) => props.theme!.base02}; box-shadow: 1px 1px 2px ${(props) => props.theme.base00}; height: ${(props) => props.theme.inputHeight || '30'}px; width: 1px; From 2044c6faeed8b0908908645f45abe7e9690b4649 Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:44:16 -0400 Subject: [PATCH 6/7] Update snapshots --- .../test/__snapshots__/Button.test.tsx.snap | 4 +-- .../__snapshots__/Container.test.tsx.snap | 2 +- .../__snapshots__/ContextMenu.test.tsx.snap | 2 +- .../test/__snapshots__/Dialog.test.tsx.snap | 30 +++++++++---------- .../test/__snapshots__/Editor.test.tsx.snap | 2 +- .../test/__snapshots__/Form.test.tsx.snap | 26 ++++++++-------- .../__snapshots__/Notification.test.tsx.snap | 4 +-- .../SegmentedControl.test.tsx.snap | 2 +- .../test/__snapshots__/Slider.test.tsx.snap | 4 +-- .../test/__snapshots__/Tabs.test.tsx.snap | 12 ++++---- .../test/__snapshots__/Toolbar.test.tsx.snap | 16 +++++----- 11 files changed, 52 insertions(+), 52 deletions(-) diff --git a/packages/redux-devtools-ui/test/__snapshots__/Button.test.tsx.snap b/packages/redux-devtools-ui/test/__snapshots__/Button.test.tsx.snap index 1c4d812e07..933e298e88 100644 --- a/packages/redux-devtools-ui/test/__snapshots__/Button.test.tsx.snap +++ b/packages/redux-devtools-ui/test/__snapshots__/Button.test.tsx.snap @@ -2,10 +2,10 @@ exports[`Button renders correctly 1`] = `
diff --git a/packages/redux-devtools-ui/test/__snapshots__/Container.test.tsx.snap b/packages/redux-devtools-ui/test/__snapshots__/Container.test.tsx.snap index d9229a09db..db9052ef3f 100644 --- a/packages/redux-devtools-ui/test/__snapshots__/Container.test.tsx.snap +++ b/packages/redux-devtools-ui/test/__snapshots__/Container.test.tsx.snap @@ -2,7 +2,7 @@ exports[`Container renders correctly 1`] = `
Text
diff --git a/packages/redux-devtools-ui/test/__snapshots__/ContextMenu.test.tsx.snap b/packages/redux-devtools-ui/test/__snapshots__/ContextMenu.test.tsx.snap index e915b56b41..8097a802eb 100644 --- a/packages/redux-devtools-ui/test/__snapshots__/ContextMenu.test.tsx.snap +++ b/packages/redux-devtools-ui/test/__snapshots__/ContextMenu.test.tsx.snap @@ -2,7 +2,7 @@ exports[`ContextMenu renders correctly 1`] = `
@@ -45,7 +45,7 @@ exports[`Dialog renders correctly 1`] = ` exports[`Dialog renders modal 1`] = `
@@ -61,19 +61,19 @@ exports[`Dialog renders modal 1`] = ` class="mc-dialog--footer" >
@@ -85,7 +85,7 @@ exports[`Dialog renders modal 1`] = ` exports[`Dialog renders with props 1`] = `
@@ -109,19 +109,19 @@ exports[`Dialog renders with props 1`] = ` class="mc-dialog--footer" >
diff --git a/packages/redux-devtools-ui/test/__snapshots__/Editor.test.tsx.snap b/packages/redux-devtools-ui/test/__snapshots__/Editor.test.tsx.snap index 690386ded8..2841908d84 100644 --- a/packages/redux-devtools-ui/test/__snapshots__/Editor.test.tsx.snap +++ b/packages/redux-devtools-ui/test/__snapshots__/Editor.test.tsx.snap @@ -2,7 +2,7 @@ exports[`Editor renders correctly 1`] = `
@@ -33,6 +33,6 @@ exports[`Toolbar renders correctly 1`] = ` exports[`Toolbar renders with props 1`] = `
`; From 6bd462d1687e052d5d6fcdcedffc5ebc580807ed Mon Sep 17 00:00:00 2001 From: Nathan Bierema Date: Sun, 1 Jun 2025 09:51:52 -0400 Subject: [PATCH 7/7] Create bright-sheep-joke.md --- .changeset/bright-sheep-joke.md | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 .changeset/bright-sheep-joke.md diff --git a/.changeset/bright-sheep-joke.md b/.changeset/bright-sheep-joke.md new file mode 100644 index 0000000000..e32697db94 --- /dev/null +++ b/.changeset/bright-sheep-joke.md @@ -0,0 +1,10 @@ +--- +'@redux-devtools/app-core': major +'@redux-devtools/app': major +'@redux-devtools/inspector-monitor-test-tab': major +'@redux-devtools/rtk-query-monitor': major +'@redux-devtools/slider-monitor': major +'@redux-devtools/ui': major +--- + +Replace styled-components with Emotion