jsx.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. // CodeMirror, copyright (c) by Marijn Haverbeke and others
  2. // Distributed under an MIT license: https://codemirror.net/LICENSE
  3. (function(mod) {
  4. if (typeof exports == "object" && typeof module == "object") // CommonJS
  5. mod(require("../../lib/codemirror"), require("../xml/xml"), require("../javascript/javascript"))
  6. else if (typeof define == "function" && define.amd) // AMD
  7. define(["../../lib/codemirror", "../xml/xml", "../javascript/javascript"], mod)
  8. else // Plain browser env
  9. mod(CodeMirror)
  10. })(function(CodeMirror) {
  11. "use strict"
  12. // Depth means the amount of open braces in JS context, in XML
  13. // context 0 means not in tag, 1 means in tag, and 2 means in tag
  14. // and js block comment.
  15. function Context(state, mode, depth, prev) {
  16. this.state = state; this.mode = mode; this.depth = depth; this.prev = prev
  17. }
  18. function copyContext(context) {
  19. return new Context(CodeMirror.copyState(context.mode, context.state),
  20. context.mode,
  21. context.depth,
  22. context.prev && copyContext(context.prev))
  23. }
  24. CodeMirror.defineMode("jsx", function(config, modeConfig) {
  25. var xmlMode = CodeMirror.getMode(config, {name: "xml", allowMissing: true, multilineTagIndentPastTag: false, allowMissingTagName: true})
  26. var jsMode = CodeMirror.getMode(config, modeConfig && modeConfig.base || "javascript")
  27. function flatXMLIndent(state) {
  28. var tagName = state.tagName
  29. state.tagName = null
  30. var result = xmlMode.indent(state, "", "")
  31. state.tagName = tagName
  32. return result
  33. }
  34. function token(stream, state) {
  35. if (state.context.mode == xmlMode)
  36. return xmlToken(stream, state, state.context)
  37. else
  38. return jsToken(stream, state, state.context)
  39. }
  40. function xmlToken(stream, state, cx) {
  41. if (cx.depth == 2) { // Inside a JS /* */ comment
  42. if (stream.match(/^.*?\*\//)) cx.depth = 1
  43. else stream.skipToEnd()
  44. return "comment"
  45. }
  46. if (stream.peek() == "{") {
  47. xmlMode.skipAttribute(cx.state)
  48. var indent = flatXMLIndent(cx.state), xmlContext = cx.state.context
  49. // If JS starts on same line as tag
  50. if (xmlContext && stream.match(/^[^>]*>\s*$/, false)) {
  51. while (xmlContext.prev && !xmlContext.startOfLine)
  52. xmlContext = xmlContext.prev
  53. // If tag starts the line, use XML indentation level
  54. if (xmlContext.startOfLine) indent -= config.indentUnit
  55. // Else use JS indentation level
  56. else if (cx.prev.state.lexical) indent = cx.prev.state.lexical.indented
  57. // Else if inside of tag
  58. } else if (cx.depth == 1) {
  59. indent += config.indentUnit
  60. }
  61. state.context = new Context(CodeMirror.startState(jsMode, indent),
  62. jsMode, 0, state.context)
  63. return null
  64. }
  65. if (cx.depth == 1) { // Inside of tag
  66. if (stream.peek() == "<") { // Tag inside of tag
  67. xmlMode.skipAttribute(cx.state)
  68. state.context = new Context(CodeMirror.startState(xmlMode, flatXMLIndent(cx.state)),
  69. xmlMode, 0, state.context)
  70. return null
  71. } else if (stream.match("//")) {
  72. stream.skipToEnd()
  73. return "comment"
  74. } else if (stream.match("/*")) {
  75. cx.depth = 2
  76. return token(stream, state)
  77. }
  78. }
  79. var style = xmlMode.token(stream, cx.state), cur = stream.current(), stop
  80. if (/\btag\b/.test(style)) {
  81. if (/>$/.test(cur)) {
  82. if (cx.state.context) cx.depth = 0
  83. else state.context = state.context.prev
  84. } else if (/^</.test(cur)) {
  85. cx.depth = 1
  86. }
  87. } else if (!style && (stop = cur.indexOf("{")) > -1) {
  88. stream.backUp(cur.length - stop)
  89. }
  90. return style
  91. }
  92. function jsToken(stream, state, cx) {
  93. if (stream.peek() == "<" && jsMode.expressionAllowed(stream, cx.state)) {
  94. state.context = new Context(CodeMirror.startState(xmlMode, jsMode.indent(cx.state, "", "")),
  95. xmlMode, 0, state.context)
  96. jsMode.skipExpression(cx.state)
  97. return null
  98. }
  99. var style = jsMode.token(stream, cx.state)
  100. if (!style && cx.depth != null) {
  101. var cur = stream.current()
  102. if (cur == "{") {
  103. cx.depth++
  104. } else if (cur == "}") {
  105. if (--cx.depth == 0) state.context = state.context.prev
  106. }
  107. }
  108. return style
  109. }
  110. return {
  111. startState: function() {
  112. return {context: new Context(CodeMirror.startState(jsMode), jsMode)}
  113. },
  114. copyState: function(state) {
  115. return {context: copyContext(state.context)}
  116. },
  117. token: token,
  118. indent: function(state, textAfter, fullLine) {
  119. return state.context.mode.indent(state.context.state, textAfter, fullLine)
  120. },
  121. innerMode: function(state) {
  122. return state.context
  123. }
  124. }
  125. }, "xml", "javascript")
  126. CodeMirror.defineMIME("text/jsx", "jsx")
  127. CodeMirror.defineMIME("text/typescript-jsx", {name: "jsx", base: {name: "javascript", typescript: true}})
  128. });