Function stringifyBaseComponent

packages/extension/utils/component.ts:192–281

(
  component: DevComponent,
  stringifyProp: (key: string, value: unknown) => string,
  indentLevel = 0,
  isInline?: (tagName: string) => boolean
)

const INDENT_UNIT = '  '

function stringifyBaseComponent(
  component: DevComponent,
  stringifyProp: (key: string, value: unknown) => string,
  indentLevel = 0,
  isInline?: (tagName: string) => boolean
) {
  const indent = INDENT_UNIT.repeat(indentLevel)
  const { name, props, children: rawChildren } = component

  if (name === RAW_TAG_NAME) {
    const content = String(props.content || '')
    const injectedProps = props.injectedProps as Record<string, string> | undefined
    let result = content
    if (injectedProps) {
      result = mergeAttributes(content, injectedProps)
    }
    return indentAll(result, indent)
  }

  const propItems = Object.entries(props)
    .filter(([, value]) => value != null)
    .map((entry) => stringifyProp(...entry))
    .filter(Boolean)

  const firstItem = propItems[0]

  const propsString =
    propItems.length === 0
      ? ''
      : propItems.length === 1
        ? firstItem.includes('\n')
          ? ` ${indentAll(firstItem, indent, true)}`
          : ` ${firstItem}`
        : `\n${propItems
            .map((prop) => `${indentAll(prop, indent + INDENT_UNIT)}`)
            .join('\n')}\n${indent}`

  const children = rawChildren.filter((child) => child != null)

  // Compact Mode Check
  const shouldCompact = isInline?.(name) ?? false

  let childrenString: string

  if (shouldCompact) {
    // Compact Mode: No newlines, no extra indent, join with empty string
    childrenString = children
      .map((child): string => {
        if (typeof child === 'string') {
          return escapeHTML(child)
        }
        return stringifyBaseComponent(child, stringifyProp, 0, isInline)
      })
      .join('')
  } else if (children.length === 0) {
    // Block Mode with no children
    childrenString = ''
  } else {