@weaverclub/render 0.0.2 → 0.0.4

package/src/core/css/tailwind.ts

@@ -1,172 +0,0 @@
-import { Array as Arr, Effect, Option } from 'effect'
-
-// Path to the CLI bundled with this package (relative to this file in src/core/css/)
-const BUNDLED_CLI = new URL(
-	'../../../node_modules/@tailwindcss/cli/dist/index.mjs',
-	import.meta.url
-).pathname
-
-// Cache for compiled CSS output - always kept updated
-let cachedCssOutput: string | null = null
-let tailwindWatcher: {
-	proc: ReturnType<typeof Bun.spawn>
-	outputFile: string
-} | null = null
-
-export const compileTailwindCss = Effect.fn(function* (projectRoot: string) {
-	const glob = new Bun.Glob('**/*.css')
-
-	const files = Arr.fromIterable(
-		glob.scanSync({ absolute: true, cwd: projectRoot })
-	)
-
-	const entrypoint = Arr.head(files)
-
-	if (Option.isNone(entrypoint))
-		return yield* Effect.fail(new Error('No CSS files found for Tailwind CSS.'))
-
-	// Use bundled @tailwindcss/cli - runs via bun for speed
-	const proc = Bun.spawn(
-		['bun', BUNDLED_CLI, '-i', entrypoint.value, '--minify'],
-		{
-			cwd: projectRoot,
-			stdout: 'pipe',
-			stderr: 'pipe'
-		}
-	)
-
-	const [stdout, stderr] = yield* Effect.all(
-		[
-			Effect.tryPromise(() => new Response(proc.stdout).text()),
-			Effect.tryPromise(() => new Response(proc.stderr).text())
-		],
-		{
-			concurrency: 'unbounded'
-		}
-	)
-	const exitCode = yield* Effect.tryPromise(() => proc.exited)
-
-	if (exitCode !== 0)
-		return yield* Effect.fail(
-			new Error(`Tailwind CSS compilation failed: ${stderr}`)
-		)
-
-	cachedCssOutput = stdout
-
-	return {
-		paths: files,
-		compiledOutput: stdout
-	}
-})
-
-// Start Tailwind in watch mode for faster incremental builds
-export const startTailwindWatchMode = Effect.fn(function* (
-	projectRoot: string
-) {
-	const glob = new Bun.Glob('**/*.css')
-	const files = Arr.fromIterable(
-		glob.scanSync({ absolute: true, cwd: projectRoot })
-	)
-	const entrypoint = Arr.head(files)
-
-	if (Option.isNone(entrypoint))
-		return yield* Effect.fail(new Error('No CSS files found for Tailwind CSS.'))
-
-	// Create a temp output file
-	const outputFile = `${projectRoot}/node_modules/.cache/render/tailwind.css`
-
-	// Ensure the cache directory exists
-	yield* Effect.tryPromise(async () => {
-		await Bun.write(outputFile, '')
-	})
-
-	// Start Tailwind in watch mode - use 'inherit' for stderr to see errors
-	const proc = Bun.spawn(
-		[
-			'bunx',
-			'@tailwindcss/cli',
-			'-i',
-			entrypoint.value,
-			'-o',
-			outputFile,
-			'--minify',
-			'--watch'
-		],
-		{
-			cwd: projectRoot,
-			stdout: 'ignore',
-			stderr: 'inherit'
-		}
-	)
-
-	tailwindWatcher = { proc, outputFile }
-
-	// Wait for initial compilation and poll for file to have content
-	let attempts = 0
-	while (attempts < 20) {
-		yield* Effect.sleep('100 millis')
-		const file = Bun.file(outputFile)
-		const size = file.size
-		if (size > 0) {
-			const content = yield* Effect.tryPromise(() => file.text())
-			if (content.length > 0) {
-				cachedCssOutput = content
-				console.log(
-					`   [Tailwind] Initial compilation: ${content.length} bytes`
-				)
-				break
-			}
-		}
-		attempts++
-	}
-
-	return { outputFile }
-})
-
-// Read the latest CSS from the watch mode output with retry
-export const getWatchedCss = Effect.fn(function* () {
-	if (!tailwindWatcher) {
-		console.log(
-			'   [CSS Debug] No tailwind watcher, using cached:',
-			(cachedCssOutput ?? '').length,
-			'bytes'
-		)
-		return cachedCssOutput ?? ''
-	}
-
-	// Try to read with retries (Tailwind might be mid-write)
-	let attempts = 0
-	while (attempts < 10) {
-		const css = yield* Effect.tryPromise(async () => {
-			if (!tailwindWatcher) return ''
-			const file = Bun.file(tailwindWatcher.outputFile)
-			return file.text()
-		})
-
-		if (css.length > 0) {
-			cachedCssOutput = css // Update cache
-			console.log('   [CSS Debug] Read from watcher:', css.length, 'bytes')
-			return css
-		}
-
-		// File is empty, Tailwind might be recompiling - wait and retry
-		yield* Effect.sleep('50 millis')
-		attempts++
-	}
-
-	// Fall back to cached if file is still empty
-	console.log(
-		'   [CSS Debug] File empty, using cached:',
-		(cachedCssOutput ?? '').length,
-		'bytes'
-	)
-	return cachedCssOutput ?? ''
-})
-
-// Stop the Tailwind watcher
-export const stopTailwindWatcher = () => {
-	if (tailwindWatcher) {
-		tailwindWatcher.proc.kill()
-		tailwindWatcher = null
-	}
-}

package/src/core/html.ts

@@ -1,63 +0,0 @@
-import { Effect } from 'effect'
-import type { CSS } from './css/css'
-
-export const mountHTML = ({ element, css, bundledScript }: MountHTMLArgs) =>
-	Effect.sync(
-		() =>
-			`<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Component Preview</title>
-${css.map((style) => `<style>${style.compiledOutput}</style>`).join('\n')}
-<style>
-body { margin: 0; padding: 1rem; }
-</style>
-</head>
-<body>
-<div id="root">${element}</div>
-${bundledScript ? `<script type="module">${bundledScript.replace(/<\/script>/gi, '<\\/script>')}</script>` : ''}
-<script>
-// HMR client for iframe
-(function() {
-  let ws;
-  let reconnectAttempts = 0;
-
-  function connect() {
-    ws = new WebSocket('ws://' + location.host + '/__hmr');
-
-    ws.onopen = function() {
-      reconnectAttempts = 0;
-    };
-
-    ws.onmessage = function(event) {
-      const data = JSON.parse(event.data);
-      if (data.type === 'reload') {
-        location.reload();
-      }
-    };
-
-    ws.onclose = function() {
-      if (reconnectAttempts < 10) {
-        reconnectAttempts++;
-        setTimeout(connect, 1000 * Math.min(reconnectAttempts, 5));
-      }
-    };
-
-    ws.onerror = function() { ws.close(); };
-  }
-
-  connect();
-})();
-</script>
-</body>
-</html>
-`
-	)
-
-type MountHTMLArgs = {
-	element: string
-	css: CSS[]
-	bundledScript?: string
-}

package/src/core/pkg.ts

@@ -1,92 +0,0 @@
-import { FileSystem, Path } from '@effect/platform'
-import { Effect, Option, Schema } from 'effect'
-
-const packageJsonSchema = Schema.Struct({
-	dependencies: Schema.Record({
-		key: Schema.String,
-		value: Schema.String
-	}).pipe(Schema.optional),
-	devDependencies: Schema.Record({
-		key: Schema.String,
-		value: Schema.String
-	}).pipe(Schema.optional),
-	peerDependencies: Schema.Record({
-		key: Schema.String,
-		value: Schema.String
-	}).pipe(Schema.optional)
-})
-
-export const findNearestPackageJson = Effect.fn(function* (startPath: string) {
-	let aux: string | null = null
-	const path = yield* Path.Path
-	const fs = yield* FileSystem.FileSystem
-
-	while (startPath) {
-		const candidatePath = path.join(startPath, 'package.json')
-
-		const exists = yield* fs.exists(candidatePath)
-
-		if (exists) {
-			const content = yield* fs.readFileString(candidatePath)
-
-			const contentAsJSON = yield* Effect.try(() => JSON.parse(content))
-
-			const parsed =
-				yield* Schema.decodeUnknown(packageJsonSchema)(contentAsJSON)
-
-			return Option.some(parsed)
-		}
-
-		const parentDir = path.dirname(startPath)
-
-		startPath = parentDir
-
-		if (parentDir === aux) break
-
-		aux = startPath
-	}
-
-	return Option.none()
-})
-
-export const findNearestNodeModules = Effect.fn(function* (startPath: string) {
-	let aux: string | null = null
-	const path = yield* Path.Path
-	const fs = yield* FileSystem.FileSystem
-
-	while (startPath) {
-		const candidatePath = path.join(startPath, 'node_modules')
-
-		const exists = yield* fs.exists(candidatePath)
-
-		if (exists) {
-			return Option.some(candidatePath)
-		}
-
-		const parentDir = path.dirname(startPath)
-
-		startPath = parentDir
-
-		if (parentDir === aux) break
-
-		aux = startPath
-	}
-
-	return Option.none()
-})
-
-export const getProjectDependencies = Effect.fn(function* (
-	projectRoot: string
-) {
-	const pkg = yield* findNearestPackageJson(projectRoot)
-
-	if (Option.isNone(pkg)) return []
-
-	const deps = [
-		...Object.keys(pkg.value.dependencies || {}),
-		...Object.keys(pkg.value.devDependencies || {}),
-		...Object.keys(pkg.value.peerDependencies || {})
-	]
-
-	return deps
-})

package/src/core/story.ts

@@ -1,52 +0,0 @@
-import { Array as Arr, Effect } from 'effect'
-import type { ReactStory } from '#react/reactStory'
-import { importStoryWithBundler } from './bundler'
-
-export const loadStories = Effect.fn(function* (absolutePath: string) {
-	const glob = new Bun.Glob('**/*.stories.{ts,tsx,js,jsx,mts,cts}')
-
-	const files = Arr.fromIterable(
-		glob.scanSync({ absolute: true, cwd: absolutePath })
-	)
-
-	const tasks = Arr.map(files, (file) =>
-		importStoryWithBundler({
-			storyPath: file,
-			projectRoot: absolutePath
-		}).pipe(
-			Effect.scoped,
-			Effect.map((mod) => ({ mod, sourcePath: file }))
-		)
-	)
-
-	const results = yield* Effect.all(tasks, { concurrency: 'unbounded' })
-
-	const stories = Arr.flatMap(results, ({ mod, sourcePath }) =>
-		Object.values(mod).map((story) => {
-			if (
-				story !== null &&
-				typeof story === 'object' &&
-				'~type' in story &&
-				story['~type'] === 'ReactStory'
-			) {
-				// Attach the source path for browser bundling
-				;(story as ReactStory<React.ComponentType>).sourcePath = sourcePath
-			}
-			return story
-		})
-	)
-
-	return stories.filter(
-		// biome-ignore lint/suspicious/noExplicitAny: Required for story filtering
-		(story): story is ReactStory<any> =>
-			story !== null &&
-			typeof story === 'object' &&
-			'~type' in story &&
-			story['~type'] === 'ReactStory'
-	)
-})
-
-export interface Story {
-	// biome-ignore lint/suspicious/noExplicitAny: Required for generic story execution
-	render: (...args: any[]) => unknown
-}

package/src/core/tsconfig.ts

@@ -1,46 +0,0 @@
-import { FileSystem, Path } from '@effect/platform'
-import { Effect, Option, Schema } from 'effect'
-
-const tsconfigSchema = Schema.Struct({
-	compilerOptions: Schema.Struct({
-		baseUrl: Schema.String.pipe(Schema.optional),
-		paths: Schema.Record({
-			key: Schema.String,
-			value: Schema.Array(Schema.String)
-		}).pipe(Schema.optional)
-	})
-})
-
-const candidates = ['tsconfig.app.json', 'tsconfig.base.json', 'tsconfig.json']
-
-export const findNearestTsconfig = Effect.fn(function* (startPath: string) {
-	let aux: string | null = null
-	const path = yield* Path.Path
-	const fs = yield* FileSystem.FileSystem
-
-	while (startPath) {
-		for (const candidate of candidates) {
-			const tsconfigPath = path.join(startPath, candidate)
-
-			const exists = yield* fs.exists(tsconfigPath)
-
-			if (exists) {
-				const content = yield* Effect.tryPromise(() => import(tsconfigPath))
-
-				const parsed = yield* Schema.decodeUnknown(tsconfigSchema)(content)
-
-				if (parsed.compilerOptions?.paths) return Option.some(tsconfigPath)
-			}
-		}
-
-		const parentDir = path.dirname(startPath)
-
-		startPath = parentDir
-
-		if (parentDir === aux) break
-
-		aux = startPath
-	}
-
-	return Option.none()
-})

package/src/react/react.ts

@@ -1,2 +0,0 @@
-export { controls } from './reactControlBuilder'
-export { story } from './reactStory'

package/src/react/reactControlBuilder.ts

@@ -1,130 +0,0 @@
-import type { ComponentType } from 'react'
-import { ArrayControl } from '#core/control/arrayControl'
-import { BooleanControl } from '#core/control/booleanControl'
-import type { Control } from '#core/control/control'
-import type {
-	ArrayPropNames,
-	BooleanPropNames,
-	ControlBuilder,
-	ExtractStringLiteralUnion,
-	NumberPropNames,
-	StringPropNames,
-	VariantPropNames
-} from '#core/control/controlBuilder'
-import { NumberControl } from '#core/control/numberControl'
-import { StringControl } from '#core/control/stringControl'
-import { VariantControl } from '#core/control/variantControl'
-import type { ReactStory } from './reactStory'
-
-export function controls<
-	// biome-ignore lint/suspicious/noExplicitAny: Required for React component prop inference
-	Component extends React.ComponentType<any>
->(): ReactControlBuilder<React.ComponentProps<Component>, never> {
-	return new ReactControlBuilder<React.ComponentProps<Component>, never>()
-}
-
-const CONTROLS_SYMBOL = Symbol.for('@renderweaver/controls')
-
-export class ReactControlBuilder<Props, Used extends keyof Props>
-	implements ControlBuilder<Props, Used>
-{
-	private controls: Control[] = []
-
-	public [CONTROLS_SYMBOL](): Control[] {
-		return this.controls
-	}
-
-	public array<
-		Name extends Exclude<ArrayPropNames<Props>, Used> & string,
-		Type = Props[Name] extends Array<infer U> ? U : never
-	>(
-		name: Name,
-		options: {
-			defaultValue: Props[Name]
-		}
-	): ControlBuilder<Props, Used | Name> {
-		this.controls.push(
-			new ArrayControl<Type>({
-				name,
-				defaultValue: options.defaultValue as Type[]
-			})
-		)
-
-		return this as unknown as ControlBuilder<Props, Used | Name>
-	}
-
-	public bool<Name extends Exclude<BooleanPropNames<Props>, Used> & string>(
-		name: Name,
-		options: {
-			defaultValue: boolean
-		}
-	): ControlBuilder<Props, Used | Name> {
-		this.controls.push(
-			new BooleanControl({
-				name,
-				defaultValue: options.defaultValue
-			})
-		)
-
-		return this as unknown as ControlBuilder<Props, Used | Name>
-	}
-
-	public number<Name extends Exclude<NumberPropNames<Props>, Used> & string>(
-		name: Name,
-		options: {
-			defaultValue: number
-		}
-	): ControlBuilder<Props, Used | Name> {
-		this.controls.push(
-			new NumberControl({
-				name,
-				defaultValue: options.defaultValue
-			})
-		)
-
-		return this as unknown as ControlBuilder<Props, Used | Name>
-	}
-
-	public string<Name extends Exclude<StringPropNames<Props>, Used> & string>(
-		name: Name,
-		options: { defaultValue: string }
-	): ControlBuilder<Props, Used | Name> {
-		this.controls.push(
-			new StringControl({
-				name,
-				defaultValue: options.defaultValue
-			})
-		)
-
-		return this as unknown as ControlBuilder<Props, Used | Name>
-	}
-
-	public variant<Name extends Exclude<VariantPropNames<Props>, Used> & string>(
-		name: Name,
-		options: {
-			defaultValue: ExtractStringLiteralUnion<Props[Name]>
-			options: ExtractStringLiteralUnion<Props[Name]>[]
-		}
-	): ControlBuilder<Props, Used | Name> {
-		this.controls.push(
-			new VariantControl({
-				name: name,
-				options: options.options as string[],
-				defaultValue: options.defaultValue as string
-			})
-		)
-
-		return this as unknown as ControlBuilder<Props, Used | Name>
-	}
-}
-
-export function getDefaultPropsForReactComponent<
-	// biome-ignore lint/suspicious/noExplicitAny: Required for React component prop inference
-	Component extends ComponentType<any>
->(story: ReactStory<Component>): React.ComponentProps<Component> {
-	if (!story.controls) {
-		return {} as React.ComponentProps<Component>
-	}
-
-	return {} as React.ComponentProps<Component>
-}

package/src/react/reactStory.ts

@@ -1,36 +0,0 @@
-// biome-ignore-all lint/suspicious/noExplicitAny: Required for React component prop inference
-import type { UnfinishedControls } from '#core/control/controlBuilder'
-import type { Story } from '#core/story'
-
-export function story<Component extends React.ComponentType<any>>(
-	args: StoryArgs<Component>
-) {
-	return new ReactStory(args)
-}
-
-export class ReactStory<Component extends React.ComponentType<any>>
-	implements Story
-{
-	public name: string
-	public id: string
-	public component: React.ComponentType<any> | undefined
-	public render: (props: React.ComponentProps<Component>) => React.ReactElement
-	public controls: UnfinishedControls | undefined
-	public '~type' = 'ReactStory'
-	public sourcePath?: string // Path to the story source file for browser bundling
-
-	public constructor(args: StoryArgs<Component>) {
-		this.name = args.name
-		this.component = args.component
-		this.render = args.render
-		this.controls = args.controls
-		this.id = this.name.replace(/\s+/g, '-').toLowerCase()
-	}
-}
-
-type StoryArgs<Component extends React.ComponentType<any>> = {
-	name: string
-	render: (props: React.ComponentProps<Component>) => React.ReactElement
-	component?: Component
-	controls?: UnfinishedControls
-}

package/src/server/api/getStories.ts

@@ -1,44 +0,0 @@
-import { Effect } from 'effect'
-import type { ReactStory } from '#react/reactStory'
-
-export const getStories = ({ stories }: GetStoriesArgs) =>
-	Effect.sync(() => {
-		const categorizedStories: Record<string, SimpleStory[]> = {}
-
-		for (const story of stories) {
-			const [category, storyName] = story.name.split('/')
-
-			if (!category || !storyName) continue
-
-			if (!categorizedStories[category]) {
-				categorizedStories[category] = []
-			}
-
-			categorizedStories[category].push({
-				name: storyName,
-				path: story.id
-			})
-		}
-
-		const sortedCategories = Object.keys(categorizedStories).sort()
-
-		for (const category of sortedCategories) {
-			categorizedStories[category]?.sort((a, b) => a.name.localeCompare(b.name))
-		}
-
-		return new Response(JSON.stringify(categorizedStories), {
-			status: 200,
-			headers: { 'Content-Type': 'application/json' }
-		})
-	})
-
-type SimpleStory = {
-	name: string
-	path: string
-}
-
-type GetStoriesArgs = {
-	request: Request
-	// biome-ignore lint/suspicious/noExplicitAny: Required for ReactStory type
-	stories: ReactStory<any>[]
-}

package/src/server/api/renderIframe.ts

@@ -1,66 +0,0 @@
-import type { BunRequest } from 'bun'
-import { Effect } from 'effect'
-import { renderToReadableStream } from 'react-dom/server'
-import { bundleStoryForBrowser } from '#core/bundler'
-import type { CSS } from '#core/css/css'
-import { mountHTML } from '#core/html'
-import { getDefaultPropsForReactComponent } from '#react/reactControlBuilder'
-import type { ReactStory } from '#react/reactStory'
-import { streamToString } from '#server/streaming'
-
-export const renderIframe = Effect.fn(function* ({
-	request,
-	css,
-	stories,
-	projectRoot
-}: RenderIframeArgs) {
-	const storyId = request.url.split('/iframe/')[1]?.split('?')[0] // Strip query params
-	const story = stories.find((s) => s.id === storyId)
-
-	if (!story) return new Response('Story not found', { status: 404 })
-
-	const defaultProps = getDefaultPropsForReactComponent(story)
-
-	const element = story.render(defaultProps)
-
-	const stream = yield* Effect.tryPromise(() => renderToReadableStream(element))
-
-	const html = yield* streamToString(stream)
-
-	// Bundle the story for browser hydration
-	let bundledScript: string | undefined
-	if (story.sourcePath) {
-		const bundleResult = yield* bundleStoryForBrowser({
-			storyPath: story.sourcePath,
-			projectRoot,
-			storyId: story.id
-		}).pipe(Effect.option)
-
-		if (bundleResult._tag === 'Some') {
-			bundledScript = bundleResult.value
-		}
-	}
-
-	const mountedHTML = yield* mountHTML({
-		css,
-		element: html,
-		bundledScript
-	})
-
-	return new Response(mountedHTML, {
-		headers: {
-			'Content-Type': 'text/html',
-			'Cache-Control': 'no-cache, no-store, must-revalidate',
-			Pragma: 'no-cache',
-			Expires: '0'
-		}
-	})
-})
-
-type RenderIframeArgs = {
-	request: BunRequest<'iframe/*'>
-	// biome-ignore lint/suspicious/noExplicitAny: Required for ReactStory type
-	stories: ReactStory<any>[]
-	css: CSS[]
-	projectRoot: string
-}