Story: implement form

Author: fuma-nama

packages/story/css/styles.css

@@ -0,0 +1,5 @@
+@import 'tailwindcss';
+@import 'fumadocs-ui/css/neutral.css';
+@import 'fumadocs-ui/css/preset.css';
+
+/* do not modify this, just to trigger intelli-sense of Tailwind CSS plugin */

packages/story/package.json

@@ -25,10 +25,20 @@
     "lint": "eslint .",
     "types:check": "tsc --noEmit"
   },
+  "dependencies": {
+    "@fumari/stf": "workspace:^",
+    "@radix-ui/react-select": "^2.2.6",
+    "class-variance-authority": "^0.7.1",
+    "lucide-react": "^0.562.0",
+    "tailwind-merge": "^3.4.0",
+    "ts-morph": "^27.0.2"
+  },
   "devDependencies": {
     "@types/node": "25.0.5",
     "@types/react": "^19.2.8",
     "eslint-config-custom": "workspace:*",
+    "fumadocs-ui": "^16.4.7",
+    "tailwindcss": "^4.1.18",
     "tsconfig": "workspace:*",
     "tsdown": "^0.19.0"
   },

packages/story/src/get-default-values.ts

@@ -0,0 +1,49 @@
+import type { TypeNode } from './lib/types';
+
+export function getDefaultValue(node: TypeNode): unknown {
+  switch (node.type) {
+    case 'object':
+      return Object.fromEntries(
+        node.properties.map((prop) => [prop.name, getDefaultValue(prop.type)]),
+      );
+    case 'array':
+      return [];
+    case 'null':
+      return null;
+    case 'undefined':
+      return undefined;
+    case 'string':
+      return '';
+    case 'number':
+      return 0;
+    case 'boolean':
+      return false;
+    case 'enum':
+      // Return first enum value as default
+      return node.members[0]?.value ?? '';
+    case 'literal':
+      return node.value;
+    case 'union':
+      // Return default value of first union type
+      return node.types.length > 0 ? getDefaultValue(node.types[0]!) : undefined;
+    case 'intersection': {
+      // For intersection, merge object properties if all are objects
+      const objects = node.types.filter((t) => t.type === 'object') as Array<
+        Extract<TypeNode, { type: 'object' }>
+      >;
+      if (objects.length > 0) {
+        const merged: Record<string, unknown> = {};
+        for (const obj of objects) {
+          for (const prop of obj.properties) {
+            merged[prop.name] = getDefaultValue(prop.type);
+          }
+        }
+        return merged;
+      }
+      // Otherwise return default of first type
+      return node.types.length > 0 ? getDefaultValue(node.types[0]!) : undefined;
+    }
+    case 'unknown':
+      return undefined;
+  }
+}

packages/story/src/index.tsx

@@ -1,8 +1,106 @@
+import { Project, type Type } from 'ts-morph';
+import * as path from 'node:path';
+import * as fs from 'node:fs/promises';
+import { createHash } from 'node:crypto';
+import { typeToNode } from './lib/type-tree';
+import type { Cache } from './lib/cache';
+import type { TypeNode } from './lib/types';
+
 export interface StoryOptions {
   from: {
     file: string;
     export: string;
   };
+  tsconfigPath?: string;
+  cache?: Cache | false;
 }
 
-export function defineStory(options: StoryOptions) {}
+export * from './lib/types';
+export * from './lib/cache';
+
+export interface StoryResult {
+  props: TypeNode;
+}
+
+export async function defineStory(options: StoryOptions): Promise<StoryResult> {
+  const filePath = path.resolve(options.from.file);
+  const fileContent = await fs.readFile(filePath, 'utf-8');
+
+  // Generate cache key based on file path, export name, and content hash
+  const contentHash = createHash('MD5').update(fileContent).digest('hex').slice(0, 12);
+  const cacheKey = `${filePath}:${options.from.export}:${contentHash}`;
+
+  // Try to read from cache
+  if (options.cache !== false) {
+    const cached = await options.cache?.read(cacheKey);
+    if (cached) {
+      return cached as StoryResult;
+    }
+  }
+
+  const project = new Project({
+    tsConfigFilePath: options.tsconfigPath ?? './tsconfig.json',
+    skipAddingFilesFromTsConfig: true,
+  });
+
+  const sourceFile = project.addSourceFileAtPath(filePath);
+
+  const exportedDeclarations = sourceFile.getExportedDeclarations();
+  const declaration = exportedDeclarations.get(options.from.export)?.[0];
+
+  if (!declaration) {
+    throw new Error(`Export "${options.from.export}" not found in file "${options.from.file}"`);
+  }
+
+  const type = declaration.getType();
+  const checker = project.getTypeChecker();
+
+  // Extract props type from React component
+  let propsType: Type | undefined;
+
+  // Check if it's a function component
+  const callSignatures = type.getCallSignatures();
+  if (callSignatures.length > 0) {
+    // Function component: props are the first parameter
+    const firstParam = callSignatures[0]?.getParameters()[0];
+    if (firstParam) {
+      propsType = firstParam.getTypeAtLocation(declaration);
+    }
+  } else if (type.isClassOrInterface()) {
+    // Class component: look for props property or constructor parameter
+    const propsProperty = type.getProperty('props');
+    if (propsProperty) {
+      propsType = propsProperty.getTypeAtLocation(declaration);
+    } else {
+      // Try to get from constructor
+      const constructSignatures = type.getConstructSignatures();
+      if (constructSignatures.length > 0) {
+        const firstParam = constructSignatures[0]?.getParameters()[0];
+        if (firstParam) {
+          propsType = firstParam.getTypeAtLocation(declaration);
+        }
+      }
+    }
+  } else if (type.isObject()) {
+    // Already an object type, use it directly
+    propsType = type;
+  }
+
+  if (!propsType) {
+    // Fallback: use the type itself
+    propsType = type;
+  }
+
+  const propsNode = typeToNode(propsType, checker, declaration);
+
+  const result: StoryResult = {
+    props: propsNode,
+  };
+
+  // Write to cache
+  if (options.cache !== false) {
+    await options.cache?.write(cacheKey, result);
+  }
+
+  return result;
+}

packages/story/src/lib/cache.ts

@@ -0,0 +1,29 @@
+import fs from 'node:fs/promises';
+import * as path from 'node:path';
+
+export interface Cache {
+  read: (key: string) => unknown | undefined | Promise<unknown | undefined>;
+  write: (key: string, value: unknown) => void | Promise<void>;
+}
+
+export function createFileSystemCache(dir: string): Cache {
+  // call `path.resolve` so Vercel NFT will include the cache directory in production.
+  dir = path.resolve(dir);
+  const initDirPromise = fs.mkdir(dir, { recursive: true }).catch(() => {
+    // it fails on Vercel as of 2025 12 May, we can skip it
+  });
+
+  return {
+    async write(key, data) {
+      await initDirPromise;
+      await fs.writeFile(path.join(dir, `${key}.json`), JSON.stringify(data));
+    },
+    async read(key) {
+      try {
+        return JSON.parse((await fs.readFile(path.join(dir, `${key}.json`))).toString());
+      } catch {
+        return;
+      }
+    },
+  };
+}