figma.string() renders as template literal instead of actual value when used within conditional boolean props

Offen
  • Stimmt etwas nicht?
#304 4 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
45/100
Issue-Typ
Bug
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
react, typescript
Bereich
devtools

Rechercherichtung

Start by tracing how figma.boolean() handles conditional JSX props and how nested figma.string() values are rendered in the generated snippet; the issue names no source files or tests. Reproduce the example against Code Connect 1.3.4 and identify the rendering path for the true branch. Done means the snippet displays the Figma string value when Show Description is true.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

feature request

Bug Description

When using figma.string() inside a conditional boolean prop mapping, the generated code snippet shows the template literal { figma.string('Property Name') } instead of the actual string value from Figma.

Expected Behavior

When Show Description is true, the code snippet should display:

<CardHeader>
  <CardTitle>Title Text</CardTitle>
  <CardDescription>This is a card description.</CardDescription>
</CardHeader>

Actual Behavior

The code snippet shows:

<CardHeader>
  <CardTitle>Title Text</CardTitle>
  <CardDescription>{ figma.string('Description Text') }</CardDescription>
</CardHeader>

Code Sample

figma.connect(
  CardHeader,
  'figma-url',
  {
    props: {
      cardDescription: figma.boolean('Show Description', {
        true: <CardDescription>{ figma.string('Description Text') }</CardDescription>,
        false: undefined,
      }),
      titleText: figma.string('Title Text'),
    },
    example: (props) => (
      <CardHeader>
        <CardTitle>{ props.titleText }</CardTitle>
        { props.cardDescription }
      </CardHeader>
    ),
  },
);

Environment

Figma Code Connect version: 1.3.4
Framework: React

Figma Component Instance

Image
Vorherrschende Sprache
TypeScript
Sterne
1.6k
Forks
126
Keine gemergten PRs in 30 T.

Entwicklungsumgebung

Dieses Projekt bietet weder Dev-Container noch Dockerfile noch Beitragsleitfaden – die Einrichtung liegt bei Ihnen. Beginnen Sie mit der README; die allgemeinen Schritte stehen in unserem Leitfaden für den ersten Beitrag.

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus figma/code-connect

Alle Issues in figma/code-connect

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.