boltdocs 2.5.5 → 2.6.0

package/src/client/app/preload.tsx

@@ -1,66 +0,0 @@
-import { createContext, use, useCallback, useRef } from 'react'
-import type { ComponentRoute } from '../types'
-
-interface PreloadContextType {
-  preload: (path: string) => void
-  routes: ComponentRoute[]
-}
-
-const PreloadContext = createContext<PreloadContextType>({
-  preload: () => {},
-  routes: [],
-})
-
-export function usePreload() {
-  return use(PreloadContext)
-}
-
-export function PreloadProvider({
-  routes,
-  modules,
-  children,
-}: {
-  routes: ComponentRoute[]
-  modules: Record<string, () => Promise<unknown>>
-  children: React.ReactNode
-}) {
-  const preloadTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
-
-  const preload = useCallback(
-    (path: string) => {
-      if (preloadTimerRef.current) {
-        clearTimeout(preloadTimerRef.current)
-      }
-
-      preloadTimerRef.current = setTimeout(() => {
-        // Normalize path (remove hash and search)
-        const cleanPath = path.split('#')[0].split('?')[0]
-
-        // Support index routes matching "/"
-        const route = routes.find(
-          (r) => r.path === cleanPath || (cleanPath === '/' && r.path === ''),
-        )
-
-        if (route?.filePath) {
-          const loaderKey = Object.keys(modules).find((k) =>
-            k.endsWith('/' + route.filePath),
-          )
-
-          if (loaderKey) {
-            // Trigger the dynamic import
-            modules[loaderKey]().catch((err: unknown) => {
-              console.error(`[boltdocs] Failed to preload route ${path}:`, err)
-            })
-          }
-        }
-      }, 100) // 100ms debounce
-    },
-    [routes, modules],
-  )
-
-  return (
-    <PreloadContext.Provider value={{ preload, routes }}>
-      {children}
-    </PreloadContext.Provider>
-  )
-}

package/src/client/app/router.tsx

@@ -1,30 +0,0 @@
-import type React from 'react'
-import { startTransition } from 'react'
-import { RouterProvider } from 'react-aria-components'
-import { useNavigate, useHref } from 'react-router-dom'
-
-/**
- * Connects React Aria Components (RAC) to React Router.
- * This ensures all RAC links and buttons use client-side navigation
- * instead of full page reloads.
- */
-export function BoltdocsRouterProvider({
-  children,
-}: {
-  children: React.ReactNode
-}) {
-  const navigate = useNavigate()
-
-  return (
-    <RouterProvider
-      navigate={(to, options) => {
-        startTransition(() => {
-          navigate(to, options)
-        })
-      }}
-      useHref={useHref}
-    >
-      {children as any}
-    </RouterProvider>
-  )
-}

package/src/client/integrations/codesandbox.ts

@@ -1,179 +0,0 @@
-import { getParameters } from 'codesandbox/lib/api/define.js'
-import { SandboxOptions } from '../types'
-
-/**
- * Build the files payload for the CodeSandbox Define API.
- * Ensures every file conforms to the `{ content, isBinary }` shape
- * required by the SDK, and auto-generates a `package.json` when one
- * isn't explicitly provided.
- */
-function buildSandboxFiles(options: SandboxOptions) {
-  const files = options.files || {}
-  const dependencies = options.dependencies || {}
-  const devDependencies = options.devDependencies || {}
-  const title = options.title || 'codesandbox-project'
-  const description = options.description || 'Generic Sandbox'
-
-  const finalFiles: Record<string, { content: string; isBinary: boolean }> = {}
-
-  for (const [path, file] of Object.entries(files)) {
-    const content =
-      typeof file.content === 'object'
-        ? JSON.stringify(file.content, null, 2)
-        : file.content
-    finalFiles[path] = { content, isBinary: file.isBinary ?? false }
-  }
-
-  if (!finalFiles['package.json']) {
-    const isVite =
-      options.template === 'vite' ||
-      !!devDependencies.vite ||
-      !!devDependencies['@vitejs/plugin-react']
-
-    const defaultScripts = isVite
-      ? {
-          dev: 'vite',
-          build: 'vite build',
-          preview: 'vite preview',
-        }
-      : {
-          start: 'node index.js',
-        }
-
-    finalFiles['package.json'] = {
-      content: JSON.stringify(
-        {
-          private: true,
-          name: title,
-          description,
-          type: 'module',
-          version: '1.0.0',
-          scripts: options.scripts || defaultScripts,
-          dependencies,
-          devDependencies,
-        },
-        null,
-        2,
-      ),
-      isBinary: false,
-    }
-  }
-
-  return finalFiles
-}
-
-/**
- * Helper to define a sandbox and get a URL for the CodeSandbox Define API.
- * Uses the official SDK `getParameters` for proper LZ-string compression.
- */
-export function defineSandbox(options: SandboxOptions) {
-  const finalFiles = buildSandboxFiles(options)
-  const parameters = getParameters({ files: finalFiles })
-
-  // FIX: Agregar query params que forzan comportamiento correcto
-  const query = new URLSearchParams({
-    parameters,
-    // FIX: Forzar instalación de dependencias
-    installDependencies: 'true',
-  })
-
-  // FIX: Agregar file query para que abra el entry correcto
-  if (options.entry) {
-    query.set('file', `/${options.entry}`)
-  }
-
-  return {
-    parameters,
-    url: `https://codesandbox.io/api/v1/sandboxes/define?${query.toString()}`,
-    options,
-  }
-}
-
-/**
- * CORE API: Open a CodeSandbox using a form POST to the Define API.
- *
- * Uses a hidden form + POST which avoids URL length limits and is the
- * recommended approach from CodeSandbox documentation. The SDK's
- * `getParameters` handles LZ-string compression internally.
- */
-export function openSandbox(options: SandboxOptions) {
-  if (typeof window === 'undefined') return defineSandbox(options)
-
-  const finalFiles = buildSandboxFiles(options)
-  const parameters = getParameters({ files: finalFiles })
-  const entry = options.entry || 'src/App.tsx'
-
-  // Use form POST – the most reliable method for the Define API
-  const form = document.createElement('form')
-  form.method = 'POST'
-  form.target = '_blank'
-  form.action = 'https://codesandbox.io/api/v1/sandboxes/define'
-  form.style.display = 'none'
-
-  const addField = (name: string, value: string) => {
-    const input = document.createElement('input')
-    input.type = 'hidden'
-    input.name = name
-    input.value = value
-    form.appendChild(input)
-  }
-
-  const queryParams = new URLSearchParams({
-    file: `/${entry}`,
-    // FIX: Forzar vista de preview (no solo editor)
-    // FIX: Deshabilitar eslint que a veces bloquea
-    eslint: '0',
-    // FIX: Habilitar codemirror
-    codemirror: '1',
-    // FIX: Forzar instalación de deps
-    installDependencies: 'true',
-  })
-
-  addField('query', queryParams.toString())
-  addField('parameters', parameters)
-
-  document.body.appendChild(form)
-  form.submit()
-  document.body.removeChild(form)
-
-  return {
-    parameters,
-    url: `https://codesandbox.io/api/v1/sandboxes/define?parameters=${parameters}`,
-    options,
-  }
-}
-
-/**
- * Generate an embeddable iframe URL for a CodeSandbox.
- *
- * This gives you more control than `openSandbox` — you can embed the sandbox
- * inline on the page rather than opening a new tab. The returned URL can be
- * used as the `src` of an `<iframe>`.
- *
- * @example
- * ```tsx
- * const url = embedSandbox({
- *   files: { "index.js": { content: "console.log('hello')" } },
- *   embed: { view: "editor", theme: "dark" },
- * }).url;
- * // url → "https://codesandbox.io/api/v1/sandboxes/define?parameters=…&embed=1&view=editor&theme=dark"
- * ```
- */
-export function embedSandbox(options: SandboxOptions) {
-  const finalFiles = buildSandboxFiles(options)
-  const parameters = getParameters({ files: finalFiles })
-  const embedOptions = options.embed || {}
-
-  const query = new URLSearchParams({ parameters, embed: '1' })
-
-  if (embedOptions.view) query.set('view', embedOptions.view)
-  if (embedOptions.theme) query.set('theme', embedOptions.theme)
-  if (embedOptions.hideNavigation) query.set('hidenavigation', '1')
-  if (options.entry) query.set('file', `/${options.entry}`)
-
-  return {
-    parameters,
-    url: `https://codesandbox.io/api/v1/sandboxes/define?${query.toString()}`,
-    options,
-  }
-}

package/src/client/integrations/index.ts

@@ -1 +0,0 @@
-export * from './codesandbox'

package/src/client/ssr.tsx

@@ -1,65 +0,0 @@
-import React from 'react'
-import ReactDOMServer from 'react-dom/server'
-import { StaticRouter } from 'react-router-dom/server'
-import { AppShell } from './app'
-import type { ComponentRoute } from './types'
-
-/**
- * Options for rendering the Boltdocs application on the server (SSG).
- */
-export interface RenderOptions {
-  /** The URL path currently being rendered */
-  path: string
-  /** Initial routes generated by the Vite plugin (`virtual:boltdocs-routes`) */
-  routes: ComponentRoute[]
-  /** Site configuration (`virtual:boltdocs-config`) */
-  config: any
-  /** The name of the documentation directory (e.g. 'docs') */
-  docsDirName: string
-  /** Optional custom React component to render when visiting the root path ('/') */
-  homePage?: React.ComponentType
-  /** Custom external pages mapped by their route path */
-  externalPages?: Record<string, React.ComponentType<any>>
-  /** Preloaded modules (since SSR cannot use dynamic imports easily) */
-  modules: Record<string, any>
-}
-
-/**
- * Renders the full React application into an HTML string for a specific route.
- * This is called by the Node SSG script during the Vite build process.
- */
-export async function render(options: RenderOptions): Promise<string> {
-  const {
-    path,
-    routes,
-    config,
-    modules,
-    homePage,
-    externalPages,
-    docsDirName,
-  } = options
-
-  // For SSR, we must resolve modules synchronously. We create a mock 'loader'
-  // that instantly returns the module since the SSG script already loaded it.
-  const resolvedModules: Record<string, () => Promise<any>> = {}
-  for (const [key, mod] of Object.entries(modules)) {
-    resolvedModules[key] = () => Promise.resolve(mod)
-  }
-
-  const html = ReactDOMServer.renderToString(
-    <React.StrictMode>
-      <StaticRouter location={path}>
-        <AppShell
-          initialRoutes={routes}
-          initialConfig={config}
-          docsDirName={docsDirName}
-          modules={resolvedModules}
-          homePage={homePage}
-          externalPages={externalPages}
-        />
-      </StaticRouter>
-    </React.StrictMode>,
-  )
-
-  return html
-}

package/src/client/store/use-boltdocs-store.ts

@@ -1,44 +0,0 @@
-import { create } from 'zustand'
-import { persist, createJSONStorage } from 'zustand/middleware'
-
-interface BoltdocsState {
-  currentLocale: string | undefined
-  currentVersion: string | undefined
-  hasHydrated: boolean
-
-  // Actions
-  setLocale: (locale: string | undefined) => void
-  setVersion: (version: string | undefined) => void
-  setHasHydrated: (val: boolean) => void
-}
-
-/**
- * Global store for Boltdocs documentation state.
- * Uses localStorage persistence to remember user preferences across sessions.
- */
-export const useBoltdocsStore = create<BoltdocsState>()(
-  persist(
-    (set) => ({
-      currentLocale: undefined,
-      currentVersion: undefined,
-      hasHydrated: false,
-
-      setLocale: (locale: string | undefined) => set({ currentLocale: locale }),
-      setVersion: (version: string | undefined) =>
-        set({ currentVersion: version }),
-      setHasHydrated: (val: boolean) => set({ hasHydrated: val }),
-    }),
-    {
-      name: 'boltdocs-storage',
-      storage: createJSONStorage(() => localStorage),
-      // Only persist identifying state
-      partialize: (state: BoltdocsState) => ({
-        currentLocale: state.currentLocale,
-        currentVersion: state.currentVersion,
-      }),
-      onRehydrateStorage: () => (state?: BoltdocsState) => {
-        state?.setHasHydrated(true)
-      },
-    },
-  ),
-)