Skip to content

Commit 239cbf3

Browse files
committed
feat(admin-ui): add padding to accordion open/close indicator
- Wrap Icon component in a div to allow className prop - Add wby-pl-md padding class to OpenCloseIndicator - Improves visual spacing in accordion trigger layout
1 parent 1829296 commit 239cbf3

File tree

1 file changed

+12
-10
lines changed

1 file changed

+12
-10
lines changed

packages/admin-ui/src/Accordion/components/AccordionTrigger.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,16 +11,18 @@ type AccordionTriggerProps = Pick<
1111
"title" | "description" | "icon" | "handle" | "interactive" | "actions" | "draggable"
1212
>;
1313

14-
const OpenCloseIndicator = () => {
14+
const OpenCloseIndicator = ({ className }: { className?: string }) => {
1515
return (
16-
<Icon
17-
size={"lg"}
18-
className={"wby-transition"}
19-
color={"neutral-strong"}
20-
data-role={"open-close-indicator"}
21-
label={"Open/close indicator"}
22-
icon={<KeyboardArrowDownIcon />}
23-
/>
16+
<div className={className}>
17+
<Icon
18+
size={"lg"}
19+
className={"wby-transition"}
20+
color={"neutral-strong"}
21+
data-role={"open-close-indicator"}
22+
label={"Open/close indicator"}
23+
icon={<KeyboardArrowDownIcon />}
24+
/>
25+
</div>
2426
);
2527
};
2628

@@ -77,7 +79,7 @@ const AccordionTrigger = ({
7779
)}
7880
>
7981
{draggable ? <AccordionItemDragHandle /> : null}
80-
{isInteractable ? <OpenCloseIndicator /> : null}
82+
{isInteractable ? <OpenCloseIndicator className="wby-pl-md" /> : null}
8183

8284
<div
8385
className={

0 commit comments

Comments
 (0)