From 4671f161ed97315e1d941286fe190f0feb5eae65 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matth=C3=A4us=20N=C3=B6ssing?= Date: Tue, 3 Sep 2024 16:06:24 +0200 Subject: [PATCH] use symbols instead of icons --- package-lock.json | 5 ++--- package.json | 6 +++--- src/components/alert/Alert.stories.tsx | 6 +++--- src/components/alert/ConvenientAlerts.tsx | 6 +++--- src/components/button/Button.stories.tsx | 4 ++-- src/components/button/ButtonIcon.stories.tsx | 10 +++++----- src/components/button/ButtonIconLink.stories.tsx | 4 ++-- src/components/button/ButtonLink.stories.tsx | 4 ++-- src/components/button/SubmitButton.stories.tsx | 4 ++-- .../content/ContentMessage/ContentMessage.stories.tsx | 6 +++--- .../dialog/Dialog/ConvenientDialogContentMessage.tsx | 4 ++-- .../dialog/DialogHeader/DialogHeaderCloseAction.tsx | 2 +- .../dialog/DialogItem/DialogListItemButton.tsx | 2 +- src/components/files/DeleteFileAction.tsx | 2 +- src/components/files/DownloadFileAction.tsx | 2 +- src/components/files/FileDropZone.tsx | 2 +- src/components/files/FileListItem.tsx | 6 +++--- src/components/files/theme.ts | 2 +- src/components/form/InputField.stories.tsx | 4 ++-- src/components/form/SearchField.tsx | 2 +- src/components/form/primitive/Input.stories.tsx | 4 ++-- .../form/primitive/InputIcon/InputIcon.stories.tsx | 4 ++-- src/components/header/actions/HeaderBackAction.tsx | 2 +- src/components/header/actions/HeaderCloseAction.tsx | 2 +- src/components/menu/Menu.stories.tsx | 4 ++-- .../pagination/PaginationPreviousNextContent.tsx | 4 ++-- .../react-hook-form/DateFormField.stories.tsx | 4 ++-- .../react-hook-form/FormSubmitFeedback.stories.mdx | 4 ++-- src/components/react-hook-form/FormSubmitFeedback.tsx | 2 +- .../react-hook-form/InputFormField.stories.tsx | 4 ++-- .../react-hook-form/NumberFormField.stories.tsx | 4 ++-- src/components/react-hook-form/SearchFormField.tsx | 2 +- .../SelectItemFormField/SelectItemFormFieldDialog.tsx | 2 +- .../SelectItemFormField/SelectItemFormFieldInput.tsx | 4 ++-- .../Section/ConvenientSectionContentMessage.tsx | 4 ++-- src/components/section/SectionItem/SectionListItem.tsx | 2 +- src/examples/Form.stories.tsx | 2 +- src/examples/List.stories.tsx | 2 +- 38 files changed, 69 insertions(+), 70 deletions(-) diff --git a/package-lock.json b/package-lock.json index 76d0197c..34de138e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "2.8.2", "dependencies": { "@aboutbits/pagination": "^2.0.2", - "@aboutbits/react-material-icons": "^1.2.5", + "@aboutbits/react-material-icons": "github:aboutbits/react-material-icons#update-to-symbols", "@aboutbits/react-toolbox": "^0.2.5", "@floating-ui/react": "^0.26.10", "@headlessui/react": "^1.7.18", @@ -170,8 +170,7 @@ }, "node_modules/@aboutbits/react-material-icons": { "version": "1.2.5", - "resolved": "https://registry.npmjs.org/@aboutbits/react-material-icons/-/react-material-icons-1.2.5.tgz", - "integrity": "sha512-LX2BSqAPpE5e+caB6dPxahpBqxxkBi/3BMdQJfjEoHpSG5jx1GS4JXFCONuxejlu+tS2S8swYjDTl//B9dbnwQ==", + "resolved": "git+ssh://git@github.com/aboutbits/react-material-icons.git#40fd62e527efaea680b39462fcda610b9048741c", "engines": { "node": ">=16", "npm": ">=8" diff --git a/package.json b/package.json index dba686ff..3b53c3f1 100644 --- a/package.json +++ b/package.json @@ -54,7 +54,7 @@ }, "dependencies": { "@aboutbits/pagination": "^2.0.2", - "@aboutbits/react-material-icons": "^1.2.5", + "@aboutbits/react-material-icons": "github:aboutbits/react-material-icons#update-to-symbols", "@aboutbits/react-toolbox": "^0.2.5", "@floating-ui/react": "^0.26.10", "@headlessui/react": "^1.7.18", @@ -89,6 +89,7 @@ "@typescript-eslint/eslint-plugin": "^7.4.0", "@vitejs/plugin-react-swc": "^3.6.0", "autoprefixer": "^10.4.19", + "axios-mock-adapter": "^1.22.0", "cssnano": "^6.1.1", "eslint": "^8.57.0", "eslint-plugin-import": "^2.29.1", @@ -113,8 +114,7 @@ "typescript": "^5.4.3", "vite": "^4.4.3", "vitest": "^0.33.0", - "zod": "^3.22.4", - "axios-mock-adapter": "^1.22.0" + "zod": "^3.22.4" }, "peerDependencies": { "@aboutbits/react-pagination": "^3.0.3", diff --git a/src/components/alert/Alert.stories.tsx b/src/components/alert/Alert.stories.tsx index dd65dfb5..124bfa61 100644 --- a/src/components/alert/Alert.stories.tsx +++ b/src/components/alert/Alert.stories.tsx @@ -1,6 +1,6 @@ -import IconCheck from '@aboutbits/react-material-icons/dist/IconCheck' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' -import IconWarning from '@aboutbits/react-material-icons/dist/IconWarning' +import IconCheck from '@aboutbits/react-material-icons/dist/IconCheckOutlined' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoIOutlined' +import IconWarning from '@aboutbits/react-material-icons/dist/IconWarningOutlined' import { Controls, Markdown, diff --git a/src/components/alert/ConvenientAlerts.tsx b/src/components/alert/ConvenientAlerts.tsx index 00646b9d..8e0cf59c 100644 --- a/src/components/alert/ConvenientAlerts.tsx +++ b/src/components/alert/ConvenientAlerts.tsx @@ -1,6 +1,6 @@ -import IconCheck from '@aboutbits/react-material-icons/dist/IconCheck' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' -import IconWarning from '@aboutbits/react-material-icons/dist/IconWarning' +import IconCheck from '@aboutbits/react-material-icons/dist/IconCheckRoundedFilled' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRoundedFilled' +import IconWarning from '@aboutbits/react-material-icons/dist/IconWarningRoundedFilled' import { ReactElement } from 'react' import { Tone } from '../types' import { Alert } from './Alert' diff --git a/src/components/button/Button.stories.tsx b/src/components/button/Button.stories.tsx index def02892..6a82c348 100644 --- a/src/components/button/Button.stories.tsx +++ b/src/components/button/Button.stories.tsx @@ -1,5 +1,5 @@ -import IconAdd from '@aboutbits/react-material-icons/dist/IconAdd' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' +import IconAdd from '@aboutbits/react-material-icons/dist/IconAddRounded' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRounded' import { Controls, Description, diff --git a/src/components/button/ButtonIcon.stories.tsx b/src/components/button/ButtonIcon.stories.tsx index 88e08138..271b319b 100644 --- a/src/components/button/ButtonIcon.stories.tsx +++ b/src/components/button/ButtonIcon.stories.tsx @@ -1,5 +1,5 @@ -import IconAdd from '@aboutbits/react-material-icons/dist/IconAdd' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' +import IconAddRounded from '@aboutbits/react-material-icons/dist/IconAddRounded' +import IconInfoRounded from '@aboutbits/react-material-icons/dist/IconInfoRounded' import { Controls, Description, @@ -19,8 +19,8 @@ import { ButtonVariant } from './types' const icons = { options: ['Info', 'Add'], mapping: { - Info: IconInfo, - Add: IconAdd, + Info: IconInfoRounded, + Add: IconAddRounded, }, } @@ -32,7 +32,7 @@ const meta = { variant: ButtonVariant.Solid, size: Size.Md, tone: Tone.Primary, - icon: IconAdd, + icon: IconAddRounded, }, argTypes: { icon: icons, diff --git a/src/components/button/ButtonIconLink.stories.tsx b/src/components/button/ButtonIconLink.stories.tsx index 1503005a..561d6d94 100644 --- a/src/components/button/ButtonIconLink.stories.tsx +++ b/src/components/button/ButtonIconLink.stories.tsx @@ -1,5 +1,5 @@ -import IconAdd from '@aboutbits/react-material-icons/dist/IconAdd' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' +import IconAdd from '@aboutbits/react-material-icons/dist/IconAddRounded' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRounded' import { Controls, Description, diff --git a/src/components/button/ButtonLink.stories.tsx b/src/components/button/ButtonLink.stories.tsx index c190c93f..5d6d46fc 100644 --- a/src/components/button/ButtonLink.stories.tsx +++ b/src/components/button/ButtonLink.stories.tsx @@ -1,5 +1,5 @@ -import IconAdd from '@aboutbits/react-material-icons/dist/IconAdd' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' +import IconAdd from '@aboutbits/react-material-icons/dist/IconAddRounded' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRounded' import { Controls, Description, diff --git a/src/components/button/SubmitButton.stories.tsx b/src/components/button/SubmitButton.stories.tsx index fa2ecbb2..84d0dba5 100644 --- a/src/components/button/SubmitButton.stories.tsx +++ b/src/components/button/SubmitButton.stories.tsx @@ -1,5 +1,5 @@ -import IconAdd from '@aboutbits/react-material-icons/dist/IconAdd' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' +import IconAdd from '@aboutbits/react-material-icons/dist/IconAddRounded' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRounded' import { Controls, Description, diff --git a/src/components/content/ContentMessage/ContentMessage.stories.tsx b/src/components/content/ContentMessage/ContentMessage.stories.tsx index a9840315..0757f411 100644 --- a/src/components/content/ContentMessage/ContentMessage.stories.tsx +++ b/src/components/content/ContentMessage/ContentMessage.stories.tsx @@ -1,6 +1,6 @@ -import IconError from '@aboutbits/react-material-icons/dist/IconError' -import IconInfo from '@aboutbits/react-material-icons/dist/IconInfo' -import IconWarning from '@aboutbits/react-material-icons/dist/IconWarning' +import IconError from '@aboutbits/react-material-icons/dist/IconErrorRounded' +import IconInfo from '@aboutbits/react-material-icons/dist/IconInfoRounded' +import IconWarning from '@aboutbits/react-material-icons/dist/IconWarningRounded' import { Controls, Description, diff --git a/src/components/dialog/Dialog/ConvenientDialogContentMessage.tsx b/src/components/dialog/Dialog/ConvenientDialogContentMessage.tsx index 77d1ff99..4a77a2e7 100644 --- a/src/components/dialog/Dialog/ConvenientDialogContentMessage.tsx +++ b/src/components/dialog/Dialog/ConvenientDialogContentMessage.tsx @@ -1,5 +1,5 @@ -import IconList from '@aboutbits/react-material-icons/dist/IconList' -import IconWarning from '@aboutbits/react-material-icons/dist/IconWarning' +import IconList from '@aboutbits/react-material-icons/dist/IconListRoundedFilled' +import IconWarning from '@aboutbits/react-material-icons/dist/IconWarningRoundedFilled' import { ReactElement } from 'react' import { Tone } from '../../types' import { diff --git a/src/components/dialog/DialogHeader/DialogHeaderCloseAction.tsx b/src/components/dialog/DialogHeader/DialogHeaderCloseAction.tsx index 366c63ee..d3d2ae26 100644 --- a/src/components/dialog/DialogHeader/DialogHeaderCloseAction.tsx +++ b/src/components/dialog/DialogHeader/DialogHeaderCloseAction.tsx @@ -1,4 +1,4 @@ -import IconClose from '@aboutbits/react-material-icons/dist/IconClose' +import IconClose from '@aboutbits/react-material-icons/dist/IconCloseRounded' import { ComponentType, ReactElement } from 'react' import { useInternationalization } from '../../../framework' import { IconProps } from '../../types' diff --git a/src/components/dialog/DialogItem/DialogListItemButton.tsx b/src/components/dialog/DialogItem/DialogListItemButton.tsx index a2686d71..9de8eb35 100644 --- a/src/components/dialog/DialogItem/DialogListItemButton.tsx +++ b/src/components/dialog/DialogItem/DialogListItemButton.tsx @@ -1,4 +1,4 @@ -import IconKeyboardArrowRight from '@aboutbits/react-material-icons/dist/IconKeyboardArrowRight' +import IconKeyboardArrowRight from '@aboutbits/react-material-icons/dist/IconKeyboardArrowRightRounded' import classNames from 'classnames' import { MouseEventHandler, forwardRef } from 'react' import { useTheme } from '../../../framework' diff --git a/src/components/files/DeleteFileAction.tsx b/src/components/files/DeleteFileAction.tsx index 5714267f..b4fc522e 100644 --- a/src/components/files/DeleteFileAction.tsx +++ b/src/components/files/DeleteFileAction.tsx @@ -1,4 +1,4 @@ -import IconDelete from '@aboutbits/react-material-icons/dist/IconDelete' +import IconDelete from '@aboutbits/react-material-icons/dist/IconDeleteRoundedFilled' import { useState } from 'react' import { useInternationalization } from '../../framework' import { ButtonVariant } from '../button' diff --git a/src/components/files/DownloadFileAction.tsx b/src/components/files/DownloadFileAction.tsx index 33502bd5..6996892f 100644 --- a/src/components/files/DownloadFileAction.tsx +++ b/src/components/files/DownloadFileAction.tsx @@ -1,4 +1,4 @@ -import IconDownload from '@aboutbits/react-material-icons/dist/IconDownload' +import IconDownload from '@aboutbits/react-material-icons/dist/IconDownloadRounded' import { useState } from 'react' import { useInternationalization } from '../../framework' import { ButtonVariant } from '../button' diff --git a/src/components/files/FileDropZone.tsx b/src/components/files/FileDropZone.tsx index 467f3994..c62b02dc 100644 --- a/src/components/files/FileDropZone.tsx +++ b/src/components/files/FileDropZone.tsx @@ -1,4 +1,4 @@ -import IconUploadFile from '@aboutbits/react-material-icons/dist/IconUploadFile' +import IconUploadFile from '@aboutbits/react-material-icons/dist/IconUploadFileRounded' import classNames from 'classnames' import { ChangeEventHandler, useRef } from 'react' import { useInternationalization, useTheme } from '../../framework' diff --git a/src/components/files/FileListItem.tsx b/src/components/files/FileListItem.tsx index 5f8e587d..8b6aaf1c 100644 --- a/src/components/files/FileListItem.tsx +++ b/src/components/files/FileListItem.tsx @@ -1,5 +1,5 @@ -import IconCheckCircle from '@aboutbits/react-material-icons/dist/IconCheckCircle' -import IconInsertDriveFile from '@aboutbits/react-material-icons/dist/IconInsertDriveFile' +import IconCheckCircle from '@aboutbits/react-material-icons/dist/IconCheckCircleRoundedFilled' +import IconDraftRounded from '@aboutbits/react-material-icons/dist/IconDraftRoundedFilled' import classNames from 'classnames' import { ReactNode, useEffect, useState } from 'react' import { useInternationalization, useTheme } from '../../framework' @@ -88,7 +88,7 @@ export function FileListItem({ className={classNames(files.icon.size, files.icon.success)} /> ) : ( -