sugar-high 0.0.5 → 0.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +21 -20
  2. package/lib/index.mjs +26 -14
  3. package/package.json +1 -1
package/README.md CHANGED
@@ -21,38 +21,39 @@ document.querySelector('pre > code').innerHTML = codeHTML
21
21
 
22
22
  ### Highlight with CSS
23
23
 
24
- Then make your own theme with customized colors and put in global CSS
24
+ Then make your own theme with customized colors by token type and put in global CSS. The corresponding class names star with `sh__` prefix.
25
25
 
26
26
  ```css
27
- /*
28
- * 0 - comment
29
- * 1 - keyword
30
- * 2 - break
31
- * 3 - string
32
- * 4 - space
33
- * 5 - sign
34
- * 6 - identifier
35
- * 7 - Class, number and null
27
+ /**
28
+ * Types that sugar-high have:
29
+ *
30
+ * identifier
31
+ * keyword
32
+ * string
33
+ * Class, number and null
34
+ * sign
35
+ * comment
36
+ *
36
37
  */
37
- .sh__7 {
38
- color: #3476cb;
38
+ .sh__class {
39
+ color: #2d5e9d;
39
40
  }
40
- .sh__6 {
41
+ .sh__identifier {
41
42
  color: #2d333b;
42
43
  }
43
- .sh__5 {
44
- color: #818c9b;
45
- font-weight: bold;
44
+ .sh__sign {
45
+ color: #8996a3;
46
46
  }
47
- .sh__3 {
47
+ .sh__string {
48
48
  color: #00a99a;
49
49
  }
50
- .sh__1 {
50
+ .sh__keyword {
51
51
  color: #f47067;
52
52
  }
53
- .sh__0 {
54
- color: #818c9b;
53
+ .sh__comment {
54
+ color: #a19595;
55
55
  }
56
+
56
57
  ```
57
58
 
58
59
  ### LICENSE
package/lib/index.mjs CHANGED
@@ -62,6 +62,7 @@ const signs = new Set([
62
62
  ':',
63
63
  '.',
64
64
  ',',
65
+ ';',
65
66
  `'`,
66
67
  '"',
67
68
  '.',
@@ -73,28 +74,39 @@ const signs = new Set([
73
74
  '\\',
74
75
  ])
75
76
 
77
+ const types = [
78
+ 'identifier',
79
+ 'keyword',
80
+ 'string',
81
+ 'class',
82
+ 'sign',
83
+ 'comment',
84
+ 'break',
85
+ 'space',
86
+ ]
87
+
76
88
  /**
77
89
  *
78
- * 0 - comment
90
+ * 0 - identifier
79
91
  * 1 - keyword
80
- * 2 - break
81
- * 3 - string
82
- * 4 - space
83
- * 5 - sign
84
- * 6 - identifier
85
- * 7 - Class, number and null
92
+ * 2 - string
93
+ * 3 - Class, number and null
94
+ * 4 - sign
95
+ * 5 - comment
96
+ * 6 - break
97
+ * 7 - space
86
98
  *
87
99
  */
88
100
  const [
89
- T_COMMENT,
101
+ T_IDENTIFIER,
90
102
  T_KEYWORD,
91
- T_BREAK,
92
103
  T_STRING,
93
- T_SPACE,
94
- T_SIGN,
95
- T_IDENTIFIER,
96
104
  T_CLS_NUMBER,
97
- ] = Array(8).fill().map((_, i) => i)
105
+ T_SIGN,
106
+ T_COMMENT,
107
+ T_BREAK,
108
+ T_SPACE,
109
+ ] = types.map((_, i) => i)
98
110
 
99
111
  function isSpaces(str) {
100
112
  return /^[^\S\r\n]+$/g.test(str)
@@ -302,7 +314,7 @@ function generate(tokens) {
302
314
  output.push(
303
315
  type === T_BREAK
304
316
  ? '<br>'
305
- : `<span class="sh__${type}">${encode(token)}</span>`
317
+ : `<span class="sh__${types[type]}">${encode(token)}</span>`
306
318
  )
307
319
  }
308
320
  return output
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sugar-high",
3
- "version": "0.0.5",
3
+ "version": "0.0.6",
4
4
  "type": "module",
5
5
  "exports": "./lib/index.mjs",
6
6
  "description": "Super lightweight JSX syntax highlighter",