Menu: conditionally render title

Author: Nina Benite

src/@next/Menu/Menu.stories.tsx

@@ -75,12 +75,7 @@ const BasicTemplate: Story<MenuProps> = args => {
       onClose={() => setPopoverActive(false)}
     >
       <Popover.Pane>
-        <Menu
-          {...args}
-          title="Basic Menu"
-          onChange={setSelected}
-          selectedValues={selected}
-        />
+        <Menu {...args} onChange={setSelected} selectedValues={selected} />
       </Popover.Pane>
     </Popover>
   );
@@ -90,4 +85,5 @@ export const Basic = BasicTemplate.bind({});
 
 Basic.args = {
   options,
+  title: 'Basic Menu',
 };

src/@next/Menu/Menu.tsx

@@ -35,11 +35,13 @@ export const Menu = ({
 
   return (
     <StyledMenu id={menuId}>
-      <TitleContainer>
-        <Typography variant="subtitle2" as="span" color={Neutral.B40}>
-          {title}
-        </Typography>
-      </TitleContainer>
+      {title && (
+        <TitleContainer>
+          <Typography variant="subtitle2" as="span" color={Neutral.B40}>
+            {title}
+          </Typography>
+        </TitleContainer>
+      )}
       {options.map(option => {
         const { value, label, disabled, id } = option;
         const isSelected = selectedValues?.includes(value);