Merge pull request #2516 from teamleadercrm/advanced-collapsible-onch…

…ange AdvancedCollapsible - add `onChange` prop
teamleadercrm · Jan 4, 2023 · a5563f3 · a5563f3
2 parents baf4db4 + 8f06ae9
commit a5563f3
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,12 @@
 
 ### Dependency updates
 
+## [18.5.1] - 2023-01-04
+
+### Added
+
+- `AdvancedCollapsible`: Added `onChange` prop ([@BeirlaenAaron](https://github.com/BeirlaenAaron) in [#2516](https://github.com/teamleadercrm/ui/pull/2516))
+
 ## [18.5.0] - 2023-01-04
 
 ### Added

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@teamleader/ui",
   "description": "Teamleader UI library",
-  "version": "18.5.0",
+  "version": "18.5.1",
   "author": "Teamleader <[email protected]>",
   "bugs": {
     "url": "https://github.com/teamleadercrm/ui/issues"

diff --git a/src/components/advancedCollapsible/AdvancedCollapsible.tsx b/src/components/advancedCollapsible/AdvancedCollapsible.tsx
@@ -20,6 +20,7 @@ export interface AdvancedCollapsibleProps extends Omit<BoxProps, 'size'> {
   title: string;
   size?: AllowedAdvancedCollapsibleSize;
   defaultIsCollapsed?: boolean;
+  onChange?: (collapsed: boolean, event: React.MouseEvent) => void;
 }
 
 const AdvancedCollapsible: GenericComponent<AdvancedCollapsibleProps> = ({
@@ -29,14 +30,19 @@ const AdvancedCollapsible: GenericComponent<AdvancedCollapsibleProps> = ({
   size = 'medium',
   title,
   defaultIsCollapsed = true,
+  onChange,
   ...others
 }) => {
   const [collapsed, setCollapsed] = useState(defaultIsCollapsed);
 
   const boxProps = pickBoxProps(others);
   const TitleElement = size === 'large' ? Heading3 : TextBody;
 
-  const handleTitleClick = () => {
+  const handleTitleClick = (event: React.MouseEvent) => {
+    if (onChange) {
+      onChange(!collapsed, event);
+    }
+
     setCollapsed(!collapsed);
   };