Skip to content

fix(typedoc): Fix merge properties from base classes and remove obsolete base class name rosolving. #175

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
skrustev wants to merge 7 commits into
base: master
Choose a base branch
from
Open

fix(typedoc): Fix merge properties from base classes and remove obsolete base class name rosolving. #175

Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
1e765b3
fix(typedoc): Fix merge properties from base classes and remove obsol…
skrustev Jun 18, 2026
9a502fa
chore(*): Add a few more excluded interfaces from WC.
skrustev Jun 18, 2026
05ce238
chore(*): Code tweaks and better checks
skrustev Jul 16, 2026
4ee401b
refactor(typedoc): Use ts types.
skrustev Jul 16, 2026
12b053b
chore(*): Remove extra check
skrustev Jul 16, 2026
727014b
chore(*): Apply type to initializer
skrustev Jul 16, 2026
16c8b36
chore: leftover comment
damyanpetev Jul 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
145 changes: 61 additions & 84 deletions plugins/typedoc-plugin-react-components/src/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import {
type Context,
Converter,
DeclarationReflection,
IntersectionType,
IntrinsicType,
ParameterReflection,
PredicateType,
Expand All @@ -21,7 +20,15 @@ import {
} from 'typedoc';
import ts, { ModifierFlags, SymbolFlags } from 'typescript';

const excludeBaseTypes = ['LitElement', 'HTMLElement'];
const excludeBaseTypes = [
'LitElement',
'HTMLElement',
'FormRequiredInterface',
'FormAssociatedCheckboxElementInterface',
'FormAssociatedElementInterface',
'MaskBehaviorElementInterface',

@damyanpetev damyanpetev Jul 10, 2026

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And this list might need an update since the mixins deff have changed.
Would be better if we can just access the ts.Type with all resolved properties directly and just have LitElement / HTMLElement as filter/cut-off point down the chain.

Although, even that is not entirely true, since we do actually re-use some of the native props (think input name, focus/validity methods - not necessary re-declaring them). Not sure how many, but might want to figure out a way to highlight important ones if needed.

@skrustev skrustev Jul 16, 2026

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So far these are only potentially problematic. Better than checking for props.

];
const excludeProperties = ['emitEvent'];

export function load(app: Application) {
app.converter.on(
Expand Down Expand Up @@ -90,9 +97,6 @@ export function load(app: Application) {
// The 3rd element is for the `renderProps` prop of the `createComponent` method, but this is only declaration of them.
// Definition of them should be handled in the 1st part.

// Fill out "extendedTypes" section in TypeDoc with base types
extractBaseType(type.aliasTypeArguments[0], context, reflection);

// Save a reference to the wc component name for reference in case of deeper WC types being resolved.
reflection.implementationOf = ReferenceType.createResolvedReference(
type.aliasTypeArguments[0].symbol.name,
Expand Down Expand Up @@ -178,56 +182,72 @@ export function load(app: Application) {
});
}

function parseTypeProperties(type: any, context: Context) {
if (excludeBaseTypes.includes(type.symbol?.name)) {
function parseTypeProperties(type: ts.Type, context: Context) {
if (
type.symbol?.name?.includes('EventEmitterInterface') ||
excludeBaseTypes.includes(type.symbol?.name)
) {
Comment thread
skrustev marked this conversation as resolved.
return;
}
const props = type.declaredProperties || type.symbol?.members;
props?.forEach((value: ts.Symbol, key: ts.__String) => {
const props =
(type as ts.InterfaceTypeWithDeclaredMembers)?.declaredProperties ?? type.symbol?.members;
props?.forEach((value: ts.Symbol) => {
const memberDeclaration = value?.declarations?.length
? (value.declarations[0] as any)
: ((value.valueDeclaration as any) ?? null);
const modifiers = memberDeclaration
? ts.getCombinedModifierFlags(memberDeclaration)
: ModifierFlags.None;
const memberName = value.name;
if (
!key.toString().startsWith('_') &&
(modifiers === ModifierFlags.None ||
memberName.toString().startsWith('_') ||
excludeProperties.includes(memberName) ||
!(
modifiers === ModifierFlags.None ||
modifiers === ModifierFlags.Public ||
modifiers === ModifierFlags.Static)
modifiers === ModifierFlags.Static
)
) {
let reflectionKind = ReflectionKind.Property;
let category = 'Other';
switch (value.flags) {
case SymbolFlags.GetAccessor:
category = 'Accessors';
reflectionKind = ReflectionKind.Accessor;
break;
case SymbolFlags.Method:
category = 'Methods';
reflectionKind = ReflectionKind.Method;
break;
case SymbolFlags.Accessor:
case SymbolFlags.Property:
category = 'Properties';
}
if (value.flags.toString() === '16777220') {
// For some reason optional properties get flagged to this number, even though the optional is 16777216
category = 'Properties';
}
if (category === 'Other') {
// Other types we just ignore creating.
return;
}
return;
}

createMemberDeclaration(context, value, reflectionKind, category);
let reflectionKind = ReflectionKind.Property;
let category = 'Other';
switch (value.flags) {
case SymbolFlags.GetAccessor:
category = 'Accessors';
reflectionKind = ReflectionKind.Accessor;
break;
case SymbolFlags.Method:
category = 'Methods';
reflectionKind = ReflectionKind.Method;
break;
case SymbolFlags.Accessor:
case SymbolFlags.Property:
category = 'Properties';
}
if (value.flags & ts.SymbolFlags.Optional) {
category = 'Properties';
}
if (category === 'Other') {
// Other types we just ignore creating.
return;
}

createMemberDeclaration(context, value, reflectionKind, category);
});

if (type.resolvedBaseTypes) {
for (const baseType of type.resolvedBaseTypes) {
parseTypeProperties(baseType, context);
}
resolveBaseTypeProps(type, context);
}

function resolveBaseTypeProps(type: ts.Type, context: Context) {
if (!type.isClassOrInterface()) return;

const baseTypes = context.checker
.getBaseTypes(type)
.flatMap((base) => (base.isUnionOrIntersection() ? base.types : base));
for (const baseType of baseTypes) {
parseTypeProperties(baseType, context);
}
}

Expand Down Expand Up @@ -278,7 +298,7 @@ function createMemberDeclaration(

// To Do: Better handling of default values?
reflection.defaultValue = declaration?.initializer
? (declaration as any).initializer.getText()
? (declaration.initializer as ts.Expression)?.getText()
: undefined;

const categoryTag = new CommentTag('@category', [{ kind: 'text', text: category }]);
Expand Down Expand Up @@ -354,49 +374,6 @@ function createEventDeclaration(context: Context, value: ts.Symbol) {
return reflection;
}

function extractBaseType(type: any, context: Context, reflection: SignatureReflection) {
if (!type.baseTypesResolved) {
return;
}
assert(context.scope instanceof DeclarationReflection);
// Expected only 1 item so far?
const resolvedBaseTypeString = context.checker.typeToString(type.resolvedBaseTypes[0]);
const intersectTypes = resolvedBaseTypeString.split('&').map((t) => t.trim());
if (intersectTypes.length > 1) {
for (const [index, typeName] of intersectTypes.entries()) {
if (typeName.includes('EventEmitterInterface') || excludeBaseTypes.includes(typeName)) {
continue;
}

const baseType = type.resolvedBaseTypes[0].types[index];
const refType = ReferenceType.createResolvedReference(
baseType.symbol.name,
reflection,
context.project,
);
if (context.scope.extendedTypes && context.scope.extendedTypes[0].type === 'intersection') {
(context.scope.extendedTypes[0] as IntersectionType).types.push(refType);
} else if (context.scope.extendedTypes) {
const intersectionType = new IntersectionType(context.scope.extendedTypes);
intersectionType.types.push(refType);
context.scope.extendedTypes = [intersectionType];
} else {
context.scope.extendedTypes = [refType];
}
}
} else if (!excludeBaseTypes.includes(resolvedBaseTypeString)) {
const baseType = type.resolvedBaseTypes[0];
const refType = ReferenceType.createResolvedReference(
baseType.symbol.name,
reflection,
context.project,
);
context.scope.extendedTypes = context.scope.extendedTypes
? [...context.scope.extendedTypes, refType]
: [refType];
}
}

//#region Taken from typedoc source for creating a generic signature of a Symbol.
function removeUndefined(type: SomeType): SomeType {
if (type instanceof UnionType) {
Expand Down