From eca8d4cb6df82ae3978b64ef2bebbae797bfbb6d Mon Sep 17 00:00:00 2001 From: Mitch Ryan Date: Wed, 13 Mar 2019 10:25:13 +1300 Subject: [PATCH] Update AccordionItemState API to use object for render prop args --- README.md | 2 +- src/components/AccordionItemState.spec.tsx | 12 ++++++++++-- src/components/AccordionItemState.tsx | 12 +++++++++--- 3 files changed, 20 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index fd92ec20..fb3a7aa5 100644 --- 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 index 396174b2..c9ff8bb5 100644 --- a/src/components/AccordionItemState.spec.tsx +++ b/src/components/AccordionItemState.spec.tsx @@ -30,7 +30,11 @@ describe('ItemContext', () => { - {(expanded: boolean): JSX.Element => ( + {({ + expanded, + }: { + expanded: boolean; + }): JSX.Element => (
{expanded && 'expanded'}
@@ -39,7 +43,11 @@ describe('ItemContext', () => {
- {(expanded: boolean): JSX.Element => ( + {({ + expanded, + }: { + expanded: boolean; + }): JSX.Element => (
{expanded && 'expanded'}
diff --git a/src/components/AccordionItemState.tsx b/src/components/AccordionItemState.tsx index 45be2720..1189a110 100644 --- 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> & { - children(expanded?: boolean): React.ReactNode; + children( + args: Partial<{ expanded: boolean; disabled: boolean }>, + ): React.ReactNode; }; export default class AccordionItemState extends React.Component { renderChildren = (itemContext: ItemContext): JSX.Element => { - const { expanded } = itemContext; + const { expanded, disabled } = itemContext; - return {this.props.children(expanded)}; + return ( + + {this.props.children({ expanded, disabled })} + + ); }; render(): JSX.Element {