Add two typescript-ts-mode faces (bug#62429)

* lisp/progmodes/typescript-ts-mode.el:
(typescript-ts-mode-jsx-tag-face)
(typescript-ts-mode-jsx-attribute-face): New faces.
(typescript-ts-mode--font-lock-settings): Use new faces.
(tsx-ts-mode): Mention the new faces in the docstring.

diff --git a/lisp/progmodes/typescript-ts-mode.el b/lisp/progmodes/typescript-ts-mode.el
index a9ca85d5d351597a2cc0ac243ec73e660f530121..23815c7990643ac6effdc0f7b6ad7d833b65c721 100644 (file)
--- a/lisp/progmodes/typescript-ts-mode.el
+++ b/lisp/progmodes/typescript-ts-mode.el
@@ -41,6 +41,16 @@
   :safe 'integerp
   :group 'typescript)
 
+(defface typescript-ts-jsx-tag-face
+  '((t . (:inherit font-lock-function-call-face)))
+  "Face for HTML tags like <div> and <p> in JSX."
+  :group 'typescript)
+
+(defface typescript-ts-jsx-attribute-face
+  '((t . (:inherit font-lock-constant-face)))
+  "Face for HTML attributes like name and id in JSX."
+  :group 'typescript)
+
 (defvar typescript-ts-mode--syntax-table
   (let ((table (make-syntax-table)))
     ;; Taken from the cc-langs version
@@ -284,17 +294,17 @@ Argument LANGUAGE is either `typescript' or `tsx'."
    :feature 'jsx
    `((jsx_opening_element
       [(nested_identifier (identifier)) (identifier)]
-      @font-lock-function-call-face)
+      @typescript-ts-jsx-tag-face)
 
      (jsx_closing_element
       [(nested_identifier (identifier)) (identifier)]
-      @font-lock-function-call-face)
+      @typescript-ts-jsx-tag-face)
 
      (jsx_self_closing_element
       [(nested_identifier (identifier)) (identifier)]
-      @font-lock-function-call-face)
+      @typescript-ts-jsx-tag-face)
 
-     (jsx_attribute (property_identifier) @font-lock-constant-face))
+     (jsx_attribute (property_identifier) @typescript-ts-jsx-attribute-face))
 
    :language language
    :feature 'number
@@ -381,7 +391,12 @@ Argument LANGUAGE is either `typescript' or `tsx'."
 
 ;;;###autoload
 (define-derived-mode tsx-ts-mode typescript-ts-base-mode "TypeScript[TSX]"
-  "Major mode for editing TypeScript."
+  "Major mode for editing TSX and JSX documents.
+
+This major mode defines two additional JSX-specific faces:
+`typescript-ts-jsx-attribute-face' and
+`typescript-ts-jsx-attribute-face' that are used for HTML tags
+and attributes, respectively."
   :group 'typescript
   :syntax-table typescript-ts-mode--syntax-table