duto 0.0.0 → 0.260808.0

package/src/compiler/types.ts

@@ -0,0 +1,209 @@
+// import type { ComponentType, FunctionComponent, VNode } from 'preact'
+import type { FunctionComponent, VNode } from 'preact'
+
+export type PluginOptions = {
+  root?: string,
+  // Directory to scan for pages, relative to Vite root. Default: "./pages"
+  pagesDir?: string,
+}
+
+export type DepMetadata = {
+  path: string,
+  ref: string,
+}
+
+export type FileMetadata = {
+  path: string,
+  content: string,
+  deps: Map<string, DepMetadata>,
+}
+
+export type I18nMetadata = {
+  fallbackLocale: string,
+  locales: string[],
+  messages: Record<string, Record<string, string>>,
+  routes: Record<string, Record<string, string>>,
+  routeMap: Record<string, string>,
+  pageRoutes: { locale: string, path: string }[]
+  options: Record<string, string>,
+  string: string,
+}
+
+export type SummaryMetadata = {
+  type: number,
+  path: string,
+  size: number,
+  sizeBr: number,
+  sizeJS: number,
+  children?: Map<string, SummaryMetadata>,
+}
+
+export type Metadata = {
+  root: string,
+  dir: string,
+  aliases: Record<string, string>,
+  map: Map<string, FileMetadata>,
+  violations: Map<string, DepMetadata[]>,
+  layouts: Map<string, IRoute>, // all layouts
+  nf: Map<string, IRoute>, // all 404
+  pages: Map<string, IRoute>, // all
+  spages: Set<string>, // ssg pages
+  routes: Routes, // client-side
+  // routes: Map<string, IRoute>, // client-side
+  assets: string[],
+  i18n: I18nMetadata,
+  string: string,
+  summary: Map<string, SummaryMetadata>,
+}
+
+export type Page<P = {}> = FunctionComponent<VNode<P>>
+// A page module as imported by Bun/Vite
+export type PageModule<P = {}> = {
+  default: Page<P>,
+  // default: ComponentType<VNode<any>>,
+  getStaticProps?: GetStaticProps,
+  getProps?: GetProps,
+}
+
+/**
+ * getStaticProps — build-only.
+ * For static pages (no dynamic segments): returns a single props object.
+ * For dynamic pages: returns an array of { [routeParam]: value, ...props }
+ *
+ */
+export type GetStaticProps =
+  | (() => StaticProps | Promise<StaticProps>)
+  | (() => StaticProps[] | Promise<StaticProps[]>)
+export type StaticProps = Record<string, unknown>
+
+/** browser-only */
+// export type $duto = {
+//   sroutes: Set<string>,
+//   navigate: {},
+//   route: { pattern: string, params: RouteParams, path: string },
+// }
+export type GetProps = (params: RouteParams) => StaticProps | Promise<StaticProps>
+export type RouteParams = Record<string, string | string[] | undefined>
+
+export type Routes = IRoute[]
+export type IRoute = {
+  content: string,
+  mod: PageModule,
+  /** True if the page exports getStaticProps */
+  hasGetStaticProps: boolean,
+  /** True if the page exports getProps */
+  hasGetProps: boolean,
+  isClientOnly: boolean,
+  islands: ImportUsage[], // TODO mover para cá
+  // islands: IslandMeta[],
+  // safeFilePath: string,
+  layouts: IRoute[],
+  importName: string,
+
+  ////////////////////////////
+
+  fileExt: string,
+  fileName: string,
+  /** Original file path relative to pages dir, e.g. `blog/[slug].tsx` */
+  filePath: string,
+  fullFilePath: string,
+  /** Wouter-compatible pattern, e.g. `/blog/:slug` */
+  pattern: string,
+  /** Params extracted from the path segments */
+  params: Record<string, RouteParam>,
+  // params: RouteParam[],
+	/**
+	 * Similar to the "params" field, but with more associated metadata. For example, for `/site/[blog]/[...slug].tsx`, the segments are:
+	 *
+	 * 1. `{ content: 'site', dynamic: false, spread: false }`
+	 * 2. `{ content: 'blog', dynamic: true, spread: false }`
+	 * 3. `{ content: '...slug', dynamic: true, spread: true }`
+	 */
+	// segments: RoutePart[][]; // alternativa ao "params"
+  is404: boolean,
+  /** True if this route has any dynamic segments */
+  isDynamic: boolean,
+  /** True if this route are internal */
+  isInternal: boolean,
+}
+
+export type RouteParam = {
+  name: string,
+  optional: boolean,
+  catchAll: boolean,
+  value?: string | string[],
+}
+
+
+
+export interface Usage {
+  type: 'jsx' | 'call' | 'reference'
+  source: string,
+  imported: string,
+  local: string,
+  start: number,
+  end: number,
+  text: string,
+  node: unknown,
+  parent: unknown,
+}
+
+export interface ImportUsage {
+  source: string,
+  imported: string,
+  local: string,
+  importStart: number,
+  importEnd: number,
+  importText: string,
+  usages: Usage[],
+}
+
+export interface IslandMeta {
+  /** Identificador curto e único (base64url de 7 chars) */
+  id: string
+  /** URL pública do asset JS do componente */
+  url: string
+  /** Nome do export usado */
+  export: string
+  /** Props serializadas como JSON (HTML-encoded) */
+  props: string
+  /** HTML do SSR do componente */
+  ssrHtml: string
+}
+
+// export interface ReplaceIslandsOptions {
+//   /**
+//    * Função que resolve o nome do componente para a URL pública do asset JS.
+//    * Ex: 'Counter' → '/assets/Counter.BQxoyJbC.js'
+//    */
+//   resolveUrl: (exportName: string) => string
+//   /**
+//    * Função que carrega o módulo do componente para fazer SSR.
+//    * Recebe o source da importação (ex: '@/components/counter2') e o nome do export.
+//    */
+//   loadComponent: (source: string, exportName: string) => Promise<unknown>
+// }
+
+
+// export type Island = {
+//   /** Unique id — written as data-island on the placeholder div */
+//   id: string,
+//   /** Component display name — used by the client to look up the component */
+//   name: string,
+//   /** Props serialised into the placeholder for client hydration */
+//   props: Record<string, unknown>,
+// }
+
+// export type RenderResult = {
+//   html: string,
+//   islands: Island[],
+//   /** true if any islands were found (= client JS needed) */
+//   hasIslands: boolean,
+// }
+
+// export type IslandMeta = {
+//   id: string,
+//   name: string,
+//   props: Record<string, unknown>,
+// }
+

package/src/compiler/utils.ts

@@ -0,0 +1,5 @@
+import { Envir } from 't0n'
+import { dirname, join } from 'pathe'
+
+export const _duto = join(dirname(new URL(import.meta.url).pathname), '..')
+export const _root = Envir.get('npm_config_local_prefix') || Envir.get('PWD') || join(_duto, '../../../')

package/src/compiler/vite-plugin.ts

@@ -0,0 +1,324 @@
+// REF: https://github.com/tailwindlabs/tailwindcss/blob/main/packages/%40tailwindcss-vite/src/index.ts
+
+import { existsSync, readFileSync, rmSync } from 'node:fs'
+import { join } from 'node:path'
+import { defineConfig } from 'vite'
+
+import preact from '@preact/preset-vite'
+import tailwind from '@tailwindcss/vite'
+
+import { EXT_RE } from './constants'
+import { setAsset, setChunk, setEntry } from './assets'
+import { renderPage } from './'
+import { removeExports, resolveImport } from './ast'
+import { getMetadata } from './meta'
+
+import type { IncomingMessage, ServerResponse } from 'node:http'
+import type {
+  // Plugin,
+  UserConfig, ConfigEnv, ResolvedConfig,
+  PreviewServer,
+  // ViteDevServer,
+  EnvironmentOptions,
+  PluginOption,
+} from 'vite'
+import type { Metadata, PluginOptions } from './types'
+import { _duto, _root } from './utils'
+
+const VIRTUAL_ID = ':duto'
+const RESOLVED_ID = '\0'+ VIRTUAL_ID
+
+export const config = (opts: UserConfig & PluginOptions) => {
+  if (!opts.root) opts.root = _root
+  if (!opts.pagesDir) opts.pagesDir = 'pages',
+
+  opts.logLevel = 'silent'
+  opts.plugins = [
+    ...(opts.plugins || []),
+    preact(),
+    tailwind(),
+    plugin(opts),
+  ]
+
+  return defineConfig(opts)
+}
+
+export default config
+
+let metadata: Metadata
+export function meta() {
+  return metadata
+}
+
+export function plugin(options: PluginOptions = {}): PluginOption[] {
+  // let server: ViteDevServer
+  let config: ResolvedConfig
+  const {
+    root = _root, // process.env.npm_config_local_prefix || process.env.PWD || process.cwd() || __dirname,
+    pagesDir = 'pages',
+  } = options
+
+  // let metadata: Metadata
+
+  const PAGES_RE = new RegExp(`\/${pagesDir}\/.*\.(tsx?|jsx?)$`, 'i')
+  const stripTarget = new Set(['getStaticProps'])
+
+  return [
+    {
+      name: 'duto:preact-environment',
+
+      configEnvironment(name, options) {
+        const opts: EnvironmentOptions = {optimizeDeps: {}, resolve: {}}
+
+        if (name === 'client') {
+          opts.optimizeDeps!.include = [
+            'preact',
+            'preact/jsx-runtime',
+          ]
+        }
+
+        opts.resolve = {dedupe: ['preact/compat', 'preact']}
+
+        if (name === 'client')
+          opts.optimizeDeps!.include!.push(
+            'preact/compat',
+            // 'preact/test-utils',
+            'preact/compat/jsx-runtime',
+          )
+
+        if (
+          !options.resolve?.noExternal &&
+          (name === 'ssr' || name === 'prerender')
+        ) {
+          // noExternal React entrypoints to be bundled, resolved, and aliased by Vite
+          opts.resolve!.noExternal = [
+            'react',
+            'react-dom',
+            'react-dom/test-utils',
+            'react/jsx-runtime',
+          ]
+        }
+
+        return opts
+      },
+
+      // configurePreviewServer(server: PreviewServer) {
+      //   const distDir = join(server.config.root, 'dist')
+
+      //   server.middlewares.use((req: IncomingMessage, res: ServerResponse, next: (err?: any) => void) => {
+      //     if (req.url && !existsSync(join(distDir, req.url.split('?')[0]))) {
+      //       const notFound = join(distDir, '404.html')
+
+      //       if (existsSync(notFound)) {
+      //         res.statusCode = 404
+      //         res.setHeader('Content-Type', 'text/html')
+      //           .end(readFileSync(notFound, 'utf-8'))
+      //         return
+      //       }
+      //     }
+
+      //     next()
+      //   })
+      // },
+
+    },
+
+    {
+      name: 'duto:scan',
+      enforce: 'pre',
+
+      // configureServer(_server) {
+      //   server = _server
+      //   // servers.push(server)
+      // },
+
+      async config(conf: UserConfig, env: ConfigEnv) {
+        // if (!metadata)
+          metadata = await getMetadata(root, pagesDir)
+
+        // console.log(metadata.map)
+        // console.log(metadata.violations)
+        // console.log(Array.from(metadata.violations).filter(file => EXT_RE.test(file)))
+
+        if (conf.build) {
+          // conf.build.emptyOutDir = false
+          conf.build.copyPublicDir = false
+          conf.build.manifest = false
+          conf.build.modulePreload = { polyfill: false }
+
+          conf.build.minify = true
+          conf.build.cssMinify = true //////
+
+          conf.build.rolldownOptions = conf.build.rolldownOptions || {}
+          conf.build.rolldownOptions.preserveEntrySignatures = 'exports-only' ///
+          conf.build.rolldownOptions.input = [
+            ':duto/client/app.tsx',
+            // ':duto/not-found.tsx',
+            ...Object.keys(metadata.pages),
+            ...metadata.assets,
+          ]
+          // conf.build.rolldownOptions.input = ':duto/client/app.tsx'
+          conf.build.rolldownOptions.output = {
+            hoistTransitiveImports: false,
+            format: 'esm',
+            minifyInternalExports: true,
+
+            // manualChunks: {
+            //   vendor: ['preact', '@preact/signals', 'wouter-preact'],
+            // },
+            // preserveModules: true,
+            preserveModulesRoot: '/',
+            assetFileNames: '[hash][extname]',
+            entryFileNames: '[hash].js',
+            chunkFileNames: '[hash].js',
+
+            // chunkFileNames: '[name].[hash].js',
+            // entryFileNames: 'assets/[name].js',
+            // chunkFileNames: 'assets/chunks/[name]-[hash].js',
+            // assetFileNames: 'assets/[name][extname]',
+          }
+        }
+
+        return conf
+      },
+
+      async configResolved(conf) {
+        config = conf
+      },
+
+      resolveId(id) {
+        if (id === VIRTUAL_ID) return RESOLVED_ID
+
+        if (id.startsWith(':root')) {
+          for (const f of [
+            'style.css',
+            'styles.css',
+            'styles/index.css',
+            'style/index.css',
+            'tailwind.css',
+            'tailwindcss.css',
+            'styles/tailwind.css',
+            'styles/tailwindcss.css',
+          ]) {
+            const path = join(config.root, f)
+            if (existsSync(path)) {
+              setEntry(id, path)
+              return path
+            }
+          }
+
+          return null
+        }
+
+        if (!id.startsWith(VIRTUAL_ID)) return null
+
+        if (EXT_RE.test(id) && id.includes('/')) {
+          const path = join(_duto, id.replace(VIRTUAL_ID, ''))
+          setEntry(id, path)
+          return path
+        }
+
+        if (id.endsWith('/hmr') && global.__hmr)
+          return join(_duto, id.replace(VIRTUAL_ID, '') + '.ts')
+
+        return id.replace(VIRTUAL_ID, RESOLVED_ID)
+      },
+
+      async load(id) {
+        if (!id.startsWith(RESOLVED_ID)) return
+
+        if (id.endsWith('/i18n'))
+          return metadata.i18n.string
+
+        return metadata.string
+      },
+
+      generateBundle(_, bundle) {
+        // const moduleIds = this.getModuleIds()
+        // for (const id of moduleIds)
+        // console.error(id)
+
+        for (const key in bundle) {
+          const file = bundle[key]
+          if (file.type === 'chunk' && file.isEntry) {
+            setChunk(file.facadeModuleId, '/'+ file.fileName)
+            continue
+          }
+
+          if (file.type === 'asset' && file?.originalFileName?.endsWith('duto/client/app.tsx'))
+            file.source += 'd-b,d-p,i-d,i-s,i-i{display:contents}'
+
+          if (file.type === 'asset' && file.fileName.endsWith('.css')) {
+            setAsset(resolveImport(file.originalFileName as string, metadata.root, metadata.aliases), '/'+ file.fileName)
+            continue
+          }
+
+          // console.error(file.fileName)
+          // console.error(file.type)
+          // console.error(file.viteMetadata)
+          // if (file.type !== 'chunk' || !file.isEntry) continue
+        }
+      },
+
+    },
+
+    {
+      name: 'duto:build',
+      enforce: 'pre',
+      apply: 'build',
+
+      async buildStart() {
+        // if (!server) {
+        //   const { createServer } = await import('vite')
+        //   server = await createServer({ server: {middlewareMode: true} })
+        // }
+
+
+        // teste de import de assets
+      //   for (const file of metadata.assets) {
+      //   const id = await this.resolve(file)
+      //   if (!id) continue
+
+      //   console.error(id)
+      //   console.error(relative(metadata.root, file).replace(/\.(ts|tsx)$/, '.js'),)
+
+      //   this.emitFile({
+      //     type: 'chunk',
+      //     id: id.id,
+      //     implicitlyLoadedAfterOneOf: [
+      //       ':duto/app.tsx',
+      //     ]
+      //     // fileName: 'assets/[name]-[hash][extname]',
+      //     // fileName: relative(metadata.root, file).replace(/\.(ts|tsx)$/, '.js'),
+      //   })
+      // }
+
+      },
+
+      async closeBundle() {
+        for (const [_filePath, page] of metadata.pages) {
+          await renderPage(metadata, config, page)
+          // const mod = await server.ssrLoadModule(_filePath)
+        }
+
+        rmSync(join(metadata.root, 'tmp'), {recursive: true, force: true})
+        // await server.close()
+      },
+
+      // TODO: precisa ser aqui mesmo pois se a pagina for importada no entry, pode incluir codigo nao usado no chunck/bundle
+      async transform(code, id) {
+        if (!PAGES_RE.test(id) || id.includes('node_modules')) return null
+        // console.log(this.getModuleInfo(id))
+
+        const stripped = removeExports(id, code, stripTarget)
+        if (!stripped || stripped === code) return null
+
+        return {
+          code: stripped,
+          map: null, // source maps omitted for brevity, add if needed
+        }
+      },
+
+    },
+  ]
+}

package/src/components/link.tsx

@@ -0,0 +1,38 @@
+import { Link as WouterLink, useLocation } from 'wouter-preact'
+import type { LinkProps } from 'wouter-preact'
+
+const isExternalUrl = (href?: string) =>
+  href ? href.startsWith('http')
+    || href.startsWith('//')
+    || href.startsWith('mailto:')
+    || href.startsWith('tel:') : false
+
+export const Link = ({
+  to = '',
+  href = to,
+  ...rest
+}: LinkProps) => {
+  const isExternal = isExternalUrl(rest.href = href)
+  const isSRoute = window?.$duto?.sroutes?.has(href)
+
+  if (isExternal) {
+    rest.target = '_blank'
+    rest.rel = 'noopener noreferrer'
+  }
+
+  if (!href || isExternal || isSRoute) {
+    const [pathname] = useLocation()
+    const baseClass = typeof rest.class === 'string' || !rest?.class
+      ? (rest.class || '') as string
+      : ''
+    rest.class = baseClass + (pathname === href ? ' active' : '')
+
+    !href && (delete rest.href)
+    return <a is='i-l' {...rest} />
+  }
+
+  if (typeof rest.class === 'string' || !rest?.class)
+    rest.className = a => (rest.class || '') + (a ? ' active' : '')
+
+  return <WouterLink is='i-l' {...rest} />
+}