fix(code-connect): update version, add fluid search skeleton and code…

… snippet disabled states (#17904)

* chore: update figma version

* fix: code connect version and fluidseearch and codesnippet bugs

* chore: missed files

* chore: format

* chore: yarn dedupe

README.md

@@ -313,7 +313,6 @@ check out our [Contributing Guide](/.github/CONTRIBUTING.md) and our
     <td align="center"><a href="https://github.com/mikdhadc"><img src="https://avatars.githubusercontent.com/u/54241506?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Mohammed Mikdhad C</b></sub></a><br /><a href="https://github.com/carbon-design-system/carbon/commits?author=mikdhadc" title="Code">💻</a></td>
     <td align="center"><a href="https://irfadkp.github.io/"><img src="https://avatars.githubusercontent.com/u/54243898?v=4?s=100" width="100px;" alt=""/><br /><sub><b>IRFAD KP</b></sub></a><br /><a href="https://github.com/carbon-design-system/carbon/commits?author=irfadkp" title="Code">💻</a></td>
   </tr>
-  </tr>
   <tr>
     <td align="center"><a href="https://github.com/ziyadzulfikar"><img src="https://avatars.githubusercontent.com/u/56788667?v=4?s=100" width="100px;" alt=""/><br /><sub><b>ziyadzulfikar</b></sub></a><br /><a href="https://github.com/carbon-design-system/carbon/commits?author=ziyadzulfikar" title="Code">💻</a></td>
     <td align="center"><a href="https://irfadkp.github.io/"><img src="https://avatars.githubusercontent.com/u/54243898?v=4?s=100" width="100px;" alt=""/><br /><sub><b>IRFAD KP</b></sub></a><br /><a href="https://github.com/carbon-design-system/carbon/commits?author=irfadkp" title="Code">💻</a></td>

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

@@ -22,10 +22,13 @@ figma.connect(
       tooltip: figma.nestedProps('Tooltip content', {
         text: figma.textContent('Tooltip text'),
       }),
+      disabled: figma.enum('State', {
+        Disabled: true,
+      }),
     },
-    example: ({ codeSnippet, tooltip }) => {
+    example: ({ codeSnippet, tooltip, disabled }) => {
       return (
-        <CodeSnippet type="inline" feedback={tooltip.text}>
+        <CodeSnippet type="inline" feedback={tooltip.text} disabled={disabled}>
           {codeSnippet.text}
         </CodeSnippet>
       );
@@ -42,10 +45,16 @@ figma.connect(
       codeSnippet: figma.nestedProps('Code snippet', {
         text: figma.textContent('node -v'),
       }),
+      disabled: figma.enum('State', {
+        Disabled: true,
+      }),
     },
-    example: ({ codeSnippet }) => {
+    example: ({ codeSnippet, disabled }) => {
       return (
-        <CodeSnippet type="inline" feedback="Copied to clipboard">
+        <CodeSnippet
+          type="inline"
+          feedback="Copied to clipboard"
+          disabled={disabled}>
           {codeSnippet.text}
         </CodeSnippet>
       );
@@ -60,10 +69,16 @@ figma.connect(
   {
     props: {
       children: figma.textContent('$ npm install --save carbon-components'),
+      disabled: figma.enum('State', {
+        Disabled: true,
+      }),
     },
-    example: ({ children }) => {
+    example: ({ children, disabled }) => {
       return (
-        <CodeSnippet type="single" feedback="Copied to clipboard">
+        <CodeSnippet
+          type="single"
+          feedback="Copied to clipboard"
+          disabled={disabled}>
           {children}
         </CodeSnippet>
       );
@@ -83,12 +98,16 @@ figma.connect(
         false: true,
       }),
       expanded: figma.boolean('Expanded'),
+      disabled: figma.enum('State', {
+        Disabled: true,
+      }),
     },
-    example: ({ hideCopyButton }) => (
+    example: ({ hideCopyButton, disabled }) => (
       <CodeSnippet
         type="multi"
         feedback="Copied to clipboard"
-        hideCopyButton={hideCopyButton}>
+        hideCopyButton={hideCopyButton}
+        disabled={disabled}>
         Code sample here
       </CodeSnippet>
     ),

packages/react/code-connect/Search/FluidSearch.figma.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import {
   unstable__FluidSearch as FluidSearch,
-  // unstable__FluidSearchSkeleton as FluidSearchSkeleton,
+  unstable__FluidSearchSkeleton as FluidSearchSkeleton,
 } from '@carbon/react';
 import figma from '@figma/code-connect';
 
@@ -33,16 +33,11 @@ figma.connect(
   }
 );
 
-// missing from Figma
-// figma.connect(
-//   FluidSearchSkeleton,
-//   'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=15503-270751&t=6KMXKibN414b97hv-4',
-//   {
-//     variant: { State: 'Skeleton' },
-//     example: () => (
-//       // Disclaimer: Code Connect is currently in beta and integration with Carbon
-//       // React is in an exploratory phase. Code sample below may be incomplete.
-//       <FluidSearchSkeleton />
-//     ),
-//   }
-// );
+figma.connect(
+  FluidSearchSkeleton,
+  'https://www.figma.com/design/YAnB1jKx0yCUL29j6uSLpg/(v11)-All-themes---Carbon-Design-System?node-id=15503-270751&t=6KMXKibN414b97hv-4',
+  {
+    variant: { State: 'Skeleton' },
+    example: () => <FluidSearchSkeleton />,
+  }
+);

packages/react/package.json

@@ -82,7 +82,7 @@
     "@babel/preset-typescript": "^7.24.7",
     "@carbon/test-utils": "^10.34.0",
     "@carbon/themes": "^11.43.0",
-    "@figma/code-connect": "^1.1.4",
+    "@figma/code-connect": "^1.2.1",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^28.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",