diff --git a/packages/code-connect/components/Nav/GroupHeader.figma.tsx b/packages/code-connect/components/Nav/GroupHeader.figma.tsx
new file mode 100644
index 00000000000..4fc290abfe4
--- /dev/null
+++ b/packages/code-connect/components/Nav/GroupHeader.figma.tsx
@@ -0,0 +1,5 @@
+// This is a property of the NavGroup component
+
+// Usage:
+
+// ...
diff --git a/packages/code-connect/components/Nav/HorizontalNav.figma.tsx b/packages/code-connect/components/Nav/HorizontalNav.figma.tsx
new file mode 100644
index 00000000000..a7f3426203e
--- /dev/null
+++ b/packages/code-connect/components/Nav/HorizontalNav.figma.tsx
@@ -0,0 +1,19 @@
+import figma from '@figma/code-connect';
+import { Nav, NavList } from '@patternfly/react-core';
+
+// Documentation for Nav can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(Nav, 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=7514-12157', {
+ props: {
+ children: figma.children(['Horizontal Nav item', 'Horizontal Subnav item']),
+ variant: figma.enum('Type', {
+ Main: 'horizontal',
+ Subnav: 'horizontal-subnav'
+ })
+ },
+ example: (props) => (
+
+ )
+});
diff --git a/packages/code-connect/components/Nav/HorizontalNavItem.figma.tsx b/packages/code-connect/components/Nav/HorizontalNavItem.figma.tsx
new file mode 100644
index 00000000000..fe9790a26c1
--- /dev/null
+++ b/packages/code-connect/components/Nav/HorizontalNavItem.figma.tsx
@@ -0,0 +1,19 @@
+import figma from '@figma/code-connect';
+import { NavItem } from '@patternfly/react-core';
+
+// Documentation for Nav can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7262',
+ {
+ props: {
+ isActive: figma.enum('State', { Selected: true })
+ },
+ example: (props) => (
+
+ Nav item
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/HorizontalSubnavItem.figma.tsx b/packages/code-connect/components/Nav/HorizontalSubnavItem.figma.tsx
new file mode 100644
index 00000000000..c8ad0a8486f
--- /dev/null
+++ b/packages/code-connect/components/Nav/HorizontalSubnavItem.figma.tsx
@@ -0,0 +1,26 @@
+import figma from '@figma/code-connect';
+import { NavItem } from '@patternfly/react-core';
+
+/**
+ * -- This file was auto-generated by Code Connect --
+ * `props` includes a mapping from Figma properties and variants to
+ * suggested values. You should update this to match the props of your
+ * code component, and update the `example` function to return the
+ * code example you'd like to see in Figma
+ */
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7269&m=dev',
+ {
+ props: {
+ isActive: figma.enum('State', { Selected: true }),
+ navItemText: figma.string('Nav item')
+ },
+ example: (props) => (
+
+ {props.navItemText}
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/LeftNav.figma.tsx b/packages/code-connect/components/Nav/LeftNav.figma.tsx
new file mode 100644
index 00000000000..0d3ca0726d6
--- /dev/null
+++ b/packages/code-connect/components/Nav/LeftNav.figma.tsx
@@ -0,0 +1,11 @@
+import figma from '@figma/code-connect';
+import { Nav } from '@patternfly/react-core';
+
+// Documentation for Nav can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(Nav, 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7106', {
+ props: {
+ children: figma.children(['Nav Section', 'Nav divider', 'ProductName'])
+ },
+ example: (props) =>
+});
diff --git a/packages/code-connect/components/Nav/NavDivider.figma.tsx b/packages/code-connect/components/Nav/NavDivider.figma.tsx
new file mode 100644
index 00000000000..f3cc7f80d86
--- /dev/null
+++ b/packages/code-connect/components/Nav/NavDivider.figma.tsx
@@ -0,0 +1,13 @@
+import figma from '@figma/code-connect';
+import { NavItemSeparator } from '@patternfly/react-core';
+
+// Documentation for NavItemSeparator can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavItemSeparator,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7231',
+ {
+ props: {},
+ example: () =>
+ }
+);
diff --git a/packages/code-connect/components/Nav/NavItem.figma.tsx b/packages/code-connect/components/Nav/NavItem.figma.tsx
new file mode 100644
index 00000000000..42ae3fd75b3
--- /dev/null
+++ b/packages/code-connect/components/Nav/NavItem.figma.tsx
@@ -0,0 +1,66 @@
+import figma from '@figma/code-connect';
+import { NavItem, NavExpandable } from '@patternfly/react-core';
+import PlusCircleIcon from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon';
+
+// Documentation for NavItem can be found at https://www.patternfly.org/components/navigation
+
+const sharedProps = {
+ icon: figma.boolean('Icon', {
+ true: ,
+ false: undefined
+ }),
+ id: figma.enum('Type', {
+ Default: 'target-link-id',
+ 'Expandable - Open': 'target-link-id',
+ 'Expandable - Closed': 'target-link-id'
+ }),
+ isActive: figma.enum('State', { Selected: true }),
+ navItemText: figma.string('Nav item')
+};
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7119',
+ {
+ props: {
+ ...sharedProps
+ },
+ example: (props) => (
+
+ {props.navItemText}
+
+ )
+ }
+);
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7119',
+ {
+ variant: { Type: 'Expandable - Open' },
+ props: {
+ ...sharedProps
+ },
+ example: (props) => (
+
+ {props.navItemText}
+
+ )
+ }
+);
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7119',
+ {
+ variant: { Type: 'Expandable - Closed' },
+ props: {
+ ...sharedProps
+ },
+ example: (props) => (
+
+ {props.navItemText}
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/NavSection.figma.tsx b/packages/code-connect/components/Nav/NavSection.figma.tsx
new file mode 100644
index 00000000000..a4bb6180c24
--- /dev/null
+++ b/packages/code-connect/components/Nav/NavSection.figma.tsx
@@ -0,0 +1,24 @@
+import figma from '@figma/code-connect';
+import { NavGroup, NavList } from '@patternfly/react-core';
+
+// Documentation for NavGroup can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavGroup,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7233&m=dev',
+ {
+ props: {
+ groupHeader: figma.boolean('Group header', {
+ true: 'Group header',
+ false: undefined
+ }),
+
+ children: figma.children('Nav item')
+ },
+ example: (props) => (
+
+ {props.children}
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/ProductName.figma.tsx b/packages/code-connect/components/Nav/ProductName.figma.tsx
new file mode 100644
index 00000000000..098cc0b73b9
--- /dev/null
+++ b/packages/code-connect/components/Nav/ProductName.figma.tsx
@@ -0,0 +1,19 @@
+import figma from '@figma/code-connect';
+import { Content, ContentVariants, NavGroup } from '@patternfly/react-core';
+
+// Documentation for ProductName can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavGroup,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7229',
+ {
+ props: {
+ productName: figma.string('Product name')
+ },
+ example: (props) => (
+
+ {props.productName}
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/SubnavItem.figma.tsx b/packages/code-connect/components/Nav/SubnavItem.figma.tsx
new file mode 100644
index 00000000000..7227d7fd702
--- /dev/null
+++ b/packages/code-connect/components/Nav/SubnavItem.figma.tsx
@@ -0,0 +1,32 @@
+import figma from '@figma/code-connect';
+import { NavItem } from '@patternfly/react-core';
+
+// Documentation for SubnavItem can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7174',
+ {
+ props: {
+ id: figma.enum('Expansion', {
+ Default: 'target-nested-link-id',
+ 'Expandable - Open': 'target-nested-link-id',
+ 'Expandable - Closed': 'target-nested-link-id'
+ }),
+ isActive: figma.enum('State', { Selected: true }),
+ navItemText: figma.string('Nav item')
+ },
+ example: (props) => (
+
+ {props.navItemText}
+
+ )
+ }
+);
diff --git a/packages/code-connect/components/Nav/ThirdLevelSubNavItem.figma.tsx b/packages/code-connect/components/Nav/ThirdLevelSubNavItem.figma.tsx
new file mode 100644
index 00000000000..e49c456d870
--- /dev/null
+++ b/packages/code-connect/components/Nav/ThirdLevelSubNavItem.figma.tsx
@@ -0,0 +1,24 @@
+import figma from '@figma/code-connect';
+import { NavItem } from '@patternfly/react-core';
+
+// Documentation for SubnavItem can be found at https://www.patternfly.org/components/navigation
+
+figma.connect(
+ NavItem,
+ 'https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components?node-id=2104-7254',
+ {
+ props: {},
+ example: () => (
+
+ Nav item
+
+ )
+ }
+);
diff --git a/packages/code-connect/figma.config.json b/packages/code-connect/figma.config.json
index 2537e14be2b..2d22228e1b0 100644
--- a/packages/code-connect/figma.config.json
+++ b/packages/code-connect/figma.config.json
@@ -1,13 +1,10 @@
{
"codeConnect": {
"parser": "react",
- "include": [
- "components/DatePicker/*.tsx",
- "components/EmptyState/*.tsx",
- "components/FileUpload/*.tsx",
- "components/Hint/*.tsx",
- "components/InlineEdit/*.tsx"
- ],
+ "include": ["components/Nav/*.figma.tsx"],
+ "documentUrlSubstitutions": {
+ "https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/PatternFly-6--Components": "https://www.figma.com/design/VMEX8Xg2nzhBX8rfBx53jp/branch/9HiAevBhEc2iYY9rxZtovA/PatternFly-6--Components"
+ },
"paths": {
"src/components": "src/components"
},
@@ -30,4 +27,4 @@
}
}
}
-}
\ No newline at end of file
+}