feat: Defaults DropDown options display value to flex (#951)

autoguru-au · Nov 7, 2023 · 9567e4a · 9567e4a
1 parent 7778838
commit 9567e4a
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 1 deletion.
diff --git a/.changeset/short-islands-build.md b/.changeset/short-islands-build.md
@@ -0,0 +1,5 @@
+---
+'@autoguru/overdrive': patch
+---
+
+DropDown options get default display flex
diff --git a/packages/overdrive/lib/components/DropDown/DropDown.tsx b/packages/overdrive/lib/components/DropDown/DropDown.tsx
@@ -17,13 +17,14 @@ import { EPositionerAlignment } from '../Positioner';
 
 import { DropDownOptionsList } from './DropDownOptionsList';
 
-type ButtonProps = Omit<ComponentProps<typeof Button>, 'is' | 'children'>;
+type ButtonProps = Omit<ComponentProps<typeof Button>, 'is' | 'children' | 'onClick'>;
 type FlyoutProps = Pick<ComponentProps<typeof Flyout>, 'alignment'>;
 
 export interface Props extends ButtonProps, FlyoutProps {
 	children: ReactNode;
 	label: string;
 	icon?: IconType;
+	onClick?: ComponentProps<typeof Button>['onClick'];
 }
 
 export const DropDown = ({

diff --git a/packages/overdrive/lib/components/DropDown/DropDownOption.tsx b/packages/overdrive/lib/components/DropDown/DropDownOption.tsx
@@ -20,16 +20,20 @@ export const DropDownOption: FunctionComponent<Props> = ({
 	label,
 	icon,
 	className,
+	display='flex',
 	iconColour = 'dark',
+	is='button',
 	...boxProps
 }) => {
 	const colourStyles = useTextStyles({ colour: iconColour });
 	return (
 		<Box
 			className={[styles.root, className]}
 			{...boxProps}
+			display={display}
 			paddingX="3"
 			paddingY="2"
+			is={is}
 		>
 			<Inline
 				noWrap