From 36693018ce8b3a813a96c12a07b00e93517f3073 Mon Sep 17 00:00:00 2001
From: Artem Sapegin <artem@sapegin.ru>
Date: Thu, 21 Dec 2017 08:48:34 +0100
Subject: [PATCH] Feat: Add TypeScript files to default components and ignore
 patterns

Related to #749, #750
---
 docs/Components.md        |  6 +++---
 docs/Configuration.md     |  4 ++--
 docs/Webpack.md           |  2 +-
 scripts/schemas/config.js | 10 ++++++++--
 4 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/docs/Components.md b/docs/Components.md
index 388c447e7..5e6a18d3c 100644
--- a/docs/Components.md
+++ b/docs/Components.md
@@ -12,7 +12,7 @@
 
 ## Finding components
 
-By default Styleguidist will search components using this [glob pattern](https://github.com/isaacs/node-glob#glob-primer): `src/components/**/*.{js,jsx}`.
+By default Styleguidist will search components using this [glob pattern](https://github.com/isaacs/node-glob#glob-primer): `src/components/**/*.{js,jsx,ts,tsx}`.
 
 It will pick up files like:
 
@@ -23,7 +23,7 @@ It will pick up files like:
 But will ignore tests:
 
 * `__tests__` folder,
-* files containing `.test.js`, `.test.jsx`, `.spec.js` and `.spec.jsx`.
+* files containing `.test.js` or `.spec.js` (or same for `.jsx`, `.ts` and `.tsx`).
 
 If it doesn’t work for you, create a `styleguide.config.js` file in your project’s root folder and configure the patterns to fit your project structure. For example, if your components look like `components/Button/Button.js` + `components/Button/index.js` (meaning you need to skip `index.js`, otherwise the component will be loaded twice):
 
@@ -67,7 +67,7 @@ module.exports = {
         {
           name: 'Installation',
           content: 'docs/installation.md',
-          description: 'The description for the installation section',
+          description: 'The description for the installation section'
         },
         {
           name: 'Configuration',
diff --git a/docs/Configuration.md b/docs/Configuration.md
index def705005..fc320830e 100644
--- a/docs/Configuration.md
+++ b/docs/Configuration.md
@@ -57,7 +57,7 @@ Styleguidist uses [Bublé](https://buble.surge.sh/guide/) to run ES6 code on the
 
 #### `components`
 
-Type: `String` or `Function`, default: `src/components/**/*.{js,jsx}`
+Type: `String` or `Function`, default: `src/components/**/*.{js,jsx,ts,tsx}`
 
 * when `String`: a [glob pattern](https://github.com/isaacs/node-glob#glob-primer) that matches all your component modules.
 * when `Function`: a function that returns an array of module paths.
@@ -235,7 +235,7 @@ module.exports = {
 
 #### `ignore`
 
-Type: `String[]`, default: `['**/__tests__/**', '**/*.test.js', '**/*.test.jsx', '**/*.spec.js', '**/*.spec.jsx']`
+Type: `String[]`, default: `['**/__tests__/**', '**/*.test.{js,jsx,ts,tsx}', '**/*.spec.{js,jsx,ts,tsx}', '**/*.d.ts']`
 
 Array of [glob pattern](https://github.com/isaacs/node-glob#glob-primer) that should not be included in the style guide.
 
diff --git a/docs/Webpack.md b/docs/Webpack.md
index 7a687a7ff..468ddc1ed 100644
--- a/docs/Webpack.md
+++ b/docs/Webpack.md
@@ -85,7 +85,7 @@ module.exports = {
 
 ## Create React App
 
-[Create React App](https://github.com/facebookincubator/create-react-app) is supported out of the box, you don’t even need to create a style guide config if your components could be found using a default glob pattern, `src/components/**/*.{js,jsx}`.
+[Create React App](https://github.com/facebookincubator/create-react-app) is supported out of the box, you don’t even need to create a style guide config if your components could be found using a default pattern: all files with `.js` or `.jsx` extensions inside `src/components` or `src/Components` folders.
 
 ## Create React App, TypeScript
 
diff --git a/scripts/schemas/config.js b/scripts/schemas/config.js
index bb1b8d5de..453b0cdaa 100644
--- a/scripts/schemas/config.js
+++ b/scripts/schemas/config.js
@@ -3,7 +3,8 @@
 // If you want to access any of these options in React, don’t forget to update CLIENT_CONFIG_OPTIONS array
 // in loaders/styleguide-loader.js
 
-const DEFAULT_COMPONENTS_PATTERN = 'src/@(components|Components)/**/*.{js,jsx}';
+const EXTENSIONS = 'js,jsx,ts,tsx';
+const DEFAULT_COMPONENTS_PATTERN = `src/@(components|Components)/**/*.{${EXTENSIONS}}`;
 
 const path = require('path');
 const startCase = require('lodash/startCase');
@@ -88,7 +89,12 @@ module.exports = {
 	},
 	ignore: {
 		type: 'array',
-		default: ['**/__tests__/**', '**/*.test.js', '**/*.spec.js', '**/*.test.jsx', '**/*.spec.jsx'],
+		default: [
+			'**/__tests__/**',
+			`**/*.test.{${EXTENSIONS}}`,
+			`**/*.spec.{${EXTENSIONS}}`,
+			'**/*.d.ts',
+		],
 	},
 	highlightTheme: {
 		type: 'string',