diff --git a/packages/jet-brains-integration/README.md b/packages/jet-brains-integration/README.md index fd1c71c..117eafa 100644 --- a/packages/jet-brains-integration/README.md +++ b/packages/jet-brains-integration/README.md @@ -118,6 +118,8 @@ export interface Options { hideLogs?: boolean; /** Prevents plugin from executing */ skip?: boolean; + /** Used to amend the modules paths to actual source (when outdir is a subdirectory for instance) */ + modulePathTemplate?: (name: string, modulePath: string) => string; } ``` diff --git a/packages/jet-brains-integration/src/__tests__/web-types-generator.ts b/packages/jet-brains-integration/src/__tests__/web-types-generator.ts index bd6381b..f13e406 100644 --- a/packages/jet-brains-integration/src/__tests__/web-types-generator.ts +++ b/packages/jet-brains-integration/src/__tests__/web-types-generator.ts @@ -1,6 +1,10 @@ import { expect, describe, test } from "vitest"; import { customElementsManifest } from "./test-data"; -import { getOptions, getTagList } from "../web-types-generator"; +import { + getOptions, + getTagList, + getComponentsExportsMap, +} from "../web-types-generator"; import { getComponents } from "../../../../tools/cem-utils"; describe("web-types-generator", () => { @@ -28,9 +32,10 @@ describe("web-types-generator", () => { slots: slotLabel, }, }); + const symbols = getComponentsExportsMap(customElementsManifest, options); // Act - const tagList = getTagList(components, options); + const tagList = getTagList(components, symbols, options); // Assert expect(options.labels?.slots).toBe("Slug"); @@ -43,9 +48,10 @@ describe("web-types-generator", () => { const options = getOptions({ hideSlotDocs: false, }); + const symbols = getComponentsExportsMap(customElementsManifest, options); // Act - const tagList = getTagList(components, options); + const tagList = getTagList(components, symbols, options); // Assert expect(JSON.stringify(tagList).includes("**Slots:**")).toBe(false); @@ -56,9 +62,10 @@ describe("web-types-generator", () => { const options = getOptions({ hideEventDocs: false, }); + const symbols = getComponentsExportsMap(customElementsManifest, options); // Act - const tagList = getTagList(components, options); + const tagList = getTagList(components, symbols, options); // Assert expect(JSON.stringify(tagList).includes("**Events:**")).toBe(false); @@ -70,8 +77,10 @@ describe("web-types-generator", () => { hideCssPropertiesDocs: false, }); + const symbols = getComponentsExportsMap(customElementsManifest, options); + // Act - const tagList = getTagList(components, options); + const tagList = getTagList(components, symbols, options); // Assert expect(JSON.stringify(tagList).includes("**CSS Properties:**")).toBe( @@ -84,9 +93,10 @@ describe("web-types-generator", () => { const options = getOptions({ hideCssPartsDocs: false, }); + const symbols = getComponentsExportsMap(customElementsManifest, options); // Act - const tagList = getTagList(components, options); + const tagList = getTagList(components, symbols, options); // Assert expect(JSON.stringify(tagList).includes("**CSS Parts:**")).toBe(false); diff --git a/packages/jet-brains-integration/src/types.d.ts b/packages/jet-brains-integration/src/types.d.ts index 8e63813..ca5d903 100644 --- a/packages/jet-brains-integration/src/types.d.ts +++ b/packages/jet-brains-integration/src/types.d.ts @@ -22,6 +22,8 @@ export interface Options extends BaseOptions { referenceTemplate?: (name: string, tag?: string) => Reference; /** Adds an icon link to the webtypes.json **/ defaultIcon?: string; + /** Used to amend the modules paths to actual source (when outdir is a subdirectory for instance) */ + modulePathTemplate?: (name: string, modulePath: string) => string; } export interface Params { @@ -31,6 +33,7 @@ export interface Params { export interface WebTypeElement { name: string; description: string; + source?: WebTypeSourceSymbol; ["doc-url"]?: string; attributes: WebTypeAttribute[]; js?: JsProperties; @@ -83,3 +86,8 @@ export interface Reference { name: string; url: string; } + +export interface WebTypeSourceSymbol { + module?: string; + symbol: string; +} diff --git a/packages/jet-brains-integration/src/web-types-generator.ts b/packages/jet-brains-integration/src/web-types-generator.ts index 215c589..8836d01 100644 --- a/packages/jet-brains-integration/src/web-types-generator.ts +++ b/packages/jet-brains-integration/src/web-types-generator.ts @@ -7,6 +7,7 @@ import type { WebTypeEvent, WebTypeJsProperty, WebTypePseudoElement, + WebTypeSourceSymbol, } from "./types"; import { getComponents, @@ -35,6 +36,7 @@ const packageJson = JSON.parse(fs.readFileSync("package.json", "utf8")); export function getTagList( components: Component[], + sourceSymbols: Map, options: Options, ): WebTypeElement[] { return components.map((component: Component) => { @@ -42,6 +44,10 @@ export function getTagList( ? options.referenceTemplate(component.name, component.tagName) : undefined; + const symbol = component.tagName + ? sourceSymbols.get(component.tagName) + : undefined; + return { name: `${options.prefix}${ component.tagName || toKebabCase(component.name) @@ -57,10 +63,40 @@ export function getTagList( }), events: getWebTypeEvents(component), js: getJsProperties(component, options.typesSrc), + source: symbol, }; }); } +export function getComponentsExportsMap( + customElementsManifest: CEM, + options: Options, +): Map { + return new Map( + customElementsManifest.modules + ?.map((mod) => + mod.exports + ?.filter( + (e) => + e.kind === "custom-element-definition" && e.declaration.module, + ) + .map((e) => [ + e.name, + { + symbol: e.declaration.name, + module: options.modulePathTemplate + ? options.modulePathTemplate( + e.declaration.name, + e.declaration.module!, + ) + : e.declaration.module, + } as WebTypeSourceSymbol, + ]), + ) + .flat() as Array<[string, WebTypeSourceSymbol]>, + ); +} + function getJsProperties( component: Component, typesSrc?: string, @@ -147,9 +183,10 @@ export function generateJetBrainsWebTypes( ); return; } + const exports = getComponentsExportsMap(customElementsManifest, options); const elements = options.webTypesFileName - ? getTagList(components, options) + ? getTagList(components, exports, options) : []; const cssProperties = getCssPropertyList(components); const cssParts = getCssPartList(components); @@ -170,7 +207,8 @@ export function getWebTypesData(customElementsManifest: CEM, options: Options) { options.exclude, ).filter((x) => x.tagName); - const elements = getTagList(components, options); + const exports = getComponentsExportsMap(customElementsManifest, options); + const elements = getTagList(components, exports, options); const cssProperties = getCssPropertyList(components); const cssParts = getCssPartList(components);