react-native-codepad-lang-javascript 0.0.0-stage → 0.1.0

package/queries/javascript/indents.scm

@@ -0,0 +1,107 @@
+; inherited from ecma
+[
+  (arguments)
+  (array)
+  (binary_expression)
+  (class_body)
+  (export_clause)
+  (formal_parameters)
+  (named_imports)
+  (object)
+  (object_pattern)
+  (parenthesized_expression)
+  (return_statement)
+  (statement_block)
+  (switch_case)
+  (switch_default)
+  (switch_statement)
+  (template_substitution)
+  (ternary_expression)
+] @indent.begin
+
+(arguments
+  (call_expression) @indent.begin)
+
+(binary_expression
+  (call_expression) @indent.begin)
+
+(expression_statement
+  (call_expression) @indent.begin)
+
+(arrow_function
+  body: (_) @_body
+  (#not-kind-eq? @_body "statement_block")) @indent.begin
+
+(assignment_expression
+  right: (_) @_right
+  (#not-kind-eq? @_right "arrow_function")) @indent.begin
+
+(variable_declarator
+  value: (_) @_value
+  (#not-kind-eq? @_value "arrow_function" "call_expression")) @indent.begin
+
+(arguments
+  ")" @indent.end)
+
+(object
+  "}" @indent.end)
+
+(statement_block
+  "}" @indent.end)
+
+[
+  (arguments
+    (object))
+  ")"
+  "}"
+  "]"
+] @indent.branch
+
+(statement_block
+  "{" @indent.branch)
+
+((parenthesized_expression
+  "("
+  (_)
+  ")" @indent.end) @_outer
+  (#not-has-parent? @_outer if_statement))
+
+[
+  "}"
+  "]"
+] @indent.end
+
+(template_string) @indent.ignore
+
+[
+  (comment)
+  (ERROR)
+] @indent.auto
+
+(if_statement
+  consequence: (_) @indent.dedent
+  (#not-kind-eq? @indent.dedent statement_block)) @indent.begin
+
+; inherited from jsx
+[
+  (jsx_element)
+  (jsx_self_closing_element)
+  (jsx_expression)
+] @indent.begin
+
+(jsx_closing_element
+  ">" @indent.end)
+
+(jsx_self_closing_element
+  "/>" @indent.end)
+
+[
+  (jsx_closing_element)
+  ">"
+] @indent.branch
+
+; <button
+; />
+(jsx_self_closing_element
+  "/>" @indent.branch)
+

package/queries/javascript/injections.scm

@@ -0,0 +1,234 @@
+; inherited from ecma
+(((comment) @_jsdoc_comment
+  (#match? @_jsdoc_comment "^/[*][*][^*].*[*]/$")) @injection.content
+  (#set! injection.language "jsdoc"))
+
+((comment) @injection.content
+  (#set! injection.language "comment"))
+
+; html(`...`), html`...`, sql(`...`), etc.
+(call_expression
+  function: (identifier) @injection.language
+  arguments: [
+    (arguments
+      (template_string) @injection.content)
+    (template_string) @injection.content
+  ]
+  (#match? @injection.language "^[a-zA-Z][a-zA-Z0-9]*$")
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  ; Languages excluded from auto-injection due to special rules
+  ; - svg uses the html parser
+  ; - css uses the styled parser
+  (#not-any-of? @injection.language "svg" "css"))
+
+; svg`...` or svg(`...`)
+(call_expression
+  function: (identifier) @_name
+  (#eq? @_name "svg")
+  arguments: [
+    (arguments
+      (template_string) @injection.content)
+    (template_string) @injection.content
+  ]
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "html"))
+
+; Vercel PostgreSQL
+; foo.sql`...` or foo.sql(`...`)
+(call_expression
+  function: (member_expression
+    property: (property_identifier) @injection.language)
+  arguments: [
+    (arguments
+      (template_string) @injection.content)
+    (template_string) @injection.content
+  ]
+  (#eq? @injection.language "sql")
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children))
+
+; Sanity CMS GROQ query
+; defineQuery(`...`)
+(call_expression
+  function: (identifier) @_name
+  (#eq? @_name "defineQuery")
+  arguments: (arguments
+    (template_string) @injection.content)
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "groq"))
+
+; gql`...` or gql(`...`)
+(call_expression
+  function: (identifier) @_name
+  (#eq? @_name "gql")
+  arguments: [
+    (arguments
+      (template_string) @injection.content)
+    (template_string) @injection.content
+  ]
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "graphql"))
+
+(call_expression
+  function: (identifier) @_name
+  (#eq? @_name "hbs")
+  arguments: (template_string) @injection.content
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "glimmer"))
+
+; css`<css>`, keyframes`<css>`
+(call_expression
+  function: (identifier) @_name
+  (#any-of? @_name "css" "keyframes")
+  arguments: (template_string) @injection.content
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "styled"))
+
+; styled.div`<css>`
+(call_expression
+  function: (member_expression
+    object: (identifier) @_name
+    (#eq? @_name "styled"))
+  arguments: ((template_string) @injection.content
+    (#offset! @injection.content 0 1 0 -1)
+    (#set! injection.include-children)
+    (#set! injection.language "styled")))
+
+; styled(Component)`<css>`
+(call_expression
+  function: (call_expression
+    function: (identifier) @_name
+    (#eq? @_name "styled"))
+  arguments: ((template_string) @injection.content
+    (#offset! @injection.content 0 1 0 -1)
+    (#set! injection.include-children)
+    (#set! injection.language "styled")))
+
+; styled.div.attrs({ prop: "foo" })`<css>`
+(call_expression
+  function: (call_expression
+    function: (member_expression
+      object: (member_expression
+        object: (identifier) @_name
+        (#eq? @_name "styled"))))
+  arguments: ((template_string) @injection.content
+    (#offset! @injection.content 0 1 0 -1)
+    (#set! injection.include-children)
+    (#set! injection.language "styled")))
+
+; styled(Component).attrs({ prop: "foo" })`<css>`
+(call_expression
+  function: (call_expression
+    function: (member_expression
+      object: (call_expression
+        function: (identifier) @_name
+        (#eq? @_name "styled"))))
+  arguments: ((template_string) @injection.content
+    (#offset! @injection.content 0 1 0 -1)
+    (#set! injection.include-children)
+    (#set! injection.language "styled")))
+
+((regex_pattern) @injection.content
+  (#set! injection.language "regex"))
+
+; ((comment) @_gql_comment
+;   (#eq? @_gql_comment "/* GraphQL */")
+;   (template_string) @injection.content
+;   (#set! injection.language "graphql"))
+((template_string) @injection.content
+  (#match? @injection.content "^`#graphql")
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "graphql"))
+
+; el.innerHTML = `<html>`
+(assignment_expression
+  left: (member_expression
+    property: (property_identifier) @_prop
+    (#any-of? @_prop "outerHTML" "innerHTML"))
+  right: (template_string) @injection.content
+  (#offset! @injection.content 0 1 0 -1)
+  (#set! injection.include-children)
+  (#set! injection.language "html"))
+
+; el.innerHTML = '<html>'
+(assignment_expression
+  left: (member_expression
+    property: (property_identifier) @_prop
+    (#any-of? @_prop "outerHTML" "innerHTML"))
+  right: (string
+    (string_fragment) @injection.content)
+  (#set! injection.language "html"))
+
+;---- Angular injections -----
+; @Component({
+;   template: `<html>`
+; })
+(decorator
+  (call_expression
+    function: ((identifier) @_name
+      (#eq? @_name "Component"))
+    arguments: (arguments
+      (object
+        (pair
+          key: ((property_identifier) @_prop
+            (#eq? @_prop "template"))
+          value: ((template_string) @injection.content
+            (#offset! @injection.content 0 1 0 -1)
+            (#set! injection.include-children)
+            (#set! injection.language "angular")))))))
+
+; @Component({
+;   styles: [`<css>`]
+; })
+(decorator
+  (call_expression
+    function: ((identifier) @_name
+      (#eq? @_name "Component"))
+    arguments: (arguments
+      (object
+        (pair
+          key: ((property_identifier) @_prop
+            (#eq? @_prop "styles"))
+          value: (array
+            ((template_string) @injection.content
+              (#offset! @injection.content 0 1 0 -1)
+              (#set! injection.include-children)
+              (#set! injection.language "css"))))))))
+
+; @Component({
+;   styles: `<css>`
+; })
+(decorator
+  (call_expression
+    function: ((identifier) @_name
+      (#eq? @_name "Component"))
+    arguments: (arguments
+      (object
+        (pair
+          key: ((property_identifier) @_prop
+            (#eq? @_prop "styles"))
+          value: ((template_string) @injection.content
+            (#set! injection.include-children)
+            (#offset! @injection.content 0 1 0 -1)
+            (#set! injection.language "css")))))))
+
+; inherited from jsx
+; Styled Jsx <style jsx>
+(jsx_element
+  (jsx_opening_element
+    (identifier) @_name
+    (#eq? @_name "style")
+    (jsx_attribute) @_attr
+    (#eq? @_attr "jsx"))
+  (jsx_expression
+    ((template_string) @injection.content
+      (#set! injection.language "css"))
+    (#offset! @injection.content 0 1 0 -1)))
+

package/queries/javascript/locals.scm

@@ -0,0 +1,121 @@
+; inherited from ecma
+; Scopes
+;-------
+(statement_block) @local.scope
+
+(function_expression) @local.scope
+
+(arrow_function) @local.scope
+
+(function_declaration) @local.scope
+
+(method_definition) @local.scope
+
+(for_statement) @local.scope
+
+(for_in_statement) @local.scope
+
+(catch_clause) @local.scope
+
+; Definitions
+;------------
+(variable_declarator
+  name: (identifier) @local.definition.var)
+
+(variable_declarator
+  name: (object_pattern
+    (shorthand_property_identifier_pattern) @local.definition.var))
+
+(variable_declarator
+  (object_pattern
+    (pair_pattern
+      (identifier) @local.definition.var)))
+
+(import_specifier
+  (identifier) @local.definition.import)
+
+(namespace_import
+  (identifier) @local.definition.import)
+
+(function_declaration
+  (identifier) @local.definition.function
+  (#set! definition.var.scope parent))
+
+(method_definition
+  (property_identifier) @local.definition.function
+  (#set! definition.var.scope parent))
+
+; References
+;------------
+(identifier) @local.reference
+
+(shorthand_property_identifier) @local.reference
+
+
+; Both properties are matched here.
+;
+;   class Foo {
+;     this.#bar = "baz";
+;     this.quuz = "qux";
+;   }
+(field_definition
+  property: [
+    (property_identifier)
+    (private_property_identifier)
+  ] @local.definition.var)
+
+; this.foo = "bar"
+(assignment_expression
+  left: (member_expression
+    object: (this)
+    property: (property_identifier) @local.definition.var))
+
+(formal_parameters
+  (identifier) @local.definition.parameter)
+
+; function(arg = []) {
+(formal_parameters
+  (assignment_pattern
+    left: (identifier) @local.definition.parameter))
+
+; x => x
+(arrow_function
+  parameter: (identifier) @local.definition.parameter)
+
+; ({ a }) => null
+(formal_parameters
+  (object_pattern
+    (shorthand_property_identifier_pattern) @local.definition.parameter))
+
+; ({ a: b }) => null
+(formal_parameters
+  (object_pattern
+    (pair_pattern
+      value: (identifier) @local.definition.parameter)))
+
+; ([ a ]) => null
+(formal_parameters
+  (array_pattern
+    (identifier) @local.definition.parameter))
+
+(formal_parameters
+  (rest_pattern
+    (identifier) @local.definition.parameter))
+
+; Both methods are matched here.
+;
+;   class Foo {
+;     #bar(x) { x }
+;     baz(y) { y }
+;   }
+(method_definition
+  [
+    (property_identifier)
+    (private_property_identifier)
+  ] @local.definition.function
+  (#set! definition.var.scope parent))
+
+; this.foo()
+(member_expression
+  object: (this)
+  property: (property_identifier) @local.reference)

package/src/index.ts

@@ -0,0 +1 @@
+export const javascript = 'javascript' as const;