From 84a5d0633551fc3c178c97bcda1205f010146056 Mon Sep 17 00:00:00 2001 From: rtritto <40242971+rtritto@users.noreply.github.com> Date: Sat, 14 Jan 2023 06:25:06 +0100 Subject: [PATCH] fix: inline icons from `@mui/icons-material` (#147) * Remove @mui/icons-material * Merge all icons to Icons file --- package.json | 1 - rollup.config.ts | 1 - src/components/DataKeyPair.tsx | 16 +++---- src/components/DataTypes/Object.tsx | 2 +- src/components/Icons.tsx | 46 +++++++++++++++++++++ src/components/icons/CircularArrowsIcon.tsx | 10 ----- yarn.lock | 17 -------- 7 files changed, 55 insertions(+), 38 deletions(-) create mode 100644 src/components/Icons.tsx delete mode 100644 src/components/icons/CircularArrowsIcon.tsx diff --git a/package.json b/package.json index 1a6a3902..06188c3a 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,6 @@ "dependencies": { "@emotion/react": "^11.10.5", "@emotion/styled": "^11.10.5", - "@mui/icons-material": "^5.11.0", "@mui/material": "^5.11.4", "copy-to-clipboard": "^3.3.3", "group-items": "^2.2.0", diff --git a/rollup.config.ts b/rollup.config.ts index dc4b70de..c993eb14 100644 --- a/rollup.config.ts +++ b/rollup.config.ts @@ -26,7 +26,6 @@ const external = [ '@emotion/styled', '@emotion/react/jsx-runtime', '@emotion/react/jsx-dev-runtime', - '@mui/icons-material', '@mui/material', '@mui/material/styles', 'copy-to-clipboard', diff --git a/src/components/DataKeyPair.tsx b/src/components/DataKeyPair.tsx index 02d490c6..4e13b9b9 100644 --- a/src/components/DataKeyPair.tsx +++ b/src/components/DataKeyPair.tsx @@ -1,11 +1,3 @@ -import { - Check as CheckIcon, - ChevronRight as ChevronRightIcon, - Close as CloseIcon, - ContentCopy as ContentCopyIcon, - Edit as EditIcon, - ExpandMore as ExpandMoreIcon -} from '@mui/icons-material' import { Box, styled } from '@mui/material' import type React from 'react' import { useCallback, useMemo, useState } from 'react' @@ -17,6 +9,14 @@ import { useJsonViewerStore } from '../stores/JsonViewerStore' import { useTypeComponents } from '../stores/typeRegistry' import type { DataItemProps } from '../type' import { getValueSize } from '../utils' +import { + CheckIcon, + ChevronRightIcon, + CloseIcon, + ContentCopyIcon, + EditIcon, + ExpandMoreIcon +} from './Icons' import { DataBox } from './mui/DataBox' export type DataKeyPairProps = { diff --git a/src/components/DataTypes/Object.tsx b/src/components/DataTypes/Object.tsx index a4da1cbf..5534131f 100644 --- a/src/components/DataTypes/Object.tsx +++ b/src/components/DataTypes/Object.tsx @@ -8,7 +8,7 @@ import { useJsonViewerStore } from '../../stores/JsonViewerStore' import type { DataItemProps } from '../../type' import { getValueSize } from '../../utils' import { DataKeyPair } from '../DataKeyPair' -import { CircularArrowsIcon } from '../icons/CircularArrowsIcon' +import { CircularArrowsIcon } from '../Icons' import { DataBox } from '../mui/DataBox' const objectLb = '{' diff --git a/src/components/Icons.tsx b/src/components/Icons.tsx new file mode 100644 index 00000000..3353deee --- /dev/null +++ b/src/components/Icons.tsx @@ -0,0 +1,46 @@ +import { SvgIcon, SvgIconProps } from '@mui/material' +import type React from 'react' + +const BaseIcon: React.FC = ({ d, ...props }) => { + return ( + + + + ) +} + +const Check = 'M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z' +const ChevronRight = 'M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z' +const CircularArrows = 'M 12 2 C 10.615 1.998 9.214625 2.2867656 7.890625 2.8847656 L 8.9003906 4.6328125 C 9.9043906 4.2098125 10.957 3.998 12 4 C 15.080783 4 17.738521 5.7633175 19.074219 8.3222656 L 17.125 9 L 21.25 11 L 22.875 7 L 20.998047 7.6523438 C 19.377701 4.3110398 15.95585 2 12 2 z M 6.5097656 4.4882812 L 2.2324219 5.0820312 L 3.734375 6.3808594 C 1.6515335 9.4550558 1.3615962 13.574578 3.3398438 17 C 4.0308437 18.201 4.9801562 19.268234 6.1601562 20.115234 L 7.1699219 18.367188 C 6.3019219 17.710187 5.5922656 16.904 5.0722656 16 C 3.5320014 13.332354 3.729203 10.148679 5.2773438 7.7128906 L 6.8398438 9.0625 L 6.5097656 4.4882812 z M 19.929688 13 C 19.794687 14.08 19.450734 15.098 18.927734 16 C 17.386985 18.668487 14.531361 20.090637 11.646484 19.966797 L 12.035156 17.9375 L 8.2402344 20.511719 L 10.892578 23.917969 L 11.265625 21.966797 C 14.968963 22.233766 18.681899 20.426323 20.660156 17 C 21.355156 15.801 21.805219 14.445 21.949219 13 L 19.929688 13 z' +const Close = 'M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z' +const ContentCopy = 'M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z' +const Edit = 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 0 0-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z' +const ExpandMore = 'M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z' + +export const CheckIcon: React.FC = (props) => { + return +} + +export const ChevronRightIcon: React.FC = (props) => { + return +} + +export const CircularArrowsIcon: React.FC = (props) => { + return +} + +export const CloseIcon: React.FC = (props) => { + return +} + +export const ContentCopyIcon: React.FC = (props) => { + return +} + +export const EditIcon: React.FC = (props) => { + return +} + +export const ExpandMoreIcon: React.FC = (props) => { + return +} diff --git a/src/components/icons/CircularArrowsIcon.tsx b/src/components/icons/CircularArrowsIcon.tsx deleted file mode 100644 index 680a0520..00000000 --- a/src/components/icons/CircularArrowsIcon.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { SvgIcon, SvgIconProps } from '@mui/material' -import type React from 'react' - -export const CircularArrowsIcon: React.FC = (props) => { - return ( - - - - ) -} diff --git a/yarn.lock b/yarn.lock index 7f3d4926..5ce19efe 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1132,22 +1132,6 @@ __metadata: languageName: node linkType: hard -"@mui/icons-material@npm:^5.11.0": - version: 5.11.0 - resolution: "@mui/icons-material@npm:5.11.0" - dependencies: - "@babel/runtime": ^7.20.6 - peerDependencies: - "@mui/material": ^5.0.0 - "@types/react": ^17.0.0 || ^18.0.0 - react: ^17.0.0 || ^18.0.0 - peerDependenciesMeta: - "@types/react": - optional: true - checksum: 764c1185b3432f0228f3c5217b0e218b10f106fa96d305dfc62c0ef5afd2a7a087b0d664fd0a8171282e195c18d3ee073d5f037901a2bed1a1519a70fbb0501c - languageName: node - linkType: hard - "@mui/material@npm:^5.11.4": version: 5.11.4 resolution: "@mui/material@npm:5.11.4" @@ -1820,7 +1804,6 @@ __metadata: "@commitlint/config-angular": ^17.4.2 "@emotion/react": ^11.10.5 "@emotion/styled": ^11.10.5 - "@mui/icons-material": ^5.11.0 "@mui/material": ^5.11.4 "@rollup/plugin-alias": ^4.0.2 "@rollup/plugin-commonjs": ^24.0.0