Update AccordionItemState API to use object for render prop args

springload · Mar 12, 2019 · eca8d4c · eca8d4c
1 parent cb2db5e
commit eca8d4c
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -148,7 +148,7 @@ Class(es) to apply to element.
 
 ### AccordionItemState
 
-#### children : `(expanded: boolean): JSX.Element` [**required**]
+#### children : `({ expanded: boolean, disabled: boolean }): JSX.Element` [**required**]
 
 ---
 

diff --git a/src/components/AccordionItemState.spec.tsx b/src/components/AccordionItemState.spec.tsx
@@ -30,7 +30,11 @@ describe('ItemContext', () => {
                 <Accordion preExpanded={[UUIDS.FOO]}>
                     <AccordionItem uuid={UUIDS.FOO}>
                         <AccordionItemState>
-                            {(expanded: boolean): JSX.Element => (
+                            {({
+                                expanded,
+                            }: {
+                                expanded: boolean;
+                            }): JSX.Element => (
                                 <div data-testid={UUIDS.FOO}>
                                     {expanded && 'expanded'}
                                 </div>
@@ -39,7 +43,11 @@ describe('ItemContext', () => {
                     </AccordionItem>
                     <AccordionItem uuid={UUIDS.BAR}>
                         <AccordionItemState>
-                            {(expanded: boolean): JSX.Element => (
+                            {({
+                                expanded,
+                            }: {
+                                expanded: boolean;
+                            }): JSX.Element => (
                                 <div data-testid={UUIDS.BAR}>
                                     {expanded && 'expanded'}
                                 </div>

diff --git a/src/components/AccordionItemState.tsx b/src/components/AccordionItemState.tsx
@@ -3,14 +3,20 @@ import { DivAttributes } from '../helpers/types';
 import { Consumer as ItemConsumer, ItemContext } from './ItemContext';
 
 type Props = Pick<DivAttributes, Exclude<keyof DivAttributes, 'children'>> & {
-    children(expanded?: boolean): React.ReactNode;
+    children(
+        args: Partial<{ expanded: boolean; disabled: boolean }>,
+    ): React.ReactNode;
 };
 
 export default class AccordionItemState extends React.Component<Props> {
     renderChildren = (itemContext: ItemContext): JSX.Element => {
-        const { expanded } = itemContext;
+        const { expanded, disabled } = itemContext;
 
-        return <React.Fragment>{this.props.children(expanded)}</React.Fragment>;
+        return (
+            <React.Fragment>
+                {this.props.children({ expanded, disabled })}
+            </React.Fragment>
+        );
     };
 
     render(): JSX.Element {