@kubb/react-fabric 0.2.19 → 0.3.1

package/src/Runtime.tsx

@@ -24,7 +24,6 @@ type Options = {
 
 export class Runtime {
   readonly #options: Options
-  // Ignore last render after unmounting a tree to prevent empty output before exit
   #isUnmounted: boolean
 
   exitPromise?: Promise<void>
@@ -33,70 +32,42 @@ export class Runtime {
 
   constructor(options: Options) {
     this.#options = options
-
     this.#rootNode = createNode('kubb-root')
     this.#rootNode.onRender = this.onRender
     this.#rootNode.onImmediateRender = this.onRender
-
-    // Ignore last render after unmounting a tree to prevent empty output before exit
     this.#isUnmounted = false
     this.unmount.bind(this)
 
+    // Intercept noisy React errors
     const originalError = console.error
     console.error = (data: string | Error) => {
       const message = typeof data === 'string' ? data : data?.message
-
-      if (message?.match(/Encountered two children with the same key/gi)) {
-        return
-      }
-      if (message?.match(/React will try to recreat/gi)) {
-        return
-      }
-      if (message?.match(/Each child in a list should have a unique/gi)) {
+      if (
+        message?.match(/Encountered two children with the same key/gi) ||
+        message?.match(/React will try to recreat/gi) ||
+        message?.match(/Each child in a list should have a unique/gi) ||
+        message?.match(/The above error occurred in the <KubbErrorBoundary/gi) ||
+        message?.match(/A React Element from an older version of React was render/gi)
+      ) {
         return
       }
-      if (message?.match(/The above error occurred in the <KubbErrorBoundary/gi)) {
-        return
-      }
-
-      if (message?.match(/A React Element from an older version of React was render/gi)) {
-        return
-      }
-
       originalError(data)
     }
 
-    // Report when an error was detected in a previous render
-    // https://github.com/pmndrs/react-three-fiber/pull/2261
-    const logRecoverableError =
-      typeof reportError === 'function'
-        ? // In modern browsers, reportError will dispatch an error event,
-          // emulating an uncaught JavaScript error.
-          reportError
-        : // In older browsers and test environments, fallback to console.error.
-          console.error
+    const logRecoverableError = typeof reportError === 'function' ? reportError : console.error
 
     const rootTag = ConcurrentRoot
-    const hydrationCallbacks = null
-    const isStrictMode = false
-    const concurrentUpdatesByDefaultOverride = false
-    const identifierPrefix = 'id'
-    const onUncaughtError = logRecoverableError
-    const onCaughtError = logRecoverableError
-    const onRecoverableError = logRecoverableError
-    const transitionCallbacks = null
-
     this.#container = Renderer.createContainer(
       this.#rootNode,
       rootTag,
-      hydrationCallbacks,
-      isStrictMode,
-      concurrentUpdatesByDefaultOverride,
-      identifierPrefix,
-      onUncaughtError,
-      onCaughtError,
-      onRecoverableError,
-      transitionCallbacks,
+      null,
+      false,
+      false,
+      'id',
+      logRecoverableError,
+      logRecoverableError,
+      logRecoverableError,
+      null,
     )
 
     // Unmount when process exits
@@ -108,9 +79,9 @@ export class Runtime {
     ).bind(this)
 
     Renderer.injectIntoDevTools({
-      bundleType: 1, // 0 for PROD, 1 for DEV
-      version: '19.1.0', // should be React version and not Kubb's custom version
-      rendererPackageName: 'kubb', // package name
+      bundleType: 1,
+      version: '19.1.0',
+      rendererPackageName: 'kubb',
     })
   }
 
@@ -122,6 +93,7 @@ export class Runtime {
   resolveExitPromise: () => void = () => {}
   rejectExitPromise: (reason?: Error) => void = () => {}
   unsubscribeExit: () => void = () => {}
+
   onRender: () => Promise<void> = () => {
     const previous = this.#renderPromise
 
@@ -143,7 +115,7 @@ export class Runtime {
         const output = await this.#getOutput(this.#rootNode)
 
         if (this.#options?.debug) {
-          console.log('Rendering: \n')
+          console.log('Rendering:\n')
           console.log(output)
         }
 
@@ -161,6 +133,7 @@ export class Runtime {
 
     return this.#renderPromise
   }
+
   onError(error: Error): void {
     if (process.env.NODE_ENV === 'test') {
       console.warn(error)
@@ -168,6 +141,7 @@ export class Runtime {
 
     throw error
   }
+
   onExit(error?: Error): void {
     this.unmount(error)
   }
@@ -176,12 +150,20 @@ export class Runtime {
     const text = squashTextNodes(node)
     const files = this.fileManager.files
 
-    return files.length
-      ? [...files]
-          .flatMap((file) => [...file.sources].map((item) => item.value))
-          .filter(Boolean)
-          .join('\n\n')
-      : text
+    if (!files.length) {
+      return text
+    }
+
+    const values = new Set<string>()
+    for (const file of files) {
+      for (const source of file.sources) {
+        if (source?.value) {
+          values.add(source.value)
+        }
+      }
+    }
+
+    return [...values].join('\n\n')
   }
 
   async render(node: ReactNode): Promise<void> {
@@ -207,7 +189,6 @@ export class Runtime {
     Renderer.flushSyncWork()
 
     await this.#renderPromise
-
     this.fileManager.clear()
 
     return this.#getOutput(this.#rootNode)
@@ -231,7 +212,6 @@ export class Runtime {
 
     if (error instanceof Error) {
       this.rejectExitPromise(error)
-
       return
     }
 

package/src/components/Indent.tsx

@@ -14,13 +14,13 @@ type IndentProps = {
 export function Indent({ size = 2, children }: IndentProps) {
   if (!children) return null
 
-  const filtered = React.Children.toArray(children).filter(Boolean)
+  const childrenArray = React.Children.toArray(children)
   const result: React.ReactNode[] = []
 
   let prevWasBr = false
   let brCount = 0
 
-  filtered.forEach((child) => {
+  for (const child of childrenArray) {
     if (React.isValidElement(child) && child.type === 'br') {
       if (!prevWasBr || brCount < 2) {
         result.push(child)
@@ -32,7 +32,7 @@ export function Indent({ size = 2, children }: IndentProps) {
       brCount = 0
       result.push(child)
     }
-  })
+  }
 
   return (
     <>

package/src/composables/useLifecycle.tsx

@@ -10,7 +10,9 @@ export function useLifecycle() {
 
   return {
     exit: () => {
-      setTimeout(() => {
+      const timeout = setTimeout(() => {
+        clearTimeout(timeout)
+
         exit()
       }, 0)
     },

package/src/dom.ts

@@ -3,7 +3,7 @@ import type { DOMElement, DOMNode, DOMNodeAttribute, ElementNames, TextNode } fr
 export const createNode = (nodeName: string): DOMElement => {
   const node: DOMElement = {
     nodeName: nodeName as DOMElement['nodeName'],
-    attributes: {},
+    attributes: new Map(),
     childNodes: [],
     parentNode: undefined,
   }
@@ -49,7 +49,7 @@ export const removeChildNode = (node: DOMElement, removeNode: DOMNode): void =>
 }
 
 export const setAttribute = (node: DOMElement, key: string, value: DOMNodeAttribute): void => {
-  node.attributes[key] = value
+  node.attributes.set(key, value)
 }
 
 export const createTextNode = (text: string): TextNode => {
@@ -72,4 +72,4 @@ export const setTextNodeValue = (node: TextNode, text: string): void => {
   node.nodeValue = text
 }
 
-export const nodeNames: Array<ElementNames> = ['kubb-export', 'kubb-file', 'kubb-source', 'kubb-import', 'kubb-text']
+export const nodeNames = new Set<ElementNames>(['kubb-export', 'kubb-file', 'kubb-source', 'kubb-import', 'kubb-text', 'kubb-root', 'kubb-app', 'br'])

package/src/types.ts

@@ -31,7 +31,7 @@ type OutputTransformer = (s: string, index: number) => string
 
 export type DOMElement = {
   nodeName: ElementNames
-  attributes: Record<string, DOMNodeAttribute>
+  attributes: Map<string, DOMNodeAttribute>
   childNodes: DOMNode[]
   internal_transform?: OutputTransformer
 

package/src/utils/createJSDoc.ts

@@ -1,9 +1,8 @@
 export function createJSDoc({ comments }: { comments: Array<string> }): string {
-  const filteredComments = comments.filter(Boolean)
-
-  if (!filteredComments.length) {
+  const filtered = comments.filter((c) => c.trim())
+  if (!filtered.length) {
     return ''
   }
 
-  return `/**\n * ${filteredComments.join('\n * ')}\n */`
+  return `/**\n * ${filtered.join('\n * ')}\n */`
 }

package/src/utils/processFiles.ts

@@ -1,6 +1,4 @@
 import type { KubbFile } from '@kubb/fabric-core/types'
-import type React from 'react'
-import type { File } from '../components/File.tsx'
 import { nodeNames } from '../dom.ts'
 import type { DOMElement } from '../types.ts'
 import { squashExportNodes } from './squashExportNodes.ts'
@@ -11,31 +9,29 @@ export async function processFiles(node: DOMElement): Promise<Array<KubbFile.Fil
   const collected: Array<KubbFile.File> = []
 
   async function walk(current: DOMElement) {
-    for (const childNode of current.childNodes) {
-      if (!childNode) {
+    for (const child of current.childNodes) {
+      if (!child) {
         continue
       }
 
-      if (childNode.nodeName !== '#text' && childNode.nodeName !== 'kubb-file' && nodeNames.includes(childNode.nodeName)) {
-        await walk(childNode)
+      if (child.nodeName !== '#text' && child.nodeName !== 'kubb-file' && nodeNames.has(child.nodeName)) {
+        await walk(child)
       }
 
-      if (childNode.nodeName === 'kubb-file') {
-        const attributes = childNode.attributes as React.ComponentProps<typeof File>
-
-        if (attributes.baseName && attributes.path) {
-          const sources = squashSourceNodes(childNode, ['kubb-export', 'kubb-import'])
+      if (child.nodeName === 'kubb-file') {
+        if (child.attributes.has('baseName') && child.attributes.has('path')) {
+          const sources = squashSourceNodes(child, ['kubb-export', 'kubb-import'])
 
           collected.push({
-            baseName: attributes.baseName,
-            path: attributes.path,
+            baseName: child.attributes.get('baseName'),
+            path: child.attributes.get('path'),
+            meta: child.attributes.get('meta') || {},
+            footer: child.attributes.get('footer'),
+            banner: child.attributes.get('banner'),
             sources: [...sources],
-            exports: [...squashExportNodes(childNode)],
-            imports: [...squashImportNodes(childNode)],
-            meta: attributes.meta || {},
-            footer: attributes.footer,
-            banner: attributes.banner,
-          })
+            exports: [...squashExportNodes(child)],
+            imports: [...squashImportNodes(child)],
+          } as KubbFile.File)
         }
       }
     }

package/src/utils/squashExportNodes.ts

@@ -1,22 +1,32 @@
 import type { KubbFile } from '@kubb/fabric-core/types'
-import type React from 'react'
-import type { File } from '../components/File.tsx'
+
 import { nodeNames } from '../dom.ts'
 import type { DOMElement } from '../types.ts'
 
 export function squashExportNodes(node: DOMElement): Set<KubbFile.ResolvedExport> {
-  let exports = new Set<KubbFile.Export>()
+  const exports = new Set<KubbFile.ResolvedExport>()
 
-  node.childNodes.filter(Boolean).forEach((childNode) => {
-    if (childNode.nodeName !== '#text' && nodeNames.includes(childNode.nodeName)) {
-      exports = new Set([...exports, ...squashExportNodes(childNode)])
-    }
+  const walk = (current: DOMElement): void => {
+    for (const child of current.childNodes) {
+      if (!child) {
+        continue
+      }
+
+      if (child.nodeName !== '#text' && nodeNames.has(child.nodeName)) {
+        walk(child)
+      }
 
-    if (childNode.nodeName === 'kubb-export') {
-      const attributes = childNode.attributes as React.ComponentProps<typeof File.Export>
-      exports.add(attributes)
+      if (child.nodeName === 'kubb-export') {
+        exports.add({
+          name: child.attributes.get('name'),
+          path: child.attributes.get('path'),
+          isTypeOnly: child.attributes.get('isTypeOnly') ?? false,
+          asAlias: child.attributes.get('asAlias') ?? false,
+        } as KubbFile.Export)
+      }
     }
-  })
+  }
 
+  walk(node)
   return exports
 }

package/src/utils/squashImportNodes.ts

@@ -1,22 +1,33 @@
 import type { KubbFile } from '@kubb/fabric-core/types'
-import type React from 'react'
-import type { File } from '../components/File.tsx'
+
 import { nodeNames } from '../dom.ts'
 import type { DOMElement } from '../types.ts'
 
 export function squashImportNodes(node: DOMElement): Set<KubbFile.Import> {
-  let imports = new Set<KubbFile.Import>()
+  const imports = new Set<KubbFile.Import>()
 
-  node.childNodes.filter(Boolean).forEach((childNode) => {
-    if (childNode.nodeName !== '#text' && nodeNames.includes(childNode.nodeName)) {
-      imports = new Set([...imports, ...squashImportNodes(childNode)])
-    }
+  const walk = (current: DOMElement): void => {
+    for (const child of current.childNodes) {
+      if (!child) {
+        continue
+      }
+
+      if (child.nodeName !== '#text' && nodeNames.has(child.nodeName)) {
+        walk(child)
+      }
 
-    if (childNode.nodeName === 'kubb-import') {
-      const attributes = childNode.attributes as React.ComponentProps<typeof File.Import>
-      imports.add(attributes)
+      if (child.nodeName === 'kubb-import') {
+        imports.add({
+          name: child.attributes.get('name'),
+          path: child.attributes.get('path'),
+          root: child.attributes.get('root'),
+          isTypeOnly: child.attributes.get('isTypeOnly') ?? false,
+          isNameSpace: child.attributes.get('isNameSpace') ?? false,
+        } as KubbFile.Import)
+      }
     }
-  })
+  }
 
+  walk(node)
   return imports
 }

package/src/utils/squashSourceNodes.ts

@@ -1,39 +1,43 @@
 import type { KubbFile } from '@kubb/fabric-core/types'
-import type React from 'react'
-import type { File } from '../components/File.tsx'
+
 import { nodeNames } from '../dom.ts'
 import type { DOMElement, ElementNames } from '../types.ts'
 import { squashTextNodes } from './squashTextNodes.ts'
 
 export function squashSourceNodes(node: DOMElement, ignores: Array<ElementNames>): Set<KubbFile.Source> {
-  let sources = new Set<KubbFile.Source>()
-
-  for (const childNode of node.childNodes) {
-    if (!childNode) {
-      continue
-    }
-
-    if (childNode.nodeName !== '#text' && ignores.includes(childNode.nodeName)) {
-      continue
-    }
-
-    if (childNode.nodeName === 'kubb-source') {
-      const attributes = childNode.attributes as React.ComponentProps<typeof File.Source>
-      const value = squashTextNodes(childNode)
-
-      sources.add({
-        ...attributes,
-        // remove end enter
-        value: value.trim().replace(/^\s+|\s+$/g, ''),
-      })
-
-      continue
-    }
-
-    if (childNode.nodeName !== '#text' && nodeNames.includes(childNode.nodeName)) {
-      sources = new Set([...sources, ...squashSourceNodes(childNode, ignores)])
+  const ignoreSet = new Set(ignores)
+  const sources = new Set<KubbFile.Source>()
+
+  const walk = (current: DOMElement): void => {
+    for (const child of current.childNodes) {
+      if (!child) {
+        continue
+      }
+
+      if (child.nodeName !== '#text' && ignoreSet.has(child.nodeName)) {
+        continue
+      }
+
+      if (child.nodeName === 'kubb-source') {
+        const value = squashTextNodes(child)
+
+        sources.add({
+          name: child.attributes.get('name'),
+          isTypeOnly: child.attributes.get('isTypeOnly') ?? false,
+          isExportable: child.attributes.get('isExportable') ?? false,
+          isIndexable: child.attributes.get('isIndexable') ?? false,
+          // trim whitespace/newlines
+          value: value.trim().replace(/^\s+|\s+$/g, ''),
+        } as KubbFile.Source)
+        continue
+      }
+
+      if (child.nodeName !== '#text' && nodeNames.has(child.nodeName)) {
+        walk(child)
+      }
     }
   }
 
+  walk(node)
   return sources
 }

package/src/utils/squashTextNodes.ts

@@ -1,82 +1,91 @@
 import { createExport, createImport, print } from '@kubb/fabric-core/parsers/typescript'
 
-import type { File } from '../components/File.tsx'
 import { nodeNames } from '../dom.ts'
-import type { DOMElement } from '../types.ts'
+import type { DOMElement, KubbFile } from '../types.ts'
 
 export function squashTextNodes(node: DOMElement): string {
   let text = ''
 
-  for (const childNode of node.childNodes) {
-    if (!childNode) {
-      continue
-    }
-
-    let nodeText = ''
+  const walk = (current: DOMElement): string => {
+    let content = ''
 
-    const getPrintText = (text: string): string => {
-      if (childNode.nodeName === 'kubb-import') {
-        const attributes = childNode.attributes as React.ComponentProps<typeof File.Import>
-
-        return print([
-          createImport({
-            name: attributes.name,
-            path: attributes.path,
-            root: attributes.root,
-            isTypeOnly: attributes.isTypeOnly,
-          }),
-        ])
+    for (const child of current.childNodes) {
+      if (!child) {
+        continue
       }
 
-      if (childNode.nodeName === 'kubb-export') {
-        const attributes = childNode.attributes as React.ComponentProps<typeof File.Export>
-        if (attributes.path) {
-          return print([
-            createExport({
-              name: attributes.name,
-              path: attributes.path,
-              isTypeOnly: attributes.isTypeOnly,
-              asAlias: attributes.asAlias,
-            }),
-          ])
+      let nodeText = ''
+
+      const getPrintText = (text: string): string => {
+        switch (child.nodeName) {
+          case 'kubb-import': {
+            return print(
+              createImport({
+                name: child.attributes.get('name'),
+                path: child.attributes.get('path'),
+                root: child.attributes.get('root'),
+                isTypeOnly: child.attributes.get('isTypeOnly'),
+                isNameSpace: child.attributes.get('isNameSpace'),
+              } as KubbFile.Import),
+            )
+          }
+          case 'kubb-export': {
+            if (child.attributes.has('path')) {
+              return print(
+                createExport({
+                  name: child.attributes.get('name'),
+                  path: child.attributes.get('path'),
+                  isTypeOnly: child.attributes.get('isTypeOnly'),
+                  asAlias: child.attributes.get('asAlias'),
+                } as KubbFile.Export),
+              )
+            }
+            return ''
+          }
+          case 'kubb-source':
+            return text
+          default:
+            return text
         }
       }
 
-      if (childNode.nodeName === 'kubb-source') {
-        return text
-      }
-
-      return text
-    }
+      if (child.nodeName === '#text') {
+        nodeText = child.nodeValue
+      } else {
+        if (child.nodeName === 'kubb-text' || child.nodeName === 'kubb-file' || child.nodeName === 'kubb-source') {
+          nodeText = walk(child)
+        }
 
-    if (childNode.nodeName === '#text') {
-      nodeText = childNode.nodeValue
-    } else {
-      if (['kubb-text', 'kubb-file', 'kubb-source'].includes(childNode.nodeName)) {
-        nodeText = squashTextNodes(childNode)
-      }
+        nodeText = getPrintText(nodeText)
 
-      nodeText = getPrintText(nodeText)
+        if (child.nodeName === 'br') {
+          nodeText = '\n'
+        }
 
-      if (childNode.nodeName === 'br') {
-        nodeText = '\n'
-      }
+        if (!nodeNames.has(child.nodeName)) {
+          const attributes = child.attributes
+          let attrString = ''
+          const hasAttributes = attributes.size > 0
 
-      // no kubb element or br
-      if (![...nodeNames, 'br'].includes(childNode.nodeName)) {
-        const attributes = Object.entries(childNode.attributes).reduce((acc, [key, value]) => {
-          if (typeof value === 'string') {
-            return `${acc} ${key}="${value}"`
+          for (const [key, value] of attributes) {
+            attrString += typeof value === 'string' ? ` ${key}="${value}"` : ` ${key}={${String(value)}}`
           }
 
-          return `${acc} ${key}={${value}}`
-        }, '')
-        nodeText = `<${childNode.nodeName}${attributes}>${squashTextNodes(childNode)}</${childNode.nodeName}>`
+          if (hasAttributes) {
+            nodeText = `<${child.nodeName}${attrString}>${walk(child)}</${child.nodeName}>`
+          } else {
+            nodeText = `<${child.nodeName}>${walk(child)}</${child.nodeName}>`
+          }
+        }
       }
+
+      content += nodeText
     }
 
-    text += nodeText
+    return content
   }
 
+  text = walk(node)
+
   return text
 }

package/dist/jsx-runtime-CywUjp4I.cjs

@@ -1,5 +0,0 @@
-const require_chunk = require('./chunk-CUT6urMc.cjs');
-let react_jsx_dev_runtime = require("react/jsx-dev-runtime");
-react_jsx_dev_runtime = require_chunk.__toESM(react_jsx_dev_runtime);
-let react_jsx_runtime = require("react/jsx-runtime");
-react_jsx_runtime = require_chunk.__toESM(react_jsx_runtime);