diff --git a/server/package.json b/server/package.json index f43b6c4748..b3ed367666 100644 --- a/server/package.json +++ b/server/package.json @@ -39,7 +39,7 @@ "stylus": "^0.54.5", "stylus-supremacy": "^2.12.6", "typescript": "^3.3.4000", - "vscode-css-languageservice": "^3.0.12", + "vscode-css-languageservice": "^4.0.2-next.3", "vscode-emmet-helper": "^1.1.19", "vscode-languageserver": "^5.3.0-next.4", "vscode-languageserver-types": "^3.15.0-next.1", diff --git a/server/src/modes/style/stylus/completion-item.ts b/server/src/modes/style/stylus/completion-item.ts index 1f2b49d565..2977f7ce2e 100644 --- a/server/src/modes/style/stylus/completion-item.ts +++ b/server/src/modes/style/stylus/completion-item.ts @@ -17,12 +17,10 @@ import { isVariableNode } from './parser'; -import * as cssSchema from './css-schema'; +import { cssData, LoadedCSSData } from './css-browser-data'; import builtIn from './built-in'; import * as _ from 'lodash'; -type CSSSchema = typeof cssSchema; - function prepareName(name: string): string { return name.replace(/\{|\}/g, '').trim(); } @@ -47,14 +45,14 @@ export function isAtRule(currentWord: string): boolean { /** * Naive check whether currentWord is value for given property - * @param {Object} cssSchema + * @param {Object} data * @param {String} currentWord * @return {Boolean} */ -export function isValue(cssSchema: CSSSchema, currentWord: string): boolean { +export function isValue(data: LoadedCSSData, currentWord: string): boolean { const property = getPropertyName(currentWord); - return !!property && Boolean(findPropertySchema(cssSchema, property)); + return !!property && Boolean(findPropertySchema(data, property)); } /** @@ -71,13 +69,12 @@ export function getPropertyName(currentWord: string): string { /** * Search for property in cssSchema - * @param {Object} cssSchema + * @param {Object} data * @param {String} property * @return {Object} */ -export function findPropertySchema(cssSchema: CSSSchema, property: string) { - const properties = cssSchema.data.css.properties; - return _.find(properties, item => item.name === property); +export function findPropertySchema(data: LoadedCSSData, property: string) { + return _.find(data.properties, item => item.name === property); } /** @@ -206,19 +203,19 @@ export function getAllSymbols(text: string, currentWord: string, position: Posit /** * Returns at rules list for completion - * @param {Object} cssSchema + * @param {Object} data * @param {String} currentWord * @return {CompletionItem} */ -export function getAtRules(cssSchema: CSSSchema, currentWord: string): CompletionItem[] { +export function getAtRules(data: LoadedCSSData, currentWord: string): CompletionItem[] { if (!isAtRule(currentWord)) { return []; } - return cssSchema.data.css.atdirectives.map(property => { + return data.atDirectives.map(property => { const completionItem = CompletionItem.create(property.name); - completionItem.detail = property.desc; + completionItem.detail = property.description; completionItem.kind = CompletionItemKind.Keyword; return completionItem; @@ -227,20 +224,20 @@ export function getAtRules(cssSchema: CSSSchema, currentWord: string): Completio /** * Returns property list for completion - * @param {Object} cssSchema + * @param {Object} data * @param {String} currentWord * @return {CompletionItem} */ -export function getProperties(cssSchema: CSSSchema, currentWord: string, useSeparator: boolean): CompletionItem[] { +export function getProperties(data: LoadedCSSData, currentWord: string, useSeparator: boolean): CompletionItem[] { if (isClassOrId(currentWord) || isAtRule(currentWord)) { return []; } - return cssSchema.data.css.properties.map(property => { + return data.properties.map(property => { const completionItem = CompletionItem.create(property.name); completionItem.insertText = property.name + (useSeparator ? ': ' : ' '); - completionItem.detail = property.desc; + completionItem.detail = property.description; completionItem.kind = CompletionItemKind.Property; return completionItem; @@ -249,13 +246,13 @@ export function getProperties(cssSchema: CSSSchema, currentWord: string, useSepa /** * Returns values for current property for completion list - * @param {Object} cssSchema + * @param {Object} data * @param {String} currentWord * @return {CompletionItem} */ -export function getValues(cssSchema: CSSSchema, currentWord: string): CompletionItem[] { +export function getValues(data: LoadedCSSData, currentWord: string): CompletionItem[] { const property = getPropertyName(currentWord); - const result = findPropertySchema(cssSchema, property); + const result = findPropertySchema(data, property); const values = result && result.values; if (!values) { @@ -265,7 +262,7 @@ export function getValues(cssSchema: CSSSchema, currentWord: string): Completion return values.map(property => { const completionItem = CompletionItem.create(property.name); - completionItem.documentation = property.desc; + completionItem.documentation = property.description; completionItem.kind = CompletionItemKind.Value; return completionItem; @@ -277,19 +274,19 @@ export function provideCompletionItems(document: TextDocument, position: Positio const end = document.offsetAt(position); const text = document.getText(); const currentWord = text.slice(start, end).trim(); - const value = isValue(cssSchema, currentWord); + const value = isValue(cssData, currentWord); let completions: CompletionItem[] = []; if (value) { - const values = getValues(cssSchema, currentWord); + const values = getValues(cssData, currentWord); const symbols = getAllSymbols(text, currentWord, position).filter( item => item.kind === CompletionItemKind.Variable || item.kind === CompletionItemKind.Function ); completions = completions.concat(values, symbols, builtIn); } else { - const atRules = getAtRules(cssSchema, currentWord); - const properties = getProperties(cssSchema, currentWord, false); + const atRules = getAtRules(cssData, currentWord); + const properties = getProperties(cssData, currentWord, false); const symbols = getAllSymbols(text, currentWord, position).filter( item => item.kind !== CompletionItemKind.Variable ); diff --git a/server/src/modes/style/stylus/css-browser-data.ts b/server/src/modes/style/stylus/css-browser-data.ts new file mode 100644 index 0000000000..175045c4a6 --- /dev/null +++ b/server/src/modes/style/stylus/css-browser-data.ts @@ -0,0 +1,28 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +import { + CSSDataV1, + IPropertyData, + IAtDirectiveData, + IPseudoClassData, + IPseudoElementData +} from 'vscode-css-languageservice'; + +export interface LoadedCSSData { + properties: IPropertyData[]; + atDirectives: IAtDirectiveData[]; + pseudoClasses: IPseudoClassData[]; + pseudoElements: IPseudoElementData[]; +} + +const rawData: CSSDataV1 = require('vscode-css-languageservice/lib/umd/data/browsers').cssData; + +export const cssData: LoadedCSSData = { + properties: rawData.properties || [], + atDirectives: rawData.atDirectives || [], + pseudoClasses: rawData.pseudoClasses || [], + pseudoElements: rawData.pseudoElements || [] +}; diff --git a/server/src/modes/style/stylus/css-schema.ts b/server/src/modes/style/stylus/css-schema.ts deleted file mode 100644 index b5a0b678de..0000000000 --- a/server/src/modes/style/stylus/css-schema.ts +++ /dev/null @@ -1,24 +0,0 @@ -/* tslint:disable:max-line-length */ -/*--------------------------------------------------------------------------------------------- - * Copyright (c) Microsoft Corporation. All rights reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - *--------------------------------------------------------------------------------------------*/ - -export interface CSSRecord { - name: string; - desc?: string; - browsers?: string; - restriction?: string; - values?: CSSRecord[]; -} - -export interface CSSData { - css: { - atdirectives: CSSRecord[]; - pseudoclasses: CSSRecord[]; - pseudoelements: CSSRecord[]; - properties: CSSRecord[]; - }; -} - -export const data: CSSData = require('vscode-css-languageservice/lib/umd/data/browsers').data; diff --git a/server/src/modes/style/stylus/stylus-hover.ts b/server/src/modes/style/stylus/stylus-hover.ts index f915b8ebab..534b2dc927 100644 --- a/server/src/modes/style/stylus/stylus-hover.ts +++ b/server/src/modes/style/stylus/stylus-hover.ts @@ -2,11 +2,7 @@ import { TextDocument, Position, Hover, Range } from 'vscode-languageserver-type import { buildAst, findNodeAtPosition } from './parser'; -// import { -// inspect -// } from 'util' - -import * as cssSchema from './css-schema'; +import { cssData } from './css-browser-data'; import * as _ from 'lodash'; export function stylusHover(document: TextDocument, position: Position): Hover { @@ -25,12 +21,12 @@ export function stylusHover(document: TextDocument, position: Position): Hover { if (node.__type === 'Property') { const property = node.segments[0].name; - const properties = cssSchema.data.css.properties; + const properties = cssData.properties; const item = _.find(properties, item => item.name === property); const lineno = node.lineno - 1; const column = node.column; return { - contents: (item && item.desc) || 'unknown property', + contents: (item && item.description) || 'unknown property', range: Range.create(lineno, column, lineno, column + properties.length) }; } diff --git a/server/yarn.lock b/server/yarn.lock index 444855f3fb..081ada7c87 100644 --- a/server/yarn.lock +++ b/server/yarn.lock @@ -4564,11 +4564,12 @@ vfile@^3.0.0: unist-util-stringify-position "^1.0.0" vfile-message "^1.0.0" -vscode-css-languageservice@^3.0.12: - version "3.0.12" - resolved "https://registry.yarnpkg.com/vscode-css-languageservice/-/vscode-css-languageservice-3.0.12.tgz#fb4aac5ae3c5b761b1db1d7224b78ff824284dc3" +vscode-css-languageservice@^4.0.2-next.3: + version "4.0.2-next.3" + resolved "https://registry.yarnpkg.com/vscode-css-languageservice/-/vscode-css-languageservice-4.0.2-next.3.tgz#f81925d6037f05724d1c1fe00e8fb7fcbece72ff" + integrity sha512-Th6ESBGTdNo4CbZEeKNVBKi4DwGjafS1+05kuoH3hO5mFCKr6ttdvu4GxMHca7nGN1efv5tiZ6slO8PCN1bLNA== dependencies: - vscode-languageserver-types "^3.13.0" + vscode-languageserver-types "^3.14.0" vscode-nls "^4.0.0" vscode-emmet-helper@^1.1.19: @@ -4598,7 +4599,7 @@ vscode-languageserver-types@3.15.0-next.1, vscode-languageserver-types@^3.15.0-n resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.15.0-next.1.tgz#eddca4cf2a2547357006d4f0cc177ddc56043b65" integrity sha512-R0kzmaI8gOGEoU7b9huYQAzgZzRQ/5Q8HKjsIUdfz0MjXcBZ4tr1ik1So1p1O5kGrI1VTCd22Fw/wI7ECGoIPw== -vscode-languageserver-types@^3.13.0, vscode-languageserver-types@^3.6.0-next.1: +vscode-languageserver-types@^3.14.0, vscode-languageserver-types@^3.6.0-next.1: version "3.14.0" resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.14.0.tgz#d3b5952246d30e5241592b6dde8280e03942e743"