diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 11dbf99e..91e7bea1 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -163,7 +163,7 @@ The `footer` is optional. The [Commit Message Footer](#commit-footer) format des │ │ │ └─⫸ Commit Scope: primitives|scss|react │ - └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test + └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|chore|test ``` The `` and `` fields are mandatory, the `()` field is optional. @@ -180,6 +180,7 @@ Must be one of the following: * **fix**: A bug fix * **perf**: A code change that improves performance * **refactor**: A code change that neither fixes a bug nor adds a feature +* **chore**: Housekeeping tasks that doesn't require to be highlighted in the changelog * **test**: Adding missing tests or correcting existing tests @@ -210,9 +211,9 @@ There are currently a few exceptions to the "use package name" rule: Use the summary field to provide a succinct description of the change: -* use the imperative, present tense: "change" not "changed" nor "changes" -* don't capitalize the first letter -* no dot (.) at the end +* Use the imperative, present tense: "change" not "changed" nor "changes". +* Don't capitalize the first letter. +* No dot (.) at the end. #### Commit Message Body @@ -259,8 +260,8 @@ If the commit reverts a previous commit, it should begin with `revert: `, follow The content of the commit message body should contain: -- information about the SHA of the commit being reverted in the following format: `This reverts commit `, -- a clear description of the reason for reverting the commit message. +- Information about the SHA of the commit being reverted in the following format: `This reverts commit `. +- A clear description of the reason for reverting the commit message. ## Designing @@ -297,6 +298,28 @@ Following diagram illustrates the design tokens workflow. +### Designing Icons + +When designing SVG icons for the `Primitives` package, follow these guidelines: + +- Use general names for icons, do not use scenario specific names. + + ✅ Do + + _envelop-outlined-16.svg_ + + ❌ Don't + + _email-input-icon.svg_ +- Use fill rather than stroke. +- Use consistent colors. +- Use consistent line widths. +- Name the files in the following format. + + _--.svg_ + + _example: home-filled-16.svg_ + ## Versioning For details on the project's versioning policy, please refer to the [VERSIONING_POLICY.md](VERSIONING_POLICY.md) document. It is recommended to read this document before carrying out any versioning-related tasks. diff --git a/packages/primitives/src/icons/arrow-left-arrow-right-16.svg b/packages/primitives/src/icons/arrow-left-arrow-right-16.svg new file mode 100644 index 00000000..e47312a6 --- /dev/null +++ b/packages/primitives/src/icons/arrow-left-arrow-right-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/arrow-right-from-bracket-16.svg b/packages/primitives/src/icons/arrow-right-from-bracket-16.svg new file mode 100644 index 00000000..07696a4f --- /dev/null +++ b/packages/primitives/src/icons/arrow-right-from-bracket-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/arrow-right-to-bracket-16.svg b/packages/primitives/src/icons/arrow-right-to-bracket-16.svg new file mode 100644 index 00000000..9285f568 --- /dev/null +++ b/packages/primitives/src/icons/arrow-right-to-bracket-16.svg @@ -0,0 +1,22 @@ + + + + + + diff --git a/packages/primitives/src/icons/arrow-up-right-from-square-16.svg b/packages/primitives/src/icons/arrow-up-right-from-square-16.svg new file mode 100644 index 00000000..caf4b563 --- /dev/null +++ b/packages/primitives/src/icons/arrow-up-right-from-square-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/hamburger-16.svg b/packages/primitives/src/icons/bars-16.svg similarity index 99% rename from packages/primitives/src/icons/hamburger-16.svg rename to packages/primitives/src/icons/bars-16.svg index 715578ca..47c68e7d 100644 --- a/packages/primitives/src/icons/hamburger-16.svg +++ b/packages/primitives/src/icons/bars-16.svg @@ -19,4 +19,3 @@ - \ No newline at end of file diff --git a/packages/primitives/src/icons/event-16.svg b/packages/primitives/src/icons/bolt-16.svg similarity index 74% rename from packages/primitives/src/icons/event-16.svg rename to packages/primitives/src/icons/bolt-16.svg index c491ba48..10c7ed2f 100644 --- a/packages/primitives/src/icons/event-16.svg +++ b/packages/primitives/src/icons/bolt-16.svg @@ -17,7 +17,5 @@ --> - + diff --git a/packages/primitives/src/icons/briefcase-16.svg b/packages/primitives/src/icons/briefcase-16.svg new file mode 100644 index 00000000..f8264681 --- /dev/null +++ b/packages/primitives/src/icons/briefcase-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/briefcase-building-16.svg b/packages/primitives/src/icons/briefcase-building-16.svg new file mode 100644 index 00000000..46b151f0 --- /dev/null +++ b/packages/primitives/src/icons/briefcase-building-16.svg @@ -0,0 +1,24 @@ + + + + + + + + diff --git a/packages/primitives/src/icons/cache-16.svg b/packages/primitives/src/icons/cache-16.svg deleted file mode 100644 index 6c8e8f9f..00000000 --- a/packages/primitives/src/icons/cache-16.svg +++ /dev/null @@ -1,30 +0,0 @@ - - - - - - - - - - - - diff --git a/packages/primitives/src/icons/camera-16.svg b/packages/primitives/src/icons/camera-16.svg new file mode 100644 index 00000000..09d387c3 --- /dev/null +++ b/packages/primitives/src/icons/camera-16.svg @@ -0,0 +1,22 @@ + + + + + + diff --git a/packages/primitives/src/icons/chevron-down-16.svg b/packages/primitives/src/icons/chevron-down-16.svg index 070ab784..5bab90d4 100644 --- a/packages/primitives/src/icons/chevron-down-16.svg +++ b/packages/primitives/src/icons/chevron-down-16.svg @@ -17,5 +17,5 @@ --> - + diff --git a/packages/primitives/src/icons/chevron-left-16.svg b/packages/primitives/src/icons/chevron-left-16.svg index 5d7680df..420fcab9 100644 --- a/packages/primitives/src/icons/chevron-left-16.svg +++ b/packages/primitives/src/icons/chevron-left-16.svg @@ -17,5 +17,5 @@ --> - + diff --git a/packages/primitives/src/icons/chevron-right-16.svg b/packages/primitives/src/icons/chevron-right-16.svg index db2dc711..1c798e07 100644 --- a/packages/primitives/src/icons/chevron-right-16.svg +++ b/packages/primitives/src/icons/chevron-right-16.svg @@ -17,5 +17,5 @@ --> - + diff --git a/packages/primitives/src/icons/chevron-up-16.svg b/packages/primitives/src/icons/chevron-up-16.svg index cdec18d6..7beba519 100644 --- a/packages/primitives/src/icons/chevron-up-16.svg +++ b/packages/primitives/src/icons/chevron-up-16.svg @@ -17,12 +17,5 @@ --> - - - - - - - - + diff --git a/packages/primitives/src/icons/double-circle-16.svg b/packages/primitives/src/icons/circle-dot-16.svg similarity index 100% rename from packages/primitives/src/icons/double-circle-16.svg rename to packages/primitives/src/icons/circle-dot-16.svg diff --git a/packages/primitives/src/icons/circles-overlap-16.svg b/packages/primitives/src/icons/circles-overlap-16.svg new file mode 100644 index 00000000..f666e08b --- /dev/null +++ b/packages/primitives/src/icons/circles-overlap-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/cloud-nodes-16.svg b/packages/primitives/src/icons/cloud-nodes-16.svg new file mode 100644 index 00000000..9618a87f --- /dev/null +++ b/packages/primitives/src/icons/cloud-nodes-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/comment-16.svg b/packages/primitives/src/icons/comment-lines-16.svg similarity index 100% rename from packages/primitives/src/icons/comment-16.svg rename to packages/primitives/src/icons/comment-lines-16.svg diff --git a/packages/primitives/src/icons/console-alt-16.svg b/packages/primitives/src/icons/console-alt-16.svg deleted file mode 100644 index ea7932c8..00000000 --- a/packages/primitives/src/icons/console-alt-16.svg +++ /dev/null @@ -1,42 +0,0 @@ - - - - - - - - - - - - - - - - - - - diff --git a/packages/primitives/src/icons/console-filled-16.svg b/packages/primitives/src/icons/console-filled-16.svg deleted file mode 100644 index 3bff12b7..00000000 --- a/packages/primitives/src/icons/console-filled-16.svg +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/packages/primitives/src/icons/console-user-thick-18.svg b/packages/primitives/src/icons/console-user-thick-18.svg deleted file mode 100644 index 3874e7ea..00000000 --- a/packages/primitives/src/icons/console-user-thick-18.svg +++ /dev/null @@ -1,36 +0,0 @@ - - - - - - - - - - - - - - diff --git a/packages/primitives/src/icons/add-16.svg b/packages/primitives/src/icons/copy-16.svg similarity index 57% rename from packages/primitives/src/icons/add-16.svg rename to packages/primitives/src/icons/copy-16.svg index 7bed6db1..fbf6c372 100644 --- a/packages/primitives/src/icons/add-16.svg +++ b/packages/primitives/src/icons/copy-16.svg @@ -17,14 +17,5 @@ --> - - - - - - - - + diff --git a/packages/primitives/src/icons/database-16.svg b/packages/primitives/src/icons/database-16.svg new file mode 100644 index 00000000..3903369f --- /dev/null +++ b/packages/primitives/src/icons/database-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/document-16.svg b/packages/primitives/src/icons/document-16.svg new file mode 100644 index 00000000..9dcec0f7 --- /dev/null +++ b/packages/primitives/src/icons/document-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/drawing-pencil-16.svg b/packages/primitives/src/icons/drawing-pencil-16.svg new file mode 100644 index 00000000..61e050e6 --- /dev/null +++ b/packages/primitives/src/icons/drawing-pencil-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/email-provider-16.svg b/packages/primitives/src/icons/email-provider-16.svg deleted file mode 100644 index 1d1b8077..00000000 --- a/packages/primitives/src/icons/email-provider-16.svg +++ /dev/null @@ -1,35 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/packages/primitives/src/icons/email-16.svg b/packages/primitives/src/icons/envelope-16.svg similarity index 55% rename from packages/primitives/src/icons/email-16.svg rename to packages/primitives/src/icons/envelope-16.svg index 0ef0d03a..dd552669 100644 --- a/packages/primitives/src/icons/email-16.svg +++ b/packages/primitives/src/icons/envelope-16.svg @@ -17,7 +17,6 @@ --> - + + diff --git a/packages/primitives/src/icons/envelope-cogwheel-16.svg b/packages/primitives/src/icons/envelope-cogwheel-16.svg new file mode 100644 index 00000000..4b6c6ff2 --- /dev/null +++ b/packages/primitives/src/icons/envelope-cogwheel-16.svg @@ -0,0 +1,24 @@ + + + + + + + + diff --git a/packages/primitives/src/icons/visibility-16.svg b/packages/primitives/src/icons/eye-16.svg similarity index 100% rename from packages/primitives/src/icons/visibility-16.svg rename to packages/primitives/src/icons/eye-16.svg diff --git a/packages/primitives/src/icons/visibility-off-16.svg b/packages/primitives/src/icons/eye-slash-16.svg similarity index 100% rename from packages/primitives/src/icons/visibility-off-16.svg rename to packages/primitives/src/icons/eye-slash-16.svg diff --git a/packages/primitives/src/icons/gear-16.svg b/packages/primitives/src/icons/gear-16.svg new file mode 100644 index 00000000..12185027 --- /dev/null +++ b/packages/primitives/src/icons/gear-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/hierarchy-16.svg b/packages/primitives/src/icons/hierarchy-16.svg new file mode 100644 index 00000000..e6f976c8 --- /dev/null +++ b/packages/primitives/src/icons/hierarchy-16.svg @@ -0,0 +1,25 @@ + + + + + + + + + diff --git a/packages/primitives/src/icons/home-16.svg b/packages/primitives/src/icons/home-16.svg new file mode 100644 index 00000000..6fad5da4 --- /dev/null +++ b/packages/primitives/src/icons/home-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/home-outlined-16.svg b/packages/primitives/src/icons/home-outlined-16.svg deleted file mode 100644 index 57094fee..00000000 --- a/packages/primitives/src/icons/home-outlined-16.svg +++ /dev/null @@ -1,34 +0,0 @@ - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/packages/primitives/src/icons/languages-16.svg b/packages/primitives/src/icons/language-16.svg similarity index 100% rename from packages/primitives/src/icons/languages-16.svg rename to packages/primitives/src/icons/language-16.svg diff --git a/packages/primitives/src/icons/leave-16.svg b/packages/primitives/src/icons/leave-16.svg deleted file mode 100644 index 85ce6fcd..00000000 --- a/packages/primitives/src/icons/leave-16.svg +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/packages/primitives/src/icons/linear-nodes-16.svg b/packages/primitives/src/icons/linear-nodes-16.svg new file mode 100644 index 00000000..b48e4963 --- /dev/null +++ b/packages/primitives/src/icons/linear-nodes-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/power-16.svg b/packages/primitives/src/icons/power-16.svg deleted file mode 100644 index 571a88fd..00000000 --- a/packages/primitives/src/icons/power-16.svg +++ /dev/null @@ -1,29 +0,0 @@ - - - - - - - - - - - - - \ No newline at end of file diff --git a/packages/primitives/src/icons/preferences-16.svg b/packages/primitives/src/icons/preferences-16.svg deleted file mode 100644 index 6348cec5..00000000 --- a/packages/primitives/src/icons/preferences-16.svg +++ /dev/null @@ -1,29 +0,0 @@ - - - - - - - - - - - - - \ No newline at end of file diff --git a/packages/primitives/src/icons/bill-16.svg b/packages/primitives/src/icons/receipt-16.svg similarity index 100% rename from packages/primitives/src/icons/bill-16.svg rename to packages/primitives/src/icons/receipt-16.svg diff --git a/packages/primitives/src/icons/logs-16.svg b/packages/primitives/src/icons/rectangle-line-16.svg similarity index 61% rename from packages/primitives/src/icons/logs-16.svg rename to packages/primitives/src/icons/rectangle-line-16.svg index 10dd74de..0d3473ca 100644 --- a/packages/primitives/src/icons/logs-16.svg +++ b/packages/primitives/src/icons/rectangle-line-16.svg @@ -17,8 +17,5 @@ --> - - - - + diff --git a/packages/primitives/src/icons/share-nodes-16.svg b/packages/primitives/src/icons/share-nodes-16.svg new file mode 100644 index 00000000..8504c742 --- /dev/null +++ b/packages/primitives/src/icons/share-nodes-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/change-16.svg b/packages/primitives/src/icons/shield-check-16.svg similarity index 50% rename from packages/primitives/src/icons/change-16.svg rename to packages/primitives/src/icons/shield-check-16.svg index 69f07cb7..754be0a6 100644 --- a/packages/primitives/src/icons/change-16.svg +++ b/packages/primitives/src/icons/shield-check-16.svg @@ -17,7 +17,5 @@ --> - + diff --git a/packages/primitives/src/icons/square-plus-16.svg b/packages/primitives/src/icons/square-plus-16.svg new file mode 100644 index 00000000..9bcf60ac --- /dev/null +++ b/packages/primitives/src/icons/square-plus-16.svg @@ -0,0 +1,22 @@ + + + + + + diff --git a/packages/primitives/src/icons/sub-organization-16.svg b/packages/primitives/src/icons/sub-organization-16.svg deleted file mode 100644 index 98e7063c..00000000 --- a/packages/primitives/src/icons/sub-organization-16.svg +++ /dev/null @@ -1,42 +0,0 @@ - - - - - - - - - - - - - - - - diff --git a/packages/primitives/src/icons/tiles-16.svg b/packages/primitives/src/icons/tiles-16.svg new file mode 100644 index 00000000..7893bd23 --- /dev/null +++ b/packages/primitives/src/icons/tiles-16.svg @@ -0,0 +1,21 @@ + + + + + diff --git a/packages/primitives/src/icons/trash-16.svg b/packages/primitives/src/icons/trash-16.svg new file mode 100644 index 00000000..6b6b0e32 --- /dev/null +++ b/packages/primitives/src/icons/trash-16.svg @@ -0,0 +1,23 @@ + + + + + + + diff --git a/packages/primitives/src/icons/user-document-16.svg b/packages/primitives/src/icons/user-document-16.svg new file mode 100644 index 00000000..7860fd31 --- /dev/null +++ b/packages/primitives/src/icons/user-document-16.svg @@ -0,0 +1,26 @@ + + + + + + + + + + diff --git a/packages/primitives/src/icons/users-16.svg b/packages/primitives/src/icons/users-16.svg new file mode 100644 index 00000000..80abbcbe --- /dev/null +++ b/packages/primitives/src/icons/users-16.svg @@ -0,0 +1,24 @@ + + + + + + + + diff --git a/packages/react-icons/README.md b/packages/react-icons/README.md index c5452df8..6923fc12 100644 --- a/packages/react-icons/README.md +++ b/packages/react-icons/README.md @@ -25,10 +25,10 @@ yarn add @oxygen-ui/react-icons To use icons from `@oxygen-ui/react-icons`, simply import the desired icon as a React component and use it in your code: ```jsx -import { HamburgerIcon } from '@oxygen-ui/react-icons'; +import { HomeIcon } from '@oxygen-ui/react-icons'; -function CustomHamburgerIcon() { - return ; +function CustomHomeIcon() { + return ; } ``` @@ -38,7 +38,7 @@ function CustomHamburgerIcon() { The `@oxygen-ui/react-icons` package exports all the available icons as React components, which can be used in your app as shown in the example above. The available icons are: -- `HamburgerIcon` +- `HomeIcon` - `ChevronLeftIcon` - `ChevronRightIcon` - ... and more! diff --git a/packages/react/.storybook/content/Icons/Icons.stories.mdx b/packages/react/.storybook/content/Icons/Icons.stories.mdx index 28e1cd44..7f5f5713 100644 --- a/packages/react/.storybook/content/Icons/Icons.stories.mdx +++ b/packages/react/.storybook/content/Icons/Icons.stories.mdx @@ -3,6 +3,7 @@ import dedent from 'ts-dedent'; import StoryConfig from '../../story-config.ts'; import defaultTheme from '../../../src/theme/default-theme'; import * as OxygenIcons from '@oxygen-ui/react-icons'; +import "./icons.scss"; export const meta = { title: StoryConfig.Icons.hierarchy, @@ -19,6 +20,8 @@ export const meta = { The SVG icons from `@oxygen-ui/primitives` exported as React components. +🚧 _- `Icons` is still a work-in-progress._ + ## Usage Import and use the icons in your components as follows. @@ -28,9 +31,9 @@ Import and use the icons in your components as follows. dark format code={dedent` -import {LockIcon} from '@oxygen-ui/react-icons';\n +import {HomeIcon} from '@oxygen-ui/react-icons';\n function Demo() { - return ; + return ; }`} /> @@ -40,7 +43,7 @@ function Demo() { {Object.keys(OxygenIcons).map(key => { const Icon = OxygenIcons[key]; return ( - + ); diff --git a/packages/react/.storybook/content/Icons/icons.scss b/packages/react/.storybook/content/Icons/icons.scss new file mode 100644 index 00000000..be5ff4c3 --- /dev/null +++ b/packages/react/.storybook/content/Icons/icons.scss @@ -0,0 +1,7 @@ +.docblock-icongallery { + justify-content: space-between; + + .css-ngu85f { + min-width: 240px; + } +} diff --git a/packages/react/.storybook/story-config.ts b/packages/react/.storybook/story-config.ts index 0b84a52e..60bc8ad3 100644 --- a/packages/react/.storybook/story-config.ts +++ b/packages/react/.storybook/story-config.ts @@ -192,7 +192,7 @@ const StoryConfig: StorybookConfig = { hierarchy: `${StorybookCategories.Navigation}/Drawer`, }, CountryFlag: { - hierarchy: `${StorybookCategories.Icons}/CountryFlag`, + hierarchy: `${StorybookCategories.Icons}/Country Flags`, }, Footer: { hierarchy: `${StorybookCategories.Navigation}/Footer`, @@ -230,7 +230,7 @@ const StoryConfig: StorybookConfig = { hierarchy: `${StorybookCategories.Inputs}/Icon Button`, }, Icons: { - hierarchy: `${StorybookCategories.Icons}/Icons`, + hierarchy: `${StorybookCategories.Icons}/Icons 🚧` }, LinearProgress: { hierarchy: `${ StorybookCategories.Feedback}/Linear Progress`, diff --git a/packages/react/src/components/AppShell/AppShell.stories.mdx b/packages/react/src/components/AppShell/AppShell.stories.mdx index 6fd4d1f0..dac55c03 100644 --- a/packages/react/src/components/AppShell/AppShell.stories.mdx +++ b/packages/react/src/components/AppShell/AppShell.stories.mdx @@ -9,7 +9,7 @@ import Navbar from '../Navbar/Navbar.tsx'; import Typography from '../Typography/Typography.tsx'; import {basicFooterVariationOptions} from '../Footer/Footer.stories.mdx'; import {basicHeaderVariationOptions} from '../Header/Header.stories.mdx'; -import {ConsoleUserThickIcon, HomeFilledIcon, LockIcon, PreferencesIcon, LanguagesIcon} from '@oxygen-ui/react-icons'; +import {UserDocumentIcon, HomeFilledIcon, LockIcon, GearIcon, LanguageIcon} from '@oxygen-ui/react-icons'; export const meta = { component: AppShell, @@ -28,7 +28,7 @@ export const navbarItems = [ id: 'overview' }, { - icon: , + icon: , name: 'Profile Info', id: 'profile info' }, @@ -43,12 +43,12 @@ export const navbarItems = [ { items: [ { - icon: , + icon: , name: 'Language', id: 'language' }, { - icon: , + icon: , name: 'Preferences', id: 'preferences' }, diff --git a/packages/react/src/components/Header/Header.stories.mdx b/packages/react/src/components/Header/Header.stories.mdx index 75405219..fc29c719 100644 --- a/packages/react/src/components/Header/Header.stories.mdx +++ b/packages/react/src/components/Header/Header.stories.mdx @@ -3,7 +3,7 @@ import dedent from 'ts-dedent'; import StoryConfig from '../../../.storybook/story-config.ts'; import {withDesign} from '../../../.storybook/utils.ts'; import Header from './Header.tsx'; -import {LanguagesIcon, LogsIcon, SunIcon, CrescentBrightIcon, CommentIcon, MagnifyingGlassIcon} from '@oxygen-ui/react-icons'; +import {LanguageIcon, GearIcon, SunIcon, CrescentBrightIcon, CommentLinesIcon, MagnifyingGlassIcon} from '@oxygen-ui/react-icons'; import Button from "../Button"; export const meta = { @@ -57,14 +57,14 @@ export const leftAlignedElementsVariationOptions = { ...basicHeaderVariationOptions, leftAlignedElements: [ , - ] + ] }; export const rightAlignedElementsVariationOptions = { ...basicHeaderVariationOptions, rightAlignedElements: [ - , - + , + ], } diff --git a/packages/react/src/components/Header/Header.tsx b/packages/react/src/components/Header/Header.tsx index 1229b5bf..133ff3bd 100644 --- a/packages/react/src/components/Header/Header.tsx +++ b/packages/react/src/components/Header/Header.tsx @@ -18,7 +18,7 @@ import {useColorScheme} from '@mui/material/styles'; import {Mode} from '@mui/system/cssVars/useCurrentColorScheme'; -import {ChevronDownIcon, HamburgerIcon, PowerIcon} from '@oxygen-ui/react-icons'; +import {ChevronDownIcon, BarsIcon, ArrowRightToBracketIcon} from '@oxygen-ui/react-icons'; import clsx from 'clsx'; import {FC, ReactElement, ReactNode} from 'react'; import {useIsMobile} from '../../hooks/use-is-mobile'; @@ -121,7 +121,7 @@ export interface BrandTemplate { } const userDropdownMenuDefaultProps: UserDropdownMenuHeaderProps = { - actionIcon: , + actionIcon: , actionText: 'Logout', onActionClick: (): void => null, }; @@ -174,7 +174,7 @@ const Header: FC & WithWrapperProps = (props: HeaderProps): ReactEl {showCollapsibleHamburger && (
null)}> - +
)} diff --git a/packages/react/src/components/Header/__tests__/__snapshots__/Header.test.tsx.snap b/packages/react/src/components/Header/__tests__/__snapshots__/Header.test.tsx.snap index ba82ad83..373d8d18 100644 --- a/packages/react/src/components/Header/__tests__/__snapshots__/Header.test.tsx.snap +++ b/packages/react/src/components/Header/__tests__/__snapshots__/Header.test.tsx.snap @@ -55,7 +55,7 @@ exports[`Header should match the snapshot 1`] = ` > diff --git a/packages/react/src/components/IconButton/IconButton.stories.mdx b/packages/react/src/components/IconButton/IconButton.stories.mdx index 36a9cc97..70406949 100644 --- a/packages/react/src/components/IconButton/IconButton.stories.mdx +++ b/packages/react/src/components/IconButton/IconButton.stories.mdx @@ -1,5 +1,5 @@ import {ArgsTable, Source, Story, Canvas, Meta} from '@storybook/addon-docs'; -import {PowerIcon} from '@oxygen-ui/react-icons'; +import {HomeIcon} from '@oxygen-ui/react-icons'; import dedent from 'ts-dedent'; import StoryConfig from '../../../.storybook/story-config.ts'; import IconButton from './IconButton.tsx'; @@ -28,7 +28,7 @@ Icons are also appropriate for toggle buttons that allow a single choice to be s + ) }}> {Template.bind({})} diff --git a/packages/react/src/components/IconButton/__tests__/IconButton.test.tsx b/packages/react/src/components/IconButton/__tests__/IconButton.test.tsx index 5d1d79b4..8eac4503 100644 --- a/packages/react/src/components/IconButton/__tests__/IconButton.test.tsx +++ b/packages/react/src/components/IconButton/__tests__/IconButton.test.tsx @@ -16,7 +16,7 @@ * under the License. */ -import {PowerIcon} from '@oxygen-ui/react-icons'; +import {HomeIcon} from '@oxygen-ui/react-icons'; import {render} from '@unit-testing'; import IconButton from '../IconButton'; @@ -24,7 +24,7 @@ describe('IconButton', () => { it('should render successfully', () => { const {baseElement} = render( - + , ); expect(baseElement).toBeTruthy(); @@ -33,7 +33,7 @@ describe('IconButton', () => { it('should match the snapshot', () => { const {baseElement} = render( - + , ); expect(baseElement).toMatchSnapshot(); diff --git a/packages/react/src/components/IconButton/__tests__/__snapshots__/IconButton.test.tsx.snap b/packages/react/src/components/IconButton/__tests__/__snapshots__/IconButton.test.tsx.snap index 62164fd3..1d7e3795 100644 --- a/packages/react/src/components/IconButton/__tests__/__snapshots__/IconButton.test.tsx.snap +++ b/packages/react/src/components/IconButton/__tests__/__snapshots__/IconButton.test.tsx.snap @@ -10,7 +10,7 @@ exports[`IconButton should match the snapshot 1`] = ` > - + diff --git a/packages/react/src/components/Navbar/Navbar.stories.mdx b/packages/react/src/components/Navbar/Navbar.stories.mdx index 796c4926..660b6e19 100644 --- a/packages/react/src/components/Navbar/Navbar.stories.mdx +++ b/packages/react/src/components/Navbar/Navbar.stories.mdx @@ -1,9 +1,9 @@ import { - ConsoleUserThickIcon, + UserDocumentIcon, HomeFilledIcon, LockIcon, - PreferencesIcon, - LanguagesIcon, + GearIcon, + LanguageIcon, SunIcon, } from '@oxygen-ui/react-icons'; import {useArgs} from '@storybook/client-api'; @@ -29,7 +29,7 @@ export const navbarItems = [ id: 'overview' }, { - icon: , + icon: , name: 'Profile Info', id: 'profile info' }, @@ -45,12 +45,12 @@ export const navbarItems = [ { items: [ { - icon: , + icon: , name: 'Language', id:'language' }, { - icon: , + icon: , name: 'Preferences', id: 'preferences' }, @@ -71,7 +71,7 @@ export const navbarItemsHeading = [ id: 'overview' }, { - icon: , + icon: , name: 'Profile Info', id: 'profile info' }, @@ -87,12 +87,12 @@ export const navbarItemsHeading = [ id: 'settings', items: [ { - icon: , + icon: , name: 'Language', id: 'language' }, { - icon: , + icon: , name: 'Preferences', id: 'preferences' }, diff --git a/packages/react/src/components/Navbar/Navbar.tsx b/packages/react/src/components/Navbar/Navbar.tsx index 3c3d6d22..04b05737 100644 --- a/packages/react/src/components/Navbar/Navbar.tsx +++ b/packages/react/src/components/Navbar/Navbar.tsx @@ -16,7 +16,7 @@ * under the License. */ -import {HamburgerIcon} from '@oxygen-ui/react-icons'; +import {BarsIcon} from '@oxygen-ui/react-icons'; import clsx from 'clsx'; import {FC, ReactElement, ReactNode, MouseEvent, Fragment, MouseEventHandler} from 'react'; import {WithWrapperProps, Theme} from '../../models'; @@ -138,7 +138,7 @@ const Navbar: FC & WithWrapperProps = (props: NavbarProps): ReactEl <>
- {theme.direction === 'rtl' ? : } + {theme.direction === 'rtl' ? : }
diff --git a/packages/react/src/components/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap b/packages/react/src/components/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap index 821df152..72ad5050 100644 --- a/packages/react/src/components/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap +++ b/packages/react/src/components/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap @@ -20,7 +20,7 @@ exports[`Navbar should match the snapshot 1`] = ` >