feat(CC-batch-7): group review 6 followup

mattnolting · mattnolting · commit 540457e55e3b · 2025-09-04T10:40:09.000-04:00
diff --git a/packages/code-connect/components/NotificationDrawer/NotificationDrawer.figma.tsx b/packages/code-connect/components/NotificationDrawer/NotificationDrawer.figma.tsx
@@ -6,6 +6,7 @@ figma.connect(
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=7172-99015',
   {
     props: {
+      // children
       notificationDrawerHeader: figma.children('Notification drawer header'),
       notificationDrawerGroup: figma.children('Notification drawer group'),
       notificationDrawerNotifications: figma.children(['Notifications', 'Notification drawer item'])
diff --git a/packages/code-connect/components/NotificationDrawer/NotificationDrawerGroups.figma.tsx b/packages/code-connect/components/NotificationDrawer/NotificationDrawerGroups.figma.tsx
@@ -8,19 +8,25 @@ figma.connect(
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=3172-18190&m=dev',
   {
     props: {
+      // boolean
+      hasCount: figma.boolean('Has count', {
+        true: figma.children('Badge'),
+        false: undefined
+      }),
       showUnreadCount: figma.boolean('Has count', {
         true: 3,
         false: NaN
       }),
+
+      // enum
       headingText: figma.string('Group title'),
+
+      // string
       isExpanded: figma.enum('Type', {
         Collapsed: false,
         Expanded: true
       }),
-      hasCount: figma.boolean('Has count', {
-        true: figma.children('Badge'),
-        false: undefined
-      }),
+
       children: figma.children('*')
     },
     example: (props) => (
diff --git a/packages/code-connect/components/NotificationDrawer/NotificationDrawerHeader.figma.tsx b/packages/code-connect/components/NotificationDrawer/NotificationDrawerHeader.figma.tsx
@@ -1,15 +1,12 @@
 import figma from '@figma/code-connect';
 import { Dropdown, DropdownItem, DropdownList, MenuToggle, NotificationDrawerHeader } from '@patternfly/react-core';
-import EllipsisVIcon from '@patternfly/react-icons/icons/ellipsis-v-icon/dist/esm/icons/ellipsis-v-icon';
+import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons//ellipsis-v-icon';
 
 figma.connect(
   NotificationDrawerHeader,
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=3170-17841&m=dev',
   {
     props: {
-      // string
-      headingText: figma.string('Heading text'),
-
       // boolean
       hasActionsMenu: figma.boolean('Has actions menu', {
         true: {
@@ -47,14 +44,16 @@ figma.connect(
       showUnreadCount: figma.boolean('Show unread count', {
         true: 3,
         false: NaN
-      })
+      }),
+
+      // string
+      headingText: figma.string('Heading text')
     },
     example: (props) => (
       <NotificationDrawerHeader
         count={props.showUnreadCount}
         onClose={props.hasActionsMenu.onClose}
         title={props.headingText}
-        srTitle="Notification drawer header"
       >
         {props.hasActionsMenu.dropdown}
       </NotificationDrawerHeader>
diff --git a/packages/code-connect/components/NotificationDrawer/NotificationDrawerItem.figma.tsx b/packages/code-connect/components/NotificationDrawer/NotificationDrawerItem.figma.tsx
@@ -30,17 +30,28 @@ figma.connect(
         Danger: 'danger'
       }),
 
-      // boolean
-      listItemDropdown: {
-        dropdown: (
+      // TODO: DESIGN: Make alert description retrievable via unique layer name or adding a prop to Noficiation Drawer Item
+      alertDescription: 'Description',
+
+      // TODO: DESIGN: Make alert title retrievable via unique layer name or adding a prop to Noficiation Drawer Item
+      alertTitle: 'Notification title'
+    },
+    example: (props) => (
+      <NotificationDrawerListItem
+        isHoverable={props.isHoverable}
+        isRead={props.isRead}
+        onClose={() => {}}
+        variant={props.variant}
+      >
+        <NotificationDrawerListItemHeader title={props.alertTitle} variant={props.variant}>
           <Dropdown
             onSelect={() => {}}
             isOpen={false}
             onOpenChange={() => {}}
             popperProps={{ position: 'right' }}
-            toggle={() => (
+            toggle={(toggleRef) => (
               <MenuToggle
-                ref={() => {}}
+                ref={toggleRef}
                 isExpanded={false}
                 onClick={() => {}}
                 variant="plain"
@@ -55,29 +66,6 @@ figma.connect(
               <DropdownItem>Item 3</DropdownItem>
             </DropdownList>
           </Dropdown>
-        ),
-        onClose: () => {}
-      },
-
-      // TODO: DESIGN: Make alert description retrievable via unique layer name or adding a prop to Noficiation Drawer Item
-      alertDescription: 'Description',
-
-      // TODO: DESIGN: Make alert title retrievable via unique layer name or adding a prop to Noficiation Drawer Item
-      alertTitle: 'Notification title'
-    },
-    example: (props) => (
-      <NotificationDrawerListItem
-        isHoverable={props.isHoverable}
-        isRead={props.isRead}
-        onClose={() => {}}
-        variant={props.variant}
-      >
-        <NotificationDrawerListItemHeader
-          srTitle="Notification drawer item"
-          title={props.alertTitle}
-          variant={props.variant}
-        >
-          {props.listItemDropdown.dropdown}
         </NotificationDrawerListItemHeader>
         <NotificationDrawerListItemBody timestamp={props.timestamp}>
           {props.alertDescription}
diff --git a/packages/code-connect/components/PopOver/Popover.figma.tsx b/packages/code-connect/components/PopOver/Popover.figma.tsx
@@ -14,10 +14,9 @@ figma.connect(
   Popover,
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=5857-2066',
   {
+    // enum
     props: {
-      // hasFooter: figma.boolean('Has footer', {}),
-      bodyContent: figma.string('Popover description'),
-      headerContent: figma.string('Popover Heading'),
+      // boolean
       footerContent: figma.boolean('Has footer', {
         true: 'Popover footer',
         false: undefined
@@ -26,6 +25,20 @@ figma.connect(
         true: <BullhornIcon />,
         false: undefined
       }),
+
+      // string
+      bodyContent: figma.string('Popover description'),
+      headerContent: figma.string('Popover Heading'),
+
+      // enum
+      position: figma.enum('Position', {
+        'Top-left': 'top-start',
+        'Top-middle': 'top',
+        'Top-right': 'top-end',
+        'Bottom-left': 'bottom-start',
+        'Bottom-middle': 'bottom',
+        'Bottom-right': 'bottom-end'
+      }),
       status: figma.enum('Status', {
         Default: {
           state: undefined,
@@ -48,14 +61,6 @@ figma.connect(
           icon: <ExclamationCircleIcon />
         }
       }),
-      position: figma.enum('Position', {
-        'Top-left': 'top-start',
-        'Top-middle': 'top',
-        'Top-right': 'top-end',
-        'Bottom-left': 'bottom-start',
-        'Bottom-middle': 'bottom',
-        'Bottom-right': 'bottom-end'
-      }),
 
       children: figma.children('*')
     },
diff --git a/packages/code-connect/components/SimpleList/ListHeading.figma.tsx b/packages/code-connect/components/SimpleList/ListHeading.figma.tsx
diff --git a/packages/code-connect/components/SimpleList/SimpleList.figma.tsx b/packages/code-connect/components/SimpleList/SimpleList.figma.tsx
@@ -8,7 +8,7 @@ figma.connect(
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=4410-20691',
   {
     props: {
-      children: figma.children(['Simple list group', 'Simple list item'])
+      children: figma.children('*')
     },
     example: (props) => <SimpleList aria-label="Simple list example">{props.children}</SimpleList>
   }
diff --git a/packages/code-connect/components/SimpleList/SimpleListGroup.figma.tsx b/packages/code-connect/components/SimpleList/SimpleListGroup.figma.tsx
@@ -8,8 +8,12 @@ figma.connect(
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=4410-20708',
   {
     props: {
-      children: figma.children('*')
+      simpleListItems: figma.children('Simple list item')
     },
-    example: (props) => <SimpleListGroup>{props.children}</SimpleListGroup>
+    example: (props) => (
+      <SimpleListGroup title="List group" id="<simple-list-group-id>">
+        {props.simpleListItems}
+      </SimpleListGroup>
+    )
   }
 );
diff --git a/packages/code-connect/components/SimpleList/SimpleListItem.figma.tsx b/packages/code-connect/components/SimpleList/SimpleListItem.figma.tsx
@@ -32,7 +32,7 @@ figma.connect(
         component={props.isLink.component}
         href={props.isLink.href}
         isActive={props.isActive}
-        key="simple-list-key"
+        key="simple-list-item-key"
       >
         {props.text}
       </SimpleListItem>
diff --git a/packages/code-connect/components/Skeleton/Skeleton.figma.tsx b/packages/code-connect/components/Skeleton/Skeleton.figma.tsx
@@ -8,6 +8,11 @@ figma.connect(
   'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=790-288',
   {
     props: {
+      // enum
+      type: figma.enum('Type', {
+        Square: 'square',
+        Circle: 'circle'
+      }),
       size: figma.enum('Size', {
         S: 'sm',
         M: 'md',
@@ -16,12 +21,8 @@ figma.connect(
         '2XL': '2xl',
         '3XL': '3xl',
         '4XL': '4xl'
-      }),
-      type: figma.enum('Type', {
-        Rectangle: 'square',
-        Circle: 'circle'
       })
     },
-    example: (props) => <Skeleton fontSize={props.size} shape={props.type} screenreaderText="Loading default content" />
+    example: (props) => <Skeleton fontSize={props.size} type={props.type} screenreaderText="Loading default content" />
   }
 );
diff --git a/packages/code-connect/figma.config.json b/packages/code-connect/figma.config.json
@@ -2,11 +2,11 @@
   "codeConnect": {
     "parser": "react",
     "include": [
-      "components/DatePicker/*.tsx",
-      "components/EmptyState/*.tsx",
-      "components/FileUpload/*.tsx",
-      "components/Hint/*.tsx",
-      "components/InlineEdit/*.tsx"
+      "components/NotificationDrawer/*.tsx",
+      "components/Pagination/*.tsx",
+      "components/Popover/*.tsx",
+      "components/SimpleList/*.tsx",
+      "components/Skeleton/*.tsx"
     ],
     "paths": {
       "src/components": "src/components"

Original file line number	Diff line number	Diff line change
`@@ -6,6 +6,7 @@ figma.connect(`
`6`	`6`	`'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=7172-99015',`
`7`	`7`	`{`
`8`	`8`	`props: {`
	`9`	`+ // children`
`9`	`10`	`notificationDrawerHeader: figma.children('Notification drawer header'),`
`10`	`11`	`notificationDrawerGroup: figma.children('Notification drawer group'),`
`11`	`12`	`notificationDrawerNotifications: figma.children(['Notifications', 'Notification drawer item'])`
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,7 @@ figma.connect(`
`8`	`8`	`'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=4410-20691',`
`9`	`9`	`{`
`10`	`10`	`props: {`
`11`		`- children: figma.children(['Simple list group', 'Simple list item'])`
	`11`	`+ children: figma.children('*')`
`12`	`12`	`},`
`13`	`13`	`example: (props) => <SimpleList aria-label="Simple list example">{props.children}</SimpleList>`
`14`	`14`	`}`
Original file line number	Diff line number	Diff line change
`@@ -32,7 +32,7 @@ figma.connect(`
`32`	`32`	`component={props.isLink.component}`
`33`	`33`	`href={props.isLink.href}`
`34`	`34`	`isActive={props.isActive}`
`35`		`- key="simple-list-key"`
	`35`	`+ key="simple-list-item-key"`
`36`	`36`	`>`
`37`	`37`	`{props.text}`
`38`	`38`	`</SimpleListItem>`