All Versions
23
Latest Version
Avg Release Cycle
64 days
Latest Release
242 days ago

Changelog History
Page 1

  • v3.0.1

    November 14, 2019

    πŸ›  Fixed

    • ♻️ Refactor away Array.prototype.findIndex in favour of Array.prototype.indexOf to reinstate IE 11 compatibility without use of a polyfill (#237, #224).
  • v3.0.0

    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:

    1. Rename all of your AccordionItemTitle components to AccordionItemHeading and then nest an AccordionItemButton directly inside of each one. Note that in order for your Accordion to remain spec-compliant, you may not put any other children inside AccordionItemHeading.

      // 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>
      );
      
    2. Rename all of your AccordionItemBody components to AccordionItemPanel.

      // 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, as AccordionItemPanel components are now hidden without additional styling. If you must have a different className prop when an item is collapsed, then you may leverage the new AccordionItemState 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’s expanded prop and instead use Accordion’s preExpanded 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’s accordion prop. Instead, use a combination of allowZeroExpanded and allowMultipleExpanded props to suit your requirements. If you were not explicitly setting accordion to false 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 applied display: none to panels when collapsed, but browsers apply these styles to elements with the hidden attribute, which the AccordionItemPanel component now has (when collapsed).

    βž• Added

    • Added AccordionItemButton component.
    • Added AccordionItemState component.
    • Added allowZeroExpanded prop to Accordion.
    • Added allowMultipleExpanded prop to Accordion.
    • πŸ‘ 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 to AccordionItemHeading to be consistent with the language used in the WAI ARIA spec.
    • Renamed AccordionItemBody to AccordionItemPanel to be consistent with the language used in the WAI ARIA spec.
    • ⚑️ Updated AccordionItemPanel to have a hidden 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 for AccordionItems.
    • 🚚 Removed undocumented disabled mechanism for AccordionItems.
    • 🚚 Remove hideBodyClassName prop.
  • v2.4.5

    October 18, 2018

    πŸ›  Fixed

    • πŸ›  Fixes SSR.
  • v2.4.4

    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

    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

    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

    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

    May 28, 2018

    βž• Added

    • Possibility to have custom uuid on AccordionItem - suggested by #70

    πŸ›  Fixed

  • v2.3.1

    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.