feat(CC-batch-1): added batch 1

packages/code-connect/components/AboutModal/AboutModal.figma.tsx

@@ -0,0 +1,33 @@
+import figma from '@figma/code-connect';
+import { AboutModal } from '@patternfly/react-core';
+
+figma.connect(
+  AboutModal,
+  'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=2879-13973&t=15CEJpGgVui7qP5Q-11',
+  {
+    props: {
+      // string
+      productName: figma.string('Product name'),
+
+      trademark: 'Copyright © 2024',
+      brandImageSrc: 'Brand Image Source',
+      brandImageAlt: 'Brand Image Alt Text',
+      backgroundImageSrc: '/assets/images/background.png',
+
+      // children
+      children: figma.children('*')
+    },
+    example: (props) => (
+      // Documentation for AboutModal can be found at https://www.patternfly.org/components/about-modal
+      <AboutModal
+        productName={props.productName}
+        trademark={props.trademark}
+        brandImageSrc={props.brandImageSrc}
+        brandImageAlt={props.brandImageAlt}
+        backgroundImageSrc={props.backgroundImageSrc}
+      >
+        {props.children}
+      </AboutModal>
+    )
+  }
+);

packages/code-connect/components/Accordion/Accordion.figma.tsx

@@ -0,0 +1,30 @@
+import figma from '@figma/code-connect';
+import { Accordion } from '@patternfly/react-core';
+
+figma.connect(
+  Accordion,
+  'https://www.figma.com/file/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6%3A-Components-Test?node-id=2621-623',
+  {
+    props: {
+      // enum
+      isBordered: figma.enum('Type', {
+        Bordered: true,
+        'Large Bordered': true
+      }),
+      displaySize: figma.enum('Type', {
+        'Large Bordered': 'lg'
+      }),
+      togglePosition: figma.enum('Caret position', {
+        Left: 'start'
+      }),
+
+      children: figma.children('*')
+    },
+    example: (props) => (
+      // Documentation for Accordion can be found at https://www.patternfly.org/components/accordion
+      <Accordion togglePosition={props.togglePosition} isBordered={props.isBordered} displaySize={props.displaySize}>
+        {props.children}
+      </Accordion>
+    )
+  }
+);

packages/code-connect/components/Accordion/AccordionToggle.figma.tsx

@@ -0,0 +1,34 @@
+import figma from '@figma/code-connect';
+import { AccordionItem, AccordionToggle, AccordionContent } from '@patternfly/react-core';
+
+figma.connect(
+  AccordionToggle,
+  'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=1423-687',
+  {
+    props: {
+      // string
+      expandText: figma.string('Expand Text'),
+
+      // enum
+      toggleTextExpanded: figma.enum('State', {
+        Default: figma.string('Toggle Text'),
+        Hover: figma.string('Toggle Text'),
+        Expanded: figma.string('Toggle Text Expanded')
+      }),
+      isExpanded: figma.enum('State', { Expanded: true }),
+
+      children: figma.children('*')
+    },
+    example: (props) => (
+      // Documentation for Accordion can be found at https://www.patternfly.org/components/accordion
+      <AccordionItem isExpanded={props.isExpanded}>
+        <AccordionToggle onClick={() => {}} id="<your-id>">
+          {props.toggleTextExpanded}
+        </AccordionToggle>
+        <AccordionContent id="accordion-content-example">
+          <p>{props.expandText}</p>
+        </AccordionContent>
+      </AccordionItem>
+    )
+  }
+);

packages/code-connect/components/ActionList/ActionList.figma.tsx

@@ -0,0 +1,17 @@
+import figma from '@figma/code-connect';
+import { ActionList } from '@patternfly/react-core';
+
+figma.connect(
+  ActionList,
+  'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=6780-15839&m=dev',
+  {
+    props: {
+      isIconList: figma.enum('Type', { 'Action icons only': true }),
+      children: figma.children('*')
+    },
+    example: (props) => (
+      // Documentation for ActionList can be found at https://www.patternfly.org/components/action-list
+      <ActionList isIconList={props.isIconList}>{props.children}</ActionList>
+    )
+  }
+);

packages/code-connect/components/BackgroundImage/BackgroundImage.figma.tsx

@@ -0,0 +1,16 @@
+import figma from '@figma/code-connect';
+import { BackgroundImage } from '@patternfly/react-core';
+
+figma.connect(
+  BackgroundImage,
+  'https://www.figma.com/file/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6%3A-Components-Test?node-id=5047-695',
+  {
+    props: {
+      src: figma.string('Background Image Source')
+    },
+    example: (props) => (
+      // Documentation for BackgroundImage can be found at https://www.patternfly.org/components/background-image
+      <BackgroundImage src={props.src} />
+    )
+  }
+);

packages/code-connect/components/ClipboardCopy/ClipboardCopyBasic.figma.tsx

@@ -0,0 +1,32 @@
+import figma from '@figma/code-connect';
+import { ClipboardCopy } from '@patternfly/react-core';
+
+figma.connect(
+  ClipboardCopy,
+  'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=9914-75835&m=dev',
+  {
+    props: {
+      // enum
+      isActive: figma.enum('State', { Active: true }),
+      isReadOnly: figma.enum('State', { 'Read only': true }),
+      isExpanded: figma.enum('State', { Expanded: true }),
+      expansion: figma.enum('State', {
+        Expanded: 'expansion',
+        false: undefined
+      }),
+
+      children: figma.children('*')
+    },
+    example: (props) => (
+      // Documentation for ClipboardCopy can be found at https://www.patternfly.org/components/clipboard-copy
+      <ClipboardCopy
+        isReadOnly={props.isReadOnly}
+        variant={props.expansion}
+        isExpanded={props.isExpanded}
+        isActive={props.isActive}
+      >
+        {props.children}
+      </ClipboardCopy>
+    )
+  }
+);

packages/code-connect/components/ClipboardCopy/ClipboardCopyInlineCompact.figma.tsx

@@ -0,0 +1,18 @@
+import figma from '@figma/code-connect';
+import { ClipboardCopy } from '@patternfly/react-core';
+
+/**
+ * PatternFly AccordionToggle integration for Figma Code Connect
+ * @patternfly https://www.patternfly.org/components/clipboard-copy
+ */
+
+figma.connect(
+  ClipboardCopy,
+  'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=9914-75768&m=dev',
+  {
+    props: {
+      children: figma.children('*')
+    },
+    example: (props) => <ClipboardCopy variant="inline-compact">{props.children}</ClipboardCopy>
+  }
+);

packages/code-connect/figma.config.json

@@ -0,0 +1,33 @@
+{
+  "codeConnect": {
+    "parser": "react",
+    "include": [
+      "components/AboutModal/*.tsx",
+      "components/Accordion/*.tsx",
+      "components/ActionList/*.tsx",
+      "components/BackgroundImage/*.tsx",
+      "components/ClipboardCopy/*.tsx"
+    ],
+    "paths": {
+      "src/components": "src/components"
+    },
+    "aliases": {
+      "@patternfly/react-core": "."
+    },
+    "importPaths": {
+      "src/components": "src/components"
+    },
+    "options": {
+      "instanceSwapper": {
+        "enabled": true
+      },
+      "development": {
+        "enabled": true,
+        "verbose": true
+      },
+      "production": {
+        "enabled": false
+      }
+    }
+  }
+}