feat: support @required tag to denote required prop

#22
carbon-design-system · May 19, 2022 · c0592ae · c0592ae
1 parent f6ed263
commit c0592ae
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/src/ComponentParser.ts b/src/ComponentParser.ts
@@ -30,6 +30,7 @@ interface ComponentProp {
   description?: string;
   isFunction: boolean;
   isFunctionDeclaration: boolean;
+  isRequired: boolean;
   reactive: boolean;
 }
 
@@ -385,6 +386,7 @@ export default class ComponentParser {
               value,
               isFunction,
               isFunctionDeclaration,
+              isRequired: false,
               constant: kind === "const",
               reactive: false,
             });
@@ -456,6 +458,7 @@ export default class ComponentParser {
           let description: undefined | string = undefined;
           let isFunction = false;
           let isFunctionDeclaration = false;
+          let isRequired = false;
 
           if (init != null) {
             if (
@@ -511,6 +514,7 @@ export default class ComponentParser {
             }
 
             additional_tags.forEach((tag) => {
+              isRequired = tag.tag === "required";
               description += `${description ? "\n" : ""}@${tag.tag} ${tag.name}${
                 tag.description ? ` ${tag.description}` : ""
               }`;
@@ -529,6 +533,7 @@ export default class ComponentParser {
             value,
             isFunction,
             isFunctionDeclaration,
+            isRequired,
             constant: kind === "const",
             reactive: this.reactive_vars.has(prop_name),
           });

diff --git a/src/writer/writer-markdown.ts b/src/writer/writer-markdown.ts
@@ -3,7 +3,7 @@ import { ComponentDocs } from "../rollup-plugin";
 import WriterMarkdown, { AppendType } from "./WriterMarkdown";
 import { formatTsProps, getTypeDefs } from "./writer-ts-definitions";
 
-const PROP_TABLE_HEADER = `| Prop name | Kind | Reactive | Type | Default value | Description |\n| :- | :- | :- | :- |\n`;
+const PROP_TABLE_HEADER = `| Prop name | Required | Kind | Reactive | Type | Default value | Description |\n| :- | :- | :- | :- |\n`;
 const SLOT_TABLE_HEADER = `| Slot name | Default | Props | Fallback |\n| :- | :- | :- | :- |\n`;
 const EVENT_TABLE_HEADER = `| Event name | Type | Detail |\n| :- | :- | :- |\n`;
 const MD_TYPE_UNDEFINED = "--";
@@ -88,7 +88,7 @@ export default async function writeMarkdown(components: ComponentDocs, options:
         .forEach((prop) => {
           document.append(
             "raw",
-            `| ${prop.name} | ${`<code>${prop.kind}</code>`} | ${prop.reactive ? "Yes" : "No"} | ${formatPropType(
+            `| ${prop.name} | ${prop.isRequired ? 'Yes' : 'No'} | ${`<code>${prop.kind}</code>`} | ${prop.reactive ? "Yes" : "No"} | ${formatPropType(
               prop.type
             )} | ${formatPropValue(prop.value)} | ${formatPropDescription(prop.description)} |\n`
           );

diff --git a/src/writer/writer-ts-definitions.ts b/src/writer/writer-ts-definitions.ts
@@ -56,7 +56,7 @@ function genPropDef(def: Pick<ComponentDocApi, "props" | "rest_props" | "moduleN
 
       return `
       ${prop_comments.length > 0 ? `/**\n${prop_comments}*/` : EMPTY_STR}
-      ${prop.name}?: ${prop_value};`;
+      ${prop.name}${prop.isRequired ? "" : "?"}: ${prop_value};`;
     });
 
   if (def.rest_props?.type === "Element") {