Skip to content

Raw Template - Support variant and links in raw #262

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
amoshydra opened this issue Mar 15, 2025 · 0 comments · May be fixed by #263
Open

Raw Template - Support variant and links in raw #262

amoshydra opened this issue Mar 15, 2025 · 0 comments · May be fixed by #263
Labels
feature request

Comments

@amoshydra
Copy link

amoshydra commented Mar 15, 2025 •
edited
Loading

Describe the feature you'd like:

Currently parseReactDoc is capable of returning variant and link to the CodeConnectJSON

code-connect/cli/src/react/parser.ts

Lines 910 to 911 in cfed2bf

const variant = variantArg ? parseVariant(variantArg, sourceFile, checker) : undefined
const links = linksArg ? parseLinks(linksArg, parserContext) : undefined

It would be nice to also be able to specify variant and link in the Raw template.

code-connect/cli/src/commands/connect.ts

Lines 190 to 209 in cfed2bf

export function parseRawFile(filePath: string, label: string | undefined): CodeConnectJSON {
const fileContent = fs.readFileSync(filePath, 'utf-8')
const [firstLine, ...templateLines] = fileContent.split('\n')
const figmaNodeUrl = firstLine.replace(/\/\/\s*url=/, '').trim()
const template = templateLines.join('\n')
return {
figmaNode: figmaNodeUrl,
template,
// nestable by default unless user specifies otherwise
templateData: { nestable: true },
language: 'raw',
label: label || 'Code',
source: '',
sourceLocation: { line: -1 },
metadata: {
cliVersion: require('../../package.json').version,
},
}
}

Suggestion

Allow usage of frontmatter to specify more data for the CodeConnectJSON

---
url: https://www.figma.com/file/your-file-id/Component?node-id=123
component: Button
variant:
  type: primary
  has outline: true
links:
  - name: Awesome Document
    url: https://example.com
---

const figma = require('figma')
const instance = figma.selectedInstance

it can be kept forward compatible too. yaml parsing can be enabled if the file starts with "---\n".

See POC in #263
amoshydra added a commit to amoshydra/code-connect that referenced this issue Mar 15, 2025
@amoshydra
feat: support component, variant and links for raw file
8e2607a 
Related to figma#262
@amoshydra amoshydra linked a pull request Mar 15, 2025 that will close this issue
Open
amoshydra added a commit to amoshydra/code-connect that referenced this issue Mar 15, 2025
@amoshydra
feat: support component, variant and links for raw file
b0088e3 
Related to figma#262
amoshydra added a commit to amoshydra/code-connect that referenced this issue Mar 15, 2025
@amoshydra
feat: support component, variant and links for raw file
e7ab659 
Related to figma#262
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
feature request
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat: support component, variant and links for raw file amoshydra/code-connect
1 participant
@amoshydra