mode-scss.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565
  1. ace.define("ace/mode/scss_highlight_rules",["require","exports","module","ace/lib/oop","ace/lib/lang","ace/mode/text_highlight_rules"], function(require, exports, module) {
  2. "use strict";
  3. var oop = require("../lib/oop");
  4. var lang = require("../lib/lang");
  5. var TextHighlightRules = require("./text_highlight_rules").TextHighlightRules;
  6. var ScssHighlightRules = function() {
  7. var properties = lang.arrayToMap( (function () {
  8. var browserPrefix = ("-webkit-|-moz-|-o-|-ms-|-svg-|-pie-|-khtml-").split("|");
  9. var prefixProperties = ("appearance|background-clip|background-inline-policy|background-origin|" +
  10. "background-size|binding|border-bottom-colors|border-left-colors|" +
  11. "border-right-colors|border-top-colors|border-end|border-end-color|" +
  12. "border-end-style|border-end-width|border-image|border-start|" +
  13. "border-start-color|border-start-style|border-start-width|box-align|" +
  14. "box-direction|box-flex|box-flexgroup|box-ordinal-group|box-orient|" +
  15. "box-pack|box-sizing|column-count|column-gap|column-width|column-rule|" +
  16. "column-rule-width|column-rule-style|column-rule-color|float-edge|" +
  17. "font-feature-settings|font-language-override|force-broken-image-icon|" +
  18. "image-region|margin-end|margin-start|opacity|outline|outline-color|" +
  19. "outline-offset|outline-radius|outline-radius-bottomleft|" +
  20. "outline-radius-bottomright|outline-radius-topleft|outline-radius-topright|" +
  21. "outline-style|outline-width|padding-end|padding-start|stack-sizing|" +
  22. "tab-size|text-blink|text-decoration-color|text-decoration-line|" +
  23. "text-decoration-style|transform|transform-origin|transition|" +
  24. "transition-delay|transition-duration|transition-property|" +
  25. "transition-timing-function|user-focus|user-input|user-modify|user-select|" +
  26. "window-shadow|border-radius").split("|");
  27. var properties = ("azimuth|background-attachment|background-color|background-image|" +
  28. "background-position|background-repeat|background|border-bottom-color|" +
  29. "border-bottom-style|border-bottom-width|border-bottom|border-collapse|" +
  30. "border-color|border-left-color|border-left-style|border-left-width|" +
  31. "border-left|border-right-color|border-right-style|border-right-width|" +
  32. "border-right|border-spacing|border-style|border-top-color|" +
  33. "border-top-style|border-top-width|border-top|border-width|border|bottom|" +
  34. "box-shadow|box-sizing|caption-side|clear|clip|color|content|counter-increment|" +
  35. "counter-reset|cue-after|cue-before|cue|cursor|direction|display|" +
  36. "elevation|empty-cells|float|font-family|font-size-adjust|font-size|" +
  37. "font-stretch|font-style|font-variant|font-weight|font|height|left|" +
  38. "letter-spacing|line-height|list-style-image|list-style-position|" +
  39. "list-style-type|list-style|margin-bottom|margin-left|margin-right|" +
  40. "margin-top|marker-offset|margin|marks|max-height|max-width|min-height|" +
  41. "min-width|opacity|orphans|outline-color|" +
  42. "outline-style|outline-width|outline|overflow|overflow-x|overflow-y|padding-bottom|" +
  43. "padding-left|padding-right|padding-top|padding|page-break-after|" +
  44. "page-break-before|page-break-inside|page|pause-after|pause-before|" +
  45. "pause|pitch-range|pitch|play-during|position|quotes|richness|right|" +
  46. "size|speak-header|speak-numeral|speak-punctuation|speech-rate|speak|" +
  47. "stress|table-layout|text-align|text-decoration|text-indent|" +
  48. "text-shadow|text-transform|top|unicode-bidi|vertical-align|" +
  49. "visibility|voice-family|volume|white-space|widows|width|word-spacing|" +
  50. "z-index").split("|");
  51. var ret = [];
  52. for (var i=0, ln=browserPrefix.length; i<ln; i++) {
  53. Array.prototype.push.apply(
  54. ret,
  55. (( browserPrefix[i] + prefixProperties.join("|" + browserPrefix[i]) ).split("|"))
  56. );
  57. }
  58. Array.prototype.push.apply(ret, prefixProperties);
  59. Array.prototype.push.apply(ret, properties);
  60. return ret;
  61. })() );
  62. var functions = lang.arrayToMap(
  63. ("hsl|hsla|rgb|rgba|url|attr|counter|counters|abs|adjust_color|adjust_hue|" +
  64. "alpha|join|blue|ceil|change_color|comparable|complement|darken|desaturate|" +
  65. "floor|grayscale|green|hue|if|invert|join|length|lighten|lightness|mix|" +
  66. "nth|opacify|opacity|percentage|quote|red|round|saturate|saturation|" +
  67. "scale_color|transparentize|type_of|unit|unitless|unqoute").split("|")
  68. );
  69. var constants = lang.arrayToMap(
  70. ("absolute|all-scroll|always|armenian|auto|baseline|below|bidi-override|" +
  71. "block|bold|bolder|border-box|both|bottom|break-all|break-word|capitalize|center|" +
  72. "char|circle|cjk-ideographic|col-resize|collapse|content-box|crosshair|dashed|" +
  73. "decimal-leading-zero|decimal|default|disabled|disc|" +
  74. "distribute-all-lines|distribute-letter|distribute-space|" +
  75. "distribute|dotted|double|e-resize|ellipsis|fixed|georgian|groove|" +
  76. "hand|hebrew|help|hidden|hiragana-iroha|hiragana|horizontal|" +
  77. "ideograph-alpha|ideograph-numeric|ideograph-parenthesis|" +
  78. "ideograph-space|inactive|inherit|inline-block|inline|inset|inside|" +
  79. "inter-ideograph|inter-word|italic|justify|katakana-iroha|katakana|" +
  80. "keep-all|left|lighter|line-edge|line-through|line|list-item|loose|" +
  81. "lower-alpha|lower-greek|lower-latin|lower-roman|lowercase|lr-tb|ltr|" +
  82. "medium|middle|move|n-resize|ne-resize|newspaper|no-drop|no-repeat|" +
  83. "nw-resize|none|normal|not-allowed|nowrap|oblique|outset|outside|" +
  84. "overline|pointer|progress|relative|repeat-x|repeat-y|repeat|right|" +
  85. "ridge|row-resize|rtl|s-resize|scroll|se-resize|separate|small-caps|" +
  86. "solid|square|static|strict|super|sw-resize|table-footer-group|" +
  87. "table-header-group|tb-rl|text-bottom|text-top|text|thick|thin|top|" +
  88. "transparent|underline|upper-alpha|upper-latin|upper-roman|uppercase|" +
  89. "vertical-ideographic|vertical-text|visible|w-resize|wait|whitespace|" +
  90. "zero").split("|")
  91. );
  92. var colors = lang.arrayToMap(
  93. ("aqua|black|blue|fuchsia|gray|green|lime|maroon|navy|olive|orange|" +
  94. "purple|red|silver|teal|white|yellow").split("|")
  95. );
  96. var keywords = lang.arrayToMap(
  97. ("@mixin|@extend|@include|@import|@media|@debug|@warn|@if|@for|@each|@while|@else|@font-face|@-webkit-keyframes|if|and|!default|module|def|end|declare").split("|")
  98. )
  99. var tags = lang.arrayToMap(
  100. ("a|abbr|acronym|address|applet|area|article|aside|audio|b|base|basefont|bdo|" +
  101. "big|blockquote|body|br|button|canvas|caption|center|cite|code|col|colgroup|" +
  102. "command|datalist|dd|del|details|dfn|dir|div|dl|dt|em|embed|fieldset|" +
  103. "figcaption|figure|font|footer|form|frame|frameset|h1|h2|h3|h4|h5|h6|head|" +
  104. "header|hgroup|hr|html|i|iframe|img|input|ins|keygen|kbd|label|legend|li|" +
  105. "link|map|mark|menu|meta|meter|nav|noframes|noscript|object|ol|optgroup|" +
  106. "option|output|p|param|pre|progress|q|rp|rt|ruby|s|samp|script|section|select|" +
  107. "small|source|span|strike|strong|style|sub|summary|sup|table|tbody|td|" +
  108. "textarea|tfoot|th|thead|time|title|tr|tt|u|ul|var|video|wbr|xmp").split("|")
  109. );
  110. var numRe = "\\-?(?:(?:[0-9]+)|(?:[0-9]*\\.[0-9]+))";
  111. this.$rules = {
  112. "start" : [
  113. {
  114. token : "comment",
  115. regex : "\\/\\/.*$"
  116. },
  117. {
  118. token : "comment", // multi line comment
  119. regex : "\\/\\*",
  120. next : "comment"
  121. }, {
  122. token : "string", // single line
  123. regex : '["](?:(?:\\\\.)|(?:[^"\\\\]))*?["]'
  124. }, {
  125. token : "string", // multi line string start
  126. regex : '["].*\\\\$',
  127. next : "qqstring"
  128. }, {
  129. token : "string", // single line
  130. regex : "['](?:(?:\\\\.)|(?:[^'\\\\]))*?[']"
  131. }, {
  132. token : "string", // multi line string start
  133. regex : "['].*\\\\$",
  134. next : "qstring"
  135. }, {
  136. token : "constant.numeric",
  137. regex : numRe + "(?:em|ex|px|cm|mm|in|pt|pc|deg|rad|grad|ms|s|hz|khz|%)"
  138. }, {
  139. token : "constant.numeric", // hex6 color
  140. regex : "#[a-f0-9]{6}"
  141. }, {
  142. token : "constant.numeric", // hex3 color
  143. regex : "#[a-f0-9]{3}"
  144. }, {
  145. token : "constant.numeric",
  146. regex : numRe
  147. }, {
  148. token : ["support.function", "string", "support.function"],
  149. regex : "(url\\()(.*)(\\))"
  150. }, {
  151. token : function(value) {
  152. if (properties.hasOwnProperty(value.toLowerCase()))
  153. return "support.type";
  154. if (keywords.hasOwnProperty(value))
  155. return "keyword";
  156. else if (constants.hasOwnProperty(value))
  157. return "constant.language";
  158. else if (functions.hasOwnProperty(value))
  159. return "support.function";
  160. else if (colors.hasOwnProperty(value.toLowerCase()))
  161. return "support.constant.color";
  162. else if (tags.hasOwnProperty(value.toLowerCase()))
  163. return "variable.language";
  164. else
  165. return "text";
  166. },
  167. regex : "\\-?[@a-z_][@a-z0-9_\\-]*"
  168. }, {
  169. token : "variable",
  170. regex : "[a-z_\\-$][a-z0-9_\\-$]*\\b"
  171. }, {
  172. token: "variable.language",
  173. regex: "#[a-z0-9-_]+"
  174. }, {
  175. token: "variable.language",
  176. regex: "\\.[a-z0-9-_]+"
  177. }, {
  178. token: "variable.language",
  179. regex: ":[a-z0-9-_]+"
  180. }, {
  181. token: "constant",
  182. regex: "[a-z0-9-_]+"
  183. }, {
  184. token : "keyword.operator",
  185. regex : "<|>|<=|>=|==|!=|-|%|#|\\+|\\$|\\+|\\*"
  186. }, {
  187. token : "paren.lparen",
  188. regex : "[[({]"
  189. }, {
  190. token : "paren.rparen",
  191. regex : "[\\])}]"
  192. }, {
  193. token : "text",
  194. regex : "\\s+"
  195. }, {
  196. caseInsensitive: true
  197. }
  198. ],
  199. "comment" : [
  200. {
  201. token : "comment", // closing comment
  202. regex : ".*?\\*\\/",
  203. next : "start"
  204. }, {
  205. token : "comment", // comment spanning whole line
  206. regex : ".+"
  207. }
  208. ],
  209. "qqstring" : [
  210. {
  211. token : "string",
  212. regex : '(?:(?:\\\\.)|(?:[^"\\\\]))*?"',
  213. next : "start"
  214. }, {
  215. token : "string",
  216. regex : '.+'
  217. }
  218. ],
  219. "qstring" : [
  220. {
  221. token : "string",
  222. regex : "(?:(?:\\\\.)|(?:[^'\\\\]))*?'",
  223. next : "start"
  224. }, {
  225. token : "string",
  226. regex : '.+'
  227. }
  228. ]
  229. };
  230. };
  231. oop.inherits(ScssHighlightRules, TextHighlightRules);
  232. exports.ScssHighlightRules = ScssHighlightRules;
  233. });
  234. ace.define("ace/mode/matching_brace_outdent",["require","exports","module","ace/range"], function(require, exports, module) {
  235. "use strict";
  236. var Range = require("../range").Range;
  237. var MatchingBraceOutdent = function() {};
  238. (function() {
  239. this.checkOutdent = function(line, input) {
  240. if (! /^\s+$/.test(line))
  241. return false;
  242. return /^\s*\}/.test(input);
  243. };
  244. this.autoOutdent = function(doc, row) {
  245. var line = doc.getLine(row);
  246. var match = line.match(/^(\s*\})/);
  247. if (!match) return 0;
  248. var column = match[1].length;
  249. var openBracePos = doc.findMatchingBracket({row: row, column: column});
  250. if (!openBracePos || openBracePos.row == row) return 0;
  251. var indent = this.$getIndent(doc.getLine(openBracePos.row));
  252. doc.replace(new Range(row, 0, row, column-1), indent);
  253. };
  254. this.$getIndent = function(line) {
  255. return line.match(/^\s*/)[0];
  256. };
  257. }).call(MatchingBraceOutdent.prototype);
  258. exports.MatchingBraceOutdent = MatchingBraceOutdent;
  259. });
  260. ace.define("ace/mode/behaviour/css",["require","exports","module","ace/lib/oop","ace/mode/behaviour","ace/mode/behaviour/cstyle","ace/token_iterator"], function(require, exports, module) {
  261. "use strict";
  262. var oop = require("../../lib/oop");
  263. var Behaviour = require("../behaviour").Behaviour;
  264. var CstyleBehaviour = require("./cstyle").CstyleBehaviour;
  265. var TokenIterator = require("../../token_iterator").TokenIterator;
  266. var CssBehaviour = function () {
  267. this.inherit(CstyleBehaviour);
  268. this.add("colon", "insertion", function (state, action, editor, session, text) {
  269. if (text === ':') {
  270. var cursor = editor.getCursorPosition();
  271. var iterator = new TokenIterator(session, cursor.row, cursor.column);
  272. var token = iterator.getCurrentToken();
  273. if (token && token.value.match(/\s+/)) {
  274. token = iterator.stepBackward();
  275. }
  276. if (token && token.type === 'support.type') {
  277. var line = session.doc.getLine(cursor.row);
  278. var rightChar = line.substring(cursor.column, cursor.column + 1);
  279. if (rightChar === ':') {
  280. return {
  281. text: '',
  282. selection: [1, 1]
  283. }
  284. }
  285. if (!line.substring(cursor.column).match(/^\s*;/)) {
  286. return {
  287. text: ':;',
  288. selection: [1, 1]
  289. }
  290. }
  291. }
  292. }
  293. });
  294. this.add("colon", "deletion", function (state, action, editor, session, range) {
  295. var selected = session.doc.getTextRange(range);
  296. if (!range.isMultiLine() && selected === ':') {
  297. var cursor = editor.getCursorPosition();
  298. var iterator = new TokenIterator(session, cursor.row, cursor.column);
  299. var token = iterator.getCurrentToken();
  300. if (token && token.value.match(/\s+/)) {
  301. token = iterator.stepBackward();
  302. }
  303. if (token && token.type === 'support.type') {
  304. var line = session.doc.getLine(range.start.row);
  305. var rightChar = line.substring(range.end.column, range.end.column + 1);
  306. if (rightChar === ';') {
  307. range.end.column ++;
  308. return range;
  309. }
  310. }
  311. }
  312. });
  313. this.add("semicolon", "insertion", function (state, action, editor, session, text) {
  314. if (text === ';') {
  315. var cursor = editor.getCursorPosition();
  316. var line = session.doc.getLine(cursor.row);
  317. var rightChar = line.substring(cursor.column, cursor.column + 1);
  318. if (rightChar === ';') {
  319. return {
  320. text: '',
  321. selection: [1, 1]
  322. }
  323. }
  324. }
  325. });
  326. }
  327. oop.inherits(CssBehaviour, CstyleBehaviour);
  328. exports.CssBehaviour = CssBehaviour;
  329. });
  330. ace.define("ace/mode/folding/cstyle",["require","exports","module","ace/lib/oop","ace/range","ace/mode/folding/fold_mode"], function(require, exports, module) {
  331. "use strict";
  332. var oop = require("../../lib/oop");
  333. var Range = require("../../range").Range;
  334. var BaseFoldMode = require("./fold_mode").FoldMode;
  335. var FoldMode = exports.FoldMode = function(commentRegex) {
  336. if (commentRegex) {
  337. this.foldingStartMarker = new RegExp(
  338. this.foldingStartMarker.source.replace(/\|[^|]*?$/, "|" + commentRegex.start)
  339. );
  340. this.foldingStopMarker = new RegExp(
  341. this.foldingStopMarker.source.replace(/\|[^|]*?$/, "|" + commentRegex.end)
  342. );
  343. }
  344. };
  345. oop.inherits(FoldMode, BaseFoldMode);
  346. (function() {
  347. this.foldingStartMarker = /(\{|\[)[^\}\]]*$|^\s*(\/\*)/;
  348. this.foldingStopMarker = /^[^\[\{]*(\}|\])|^[\s\*]*(\*\/)/;
  349. this.singleLineBlockCommentRe= /^\s*(\/\*).*\*\/\s*$/;
  350. this.tripleStarBlockCommentRe = /^\s*(\/\*\*\*).*\*\/\s*$/;
  351. this.startRegionRe = /^\s*(\/\*|\/\/)#?region\b/;
  352. this._getFoldWidgetBase = this.getFoldWidget;
  353. this.getFoldWidget = function(session, foldStyle, row) {
  354. var line = session.getLine(row);
  355. if (this.singleLineBlockCommentRe.test(line)) {
  356. if (!this.startRegionRe.test(line) && !this.tripleStarBlockCommentRe.test(line))
  357. return "";
  358. }
  359. var fw = this._getFoldWidgetBase(session, foldStyle, row);
  360. if (!fw && this.startRegionRe.test(line))
  361. return "start"; // lineCommentRegionStart
  362. return fw;
  363. };
  364. this.getFoldWidgetRange = function(session, foldStyle, row, forceMultiline) {
  365. var line = session.getLine(row);
  366. if (this.startRegionRe.test(line))
  367. return this.getCommentRegionBlock(session, line, row);
  368. var match = line.match(this.foldingStartMarker);
  369. if (match) {
  370. var i = match.index;
  371. if (match[1])
  372. return this.openingBracketBlock(session, match[1], row, i);
  373. var range = session.getCommentFoldRange(row, i + match[0].length, 1);
  374. if (range && !range.isMultiLine()) {
  375. if (forceMultiline) {
  376. range = this.getSectionRange(session, row);
  377. } else if (foldStyle != "all")
  378. range = null;
  379. }
  380. return range;
  381. }
  382. if (foldStyle === "markbegin")
  383. return;
  384. var match = line.match(this.foldingStopMarker);
  385. if (match) {
  386. var i = match.index + match[0].length;
  387. if (match[1])
  388. return this.closingBracketBlock(session, match[1], row, i);
  389. return session.getCommentFoldRange(row, i, -1);
  390. }
  391. };
  392. this.getSectionRange = function(session, row) {
  393. var line = session.getLine(row);
  394. var startIndent = line.search(/\S/);
  395. var startRow = row;
  396. var startColumn = line.length;
  397. row = row + 1;
  398. var endRow = row;
  399. var maxRow = session.getLength();
  400. while (++row < maxRow) {
  401. line = session.getLine(row);
  402. var indent = line.search(/\S/);
  403. if (indent === -1)
  404. continue;
  405. if (startIndent > indent)
  406. break;
  407. var subRange = this.getFoldWidgetRange(session, "all", row);
  408. if (subRange) {
  409. if (subRange.start.row <= startRow) {
  410. break;
  411. } else if (subRange.isMultiLine()) {
  412. row = subRange.end.row;
  413. } else if (startIndent == indent) {
  414. break;
  415. }
  416. }
  417. endRow = row;
  418. }
  419. return new Range(startRow, startColumn, endRow, session.getLine(endRow).length);
  420. };
  421. this.getCommentRegionBlock = function(session, line, row) {
  422. var startColumn = line.search(/\s*$/);
  423. var maxRow = session.getLength();
  424. var startRow = row;
  425. var re = /^\s*(?:\/\*|\/\/|--)#?(end)?region\b/;
  426. var depth = 1;
  427. while (++row < maxRow) {
  428. line = session.getLine(row);
  429. var m = re.exec(line);
  430. if (!m) continue;
  431. if (m[1]) depth--;
  432. else depth++;
  433. if (!depth) break;
  434. }
  435. var endRow = row;
  436. if (endRow > startRow) {
  437. return new Range(startRow, startColumn, endRow, line.length);
  438. }
  439. };
  440. }).call(FoldMode.prototype);
  441. });
  442. ace.define("ace/mode/scss",["require","exports","module","ace/lib/oop","ace/mode/text","ace/mode/scss_highlight_rules","ace/mode/matching_brace_outdent","ace/mode/behaviour/css","ace/mode/folding/cstyle"], function(require, exports, module) {
  443. "use strict";
  444. var oop = require("../lib/oop");
  445. var TextMode = require("./text").Mode;
  446. var ScssHighlightRules = require("./scss_highlight_rules").ScssHighlightRules;
  447. var MatchingBraceOutdent = require("./matching_brace_outdent").MatchingBraceOutdent;
  448. var CssBehaviour = require("./behaviour/css").CssBehaviour;
  449. var CStyleFoldMode = require("./folding/cstyle").FoldMode;
  450. var Mode = function() {
  451. this.HighlightRules = ScssHighlightRules;
  452. this.$outdent = new MatchingBraceOutdent();
  453. this.$behaviour = new CssBehaviour();
  454. this.foldingRules = new CStyleFoldMode();
  455. };
  456. oop.inherits(Mode, TextMode);
  457. (function() {
  458. this.lineCommentStart = "//";
  459. this.blockComment = {start: "/*", end: "*/"};
  460. this.getNextLineIndent = function(state, line, tab) {
  461. var indent = this.$getIndent(line);
  462. var tokens = this.getTokenizer().getLineTokens(line, state).tokens;
  463. if (tokens.length && tokens[tokens.length-1].type == "comment") {
  464. return indent;
  465. }
  466. var match = line.match(/^.*\{\s*$/);
  467. if (match) {
  468. indent += tab;
  469. }
  470. return indent;
  471. };
  472. this.checkOutdent = function(state, line, input) {
  473. return this.$outdent.checkOutdent(line, input);
  474. };
  475. this.autoOutdent = function(state, doc, row) {
  476. this.$outdent.autoOutdent(doc, row);
  477. };
  478. this.$id = "ace/mode/scss";
  479. }).call(Mode.prototype);
  480. exports.Mode = Mode;
  481. });