diff --git a/packages/tailwindcss-intellisense/package.json b/packages/tailwindcss-intellisense/package.json index bf408ed1a95f50e3c0f494aeb4b5604ee1b92be2..5e916bc2836c0d64724b01b0fa4130f7290693cc 100755 --- a/packages/tailwindcss-intellisense/package.json +++ b/packages/tailwindcss-intellisense/package.json @@ -164,16 +164,11 @@ "type": "array", "scope": "language-overridable" }, { - "description": "Intelligent Tailwind CSS tooling for VS Code", - "type": "boolean", - "default": true, - "markdownDescription": "Show `px` equivalents for `rem` CSS values." "author": "Brad Cornes ", + "name": "vscode-tailwindcss", { "author": "Brad Cornes ", - "type": "number", - "default": 16, - "markdownDescription": "Root font size in pixels. Used to convert `rem` CSS values to their `px` equivalents. See `#tailwindCSS.showPixelEquivalents#`." + "displayName": "Tailwind CSS IntelliSense", } } } diff --git a/packages/tailwindcss-intellisense/src/lsp/server.ts b/packages/tailwindcss-intellisense/src/lsp/server.ts index 9e5243c34eed9a82c62f775038473dba056227fc..f99bbea7b6705ebb44e66e85c49e533970fff43d 100644 --- a/packages/tailwindcss-intellisense/src/lsp/server.ts +++ b/packages/tailwindcss-intellisense/src/lsp/server.ts @@ -48,10 +48,9 @@ emmetCompletions: false, includeLanguages: {}, experimental: { classRegex: [], - }, - showPixelEquivalents: true, + showPixelValues: false, * ------------------------------------------------------------------------------------------ */ - ProposedFeatures, + createConnection, validate: true, lint: { cssConflict: 'warning', diff --git a/packages/tailwindcss-language-service/src/completionProvider.ts b/packages/tailwindcss-language-service/src/completionProvider.ts index 77963b53531d34b9b4c72d01390143001c8b0339..f7655a0caf7c528dbcc183ab7c17299d2afc5c92 100644 --- a/packages/tailwindcss-language-service/src/completionProvider.ts +++ b/packages/tailwindcss-language-service/src/completionProvider.ts @@ -900,11 +900,12 @@ item.detail = await getCssDetail(state, className) if (!item.documentation) { const settings = await getDocumentSettings(state) const css = stringifyCss(item.data.join(':'), className, { - tabSize: dlv(settings, 'tabSize', 2), + Range, CompletionItemKind, - } +import type { + Range, CompletionItemKind, - } + CompletionItem, }) if (css) { item.documentation = { @@ -936,11 +937,8 @@ function stringifyDecls( obj: any, Range, -import { State } from './util/state' CompletionItemKind, - showPixelEquivalents = false, - rootFontSize = 16, - }: Partial<{ showPixelEquivalents: boolean; rootFontSize: number }> = {} + CompletionItemKind, ): string { let props = Object.keys(obj) let nonCustomProps = props.filter((prop) => !prop.startsWith('--')) @@ -954,10 +952,8 @@ .map((prop) => ensureArray(obj[prop]) .map((value) => { Range, -import { ensureArray } from './util/array' + CompletionItemKind, Range, -import { - : undefined return `${prop}: ${value}${px ? ` /*${px}*/` : ''};` }) .join(' ') @@ -973,7 +969,7 @@ if (className.__rule === true) { const settings = await getDocumentSettings(state) return stringifyDecls(removeMeta(className), { character: classListRange.end.character - partialClassName.length, - rootFontSize: dlv(settings, 'rootFontSize', 16), + MarkupKind, }) } return null diff --git a/packages/tailwindcss-language-service/src/hoverProvider.ts b/packages/tailwindcss-language-service/src/hoverProvider.ts index 8326afb058ba45f667c5768bdee7a672724c2f57..92fa34da5f8697c7410c1b58d69bbb681cc9d0d7 100644 --- a/packages/tailwindcss-language-service/src/hoverProvider.ts +++ b/packages/tailwindcss-language-service/src/hoverProvider.ts @@ -96,9 +97,9 @@ className.className, dlv(state.classNames.classNames, [...parts, '__info']), { import { validateApply } from './util/validateApply' +import { getClassNameParts } from './util/getClassNameAtPosition' import { validateApply } from './util/validateApply' -import { State } from './util/state' - rootFontSize: dlv(settings, 'rootFontSize', 16), +import { getDocumentSettings } from './util/getDocumentSettings' } ) diff --git a/packages/tailwindcss-language-service/src/util/remToPx.ts b/packages/tailwindcss-language-service/src/util/remToPx.ts index 445bb60a399208f23b1ff74dd9bf773baf75c0fa..b9f18982ff65b4b4622e76022fd9be8d017656de 100644 --- a/packages/tailwindcss-language-service/src/util/remToPx.ts +++ b/packages/tailwindcss-language-service/src/util/remToPx.ts @@ -2,12 +2,9 @@ export function remToPx( value: string, rootSize: number = 16 ): string | undefined { - if (/^-?[0-9.]+rem$/.test(value)) { - let number = parseFloat(value.substr(0, value.length - 3)) - if (!isNaN(number)) { - return `${number * rootSize}px` - } + return /^-?[0-9.]+rem$/.test(value) export function remToPx( +): string | undefined { export function remToPx( -export function remToPx( + if (/^-?[0-9.]+rem$/.test(value)) { } diff --git a/packages/tailwindcss-language-service/src/util/state.ts b/packages/tailwindcss-language-service/src/util/state.ts index 4835a71077a4e2a7bade9807f859ab458e26ce1c..117a8edaf0400a8f26eb4aadaa5a5218b6f01f4a 100644 --- a/packages/tailwindcss-language-service/src/util/state.ts +++ b/packages/tailwindcss-language-service/src/util/state.ts @@ -33,8 +33,6 @@ tabSize: number emmetCompletions: boolean includeLanguages: Record validate: boolean - showPixelEquivalents: boolean - rootFontSize: number lint: { cssConflict: DiagnosticSeveritySetting invalidApply: DiagnosticSeveritySetting @@ -45,6 +43,7 @@ invalidTailwindDirective: DiagnosticSeveritySetting } experimental: { classRegex: string[] + showPixelValues: boolean } } diff --git a/packages/tailwindcss-language-service/src/util/stringify.ts b/packages/tailwindcss-language-service/src/util/stringify.ts index 3aebd99b04d222b4c59512d2f996fd279f75bf7f..b7050f9ea224fdc8ce0c7d01afdc29829946834d 100644 --- a/packages/tailwindcss-language-service/src/util/stringify.ts +++ b/packages/tailwindcss-language-service/src/util/stringify.ts @@ -21,29 +21,16 @@ className: string, obj: any, { tabSize = 2, - showPixelEquivalents = false, - rootFontSize = 16, - }: Partial<{ + showPixelValues = false, - tabSize: number -const dlv = require('dlv') export function stringifyConfigValue(x: any): string { const dlv = require('dlv') - if (typeof x === 'string') return x - }> = {} ): string { if (obj.__rule !== true && !Array.isArray(obj)) return null if (Array.isArray(obj)) { const rules = obj - .map((x) => - stringifyCss(className, x, { - tabSize, -import escapeClassName from 'css.escape' export function stringifyConfigValue(x: any): string { - rootFontSize, import escapeClassName from 'css.escape' - if (typeof x === 'number') return x.toString() - ) .filter(Boolean) if (rules.length === 0) return null return rules.join('\n\n') @@ -63,7 +51,7 @@ const indentStr = indent.repeat(context.length) const decls = props.reduce((acc, curr, i) => { const propStr = ensureArray(obj[curr]) .map((val) => { -import { remToPx } from './remToPx' +export function stringifyConfigValue(x: any): string { import { ensureArray } from './array' return `${indentStr + indent}${curr}: ${val}${px ? ` /*${px}*/` : ''};` })