flutter_design_annotation

Used by the code generator to create catalog to show in the design system viewer.

Annotations will be used by flutter_design_codegen to generate catalog classes which populates the viewer catalog shown in flutter_design_viewer.

@Design

The @Design annotation could be used on classes and factory constructors to generated catalog code in accompanying .catalog.dart file which is then consumed by the design system viewer.

This is considered an inline catalog declaration which is very useful for components. For more complicated catalogs, the user should create it in separate catalog files.

Here is a minimal example of using @designon a Widget declaration to create a Primary component:

@design
class SpecialWidget extends StatelessWidget {
  ...
}

Powered by source_gen and build_runner the flutter_design_codegen package will generate a catalog for you that could be directly used in the flutter_design_viewer.

Here is a fully customized example of using @Design:

@Design(
  // (Optional) Provide a name, if omitted/[null] will default to the class name
  name: null,
  // (Optional) Provide a description, if omitted/[null] will default to the class 
  // documentation (i.e the /// docs on the annotated widget). 
  // The description will be rendered in Markdown.
  description: null,
  // (Optional) Embed design tools (e.g. Figma) that will be shown in an iFrame
  designLink: 
    'https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Ffile%2Fzi9txHyO7XMo8TYTAv2rku%2FJARVIS%3Fnode-id%3D7188%253A46173',
  // (Optional) Specify the initial values to be shown in the viewer. This will take 
  // priority over the default value in the constructor. Also it will be possible to 
  // assign initial values for `required` parameters.
  viewerInitValueMap: {
    'uri':
        'https://static.independent.co.uk/2021/06/16/08/newFile-4.jpg?quality=75&width=982&height=726&auto=webp',
  },
)
class SpecialWidget extends StatelessWidget {
  ...
}

(TBD) Similarly, you can also use the @Design annotation on a factory constructor which will create Secondary component(s).