improve ts-info type text (#126)

Author: csr632

packages/playground/use-theme-doc/pages/components/button/index$.md

@@ -17,5 +17,8 @@ SomeObjectLiteralType (Object Literal):
 SomeComplexType (Complex Type):
 <TsInfo src="./types.ts" name="SomeComplexType" />
 
+Re-exported Type:
+<TsInfo src="./types.ts" name="ReExportedInterface" />
+
 FileText:
 <FileText src="./types.ts" syntax="ts" />

packages/playground/use-theme-doc/pages/components/button/types.ts

@@ -1,3 +1,14 @@
+import type { MyImportedTypeAlias } from './typesUtils'
+export type { ReExportedInterface } from './typesUtils'
+export type MyExportedTypeAlias = { a: number }
+type MyTypeAlias = { a: number }
+export interface MyExportedInterface {
+  a: number
+}
+interface MyInterface {
+  a: number
+}
+
 /**
  * This is the description of the Button component's props
  */
@@ -22,9 +33,14 @@ export interface ButtonProps<TestGenerics extends string> extends Base {
    */
   onClick?: (event: React.MouseEvent) => void
   /** test method declaration */
-  testMethod(param: string): void
+  testMethod(param: MyExportedTypeAlias): MyTypeAlias
   /** test required property */
   testRequired: boolean
+  myExportedTypeAlias: MyExportedTypeAlias
+  myTypeAlias: MyTypeAlias
+  myExportedInterface: MyExportedInterface
+  myInterface: MyInterface
+  myImportedTypeAlias: MyImportedTypeAlias
 }
 
 interface Base {
@@ -55,9 +71,14 @@ export type SomeObjectLiteralType<TestGenerics> = {
    */
   onClick?: (event: React.MouseEvent) => void
   /** test method declaration */
-  testMethod(param: string): void
+  testMethod(param: MyInterface): MyExportedInterface
   /** test required property */
   testRequired: boolean
+  myExportedTypeAlias: MyExportedTypeAlias
+  myTypeAlias: MyTypeAlias
+  myExportedInterface: MyExportedInterface
+  myInterface: MyInterface
+  myImportedTypeAlias: MyImportedTypeAlias
 }
 
 /**

packages/playground/use-theme-doc/pages/components/button/typesUtils.ts

@@ -0,0 +1,8 @@
+export type MyImportedTypeAlias = { b: string }
+/**
+ * Comment for MyImportedInterface...
+ */
+export type ReExportedInterface = {
+  /** Comment for MyImportedInterface.prop1 */
+  prop1: MyImportedTypeAlias
+}

packages/playground/use-theme-doc/pages/themeDev.tsx

@@ -1,5 +1,5 @@
 // import the src directly instead of build output
 // useful for local development in this repo
 // actual users don't need to do this, they should import from 'vite-pages-theme-doc'
-// export * from 'vite-pages-theme-doc/src/index'
-export * from 'vite-pages-theme-doc'
+export * from 'vite-pages-theme-doc/src/index'
+// export * from 'vite-pages-theme-doc'

packages/react-pages/src/node/virtual-module-plugins/ts-info-module/extract.ts

@@ -138,14 +138,19 @@ function handleTypeElementMembered(
   typeChecker: TypeChecker
 ): TsPropertyOrMethodInfo[] {
   const result: TsPropertyOrMethodInfo[] = []
+  // or use node.getSymbol()?.getMembers() ?
   const nodeType = node.getType()
   const properties = nodeType.getProperties()
   for (const prop of properties) {
     const name = prop.getName()
     const description = ts.displayPartsToString(
       prop.compilerSymbol.getDocumentationComment(typeChecker.compilerObject)
     )
-    const type = prop.getTypeAtLocation(node).getText()
+    const type = prop
+      .getTypeAtLocation(node)
+      // drop the `import('/path/to/file').` before the type text
+      // https://github.com/dsherret/ts-morph/issues/453#issuecomment-667578386
+      .getText(node, ts.TypeFormatFlags.UseAliasDefinedOutsideCurrentScope)
     const defaultValue = (() => {
       let res = ''
       prop.getJsDocTags().find((tag) => {