Hey PatternFly-React devs! pf-codemods
is an eslint wrapper to update @patternfly/[email protected] code to 5.x.x.
I hope these rules and their autofixers will help you more quickly adopt our breaking changes. These rules are not designed to fix all build errors, but they can help to fix easy ones.
Requires Node.js >= 10.
npx pf-codemods ./src
Giving node more RAM can help for large codebases.
NODE_OPTIONS=--max-old-space-size=4096 npx pf-codemods ./path-to-src
Usage: pf-codemods [options] <path> [otherPaths...]
Run codemods on path using eslint.
Options:
-V, --version output the version number
--only <rules> Comma-seperated list of rules to run
--exclude <rules> Run recommended rules EXCLUDING this comma-seperated list
--fix Whether to run fixer
--format <format> What eslint report format to use (default: "stylish")
-h, --help display help for command
These rules are based off the breaking change notes for React. Each rule links the breaking change patternfly-react PR in case you want to better understand the change. Also, each rule makes sure you're using a PatternFly component before running.
accordion-rename-displaySize-large (#8212)
We've renamed the large
prop value of displaySize
to lg
.
In:
<Accordion displaySize="large" />
Out:
<Accordion displaySize="lg" />
card-remove-isHoverable (#8196)
We've removed the deprecated isHoverable
prop from Card.
In:
<Card isHoverable />
Out:
<Card />
datalist-remove-ondrags (#163)
We've removed the deprecated onDragFinish
, onDragStart
, onDragMove
, and onDragCancel
props. This rule will remove them and suggest the user use the DragDrop component.
In:
<DataList onDragStart />
Out:
<DataList />
divider-remove-isVertical (#8199)
We've replaced the isVertical
flag with the orientation
property that can define verticality on different breakpoints.
<Divider isVertical />
Out:
<Divider orientation={{ default: "vertical" }} />
expandable-section-rename-displaySize-large (#8212)
We've renamed the large
prop value of displaySize
to lg
.
In:
<ExpandableSection displaySize="large" />
Out:
<ExpandableSection displaySize="lg" />
fileUpload-remove-onChange (#8155)
We've removed the deprecated onChange
prop. This rule will remove the prop from the FileUpload component and suggest replacing it with the onFileInputChange
, onTextChange
, onDataChange
, and onClearClick
props as needed.
In:
<FileUpload onChange={onChange} />
Out:
<FileUpload />
pagination-remove-ToggleTemplateProps (#8134)
We've removed the depracated ToggleTemplateProps
prop and replaced it with PaginationToggleTemplateProps
.
In:
<Pagination ToggleTemplateProps />
Out:
<Pagination PaginationToggleTemplateProps />
pagination-rename-props (#8319)
We've renamed and/or removed several props for Pagination:
currPage
:currPageAriaLabel
,paginationTitle
:paginationAriaLabel
,toFirstPage
:toFirstPageAriaLabel
,toLastPage
:toLastPageAriaLabel
,toNextPage
:toNextPageAriaLabel
,toPreviousPage
:toPreviousPageAriaLabel
,optionsToggle
:optionsToggleAriaLabel
,defaultToFullPage
:isLastFullPageShown
,perPageComponenet
: removed
In:
<Pagination
currPage='text'
paginationTitle='text'
toFirstPage='text'
toLastPage='text'
toNextPage='text'
toPreviousPage='text'
optionsToggle='text'
defaultToFullPage
perPageComponenet='div'
/>
Out:
<Pagination
currPageAriaLabel='text'
paginationAriaLabel='text'
toFirstPageAriaLabel='text'
toLastPageAriaLabel='text'
toNextPageAriaLabel='text'
toPreviousPageAriaLabel='text'
optionsToggleAriaLabel='text'
isLastFullPageShown
/>
remove-sticky-props (#8220)
We've removed the deprecated sticky
prop from PageSection
, PageGroup
, PageNavigation
, and PageBreadcrumb
.
In:
<PageSection sticky="top" />
<PageGroup sticky="top" />
<PageNavigation sticky="top" />
<PageBreadcrumb sticky="top" />
Out:
<PageSection />
<PageGroup />
<PageNavigation />
<PageBreadcrumb />
resizeObserver-function-param (#8324)
We've updated the default value of the getResizeObserver
helper function's third parameter, useRequestAnimationFrame
. This rule will only provide two suggestions detailing when to pass which boolean into this parameter.
tableComposable-remove-hasSelectableRowCaption (#8352)
We've removed the depracated hasSelectableRowCaption
prop.
In:
<TableComposable hasSelectableRowCaption />
Out:
<TableComposable />
simpleList-remove-isCurrent (#8132)
We've removed the deprecated the isCurrent
prop. This rule wil replace it with isActive
.
In:
<SimpleList isCurrent />
Out:
<SimpleList isActive />
toggle-remove-isprimary (#8179)
We've removed the deprecated isPrimary
prop. This rule wil replace it with the "primary" value on the toggleVariant
prop.
In:
<Toggle isPrimary />
Out:
<Toggle toggleVariant="primary" />
toolbar-remove-visiblity (#8212)
We've removed the deprecated visiblity
prop. This rule will replace it with the correctly spelled visibility
prop.
In:
<ToolbarContent visiblity={{ default: "hidden" }} />
Out:
<ToolbarContent visibility={{ default: "hidden" }} />
tooltip-remove-props (#8231)
We've removed the boundary
, tippyProps
, and isAppLauncher
properties from Tooltip.
In:
<Tooltip boundary={} tippyProps={} isAppLauncher />
Out:
<Tooltip />