From 23bc8258ad90da58888dc782101e1504eb82d9db Mon Sep 17 00:00:00 2001
From: Alexandre Borela <alexandre.borela@gmail.com>
Date: Sun, 18 Feb 2018 21:37:18 -0300
Subject: [PATCH 1/3] [CSS3] Cleanup

---
 syntaxes/css3/ruleset/block-content.sublime-syntax | 3 +++
 syntaxes/css3/ruleset/block.sublime-syntax         | 6 ++----
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/syntaxes/css3/ruleset/block-content.sublime-syntax b/syntaxes/css3/ruleset/block-content.sublime-syntax
index 9544de42..c40c03c4 100644
--- a/syntaxes/css3/ruleset/block-content.sublime-syntax
+++ b/syntaxes/css3/ruleset/block-content.sublime-syntax
@@ -19,6 +19,9 @@ scope: ...
 
 contexts:
   main:
+    - match: ;
+      scope: punctuation.terminator.css.css3
+      pop: true
     - match: ""
       set: [ delimiter, property ]
 
diff --git a/syntaxes/css3/ruleset/block.sublime-syntax b/syntaxes/css3/ruleset/block.sublime-syntax
index 0a54ac63..d3b66799 100644
--- a/syntaxes/css3/ruleset/block.sublime-syntax
+++ b/syntaxes/css3/ruleset/block.sublime-syntax
@@ -26,7 +26,7 @@ contexts:
   comment-no-pop:
     - include: Packages/Naomi/syntaxes/css3/comment.no-pop.sublime-syntax
 
-  declaration:
+  content:
     - include: Packages/Naomi/syntaxes/css3/ruleset/block-content.sublime-syntax
 
   delimiter:
@@ -35,7 +35,5 @@ contexts:
     - match: \}
       scope: punctuation.section.property-list.end.css.css3
       pop: true
-    - match: ;
-      scope: punctuation.terminator.css.css3
     - match: (?=\S)
-      push: declaration
+      push: content

From db1f061a4de66b87b34177bb1d8643bb29b42e66 Mon Sep 17 00:00:00 2001
From: Alexandre Borela <alexandre.borela@gmail.com>
Date: Sun, 18 Feb 2018 21:37:36 -0300
Subject: [PATCH 2/3] [FJSX15] Add basic support for styled components

---
 .../literal/string/template.sublime-syntax    | 62 ++++++++++++++++---
 1 file changed, 53 insertions(+), 9 deletions(-)

diff --git a/syntaxes/fjsx15/literal/string/template.sublime-syntax b/syntaxes/fjsx15/literal/string/template.sublime-syntax
index 730c2987..e1f0e51e 100644
--- a/syntaxes/fjsx15/literal/string/template.sublime-syntax
+++ b/syntaxes/fjsx15/literal/string/template.sublime-syntax
@@ -39,16 +39,25 @@ variables:
 
 contexts:
   main:
-    - match: (?xi)({{commonIdentifier}})?\s*(\`)
-      captures:
-        1: entity.name.function.tag.js.fjsx15
-        2: punctuation.definition.string.begin.js.fjsx15
+    # Styled components.
+    - match: styled(?=\s*[.\(])
+      scope: support.function.styled-component.js.fjsx15
+      set: [ meta-styled-component, styled-component ]
+    # Simple tag.
+    - match: (?xi){{commonIdentifier}}(?=\s*\`)
+      scope: entity.name.function.tag.js.fjsx15
+      pop: true
+    # Simple template string.
+    - match: \`
+      scope: punctuation.definition.string.begin.js.fjsx15
+      with_prototype:
+        - include: embedded-expression
       set: string
 
   close-embedded-expression:
     - clear_scopes: true
     - meta_scope: >-
-        source.js.fjsx15
+        source.js
         meta.template-expression.js.fjsx15
     - match: \}
       scope: punctuation.definition.template-expression.end.js.fjsx15
@@ -57,6 +66,45 @@ contexts:
   embedded-content:
     - include: Packages/Naomi/syntaxes/fjsx15/optional-expression.sublime-syntax
 
+  embedded-expression:
+    # Embedded expression.
+    - match: \$\{
+      scope: punctuation.definition.template-expression.begin.js.fjsx15
+      push: [ close-embedded-expression, embedded-content ]
+
+  meta-styled-component:
+    - meta_scope: meta.styled-component.js.fjsx15
+    - include: pop-now
+
+  pop-now:
+    - match: ""
+      pop: true
+
+  styled-component:
+    # Actual styled component code.
+    - match: \`
+      scope: punctuation.definition.template-expression.begin.js.fjsx15
+      set: styled-component-content
+    # Sub properties or function calls after “styled”.
+    - match: (?=\S)
+      push:
+        - include: Packages/Naomi/syntaxes/fjsx15/comment.sublime-syntax
+        - include: Packages/Naomi/syntaxes/fjsx15/expression.sublime-syntax
+
+  styled-component-content:
+    - clear_scopes: true
+    - meta_scope: source.css
+    - match: \`
+      scope: punctuation.definition.template-expression.end.js.fjsx15
+      pop: true
+    - include: Packages/Naomi/syntaxes/css3/comment.no-pop.sublime-syntax
+    - match: (?=\S)
+      push:
+        - include: Packages/Naomi/syntaxes/css3/ruleset/block-content.sublime-syntax
+      # with_prototype:
+      #   - match: (?=`)
+      #     pop: true
+
   string:
     - meta_scope: string.template.js.fjsx15
     # Close.
@@ -66,7 +114,3 @@ contexts:
     # Escape.
     - match: (?xi){{escapeSequences}}
       scope: constant.character.escape.js.fjsx15
-    # Embedded expression.
-    - match: \$\{
-      scope: punctuation.definition.template-expression.begin.js.fjsx15
-      push: [ close-embedded-expression, embedded-content ]

From a253b031d20fb7f0a4dd2bec39efef0e4d5dd09c Mon Sep 17 00:00:00 2001
From: Alexandre Borela <alexandre.borela@gmail.com>
Date: Mon, 19 Feb 2018 01:33:29 -0300
Subject: [PATCH 3/3] [FJSX15] Extract styled component to its own file

---
 syntaxes/fjsx15/literal.sublime-syntax        |   1 +
 .../string/styled-component.sublime-syntax    | 114 ++++++++++++++++++
 .../literal/string/template.sublime-syntax    |  38 ------
 3 files changed, 115 insertions(+), 38 deletions(-)
 create mode 100644 syntaxes/fjsx15/literal/string/styled-component.sublime-syntax

diff --git a/syntaxes/fjsx15/literal.sublime-syntax b/syntaxes/fjsx15/literal.sublime-syntax
index 818dabae..e013c5cf 100644
--- a/syntaxes/fjsx15/literal.sublime-syntax
+++ b/syntaxes/fjsx15/literal.sublime-syntax
@@ -24,5 +24,6 @@ contexts:
     - include: Packages/Naomi/syntaxes/fjsx15/literal/object.sublime-syntax
     - include: Packages/Naomi/syntaxes/fjsx15/literal/string/double-quoted.sublime-syntax
     - include: Packages/Naomi/syntaxes/fjsx15/literal/string/single-quoted.sublime-syntax
+    - include: Packages/Naomi/syntaxes/fjsx15/literal/string/styled-component.sublime-syntax
     - include: Packages/Naomi/syntaxes/fjsx15/literal/string/template.sublime-syntax
     - include: Packages/Naomi/syntaxes/fjsx15/literal/string/regex.sublime-syntax
diff --git a/syntaxes/fjsx15/literal/string/styled-component.sublime-syntax b/syntaxes/fjsx15/literal/string/styled-component.sublime-syntax
new file mode 100644
index 00000000..4a894e3f
--- /dev/null
+++ b/syntaxes/fjsx15/literal/string/styled-component.sublime-syntax
@@ -0,0 +1,114 @@
+%YAML1.2
+---
+
+# Licensed under the Apache License, Version 2.0 (the “License”); you may not
+# use this file except in compliance with the License. You may obtain a copy of
+# the License at
+#
+#     http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an “AS IS” BASIS, WITHOUT
+# WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+# License for the specific language governing permissions and limitations under
+# the License.
+
+hidden: true
+
+scope: ...
+
+variables:
+  commonIdentifier: |
+    [$_[:alpha:]]
+    [$_[:alnum:]]*
+
+  hexEscapedChar: |
+    x[a-f0-9]{2}
+
+  unicodeEscapedChar: |
+    (?> u[a-f0-9]{4}
+      | u\{[a-f0-9]+\}
+    )
+
+  escapeSequences: |
+    \\
+    (?> [`\\$bfnrtv]
+      | {{hexEscapedChar}}
+      | {{unicodeEscapedChar}}
+    )
+
+contexts:
+  main:
+    - match: styled(?=\s*[.\(])
+      scope: support.function.styled-component.js.fjsx15
+      set: [ meta-styled-component, styled-component ]
+
+  comment-no-pop:
+    - include: Packages/Naomi/syntaxes/css3/comment.no-pop.sublime-syntax
+
+  delimiter:
+    - include: comment-no-pop
+    - match: ":"
+      scope: punctuation.separator.key-value.css.css3
+      set: [ meta-property-value, optional-value-no-pop ]
+
+  embedded-expression:
+    - include: Packages/Naomi/syntaxes/fjsx15/literal/string/template.sublime-syntax#embedded-expression
+
+  meta-property-value:
+    - meta_scope: meta.property-value.css.css3
+    - include: pop-now
+
+  meta-styled-component:
+    - meta_scope: meta.styled-component.js.fjsx15
+    - include: pop-now
+
+  optional-value-no-pop:
+    - match: (?=[;()\[\]{}])
+      pop: true
+    - match: \,
+      scope: punctuation.separator.sequence.css.css3
+    - include: embedded-expression
+    - match: (?=\S)
+      push:
+        - include: Packages/Naomi/syntaxes/css3/value.sublime-syntax
+
+  pop-now:
+    - match: ""
+      pop: true
+
+  property:
+    - include: comment-no-pop
+    - include: Packages/Naomi/syntaxes/css3/property.sublime-syntax
+
+  styled-component:
+    # Actual styled component code.
+    - match: \`
+      scope: punctuation.definition.template-expression.begin.js.fjsx15
+      set: styled-component-content
+    # Sub properties or function calls after “styled”.
+    - match: (?=\S)
+      push:
+        - include: Packages/Naomi/syntaxes/fjsx15/comment.sublime-syntax
+        - include: Packages/Naomi/syntaxes/fjsx15/expression.sublime-syntax
+
+  styled-component-content:
+    - clear_scopes: true
+    - meta_content_scope: source.css
+    - include: comment-no-pop
+    # Close.
+    - match: \`
+      scope: punctuation.definition.template-expression.end.js.fjsx15
+      pop: true
+    - match: ;
+      scope: punctuation.terminator.css.css3
+    - include: embedded-expression
+    - match: (?=\S)
+      push: [ delimiter, property ]
+
+      # push: [ delimiter, property ]
+      # push:
+      #   - include: PackaVkes/Naomi/syntaxes/css3/ruleset/block-content.sublime-syntax
+      # with_prototype:
+      #   - match: (?=`)
+      #     pop: true
diff --git a/syntaxes/fjsx15/literal/string/template.sublime-syntax b/syntaxes/fjsx15/literal/string/template.sublime-syntax
index e1f0e51e..092f5e6b 100644
--- a/syntaxes/fjsx15/literal/string/template.sublime-syntax
+++ b/syntaxes/fjsx15/literal/string/template.sublime-syntax
@@ -39,10 +39,6 @@ variables:
 
 contexts:
   main:
-    # Styled components.
-    - match: styled(?=\s*[.\(])
-      scope: support.function.styled-component.js.fjsx15
-      set: [ meta-styled-component, styled-component ]
     # Simple tag.
     - match: (?xi){{commonIdentifier}}(?=\s*\`)
       scope: entity.name.function.tag.js.fjsx15
@@ -67,44 +63,10 @@ contexts:
     - include: Packages/Naomi/syntaxes/fjsx15/optional-expression.sublime-syntax
 
   embedded-expression:
-    # Embedded expression.
     - match: \$\{
       scope: punctuation.definition.template-expression.begin.js.fjsx15
       push: [ close-embedded-expression, embedded-content ]
 
-  meta-styled-component:
-    - meta_scope: meta.styled-component.js.fjsx15
-    - include: pop-now
-
-  pop-now:
-    - match: ""
-      pop: true
-
-  styled-component:
-    # Actual styled component code.
-    - match: \`
-      scope: punctuation.definition.template-expression.begin.js.fjsx15
-      set: styled-component-content
-    # Sub properties or function calls after “styled”.
-    - match: (?=\S)
-      push:
-        - include: Packages/Naomi/syntaxes/fjsx15/comment.sublime-syntax
-        - include: Packages/Naomi/syntaxes/fjsx15/expression.sublime-syntax
-
-  styled-component-content:
-    - clear_scopes: true
-    - meta_scope: source.css
-    - match: \`
-      scope: punctuation.definition.template-expression.end.js.fjsx15
-      pop: true
-    - include: Packages/Naomi/syntaxes/css3/comment.no-pop.sublime-syntax
-    - match: (?=\S)
-      push:
-        - include: Packages/Naomi/syntaxes/css3/ruleset/block-content.sublime-syntax
-      # with_prototype:
-      #   - match: (?=`)
-      #     pop: true
-
   string:
     - meta_scope: string.template.js.fjsx15
     # Close.