fix(#154): add docgen alias (#532)

* fix(#154): add docgen alias * feat(#154): add extend props * chore: add workaround for node 17+ * chore(#154): update documentation * chore(#154): fix docgen
druxt · Jul 12, 2022 · c4aca0b · c4aca0b
1 parent 6a62e9d
commit c4aca0b
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 7 deletions.
diff --git a/docs/package.json b/docs/package.json
@@ -4,7 +4,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "nuxt",
+    "dev": "NODE_OPTIONS='--openssl-legacy-provider' nuxt",
     "build": "nuxt build",
     "start": "nuxt start",
     "generate": "nuxt generate",

diff --git a/packages/breadcrumb/src/components/DruxtBreadcrumb.vue b/packages/breadcrumb/src/components/DruxtBreadcrumb.vue
@@ -44,7 +44,7 @@ export default {
      * @type {boolean}
      * @default true
      * @example @lang vue
-     * <DruxtBreacrumb :home="false" />
+     * <DruxtBreadcrumb :home="false" />
      */
     home: {
       type: Boolean,
@@ -59,7 +59,7 @@ export default {
      * @type {string}
      *
      * @example @lang vue
-     * <DruxtBreacrumb path="/node/1" />
+     * <DruxtBreadcrumb path="/node/1" />
      */
     path: {
       type: String,

diff --git a/packages/docgen/src/index.js b/packages/docgen/src/index.js
@@ -206,7 +206,30 @@ _Note: The contents of this file where automatically generated by the [Druxt Doc
    */
   async processVue(file, templateData) {
     // Get data from vue-docgen-api.
-    const data = await vueDocs.parse(file)
+    const data = await vueDocs.parse(file, {
+      alias: {
+        druxt: path.resolve('packages/druxt')
+      }
+    })
+
+    // Inject extends from vue-docgen-api into jsdoc data.
+    const prefixId = (templateData[0] || {}).id || ''
+    // Props.
+    for (const prop of (data.props || []).filter((prop) => !templateData.map((o) => o.id).includes(`${prefixId}.props.${prop.name}`))) {
+      const item = {
+        id: `${prefixId}.props.${prop.name}`,
+        longname: `${prefixId}.props.${prop.name}`,
+        name: prop.name,
+        kind: 'member',
+        scope: 'static',
+        description: prop.description,
+        memberof: `${prefixId}.props`,
+      }
+      if ((prop.tags || {}).example) {
+        item.examples = [prop.tags.example[0].description.replace('DruxtModule', prefixId.split(':')[1])]
+      }
+      templateData.push(item)
+    }
 
     templateData.map(item => {
       const parts = item.id.split('.')

diff --git a/packages/druxt/src/components/DruxtModule.vue b/packages/druxt/src/components/DruxtModule.vue
@@ -39,16 +39,27 @@ export default {
   props: {
     /**
      * The resource langcode.
+     *
+     * @example
+     * <DruxtModule langcode="en" />
+     *
+     * @type {string}
      */
     langcode: {
       type: String,
       default: undefined
     },
 
     /**
-     * The module value.
+     * The module component model value.
+     *
+     * Used to bypass the Drupal JSON:API fetch, setting the module data
+     * directly.
+     *
+     * @example
+     * <DruxtModule v-model="{ foo: bar }" />
      *
-     * @type {(Array|Boolean|Date|Number|Object|String)}
+     * @type {*}
      * @model
      */
     value: {
@@ -70,7 +81,7 @@ export default {
      *   }"
      * />
      *
-     * @type {(Boolean|Object)}
+     * @type {(boolean|object)}
      */
     wrapper: {
       type: [Boolean, Object],