@master/css-language-service 2.0.0-rc.5 → 2.0.0-rc.50

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 (93) hide show
  1. package/dist/common.cjs +57 -0
  2. package/dist/common.d.ts +9 -0
  3. package/dist/common.mjs +48 -0
  4. package/dist/core.cjs +246 -0
  5. package/dist/core.d.ts +29 -0
  6. package/dist/core.mjs +244 -0
  7. package/dist/features/edit-syntax-colors.cjs +19 -0
  8. package/dist/features/edit-syntax-colors.d.ts +4 -0
  9. package/dist/features/edit-syntax-colors.mjs +17 -0
  10. package/dist/features/inspect-syntax.cjs +70 -0
  11. package/dist/features/inspect-syntax.d.ts +4 -0
  12. package/dist/features/inspect-syntax.mjs +68 -0
  13. package/dist/features/render-syntax-colors.cjs +88 -0
  14. package/dist/features/render-syntax-colors.d.ts +4 -0
  15. package/dist/features/render-syntax-colors.mjs +86 -0
  16. package/dist/features/suggest-syntax.cjs +20 -0
  17. package/dist/features/suggest-syntax.d.ts +4 -0
  18. package/dist/features/suggest-syntax.mjs +18 -0
  19. package/dist/index.cjs +29 -0
  20. package/dist/index.d.ts +7 -5
  21. package/dist/index.mjs +7 -0
  22. package/dist/settings.cjs +84 -0
  23. package/dist/settings.d.ts +19 -9
  24. package/dist/settings.mjs +82 -0
  25. package/dist/utils/beautify-css.cjs +13 -0
  26. package/dist/utils/beautify-css.d.ts +1 -0
  27. package/dist/utils/beautify-css.mjs +11 -0
  28. package/dist/utils/convert-color-space.cjs +40 -0
  29. package/dist/utils/convert-color-space.d.ts +2 -0
  30. package/dist/utils/convert-color-space.mjs +38 -0
  31. package/dist/utils/convert-color-token.cjs +28 -0
  32. package/dist/utils/convert-color-token.d.ts +3 -0
  33. package/dist/utils/convert-color-token.mjs +26 -0
  34. package/dist/utils/create-doc.cjs +26 -0
  35. package/dist/utils/create-doc.d.ts +16 -0
  36. package/dist/utils/create-doc.mjs +21 -0
  37. package/dist/utils/css-data-provider.cjs +9 -0
  38. package/dist/utils/css-data-provider.d.ts +3 -0
  39. package/dist/utils/css-data-provider.mjs +7 -0
  40. package/dist/utils/find-matching-brackets.cjs +29 -0
  41. package/dist/utils/find-matching-brackets.d.ts +1 -0
  42. package/dist/utils/find-matching-brackets.mjs +27 -0
  43. package/dist/utils/get-color-completion-items.cjs +30 -0
  44. package/dist/utils/get-color-completion-items.d.ts +3 -0
  45. package/dist/utils/get-color-completion-items.mjs +28 -0
  46. package/dist/utils/get-css-data-documentation.cjs +90 -0
  47. package/dist/utils/get-css-data-documentation.d.ts +5 -0
  48. package/dist/utils/get-css-data-documentation.mjs +88 -0
  49. package/dist/utils/get-main-completion-items.cjs +105 -0
  50. package/dist/utils/get-main-completion-items.d.ts +3 -0
  51. package/dist/utils/get-main-completion-items.mjs +103 -0
  52. package/dist/utils/get-position.cjs +12 -0
  53. package/dist/utils/get-position.d.ts +1 -0
  54. package/dist/utils/get-position.mjs +10 -0
  55. package/dist/utils/get-pseudo-class-completion-items.cjs +65 -0
  56. package/dist/utils/get-pseudo-class-completion-items.d.ts +3 -0
  57. package/dist/utils/get-pseudo-class-completion-items.mjs +63 -0
  58. package/dist/utils/get-pseudo-element-completion-items.cjs +56 -0
  59. package/dist/utils/get-pseudo-element-completion-items.d.ts +3 -0
  60. package/dist/utils/get-pseudo-element-completion-items.mjs +54 -0
  61. package/dist/utils/get-query-completion-items.cjs +102 -0
  62. package/dist/utils/get-query-completion-items.d.ts +3 -0
  63. package/dist/utils/get-query-completion-items.mjs +100 -0
  64. package/dist/utils/get-range.cjs +21 -0
  65. package/dist/utils/get-range.d.ts +2 -0
  66. package/dist/utils/get-range.mjs +19 -0
  67. package/dist/utils/get-utility-info.cjs +32 -0
  68. package/dist/utils/get-utility-info.d.ts +7 -0
  69. package/dist/utils/get-utility-info.mjs +30 -0
  70. package/dist/utils/get-value-completion-items.cjs +185 -0
  71. package/dist/utils/get-value-completion-items.d.ts +3 -0
  72. package/dist/utils/get-value-completion-items.mjs +183 -0
  73. package/dist/utils/query-syntax-completions.cjs +115 -0
  74. package/dist/utils/query-syntax-completions.d.ts +3 -0
  75. package/dist/utils/query-syntax-completions.mjs +113 -0
  76. package/dist/utils/regex.cjs +5 -0
  77. package/dist/utils/regex.mjs +3 -0
  78. package/dist/utils/sort-completion-items.cjs +11 -0
  79. package/dist/utils/sort-completion-items.d.ts +2 -0
  80. package/dist/utils/sort-completion-items.mjs +9 -0
  81. package/package.json +1 -1
  82. package/dist/constant.d.ts +0 -33
  83. package/dist/index.bundle.js +0 -33
  84. package/dist/position-check.d.ts +0 -20
  85. package/dist/providers/color.d.ts +0 -5
  86. package/dist/providers/completion.d.ts +0 -14
  87. package/dist/providers/hover.d.ts +0 -2
  88. package/dist/settings.bundle.js +0 -1
  89. package/dist/utils/get-css-entry-markdown-description.d.ts +0 -1
  90. package/dist/utils/hex-to-rgb.d.ts +0 -2
  91. package/dist/utils/oklab-to-rgb.d.ts +0 -1
  92. package/dist/utils/oklch-to-oklab.d.ts +0 -1
  93. package/dist/utils/to-two-digit-hex.d.ts +0 -1
@@ -0,0 +1,57 @@
1
+ 'use strict';
2
+
3
+ var vscodeLanguageserverProtocol = require('vscode-languageserver-protocol');
4
+ var css = require('@master/css');
5
+
6
+ const INVOKED_TRIGGER_CHARACTERS = [
7
+ '"',
8
+ ' ',
9
+ '\''
10
+ ];
11
+ const VALUE_TRIGGER_CHARACTERS = [
12
+ css.SEPARATOR_SIGN,
13
+ css.DELIMITER_SIGN
14
+ ];
15
+ const SELECTOR_TRIGGER_CHARACTERS = css.SELECTOR_SIGNS;
16
+ const AT_TRIGGER_CHARACTER = css.AT_SIGN;
17
+ const QUERY_TRIGGER_CHARACTERS = [
18
+ ...css.QUERY_COMPARISON_OPERATORS,
19
+ ...css.QUERY_LOGICAL_OPERATORS
20
+ ];
21
+ const GROUP_TRIGGER_CHARACTER = '{';
22
+ const DECLARATION_SEPARATOR_TRIGGER_CHARACTER = ';';
23
+ const SERVER_CAPABILITIES = {
24
+ textDocumentSync: vscodeLanguageserverProtocol.TextDocumentSyncKind.Incremental,
25
+ // Tell the client that this server supports code completion.
26
+ completionProvider: {
27
+ resolveProvider: false,
28
+ workDoneProgress: false,
29
+ triggerCharacters: [
30
+ ...new Set([
31
+ ...INVOKED_TRIGGER_CHARACTERS,
32
+ ...VALUE_TRIGGER_CHARACTERS,
33
+ ...SELECTOR_TRIGGER_CHARACTERS,
34
+ ...QUERY_TRIGGER_CHARACTERS,
35
+ DECLARATION_SEPARATOR_TRIGGER_CHARACTER,
36
+ AT_TRIGGER_CHARACTER,
37
+ GROUP_TRIGGER_CHARACTER
38
+ ])
39
+ ]
40
+ },
41
+ colorProvider: true,
42
+ hoverProvider: true,
43
+ workspace: {
44
+ workspaceFolders: {
45
+ supported: true
46
+ }
47
+ }
48
+ };
49
+
50
+ exports.AT_TRIGGER_CHARACTER = AT_TRIGGER_CHARACTER;
51
+ exports.DECLARATION_SEPARATOR_TRIGGER_CHARACTER = DECLARATION_SEPARATOR_TRIGGER_CHARACTER;
52
+ exports.GROUP_TRIGGER_CHARACTER = GROUP_TRIGGER_CHARACTER;
53
+ exports.INVOKED_TRIGGER_CHARACTERS = INVOKED_TRIGGER_CHARACTERS;
54
+ exports.QUERY_TRIGGER_CHARACTERS = QUERY_TRIGGER_CHARACTERS;
55
+ exports.SELECTOR_TRIGGER_CHARACTERS = SELECTOR_TRIGGER_CHARACTERS;
56
+ exports.SERVER_CAPABILITIES = SERVER_CAPABILITIES;
57
+ exports.VALUE_TRIGGER_CHARACTERS = VALUE_TRIGGER_CHARACTERS;
@@ -0,0 +1,9 @@
1
+ import { type ServerCapabilities } from 'vscode-languageserver-protocol';
2
+ export declare const INVOKED_TRIGGER_CHARACTERS: string[];
3
+ export declare const VALUE_TRIGGER_CHARACTERS: string[];
4
+ export declare const SELECTOR_TRIGGER_CHARACTERS: string[];
5
+ export declare const AT_TRIGGER_CHARACTER = "@";
6
+ export declare const QUERY_TRIGGER_CHARACTERS: string[];
7
+ export declare const GROUP_TRIGGER_CHARACTER = "{";
8
+ export declare const DECLARATION_SEPARATOR_TRIGGER_CHARACTER = ";";
9
+ export declare const SERVER_CAPABILITIES: ServerCapabilities;
@@ -0,0 +1,48 @@
1
+ import { TextDocumentSyncKind } from 'vscode-languageserver-protocol';
2
+ import { QUERY_COMPARISON_OPERATORS, QUERY_LOGICAL_OPERATORS, SEPARATOR_SIGN, DELIMITER_SIGN, SELECTOR_SIGNS, AT_SIGN } from '@master/css';
3
+
4
+ const INVOKED_TRIGGER_CHARACTERS = [
5
+ '"',
6
+ ' ',
7
+ '\''
8
+ ];
9
+ const VALUE_TRIGGER_CHARACTERS = [
10
+ SEPARATOR_SIGN,
11
+ DELIMITER_SIGN
12
+ ];
13
+ const SELECTOR_TRIGGER_CHARACTERS = SELECTOR_SIGNS;
14
+ const AT_TRIGGER_CHARACTER = AT_SIGN;
15
+ const QUERY_TRIGGER_CHARACTERS = [
16
+ ...QUERY_COMPARISON_OPERATORS,
17
+ ...QUERY_LOGICAL_OPERATORS
18
+ ];
19
+ const GROUP_TRIGGER_CHARACTER = '{';
20
+ const DECLARATION_SEPARATOR_TRIGGER_CHARACTER = ';';
21
+ const SERVER_CAPABILITIES = {
22
+ textDocumentSync: TextDocumentSyncKind.Incremental,
23
+ // Tell the client that this server supports code completion.
24
+ completionProvider: {
25
+ resolveProvider: false,
26
+ workDoneProgress: false,
27
+ triggerCharacters: [
28
+ ...new Set([
29
+ ...INVOKED_TRIGGER_CHARACTERS,
30
+ ...VALUE_TRIGGER_CHARACTERS,
31
+ ...SELECTOR_TRIGGER_CHARACTERS,
32
+ ...QUERY_TRIGGER_CHARACTERS,
33
+ DECLARATION_SEPARATOR_TRIGGER_CHARACTER,
34
+ AT_TRIGGER_CHARACTER,
35
+ GROUP_TRIGGER_CHARACTER
36
+ ])
37
+ ]
38
+ },
39
+ colorProvider: true,
40
+ hoverProvider: true,
41
+ workspace: {
42
+ workspaceFolders: {
43
+ supported: true
44
+ }
45
+ }
46
+ };
47
+
48
+ export { AT_TRIGGER_CHARACTER, DECLARATION_SEPARATOR_TRIGGER_CHARACTER, GROUP_TRIGGER_CHARACTER, INVOKED_TRIGGER_CHARACTERS, QUERY_TRIGGER_CHARACTERS, SELECTOR_TRIGGER_CHARACTERS, SERVER_CAPABILITIES, VALUE_TRIGGER_CHARACTERS };
package/dist/core.cjs ADDED
@@ -0,0 +1,246 @@
1
+ 'use strict';
2
+
3
+ var css = require('@master/css');
4
+ var extend = require('@techor/extend');
5
+ var EventEmitter = require('node:events');
6
+ var settings = require('./settings.cjs');
7
+ var minimatch = require('minimatch');
8
+ var inspectSyntax = require('./features/inspect-syntax.cjs');
9
+ var renderSyntaxColors = require('./features/render-syntax-colors.cjs');
10
+ var editSyntaxColors = require('./features/edit-syntax-colors.cjs');
11
+ var suggestSyntax = require('./features/suggest-syntax.cjs');
12
+ var findMatchingBrackets = require('./utils/find-matching-brackets.cjs');
13
+ var escapeRegexp = require('lodash.escaperegexp');
14
+
15
+ class CSSLanguageService extends EventEmitter {
16
+ customSettings;
17
+ css;
18
+ settings;
19
+ constructor(customSettings){
20
+ super(), this.customSettings = customSettings;
21
+ this.settings = extend(settings, customSettings);
22
+ this.css = new css.MasterCSS(this.settings.config);
23
+ }
24
+ inspectSyntax(...params) {
25
+ if (this.settings.inspectSyntax && this.isDocumentAccepted(params[0])) return inspectSyntax?.call(this, ...params);
26
+ }
27
+ renderSyntaxColors(...params) {
28
+ if (this.settings.renderSyntaxColors && this.isDocumentAccepted(params[0])) return renderSyntaxColors?.call(this, ...params);
29
+ }
30
+ editSyntaxColors(...params) {
31
+ if (this.settings.editSyntaxColors && this.isDocumentAccepted(params[0])) return editSyntaxColors?.call(this, ...params);
32
+ }
33
+ suggestSyntax(...params) {
34
+ if (this.settings.suggestSyntax && this.isDocumentAccepted(params[0])) return suggestSyntax?.call(this, ...params);
35
+ }
36
+ getClassPosition(textDocument, position) {
37
+ const positionIndex = textDocument.offsetAt(position);
38
+ const startIndex = textDocument.offsetAt({
39
+ line: position.line - 100,
40
+ character: 0
41
+ }) ?? 0;
42
+ const endIndex = textDocument.offsetAt({
43
+ line: position.line + 100,
44
+ character: 0
45
+ }) ?? undefined;
46
+ const text = textDocument.getText().substring(startIndex, endIndex);
47
+ const { classAttributeBindings, classAttributes, classDeclarations, classFunctions } = this.settings;
48
+ const normalizeClassNamePosition = (className, attrStart, escapeCharacter)=>{
49
+ /**
50
+ * Matching classes, including empty string after white space
51
+ * @example <div class="class-a class-b "></div>
52
+ * @url https://regex101.com/r/LnBLAV/1
53
+ */ for (const eachClassMatch of className.matchAll(/(?:[^\s]+)?/g)){
54
+ if (eachClassMatch.index === undefined) continue;
55
+ const raw = eachClassMatch[0];
56
+ const classStartIndex = attrStart + eachClassMatch.index;
57
+ const classEndIndex = classStartIndex + raw.length;
58
+ if (classStartIndex <= positionIndex - startIndex && positionIndex - startIndex <= classEndIndex) {
59
+ return {
60
+ range: {
61
+ start: classStartIndex,
62
+ end: startIndex + classEndIndex
63
+ },
64
+ raw,
65
+ token: raw.replace(new RegExp('\\' + escapeCharacter, 'g'), escapeCharacter)
66
+ };
67
+ } else if (attrStart === classEndIndex) {
68
+ return {
69
+ range: {
70
+ start: attrStart,
71
+ end: attrStart
72
+ },
73
+ raw: '',
74
+ token: ''
75
+ };
76
+ }
77
+ }
78
+ };
79
+ const resolve = (classMatchers, handle)=>{
80
+ for (const eachClassMatcher of classMatchers){
81
+ let [eachPattern, start, end] = eachClassMatcher;
82
+ end = end ?? start;
83
+ for (const eachClassPostioinMatch of text.matchAll(new RegExp(`(?:\\s|\\.)${eachPattern}${escapeRegexp(start)}`, 'g'))){
84
+ if (eachClassPostioinMatch.index === undefined) continue;
85
+ const eachClassAttributeString = eachClassPostioinMatch[0];
86
+ const eachAttrStart = eachClassPostioinMatch.index + eachClassAttributeString.length;
87
+ const eachClassPositionEnd = findMatchingBrackets(text, eachAttrStart, start, end);
88
+ if (!eachClassPositionEnd) continue;
89
+ if ((eachAttrStart <= positionIndex - startIndex && eachClassPositionEnd >= positionIndex - startIndex) === true) {
90
+ const classPosition = handle(eachAttrStart, eachClassPositionEnd, eachClassMatcher);
91
+ if (classPosition) return classPosition;
92
+ } else if (eachClassPostioinMatch.index > positionIndex - startIndex) {
93
+ break;
94
+ }
95
+ }
96
+ }
97
+ };
98
+ const stringExpressions = [];
99
+ const assignmentExpressions = [];
100
+ classAttributes?.forEach((eachClassAttribute)=>{
101
+ stringExpressions.push([
102
+ eachClassAttribute + '=',
103
+ '"',
104
+ '"'
105
+ ], [
106
+ eachClassAttribute + '=',
107
+ '\'',
108
+ '\''
109
+ ]);
110
+ });
111
+ classDeclarations?.forEach((eachClassDeclaration)=>{
112
+ stringExpressions.push([
113
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
114
+ '"',
115
+ '"'
116
+ ], [
117
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
118
+ '`',
119
+ '`'
120
+ ], [
121
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
122
+ '\'',
123
+ '\''
124
+ ]);
125
+ assignmentExpressions.push([
126
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
127
+ '{',
128
+ '}'
129
+ ]);
130
+ });
131
+ classFunctions?.forEach((eachClassFunction)=>{
132
+ /**
133
+ * @example clsx`class-a class-b`
134
+ */ stringExpressions.push([
135
+ eachClassFunction,
136
+ '`',
137
+ '`'
138
+ ]);
139
+ /**
140
+ * @example clsx('class-a class-b')
141
+ */ assignmentExpressions.push([
142
+ eachClassFunction,
143
+ '(',
144
+ ')'
145
+ ]);
146
+ });
147
+ /**
148
+ * @example <div class=""></div>
149
+ * */ if (stringExpressions?.length) {
150
+ const classPosition = resolve(stringExpressions, (eachAttrStart, eachClassPositionEnd, [eachPattern, pair])=>{
151
+ const eachClassName = text.substring(eachAttrStart, eachClassPositionEnd);
152
+ /**
153
+ * @example <div class=""></div>
154
+ */ if (eachClassName === undefined) {
155
+ return {
156
+ range: {
157
+ start: eachAttrStart,
158
+ end: eachAttrStart
159
+ },
160
+ token: '',
161
+ raw: ''
162
+ };
163
+ }
164
+ const classNameStart = eachAttrStart;
165
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, pair);
166
+ if (classPosition) return classPosition;
167
+ });
168
+ if (classPosition) return classPosition;
169
+ }
170
+ if (classAttributeBindings) {
171
+ for(const eachClassAttribute in classAttributeBindings){
172
+ const eachClassAttributeBinding = classAttributeBindings[eachClassAttribute];
173
+ if (eachClassAttributeBinding === false) continue;
174
+ assignmentExpressions.push([
175
+ eachClassAttribute + '=',
176
+ eachClassAttributeBinding[0],
177
+ eachClassAttributeBinding[1]
178
+ ]);
179
+ }
180
+ }
181
+ /**
182
+ * attribute binding
183
+ * @example <div className={''}></div>
184
+ * @example <div :class="isActive ? 'block' : 'hidden'"></div>
185
+ * */ if (assignmentExpressions?.length) {
186
+ const classPosition = resolve(assignmentExpressions, (eachAttrStart, eachClassPositionEnd, eachClassMatcher)=>{
187
+ const eachClassPositionExpression = text.substring(eachAttrStart, eachClassPositionEnd);
188
+ /**
189
+ * @example <div className={""}></div>
190
+ */ if ([
191
+ '""',
192
+ '\'\'',
193
+ '``'
194
+ ].includes(eachClassPositionExpression)) {
195
+ return {
196
+ range: {
197
+ start: eachAttrStart + 1,
198
+ end: eachAttrStart + 1
199
+ },
200
+ raw: '',
201
+ token: ''
202
+ };
203
+ }
204
+ // 1. "
205
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)"([\s\S]*?)(?<!\\)"/g)){
206
+ if (classExpressionMatch.index === undefined) continue;
207
+ const eachClassName = classExpressionMatch[1];
208
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // " length
209
+ ;
210
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '"');
211
+ if (classPosition) return classPosition;
212
+ }
213
+ // 2. '
214
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)'([\s\S]*?)(?<!\\)'/g)){
215
+ if (classExpressionMatch.index === undefined) continue;
216
+ const eachClassName = classExpressionMatch[1];
217
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // ' length
218
+ ;
219
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '\'');
220
+ if (classPosition) return classPosition;
221
+ }
222
+ // 3. `
223
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)`([\s\S]*?)(?<!\\)`/g)){
224
+ if (classExpressionMatch.index === undefined) continue;
225
+ const eachClassName = classExpressionMatch[1];
226
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // ` length
227
+ ;
228
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '`');
229
+ if (classPosition) return classPosition;
230
+ }
231
+ });
232
+ if (classPosition) return classPosition;
233
+ }
234
+ }
235
+ isDocumentAccepted(doc) {
236
+ if (!this.settings.exclude) return true;
237
+ for (const exclude of this.settings.exclude){
238
+ if (minimatch.minimatch(doc.uri, exclude)) {
239
+ return false;
240
+ }
241
+ }
242
+ return true;
243
+ }
244
+ }
245
+
246
+ module.exports = CSSLanguageService;
package/dist/core.d.ts ADDED
@@ -0,0 +1,29 @@
1
+ import { MasterCSS } from '@master/css';
2
+ import EventEmitter from 'node:events';
3
+ import type { Position } from 'vscode-languageserver-protocol';
4
+ import { type Settings } from './settings';
5
+ import inspectSyntax from './features/inspect-syntax';
6
+ import renderSyntaxColors from './features/render-syntax-colors';
7
+ import editSyntaxColors from './features/edit-syntax-colors';
8
+ import suggestSyntax from './features/suggest-syntax';
9
+ import { TextDocument } from 'vscode-languageserver-textdocument';
10
+ export interface ClassPosition {
11
+ range: {
12
+ start: number;
13
+ end: number;
14
+ };
15
+ raw: string;
16
+ token: string;
17
+ }
18
+ export default class CSSLanguageService extends EventEmitter {
19
+ customSettings?: Settings | undefined;
20
+ css: MasterCSS;
21
+ settings: Settings;
22
+ constructor(customSettings?: Settings | undefined);
23
+ inspectSyntax(...params: Parameters<typeof inspectSyntax>): import("vscode-languageserver-protocol").Hover | undefined;
24
+ renderSyntaxColors(...params: Parameters<typeof renderSyntaxColors>): Promise<import("vscode-languageserver-protocol").ColorInformation[] | undefined> | undefined;
25
+ editSyntaxColors(...params: Parameters<typeof editSyntaxColors>): import("vscode-languageserver-protocol").ColorPresentation[] | undefined;
26
+ suggestSyntax(...params: Parameters<typeof suggestSyntax>): import("vscode-languageserver-protocol").CompletionItem[] | undefined;
27
+ getClassPosition(textDocument: TextDocument, position: Position): ClassPosition | undefined;
28
+ isDocumentAccepted(doc: TextDocument): boolean;
29
+ }
package/dist/core.mjs ADDED
@@ -0,0 +1,244 @@
1
+ import { MasterCSS } from '@master/css';
2
+ import extend from '@techor/extend';
3
+ import EventEmitter from 'node:events';
4
+ import settings from './settings.mjs';
5
+ import { minimatch } from 'minimatch';
6
+ import inspectSyntax from './features/inspect-syntax.mjs';
7
+ import renderSyntaxColors from './features/render-syntax-colors.mjs';
8
+ import editSyntaxColors from './features/edit-syntax-colors.mjs';
9
+ import suggestSyntax from './features/suggest-syntax.mjs';
10
+ import findMatchingPairs from './utils/find-matching-brackets.mjs';
11
+ import escapeRegexp from 'lodash.escaperegexp';
12
+
13
+ class CSSLanguageService extends EventEmitter {
14
+ customSettings;
15
+ css;
16
+ settings;
17
+ constructor(customSettings){
18
+ super(), this.customSettings = customSettings;
19
+ this.settings = extend(settings, customSettings);
20
+ this.css = new MasterCSS(this.settings.config);
21
+ }
22
+ inspectSyntax(...params) {
23
+ if (this.settings.inspectSyntax && this.isDocumentAccepted(params[0])) return inspectSyntax?.call(this, ...params);
24
+ }
25
+ renderSyntaxColors(...params) {
26
+ if (this.settings.renderSyntaxColors && this.isDocumentAccepted(params[0])) return renderSyntaxColors?.call(this, ...params);
27
+ }
28
+ editSyntaxColors(...params) {
29
+ if (this.settings.editSyntaxColors && this.isDocumentAccepted(params[0])) return editSyntaxColors?.call(this, ...params);
30
+ }
31
+ suggestSyntax(...params) {
32
+ if (this.settings.suggestSyntax && this.isDocumentAccepted(params[0])) return suggestSyntax?.call(this, ...params);
33
+ }
34
+ getClassPosition(textDocument, position) {
35
+ const positionIndex = textDocument.offsetAt(position);
36
+ const startIndex = textDocument.offsetAt({
37
+ line: position.line - 100,
38
+ character: 0
39
+ }) ?? 0;
40
+ const endIndex = textDocument.offsetAt({
41
+ line: position.line + 100,
42
+ character: 0
43
+ }) ?? undefined;
44
+ const text = textDocument.getText().substring(startIndex, endIndex);
45
+ const { classAttributeBindings, classAttributes, classDeclarations, classFunctions } = this.settings;
46
+ const normalizeClassNamePosition = (className, attrStart, escapeCharacter)=>{
47
+ /**
48
+ * Matching classes, including empty string after white space
49
+ * @example <div class="class-a class-b "></div>
50
+ * @url https://regex101.com/r/LnBLAV/1
51
+ */ for (const eachClassMatch of className.matchAll(/(?:[^\s]+)?/g)){
52
+ if (eachClassMatch.index === undefined) continue;
53
+ const raw = eachClassMatch[0];
54
+ const classStartIndex = attrStart + eachClassMatch.index;
55
+ const classEndIndex = classStartIndex + raw.length;
56
+ if (classStartIndex <= positionIndex - startIndex && positionIndex - startIndex <= classEndIndex) {
57
+ return {
58
+ range: {
59
+ start: classStartIndex,
60
+ end: startIndex + classEndIndex
61
+ },
62
+ raw,
63
+ token: raw.replace(new RegExp('\\' + escapeCharacter, 'g'), escapeCharacter)
64
+ };
65
+ } else if (attrStart === classEndIndex) {
66
+ return {
67
+ range: {
68
+ start: attrStart,
69
+ end: attrStart
70
+ },
71
+ raw: '',
72
+ token: ''
73
+ };
74
+ }
75
+ }
76
+ };
77
+ const resolve = (classMatchers, handle)=>{
78
+ for (const eachClassMatcher of classMatchers){
79
+ let [eachPattern, start, end] = eachClassMatcher;
80
+ end = end ?? start;
81
+ for (const eachClassPostioinMatch of text.matchAll(new RegExp(`(?:\\s|\\.)${eachPattern}${escapeRegexp(start)}`, 'g'))){
82
+ if (eachClassPostioinMatch.index === undefined) continue;
83
+ const eachClassAttributeString = eachClassPostioinMatch[0];
84
+ const eachAttrStart = eachClassPostioinMatch.index + eachClassAttributeString.length;
85
+ const eachClassPositionEnd = findMatchingPairs(text, eachAttrStart, start, end);
86
+ if (!eachClassPositionEnd) continue;
87
+ if ((eachAttrStart <= positionIndex - startIndex && eachClassPositionEnd >= positionIndex - startIndex) === true) {
88
+ const classPosition = handle(eachAttrStart, eachClassPositionEnd, eachClassMatcher);
89
+ if (classPosition) return classPosition;
90
+ } else if (eachClassPostioinMatch.index > positionIndex - startIndex) {
91
+ break;
92
+ }
93
+ }
94
+ }
95
+ };
96
+ const stringExpressions = [];
97
+ const assignmentExpressions = [];
98
+ classAttributes?.forEach((eachClassAttribute)=>{
99
+ stringExpressions.push([
100
+ eachClassAttribute + '=',
101
+ '"',
102
+ '"'
103
+ ], [
104
+ eachClassAttribute + '=',
105
+ '\'',
106
+ '\''
107
+ ]);
108
+ });
109
+ classDeclarations?.forEach((eachClassDeclaration)=>{
110
+ stringExpressions.push([
111
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
112
+ '"',
113
+ '"'
114
+ ], [
115
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
116
+ '`',
117
+ '`'
118
+ ], [
119
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
120
+ '\'',
121
+ '\''
122
+ ]);
123
+ assignmentExpressions.push([
124
+ eachClassDeclaration + '(?:\\s+)?(?::|=)(?:\\s+)?',
125
+ '{',
126
+ '}'
127
+ ]);
128
+ });
129
+ classFunctions?.forEach((eachClassFunction)=>{
130
+ /**
131
+ * @example clsx`class-a class-b`
132
+ */ stringExpressions.push([
133
+ eachClassFunction,
134
+ '`',
135
+ '`'
136
+ ]);
137
+ /**
138
+ * @example clsx('class-a class-b')
139
+ */ assignmentExpressions.push([
140
+ eachClassFunction,
141
+ '(',
142
+ ')'
143
+ ]);
144
+ });
145
+ /**
146
+ * @example <div class=""></div>
147
+ * */ if (stringExpressions?.length) {
148
+ const classPosition = resolve(stringExpressions, (eachAttrStart, eachClassPositionEnd, [eachPattern, pair])=>{
149
+ const eachClassName = text.substring(eachAttrStart, eachClassPositionEnd);
150
+ /**
151
+ * @example <div class=""></div>
152
+ */ if (eachClassName === undefined) {
153
+ return {
154
+ range: {
155
+ start: eachAttrStart,
156
+ end: eachAttrStart
157
+ },
158
+ token: '',
159
+ raw: ''
160
+ };
161
+ }
162
+ const classNameStart = eachAttrStart;
163
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, pair);
164
+ if (classPosition) return classPosition;
165
+ });
166
+ if (classPosition) return classPosition;
167
+ }
168
+ if (classAttributeBindings) {
169
+ for(const eachClassAttribute in classAttributeBindings){
170
+ const eachClassAttributeBinding = classAttributeBindings[eachClassAttribute];
171
+ if (eachClassAttributeBinding === false) continue;
172
+ assignmentExpressions.push([
173
+ eachClassAttribute + '=',
174
+ eachClassAttributeBinding[0],
175
+ eachClassAttributeBinding[1]
176
+ ]);
177
+ }
178
+ }
179
+ /**
180
+ * attribute binding
181
+ * @example <div className={''}></div>
182
+ * @example <div :class="isActive ? 'block' : 'hidden'"></div>
183
+ * */ if (assignmentExpressions?.length) {
184
+ const classPosition = resolve(assignmentExpressions, (eachAttrStart, eachClassPositionEnd, eachClassMatcher)=>{
185
+ const eachClassPositionExpression = text.substring(eachAttrStart, eachClassPositionEnd);
186
+ /**
187
+ * @example <div className={""}></div>
188
+ */ if ([
189
+ '""',
190
+ '\'\'',
191
+ '``'
192
+ ].includes(eachClassPositionExpression)) {
193
+ return {
194
+ range: {
195
+ start: eachAttrStart + 1,
196
+ end: eachAttrStart + 1
197
+ },
198
+ raw: '',
199
+ token: ''
200
+ };
201
+ }
202
+ // 1. "
203
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)"([\s\S]*?)(?<!\\)"/g)){
204
+ if (classExpressionMatch.index === undefined) continue;
205
+ const eachClassName = classExpressionMatch[1];
206
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // " length
207
+ ;
208
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '"');
209
+ if (classPosition) return classPosition;
210
+ }
211
+ // 2. '
212
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)'([\s\S]*?)(?<!\\)'/g)){
213
+ if (classExpressionMatch.index === undefined) continue;
214
+ const eachClassName = classExpressionMatch[1];
215
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // ' length
216
+ ;
217
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '\'');
218
+ if (classPosition) return classPosition;
219
+ }
220
+ // 3. `
221
+ for (const classExpressionMatch of eachClassPositionExpression.matchAll(/(?<!\\)`([\s\S]*?)(?<!\\)`/g)){
222
+ if (classExpressionMatch.index === undefined) continue;
223
+ const eachClassName = classExpressionMatch[1];
224
+ const classNameStart = eachAttrStart + classExpressionMatch.index + 1 // ` length
225
+ ;
226
+ const classPosition = normalizeClassNamePosition(eachClassName, classNameStart, '`');
227
+ if (classPosition) return classPosition;
228
+ }
229
+ });
230
+ if (classPosition) return classPosition;
231
+ }
232
+ }
233
+ isDocumentAccepted(doc) {
234
+ if (!this.settings.exclude) return true;
235
+ for (const exclude of this.settings.exclude){
236
+ if (minimatch(doc.uri, exclude)) {
237
+ return false;
238
+ }
239
+ }
240
+ return true;
241
+ }
242
+ }
243
+
244
+ export { CSSLanguageService as default };
@@ -0,0 +1,19 @@
1
+ 'use strict';
2
+
3
+ var convertColorToken = require('../utils/convert-color-token.cjs');
4
+
5
+ function editSyntaxColors(document, color, range) {
6
+ const colorPresentations = [];
7
+ const selectedColorToken = document.getText(range);
8
+ const targetColorToken = convertColorToken(color, selectedColorToken, this.css);
9
+ if (targetColorToken) colorPresentations.push({
10
+ label: targetColorToken,
11
+ textEdit: {
12
+ range,
13
+ newText: targetColorToken
14
+ }
15
+ });
16
+ return colorPresentations;
17
+ }
18
+
19
+ module.exports = editSyntaxColors;
@@ -0,0 +1,4 @@
1
+ import type { TextDocument } from 'vscode-languageserver-textdocument';
2
+ import CSSLanguageService from '../core';
3
+ import type { ColorPresentationParams, ColorPresentation } from 'vscode-languageserver-protocol';
4
+ export default function editSyntaxColors(this: CSSLanguageService, document: TextDocument, color: ColorPresentationParams['color'], range: ColorPresentationParams['range']): ColorPresentation[];