Changelog History
Page 2
-
v3.0.0 Changes
March 31, 2019π This release is the culmination of a massive amount of work, resulting in some π new features and significantly stronger and more reliable WAI ARIA spec compliance. Notably, the project has been migrated from Flow to Typescript, and a full accessibility audit has been performed - revealing a few holes in our compliance which have now been entirely addressed.
π Thanks to everyone who has contributed to this release - and not just those who have written code. Contribution by way of issues relating to spec compliance, pull-request commentary, advice and assistance is all greatly appreciated. Thanks also to the patient users who have endured an extended period without a π release while we made sure to get this 100% right! Release cadence should return to normal again now.
π₯ Breaking Changes - Upgrade Guide:
Rename all of your
AccordionItemTitle
components toAccordionItemHeading
and then nest anAccordionItemButton
directly inside of each one. Note that in order for your Accordion to remain spec-compliant, you may not put any other children insideAccordionItemHeading
.// Before: import { AccordionItemTitle } from 'react-accessible-accordion'; const headingBefore = <AccordionItemTitle>Foo</AccordionItemTitle>;
// After: import { AcccordionItemHeading, AccordionItemButton, } from 'react-accessible-accordion'; const headingAfter = ( <AccordionItemHeading> <AccordionItemButton>Foo</AccordionItemButton> </AccordionItemHeading> );
Rename all of your
AccordionItemBody
components toAccordionItemPanel
.// Before: import { AccordionItemBody } from 'react-accessible-accordion'; const panelBefore = ( <AccordionItemBody> Voluptate elit eiusmod laborum proident esse officia dolor laboris laboris amet nulla officia cillum. </AccordionItemBody> );
// After: import { AccordionItemPanel } from 'react-accessible-accordion'; const panelAfter = ( <AccordionItemPanel> Voluptate elit eiusmod laborum proident esse officia dolor laboris laboris amet nulla officia cillum. </AccordionItemPanel> );
π 3. Remove all instances of
hideBodyClassName
. This prop is no longer valid, asAccordionItemPanel
components are now hidden without additional styling. If you must have a differentclassName
prop when an item is collapsed, then you may leverage the newAccordionItemState
component.```tsx // Before import { AccordionItemPanel } from 'react-accessible-accordion'; const panelBefore = ( <AccordionItemPanel className="foo" hideBodyClassName="foo--hidden" /> ); ``` ```tsx // After: import { AccordionItemPanel, AccordionItemState, } from 'react-accessible-accordion'; const panelAfter = ( <AccordionItemState> {({ expanded }) => ( <AccordionItemPanel className={expanded ? 'foo' : 'foo foo--hidden'} /> )} </AccordionItemState> ); ```
π 4. Remove all instances of
AccordionItem
βsexpanded
prop and instead useAccordion
βspreExpanded
prop. Note that this means that βcontrolledβ accordions are no longer a supported pattern. Please raise an issue if you have a use-case which calls for the ability to manually control expanded state.```tsx // Before import { Accordion, AccordionItem } from 'react-accessible-accordion'; const accordionBefore = ( <Accordion> <AccordionItem expanded /> </Accordion> ); ``` ```tsx // After: import { Accordion, AccordionItem } from 'react-accessible-accordion'; const accordionAfter = ( <Accordion preExpanded={['foo']}> <AccordionItem uuid="foo" /> </Accordion> ); ```
π 5. Remove all instances of
Accordion
βsaccordion
prop. Instead, use a combination ofallowZeroExpanded
andallowMultipleExpanded
props to suit your requirements. If you were not explicitly settingaccordion
tofalse
then you probably are not required to make any changes here.```tsx // Before import { Accordion } from 'react-accessible-accordion'; const accordionBefore = <Accordion accordion={false} />; ``` ```tsx // After: import { Accordion } from 'react-accessible-accordion'; const accordionAfter = <Accordion allowMultipleExpanded />; ```
β¬οΈ 6. Upgrade to React v16.3+
π 7. Remove your
minimal-example.css
import. These styles only applieddisplay: none
to panels when collapsed, but browsers apply these styles to elements with thehidden
attribute, which theAccordionItemPanel
component now has (when collapsed).β Added
- Added
AccordionItemButton
component. - Added
AccordionItemState
component. - Added
allowZeroExpanded
prop toAccordion
. - Added
allowMultipleExpanded
prop toAccordion
. - π Out-of-the-box Typescript support.
- β Integration tests to explicitly assert every line of the WAI ARIA 'Accordion' spec.
- Additional keyboard functionality (Up, Down, Left, Right, Home, End).
π Changed
- Renamed
AccordionItemTitle
toAccordionItemHeading
to be consistent with the language used in the WAI ARIA spec. - Renamed
AccordionItemBody
toAccordionItemPanel
to be consistent with the language used in the WAI ARIA spec. - β‘οΈ Updated
AccordionItemPanel
to have ahidden
attribute. - β‘οΈ Roles and aria attributes all audited and updated to match the WAI ARIA spec.
- β‘οΈ Update
onChange
to always be called with an array of the currently expanded items.
π Fixed
- π Fixes SSR (server-side rendering).
- π Fixes incorrect roles and attributes as per the WAI ARIA spec.
β Removed
- π Removed Flow support (but we hope to reinstate typing in the future. Track progress here).
- π Removed undocumented
expanded
mechanism forAccordionItems
. - π Removed undocumented
disabled
mechanism forAccordionItems
. - π Remove
hideBodyClassName
prop.
-
v2.4.5 Changes
October 18, 2018π Fixed
- π Fixes SSR.
-
v2.4.4 Changes
July 24, 2018π This release addresses some performance concerns, and should result in lower memory usage and prevented crashes.
π Fixed
- π Fixes performance issue with not re-instantiating render-prop callbacks on each re-render.
-
v2.4.4-beta.1
July 24, 2018 -
v2.4.3 Changes
June 27, 2018π Fixed
- π Fixes issue with spacebar scrolling the page (see PR#99)
- π Fixes IE compatibility by replacing uses of Array.prototype.find.
-
v2.4.2 Changes
June 26, 2018π Changed
- π Removes invalid test
- π¦ Minor change to package.json to remove some redundant Jest config.
- β¬οΈ Upgrade one forgotten devDependency.
π Fixed
- π Emergency bug fix to remove asyc/await from the code (see PR#95)
-
v2.4.1 Changes
May 28, 2018π This release brings support for React 16.3+ by way of some minor refactoring to β remove deprecated lifecycle methods.
π Changed
- π Replace deprecated lifecycle methods 'componentWillReceiveProps', 'componentWillUpdate' and 'componentWillMount'.
- π Updated
unstated
(internal dependency) to latest major release. - β‘οΈ Updated all devDependencies.
-
v2.4.0 Changes
May 28, 2018β Added
- Possibility to have custom uuid on
AccordionItem
- suggested by #70
π Fixed
- π Fix rollup config after version bump - https://gist.github.com/Rich-Harris/d472c50732dab03efeb37472b08a3f32
- β Adds existing arrow animation for aria-selected=true in fancy CSS
- Possibility to have custom uuid on
-
v2.3.1 Changes
April 13, 2018π Fixed
- β Add
dist
folder to list of Flow ignores, so Flow doesnβt error after a build. - βͺ Issue with babel helpers. Just reverted commit 6f9f2c3 for now.
π Changed
- β Removed a couple of old npm scripts from the days before we introduced rollup to the build
pipeline. - π¨ Upgraded a bunch of devDependencies, including Webpack which required a bit of a config refactor.
- β Add
-
v2.3.0 Changes
π Changed
- π¨ Refactored to use
unstated
for state-management instead ofmobx
+mobx-react
, cutting the size of the bundle by approximately 60% π.
- π¨ Refactored to use