[Feature Request] Functional Token-indicating In-line documentation (a.k.a comments)

[softmarshmallow]

A Functional inline documentation.

There are two types of comment,

1. General comment - for describing the behavior, explaining the code.
2. Special comment - for indicating a block of token, that can be managed (synced bidirectionally) by design to code engine.

(suggestion) The syntax might look like,

import React from "react";

/**
 * ---------
 * https://code.grida.co/t/:p/:f/:id
 * [click to open design](https://code.grida.co/t/:p/:f/?redirect=design-origin)
 * [share this component](https://code.grida.co/t/:p/:f/?redirect=share-me)
 * (do not modify)
 * ---------
 */
function MyComponent(){
    return (
       <Wrapper>
           My component
       </Wrapper>
    );
}


/**
 * ---------
 * https://code.grida.co/t/:p/:f/:id
 * (do not modify)
 * ---------
 */
const Wrapper = styled.div`
    height: 100vh;
    width: 100vw;
`;

Challenges

• Modification of code of managed token.
• Modification (extending as new line) of token indicating comments.

What this can do

• Bidirectional data sync
• Previewing the design from vscode editor (withs url scheme)