feat: add hasBorder prop to summary expander

Author: greatertomi

src/design-system/summary-expander/summary-expander.component.tsx

@@ -19,6 +19,7 @@ export type Props = OmitClassName<'button'> &
     title: string;
     disabled?: boolean;
     testId?: string;
+    hasBorder?: boolean;
   }>;
 
 export const SummaryExpander = ({
@@ -28,6 +29,7 @@ export const SummaryExpander = ({
   disabled,
   testId,
   children,
+  hasBorder = true,
   ...props
 }: Readonly<Props>): JSX.Element => {
   return (
@@ -43,6 +45,7 @@ export const SummaryExpander = ({
         justifyContent="space-between"
         className={classNames(cx.header, {
           [cx.expanded]: open,
+          [cx.noBorder]: !hasBorder,
         })}
       >
         <Text.Body.Normal weight="$semibold" data-testid="expander-title">

src/design-system/summary-expander/summary-expander.css.ts

@@ -20,3 +20,7 @@ export const header = style([
 export const expanded = style({
   borderBottom: 'none',
 });
+
+export const noBorder = style({
+  border: 'none',
+});