From a43f8318a4e9c40de84eb41d5421f0660974827a Mon Sep 17 00:00:00 2001
From: Matthew Holloway <matthew@springload.co.nz>
Date: Thu, 6 Aug 2020 14:31:17 +1200
Subject: [PATCH 1/3] AccordionItem preserving uuid on instance

---
 demo/src/code-examples.tsx       | 15 ++++++++
 demo/src/index.tsx               | 20 ++++++++++
 src/components/AccordionItem.tsx | 65 +++++++++++++++++++++-----------
 3 files changed, 78 insertions(+), 22 deletions(-)

diff --git a/demo/src/code-examples.tsx b/demo/src/code-examples.tsx
index 96d0e0e9..37c7970d 100644
--- a/demo/src/code-examples.tsx
+++ b/demo/src/code-examples.tsx
@@ -36,6 +36,21 @@ export const ExampleAllowMultipleExpanded = `<Accordion allowMultipleExpanded>
     ))}
 </Accordion>`;
 
+export const ExampleAllowMultipleExpandedFalse = `<Accordion allowMultipleExpanded={false}>
+    {items.map((item) => (
+        <AccordionItem key={item.uuid}>
+            <AccordionItemHeading>
+                <AccordionItemButton>
+                    {item.heading}
+                </AccordionItemButton>
+            </AccordionItemHeading>
+            <AccordionItemPanel>
+              {item.content}
+            </AccordionItemPanel>
+        </AccordionItem>
+    ))}
+</Accordion>`;
+
 export const ExampleAllowZeroExpanded = `<Accordion allowZeroExpanded>
     {items.map((item) => (
         <AccordionItem key={item.uuid}>
diff --git a/demo/src/index.tsx b/demo/src/index.tsx
index b21cdc98..e61a4557 100644
--- a/demo/src/index.tsx
+++ b/demo/src/index.tsx
@@ -19,6 +19,7 @@ import Code from './components/Code';
 import {
     ExampleDefault,
     ExampleAllowMultipleExpanded,
+    ExampleAllowMultipleExpandedFalse,
     ExampleAllowZeroExpanded,
     ExamplePreExpanded,
     ExampleOnChange,
@@ -95,6 +96,25 @@ const App = (): JSX.Element => (
 
         <Code code={ExampleAllowMultipleExpanded} />
 
+        <h2 className="u-margin-top">
+            Same as above except with allowMultipleExpanded=false
+        </h2>
+
+        <Accordion allowMultipleExpanded={false}>
+            {placeholders.map((placeholder: Placeholder) => (
+                <AccordionItem key={placeholder.heading}>
+                    <AccordionItemHeading>
+                        <AccordionItemButton>
+                            {placeholder.heading}
+                        </AccordionItemButton>
+                    </AccordionItemHeading>
+                    <AccordionItemPanel>{placeholder.panel}</AccordionItemPanel>
+                </AccordionItem>
+            ))}
+        </Accordion>
+
+        <Code code={ExampleAllowMultipleExpandedFalse} />
+
         <h2 className="u-margin-top">Collapsing the last expanded item</h2>
 
         <p>
diff --git a/src/components/AccordionItem.tsx b/src/components/AccordionItem.tsx
index 6799dd8c..91849905 100644
--- a/src/components/AccordionItem.tsx
+++ b/src/components/AccordionItem.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import DisplayName from '../helpers/DisplayName';
 import { DivAttributes } from '../helpers/types';
 import { assertValidHtmlId, nextUuid } from '../helpers/uuid';
 import {
@@ -9,23 +10,35 @@ import {
 } from './ItemContext';
 
 type Props = DivAttributes & {
-    className?: string;
     uuid?: UUID;
     activeClassName?: string;
     dangerouslySetExpanded?: boolean;
 };
 
-const AccordionItem = ({
-    uuid = nextUuid(),
-    className = 'accordion__item',
-    activeClassName,
-    dangerouslySetExpanded,
-    ...rest
-}: Props): JSX.Element => {
-    const renderChildren = (itemContext: ItemContext): JSX.Element => {
+const defaultProps = {
+    className: 'accordion__item',
+};
+
+export default class AccordionItem extends React.Component<Props> {
+    static defaultProps: typeof defaultProps = defaultProps;
+
+    static displayName: DisplayName.AccordionItem = DisplayName.AccordionItem;
+
+    instanceUuid: UUID = nextUuid();
+
+    renderChildren = (itemContext: ItemContext): JSX.Element => {
+        const {
+            uuid,
+            className,
+            activeClassName,
+            dangerouslySetExpanded,
+            ...rest
+        } = this.props;
         const { expanded } = itemContext;
         const cx = expanded && activeClassName ? activeClassName : className;
 
+        console.log({ rest });
+
         return (
             <div
                 data-accordion-component="AccordionItem"
@@ -35,18 +48,26 @@ const AccordionItem = ({
         );
     };
 
-    if (rest.id) {
-        assertValidHtmlId(rest.id);
-    }
+    render(): JSX.Element {
+        const {
+            uuid = this.instanceUuid,
+            dangerouslySetExpanded,
+            ...rest
+        } = this.props;
 
-    return (
-        <ItemProvider
-            uuid={uuid}
-            dangerouslySetExpanded={dangerouslySetExpanded}
-        >
-            <ItemConsumer>{renderChildren}</ItemConsumer>
-        </ItemProvider>
-    );
-};
+        assertValidHtmlId(uuid);
 
-export default AccordionItem;
+        if (rest.id) {
+            assertValidHtmlId(rest.id);
+        }
+        ``;
+        return (
+            <ItemProvider
+                uuid={uuid}
+                dangerouslySetExpanded={dangerouslySetExpanded}
+            >
+                <ItemConsumer>{this.renderChildren}</ItemConsumer>
+            </ItemProvider>
+        );
+    }
+}

From e23cbf1634dc73a438a1a68f2b48915b1408a185 Mon Sep 17 00:00:00 2001
From: Matthew Holloway <matthew@springload.co.nz>
Date: Thu, 6 Aug 2020 14:32:46 +1200
Subject: [PATCH 2/3] AccordionItem preserving uuid on instance

---
 src/components/AccordionItem.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/components/AccordionItem.tsx b/src/components/AccordionItem.tsx
index 91849905..e9a94251 100644
--- a/src/components/AccordionItem.tsx
+++ b/src/components/AccordionItem.tsx
@@ -37,8 +37,6 @@ export default class AccordionItem extends React.Component<Props> {
         const { expanded } = itemContext;
         const cx = expanded && activeClassName ? activeClassName : className;
 
-        console.log({ rest });
-
         return (
             <div
                 data-accordion-component="AccordionItem"

From 5c1b365aff5c7711f8fd7aa400e6f3ddbe67087a Mon Sep 17 00:00:00 2001
From: Matthew Holloway <matthew@springload.co.nz>
Date: Thu, 6 Aug 2020 16:06:00 +1200
Subject: [PATCH 3/3] Removing empty string

---
 src/components/AccordionItem.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/AccordionItem.tsx b/src/components/AccordionItem.tsx
index e9a94251..f818ced3 100644
--- a/src/components/AccordionItem.tsx
+++ b/src/components/AccordionItem.tsx
@@ -58,7 +58,7 @@ export default class AccordionItem extends React.Component<Props> {
         if (rest.id) {
             assertValidHtmlId(rest.id);
         }
-        ``;
+
         return (
             <ItemProvider
                 uuid={uuid}