Support for comments inside JSDoc @example comments

Suggestion

🔍 Search Terms:

comments inside jsdoc, jsdoc inception

✅ Viability Checklist

My suggestion meets these guidelines:

• This wouldn't be a breaking change in existing TypeScript/JavaScript code
• This wouldn't change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
• This feature would agree with the rest of TypeScript's Design Goals.

⭐ Suggestion

I am writing a custom helper type that allows me to provide JSDoc comments for properties of any other object or interface that is inaccessible for changes.
I need to document the feature and usage, but I can't close a comment section inside JSDoc comment's.

Code:

/**
 * This type allows to add JSDoc annotation to any type without causing conflicts.
 *
 * @example
 * type IconButtonProps =
 *  & JSDoc
 *  & ShorthandVariantsAndSizes
 *
 * type JSDoc = Documentation<ShorthandVariantsAndSizes, {
 *  /**
 *   * **variant**: Color theme for the button.
 *   * - `light` variant is white on all themes.
 *   \*\/
 *   variant?: unknown  // <- note: this `?: unknown` optional type is important
 * }>
 */
type Documentation<T, TargetType extends { [K in keyof T]?: unknown }> = TargetType

JSDoc invoked:

💻 Use Cases

Desired:

Result:

📃 Motivating Example

const sizeKeys = ['small', 'large'] as const

// this is a mapped type and therefore doesn't allow to add JSDoc comments
type ExplodedSizes = { [key in typeof sizeKeys]?: unknown }

type JSDoc = Documentation<ExplodedSizes, {
  /**
   * **size**: Button size.
   * - `64px`
   */
  large?: unknown
  /**
   * **size**: Button size.
   * - `32px`
   */
  small?: unknown
}>

// this merges the jsdoc annotation with correct types
export type IconButtonProps =
  & JSDoc
  & ExplodedSizes

export const IconButton: React.FC<IconButtonProps> = (props) => <> </> 

// later when using the component
const render = <IconButton /> // <- gets correct intellisense with JSDoc comments here

Non vengono indicati file sorgente né test. Inizia tracciando il modo in cui TypeScript gestisce i blocchi @example di JSDoc e i delimitatori di commento annidati, quindi confronta l'input mostrato con il rendering desiderato della documentazione. Il lavoro è completato quando i commenti all'interno di un blocco @example vengono preservati senza modificare il comportamento esistente di JSDoc.