Merge branch 'release/2.3.0'

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,27 @@
+---
+name: Bug report
+about: Create a report to help us improve
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To Reproduce**
+Steps to reproduce the behavior:
+
+[React Collapsible JSFiddle Template](https://jsfiddle.net/982f3LL7)
+
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Additional context**
+Add any other context about the problem here.

README.md

@@ -1,3 +1,5 @@
+[![Npm Version](https://img.shields.io/npm/v/react-collapsible.svg?style=flat-square)](https://www.npmjs.com/package/react-collapsible) [![License](https://img.shields.io/npm/l/react-collapsible.svg?style=flat-square)](https://github.com/glennflanagan/react-collapsible/blob/develop/LICENSE.md) [![Downloads Per Week](https://img.shields.io/npm/dw/react-collapsible.svg?style=flat-square)](https://npmcharts.com/compare/react-collapsible)
+
 # React Responsive Collapsible Section Component (Collapsible)
 
 React component to wrap content in Collapsible element with trigger to open and close.
@@ -176,5 +178,12 @@ $ npm run example
 
 This will run the webpack build and open the example.
 
+## Issues
+
+Please create an issue for any bug or feature requests.
+
+Here is a plain [JSFiddle](https://jsfiddle.net/sm7n31p1/1/) to use for replicating bugs.
+
+
 ## Licence
 React Responsive Collapsible Section Component is [MIT licensed](LICENSE.md)

__tests__/index.js

@@ -0,0 +1,72 @@
+// Tests for Collapsible.
+import React from 'react';
+import { configure, shallow, mount, render } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+import Collapsible from '../src/Collapsible';
+
+configure({ adapter: new Adapter() });
+
+const dummyEvent = { preventDefault: () => {}};
+
+describe('<Collapsbile />', () => {
+  it('renders an element with the class `.Collapsible`.', () => {
+    const wrapper = shallow(<Collapsible />);
+    expect(wrapper.is('.Collapsible')).toEqual(true);
+  });
+
+  it('renders Collapsible with trigger text.', () => {
+    const wrapper = shallow(<Collapsible trigger='Hello World'/> )
+    expect(wrapper.find('span').text()).toEqual('Hello World')
+  });
+
+  it('given a closed Collapsible fires the onOpening prop when clicked to open', () => {
+    const mockOnOpening = jest.fn();
+    const collapsbile = shallow(<Collapsible trigger='Hello World' onOpening={mockOnOpening}/> );
+    const trigger = collapsbile.find('.Collapsible__trigger');
+
+    expect(trigger).toHaveLength(1);
+    trigger.simulate('click', dummyEvent);
+    expect(mockOnOpening.mock.calls).toHaveLength(1);
+  });
+
+  it('given an open Collapsible fires the onClosing prop when clicked to close', () => {
+    const mockOnClosing = jest.fn();
+    const collapsbile = mount(<Collapsible open trigger='Hello World' onClosing={mockOnClosing}/> );
+    const trigger = collapsbile.find('.Collapsible__trigger');
+
+    expect(trigger).toHaveLength(1);
+    trigger.simulate('click', dummyEvent);
+    expect(mockOnClosing.mock.calls).toHaveLength(1);
+  });
+
+  it('given a closed Collapsible it fires the onOpen prop after the transistion', () => {
+    const mockOnOpen = jest.fn();
+    const collapsbile = shallow(<Collapsible open trigger='Hello World' onOpen={mockOnOpen}>Some Content</Collapsible> );
+    const outer = collapsbile.find('.Collapsible__contentOuter');
+
+    expect(outer).toHaveLength(1);
+    outer.simulate('transitionEnd', dummyEvent);
+    expect(mockOnOpen.mock.calls).toHaveLength(1);
+  });
+
+  it('given an open Collapsible it fires the onClose prop after the transistion', () => {
+    const mockOnClose = jest.fn();
+    const collapsbile = shallow(<Collapsible trigger='Hello World' onClose={mockOnClose}>Some Content</Collapsible> );
+    const outer = collapsbile.find('.Collapsible__contentOuter');
+
+    expect(outer).toHaveLength(1);
+    outer.simulate('transitionEnd', dummyEvent);
+    expect(mockOnClose.mock.calls).toHaveLength(1);
+  });
+
+  it('given a Collapsible with the handleTriggerClick prop, the handleTriggerClick prop gets fired', () => {
+    const mockHandleTriggerClick = jest.fn();
+    const collapsbile = shallow(<Collapsible handleTriggerClick={mockHandleTriggerClick} trigger="Hello world" />);
+    const trigger = collapsbile.find('.Collapsible__trigger');
+
+    expect(trigger).toHaveLength(1);
+    trigger.simulate('click', dummyEvent);
+    expect(mockHandleTriggerClick.mock.calls).toHaveLength(1);
+  })
+})

index.d.ts

@@ -0,0 +1,42 @@
+declare class Collapsible extends React.Component<CollapsibleProps> {}
+declare namespace Collapsible {}
+
+interface CollapsibleProps extends React.HTMLProps<Collapsible> {
+  transitionTime?: number
+  transitionCloseTime?: number | null
+  triggerTagName?: string
+  easing?: string
+  open?: boolean
+  classParentString?: string
+  openedClassName?: string
+  triggerStyle?: null | Object
+  triggerClassName?: string
+  triggerOpenedClassName?: string
+  contentOuterClassName?: string
+  contentInnerClassName?: string
+  accordionPosition?: string | number
+  handleTriggerClick?: (accordionPosition?: string | number) => void
+  onOpen?: () => void
+  onClose?: () => void
+  onOpening?: () => void
+  onClosing?: () => void
+  trigger: string | React.ReactElement<any>
+  triggerWhenOpen?: string | React.ReactElement<any>
+  triggerDisabled?: false
+  lazyRender?: boolean
+  overflowWhenOpen?:
+    | 'hidden'
+    | 'visible'
+    | 'auto'
+    | 'scroll'
+    | 'inherit'
+    | 'initial'
+    | 'unset'
+  triggerSibling?: React.ReactElement<any>
+  className?: string
+  tabIndex?: null | number
+}
+
+declare module 'react-collapsible' {
+  export default Collapsible
+}