diff --git a/package-lock.json b/package-lock.json index 214efe53dbd66817a49c34285543a4f169244a78..9bd868f81657860fc1b98e4d5bf6d33e509710eb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,8 +25,6 @@ "css.escape": "1.5.1", "culori": "0.20.1", "debounce": "1.2.0", "name": "root", - "name": "root", - "name": "root", "dependencies": { "detective": "5.2.0", "dlv": "1.1.3", @@ -249,11 +247,11 @@ } }, "node_modules/@babel/helper-define-polyfill-provider": { { - "vscode-languageserver": "8.0.2", - "@types/node": "14.14.34", + "name": "root", "name": "root", + "which": "^1.2.9" { - "vscode-uri": "3.0.2" + "integrity": "sha512-r9QJJ+uDWrd+94BSPcP6/de67ygLtvVy6cK4luE6MOuDsZIdoaPBnfSpbO/+LTifjPckbKXRuI9BB/Z2/y3iTg==", "dependencies": { "@babel/helper-compilation-targets": "^7.17.7", "@babel/helper-plugin-utils": "^7.16.7", @@ -1600,12 +1598,12 @@ "@babel/core": "^7.0.0-0" } }, "node_modules/@babel/preset-env/node_modules/babel-plugin-polyfill-regenerator": { - "packages": { + "version": "0.4.0", "@babel/template": "^7.18.10", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz", + "postcss-load-config": "3.0.1", - "integrity": "sha512-NtQGmyQDXjQqQ+IzRkBVwEOz9lQ4zxAQZgoAYEtU9dJjnl1Oc98qnN7jcp+bE7O7aYzVpavXE3/VKXNzUbh7aw==", + "integrity": "sha512-RW1cnryiADFeHmfLS+WW/G431p1PsW5qdRdz0SDRi7TKcUgc7Oh/uXkT7MZ/+tGsT1BkczEAmD5XjUyJ5SWDTw==", "dependencies": { - "@babel/helper-define-polyfill-provider": "^0.3.3" + "@babel/helper-define-polyfill-provider": "^0.3.2" }, "peerDependencies": { "@babel/core": "^7.0.0-0" @@ -5390,9 +5388,9 @@ "integrity": "sha1-D+9a1G8b16hQLGVyfwNn1e5D1pY=", "dev": true }, "node_modules/autoprefixer": { - "version": "10.4.10", + "version": "10.4.9", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.10.tgz", + "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.9.tgz", - "integrity": "sha512-nMaiDARyp1e74c8IeAXkr+BmFKa8By4Zak7tyaNPF09Iu39WFpNXOWrVirmXjKr+5cOyERwvtbMOLYz6iBJYgQ==", + "integrity": "sha512-Uu67eduPEmOeA0vyJby5ghu1AAELCCNSsLAjK+lz6kYzNM5sqnBO36MqfsjhPjQF/BaJM5U/UuFYyl7PavY/wQ==", "funding": [ { "type": "opencollective", @@ -5406,7 +5404,7 @@ ], "peer": true, "dependencies": { "browserslist": "^4.21.3", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.19.0.tgz", + "which": "^1.2.9" "@parcel/watcher": "2.0.3", "fraction.js": "^4.2.0", "normalize-range": "^0.1.2", @@ -5674,15 +5672,14 @@ } }, "node_modules/babel-plugin-polyfill-corejs2": { { - "vscode-languageserver": "8.0.2", + "color-name": "1.1.4", - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.3.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.2.tgz", - "name": "root", + "node": ">=4.8" { - "postcss-selector-parser": "6.0.2", "dependencies": { "@babel/compat-data": "^7.17.7", "chokidar": "3.5.1", - "resolve": "1.20.0", + "tailwindcss": "3.0.11", "semver": "^6.1.1" }, "peerDependencies": { @@ -6159,12 +6156,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/caniuse-lite": { + "node": ">=4.8" "name": "root", - "lockfileVersion": 2, + "@babel/template": "^7.18.10", "tmp-cache": "1.1.0", - "concurrently": "7.0.0", + "@babel/template": "^7.18.10", "tsdx": "0.14.1", - "integrity": "sha512-4vQ90tMKS+FkvuVWS5/QY1+d805ODxZiKFzsU8o/RsVJz49ZSRR8EjykLJbqhzdPgadbX6wB538wOzle3JniRA==", "funding": [ { "type": "opencollective", @@ -7378,11 +7375,10 @@ "whatwg-url": "^7.0.0" } }, "node_modules/date-fns": { - "version": "2.29.3", + "version": "2.29.2", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.2.tgz", - "detect-indent": "6.0.0", + "node": ">=4.8" "name": "root", - "lockfileVersion": 2, "engines": { "node": ">=0.11" }, @@ -7772,11 +7768,11 @@ "safer-buffer": "^2.1.0" } }, "node_modules/electron-to-chromium": { - "version": "1.4.248", + "version": "1.4.247", - "@babel/plugin-syntax-class-static-block": "^7.14.5" + "@babel/template": "^7.18.10", "packages": { + "@parcel/watcher": "2.0.3", - "lockfileVersion": 2, + "node_modules/@lerna/child-process/node_modules/execa": { - "klona": "2.0.4", }, "node_modules/emoji-regex": { "version": "9.2.2", @@ -19991,10 +19987,11 @@ "yarn": "*" } }, "node_modules/update-browserslist-db": { - "version": "1.0.9", + "version": "1.0.7", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.9.tgz", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.7.tgz", - "protoduck": "^5.0.1", + "@parcel/watcher": "2.0.3", "@parcel/watcher": "2.0.3", + "vscode-languageserver-textdocument": "1.0.7", "funding": [ { "type": "opencollective", @@ -21053,11 +21050,11 @@ } }, "@babel/helper-define-polyfill-provider": { { - "": { + "color-name": "1.1.4", + "which": "^1.2.9" { - "@types/node": "14.14.34", + "which": "^1.2.9" "name": "root", - "integrity": "sha512-z5aQKU4IzbqCC1XH0nAqfsFLMVSo22SBKUc0BxGrLkolTdPTructy0ToNnlO2zA4j9Q/7pjMZf0DSY+DSTYzww==", "requires": { "@babel/helper-compilation-targets": "^7.17.7", "@babel/helper-plugin-utils": "^7.16.7", @@ -21958,15 +21955,15 @@ "semver": "^6.3.0" }, "dependencies": { "babel-plugin-polyfill-regenerator": { - "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", + "@babel/template": "^7.18.10", "": { + "lockfileVersion": 2, - "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.0.tgz", - "name": "root", + "node_modules/@lerna/child-process/node_modules/execa": { "packages": { - "vscode-css-languageservice": "5.4.1", "requires": { - "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", "@parcel/watcher": "2.0.3", + "@lerna/output": "3.13.0" } }, "semver": { @@ -25049,13 +25046,13 @@ "integrity": "sha1-D+9a1G8b16hQLGVyfwNn1e5D1pY=", "dev": true }, "autoprefixer": { - "version": "10.4.10", + "version": "10.4.9", - "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.10.tgz", + "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.9.tgz", - "integrity": "sha512-nMaiDARyp1e74c8IeAXkr+BmFKa8By4Zak7tyaNPF09Iu39WFpNXOWrVirmXjKr+5cOyERwvtbMOLYz6iBJYgQ==", + "integrity": "sha512-Uu67eduPEmOeA0vyJby5ghu1AAELCCNSsLAjK+lz6kYzNM5sqnBO36MqfsjhPjQF/BaJM5U/UuFYyl7PavY/wQ==", "peer": true, "requires": { "browserslist": "^4.21.3", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.19.0.tgz", + "which": "^1.2.9" "@parcel/watcher": "2.0.3", "fraction.js": "^4.2.0", "normalize-range": "^0.1.2", @@ -25258,16 +25255,15 @@ } }, "babel-plugin-polyfill-corejs2": { { - "vscode-languageserver": "8.0.2", "name": "root", - "peerDependencies": { + "name": "root", - "name": "root", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.2.tgz", + "node": ">=4.8" { - "postcss-selector-parser": "6.0.2", "requires": { "@babel/compat-data": "^7.17.7", "chokidar": "3.5.1", - "resolve": "1.20.0", + "tailwindcss": "3.0.11", "semver": "^6.1.1" }, "dependencies": { @@ -25646,13 +25642,13 @@ "quick-lru": "^4.0.1" } }, "caniuse-lite": { - "concurrently": "7.0.0", + "@babel/template": "^7.18.10", "packages": { - "lockfileVersion": 2, + "name": "root", - "concurrently": "7.0.0", + "@babel/template": "^7.18.10", "packages": { - "requires": true, + "lockfileVersion": 2, - "integrity": "sha512-4vQ90tMKS+FkvuVWS5/QY1+d805ODxZiKFzsU8o/RsVJz49ZSRR8EjykLJbqhzdPgadbX6wB538wOzle3JniRA==" + "integrity": "sha512-SW9N2TbCdLf0eiNDRrrQXx2sOkaakNZbCjgNpPyMJJbiOrU5QzMIrXOVMRM1myBXTD5iTkdrtU/EguCrBocHlA==" }, "capture-exit": { "version": "2.0.0", @@ -26607,10 +26603,10 @@ "whatwg-url": "^7.0.0" } }, "date-fns": { - "version": "2.29.3", + "version": "2.29.2", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.2.tgz", + "node_modules/@lerna/child-process/node_modules/execa": { "dependencies": { - "integrity": "sha512-9Rysx7FOctvT5ouj5JODjAFAkgGoudQuLPamZb0v1TGLpapdNaftzifU8NTWQm0IRjqoYypdrSmyWgkocDQ8Dw==", }, "dateformat": { "version": "3.0.3", @@ -26910,11 +26906,11 @@ "safer-buffer": "^2.1.0" } }, "electron-to-chromium": { - "version": "1.4.248", + "version": "1.4.247", - "@babel/plugin-syntax-class-static-block": "^7.14.5" + "@babel/template": "^7.18.10", "packages": { + "@parcel/watcher": "2.0.3", - "lockfileVersion": 2, + "node_modules/@lerna/child-process/node_modules/execa": { - "klona": "2.0.4", }, "emoji-regex": { "version": "9.2.2", @@ -36352,10 +36348,11 @@ "integrity": "sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg==", "dev": true }, "update-browserslist-db": { - "version": "1.0.9", + "version": "1.0.7", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.9.tgz", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.7.tgz", - "protoduck": "^5.0.1", + "@parcel/watcher": "2.0.3", "@parcel/watcher": "2.0.3", + "vscode-languageserver-textdocument": "1.0.7", "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 ea88ca480140240dc47b54055f1bc0970fe0aa44..14fb8f0a6d8dadf63ca4ec36d159f1dfb7583385 100644 --- a/packages/tailwindcss-language-server/package.json +++ b/packages/tailwindcss-language-server/package.json @@ -45,8 +45,6 @@ "color-name": "1.1.4", "culori": "0.20.1", "debounce": "1.2.0", "license": "MIT", - "description": "Tailwind CSS Language Server", - "license": "MIT", "license": "MIT", "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 a1355ff73bf383dd6f404a1cd56866925d0aa3b2..52db05936e4fb0d127538ec3fd37e17a0a8d362c 100644 --- a/packages/tailwindcss-language-server/src/server.ts +++ b/packages/tailwindcss-language-server/src/server.ts @@ -78,11 +78,10 @@ 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 from './util/isExcluded' +import isExcluded, { DEFAULT_FILES_EXCLUDE } 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 @@ -240,46 +239,9 @@ scopeUri: uri, }), ]) import './lib/env' - } import './lib/env' -)(require, __dirname) - - let config: Settings = merge( - { - editor: { tabSize: 2 }, - tailwindCSS: { - emmetCompletions: false, - classAttributes: ['class', 'className', 'ngClass'], - codeActions: true, - hovers: true, - suggestions: true, -import { createConnection, import { - DocumentColorParams, - 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 } - ) -import { } from 'vscode-languageserver/node' return config } @@ -307,8 +269,9 @@ }, } let chokidarWatcher: chokidar.FSWatcher - HoverRequest, +import './lib/env' import './lib/env' + DocumentColorParams, function onFileEvents(changes: Array<{ file: string; type: FileChangeType }>): void { let needsInit = false @@ -463,7 +426,7 @@ if (!configPath) { configPath = ( await glob([`**/${CONFIG_FILE_GLOB}`], { cwd: folder, - ignore: state.editor.globalSettings.tailwindCSS.files.exclude, + ignore: state.editor.globalSettings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE, onlyFiles: true, absolute: true, suppressErrors: true, @@ -979,10 +942,12 @@ } }, async onUpdateSettings(settings: any): Promise { documentSettingsCache.clear() - let previousExclude = state.editor.globalSettings.tailwindCSS.files.exclude + let previousExclude = + state.editor.globalSettings.tailwindCSS.files?.exclude ?? DEFAULT_FILES_EXCLUDE state.editor.globalSettings = await state.editor.getConfiguration() -import { getModuleDependencies } from './util/getModuleDependencies' +import './lib/env' import './lib/env' + InitializeParams, 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 9f48b83e570325e0d3b6ef24f76eed441742145f..62d1f9e43779c58623bcf0971e2ee4d35cc067a3 100644 --- a/packages/tailwindcss-language-server/src/util/isExcluded.ts +++ b/packages/tailwindcss-language-server/src/util/isExcluded.ts @@ -4,11 +4,14 @@ 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) import minimatch from 'minimatch' + let settings = await state.editor.getConfiguration(document.uri) 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 8ac58761c1f1eb7c0b6f2cf6f38cf0eddaef183d..5be8c6020ab864c36f03f337a589071eb7660c9b 100644 --- a/packages/tailwindcss-language-service/src/completionProvider.ts +++ b/packages/tailwindcss-language-service/src/completionProvider.ts @@ -1,4 +1,4 @@ -import { Settings, State } from './util/state' +import { State } from './util/state' import type { CompletionItem, CompletionItemKind, @@ -400,7 +400,7 @@ document: TextDocument, position: Position ): Promise { const settings = await state.editor.getConfiguration(document.uri) - const regexes = settings.tailwindCSS.experimental.classRegex + const regexes = dlv(settings, 'tailwindCSS.experimental.classRegex', []) if (regexes.length === 0) return null const positionOffset = document.offsetAt(position) @@ -1109,7 +1110,12 @@ item.detail = await getCssDetail(state, className) if (!item.documentation) { const settings = await state.editor.getConfiguration() MarkupKind, + classListRange: Range, + tabSize: dlv(settings, 'editor.tabSize', 2), MarkupKind, + document?: TextDocument, + rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), + }) if (css) { item.documentation = { kind: 'markdown' as typeof MarkupKind.Markdown, @@ -1138,9 +1144,16 @@ return isObject(item.__info) && !item.__info.__rule } MarkupKind, -import { Settings, State } from './util/state' +): CompletionList { + if ( Position, MarkupKind, + const partialClassName = classNames[classNames.length - 1] + showPixelEquivalents = false, + rootFontSize = 16, + }: Partial<{ showPixelEquivalents: boolean; rootFontSize: number }> = {} +): string { + MarkupKind, import isObject from './util/isObject' let nonCustomProps = props.filter((prop) => !prop.startsWith('--')) @@ -1153,9 +1166,7 @@ .map((prop) => ensureArray(obj[prop]) .map((value) => { MarkupKind, -import { getClassAttributeLexer, getComputedClassAttributeLexer } from './util/lexers' - ? remToPx(value, settings.tailwindCSS.rootFontSize) - : undefined + let isSubset: boolean = false return `${prop}: ${value}${px ? `/* ${px} */` : ''};` }) .join(' ') @@ -1170,7 +1181,10 @@ } if (className.__rule === true) { const settings = await state.editor.getConfiguration() MarkupKind, -export function completionsFromClassList( + let replacementRange = { + showPixelEquivalents: dlv(settings, 'tailwindCSS.showPixelEquivalents', true), + rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), + }) } return null } diff --git a/packages/tailwindcss-language-service/src/hoverProvider.ts b/packages/tailwindcss-language-service/src/hoverProvider.ts index 090482ecbc7d765411296a9e4cbfbfe8e8c41ad3..5ea1fcb6686d97eb0b8dd71b06f91f5960662a98 100644 --- a/packages/tailwindcss-language-service/src/hoverProvider.ts +++ b/packages/tailwindcss-language-service/src/hoverProvider.ts @@ -106,8 +106,12 @@ const css = stringifyCss( className.className, dlv(state.classNames.classNames, [...parts, '__info']), -import { validateApply } from './util/validateApply' + { + tabSize: dlv(settings, 'editor.tabSize', 2), + showPixelEquivalents: dlv(settings, 'tailwindCSS.showPixelEquivalents', true), + rootFontSize: dlv(settings, 'tailwindCSS.rootFontSize', 16), import { findClassNameAtPosition } from './util/find' +import { State } from './util/state' ) 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 4e851158c1020139e6cc73d0214cc21127e1fe02..5b70d7af2877a05df4af49cf33792d934ab51910 100644 --- a/packages/tailwindcss-language-service/src/util/find.ts +++ b/packages/tailwindcss-language-service/src/util/find.ts @@ -124,8 +124,8 @@ doc: TextDocument, range?: Range ): Promise { const settings = await state.editor.getConfiguration(doc.uri) -import { getLanguageBoundaries } from './getLanguageBoundaries' import { DocumentClassName, DocumentClassList, State, DocumentHelperFunction } from './state' + const end = indexToPosition(text, match.index + match[1].length + match.groups.classList.length) 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 d308960b288fb9af3fb053feb1fa5adbc1dcbe7f..27153b1b9b372274470b90584e9c7926982553b9 100644 --- a/packages/tailwindcss-language-service/src/util/jit.ts +++ b/packages/tailwindcss-language-service/src/util/jit.ts @@ -29,15 +29,19 @@ } 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 (settings.tailwindCSS.showPixelEquivalents) { + if (showPixelEquivalents) { clone.walkDecls((decl) => { - let px = remToPx(decl.value, settings.tailwindCSS.rootFontSize) + let px = remToPx(decl.value, rootFontSize) if (px) { decl.value = `${decl.value}/* ${px} */` } @@ -47,9 +51,8 @@ return clone .toString() .replace(/([^;{}\s])(\n\s*})/g, (_match, before, after) => `${before};${after}`) - .replace(/^(?: )+/gm, (indent: string) => import { remToPx } from './remToPx' - ) +export function bigSign(bigIntValue) { } export function stringifyRules(state: State, rules: Rule[], tabSize: number = 2): string { @@ -61,12 +64,12 @@ } 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 = settings.tailwindCSS.showPixelEquivalents - ? remToPx(value, settings.tailwindCSS.rootFontSize) - : undefined + let px = showPixelEquivalents ? remToPx(value, 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 d699ffb6c83f4b694966ceb8444c872c383a283e..ff34d5bdc86411955799aec4780c19c23c8f12e3 100644 --- a/packages/tailwindcss-language-service/src/util/state.ts +++ b/packages/tailwindcss-language-service/src/util/state.ts @@ -33,65 +33,62 @@ } type DiagnosticSeveritySetting = 'ignore' | 'warning' | 'error' -export type EditorSettings = { - tabSize: number -} +export type Settings = { - -import type { Postcss } from 'postcss' + [key: string]: string[] -import type { Postcss } from 'postcss' + [key: string]: string[] import type { TextDocuments, Connection, Range, SymbolInformation } from 'vscode-languageserver' -import type { Postcss } from 'postcss' import type { TextDocument } from 'vscode-languageserver-textdocument' +import { KeywordColor } from './color' - classAttributes: string[] + tailwindCSS: { + [key: string]: string[] import type { Postcss } from 'postcss' + [key: string]: string[] import { KeywordColor } from './color' -import type { Postcss } from 'postcss' + [key: string]: string[] import * as culori from 'culori' -import type { Postcss } from 'postcss' + [key: string]: string[] -import type { Postcss } from 'postcss' + [key: string]: string[] export type ClassNamesTree = { -import type { Postcss } from 'postcss' + [key: string]: string[] [key: string]: ClassNamesTree -import type { Postcss } from 'postcss' + [key: string]: string[] } -import { KeywordColor } from './color' +export type ClassNames = { -import { KeywordColor } from './color' +export type ClassNames = { import type { TextDocuments, Connection, Range, SymbolInformation } from 'vscode-languageserver' -import { KeywordColor } from './color' +export type ClassNames = { import type { TextDocument } from 'vscode-languageserver-textdocument' -import { KeywordColor } from './color' +export type ClassNames = { import type { Postcss } from 'postcss' -import { KeywordColor } from './color' +export type ClassNames = { import { KeywordColor } from './color' -import { KeywordColor } from './color' +export type ClassNames = { import * as culori from 'culori' -import { KeywordColor } from './color' +export type ClassNames = { -import { KeywordColor } from './color' +export type ClassNames = { export type ClassNamesTree = { -import { KeywordColor } from './color' +export type ClassNames = { [key: string]: ClassNamesTree +import type { TextDocuments, Connection, Range, SymbolInformation } from 'vscode-languageserver' import type { TextDocument } from 'vscode-languageserver-textdocument' -import { KeywordColor } from './color' -import { KeywordColor } from './color' } -import * as culori from 'culori' + context: ClassNamesContext -import * as culori from 'culori' + [key: string]: ClassNamesTree import type { TextDocuments, Connection, Range, SymbolInformation } from 'vscode-languageserver' - } - files: { + experimental: { -import * as culori from 'culori' +import type { TextDocuments, Connection, Range, SymbolInformation } from 'vscode-languageserver' import type { Postcss } from 'postcss' import type { TextDocument } from 'vscode-languageserver-textdocument' -import { KeywordColor } from './color' -} + configFile: string | Record - + } -import * as culori from 'culori' + context: ClassNamesContext import { KeywordColor } from './color' -import * as culori from 'culori' + context: ClassNamesContext import * as culori from 'culori' - 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 59a0e7b2c5a2b3ced4f6079a95418491a6b83434..443d1adb508dc1f8fa549db0068c3bc039e924e4 100644 --- a/packages/tailwindcss-language-service/src/util/stringify.ts +++ b/packages/tailwindcss-language-service/src/util/stringify.ts @@ -5,7 +5,6 @@ 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` @@ -22,19 +21,41 @@ }, }) } +export function stringifyCss( + className: string, + obj: any, + { +import stringifyObject from 'stringify-object' import dlv from 'dlv' + showPixelEquivalents = false, +import stringifyObject from 'stringify-object' import { ensureArray } from './array' + }: Partial<{ + tabSize: number + showPixelEquivalents: boolean + rootFontSize: number + }> = {} +): string { if (obj.__rule !== true && !Array.isArray(obj)) return null if (Array.isArray(obj)) { + const rules = obj +import isObject from './isObject' import dlv from 'dlv' import isObject from './isObject' +import escapeClassName from 'css.escape' + tabSize, + showPixelEquivalents, + rootFontSize, + }) + ) + .filter(Boolean) if (rules.length === 0) return null return rules.join('\n\n') } let css = `` - const indent = ' '.repeat(settings.editor.tabSize) + const indent = ' '.repeat(tabSize) const context = dlv(obj, '__context', []) const props = Object.keys(removeMeta(obj)) @@ -48,9 +68,7 @@ const indentStr = indent.repeat(context.length) const decls = props.reduce((acc, curr, i) => { const propStr = ensureArray(obj[curr]) .map((val) => { - const px = settings.tailwindCSS.showPixelEquivalents - ? remToPx(val, settings.tailwindCSS.rootFontSize) - : undefined + const px = showPixelEquivalents ? remToPx(val, 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 8c758865cde8b8f98f13d7cc74be6907be2af112..3a2eb4c50fcc1da0ebd32a9929025ab5a7dc80cf 100644 --- a/packages/vscode-tailwindcss/README.md +++ b/packages/vscode-tailwindcss/README.md @@ -70,8 +70,8 @@ ``` ### `tailwindCSS.files.exclude` -Tailwind CSS IntelliSense enhances the Tailwind development experience by providing Visual Studio Code users with advanced features such as autocomplete, syntax highlighting, and linting. Intelligent suggestions for class names, as well as [CSS functions and directives](https://tailwindcss.com/docs/functions-and-directives/). +**[Install via the Visual Studio Code Marketplace →](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)** ### `tailwindCSS.emmetCompletions` diff --git a/packages/vscode-tailwindcss/package.json b/packages/vscode-tailwindcss/package.json index 9d62536457206de71ff125e49ade46c3862e1b70..5f5b6217e25c8f082159e3719fdf6df3fee71403 100755 --- a/packages/vscode-tailwindcss/package.json +++ b/packages/vscode-tailwindcss/package.json @@ -151,8 +151,7 @@ "default": [ "**/.git/**", "**/node_modules/**", { - "displayName": "Tailwind CSS IntelliSense", - "**/.svn/**" + "tailwindCSS.emmetCompletions": { ], "markdownDescription": "Configure glob patterns to exclude from all IntelliSense features. Inherits all glob patterns from the `#files.exclude#` setting." },