[JavaScript] Code and Data specific indentation rules

JavaScript/Default.sublime-keymap

@@ -51,4 +51,24 @@
             { "key": "selection_empty", "operator": "equal", "operand": false, "match_all": true }
         ]
     },
+
+    // Add indented line in square brackets
+    { "keys": ["enter"], "command": "run_macro_file", "args": {"file": "res://Packages/Default/Add Line in Braces.sublime-macro"}, "context":
+        [
+            { "key": "setting.auto_indent" },
+            { "key": "selection_empty", "match_all": true },
+            { "key": "selector", "operand": "source.js, source.jsx, source.ts, source.tsx" },
+            { "key": "preceding_text", "operator": "regex_contains", "operand": "\\[$", "match_all": true },
+            { "key": "following_text", "operator": "regex_contains", "operand": "^\\]", "match_all": true }
+        ]
+    },
+    { "keys": ["keypad_enter"], "command": "run_macro_file", "args": {"file": "res://Packages/Default/Add Line in Braces.sublime-macro"}, "context":
+        [
+            { "key": "setting.auto_indent" },
+            { "key": "selection_empty", "match_all": true },
+            { "key": "selector", "operand": "source.js, source.jsx, source.ts, source.tsx" },
+            { "key": "preceding_text", "operator": "regex_contains", "operand": "\\[$", "match_all": true },
+            { "key": "following_text", "operator": "regex_contains", "operand": "^\\]", "match_all": true }
+        ]
+    },
 ]

JavaScript/Indentation Rules - Template Strings.tmPreferences

@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<plist version="1.0">
+<dict>
+	<key>scope</key>
+	<string>string.quoted.other.js</string>
+	<key>settings</key>
+	<dict>
+		<!--
+		Only first row containing opening backtick is included in auto-indentation.
+		Content of plain tagged template strings is otherwise excluded.
+
+		Note:
+		Decreasing indentation of last row, containing stand-alone closing backtick
+		is handled by normal indentation rules.
+		 -->
+
+		<!--
+		<key>decreaseIndentPattern</key>
+		<string>^\s*`</string>
+ 		-->
+
+		<key>increaseIndentPattern</key>
+		<string>^[^`]*`\s*$</string>
+
+		<key>unIndentedLinePattern</key>
+		<string>^[^`]*$</string>
+	</dict>
+</dict>
+</plist>

JavaScript/Indentation Rules - Values.tmPreferences

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<plist version="1.0">
+<dict>
+	<key>scope</key>
+	<string>
+		source.js meta.mapping, source.js meta.sequence,
+		source.jsx meta.mapping, source.jsx meta.sequence,
+		source.ts meta.mapping, source.ts meta.sequence,
+		source.tsx meta.mapping, source.tsx meta.sequence
+	</string>
+	<key>settings</key>
+	<dict>
+		<!-- NOTE: Keep in sync with JSON! -->
+		<key>decreaseIndentPattern</key>
+		<string>(?x)
+			# When an object is closed, but not opened
+			(
+				^
+				(
+					# Consume strings
+					"(?:[^"\\]|\\.)*"
+					|
+					# Consume all chars that don't start a string, comment or
+					# open an object on this line
+					[^"/{\n]
+				)*
+				\}.*$
+			)
+			|
+			# When an array is closed by itself on a line (interacts with indentSquareBrackets)
+			(
+				^(.*\*/)?\s*\].*$
+			)
+		</string>
+		<key>increaseIndentPattern</key>
+		<string>(?x)
+			# When an object is opened, but not closed
+			(
+				^.*\{
+				(
+					# Consume strings
+					"(?:[^"\\]|\\.)*"
+					|
+					# Consume all chars that don't start a string, comment or
+					# end the object that was opened on this line
+					[^"/}]
+				)*
+				# Stop matching at the end of the line, or once we hit a comment
+				($|/[/*])
+			)
+			|
+			# When an array is opened, but not closed
+			(
+				^.*\[
+				(
+					# Consume strings
+					"(?:[^"\\]|\\.)*"
+					|
+					# Consume all chars that don't start a string, comment or
+					# end the array that was opened on this line
+					[^"/\]]
+				)*
+				# Stop matching at the end of the line, or once we hit a comment
+				($|/[/*])
+			)
+		</string>
+		<!-- Reset for value rules -->
+		<key>bracketIndentNextLinePattern</key>
+		<string></string>
+	</dict>
+</dict>
+</plist>

JavaScript/Indentation Rules.tmPreferences

@@ -1,23 +1,41 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <plist version="1.0">
 <dict>
+	<!--
+		The meta.function scopes are used
+		to re-override the separate mapping and sequence-sepcific patterns
+		defined in `Indentation Rules - Values.tmPreferences`.
+		This relies on a scope selector scoring adjustment in 4173.
+		See also: https://github.com/sublimehq/sublime_text/issues/2152
+	-->
 	<key>scope</key>
-	<string>source.js, source.ts, source.jsx, source.tsx</string>
+	<string>
+		source.js - source.js meta.string,
+		source.js meta.function - source.js meta.string,
+		source.jsx - source.jsx meta.string,
+		source.jsx meta.function - source.jsx meta.string,
+		source.ts - source.ts meta.string,
+		source.ts meta.function - source.ts meta.string,
+		source.tsx - source.tsx meta.string,
+		source.tsx meta.function - source.tsx meta.string
+	</string>
 	<key>settings</key>
 	<dict>
 		<key>decreaseIndentPattern</key>
 		<string><![CDATA[(?x)
-			# line beginning with whitespace or block comments
+			# line beginning with whitespace
 			^ (.*\*/)? \s*
 			(?:
 			# dedent closing braces
 			  \}
+			# dedent closing brackets
+			| \]
 			# dedent closing tagged templates
 			| `
 			# detent `case ... :`
-			| case\b
+			| case\b.*:
 			# detent `default:`
-			| default\b
+			| default\s*:
 			)
 		]]></string>
 
@@ -30,11 +48,11 @@
 			# but exclude lines such as `extern "C" {`
 			  .* \{ (?: \s* /\*.*\*/ )* \s* (?: //.* )? $
 			# indent after opening tagged template: e.g.: "css`"
-			| .* \w+ \s* `
+			# see: Indentation Rules - Template Strings.tmPreferences
 			# indent after `case ... :`
-			| case\b
+			| case\b.*:
 			# indent after `default:`
-			| default\b
+			| default\s*:
 			)
 		]]></string>
 
@@ -72,8 +90,6 @@
 			)
 		]]></string>
 
-		<key>indentSquareBrackets</key>
-		<true/>
 	</dict>
 </dict>
 </plist>

JavaScript/tests/syntax_test_js_indent_common.js

@@ -1,5 +1,88 @@
 // SYNTAX TEST reindent-unchanged "Packages/JavaScript/JavaScript.sublime-syntax"
 
+/*
+ * Export definitions
+ */
+
+export default {
+    default: 'value',
+    case() {
+        const map1 = {
+            default: 'value'
+        }
+        const list1 = [
+            default
+        ]
+
+        if (foo == true)
+            return 1
+        else if (bar == true)
+            return 2
+        else
+            return 3
+
+        switch (map1) {
+        case null:
+            return 0
+        default:
+            const map2 = {
+                default: 'value'
+            }
+            const list2 = [
+                default,
+                () => {
+                    switch (map2) {
+                    default:
+                        return 0
+                    case null:
+                        return 1
+                    }
+                }
+            ]
+        }
+    }
+}
+
+/*
+ * mapping definitions
+ */
+
+const maps = {
+    case: "case",
+    default: "default",
+    switch: "switch",
+    if: "if",
+    elif: "elif",
+    else: "else",
+    function: "function",
+    object: {
+        "key": "value",
+    },
+    list1: [
+        "switch",
+        "case"
+    ],
+    list3: ["value1", "value2"]
+};
+
+/*
+ * list definitions
+ */
+
+const list = [
+    case,
+    default,
+    switch,
+    if,
+    elif,
+    else,
+    [
+        case,
+        default
+    ],
+    ["value1", "value2"]
+]
+
 /**
  * This is my first JavaScript program.
  * This will print 'Hello World' as the output
@@ -548,16 +631,12 @@ function testIfElseIndentationWithBracesAndComment(v) {
 
 function testSwitchCaseIndentation(v) {
     switch (s) {
-    case
     case:
-    case break
     case: break
     case "(": break
     case ")": break;
     case ":": break;
     case ";": break;
-    case
-        break;
     case:
         break;
     case ":"
@@ -982,6 +1061,8 @@ function testWhileIndentationWithBracesAndComments(v)  {
  * CSS Templates
  */
 
+var style = css`tr{color:red}`;
+
 var style = css`
     tr, p {
         background: red solid;
@@ -992,6 +1073,8 @@ var style = css`
  * HTML Templates
  */
 
+var html = html`<p>${content}</p>`;
+
 var html = html`
     <head>
         <script type="text/javascript">
@@ -1026,6 +1109,8 @@ var html = html`
  * JavaScript Templates
  */
 
+var script = js`console.log(${string})`;
+
 var script = js`
     var ${name} = "Value ${interpol}"
 
@@ -1038,6 +1123,8 @@ var script = js`
  * JSON Templates
  */
 
+var json = json`{"key": "value"}`;
+
 var json = json`
     {
         "simple": "val${ue}",
@@ -1053,4 +1140,49 @@ var json = json`
             ]
         }
     }
-`
+`
+
+/*
+ * Other Templates
+ */
+
+var other = other`template ${string}`;
+
+var other = other`
+    # Heading
+
+    My ${pragraph}!
+`
+
+/*
+ * Plain String Templates
+ */
+
+`single line template string`
+
+`
+    multi line template strings
+    ignore normal JavaScript indentation rules
+
+    switch (${var}) {
+        case "foo":
+        break;
+                case "bar":
+                    break;
+    case "baz":
+        break;
+    }
+`
+
+function print(var) {
+    return `
+        switch (${var}) {
+            case "foo":
+            break;
+                    case "bar":
+                        break;
+        case "baz":
+            break;
+        }
+    `;
+}