feat(code-connect): ailabel and ailabelcontent

Author: alisonjoseph

packages/react/code-connect/AILabel/AILabel.figma.tsx

@@ -0,0 +1,51 @@
+/**
+ * Copyright IBM Corp. 2016, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// @ts-nocheck
+import React from 'react';
+import { AILabel } from '@carbon/react';
+import figma from '@figma/code-connect';
+
+figma.connect(
+  AILabel,
+  'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=51447-1916&t=9XaizJDx8eI6KgQz-4',
+  {
+    props: {
+      aiText: figma.string('Text translation'),
+      size: figma.enum('Size', {
+        '16px': 'mini',
+        '20px': '2xs',
+        '24px': 'xs',
+        '32px': 'sm',
+        '40px': 'md',
+        '48px': 'lg',
+        '64px': 'xl',
+      }),
+    },
+    example: ({ ...props }) => <AILabel autoAlign {...props} />,
+  }
+);
+
+// inline
+figma.connect(
+  AILabel,
+  'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=51447-2035&t=9XaizJDx8eI6KgQz-4',
+  {
+    props: {
+      aiText: figma.string('Text translation'),
+      textLabel: figma.enum('Type', {
+        'Text + Icon': figma.string('Slug text'),
+      }),
+      size: figma.enum('Size', {
+        '12px': 'sm',
+        '14px': 'md',
+        '16px': 'lg',
+      }),
+    },
+    example: ({ ...props }) => <AILabel autoAlign kind="inline" {...props} />,
+  }
+);

packages/react/code-connect/AILabel/AILabelActions.figma.tsx

@@ -0,0 +1,26 @@
+/**
+ * Copyright IBM Corp. 2016, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// @ts-nocheck
+import React from 'react';
+import { AILabelActions } from '@carbon/react';
+import figma from '@figma/code-connect';
+
+figma.connect(
+  AILabelActions,
+  'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=57561-3559&t=SB9qULZbn3FRopvU-4',
+  {
+    props: {
+      detailsbutton59717: figma.boolean('Details button'),
+      action359716: figma.boolean('Action 3'),
+      action259715: figma.boolean('Action 2'),
+      action159714: figma.boolean('Action 1'),
+      children: figma.children('*'),
+    },
+    example: ({ children }) => <AILabelActions>{children}</AILabelActions>,
+  }
+);

packages/react/code-connect/AILabel/AILabelContent.figma.tsx

@@ -0,0 +1,64 @@
+/**
+ * Copyright IBM Corp. 2016, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// @ts-nocheck
+import React from 'react';
+import { AILabelContent } from '@carbon/react';
+import figma from '@figma/code-connect';
+
+figma.connect(
+  AILabelContent,
+  'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=57561-3508&t=SB9qULZbn3FRopvU-4',
+  {
+    props: {
+      title: figma.string('AI title'),
+      description: figma.string('AI description'),
+      slotOne: figma.boolean('Slot 1', {
+        true: figma.instance('Swap slot 1'),
+        false: '',
+      }),
+      slotTwo: figma.boolean('Slot 2', {
+        true: figma.instance('Swap slot 2'),
+      }),
+      slotThree: figma.boolean('Slot 3', {
+        true: figma.instance('Swap slot 3'),
+      }),
+      slotFour: figma.boolean('Slot 4', {
+        true: figma.instance('Swap slot 4'),
+      }),
+      actions: figma.children(['Actions footer']),
+    },
+    example: ({
+      title,
+      description,
+      slotOne,
+      slotTwo,
+      slotThree,
+      slotFour,
+      actions,
+    }) => (
+      <AILabelContent>
+        {slotOne}
+        <div>
+          <p>AI Explained</p>
+          <h1>{title}</h1>
+          <p>{description}</p>
+          {slotOne}
+          <hr />
+          {slotTwo}
+          <p>
+            This is sample placeholder content, replace with your own content
+            and custom styles.
+          </p>
+          {slotThree}
+          {slotFour}
+        </div>
+        {actions}
+      </AILabelContent>
+    ),
+  }
+);

packages/react/code-connect/Tabs/Tabs.figma.tsx

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-/* eslint-disable react/jsx-no-duplicate-props */
 // @ts-nocheck
 import React from 'react';
 import {