From 8aa2064684a88bb1050125e93e3b3fef93302c32 Mon Sep 17 00:00:00 2001 From: Brad Cornes Date: Tue, 13 Sep 2022 17:31:09 +0100 Subject: [PATCH] Merge settings with defaults (#605) --- package-lock.json | 109 +++++++++--------- .../tailwindcss-language-server/package.json | 1 + .../tailwindcss-language-server/src/server.ts | 49 ++++++-- .../src/util/isExcluded.ts | 4 +- .../src/completionProvider.ts | 27 ++--- .../src/hoverProvider.ts | 6 +- .../src/util/find.ts | 2 +- .../src/util/jit.ts | 18 ++- .../src/util/state.ts | 66 ++++++----- .../src/util/stringify.ts | 31 ++--- packages/vscode-tailwindcss/README.md | 2 +- packages/vscode-tailwindcss/package.json | 3 +- 12 files changed, 162 insertions(+), 156 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9bd868f..214efe5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,6 +24,7 @@ "css.escape": "1.5.1", "culori": "0.20.1", "debounce": "1.2.0", + "deepmerge": "4.2.2", "detect-indent": "6.0.0", "detective": "5.2.0", "dlv": "1.1.3", @@ -245,9 +246,9 @@ } }, "node_modules/@babel/helper-define-polyfill-provider": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.2.tgz", - "integrity": "sha512-r9QJJ+uDWrd+94BSPcP6/de67ygLtvVy6cK4luE6MOuDsZIdoaPBnfSpbO/+LTifjPckbKXRuI9BB/Z2/y3iTg==", + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.3.tgz", + "integrity": "sha512-z5aQKU4IzbqCC1XH0nAqfsFLMVSo22SBKUc0BxGrLkolTdPTructy0ToNnlO2zA4j9Q/7pjMZf0DSY+DSTYzww==", "dependencies": { "@babel/helper-compilation-targets": "^7.17.7", "@babel/helper-plugin-utils": "^7.16.7", @@ -1594,11 +1595,11 @@ } }, "node_modules/@babel/preset-env/node_modules/babel-plugin-polyfill-regenerator": { - "version": "0.4.0", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.0.tgz", - "integrity": "sha512-RW1cnryiADFeHmfLS+WW/G431p1PsW5qdRdz0SDRi7TKcUgc7Oh/uXkT7MZ/+tGsT1BkczEAmD5XjUyJ5SWDTw==", + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz", + "integrity": "sha512-NtQGmyQDXjQqQ+IzRkBVwEOz9lQ4zxAQZgoAYEtU9dJjnl1Oc98qnN7jcp+bE7O7aYzVpavXE3/VKXNzUbh7aw==", "dependencies": { - "@babel/helper-define-polyfill-provider": "^0.3.2" + "@babel/helper-define-polyfill-provider": "^0.3.3" }, "peerDependencies": { "@babel/core": "^7.0.0-0" @@ -5383,9 +5384,9 @@ "dev": true }, "node_modules/autoprefixer": { - "version": "10.4.9", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.9.tgz", - "integrity": "sha512-Uu67eduPEmOeA0vyJby5ghu1AAELCCNSsLAjK+lz6kYzNM5sqnBO36MqfsjhPjQF/BaJM5U/UuFYyl7PavY/wQ==", + "version": "10.4.10", + "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.10.tgz", + "integrity": "sha512-nMaiDARyp1e74c8IeAXkr+BmFKa8By4Zak7tyaNPF09Iu39WFpNXOWrVirmXjKr+5cOyERwvtbMOLYz6iBJYgQ==", "funding": [ { "type": "opencollective", @@ -5399,7 +5400,7 @@ "peer": true, "dependencies": { "browserslist": "^4.21.3", - "caniuse-lite": "^1.0.30001394", + "caniuse-lite": "^1.0.30001399", "fraction.js": "^4.2.0", "normalize-range": "^0.1.2", "picocolors": "^1.0.0", @@ -5665,12 +5666,12 @@ } }, "node_modules/babel-plugin-polyfill-corejs2": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.2.tgz", - "integrity": "sha512-LPnodUl3lS0/4wN3Rb+m+UK8s7lj2jcLRrjho4gLw+OJs+I4bvGXshINesY5xx/apM+biTnQ9reDI8yj+0M5+Q==", + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.3.tgz", + "integrity": "sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==", "dependencies": { "@babel/compat-data": "^7.17.7", - "@babel/helper-define-polyfill-provider": "^0.3.2", + "@babel/helper-define-polyfill-provider": "^0.3.3", "semver": "^6.1.1" }, "peerDependencies": { @@ -6147,9 +6148,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001397", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001397.tgz", - "integrity": "sha512-SW9N2TbCdLf0eiNDRrrQXx2sOkaakNZbCjgNpPyMJJbiOrU5QzMIrXOVMRM1myBXTD5iTkdrtU/EguCrBocHlA==", + "version": "1.0.30001399", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001399.tgz", + "integrity": "sha512-4vQ90tMKS+FkvuVWS5/QY1+d805ODxZiKFzsU8o/RsVJz49ZSRR8EjykLJbqhzdPgadbX6wB538wOzle3JniRA==", "funding": [ { "type": "opencollective", @@ -7363,9 +7364,9 @@ } }, "node_modules/date-fns": { - "version": "2.29.2", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.2.tgz", - "integrity": "sha512-0VNbwmWJDS/G3ySwFSJA3ayhbURMTJLtwM2DTxf9CWondCnh6DTNlO9JgRSq6ibf4eD0lfMJNBxUdEAHHix+bA==", + "version": "2.29.3", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz", + "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==", "engines": { "node": ">=0.11" }, @@ -7755,9 +7756,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.247", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.247.tgz", - "integrity": "sha512-FLs6R4FQE+1JHM0hh3sfdxnYjKvJpHZyhQDjc2qFq/xFvmmRt/TATNToZhrcGUFzpF2XjeiuozrA8lI0PZmYYw==" + "version": "1.4.248", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.248.tgz", + "integrity": "sha512-qShjzEYpa57NnhbW2K+g+Fl+eNoDvQ7I+2MRwWnU6Z6F0HhXekzsECCLv+y2OJUsRodjqoSfwHkIX42VUFtUzg==" }, "node_modules/emoji-regex": { "version": "9.2.2", @@ -19972,9 +19973,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.7.tgz", - "integrity": "sha512-iN/XYesmZ2RmmWAiI4Z5rq0YqSiv0brj9Ce9CfhNE4xIW2h+MFxcgkxIzZ+ShkFPUkjU3gQ+3oypadD3RAMtrg==", + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.9.tgz", + "integrity": "sha512-/xsqn21EGVdXI3EXSum1Yckj3ZVZugqyOZQ/CxYPBD/R+ko9NSUScf8tFF4dOKY+2pvSSJA/S+5B8s4Zr4kyvg==", "funding": [ { "type": "opencollective", @@ -21032,9 +21033,9 @@ } }, "@babel/helper-define-polyfill-provider": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.2.tgz", - "integrity": "sha512-r9QJJ+uDWrd+94BSPcP6/de67ygLtvVy6cK4luE6MOuDsZIdoaPBnfSpbO/+LTifjPckbKXRuI9BB/Z2/y3iTg==", + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.3.3.tgz", + "integrity": "sha512-z5aQKU4IzbqCC1XH0nAqfsFLMVSo22SBKUc0BxGrLkolTdPTructy0ToNnlO2zA4j9Q/7pjMZf0DSY+DSTYzww==", "requires": { "@babel/helper-compilation-targets": "^7.17.7", "@babel/helper-plugin-utils": "^7.16.7", @@ -21935,11 +21936,11 @@ }, "dependencies": { "babel-plugin-polyfill-regenerator": { - "version": "0.4.0", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.0.tgz", - "integrity": "sha512-RW1cnryiADFeHmfLS+WW/G431p1PsW5qdRdz0SDRi7TKcUgc7Oh/uXkT7MZ/+tGsT1BkczEAmD5XjUyJ5SWDTw==", + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz", + "integrity": "sha512-NtQGmyQDXjQqQ+IzRkBVwEOz9lQ4zxAQZgoAYEtU9dJjnl1Oc98qnN7jcp+bE7O7aYzVpavXE3/VKXNzUbh7aw==", "requires": { - "@babel/helper-define-polyfill-provider": "^0.3.2" + "@babel/helper-define-polyfill-provider": "^0.3.3" } }, "semver": { @@ -25022,13 +25023,13 @@ "dev": true }, "autoprefixer": { - "version": "10.4.9", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.9.tgz", - "integrity": "sha512-Uu67eduPEmOeA0vyJby5ghu1AAELCCNSsLAjK+lz6kYzNM5sqnBO36MqfsjhPjQF/BaJM5U/UuFYyl7PavY/wQ==", + "version": "10.4.10", + "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.10.tgz", + "integrity": "sha512-nMaiDARyp1e74c8IeAXkr+BmFKa8By4Zak7tyaNPF09Iu39WFpNXOWrVirmXjKr+5cOyERwvtbMOLYz6iBJYgQ==", "peer": true, "requires": { "browserslist": "^4.21.3", - "caniuse-lite": "^1.0.30001394", + "caniuse-lite": "^1.0.30001399", "fraction.js": "^4.2.0", "normalize-range": "^0.1.2", "picocolors": "^1.0.0", @@ -25229,12 +25230,12 @@ } }, "babel-plugin-polyfill-corejs2": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.2.tgz", - "integrity": "sha512-LPnodUl3lS0/4wN3Rb+m+UK8s7lj2jcLRrjho4gLw+OJs+I4bvGXshINesY5xx/apM+biTnQ9reDI8yj+0M5+Q==", + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.3.tgz", + "integrity": "sha512-8hOdmFYFSZhqg2C/JgLUQ+t52o5nirNwaWM2B9LWteozwIvM14VSwdsCAUET10qT+kmySAlseadmfeeSWFCy+Q==", "requires": { "@babel/compat-data": "^7.17.7", - "@babel/helper-define-polyfill-provider": "^0.3.2", + "@babel/helper-define-polyfill-provider": "^0.3.3", "semver": "^6.1.1" }, "dependencies": { @@ -25613,9 +25614,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001397", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001397.tgz", - "integrity": "sha512-SW9N2TbCdLf0eiNDRrrQXx2sOkaakNZbCjgNpPyMJJbiOrU5QzMIrXOVMRM1myBXTD5iTkdrtU/EguCrBocHlA==" + "version": "1.0.30001399", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001399.tgz", + "integrity": "sha512-4vQ90tMKS+FkvuVWS5/QY1+d805ODxZiKFzsU8o/RsVJz49ZSRR8EjykLJbqhzdPgadbX6wB538wOzle3JniRA==" }, "capture-exit": { "version": "2.0.0", @@ -26570,9 +26571,9 @@ } }, "date-fns": { - "version": "2.29.2", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.2.tgz", - "integrity": "sha512-0VNbwmWJDS/G3ySwFSJA3ayhbURMTJLtwM2DTxf9CWondCnh6DTNlO9JgRSq6ibf4eD0lfMJNBxUdEAHHix+bA==" + "version": "2.29.3", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz", + "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==" }, "dateformat": { "version": "3.0.3", @@ -26872,9 +26873,9 @@ } }, "electron-to-chromium": { - "version": "1.4.247", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.247.tgz", - "integrity": "sha512-FLs6R4FQE+1JHM0hh3sfdxnYjKvJpHZyhQDjc2qFq/xFvmmRt/TATNToZhrcGUFzpF2XjeiuozrA8lI0PZmYYw==" + "version": "1.4.248", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.248.tgz", + "integrity": "sha512-qShjzEYpa57NnhbW2K+g+Fl+eNoDvQ7I+2MRwWnU6Z6F0HhXekzsECCLv+y2OJUsRodjqoSfwHkIX42VUFtUzg==" }, "emoji-regex": { "version": "9.2.2", @@ -36312,9 +36313,9 @@ "dev": true }, "update-browserslist-db": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.7.tgz", - "integrity": "sha512-iN/XYesmZ2RmmWAiI4Z5rq0YqSiv0brj9Ce9CfhNE4xIW2h+MFxcgkxIzZ+ShkFPUkjU3gQ+3oypadD3RAMtrg==", + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.9.tgz", + "integrity": "sha512-/xsqn21EGVdXI3EXSum1Yckj3ZVZugqyOZQ/CxYPBD/R+ko9NSUScf8tFF4dOKY+2pvSSJA/S+5B8s4Zr4kyvg==", "requires": { "escalade": "^3.1.1", "picocolors": "^1.0.0" diff --git a/packages/tailwindcss-language-server/package.json b/packages/tailwindcss-language-server/package.json index 14fb8f0..ea88ca4 100644 --- a/packages/tailwindcss-language-server/package.json +++ b/packages/tailwindcss-language-server/package.json @@ -44,6 +44,7 @@ "color-name": "1.1.4", "culori": "0.20.1", "debounce": "1.2.0", + "deepmerge": "4.2.2", "detective": "5.2.0", "dlv": "1.1.3", "dset": "3.1.2", diff --git a/packages/tailwindcss-language-server/src/server.ts b/packages/tailwindcss-language-server/src/server.ts index 52db059..a1355ff 100644 --- a/packages/tailwindcss-language-server/src/server.ts +++ b/packages/tailwindcss-language-server/src/server.ts @@ -78,10 +78,11 @@ import { getColor } from 'tailwindcss-language-service/src/util/color' import * as culori from 'culori' import namedColors from 'color-name' import tailwindPlugins from './lib/plugins' -import isExcluded, { DEFAULT_FILES_EXCLUDE } from './util/isExcluded' +import isExcluded from './util/isExcluded' import { getFileFsPath, normalizeFileNameToFsPath } from './util/uri' import { equal } from 'tailwindcss-language-service/src/util/array' import preflight from 'tailwindcss/lib/css/preflight.css' +import merge from 'deepmerge' // @ts-ignore global.__preflight = preflight @@ -238,7 +239,42 @@ async function createProjectService( scopeUri: uri, }), ]) - let config: Settings = { editor, tailwindCSS } + editor = isObject(editor) ? editor : {} + tailwindCSS = isObject(tailwindCSS) ? tailwindCSS : {} + + let config: Settings = merge( + { + editor: { tabSize: 2 }, + tailwindCSS: { + emmetCompletions: false, + classAttributes: ['class', 'className', 'ngClass'], + codeActions: true, + hovers: true, + suggestions: true, + validate: true, + colorDecorators: true, + rootFontSize: 16, + lint: { + cssConflict: 'warning', + invalidApply: 'error', + invalidScreen: 'error', + invalidVariant: 'error', + invalidConfigPath: 'error', + invalidTailwindDirective: 'error', + recommendedVariantOrder: 'warning', + }, + showPixelEquivalents: true, + includeLanguages: {}, + files: { exclude: ['**/.git/**', '**/node_modules/**', '**/.hg/**', '**/.svn/**'] }, + experimental: { + classRegex: [], + configFile: null, + }, + }, + }, + { editor, tailwindCSS }, + { arrayMerge: (_destinationArray, sourceArray, _options) => sourceArray } + ) documentSettingsCache.set(uri, config) return config } @@ -266,7 +302,7 @@ async function createProjectService( } let chokidarWatcher: chokidar.FSWatcher - let ignore = state.editor.globalSettings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE + let ignore = state.editor.globalSettings.tailwindCSS.files.exclude function onFileEvents(changes: Array<{ file: string; type: FileChangeType }>): void { let needsInit = false @@ -421,7 +457,7 @@ async function createProjectService( configPath = ( await glob([`**/${CONFIG_FILE_GLOB}`], { cwd: folder, - ignore: state.editor.globalSettings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE, + ignore: state.editor.globalSettings.tailwindCSS.files.exclude, onlyFiles: true, absolute: true, suppressErrors: true, @@ -937,10 +973,9 @@ async function createProjectService( }, async onUpdateSettings(settings: any): Promise { documentSettingsCache.clear() - let previousExclude = - state.editor.globalSettings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE + let previousExclude = state.editor.globalSettings.tailwindCSS.files.exclude state.editor.globalSettings = await state.editor.getConfiguration() - if (!equal(previousExclude, settings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE)) { + if (!equal(previousExclude, settings.tailwindCSS.files.exclude)) { tryInit() } else { if (state.enabled) { diff --git a/packages/tailwindcss-language-server/src/util/isExcluded.ts b/packages/tailwindcss-language-server/src/util/isExcluded.ts index 62d1f9e..9f48b83 100644 --- a/packages/tailwindcss-language-server/src/util/isExcluded.ts +++ b/packages/tailwindcss-language-server/src/util/isExcluded.ts @@ -4,13 +4,11 @@ import { State } from 'tailwindcss-language-service/src/util/state' import { TextDocument } from 'vscode-languageserver-textdocument' import { getFileFsPath } from './uri' -export const DEFAULT_FILES_EXCLUDE = ['**/.git/**', '**/.svn/**', '**/.hg/**', '**/node_modules/**'] - export default async function isExcluded(state: State, document: TextDocument): Promise { let settings = await state.editor.getConfiguration(document.uri) let file = getFileFsPath(document.uri) - for (let pattern of settings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE) { + for (let pattern of settings.tailwindCSS.files.exclude) { if (minimatch(file, path.join(state.editor.folder, pattern))) { return true } diff --git a/packages/tailwindcss-language-service/src/completionProvider.ts b/packages/tailwindcss-language-service/src/completionProvider.ts index 5be8c60..8ac5876 100644 --- a/packages/tailwindcss-language-service/src/completionProvider.ts +++ b/packages/tailwindcss-language-service/src/completionProvider.ts @@ -1,4 +1,4 @@ -import { State } from './util/state' +import { Settings, State } from './util/state' import type { CompletionItem, CompletionItemKind, @@ -400,7 +400,7 @@ async function provideCustomClassNameCompletions( position: Position ): Promise { const settings = await state.editor.getConfiguration(document.uri) - const regexes = dlv(settings, 'tailwindCSS.experimental.classRegex', []) + const regexes = settings.tailwindCSS.experimental.classRegex if (regexes.length === 0) return null const positionOffset = document.offsetAt(position) @@ -1109,11 +1109,7 @@ export async function resolveCompletionItem( item.detail = await getCssDetail(state, className) if (!item.documentation) { const settings = await state.editor.getConfiguration() - const css = stringifyCss(item.data.join(':'), className, { - tabSize: dlv(settings, 'editor.tabSize', 2), - showPixelEquivalents: dlv(settings, 'tailwindCSS.showPixelEquivalents', true), - rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), - }) + const css = stringifyCss(item.data.join(':'), className, settings) if (css) { item.documentation = { kind: 'markdown' as typeof MarkupKind.Markdown, @@ -1141,13 +1137,7 @@ function isContextItem(state: State, keys: string[]): boolean { return isObject(item.__info) && !item.__info.__rule } -function stringifyDecls( - obj: any, - { - showPixelEquivalents = false, - rootFontSize = 16, - }: Partial<{ showPixelEquivalents: boolean; rootFontSize: number }> = {} -): string { +function stringifyDecls(obj: any, settings: Settings): string { let props = Object.keys(obj) let nonCustomProps = props.filter((prop) => !prop.startsWith('--')) @@ -1159,7 +1149,9 @@ function stringifyDecls( .map((prop) => ensureArray(obj[prop]) .map((value) => { - const px = showPixelEquivalents ? remToPx(value, rootFontSize) : undefined + const px = settings.tailwindCSS.showPixelEquivalents + ? remToPx(value, settings.tailwindCSS.rootFontSize) + : undefined return `${prop}: ${value}${px ? `/* ${px} */` : ''};` }) .join(' ') @@ -1173,10 +1165,7 @@ async function getCssDetail(state: State, className: any): Promise { } if (className.__rule === true) { const settings = await state.editor.getConfiguration() - return stringifyDecls(removeMeta(className), { - showPixelEquivalents: dlv(settings, 'tailwindCSS.showPixelEquivalents', true), - rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), - }) + return stringifyDecls(removeMeta(className), settings) } return null } diff --git a/packages/tailwindcss-language-service/src/hoverProvider.ts b/packages/tailwindcss-language-service/src/hoverProvider.ts index 5ea1fcb..090482e 100644 --- a/packages/tailwindcss-language-service/src/hoverProvider.ts +++ b/packages/tailwindcss-language-service/src/hoverProvider.ts @@ -106,11 +106,7 @@ async function provideClassNameHover( const css = stringifyCss( className.className, dlv(state.classNames.classNames, [...parts, '__info']), - { - tabSize: dlv(settings, 'editor.tabSize', 2), - showPixelEquivalents: dlv(settings, 'tailwindCSS.showPixelEquivalents', true), - rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), - } + settings ) if (!css) return null diff --git a/packages/tailwindcss-language-service/src/util/find.ts b/packages/tailwindcss-language-service/src/util/find.ts index 5b70d7a..4e85115 100644 --- a/packages/tailwindcss-language-service/src/util/find.ts +++ b/packages/tailwindcss-language-service/src/util/find.ts @@ -124,7 +124,7 @@ async function findCustomClassLists( range?: Range ): Promise { const settings = await state.editor.getConfiguration(doc.uri) - const regexes = dlv(settings, 'tailwindCSS.experimental.classRegex', []) + const regexes = settings.tailwindCSS.experimental.classRegex if (!Array.isArray(regexes) || regexes.length === 0) return [] diff --git a/packages/tailwindcss-language-service/src/util/jit.ts b/packages/tailwindcss-language-service/src/util/jit.ts index 27153b1..d308960 100644 --- a/packages/tailwindcss-language-service/src/util/jit.ts +++ b/packages/tailwindcss-language-service/src/util/jit.ts @@ -29,19 +29,15 @@ export function generateRules(state: State, classNames: string[]): { root: Root; export async function stringifyRoot(state: State, root: Root, uri?: string): Promise { let settings = await state.editor.getConfiguration(uri) - let tabSize = dlv(settings, 'editor.tabSize', 2) - let showPixelEquivalents = dlv(settings, 'tailwindCSS.showPixelEquivalents', true) - let rootFontSize = dlv(settings, 'tailwindCSS.rootFontSize', 16) - let clone = root.clone() clone.walkAtRules('defaults', (node) => { node.remove() }) - if (showPixelEquivalents) { + if (settings.tailwindCSS.showPixelEquivalents) { clone.walkDecls((decl) => { - let px = remToPx(decl.value, rootFontSize) + let px = remToPx(decl.value, settings.tailwindCSS.rootFontSize) if (px) { decl.value = `${decl.value}/* ${px} */` } @@ -51,7 +47,9 @@ export async function stringifyRoot(state: State, root: Root, uri?: string): Pro return clone .toString() .replace(/([^;{}\s])(\n\s*})/g, (_match, before, after) => `${before};${after}`) - .replace(/^(?: )+/gm, (indent: string) => ' '.repeat((indent.length / 4) * tabSize)) + .replace(/^(?: )+/gm, (indent: string) => + ' '.repeat((indent.length / 4) * settings.editor.tabSize) + ) } export function stringifyRules(state: State, rules: Rule[], tabSize: number = 2): string { @@ -63,12 +61,12 @@ export function stringifyRules(state: State, rules: Rule[], tabSize: number = 2) export async function stringifyDecls(state: State, rule: Rule, uri?: string): Promise { let settings = await state.editor.getConfiguration(uri) - let showPixelEquivalents = dlv(settings, 'tailwindCSS.showPixelEquivalents', true) - let rootFontSize = dlv(settings, 'tailwindCSS.rootFontSize', 16) let result = [] rule.walkDecls(({ prop, value }) => { - let px = showPixelEquivalents ? remToPx(value, rootFontSize) : undefined + let px = settings.tailwindCSS.showPixelEquivalents + ? remToPx(value, settings.tailwindCSS.rootFontSize) + : undefined result.push(`${prop}: ${value}${px ? `/* ${px} */` : ''};`) }) return result.join(' ') diff --git a/packages/tailwindcss-language-service/src/util/state.ts b/packages/tailwindcss-language-service/src/util/state.ts index ff34d5b..d699ffb 100644 --- a/packages/tailwindcss-language-service/src/util/state.ts +++ b/packages/tailwindcss-language-service/src/util/state.ts @@ -33,38 +33,42 @@ export type EditorState = { type DiagnosticSeveritySetting = 'ignore' | 'warning' | 'error' +export type EditorSettings = { + tabSize: number +} + +export type TailwindCssSettings = { + emmetCompletions: boolean + includeLanguages: Record + classAttributes: string[] + suggestions: boolean + hovers: boolean + codeActions: boolean + validate: boolean + showPixelEquivalents: boolean + rootFontSize: number + colorDecorators: boolean + lint: { + cssConflict: DiagnosticSeveritySetting + invalidApply: DiagnosticSeveritySetting + invalidScreen: DiagnosticSeveritySetting + invalidVariant: DiagnosticSeveritySetting + invalidConfigPath: DiagnosticSeveritySetting + invalidTailwindDirective: DiagnosticSeveritySetting + recommendedVariantOrder: DiagnosticSeveritySetting + } + experimental: { + classRegex: string[] + configFile: string | Record + } + files: { + exclude: string[] + } +} + export type Settings = { - editor: { - tabSize: number - } - tailwindCSS: { - emmetCompletions: boolean - includeLanguages: Record - classAttributes: string[] - suggestions: boolean - hovers: boolean - codeActions: boolean - validate: boolean - showPixelEquivalents: boolean - rootFontSize: number - colorDecorators: boolean - lint: { - cssConflict: DiagnosticSeveritySetting - invalidApply: DiagnosticSeveritySetting - invalidScreen: DiagnosticSeveritySetting - invalidVariant: DiagnosticSeveritySetting - invalidConfigPath: DiagnosticSeveritySetting - invalidTailwindDirective: DiagnosticSeveritySetting - recommendedVariantOrder: DiagnosticSeveritySetting - } - experimental: { - classRegex: string[] - configFile: string | Record - } - files: { - exclude: string[] - } - } + editor: EditorSettings + tailwindCSS: TailwindCssSettings } export interface FeatureFlags { diff --git a/packages/tailwindcss-language-service/src/util/stringify.ts b/packages/tailwindcss-language-service/src/util/stringify.ts index 443d1ad..59a0e7b 100644 --- a/packages/tailwindcss-language-service/src/util/stringify.ts +++ b/packages/tailwindcss-language-service/src/util/stringify.ts @@ -5,6 +5,7 @@ import { ensureArray } from './array' import { remToPx } from './remToPx' import stringifyObject from 'stringify-object' import isObject from './isObject' +import { Settings } from './state' export function stringifyConfigValue(x: any): string { if (isObject(x)) return `${Object.keys(x).length} values` @@ -21,37 +22,17 @@ export function stringifyConfigValue(x: any): string { }) } -export function stringifyCss( - className: string, - obj: any, - { - tabSize = 2, - showPixelEquivalents = false, - rootFontSize = 16, - }: Partial<{ - tabSize: number - showPixelEquivalents: boolean - rootFontSize: number - }> = {} -): string { +export function stringifyCss(className: string, obj: any, settings: Settings): string { if (obj.__rule !== true && !Array.isArray(obj)) return null if (Array.isArray(obj)) { - const rules = obj - .map((x) => - stringifyCss(className, x, { - tabSize, - showPixelEquivalents, - rootFontSize, - }) - ) - .filter(Boolean) + const rules = obj.map((x) => stringifyCss(className, x, settings)).filter(Boolean) if (rules.length === 0) return null return rules.join('\n\n') } let css = `` - const indent = ' '.repeat(tabSize) + const indent = ' '.repeat(settings.editor.tabSize) const context = dlv(obj, '__context', []) const props = Object.keys(removeMeta(obj)) @@ -65,7 +46,9 @@ export function stringifyCss( const decls = props.reduce((acc, curr, i) => { const propStr = ensureArray(obj[curr]) .map((val) => { - const px = showPixelEquivalents ? remToPx(val, rootFontSize) : undefined + const px = settings.tailwindCSS.showPixelEquivalents + ? remToPx(val, settings.tailwindCSS.rootFontSize) + : undefined return `${indentStr + indent}${curr}: ${val}${px ? `/* ${px} */` : ''};` }) .join('\n') diff --git a/packages/vscode-tailwindcss/README.md b/packages/vscode-tailwindcss/README.md index 3a2eb4c..8c75886 100644 --- a/packages/vscode-tailwindcss/README.md +++ b/packages/vscode-tailwindcss/README.md @@ -70,7 +70,7 @@ This setting allows you to add additional language support. The key of each entr ### `tailwindCSS.files.exclude` -Configure glob patterns to exclude from all IntelliSense features. Inherits all glob patterns from the `files.exclude` setting. **Default: ["\*\*/.git/\*\*", "\*\*/node_modules/\*\*", "\*\*/.hg/\*\*"]** +Configure glob patterns to exclude from all IntelliSense features. Inherits all glob patterns from the `files.exclude` setting. **Default: ["\*\*/.git/\*\*", "\*\*/node_modules/\*\*", "\*\*/.hg/\*\*", "\*\*/.svn/\*\*"]** ### `tailwindCSS.emmetCompletions` diff --git a/packages/vscode-tailwindcss/package.json b/packages/vscode-tailwindcss/package.json index 5f5b621..9d62536 100755 --- a/packages/vscode-tailwindcss/package.json +++ b/packages/vscode-tailwindcss/package.json @@ -150,7 +150,8 @@ "default": [ "**/.git/**", "**/node_modules/**", - "**/.hg/**" + "**/.hg/**", + "**/.svn/**" ], "markdownDescription": "Configure glob patterns to exclude from all IntelliSense features. Inherits all glob patterns from the `#files.exclude#` setting." },