@kubb/renderer-jsx 5.0.0-alpha.33

package/src/components/Type.tsx

@@ -0,0 +1,40 @@
+import type { JSDoc, Key, KubbReactElement, KubbReactNode } from '../types.ts'
+
+export type TypeProps = {
+  key?: Key
+  /**
+   * Name of the type, this needs to start with a capital letter.
+   */
+  name: string
+  /**
+   * Does this type need to be exported.
+   */
+  export?: boolean
+  /**
+   * Options for JSdocs.
+   */
+  JSDoc?: JSDoc
+  /**
+   * Children nodes.
+   */
+  children?: KubbReactNode
+}
+
+/**
+ * Generates a TypeScript type declaration.
+ */
+export function Type({ children, ...props }: TypeProps): KubbReactElement {
+  const { name, export: canExport, JSDoc } = props
+
+  if (name.charAt(0).toUpperCase() !== name.charAt(0)) {
+    throw new Error('Name should start with a capital letter(see TypeScript types)')
+  }
+
+  return (
+    <kubb-type name={name} export={canExport} JSDoc={JSDoc}>
+      {children}
+    </kubb-type>
+  )
+}
+
+Type.displayName = 'Type'

package/src/context/KubbContext.ts

@@ -0,0 +1,15 @@
+import { createContext } from '@internals/utils'
+
+export type KubbContextValue = {
+  driver: unknown
+  plugin: unknown
+  mode: 'single' | 'split'
+}
+
+/**
+ * Context key for kubb render-time data (driver, plugin, mode).
+ * Use `provide`/`unprovide` from `@internals/utils` around render calls,
+ * and `inject` inside generator components.
+ * @deprecated
+ */
+export const KubbContext = createContext<KubbContextValue | null>(null)

package/src/context/OasContext.ts

@@ -0,0 +1,9 @@
+import { createContext } from '@internals/utils'
+
+/**
+ * Context key for the OAS (OpenAPI Specification) instance.
+ * Use `provide`/`unprovide` from `@internals/utils` around render calls,
+ * and `inject` inside generator components.
+ * @deprecated
+ */
+export const OasContext = createContext<unknown>(null)

package/src/createRenderer.tsx

@@ -0,0 +1,32 @@
+import type { FileNode } from '@kubb/ast/types'
+import { Runtime } from './Runtime.tsx'
+import type { KubbReactElement } from './types.ts'
+
+type Options = {
+  /**
+   * Set this to true to always see the result of the render in the console(line per render)
+   */
+  debug?: boolean
+}
+
+export type Renderer = {
+  render(Element: KubbReactElement): Promise<void>
+  unmount(error?: Error | number | null): void
+  files: Array<FileNode>
+}
+
+export function createRenderer(options: Options = {}): Renderer {
+  const runtime = new Runtime(options)
+
+  return {
+    async render(Element) {
+      await runtime.render(Element)
+    },
+    get files() {
+      return runtime.nodes
+    },
+    unmount(error) {
+      runtime.unmount(error)
+    },
+  }
+}

package/src/dom.ts

@@ -0,0 +1,91 @@
+import type { DOMElement, DOMNode, DOMNodeAttribute, ElementNames, TextNode } from './types.ts'
+
+export const createNode = (nodeName: string): DOMElement => {
+  const node: DOMElement = {
+    nodeName: nodeName as DOMElement['nodeName'],
+    attributes: new Map(),
+    childNodes: [],
+    parentNode: undefined,
+  }
+
+  return node
+}
+
+export const appendChildNode = (node: DOMNode, childNode: DOMElement | DOMNode): void => {
+  if (childNode.parentNode) {
+    removeChildNode(childNode.parentNode, childNode)
+  }
+
+  if (node.nodeName !== '#text') {
+    childNode.parentNode = node
+    node.childNodes.push(childNode)
+  }
+}
+
+export const insertBeforeNode = (node: DOMElement, newChildNode: DOMNode, beforeChildNode: DOMNode): void => {
+  if (newChildNode.parentNode) {
+    removeChildNode(newChildNode.parentNode, newChildNode)
+  }
+
+  newChildNode.parentNode = node
+
+  const index = node.childNodes.indexOf(beforeChildNode)
+  if (index >= 0) {
+    node.childNodes.splice(index, 0, newChildNode)
+
+    return
+  }
+
+  node.childNodes.push(newChildNode)
+}
+
+export const removeChildNode = (node: DOMElement, removeNode: DOMNode): void => {
+  removeNode.parentNode = undefined
+
+  const index = node.childNodes.indexOf(removeNode)
+  if (index >= 0) {
+    node.childNodes.splice(index, 1)
+  }
+}
+
+export const setAttribute = (node: DOMElement, key: string, value: DOMNodeAttribute): void => {
+  node.attributes.set(key, value)
+}
+
+export const createTextNode = (text: string): TextNode => {
+  const node: TextNode = {
+    nodeName: '#text',
+    nodeValue: text,
+    parentNode: undefined,
+  }
+
+  setTextNodeValue(node, text)
+
+  return node
+}
+
+export const setTextNodeValue = (node: TextNode, text: string): void => {
+  if (typeof text !== 'string') {
+    text = String(text)
+  }
+
+  node.nodeValue = text
+}
+
+export const nodeNames = new Set<ElementNames>([
+  'kubb-export',
+  'kubb-file',
+  'kubb-source',
+  'kubb-import',
+  'kubb-function',
+  'kubb-arrow-function',
+  'kubb-const',
+  'kubb-type',
+  'kubb-jsx',
+  'kubb-text',
+  'kubb-root',
+  'kubb-app',
+  'br',
+  'indent',
+  'dedent',
+])

package/src/globals.ts

@@ -0,0 +1,34 @@
+import type React from 'react'
+import type {
+  KubbExportProps,
+  KubbFileProps,
+  KubbImportProps,
+  KubbJsxProps,
+  KubbReactElement,
+  KubbReactNode,
+  KubbSourceProps,
+  KubbTextProps,
+  LineBreakProps,
+} from './types.ts'
+
+declare global {
+  namespace JSX {
+    type Element = KubbReactElement
+
+    interface ElementClass extends React.ComponentClass<any> {
+      render(): KubbReactNode
+    }
+
+    interface IntrinsicElements {
+      'kubb-jsx': KubbJsxProps
+      'kubb-text': KubbTextProps
+      'kubb-file': KubbFileProps
+      'kubb-source': KubbSourceProps
+      'kubb-import': KubbImportProps
+      'kubb-export': KubbExportProps
+      br: LineBreakProps
+      indent: {}
+      dedent: {}
+    }
+  }
+}

package/src/index.ts

@@ -0,0 +1,10 @@
+export { createContext, inject, provide, unprovide } from '@internals/utils'
+export { Const } from './components/Const.tsx'
+export { File } from './components/File.tsx'
+export { Function } from './components/Function.tsx'
+export { Jsx } from './components/Jsx.tsx'
+export { Root } from './components/Root.tsx'
+export { Type } from './components/Type.tsx'
+export { KubbContext } from './context/KubbContext.ts'
+export { OasContext } from './context/OasContext.ts'
+export { createRenderer } from './createRenderer.tsx'

package/src/jsx-dev-runtime.ts

@@ -0,0 +1,10 @@
+import * as React from 'react/jsx-runtime'
+import type { KubbReactElement, KubbReactNode } from './types.ts'
+
+export const Fragment = React.Fragment
+export const jsxDEV = React.jsx
+
+export type * from './jsx-namespace.d.ts'
+
+export type JSXElement = KubbReactElement
+export type ReactNode = KubbReactNode

package/src/jsx-namespace.d.ts

@@ -0,0 +1,53 @@
+// biome-ignore-all lint/correctness/noUnusedVariables: JSX namespace declarations are consumed by TypeScript's JSX type system, not by user code
+import type React from 'react'
+
+import type {
+  KubbArrowFunctionProps,
+  KubbConstProps,
+  KubbExportProps,
+  KubbFileProps,
+  KubbFunctionProps,
+  KubbImportProps,
+  KubbJsxProps,
+  KubbReactElement,
+  KubbReactNode,
+  KubbSourceProps,
+  KubbTextProps,
+  KubbTypeProps,
+  LineBreakProps,
+} from './types'
+
+export namespace JSX {
+  type ElementType = React.JSX.ElementType
+  type Element = KubbReactElement
+
+  interface ElementClass extends React.JSX.ElementClass {
+    render(): KubbReactNode
+  }
+  interface ElementAttributesProperty {
+    props: {}
+  }
+
+  interface ElementChildrenAttribute {
+    children: {}
+  }
+
+  interface IntrinsicElements extends React.JSX.IntrinsicElements {
+    'kubb-jsx': KubbJsxProps
+    'kubb-text': KubbTextProps
+    'kubb-file': KubbFileProps
+    'kubb-source': KubbSourceProps
+    'kubb-import': KubbImportProps
+    'kubb-export': KubbExportProps
+    'kubb-function': KubbFunctionProps
+    'kubb-arrow-function': KubbArrowFunctionProps
+    'kubb-const': KubbConstProps
+    'kubb-type': KubbTypeProps
+    br: LineBreakProps
+    indent: {}
+    dedent: {}
+  }
+  type LibraryManagedAttributes<C, P> = React.JSX.LibraryManagedAttributes<C, P>
+  interface IntrinsicClassAttributes<T> extends React.JSX.IntrinsicClassAttributes<T> {}
+  interface IntrinsicElements extends React.JSX.IntrinsicElements {}
+}

package/src/jsx-runtime.ts

@@ -0,0 +1,12 @@
+import * as React from 'react/jsx-runtime'
+import type { KubbReactElement, KubbReactNode } from './types.ts'
+
+export const Fragment = React.Fragment
+export const jsx = React.jsx
+export const jsxDEV = React.jsx
+export const jsxs = React.jsxs
+
+export type * from './jsx-namespace.d.ts'
+
+export type JSXElement = KubbReactElement
+export type ReactNode = KubbReactNode

package/src/types.ts

@@ -0,0 +1,113 @@
+import type { ArrowFunctionNode, ConstNode, ExportNode, FileNode, FunctionNode, ImportNode, SourceNode, TypeNode } from '@kubb/ast/types'
+import type React from 'react'
+import type { JSX, ReactNode } from 'react'
+
+export type Key = string | number | bigint
+
+export type ElementNames =
+  | 'br'
+  | 'div'
+  | 'indent'
+  | 'dedent'
+  | 'kubb-jsx'
+  | 'kubb-text'
+  | 'kubb-file'
+  | 'kubb-source'
+  | 'kubb-import'
+  | 'kubb-export'
+  | 'kubb-function'
+  | 'kubb-arrow-function'
+  | 'kubb-const'
+  | 'kubb-type'
+  | 'kubb-root'
+  | 'kubb-app'
+
+type Node = {
+  parentNode: DOMElement | undefined
+  internal_static?: boolean
+}
+
+export type DOMNodeAttribute = boolean | string | number | Record<string, unknown>
+
+type TextName = '#text'
+export type TextNode = {
+  nodeName: TextName
+  nodeValue: string
+} & Node
+
+export type DOMNode<T = { nodeName: NodeNames }> = T extends {
+  nodeName: infer U
+}
+  ? U extends '#text'
+    ? TextNode
+    : DOMElement
+  : never
+
+type OutputTransformer = (s: string, index: number) => string
+
+export type DOMElement = {
+  nodeName: ElementNames
+  attributes: Map<string, DOMNodeAttribute>
+  childNodes: DOMNode[]
+  internal_transform?: OutputTransformer
+
+  // Internal properties
+  isStaticDirty?: boolean
+  staticNode?: DOMElement
+  onComputeLayout?: () => void
+  onRender?: () => void
+  onImmediateRender?: () => void
+} & Node
+
+type NodeNames = ElementNames | TextName
+
+export type KubbReactNode = ReactNode
+export type KubbReactElement = JSX.Element
+
+export type KubbJsxProps = {
+  children?: string
+}
+
+export type KubbTextProps = {
+  children?: KubbReactNode
+}
+
+export type KubbFileProps = {
+  id?: string
+  children?: KubbReactNode
+  baseName: string
+  path: string
+  override?: boolean
+  meta?: FileNode['meta']
+}
+export type KubbSourceProps = Omit<SourceNode, 'kind'> & {
+  children?: KubbReactNode
+}
+
+export type KubbImportProps = Omit<ImportNode, 'kind'> & {}
+
+export type KubbExportProps = Omit<ExportNode, 'kind'> & {}
+
+export type KubbFunctionProps = Omit<FunctionNode, 'kind'> & {
+  children?: KubbReactNode
+}
+
+export type KubbArrowFunctionProps = Omit<ArrowFunctionNode, 'kind'> & {
+  children?: KubbReactNode
+}
+
+export type KubbConstProps = Omit<ConstNode, 'kind'> & {
+  children?: KubbReactNode
+}
+
+export type KubbTypeProps = Omit<TypeNode, 'kind'> & {
+  children?: KubbReactNode
+}
+
+export type LineBreakProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLBRElement>, HTMLBRElement>
+
+export type JSDoc = {
+  comments: string[]
+}
+
+export type { Context } from '@internals/utils'