diff --git a/packages/react-code-editor/src/components/CodeEditor/CodeEditor.tsx b/packages/react-code-editor/src/components/CodeEditor/CodeEditor.tsx index cfadb403965..c0d004476d6 100644 --- a/packages/react-code-editor/src/components/CodeEditor/CodeEditor.tsx +++ b/packages/react-code-editor/src/components/CodeEditor/CodeEditor.tsx @@ -17,8 +17,8 @@ import { getResizeObserver } from '@patternfly/react-core/dist/esm/helpers/resiz import Editor, { BeforeMount, EditorProps, Monaco } from '@monaco-editor/react'; import type { editor } from 'monaco-editor'; import RhUiCopyFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-copy-fill-icon'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; -import DownloadIcon from '@patternfly/react-icons/dist/esm/icons/download-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; +import RhUiDownloadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-download-icon'; import RhUiCodeIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-code-icon'; import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; import Dropzone, { FileRejection } from 'react-dropzone'; @@ -541,7 +541,7 @@ export const CodeEditor = ({ )} {isUploadEnabled && ( } + icon={} aria-label={uploadButtonAriaLabel} tooltipProps={{ content:
{uploadButtonToolTipText}
, ...tooltipProps }} onClick={open} @@ -549,7 +549,7 @@ export const CodeEditor = ({ )} {isDownloadEnabled && (!showEmptyState || !!value) && ( } + icon={} aria-label={downloadButtonAriaLabel} tooltipProps={{ content:
{downloadButtonToolTipText}
, ...tooltipProps }} onClick={() => { diff --git a/packages/react-code-editor/src/components/CodeEditor/__test__/__snapshots__/CodeEditor.test.tsx.snap b/packages/react-code-editor/src/components/CodeEditor/__test__/__snapshots__/CodeEditor.test.tsx.snap index f91566a42f9..88173df32e3 100644 --- a/packages/react-code-editor/src/components/CodeEditor/__test__/__snapshots__/CodeEditor.test.tsx.snap +++ b/packages/react-code-editor/src/components/CodeEditor/__test__/__snapshots__/CodeEditor.test.tsx.snap @@ -69,24 +69,12 @@ exports[`Matches snapshot with control buttons enabled 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + @@ -111,24 +99,12 @@ exports[`Matches snapshot with control buttons enabled 1`] = ` fill="currentColor" height="1em" role="img" + viewBox="0 0 32 32" width="1em" > - - - - - - + diff --git a/packages/react-core/src/components/Button/examples/Button.md b/packages/react-core/src/components/Button/examples/Button.md index 137db78d86c..5d534c1ce92 100644 --- a/packages/react-core/src/components/Button/examples/Button.md +++ b/packages/react-core/src/components/Button/examples/Button.md @@ -12,7 +12,7 @@ import RhUiExternalLinkFillIcon from '@patternfly/react-icons/dist/esm/icons/rh- import RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon'; import RhUiCopyFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-copy-fill-icon'; import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon'; import RhUiQuestionMarkCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-question-mark-circle-fill-icon'; diff --git a/packages/react-core/src/components/Button/examples/ButtonCircle.tsx b/packages/react-core/src/components/Button/examples/ButtonCircle.tsx index 615bde1efc5..39fe1b6402e 100644 --- a/packages/react-core/src/components/Button/examples/ButtonCircle.tsx +++ b/packages/react-core/src/components/Button/examples/ButtonCircle.tsx @@ -3,7 +3,7 @@ import RhMicronsCloseIcon from '@patternfly/react-icons/dist/esm/icons/rh-micron import RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon'; import RhUiCopyFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-copy-fill-icon'; import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; interface LoadingPropsType { spinnerAriaValueText: string; @@ -75,7 +75,7 @@ export const ButtonCircle: React.FunctionComponent = () => { isCircle {...(!isUploading && { 'aria-label': 'Upload circle variant example' })} onClick={() => setIsUploading(!isUploading)} - icon={} + icon={} {...uploadingProps} /> diff --git a/packages/react-core/src/components/Button/examples/ButtonProgress.tsx b/packages/react-core/src/components/Button/examples/ButtonProgress.tsx index fd78b5fb8db..97b76f798ba 100644 --- a/packages/react-core/src/components/Button/examples/ButtonProgress.tsx +++ b/packages/react-core/src/components/Button/examples/ButtonProgress.tsx @@ -1,6 +1,6 @@ import { useState } from 'react'; import { Button, Flex } from '@patternfly/react-core'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; interface LoadingPropsType { spinnerAriaValueText: string; @@ -59,7 +59,7 @@ export const ButtonProgress: React.FunctionComponent = () => { variant="plain" {...(!isUploading && { 'aria-label': 'Upload' })} onClick={() => setIsUploading(!isUploading)} - icon={} + icon={} {...uploadingProps} />
diff --git a/packages/react-core/src/components/FileUpload/examples/FileUpload.md b/packages/react-core/src/components/FileUpload/examples/FileUpload.md index d7e9c6e7ab3..4cff712ba1d 100644 --- a/packages/react-core/src/components/FileUpload/examples/FileUpload.md +++ b/packages/react-core/src/components/FileUpload/examples/FileUpload.md @@ -7,7 +7,7 @@ subsection: file-upload --- import { useState } from 'react'; -import FileUploadIcon from '@patternfly/react-icons/dist/esm/icons/file-upload-icon'; +import RhUiDocumentFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-document-fill-icon'; ## Examples @@ -21,6 +21,7 @@ Pressing _Clear_ button triggers `onClearClick` event. ### Simple text file ```ts file="./FileUploadSimpleText.tsx" + ``` ### With helper text @@ -28,6 +29,7 @@ Pressing _Clear_ button triggers `onClearClick` event. You can pass in the ``. ```ts file="./FileUploadWithHelperText.tsx" + ``` ### Text file with edits allowed @@ -36,6 +38,7 @@ A user can always type instead of selecting a file, but by default, once a user Typing/pasting text in the box will call `onTextChange` with a string, and a string value is expected for the `value` prop. : ```ts file="./FileUploadTextWithEdits.tsx" + ``` ### Restricting file size and type @@ -49,6 +52,7 @@ Restricting file sizes and types in this way is for user convenience only, and i ### Text file with restrictions ```ts file="./FileUploadTextWithRestrictions.tsx" + ``` ### Other file types @@ -58,6 +62,7 @@ If no `type` prop is specified, the component will not read files directly. When ### Simple file of any format ```ts file="./FileUploadSimpleFile.tsx" + ``` ### Customizing the file preview @@ -67,6 +72,7 @@ Regardless of `type`, the preview area (the TextArea, or any future implementati ### Custom file preview ```ts file="./FileUploadCustomPreview.tsx" + ``` ### Bringing your own file browse logic @@ -78,6 +84,7 @@ Note that the `isLoading` prop is styled to position the spinner dead center abo ### Custom file upload ```ts file="./FileUploadCustomUpload.tsx" + ``` ## Types diff --git a/packages/react-core/src/components/FileUpload/examples/FileUploadCustomPreview.tsx b/packages/react-core/src/components/FileUpload/examples/FileUploadCustomPreview.tsx index 0a33f46eb75..a3b9bb9ba2a 100644 --- a/packages/react-core/src/components/FileUpload/examples/FileUploadCustomPreview.tsx +++ b/packages/react-core/src/components/FileUpload/examples/FileUploadCustomPreview.tsx @@ -1,6 +1,6 @@ import { useState } from 'react'; import { FileUpload } from '@patternfly/react-core'; -import FileUploadIcon from '@patternfly/react-icons/dist/esm/icons/file-upload-icon'; +import RhUiDocumentFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-document-fill-icon'; export const CustomPreviewFileUpload: React.FunctionComponent = () => { const [value, setValue] = useState(); @@ -29,7 +29,7 @@ export const CustomPreviewFileUpload: React.FunctionComponent = () => { > {value && (
- Custom preview here for your {value.size}-byte file named{' '} + Custom preview here for your {value.size}-byte file named{' '} {value.name}
)} diff --git a/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUpload.md b/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUpload.md index 9ded7604897..ae9f272dfd7 100644 --- a/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUpload.md +++ b/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUpload.md @@ -8,7 +8,7 @@ propComponents: --- import { useEffect, useState } from 'react'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; Multiple file upload is able to: diff --git a/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUploadBasic.tsx b/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUploadBasic.tsx index 81a5ea60773..86c7cb7b03f 100644 --- a/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUploadBasic.tsx +++ b/packages/react-core/src/components/MultipleFileUpload/examples/MultipleFileUploadBasic.tsx @@ -9,7 +9,7 @@ import { HelperTextItem, DropEvent } from '@patternfly/react-core'; -import UploadIcon from '@patternfly/react-icons/dist/esm/icons/upload-icon'; +import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; interface readFile { fileName: string; @@ -124,7 +124,7 @@ export const MultipleFileUploadBasic: React.FunctionComponent = () => { isHorizontal={isHorizontal} > } + titleIcon={} titleText="Drag and drop files here" titleTextSeparator="or" infoText="Accepted file types: JPEG, Doc, PDF, PNG" diff --git a/packages/react-core/src/components/Toolbar/examples/Toolbar.md b/packages/react-core/src/components/Toolbar/examples/Toolbar.md index e66b7907c47..20f1dd6ce4b 100644 --- a/packages/react-core/src/components/Toolbar/examples/Toolbar.md +++ b/packages/react-core/src/components/Toolbar/examples/Toolbar.md @@ -8,7 +8,7 @@ section: components import { Fragment, useState, useLayoutEffect, useRef } from 'react'; import EditIcon from '@patternfly/react-icons/dist/esm/icons/edit-icon'; -import CloneIcon from '@patternfly/react-icons/dist/esm/icons/clone-icon'; +import RhUiCopyFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-copy-fill-icon'; import SyncIcon from '@patternfly/react-icons/dist/esm/icons/sync-icon'; import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon'; import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon'; diff --git a/packages/react-core/src/components/Toolbar/examples/ToolbarCustomLabelGroupContent.tsx b/packages/react-core/src/components/Toolbar/examples/ToolbarCustomLabelGroupContent.tsx index aaa17084d55..3fa5fc1ff22 100644 --- a/packages/react-core/src/components/Toolbar/examples/ToolbarCustomLabelGroupContent.tsx +++ b/packages/react-core/src/components/Toolbar/examples/ToolbarCustomLabelGroupContent.tsx @@ -16,7 +16,7 @@ import { } from '@patternfly/react-core'; import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon'; import EditIcon from '@patternfly/react-icons/dist/esm/icons/edit-icon'; -import CloneIcon from '@patternfly/react-icons/dist/esm/icons/clone-icon'; +import RhUiCopyFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-copy-fill-icon'; import SyncIcon from '@patternfly/react-icons/dist/esm/icons/sync-icon'; export const ToolbarCustomLabelGroupContent: React.FunctionComponent = () => { @@ -177,7 +177,7 @@ export const ToolbarCustomLabelGroupContent: React.FunctionComponent = () => {