From aefb7794d669ad853490e005b1ea7b075c96f099 Mon Sep 17 00:00:00 2001 From: Steven Zeck Date: Tue, 30 Jan 2018 17:35:23 -0600 Subject: [PATCH] Add new language tsx, add tsx support to typescript-formatter --- README.md | 1 + docs/options.md | 69 +++++++++++++++++++ .../simple-jsbeautifyrc/tsx/expected/test.tsx | 12 ++++ .../simple-jsbeautifyrc/tsx/original/test.tsx | 12 ++++ package.json | 8 ++- src/beautifiers/typescript-formatter.coffee | 1 + src/languages/index.coffee | 1 + src/languages/tsx.coffee | 21 ++++++ src/options.json | 41 +++++++++++ 9 files changed, 163 insertions(+), 3 deletions(-) create mode 100644 examples/simple-jsbeautifyrc/tsx/expected/test.tsx create mode 100644 examples/simple-jsbeautifyrc/tsx/original/test.tsx create mode 100644 src/languages/tsx.coffee diff --git a/README.md b/README.md index 2dde5f0..4d6f0ae 100644 --- a/README.md +++ b/README.md @@ -199,6 +199,7 @@ See [all supported options in the documentation at `docs/options.md`](docs/opti | Swig | `HTML (Swig)`, `SWIG` |`.swig` | **[`Pretty Diff`](https://github.com/prettydiff/prettydiff)** | | Terraform | `Terraform` |`.tf` | **[`terraformfmt`](https://www.terraform.io/docs/commands/fmt.html)** | | TSS | `TSS` |`.tss` | **[`Pretty Diff`](https://github.com/prettydiff/prettydiff)** | +| TSX | `TypeScriptReact` |`.tsx` | **[`TypeScript Formatter`](https://github.com/vvakame/typescript-formatter)** | | Twig | `HTML (Twig)` |`.twig` | **[`Pretty Diff`](https://github.com/prettydiff/prettydiff)** | | TypeScript | `TypeScript` |`.ts` | **[`TypeScript Formatter`](https://github.com/vvakame/typescript-formatter)** | | UX Markup | `UX` |`.ux` | **[`Pretty Diff`](https://github.com/prettydiff/prettydiff)** | diff --git a/docs/options.md b/docs/options.md index 0ae2840..6047ede 100644 --- a/docs/options.md +++ b/docs/options.md @@ -12622,6 +12622,75 @@ Maximum amount of characters per line (0 = disable) (Supported by Pretty Diff) } ``` +#### [TSX](#tsx) + +**Supported Beautifiers**: [`TypeScript Formatter`](#typescript-formatter) + +| Option | TypeScript Formatter | +| --- | --- | +| `disabled` | :white_check_mark: | +| `default_beautifier` | :white_check_mark: | +| `beautify_on_save` | :white_check_mark: | + +**Description**: + +Options for language TSX + +##### [Disable Beautifying Language](#disable-beautifying-language) + +**Important**: This option is only configurable from within Atom Beautify's setting panel. + +**Type**: `boolean` + +**Description**: + +Disable TSX Beautification + +**How to Configure** + +1. You can open the [Settings View](https://github.com/atom/settings-view) by navigating to +*Edit > Preferences (Linux)*, *Atom > Preferences (OS X)*, or *File > Preferences (Windows)*. +2. Go into *Packages* and search for "*Atom Beautify*" package. +3. Find the option "*Disable Beautifying Language*" and change it to your desired configuration. + +##### [Default Beautifier](#default-beautifier) + +**Important**: This option is only configurable from within Atom Beautify's setting panel. + +**Default**: `TypeScript Formatter` + +**Type**: `string` + +**Enum**: `TypeScript Formatter` + +**Description**: + +Default Beautifier to be used for TSX + +**How to Configure** + +1. You can open the [Settings View](https://github.com/atom/settings-view) by navigating to +*Edit > Preferences (Linux)*, *Atom > Preferences (OS X)*, or *File > Preferences (Windows)*. +2. Go into *Packages* and search for "*Atom Beautify*" package. +3. Find the option "*Default Beautifier*" and change it to your desired configuration. + +##### [Beautify On Save](#beautify-on-save) + +**Important**: This option is only configurable from within Atom Beautify's setting panel. + +**Type**: `boolean` + +**Description**: + +Automatically beautify TSX files on save + +**How to Configure** + +1. You can open the [Settings View](https://github.com/atom/settings-view) by navigating to +*Edit > Preferences (Linux)*, *Atom > Preferences (OS X)*, or *File > Preferences (Windows)*. +2. Go into *Packages* and search for "*Atom Beautify*" package. +3. Find the option "*Beautify On Save*" and change it to your desired configuration. + #### [Twig](#twig) **Supported Beautifiers**: [`Pretty Diff`](#pretty-diff) diff --git a/examples/simple-jsbeautifyrc/tsx/expected/test.tsx b/examples/simple-jsbeautifyrc/tsx/expected/test.tsx new file mode 100644 index 0000000..273dd06 --- /dev/null +++ b/examples/simple-jsbeautifyrc/tsx/expected/test.tsx @@ -0,0 +1,12 @@ +class Test extends React.Component { + render() { + return ( +
+

+ { this.foo.bar } + < /h2> + { this.foo.bar.children } +

+ ); + } +} \ No newline at end of file diff --git a/examples/simple-jsbeautifyrc/tsx/original/test.tsx b/examples/simple-jsbeautifyrc/tsx/original/test.tsx new file mode 100644 index 0000000..a974f18 --- /dev/null +++ b/examples/simple-jsbeautifyrc/tsx/original/test.tsx @@ -0,0 +1,12 @@ +class Test extends React.Component { + render() { + return ( +
+

+ {this.foo.bar} +

+ {this.foo.bar.children} +
+ ); + } +} \ No newline at end of file diff --git a/package.json b/package.json index 5a1734f..af5e4da 100644 --- a/package.json +++ b/package.json @@ -277,7 +277,8 @@ "atom-beautify:beautify-language-xml", "atom-beautify:beautify-language-xtemplate", "atom-beautify:beautify-language-yaml", - "atom-beautify:beautify-language-terraform" + "atom-beautify:beautify-language-terraform", + "atom-beautify:beautify-language-tsx" ], ".tree-view .file .name": [ "atom-beautify:beautify-file" @@ -412,7 +413,8 @@ "align-yaml", "goimports", "terraform", - "terraformfmt" + "terraformfmt", + "tsx" ], "devDependencies": { "coffeelint": "1.16.0" @@ -449,4 +451,4 @@ "prettydiff2" ] } -} +} \ No newline at end of file diff --git a/src/beautifiers/typescript-formatter.coffee b/src/beautifiers/typescript-formatter.coffee index 1cbfd8c..a5081ea 100644 --- a/src/beautifiers/typescript-formatter.coffee +++ b/src/beautifiers/typescript-formatter.coffee @@ -6,6 +6,7 @@ module.exports = class TypeScriptFormatter extends Beautifier link: "https://github.com/vvakame/typescript-formatter" options: { TypeScript: true + TSX: true } beautify: (text, language, options) -> diff --git a/src/languages/index.coffee b/src/languages/index.coffee index 7cc1e5c..69c14a8 100644 --- a/src/languages/index.coffee +++ b/src/languages/index.coffee @@ -68,6 +68,7 @@ module.exports = class Languages "svg" "swig" "tss" + "tsx" "twig" "typescript" "ux_markup" diff --git a/src/languages/tsx.coffee b/src/languages/tsx.coffee new file mode 100644 index 0000000..7625b88 --- /dev/null +++ b/src/languages/tsx.coffee @@ -0,0 +1,21 @@ +module.exports = { + + name: "TSX" + namespace: "tsx" + fallback: ['ts'] + + ### + Supported Grammars + ### + grammars: [ + "TypeScriptReact" + ] + + ### + Supported extensions + ### + extensions: [ + "tsx" + ] + +} diff --git a/src/options.json b/src/options.json index 35bda1b..d545bd3 100644 --- a/src/options.json +++ b/src/options.json @@ -7365,6 +7365,47 @@ } } }, + "tsx": { + "title": "TSX", + "type": "object", + "description": "Options for language TSX", + "collapsed": true, + "beautifiers": [ + "TypeScript Formatter" + ], + "grammars": [ + "TypeScriptReact" + ], + "extensions": [ + "tsx" + ], + "properties": { + "disabled": { + "title": "Disable Beautifying Language", + "order": -3, + "type": "boolean", + "default": false, + "description": "Disable TSX Beautification" + }, + "default_beautifier": { + "title": "Default Beautifier", + "order": -2, + "type": "string", + "default": "TypeScript Formatter", + "description": "Default Beautifier to be used for TSX", + "enum": [ + "TypeScript Formatter" + ] + }, + "beautify_on_save": { + "title": "Beautify On Save", + "order": -1, + "type": "boolean", + "default": false, + "description": "Automatically beautify TSX files on save" + } + } + }, "twig": { "title": "Twig", "type": "object",