Add a generation schematics add-example to create examples

[yumengwu]

Add a generation schematics add-example to @vmw/ng-live-docs to make it easy to create examples for the entity details container. Currently only support examples using components from @vcd/ui-components.

Why this change made?

It currently takes a lot of steps to create an example with its own module, add it to an examples module, and add it to Documentation.registerDocumentationEntry.

add-example schematics could generate an empty example component with its module, an examples module which includes all examples for a component/directive and adds them to registerDocumentationEntry, and an root examples module examples.module importing every examples module, which make it easy to import examples to app.module.

How to use?

Command line: ng g @vmw/ng-live-docs:add-example --package-name {packageName} --module-name {moduleName} --component-name {componentName} --example-name {exampleName} --display-name {displayName}

• packageName is the package including component to write examples. For example, @vcd/ui-components.
• moduleName is the module importing component.
• componentName is a PascalCase or kebab-case string represents the component which this example uses. For example: DatagridComponent.
• exampleName is a PascalCase or kebab-case string represents the name of this example. For example: example-one.
• displayName is the title displayed on example container. For example: This is example one.

Example structure:

Root examples module examples.module is under projectRoot/app, and imports all the examples module.

Examples module name.examples.module, which imports all the example using this component, is under projectRoot/app/components/name if this example is for component, or is under projectRoot/app/directives/name if this example is for directive.

Example with its module is under projectRoot/app/{components|directives}/component-name/example-name.

For example, when adding two DatagridComponent's example example-one and example-two, and a ShowClippedTextDirective's example example-three, the following files are generated:

• Example example-one with its module is under projectRoot/app/components/datagrid/example-one with name DatagridExampleOneExampleModule.
• Example example-two with its module is under projectRoot/app/components/datagrid/example-two with name DatagridExampleTwoExampleModule.
• Examples module datagrid.examples.module which imports DatagridExampleOneExampleModule and DatagridExampleTwoExampleModule is under projectRoot/app/components/datagrid with name DatagridExamplesModule.
• Example example-three with its module is under projectRoot/app/directives/show-clipped-text/example-three with name ShowClippedTextExampleThreeExampleModule.
• Examples module show-clipped-text.examples.module which imports ShowClippedTextExampleThreeExampleModule is under projectRoot/app/directives/show-clipped-text with name ShowClippedTextExamplesModule.
• Root examples module which imports DatagridExamplesModule and ShowClippedTextExamplesModule is under projectRoot/app.

Signed-off-by: yumengwu yumengwu95@gmail.com

[codecov-io]

Codecov Report

Merging #11 (0ebeaa1) into master (5506e07) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##           master      #11   +/-   ##
=======================================
  Coverage   68.96%   68.96%           
=======================================
  Files           2        2           
  Lines          58       58           
  Branches        7        7           
=======================================
  Hits           40       40           
  Misses         15       15           
  Partials        3        3           

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 5506e07...0ebeaa1. Read the comment docs.