diff --git a/.changeset/rare-fireants-tickle.md b/.changeset/rare-fireants-tickle.md new file mode 100644 index 0000000000..8668d4c287 --- /dev/null +++ b/.changeset/rare-fireants-tickle.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Added optional `initialShowDropDown` prop to `SidebarSubmenuItem` to internally manage the initial display state of the dropdown items. diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index 7fd706db43..2a146e70e0 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -1128,6 +1128,7 @@ export type SidebarSubmenuItemProps = { icon?: IconComponent; dropdownItems?: SidebarSubmenuItemDropdownItem[]; exact?: boolean; + initialShowDropdown?: boolean; }; // @public diff --git a/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx b/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx index 0503f58f1c..19834268f9 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx @@ -131,6 +131,7 @@ export type SidebarSubmenuItemProps = { icon?: IconComponent; dropdownItems?: SidebarSubmenuItemDropdownItem[]; exact?: boolean; + initialShowDropdown?: boolean; }; /** @@ -149,7 +150,9 @@ export const SidebarSubmenuItem = (props: SidebarSubmenuItemProps) => { const currentLocation = useLocation(); let isActive = isLocationMatch(currentLocation, toLocation, exact); - const [showDropDown, setShowDropDown] = useState(false); + const [showDropDown, setShowDropDown] = useState( + props.initialShowDropdown ?? false, + ); const handleClickDropdown = () => { setShowDropDown(!showDropDown); };