MCP get_design_context drops Code Connect snippets as soon as a component becomes a Variant set (Component Set)

Hi Figma team / community,

I’m seeing a consistent, reproducible issue with Figma MCP, specifically the get_design_context tool, when a component changes from a single component to a Component Set (2+ variants).

Summary

• With one variant only, get_design_context returns a full React tree and correctly includes CodeConnectSnippet blocks for nested components connected via Code Connect.

• As soon as I add a second variant (making it a Component Set), get_design_context changes behavior:

  • it generates the expected union type for the variant property (e.g. type?: "..." | "...")

  • but the returned JSX collapses to an almost empty wrapper (often a self-closing <div ... />) and drops the nested children / Code Connect snippets.

This happens even if the component contains only a single nested item (so it’s not related to having many list items).

Expected behavior

For a Component Set, I expect get_design_context to still produce a meaningful snippet for the selected variant/instance and preserve Code Connect snippets for nested mapped components (or at least provide a consistent per-variant output).

Actual behavior (examples)

Case A — Single variant (works)

get_design_context returns a full structure with nested snippets, e.g.:

function ContextualMenuList({ className }: { className?: string }) {
  return (
    <div className={className || ""} data-name="contextual-menu / list">
      <div data-name="type=toggle & delete">
        <CodeConnectSnippet data-name="item-01" data-snippet-language="React">
          <AthContextualMenuItem
            label="Label"
            state="enabled"
            showToggleButton
            showDeleteButton
            deleteButtonProps={{ color: "neutral", size: "small", type: "ghost", startIcon: "delete_outline" }}
          />
        </CodeConnectSnippet>

        {/* ... item-02, item-03, etc. */}
      </div>
    </div>
  );
}

Case B — Two or more variants (breaks)

As soon as there are multiple variants, the output becomes:

type ContextualMenuListProps = {
  className?: string;
  type?: "status" | "toggle & delete" | "toggle & status" | "toggle";
};

function ContextualMenuList({ className, type = "toggle & delete" }: ContextualMenuListProps) {
  return (
    <div
      className={className || "content-stretch flex ..."}
      data-node-id="11261:1931"
    />
  );
}

=> The wrapper is self-closing (<div ... />) and all children / nested instances / CodeConnectSnippet blocks are gone.

Additional observation: “toggle button” area renders as raw generated code, while “delete button” renders via Code Connect

In another component, within the same get_design_context output, I see a surprising mix:

• The toggle button area is rendered as pure generated code with exported SVG assets:

{showToggleButton && (
  <div data-name="toggle-button">
    <div data-name="icon">
      <img src="http://localhost:3845/assets/...svg" />
      {/* ... */}
    </div>
  </div>
)}

• Meanwhile the delete-button area correctly renders as a Code Connect snippet:

<CodeConnectSnippet data-name="delete-button" data-snippet-language="React">
  <AthButton color="neutral" size="small" type="ghost" startIcon="delete_outline" />
</CodeConnectSnippet>

I even tried copying/pasting the exact working delete-button content into the toggle-button area. The toggle-button area still renders as raw generated code (no CodeConnectSnippet), which suggests Code Connect resolution depends on the node/slot context (or variant/component-set resolution), not only on the nested component itself.

Steps to reproduce

1. Create a component with one variant and nested instances that have Code Connect mappings.

2. Run MCP get_design_context on an instance:

   • Full tree + nested CodeConnectSnippet output (expected).

3. Add a second variant (component becomes a Component Set).

4. Run MCP get_design_context on an instance/variant:

   • Output collapses to a wrapper and drops children/snippets.

Environment

• Tool: Figma MCP — get_design_context

• Output: React

• Code Connect is configured and works in the single-variant case (and for some nested nodes).

Thanks!
Bruce