-
Notifications
You must be signed in to change notification settings - Fork 3
feat: Enhance multi-platform bundling with theme support and metadata #157
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
✅ Snyk checks have passed. No issues have been found so far.
💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse. |
WalkthroughAdds multi‑platform static HTML bundling with per‑platform emission, build modes (static/dynamic/hybrid) and placeholder/data‑injection flows, theme/CDN and Tailwind style integration, in‑browser transpilation of UI components, safer runtime minification and store APIs, extensive tests/docs, many Changes
Sequence Diagram(s)%%{init: {"theme":"default","themeVariables":{"actorBackground":"#ffffff","actorBorder":"#0b74de","noteBackground":"#f3f4f6","noteBorder":"#e5e7eb"}}}%%
sequenceDiagram
participant Dev as Caller
participant Bundler as InMemoryBundler
participant Transpile as SharedTranspile
participant Platform as PlatformBuilder
participant Helpers as Theme/PlaceholderHelpers
participant Result as MultiPlatformBuildResult
Dev->>Bundler: bundleToStaticHTMLAll(options)
Bundler->>Transpile: transpile components once
Transpile-->>Bundler: sharedComponentCode, metrics
Bundler->>Platform: buildForPlatform(platform, sharedComponentCode, opts)
Note right of Platform: determine CDN type, theme, buildMode\ninject placeholders or subscription scripts
Platform->>Helpers: request placeholders / theme CSS / data scripts
Helpers-->>Platform: returned scripts/placeholders
Platform-->>Bundler: PlatformBuildResult(html, meta)
Bundler->>Result: assemble MultiPlatformBuildResult
Result-->>Dev: return aggregated result
Estimated code review effort🎯 5 (Critical) | ⏱️ ~120 minutes Possibly related PRs
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
libs/ui/src/universal/runtime-builder.ts (1)
489-495: Consider extracting shared minification utility.The minification logic is duplicated in three places:
cached-runtime.ts→minifyScript()runtime-builder.ts→buildUniversalRuntime()(inline)runtime-builder.ts→buildMinimalRuntime()(inline)While the current approach works, extracting this to a shared utility would improve maintainability and ensure consistent behavior.
🔎 Suggested refactor to extract shared minification
Create a shared utility in a common location:
// In a shared utilities file (e.g., utils/minify.ts) export function minifyScript(script: string): string { return script .replace(/\/\*[\s\S]*?\*\//g, '') // Remove block comments .replace(/^\s*\/\/[^\n]*$/gm, '') // Remove full-line comments only .replace(/\n\s*\n/g, '\n') // Collapse multiple newlines .replace(/^\s+/gm, '') // Remove leading whitespace .trim(); }Then import and use in all three locations.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (19)
libs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/sdk/src/common/types/options/transport.options.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/types.tslibs/ui/src/universal/__tests__/cached-runtime.test.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/universal/runtime-builder.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/adapters/platform-meta.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/schemas.tslibs/uipack/src/typings/type-fetcher.tslibs/uipack/src/typings/types.ts
🧰 Additional context used
📓 Path-based instructions (13)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/typings/schemas.tslibs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/universal/runtime-builder.tslibs/ui/src/bundler/index.tslibs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/type-fetcher.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/types.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/sdk/src/common/types/options/transport.options.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/types.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/type-fetcher.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/adapters/platform-meta.tslibs/uipack/src/typings/types.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/typings/schemas.tslibs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/universal/runtime-builder.tslibs/ui/src/bundler/index.tslibs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/type-fetcher.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/types.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/sdk/src/common/types/options/transport.options.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/types.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/ui/src/universal/runtime-builder.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/types.tslibs/ui/src/bundler/bundler.ts
libs/ui/src/**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
libs/ui/src/**/*.test.{ts,tsx}: Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Include SSR tests to verify server-side rendering output for React components
Files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/ui/src/bundler/__tests__/bundler.test.ts
libs/ui/src/universal/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/ui/src/universal/runtime-builder.tslibs/ui/src/universal/cached-runtime.ts
libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/adapters/platform-meta.ts
libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/uipack/src/adapters/index.tslibs/uipack/src/adapters/platform-meta.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/uipack/src/{adapters,components,web-components}/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Test component behavior across platform configurations (OpenAI, Claude, etc.)
Files:
libs/uipack/src/adapters/__tests__/platform-meta.test.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/ui/src/bundler/bundler.ts
libs/sdk/src/**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
libs/sdk/src/**/*.ts: MCP response types should use strict MCP protocol types (GetPromptResult, ReadResourceResult) instead ofunknown
Use specific error classes with MCP error codes instead of generic errors
UsegetCapabilities()method for dynamic capability exposure instead of hardcoding capabilities
UsechangeScopeproperty instead ofscopein change events to avoid confusion with Scope class
Validate URIs per RFC 3986 at metadata level using proper validation
Validate hook flows and fail fast on invalid hook configurations with specific error messages
Files:
libs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/sdk/src/common/types/options/transport.options.ts
🧠 Learnings (31)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.schema.ts : Support HTMX attributes in component schemas (get, post, target, swap) with `.strict()` validation
Applied to files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.ts : Validate all component options using validateOptions() helper with the component's Zod schema
Applied to files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/type-fetcher.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/typings/schemas.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/index.tslibs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/uipack/src/adapters/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Include SSR tests to verify server-side rendering output for React components
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/adapters/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Validate URIs per RFC 3986 at metadata level using proper validation
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/ui/src/universal/__tests__/cached-runtime.test.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/adapters/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.test.ts : Test invalid inputs for every component to validate error handling
Applied to files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/__tests__/bundler.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/uipack/src/adapters/__tests__/platform-meta.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/adapters/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/types.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/uipack/src/adapters/platform-meta.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/ui/src/bundler/index.tslibs/uipack/src/adapters/index.tslibs/uipack/src/typings/index.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/index.tslibs/uipack/src/adapters/index.tslibs/ui/src/bundler/types.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/index.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
libs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/uipack/src/adapters/index.tslibs/sdk/src/common/metadata/front-mcp.metadata.tslibs/uipack/src/adapters/platform-meta.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/adapters/index.tslibs/uipack/src/typings/index.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/adapters/platform-meta.tslibs/uipack/src/typings/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/uipack/src/adapters/index.tslibs/ui/src/bundler/types.tslibs/uipack/src/adapters/platform-meta.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/common/records/**/*.ts : Centralize record types in common/records directory and import from there instead of module-specific files
Applied to files:
libs/uipack/src/typings/index.tslibs/uipack/src/typings/type-fetcher.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Use React 18/19 with TypeScript for all components in frontmcp/ui
Applied to files:
libs/ui/src/bundler/types.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : MCP response types should use strict MCP protocol types (GetPromptResult, ReadResourceResult) instead of `unknown`
Applied to files:
libs/sdk/src/common/metadata/front-mcp.metadata.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Include error class `instanceof` checks in tests to validate error handling
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Zero React dependency constraint - this is the React-free core package
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/types.ts
🧬 Code graph analysis (7)
libs/uipack/src/typings/schemas.ts (1)
libs/uipack/src/typings/index.ts (3)
typeFileSchema(72-72)TypeFileInput(94-94)TypeFileOutput(95-95)
libs/ui/src/universal/__tests__/cached-runtime.test.ts (1)
libs/ui/src/universal/cached-runtime.ts (1)
getCachedRuntime(673-746)
libs/uipack/src/adapters/__tests__/platform-meta.test.ts (2)
libs/uipack/src/adapters/index.ts (1)
buildUIMeta(19-19)libs/uipack/src/adapters/platform-meta.ts (1)
buildUIMeta(189-251)
libs/uipack/src/typings/type-fetcher.ts (1)
libs/uipack/src/typings/types.ts (2)
TypeFetchResult(60-120)TypeFile(27-43)
libs/sdk/src/common/metadata/front-mcp.metadata.ts (1)
libs/sdk/src/common/interfaces/internal/primary-auth-provider.interface.ts (1)
transport(84-86)
libs/uipack/src/typings/__tests__/schemas.test.ts (1)
libs/uipack/src/typings/schemas.ts (1)
typeFileSchema(38-44)
libs/uipack/src/typings/types.ts (1)
libs/uipack/src/typings/index.ts (1)
TypeFile(48-48)
🪛 ast-grep (0.40.3)
libs/uipack/src/typings/type-fetcher.ts
[warning] 609-609: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(/${escapeRegExp(packageName)}@[^/]+(/.*)?$)
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (44)
libs/sdk/src/common/types/options/transport.options.ts (1)
23-55: LGTM! Well-documented transport persistence configuration.The documentation clearly explains the auto-enable behavior and auto-population semantics. The
defaultTtlMsfield is properly constrained with.int().positive().default(3600000).libs/sdk/src/common/metadata/front-mcp.metadata.ts (3)
119-132: LGTM! Type guard correctly validates persistence shape.The type guard handles
undefined,null, and validates property types when present. Using bracket notation for index access is appropriate.
144-200: LGTM! Transform logic correctly implements auto-population behavior.The transform handles all documented cases:
- Explicit
enabled: false- respected- Explicit
redisconfig - used as-isenabled: truewithout redis - global redis populated- Persistence undefined - auto-enabled with global redis
Note: When persistence is partially configured (e.g., only
defaultTtlMs), the schema'senabled: falsedefault prevents auto-enable. This is consistent with the documented behavior that auto-enable only occurs when persistence is "not configured".
202-204: LGTM! Schema composition uses correct Zod 4 pattern.The
.or()union followed by.transform()properly chains the auto-population logic after schema validation.libs/sdk/src/common/metadata/__tests__/front-mcp.metadata.test.ts (2)
1-9: Good documentation of the circular dependency workaround.The comment at lines 3-5 clearly explains why the transform function is duplicated rather than imported. This is acceptable given the circular dependency constraint.
85-398: Excellent test coverage for transport persistence auto-population.The tests comprehensively cover:
- No global redis scenarios
- Redis provider with various configurations
- Vercel-kv provider
- Legacy redis format
defaultTtlMspreservation- Edge cases (explicit redis, empty persistence object, transport undefined)
- Schema validation errors (invalid host, port, TTL)
- Type guard true/false branches
This meets the 95%+ coverage guideline. As per coding guidelines, all code paths including error cases are tested.
libs/uipack/src/adapters/platform-meta.ts (3)
88-110: LGTM! UIMetadata interface properly extended for Claude and FrontMCP platforms.The new fields follow established naming conventions (
namespace/field) and appropriately differentiate between Claude-specific fields (for Artifacts) and FrontMCP generic platform fields.
306-336: LGTM! Claude metadata builder correctly handles network-blocked constraints.The comment at lines 332-333 correctly explains why CSP is not included for Claude (network-blocked Artifacts). The new fields (
displayMode,widgetAccessible,prefersBorder) are appropriately documented with notes about Claude's Artifact system limitations. Based on learnings, this correctly uses platform-aware handling for network capability detection.
364-422: LGTM! Generic MCP metadata uses consistentfrontmcp/*namespace.The
buildFrontMCPCSPhelper uses camelCase keys per MCP Apps spec, andbuildGenericMetaconsistently maps all UI config fields to thefrontmcp/*namespace. This aligns with the platform-specific namespace strategy defined in thebuildUIMetaswitch statement.libs/uipack/src/adapters/index.ts (1)
21-23: LGTM! Public API correctly extended.The new
buildFrontMCPCSPexport follows the established pattern and is appropriately placed alongside the relatedbuildOpenAICSPfunction.libs/uipack/src/adapters/__tests__/platform-meta.test.ts (2)
321-409: LGTM! Comprehensive tests for generic-mcpfrontmcp/*namespace.The tests correctly verify that:
- All FrontMCP fields use the
frontmcp/*namespace- OpenAI namespace fields are NOT used (important negative assertions)
- All new fields (
widgetCSP,displayMode,widgetDescription,prefersBorder,domain) are properly mappedAs per coding guidelines, this tests component behavior across platform configurations.
411-479: LGTM! Claude platform tests include critical CSP exclusion verification.The test at lines 464-478 correctly verifies that CSP is NOT included for Claude due to network-blocked constraints. This is an important negative test that ensures the platform-aware theming handles Claude's Artifact limitations correctly. Based on learnings, this aligns with using platform-aware theming for network capability detection.
libs/uipack/src/typings/__tests__/schemas.test.ts (2)
48-105: Comprehensive test coverage for typeFileSchema.The test suite covers essential validation scenarios including valid input, empty content, missing/empty path, invalid URL, and strict mode enforcement. This aligns well with the schema definition in
libs/uipack/src/typings/schemas.ts.
117-126: Test fixtures updated correctly for the new files array.The test data properly includes the
filesarray with the correct structure (path,url,content), ensuring schema validation tests cover the extendedTypeFetchResultstructure.libs/uipack/src/typings/types.ts (2)
14-43: Well-designed TypeFile interface with thorough documentation.The
TypeFileinterface is cleanly structured with clear JSDoc documentation explaining the browser editor integration use case. The fields (path,url,content) align with the corresponding Zod schema inschemas.ts.
85-108: Good deprecation strategy for backwards compatibility.The
contentfield is properly marked as deprecated with clear guidance to use thefilesarray instead. The example code demonstrating Monaco editor integration is helpful for consumers migrating to the new API.libs/uipack/src/typings/type-fetcher.ts (4)
259-270: Files array integration looks correct.The
buildTypeFilesfunction is called with the fetchedcontentsMap, and the resultingfilesarray is properly included in theTypeFetchResult. The comment accurately notes thatcombinedContentis kept for backwards compatibility.
552-574: Clean implementation of buildTypeFiles helper.The function correctly iterates over the
contentsMap and constructsTypeFileobjects with virtual paths. The JSDoc documentation clearly explains the purpose and parameters.
626-631: escapeRegExp implementation is correct.This is the standard approach for escaping regex metacharacters. The implementation properly escapes all special characters that could cause issues in regex patterns.
588-624: Review comment is correct—no actionable changes needed.The regex flagged at lines 609-610 is safe despite static analysis warnings. Package names can only contain alphanumeric characters, hyphens, dots, underscores, and scoped packages include @ and /. escapeRegExp escapes regex special characters, preventing any of them from entering the pattern. The pattern
(/.*)?$lacks nested quantifiers or overlapping alternatives—the core structures required for ReDoS exploits. The static analysis tool is conservatively flagging this, but the actual risk fromgetPackageFromSpecifieroutput is indeed minimal.libs/uipack/src/typings/index.ts (2)
47-60: Type exports properly extended.The new
TypeFiletype is correctly exported alongside existing type definitions, maintaining consistent barrel file organization.
68-95: Schema and type exports correctly added.The
typeFileSchemaand its associated input/output types (TypeFileInput,TypeFileOutput) are properly exported, enabling consumers to use both runtime validation and type inference.libs/uipack/src/typings/schemas.ts (2)
30-47: typeFileSchema correctly defined with strict mode.The schema properly enforces:
- Non-empty
pathwithz.string().min(1)- Valid URL format for
urlwithz.string().url()- Allows empty content strings (appropriate for edge cases)
- Uses
.strict()to reject unknown propertiesThis aligns with the coding guidelines for component schemas.
56-66: typeFetchResultSchema correctly extended with files array.The
filesfield is properly added asz.array(typeFileSchema), ensuring that each file in the array is validated against thetypeFileSchema. The strict mode on the parent schema is maintained.libs/uipack/src/typings/__tests__/type-fetcher.test.ts (3)
248-270: Test properly validates files array in cache entries.The test correctly verifies that cached entries include the
filesarray with expected structure. The assertions at lines 268-269 confirm both array length and file path content.
532-558: Cache hit test properly validates files array.The test verifies that when retrieving from cache, the
filesarray is correctly returned. Line 557 confirms the array length, ensuring the cached data structure is preserved.
711-728: Global cache test updated with files array.The test fixture for the global cache shared instance correctly includes the
filesarray with proper structure, maintaining consistency with other test fixtures.libs/ui/src/universal/__tests__/cached-runtime.test.ts (1)
200-209: Good test coverage for URL preservation during minification.This test properly validates that the safer minification approach preserves URL protocol strings that could otherwise be corrupted by naive comment-stripping regex. The assertions for
'http://','https://', and'mailto:'directly correspond to theisSafeUrlfunction in the generated runtime code.libs/ui/src/universal/cached-runtime.ts (1)
764-778: Safer minification approach correctly preserves string literals.The updated regex strategy is sound:
- Block comments (
/\*[\s\S]*?\*/g) are safe to remove unconditionally since/*cannot appear unescaped in JS strings- Full-line comments (
/^\s*\/\/[^\n]*$/gm) only match lines starting with//after optional whitespace, preserving//within strings like'http://'This conservative approach trades some size reduction for correctness, which is the right tradeoff for generated runtime code.
libs/ui/src/bundler/__tests__/bundler.test.ts (3)
388-445: Thorough theme injection tests with proper ordering verification.These tests validate critical behavior:
- Default theme CSS variables are injected
- Custom theme colors are reflected in output
- Correct CSS cascade order (Tailwind → theme → custom CSS)
The ordering test (lines 429-445) is particularly valuable as it ensures theme variables can override Tailwind defaults while custom CSS can override both.
579-695: Comprehensive multi-platform build test suite.The tests thoroughly cover the new
bundleToStaticHTMLAllAPI:
- Default platform set verification (all 5 platforms)
- Selective platform targeting
- Shared transpilation verification (efficiency test)
- Platform-specific metadata namespaces
- CDN type differentiation per platform
- Metrics tracking
697-782: Good coverage for universal mode and theme propagation across platforms.Tests verify:
- Universal mode works with multi-platform builds
- Content type detection and propagation
- Theme CSS variables appear in all platform outputs
- Custom themes are applied to all platforms
libs/ui/src/universal/runtime-builder.ts (1)
457-468: Consistent minification logic with cached-runtime.ts.The minification approach here mirrors the safer strategy in
cached-runtime.ts, ensuring consistency across both runtime generation paths.libs/ui/src/bundler/index.ts (1)
67-74: Clean public API expansion for multi-platform builds.The new exports are well-organized and follow the established pattern:
- Types grouped under "Multi-platform build types" comment
ALL_PLATFORMSconstant grouped under "Multi-platform build constants"Based on coding guidelines, this follows the barrel file pattern correctly.
Also applies to: 86-87
libs/ui/src/bundler/types.ts (4)
9-10: Correct import pattern for React-free utilities.Importing
ThemeConfigfrom@frontmcp/uipack/themefollows the coding guidelines: "Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead."
680-701: Well-defined platform types with readonly constant.The type definitions are solid:
ConcretePlatformexcludes 'auto' for type safety in multi-platform buildsALL_PLATFORMSusesas constfor tuple type inference and immutability- Platform ordering is logical (OpenAI, Claude, Cursor, ext-apps, Generic)
832-852: Comprehensive JSDoc for theme configuration.The documentation clearly explains:
- What theme CSS variables are injected
- Default behavior when theme is not provided
- Includes practical code examples for both default and custom themes
1075-1142: Well-structured multi-platform build types.The type hierarchy is clean:
MultiPlatformBuildOptionsextendsStaticHTMLOptionsbut replacestargetPlatformwithplatformsarrayPlatformBuildResultextendsStaticHTMLResultwith platform-specific metadataMultiPlatformBuildResultprovides clear structure with shared code, metrics, and per-platform resultsThe
meta: Record<string, unknown>type is appropriately flexible for namespace-prefixed metadata fields.libs/ui/src/bundler/bundler.ts (6)
24-29: Correct imports for multi-platform and theme features.Imports from
@frontmcp/uipack/adaptersand@frontmcp/uipack/themefollow the coding guidelines for using React-free utilities from uipack. Based on learnings, this aligns with platform-aware theming patterns.Also applies to: 37-40
481-548: Efficient multi-platform build implementation.The
bundleToStaticHTMLAllmethod correctly:
- Transpiles the component source once (shared across platforms)
- Iterates over platforms to generate platform-specific HTML
- Returns unified metrics separating transpile time from generation time
- Handles universal vs standard modes appropriately
The content type detection logic (lines 495-500) properly handles the 'auto' case using
detectUniversalContentType.
554-673: Well-structured platform-specific build helper.The
buildForPlatformhelper cleanly separates universal vs standard mode HTML assembly. The non-null assertions at lines 628 and 641 are safe because:
- Line 503-515 ensures
transpiledCodeis set whencontentType === 'react' || !isUniversal- The
!isUniversalbranch (lines 618-642) only executes when the condition above was trueThe metadata generation using
buildUIMeta(line 647) correctly maps platforms to their namespace conventions.
675-693: Platform to AI platform type mapping.The mapping handles all
ConcretePlatformvalues:
'generic'maps to'generic-mcp'(external naming convention)- Default case provides safety for future platform additions
1301-1359: Theme CSS injection with correct cascade order.The
buildStaticHTMLHeadmethod correctly orders CSS:
- Tailwind CSS (base styles)
- Theme CSS variables (
:rootblock viabuildThemeStyleBlock)- Base loading/spinner styles
- Custom CSS (user overrides)
This ensures theme variables can reference Tailwind classes while custom CSS can override both. The
DEFAULT_THEMEfallback provides consistent defaults when no theme is specified.
485-486: Verify type safety of options casting.The cast
options as StaticHTMLOptionsat line 485 is safe.MultiPlatformBuildOptionsextendsOmit<StaticHTMLOptions, 'targetPlatform'>, and sincetargetPlatformis optional inStaticHTMLOptions(with default value'auto'), the missing property is handled correctly bymergeStaticHTMLOptions. The cast works as intended but could be made more explicit for clarity—consider extracting and constructing the needed properties directly rather than relying on the type assertion.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
libs/uipack/src/theme/platforms.ts (1)
103-117: Critical inconsistency: scriptStrategy 'cdn' conflicts with networkMode 'blocked'.The Claude platform configuration has
scriptStrategy: 'cdn'butnetworkMode: 'blocked'with CSP"connect-src 'none'". CDN scripts cannot be loaded when network access is blocked. Based on the comment on line 6 stating "scripts must be inlined" and the platform constraints, this should remain'inline'.🔎 Proposed fix
export const CLAUDE_PLATFORM: PlatformCapabilities = { id: 'claude', name: 'Claude (Artifacts)', supportsWidgets: true, supportsTailwind: true, supportsHtmx: false, // Network blocked, HTMX won't work for API calls networkMode: 'blocked', - scriptStrategy: 'cdn', + scriptStrategy: 'inline', maxInlineSize: 100 * 1024, // 100KB limit for artifacts cspRestrictions: ["script-src 'unsafe-inline'", "connect-src 'none'"],Based on learnings: Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints.
🧹 Nitpick comments (1)
libs/uipack/src/typings/type-fetcher.ts (1)
604-675: Approve with minor ReDoS consideration.The utility functions are well-implemented with comprehensive fallback logic. The
escapeRegExphelper properly sanitizes package names before regex construction.Note on line 654: Static analysis flagged the RegExp construction from variable input. However, the risk is low because:
- The
packageNameis derived from parsed import statements (controlled input)escapeRegExpsanitizes special characters- The regex pattern is simple and non-backtracking
For additional safety, you could consider validating that
packageNamematches expected package name patterns (e.g.,^(@[a-z0-9-~][a-z0-9-._~]*/)?[a-z0-9-~][a-z0-9-._~]*$) before regex construction, but this is optional given the existing safeguards.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (17)
libs/ui/src/bridge/adapters/base-adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/claude.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/ext-apps.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/gemini.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/generic.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/adapters/openai.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/core/adapter-registry.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/core/bridge-factory.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/core/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/runtime/iife-generator.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/bridge/types.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/ui/src/layouts/base.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/build/cdn-resources.tsis excluded by!**/build/**libs/uipack/src/build/hybrid-data.tsis excluded by!**/build/**libs/uipack/src/build/index.tsis excluded by!**/build/**
📒 Files selected for processing (29)
.gitignorelibs/ui/src/bridge/adapters/base-adapter.d.tslibs/ui/src/bridge/adapters/claude.adapter.d.tslibs/ui/src/bridge/adapters/ext-apps.adapter.d.tslibs/ui/src/bridge/adapters/gemini.adapter.d.tslibs/ui/src/bridge/adapters/generic.adapter.d.tslibs/ui/src/bridge/adapters/index.d.tslibs/ui/src/bridge/adapters/openai.adapter.d.tslibs/ui/src/bridge/core/adapter-registry.d.tslibs/ui/src/bridge/core/bridge-factory.d.tslibs/ui/src/bridge/core/index.d.tslibs/ui/src/bridge/index.d.tslibs/ui/src/bridge/runtime/iife-generator.d.tslibs/ui/src/bridge/types.d.tslibs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/types.tslibs/ui/src/layouts/base.d.tslibs/ui/src/universal/cached-runtime.tslibs/uipack/src/runtime/wrapper.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/index.tslibs/uipack/src/typings/schemas.tslibs/uipack/src/typings/type-fetcher.tslibs/uipack/src/typings/types.tslibs/uipack/tsconfig.lib.tsbuildinfo
💤 Files with no reviewable changes (15)
- libs/uipack/tsconfig.lib.tsbuildinfo
- libs/ui/src/bridge/adapters/openai.adapter.d.ts
- libs/ui/src/bridge/adapters/generic.adapter.d.ts
- libs/ui/src/bridge/adapters/claude.adapter.d.ts
- libs/ui/src/bridge/core/bridge-factory.d.ts
- libs/ui/src/bridge/core/index.d.ts
- libs/ui/src/bridge/adapters/ext-apps.adapter.d.ts
- libs/ui/src/bridge/core/adapter-registry.d.ts
- libs/ui/src/layouts/base.d.ts
- libs/ui/src/bridge/runtime/iife-generator.d.ts
- libs/ui/src/bridge/adapters/index.d.ts
- libs/ui/src/bridge/adapters/gemini.adapter.d.ts
- libs/ui/src/bridge/adapters/base-adapter.d.ts
- libs/ui/src/bridge/types.d.ts
- libs/ui/src/bridge/index.d.ts
🚧 Files skipped from review as they are similar to previous changes (2)
- libs/uipack/src/typings/index.ts
- libs/ui/src/universal/cached-runtime.ts
🧰 Additional context used
📓 Path-based instructions (9)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/types.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/schemas.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/type-fetcher.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
libs/ui/src/**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
libs/ui/src/**/*.test.{ts,tsx}: Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Include SSR tests to verify server-side rendering output for React components
Files:
libs/ui/src/bundler/__tests__/bundler.test.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/types.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/schemas.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/type-fetcher.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/typings/types.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/schemas.tslibs/uipack/src/runtime/wrapper.tslibs/uipack/src/typings/type-fetcher.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/platforms.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
🧠 Learnings (32)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/theme/platforms.ts.gitignorelibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Include SSR tests to verify server-side rendering output for React components
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.ts.gitignorelibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/theme/platforms.ts.gitignorelibs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.test.ts : Test invalid inputs for every component to validate error handling
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/theme/platforms.ts.gitignorelibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/ui/src/bundler/__tests__/bundler.test.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/uipack/src/typings/types.ts.gitignorelibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/schemas.tslibs/uipack/src/typings/type-fetcher.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/common/records/**/*.ts : Centralize record types in common/records directory and import from there instead of module-specific files
Applied to files:
libs/uipack/src/typings/types.tslibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/schemas.tslibs/uipack/src/typings/type-fetcher.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/typings/types.ts.gitignore
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
.gitignorelibs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
.gitignorelibs/uipack/src/runtime/wrapper.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
.gitignorelibs/ui/src/bundler/index.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.tslibs/uipack/src/typings/type-fetcher.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Use `changeScope` property instead of `scope` in change events to avoid confusion with Scope class
Applied to files:
.gitignore
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
.gitignorelibs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/schemas.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/*/package.json : Each library in /libs/* is independent and publishable under frontmcp/* scope
Applied to files:
.gitignore
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
.gitignorelibs/ui/src/bundler/bundler.tslibs/uipack/src/runtime/wrapper.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
.gitignorelibs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.schema.ts : Support HTMX attributes in component schemas (get, post, target, swap) with `.strict()` validation
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/schemas.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.ts : Validate all component options using validateOptions() helper with the component's Zod schema
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/schemas.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Validate URIs per RFC 3986 at metadata level using proper validation
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Include error class `instanceof` checks in tests to validate error handling
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Zero React dependency constraint - this is the React-free core package
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Use React 18/19 with TypeScript for all components in frontmcp/ui
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/uipack/src/typings/__tests__/schemas.test.tslibs/ui/src/bundler/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/index.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
🧬 Code graph analysis (4)
libs/ui/src/bundler/__tests__/bundler.test.ts (2)
libs/ui/src/bundler/bundler.ts (1)
InMemoryBundler(168-1985)libs/ui/src/bundler/types.ts (2)
HYBRID_INPUT_PLACEHOLDER(35-35)HYBRID_DATA_PLACEHOLDER(29-29)
libs/uipack/src/typings/__tests__/schemas.test.ts (2)
libs/uipack/src/typings/index.ts (2)
typeFileSchema(72-72)typeFetchResultSchema(74-74)libs/uipack/src/typings/schemas.ts (2)
typeFileSchema(39-45)typeFetchResultSchema(57-68)
libs/uipack/src/typings/__tests__/type-fetcher.test.ts (1)
libs/uipack/src/typings/type-fetcher.ts (3)
getRelativeImportPath(614-618)urlToVirtualPath(632-668)buildTypeFiles(564-602)
libs/uipack/src/typings/type-fetcher.ts (1)
libs/uipack/src/typings/types.ts (2)
TypeFetchResult(60-128)TypeFile(27-43)
🪛 ast-grep (0.40.3)
libs/ui/src/bundler/__tests__/bundler.test.ts
[warning] 965-965: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(HYBRID_DATA_PLACEHOLDER, 'g')
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
[warning] 966-966: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(HYBRID_DATA_PLACEHOLDER, 'g')
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
libs/uipack/src/typings/type-fetcher.ts
[warning] 653-653: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(/${escapeRegExp(packageName)}@[^/]+(/.*)?$)
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (28)
libs/uipack/src/typings/types.ts (2)
14-43: LGTM! Well-designed interface for browser editor integration.The
TypeFileinterface provides clear structure for per-file type metadata with comprehensive documentation and usage examples.
75-116: LGTM! Backward-compatible extension with clear migration path.The addition of
subpathandfilesfields enhances browser editor compatibility while maintaining the deprecatedcontentfield for backward compatibility. The documentation clearly explains the migration path.libs/uipack/src/typings/__tests__/schemas.test.ts (2)
48-104: LGTM! Comprehensive test coverage for typeFileSchema.The test suite thoroughly validates the new schema including edge cases (empty content, empty URL for alias files) and strict mode validation. Based on learnings, this achieves the required 95%+ test coverage.
132-146: LGTM! Proper validation of optional subpath field.The tests correctly verify both presence and absence of the optional
subpathfield in fetch results.libs/uipack/src/typings/schemas.ts (2)
30-48: LGTM! Well-designed schema with intentional empty URL support.The
typeFileSchemacorrectly enforces required non-empty paths while allowing empty URLs for synthesized alias files. The.strict()mode validation aligns with coding guidelines.
57-68: LGTM! Schema correctly reflects the extended TypeFetchResult interface.The schema properly adds the optional
subpathand requiredfilesfields, maintaining.strict()mode validation.libs/uipack/src/typings/__tests__/type-fetcher.test.ts (1)
233-336: LGTM! Comprehensive test coverage for virtual path utilities.The test suites thoroughly validate all new utility functions including edge cases (invalid URLs, scoped packages, deep subpaths, alias generation). The tests properly verify:
- Relative path calculation for various subpath depths
- URL-to-virtual-path conversion for different URL formats
- Alias file generation with empty URLs
- Prevention of duplicate alias files
Based on learnings, this achieves the required 95%+ test coverage.
libs/uipack/src/typings/type-fetcher.ts (2)
259-271: LGTM! Clean integration of per-file metadata.The code correctly builds the
filesarray and populates bothsubpathandfilesfields on the result, while maintaining backward compatibility through the deprecatedcontentfield.
553-602: LGTM! Well-implemented file metadata builder.The
buildTypeFilesfunction correctly:
- Constructs virtual paths for each fetched file
- Generates alias entry points for subpath imports
- Prevents duplicate alias creation by checking for existing files
- Uses empty URLs to mark synthesized files
The comprehensive documentation and examples make the function easy to understand.
libs/uipack/src/runtime/wrapper.ts (1)
2272-2272: Note the fundamental change from CSS to JavaScript-based Tailwind loading.The template now uses a
<script>tag instead of a<link>tag to load Tailwind. This means Tailwind will run as a JavaScript runtime in the browser rather than being parsed as a static stylesheet.This change:
- May affect initial render performance (JS execution vs CSS parsing)
- Enables JIT compilation in the browser
- Must be compatible with Claude's sandbox CSP for script execution
Ensure this approach has been tested in Claude Artifacts and performs acceptably.
Based on learnings, Claude's sandbox has specific CSP restrictions for external scripts, so this approach should be validated against those constraints.
.gitignore (1)
64-65: LGTM! Improved gitignore patterns.The broader
**/.script.localpattern is more maintainable than the previous specific path, and adding the tsbuildinfo file for the uipack library is appropriate for excluding build artifacts.libs/uipack/src/theme/platforms.ts (1)
123-134: LGTM! Gemini platform capabilities expanded appropriately.Enabling Tailwind support and relaxing network mode to 'limited' (from 'blocked') makes sense for broader platform compatibility, while maintaining the inline script strategy for reliability.
libs/ui/src/bundler/types.ts (5)
15-71: LGTM! Well-designed build mode type system.The build mode types are cleanly structured with:
- Clear union type for BuildMode
- String literal placeholders for hybrid mode
- Well-documented option interfaces with sensible defaults
745-763: LGTM! Type-safe platform definitions.The platform type system correctly:
- Extends TargetPlatform with 'ext-apps'
- Uses
Excludeto create ConcretePlatform (excludes 'auto')- Defines ALL_PLATFORMS as readonly for immutability
894-914: LGTM! Theme integration follows best practices.The theme configuration properly integrates with @frontmcp/uipack/theme:
- Optional field with DEFAULT_THEME fallback
- Clear documentation with usage examples
- Follows coding guideline to use theme configuration
As per coding guidelines: Use theme.cdn configuration instead of hard-coding CDN URLs.
976-1073: LGTM! Build mode integration is backward compatible.The build mode fields are properly integrated:
- Optional fields with safe 'static' default
- Result type includes hybrid mode placeholders
- Maintains backward compatibility
1183-1246: LGTM! Multi-platform build types are well-structured.The multi-platform types properly:
- Extend existing types with appropriate modifications
- Use
Record<string, unknown>for flexible metadata- Include shared component code for efficiency
- Provide comprehensive metrics tracking
libs/ui/src/bundler/__tests__/bundler.test.ts (3)
389-445: LGTM! Comprehensive theme injection tests.The tests properly validate:
- DEFAULT_THEME CSS variable injection by default
- Custom theme CSS variable injection when provided
- Correct CSS injection order (Tailwind → theme → custom)
584-783: LGTM! Thorough multi-platform build test coverage.The tests comprehensively validate:
- All 5 platforms build correctly
- Shared component code optimization
- Platform-specific metadata generation
- CDN type handling (UMD for Claude, ESM for others)
- Theme propagation across platforms
Achieves 95%+ coverage as per coding guidelines.
789-1092: LGTM! Complete build mode test coverage.The tests thoroughly validate:
- All three build modes (static, dynamic, hybrid)
- Data injection variants and options
- Dynamic event subscriptions
- Hybrid mode placeholders and helpers
- Multi-platform build mode support
Regarding the static analysis warning on lines 965-966: The RegExp is constructed from
HYBRID_DATA_PLACEHOLDERwhich is a constant string literal (not user input), so there is no ReDoS vulnerability. This is a false positive.libs/ui/src/bundler/index.ts (1)
67-94: LGTM! Proper public API expansion.The new exports correctly:
- Expose multi-platform types (ConcretePlatform, MultiPlatformBuildOptions, etc.)
- Expose build mode types (BuildMode, DynamicModeOptions, HybridModeOptions)
- Expose constants (ALL_PLATFORMS, HYBRID_DATA_PLACEHOLDER, etc.)
- Follow barrel file pattern from coding guidelines
As per coding guidelines: Export public API through barrel files - export users' needed items, no legacy exports with different names.
libs/ui/src/bundler/bundler.ts (7)
24-58: LGTM! Clean import organization.The new imports properly support:
- Multi-platform types and constants
- Theme integration from @frontmcp/uipack/theme
- UI metadata generation from @frontmcp/uipack/adapters
- CDN utilities from @frontmcp/uipack/build
419-468: LGTM! Backward-compatible enhancements to bundleToStaticHTML.The updates properly:
- Thread theme configuration to HTML head generation
- Support build mode selection with appropriate options
- Calculate placeholders only for hybrid mode
- Extend result type with new optional fields
471-571: LGTM! Efficient multi-platform build implementation.The bundleToStaticHTMLAll method is well-designed:
- Transpiles component code once for all platforms (optimization)
- Generates platform-specific HTML variations
- Tracks separate metrics for transpile vs generation time
- Properly handles universal vs standard modes
- Returns comprehensive result with per-platform metadata
577-713: LGTM! Well-structured per-platform build helper.The buildForPlatform method correctly:
- Handles universal and standard rendering paths
- Uses cached runtime for efficiency in universal mode
- Generates platform-specific metadata via buildUIMeta
- Returns complete PlatformBuildResult with all required fields
- Properly determines hybrid mode placeholders
715-733: LGTM! Clean platform type mapping.The mapping function correctly translates:
- Internal platform identifiers to AI platform types
- All 5 concrete platforms are covered
- Safe default fallback to 'generic-mcp'
1308-1403: LGTM! Theme integration properly implemented.The updates correctly:
- Return MergedStaticHTMLOptions with build mode fields
- Accept theme parameter in buildStaticHTMLHead
- Use buildCDNScriptTag for Tailwind (follows coding guidelines)
- Inject theme CSS in correct order (after Tailwind, before custom)
- Use buildThemeCss from @frontmcp/uipack/theme
- Default to DEFAULT_THEME when no theme provided
As per coding guidelines: Use theme.cdn configuration instead of hard-coding CDN URLs.
1644-1871: LGTM! Clean build mode implementation with proper separation.The build mode data injection methods are well-designed:
- Dispatcher pattern for mode selection
- Static mode preserves backward compatibility
- Dynamic mode subscribes to platform events (OpenAI canvas.onToolResult)
- Hybrid mode uses placeholders with JSON parsing logic
- All JSON is properly serialized with error handling
- Dynamic mode supports loading states and initial data options
… OpenAI and non-OpenAI environments
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
libs/ui/src/universal/cached-runtime.ts (1)
846-920: Add documentation for new public API exports.This introduces new public types (
BuildMode,DataInjectionOptions) and extendsbuildDataInjectionCodefunction signature in a publishable SDK library. Per coding guidelines, public API changes require corresponding documentation indocs/draft/docs/**. Add documentation covering the three build modes (static,dynamic,hybrid), configuration options, and updated usage examples.
🧹 Nitpick comments (3)
libs/ui/src/bundler/bundler.ts (3)
504-571: Review type safety in multi-platform bundling flow.Two type safety concerns:
Line 508:
mergeStaticHTMLOptions(options as StaticHTMLOptions)- The cast fromMultiPlatformBuildOptionstoStaticHTMLOptionsmay not be safe if these types diverge. Consider makingmergeStaticHTMLOptionsacceptMultiPlatformBuildOptionsor using a common base type.Line 562: The type assertion
as Record<ConcretePlatform, PlatformBuildResult>assumes all platforms in the array were successfully processed. While the loop doesn't skip platforms, this assertion bypasses TypeScript's type checking. Consider using proper typing or validation.🔎 Safer typing approach
For issue 1, update the method signature:
- private mergeStaticHTMLOptions(options: StaticHTMLOptions): MergedStaticHTMLOptions { + private mergeStaticHTMLOptions(options: StaticHTMLOptions | MultiPlatformBuildOptions): MergedStaticHTMLOptions {For issue 2, the assertion is likely safe given the loop structure, but consider adding a runtime check:
+ // Verify all platforms were processed + if (Object.keys(platformResults).length !== platforms.length) { + throw new Error('Not all platforms were processed successfully'); + } + return { platforms: platformResults as Record<ConcretePlatform, PlatformBuildResult>,
1377-1384: Remove commented-out code.Lines 1378-1384 contain commented-out Tailwind configuration logic that is no longer needed. Dead code should be removed to maintain code clarity.
🔎 Clean up commented code
parts.push(buildCDNScriptTag(CLOUDFLARE_CDN.tailwindCss)); - // // Tailwind CSS (same for all platforms - CSS file from cdnjs) - // const tailwindConfig = opts.externals.tailwind ?? 'cdn'; - // if (tailwindConfig === 'cdn') { - // } else if (tailwindConfig !== 'inline' && tailwindConfig) { - // // Custom URL - // parts.push(`<link rel="stylesheet" href="${tailwindConfig}">`); - // } - // Theme CSS variables (injected as :root variables after Tailwind)
1735-1815: Consider extracting duplicate placeholder parsing logic.The placeholder parsing logic in
buildDynamicWithPlaceholdersScript(lines 1766-1802) andbuildHybridDataScript(lines 1952-1988) is nearly identical. This duplication makes maintenance harder and increases the risk of inconsistencies.🔎 Extract shared logic into a helper
Consider creating a helper function that generates the placeholder parsing script:
private buildPlaceholderParsingScript( outputPlaceholder: string, inputPlaceholder: string, includeInitialData: boolean ): string { return ` var outputNotReplaced = false; // Parse output placeholder var rawOutput = window.__mcpToolOutput; if (typeof rawOutput === 'string' && rawOutput !== "${outputPlaceholder}") { try { window.__mcpToolOutput = JSON.parse(rawOutput); } catch (e) { console.warn('[FrontMCP] Failed to parse injected output data:', e); window.__mcpToolOutput = null; window.__mcpHybridError = 'Failed to parse output data'; } } else if (rawOutput === "${outputPlaceholder}") { window.__mcpToolOutput = null; outputNotReplaced = true; } // Parse input placeholder var rawInput = window.__mcpToolInput; if (typeof rawInput === 'string' && rawInput !== "${inputPlaceholder}") { try { window.__mcpToolInput = JSON.parse(rawInput); } catch (e) { console.warn('[FrontMCP] Failed to parse injected input data:', e); window.__mcpToolInput = null; } } else if (rawInput === "${inputPlaceholder}") { window.__mcpToolInput = null; } // Set error if expecting initial data but placeholder not replaced if (outputNotReplaced && ${includeInitialData}) { window.__mcpHybridError = 'No data provided. The output placeholder was not replaced.'; } `; }Then both methods can call this helper to reduce duplication.
Also applies to: 1921-2002
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
🧰 Additional context used
📓 Path-based instructions (5)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/bundler.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
libs/ui/src/universal/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Files:
libs/ui/src/universal/cached-runtime.ts
🧠 Learnings (10)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.ts
🔇 Additional comments (10)
libs/ui/src/universal/cached-runtime.ts (5)
169-180: LGTM! Public API enhancement for dynamic data updates.The new
updateOutputandupdateInputmethods provide a clean interface for dynamic mode to update state and maintain backward compatibility with window globals.
767-789: Excellent improvement to minification safety.The conservative approach correctly avoids corrupting string literals while still providing meaningful size reduction. The explicit decision to preserve inline comments (to protect URLs like
http://) is well-documented and appropriate.
922-1014: Well-structured build mode implementation with platform awareness.The separation of static and dynamic data injection, combined with platform-aware dispatching based on
cdnType, aligns well with the learnings about platform-aware theming and configuration. The extractedbuildStaticDataInjectionCodemaintains backward compatibility while enabling the new modes.
1016-1082: Solid placeholder-based dynamic injection for non-OpenAI platforms.The implementation correctly handles placeholder replacement with appropriate error states and loading management. The logic for detecting unreplaced placeholders and signaling errors is clear and defensive.
1158-1223: Clean hybrid mode implementation with clear error signaling.The hybrid mode appropriately combines placeholder replacement with explicit error messaging when placeholders aren't replaced. The consistent use of
safeJsonand comprehensive error handling throughout all three mode implementations demonstrates good defensive programming.libs/ui/src/bundler/bundler.ts (5)
722-740: LGTM! Clean platform type mapping.The platform-to-metadata type mapping is clear and provides appropriate fallback handling.
1405-1416: Theme integration looks good.The theme style block correctly:
- Uses
DEFAULT_THEMEas a fallback- Generates CSS variables via
buildThemeCss- Wraps in
:rootselector for proper CSS variable scopingBased on learnings: Use theme.cdn configuration instead of hard-coding CDN URLs.
1657-1676: Clean separation of build modes.The dispatch logic correctly routes to mode-specific builders with appropriate defaults. This design makes it easy to extend with new modes in the future.
1817-1919: OpenAI subscription logic looks well-structured.The dynamic subscription handling correctly:
- Provides optional initial data
- Subscribes to OpenAI canvas events when available
- Includes fallback for testing/other platforms
- Dispatches custom events for React hook integration
418-469: Consistent integration of new parameters.All callsites correctly thread through the new theme and build mode parameters. Return values appropriately include the new fields for hybrid mode placeholders.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (1)
docs/draft/docs/ui/advanced/build-modes.mdx (1)
238-321: Comprehensive API reference with minor import path clarification opportunity.The TypeScript types and API reference provide complete documentation for the build modes feature. The type definitions and function signatures are thorough and include defaults.
Minor note: The example imports types from
@frontmcp/ui/bundler(line 241) while helper functions come from@frontmcp/uipack/build(lines 107, 168). Consider adding a note about which exports come from which package to help developers understand the module organization.💡 Optional clarification for import paths
Consider adding a brief note at the beginning of the TypeScript Types section:
## TypeScript Types +**Note:** Type definitions are exported from `@frontmcp/ui/bundler`, while helper functions are exported from `@frontmcp/uipack/build`. + ```typescript import type { BuildMode, DynamicModeOptions, HybridModeOptions } from '@frontmcp/ui/bundler';This helps developers understand which package provides which exports.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
docs/draft/docs.jsondocs/draft/docs/ui/advanced/build-modes.mdxdocs/draft/docs/ui/advanced/platforms.mdxlibs/ui/tsconfig.lib.jsonlibs/uipack/src/index.ts
✅ Files skipped from review due to trivial changes (1)
- libs/ui/tsconfig.lib.json
🧰 Additional context used
📓 Path-based instructions (5)
docs/draft/docs/**
⚙️ CodeRabbit configuration file
docs/draft/docs/**: This folder holds the draft/source docs that humans are expected to edit. When authors want to add or change documentation, they should do it here. The Codex workflow uses these drafts, together with the code diff, to generate the latest docs under docs/docs/. As a reviewer: - Encourage contributors to add/update content here instead of docs/docs/. - It is fine to do structural/content feedback here (clarity, examples, etc).
Files:
docs/draft/docs/ui/advanced/platforms.mdxdocs/draft/docs/ui/advanced/build-modes.mdx
docs/**
⚙️ CodeRabbit configuration file
docs/**: Repository documentation for the SDK, using MDX and hosted by Mintlify. See more specific rules for: - docs/docs/** (latest rendered docs, automation-only) - docs/v/** (archived versions, read-only) - docs/draft/docs/** (human-editable drafts) - docs/blogs/** (blogs, human edited) - docs/docs.json (Mintlify navigation)
Files:
docs/draft/docs/ui/advanced/platforms.mdxdocs/draft/docs.jsondocs/draft/docs/ui/advanced/build-modes.mdx
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/index.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/index.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/index.ts
🧠 Learnings (13)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
docs/draft/docs/ui/advanced/platforms.mdxlibs/uipack/src/index.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
docs/draft/docs/ui/advanced/platforms.mdx
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
docs/draft/docs.json
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/uipack/src/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/index.ts
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (7)
libs/uipack/src/index.ts (1)
80-87: LGTM! Public API expansion for hybrid data injection.The new exports follow the established barrel file pattern and naming conventions. The grouping under "Hybrid mode data injection" clearly documents the purpose of these additions.
docs/draft/docs.json (1)
239-239: LGTM! Navigation entry correctly placed.The new "build-modes" page is logically positioned in the Advanced section after the platforms page, which provides necessary context for understanding build mode behavior.
docs/draft/docs/ui/advanced/platforms.mdx (1)
21-37: LGTM! Clear platform-aware build mode documentation.The new section effectively summarizes platform-specific build mode behavior with a clear comparison table. The explanation distinguishes OpenAI's event subscription model from Claude's placeholder-based approach, and the Card provides appropriate navigation to detailed documentation.
docs/draft/docs/ui/advanced/build-modes.mdx (4)
1-49: LGTM! Clear overview and static mode documentation.The overview table effectively differentiates the three build modes, and the static mode section provides a complete example with both input code and generated HTML output. The "Use when" guidance helps developers choose the appropriate mode.
50-135: LGTM! Platform-aware dynamic mode well documented.The section clearly distinguishes OpenAI's event-driven approach from Claude's placeholder-based approach. The code examples show concrete implementations for both platforms, and the dynamic options table provides clear defaults and descriptions.
137-199: LGTM! Hybrid mode caching pattern clearly explained.The section effectively demonstrates the caching use case with a clear two-step workflow. The helper functions documentation and error handling guidance provide developers with complete information for implementing hybrid mode correctly.
200-237: LGTM! Multi-platform guidance and best practices well articulated.The multi-platform building example demonstrates how to handle platform-specific HTML outputs correctly. The best practices section provides clear decision criteria for choosing between build modes, and the summary table consolidates key behavioral differences.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
♻️ Duplicate comments (1)
libs/ui/src/bundler/bundler.ts (1)
56-56: Verify that@frontmcp/uipack/buildexport path exists.A previous review flagged this import as potentially broken. Confirm that
buildCDNScriptTagandCLOUDFLARE_CDNare properly exported from@frontmcp/uipack/build.#!/bin/bash # Verify the @frontmcp/uipack/build export exists echo "=== Checking package.json exports ===" cat libs/uipack/package.json | grep -A 30 '"exports"' | head -40 echo "" echo "=== Searching for buildCDNScriptTag export ===" rg -n 'export.*buildCDNScriptTag' libs/uipack/src/ echo "" echo "=== Searching for CLOUDFLARE_CDN export ===" rg -n 'export.*CLOUDFLARE_CDN' libs/uipack/src/
🧹 Nitpick comments (2)
libs/ui/src/layouts/base.ts (1)
179-191: Consider removing unused_themeparameter or documenting future use.The
_themeparameter is accepted but not used ingetBackgroundClasses. While the underscore prefix correctly signals it's intentionally unused, this creates an inconsistent API where theme is passed (line 304) but ignored.If theme-aware background styling is planned, consider adding a TODO comment. Otherwise, the parameter could be removed to avoid confusion.
libs/ui/src/bridge/core/bridge-factory.ts (1)
34-42: Note:_EMPTY_CAPABILITIESis defined but unused.The constant was renamed with underscore prefix to indicate it's unused. Consider removing it entirely if it serves no purpose, or document its intended use case.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (22)
eslint.config.mjslibs/ui/src/bridge/adapters/ext-apps.adapter.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/bundler/file-cache/hash-calculator.tslibs/ui/src/bundler/file-cache/storage/filesystem.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/components/button.test.tslibs/ui/src/layouts/base.tslibs/ui/src/layouts/presets.tslibs/ui/src/pages/consent.tslibs/ui/src/pages/error.tslibs/ui/src/react/Badge.tsxlibs/ui/src/react/hooks/context.tsxlibs/ui/src/react/types.tslibs/ui/src/universal/UniversalApp.tsxlibs/ui/src/universal/renderers/index.tslibs/ui/src/universal/runtime-builder.tslibs/ui/src/universal/types.tslibs/ui/src/web-components/elements/fmcp-input.tslibs/ui/src/web-components/elements/fmcp-select.ts
💤 Files with no reviewable changes (3)
- libs/ui/src/react/Badge.tsx
- libs/ui/src/components/button.test.ts
- libs/ui/src/universal/types.ts
✅ Files skipped from review due to trivial changes (3)
- libs/ui/src/universal/UniversalApp.tsx
- libs/ui/src/bridge/adapters/ext-apps.adapter.ts
- libs/ui/src/bundler/file-cache/storage/filesystem.ts
🚧 Files skipped from review as they are similar to previous changes (1)
- libs/ui/src/universal/runtime-builder.ts
🧰 Additional context used
📓 Path-based instructions (7)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/ui/src/web-components/elements/fmcp-select.tslibs/ui/src/bundler/file-cache/hash-calculator.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/pages/error.tslibs/ui/src/layouts/presets.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/web-components/elements/fmcp-input.tslibs/ui/src/layouts/base.tslibs/ui/src/react/types.tslibs/ui/src/pages/consent.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/web-components/elements/fmcp-select.tslibs/ui/src/bundler/file-cache/hash-calculator.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/pages/error.tslibs/ui/src/react/hooks/context.tsxlibs/ui/src/layouts/presets.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/web-components/elements/fmcp-input.tslibs/ui/src/layouts/base.tslibs/ui/src/react/types.tslibs/ui/src/pages/consent.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/ui/src/web-components/elements/fmcp-select.tslibs/ui/src/bundler/file-cache/hash-calculator.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/pages/error.tslibs/ui/src/react/hooks/context.tsxlibs/ui/src/layouts/presets.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/web-components/elements/fmcp-input.tslibs/ui/src/layouts/base.tslibs/ui/src/react/types.tslibs/ui/src/pages/consent.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/file-cache/hash-calculator.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.ts
libs/ui/src/react/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
libs/ui/src/react/**/*.{ts,tsx}: Use React 18/19 with TypeScript for all components in @frontmcp/ui
Ensure SSR support via react-dom/server for React components
Provide TypeScript types for all component props without using 'any' type without justification
Files:
libs/ui/src/react/hooks/context.tsxlibs/ui/src/react/types.ts
libs/ui/src/react/hooks/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
libs/ui/src/react/hooks/**/*.{ts,tsx}: Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Files:
libs/ui/src/react/hooks/context.tsx
libs/ui/src/universal/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Files:
libs/ui/src/universal/renderers/index.ts
🧠 Learnings (34)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tseslint.config.mjslibs/ui/src/react/hooks/context.tsxlibs/ui/src/layouts/presets.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/web-components/elements/fmcp-input.tslibs/ui/src/layouts/base.tslibs/ui/src/react/types.tslibs/ui/src/pages/consent.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.schema.ts : Support HTMX attributes in component schemas (get, post, target, swap) with `.strict()` validation
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tslibs/ui/src/web-components/elements/fmcp-input.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tslibs/ui/src/bundler/file-cache/hash-calculator.tseslint.config.mjslibs/ui/src/react/hooks/context.tsxlibs/ui/src/layouts/presets.tslibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/react/types.tslibs/ui/src/pages/consent.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tseslint.config.mjslibs/ui/src/react/hooks/context.tsxlibs/ui/src/react/types.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.ts : Validate all component options using validateOptions() helper with the component's Zod schema
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tseslint.config.mjslibs/ui/src/react/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/ui/src/web-components/elements/fmcp-select.tseslint.config.mjslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/file-cache/hash-calculator.tseslint.config.mjslibs/ui/src/react/hooks/context.tsxlibs/ui/src/bundler/file-cache/storage/redis.tslibs/ui/src/react/types.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Use `getCapabilities()` method for dynamic capability exposure instead of hardcoding capabilities
Applied to files:
libs/ui/src/bridge/core/bridge-factory.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/layouts/presets.tslibs/ui/src/layouts/base.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/*/package.json : Each library in /libs/* is independent and publishable under frontmcp/* scope
Applied to files:
eslint.config.mjs
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
eslint.config.mjslibs/ui/src/pages/error.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
eslint.config.mjslibs/ui/src/layouts/base.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Use React 18/19 with TypeScript for all components in frontmcp/ui
Applied to files:
eslint.config.mjslibs/ui/src/react/hooks/context.tsxlibs/ui/src/react/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Applied to files:
libs/ui/src/react/hooks/context.tsxlibs/ui/src/react/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/ui/src/react/hooks/context.tsxlibs/ui/src/layouts/presets.tslibs/ui/src/react/types.tslibs/ui/src/bundler/bundler.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Applied to files:
libs/ui/src/react/hooks/context.tsx
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/ui/src/layouts/presets.tslibs/ui/src/react/types.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/ui/src/layouts/presets.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/ui/src/layouts/base.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Ensure SSR support via react-dom/server for React components
Applied to files:
libs/ui/src/react/types.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/common/records/**/*.ts : Centralize record types in common/records directory and import from there instead of module-specific files
Applied to files:
libs/ui/src/react/types.tslibs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Avoid non-null assertions (`!`) - use proper error handling and throw specific errors instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Use strict TypeScript mode with no `any` types without strong justification - use `unknown` instead for generic type defaults
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Use entry points from package.json exports for public API access instead of direct file imports
Applied to files:
libs/ui/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.adapter.ts : Implement client-side hydration for interactive widgets using ReactRendererAdapter
Applied to files:
libs/ui/src/universal/renderers/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Include SSR tests to verify server-side rendering output for React components
Applied to files:
libs/ui/src/universal/renderers/index.ts
🧬 Code graph analysis (2)
libs/ui/src/layouts/base.ts (3)
libs/ui/src/layouts/index.ts (1)
BackgroundStyle(11-11)libs/sdk/src/auth/ui/base-layout.ts (1)
ThemeConfig(91-100)libs/sdk/src/auth/ui/index.ts (1)
ThemeConfig(16-16)
libs/ui/src/bundler/bundler.ts (5)
libs/ui/src/bundler/index.ts (14)
HYBRID_DATA_PLACEHOLDER(93-93)HYBRID_INPUT_PLACEHOLDER(94-94)MultiPlatformBuildOptions(72-72)MultiPlatformBuildResult(74-74)StaticHTMLOptions(69-69)ALL_PLATFORMS(91-91)ConcretePlatform(67-67)PlatformBuildResult(73-73)getCdnTypeForPlatform(89-89)DEFAULT_STATIC_HTML_OPTIONS(87-87)StaticHTMLExternalConfig(68-68)BuildMode(76-76)DynamicModeOptions(77-77)HybridModeOptions(78-78)libs/ui/src/bundler/types.ts (15)
HYBRID_DATA_PLACEHOLDER(29-29)HYBRID_INPUT_PLACEHOLDER(35-35)MultiPlatformBuildOptions(1187-1193)MultiPlatformBuildResult(1217-1246)StaticHTMLOptions(801-1001)ALL_PLATFORMS(757-763)ConcretePlatform(751-751)PlatformBuildResult(1199-1211)MergedStaticHTMLOptions(1147-1177)getCdnTypeForPlatform(1109-1112)DEFAULT_STATIC_HTML_OPTIONS(1117-1137)StaticHTMLExternalConfig(772-796)BuildMode(23-23)DynamicModeOptions(40-54)HybridModeOptions(59-71)libs/ui/src/universal/types.ts (1)
ContentType(21-21)libs/ui/src/universal/cached-runtime.ts (2)
getCachedRuntime(684-757)BuildMode(850-850)libs/uipack/src/adapters/index.ts (1)
buildUIMeta(19-19)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (19)
libs/ui/src/web-components/elements/fmcp-select.ts (1)
25-25: LGTM! Clean removal of unused import.The
getObservedAttributesFromSchemahelper is not used in this file sinceobservedAttributesis manually defined (lines 45-61). This is a clean code improvement with no functional impact.libs/ui/src/web-components/elements/fmcp-input.ts (1)
26-26: LGTM! Clean removal of unused import.The
getObservedAttributesFromSchemahelper is not used in this file sinceobservedAttributesis manually defined (lines 44-68). This is a clean code improvement with no functional impact.libs/ui/src/bundler/file-cache/storage/redis.ts (1)
11-11: LGTM! Clean removal of unused import.The
CacheEntryMetadatatype is not used anywhere in this file. The code accesses themetadataproperty throughCacheEntryobjects but never needs the explicitCacheEntryMetadatatype annotation. This is good housekeeping.libs/ui/src/react/hooks/context.tsx (1)
24-24: LGTM: Cleanup of unused import.Removing the unused
useCallbackimport improves code clarity. Verified thatuseCallbackis not used anywhere in this file.libs/ui/src/react/types.ts (1)
12-12: LGTM! Unused imports removed.The removed imports (
CardOptions,BadgeOptions,ButtonOptions,AlertOptions) are not referenced anywhere in this file. The kept imports (CardVariant,CardSize,BadgeVariant,BadgeSize) are properly used in theCardPropsandBadgePropsinterfaces. This cleanup reduces the import surface without affecting functionality or the public API.libs/ui/src/universal/renderers/index.ts (2)
10-13: LGTM! Import simplification improves code clarity.The refactoring appropriately limits imports to only the renderers needed internally for the registry, reducing unnecessary dependencies.
217-220: All re-exported helpers are correctly exported from their source modules. No action required.libs/ui/src/pages/consent.ts (1)
8-10: LGTM - Import cleanup correctly removes unused dependencies.The removal of
dangerButtonandform/formActionsaligns with actual usage in this file, which only usesprimaryButton,outlineButton,csrfInput, andhiddenInput.libs/ui/src/layouts/presets.ts (1)
14-14: LGTM - Removed unused type import.
PageTypewas imported but not referenced directly in this module. ThepageTypeproperty is used via string literals inbaseLayoutcalls, which TypeScript validates against the type defined inBaseLayoutOptions.libs/ui/src/bundler/file-cache/hash-calculator.ts (1)
179-187: LGTM - Correctly marks unused parameter.The
externalsparameter is documented as excluded from hash calculation (lines 161-162: "External npm packages are NOT included in the hash since they're loaded from CDN"). Renaming to_externalsaligns with ESLint conventions for intentionally unused parameters.libs/ui/src/bundler/file-cache/component-builder.ts (1)
12-24: LGTM - Import cleanup removes unused dependencies.The changes correctly remove:
dirnamefrompath(unused in this file)- Hash calculator imports that are no longer needed
ImportMaptype from dependency importsThe remaining imports (
resolve,extname,calculateComponentHash) are all actively used.eslint.config.mjs (1)
29-29: LGTM - ESLint module boundary configuration expanded for uipack.The addition of
@frontmcp/uipackand@frontmcp/uipack/*to the allow list enables the internal dependency pattern used throughout this PR, wherelibs/uiimports theme utilities, adapters, and build helpers from@frontmcp/uipack.libs/ui/src/layouts/base.ts (1)
248-262: LGTM - Dead code cleanup forpageTypevariable.The
pageTypeparameter remains inBaseLayoutOptionsfor API compatibility but is no longer used internally. The underscore prefix correctly signals this is intentional.libs/ui/src/bridge/core/bridge-factory.ts (1)
380-389: Excellent refactor - eliminates non-null assertions with type-safe helper.The updated
_ensureInitialized()pattern that returnsPlatformAdapteris a clean improvement. This eliminates allthis._adapter!non-null assertions throughout the class, aligning with coding guidelines: "Avoid non-null assertions - use proper error handling and throw specific errors instead."The pattern is consistently applied across all data access and action methods.
libs/ui/src/bundler/bundler.ts (5)
646-682: Good defensive check fortranspiledCodein standard mode.Line 648-650 properly validates that
transpiledCodeexists before use, throwing a clear error if missing. This addresses the concern from previous reviews about non-null assertions.
1407-1418: LGTM - Theme CSS generation uses proper utilities.The new
buildThemeStyleBlockmethod correctly usesbuildThemeCssfrom@frontmcp/uipack/themewithDEFAULT_THEMEas fallback. This aligns with the coding guidance to use theme.cdn configuration rather than hard-coding CDN URLs.
727-742: LGTM - Clean platform type mapping.The mapping function handles all
ConcretePlatformvalues explicitly with a safe fallback to'generic-mcp'. This enables proper platform metadata generation viabuildUIMeta.
1323-1355: LGTM - Options merging extended for new build mode features.The
mergeStaticHTMLOptionsmethod is properly updated to handle:
buildModewith default fromDEFAULT_STATIC_HTML_OPTIONSdynamicOptionsandhybridOptionsas pass-through (no defaults needed)themeconfiguration pass-through
1741-1817: No placeholder injection vulnerability in this method.The method
buildDynamicWithPlaceholdersScriptat lines 1741-1817 does not accept custom placeholder values. It only uses the hardcoded default constantsHYBRID_DATA_PLACEHOLDER(__FRONTMCP_OUTPUT_PLACEHOLDER__) andHYBRID_INPUT_PLACEHOLDER(__FRONTMCP_INPUT_PLACEHOLDER__), which are safe strings. TheDynamicModeOptionsparameter type does not include aplaceholderfield—onlyincludeInitialDataandsubscribeToUpdates. Custom placeholders are only supported in the separatebuildHybridDataScriptmethod, which usesHybridModeOptions.
…ross multiple files
…ross multiple files
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
🧹 Nitpick comments (6)
libs/uipack/src/runtime/adapters/mdx.adapter.ts (1)
190-191: Consider removing the unused compilation or document its validation purpose.The MDX compilation result is now explicitly marked as unused (via
_compiledand the comment), yet the async compilation still executes. This consumes resources without producing value in the current implementation.If the compilation serves as validation to ensure the MDX is syntactically correct before falling back to markdown, consider adding a comment explaining this. Otherwise, consider removing or conditionally skipping the compilation step until React runtime integration is implemented.
Option 1: Skip compilation until needed
private async compileMdx(source: string, context: RenderContext): Promise<string> { if (!this.mdxRuntime?.compile) { return this.renderMarkdown(source, context); } try { - // Compile MDX to JS (result intentionally unused - we fall back to markdown rendering for now) - const _compiled = await this.mdxRuntime.compile(source, { - outputFormat: 'function-body', - development: false, - }); - - // For now, return the compiled code as-is - // Full execution would require React runtime + // TODO: Enable MDX compilation once React runtime integration is complete + // Full execution would require React runtime from @frontmcp/ui return `<div class="mdx-content" data-compiled="true">${this.renderMarkdown(source, context)}</div>`; } catch (error) { console.warn('[FrontMCP] MDX compilation failed, falling back to markdown:', error); return this.renderMarkdown(source, context); } }Option 2: Document validation purpose
try { - // Compile MDX to JS (result intentionally unused - we fall back to markdown rendering for now) + // Compile MDX to validate syntax (result unused until React runtime integration) + // This ensures the MDX is well-formed before falling back to markdown const _compiled = await this.mdxRuntime.compile(source, { outputFormat: 'function-body', development: false, }); // For now, return the compiled code as-is // Full execution would require React runtime return `<div class="mdx-content" data-compiled="true">${this.renderMarkdown(source, context)}</div>`;libs/uipack/src/dependency/import-map.ts (1)
222-224: Good improvement removing the non-null assertion.The change aligns with the coding guidelines by eliminating the non-null assertion and adding a clarifying comment. The logic is correct since line 215's filter guarantees
dep.globalis truthy.Optional: Use a type predicate for full compile-time type safety
If TypeScript doesn't automatically narrow the type through the filter, consider using a type guard:
+interface ResolvedDependencyWithGlobal extends ResolvedDependency { + global: string; +} + +function hasGlobal(dep: ResolvedDependency): dep is ResolvedDependencyWithGlobal { + return !!dep.global && !dep.esm; +} + export function generateUMDShim(dependencies: ResolvedDependency[], options: UMDShimOptions = {}): string { const { safe = true, minify = false } = options; - const depsWithGlobals = dependencies.filter((d) => d.global && !d.esm); + const depsWithGlobals = dependencies.filter(hasGlobal); if (depsWithGlobals.length === 0) { return ''; } const entries = depsWithGlobals.map((dep) => { - // global is guaranteed to exist due to filter on line 215 - const global = dep.global; + const global = dep.global; // TypeScript now knows this is string, not string | undefined return `'${dep.packageName}': { default: window.${global}, ...window.${global} }`; });This provides compile-time verification that
dep.globalis defined, eliminating the need for runtime comments.libs/uipack/src/renderers/registry.test.ts (2)
155-158: Apply the same type improvement for consistency.Line 155 uses
anyfor a template function signature similar to line 237. For consistency and better type safety, consider using the sameTemplateContext<Record<string, never>, { name: string }>type here.🔎 Proposed fix
- const template = (ctx: any) => `<div>${ctx.output.name}</div>`; + const template = (ctx: TemplateContext<Record<string, never>, { name: string }>) => + `<div>${ctx.output.name}</div>`;
217-227: Consider extracting the duplicated helper.The
createContexthelper is defined identically in two places (lines 217 and 258). Extracting it to the file level would reduce duplication and improve maintainability.🔎 Proposed refactor
Define the helper once at the top of the test suite:
// Add after imports, before describe blocks const createContext = <In = object, Out = object>( input: In, output: Out ): TemplateContext<In, Out> => ({ input, output, helpers: { escapeHtml: (s) => s, formatDate: () => '', formatCurrency: () => '', uniqueId: () => 'id', jsonEmbed: (d) => JSON.stringify(d), }, });Then remove the local definitions at lines 217-227 and 258-268.
Also applies to: 258-268
libs/uipack/src/typings/type-fetcher.ts (2)
632-668: Consider refactoring regex construction to avoid potential ReDoS.Static analysis flagged line 654 for constructing a RegExp from variable input. While
escapeRegExpproperly escapes special characters and the input is controlled (parsed from import specifiers), the greedy quantifier[^/]+could theoretically cause performance issues with malicious input.Consider using string manipulation methods (
indexOf,substring) instead of regex for better performance and to eliminate the theoretical ReDoS risk:Alternative string-based approach
- const packagePattern = new RegExp(`/${escapeRegExp(packageName)}@[^/]+(/.*)?$`); - const match = pathname.match(packagePattern); - - if (match) { - const filePath = match[1] ? match[1].substring(1) : 'index.d.ts'; - return `node_modules/${packageName}/${filePath}`; - } + // Look for package@version pattern + const searchPattern = `/${packageName}@`; + const packageIndex = pathname.indexOf(searchPattern); + + if (packageIndex !== -1) { + // Find the next '/' after the version + const afterAt = packageIndex + searchPattern.length; + const nextSlash = pathname.indexOf('/', afterAt); + + if (nextSlash !== -1) { + const filePath = pathname.substring(nextSlash + 1); + return `node_modules/${packageName}/${filePath || 'index.d.ts'}`; + } else { + return `node_modules/${packageName}/index.d.ts`; + } + }Based on static analysis hints.
175-180: Consider includingfilesarray size in cache entry size calculation.The cache entry size (line 178) only accounts for
content.length, but the result now includes afilesarray that contains per-file metadata. While the content is already included, the additional metadata (paths, URLs) also consumes memory.For more accurate cache size tracking, consider:
Include files array in size calculation
const entry: TypeCacheEntry = { result: result.data, cachedAt: Date.now(), - size: result.data.content.length, + size: result.data.content.length + + result.data.files.reduce((acc, f) => acc + f.path.length + f.url.length + f.content.length, 0), accessCount: 1, };Note: This assumes cache size limits are being used. If not, the current implementation is fine.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (41)
libs/uipack/src/build/widget-manifest.tsis excluded by!**/build/**libs/uipack/src/bundler/file-cache/hash-calculator.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/cdn-registry.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/import-map.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/import-parser.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/resolver.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/schemas.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/template-loader.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/template-processor.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/dependency/types.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/handlebars/expression-extractor.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/handlebars/helpers.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/handlebars/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/renderers/cache.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/renderers/html.renderer.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/renderers/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/renderers/registry.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/renderers/types.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/adapters/html.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/adapters/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/adapters/mdx.adapter.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/adapters/types.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/csp.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/mcp-bridge.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/renderer-runtime.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/sanitizer.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/types.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/runtime/wrapper.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/types/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/types/ui-config.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/types/ui-runtime.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/utils/escape-html.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/utils/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/utils/safe-stringify.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/validation/error-box.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/validation/index.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/validation/schema-paths.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/validation/template-validator.d.ts.mapis excluded by!**/*.map,!**/*.maplibs/uipack/src/validation/wrapper.d.ts.mapis excluded by!**/*.map,!**/*.map
📒 Files selected for processing (59)
eslint.config.mjslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/bundler/file-cache/hash-calculator.d.tslibs/uipack/src/bundler/file-cache/hash-calculator.tslibs/uipack/src/bundler/file-cache/storage/redis.tslibs/uipack/src/dependency/cdn-registry.d.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/dependency/import-map.d.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/dependency/import-parser.d.tslibs/uipack/src/dependency/index.d.tslibs/uipack/src/dependency/resolver.d.tslibs/uipack/src/dependency/resolver.tslibs/uipack/src/dependency/schemas.d.tslibs/uipack/src/dependency/template-loader.d.tslibs/uipack/src/dependency/template-processor.d.tslibs/uipack/src/dependency/types.d.tslibs/uipack/src/handlebars/expression-extractor.d.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/handlebars/helpers.d.tslibs/uipack/src/handlebars/index.d.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/renderers/cache.d.tslibs/uipack/src/renderers/html.renderer.d.tslibs/uipack/src/renderers/index.d.tslibs/uipack/src/renderers/registry.d.tslibs/uipack/src/renderers/registry.test.tslibs/uipack/src/renderers/registry.tslibs/uipack/src/renderers/types.d.tslibs/uipack/src/runtime/adapters/html.adapter.d.tslibs/uipack/src/runtime/adapters/index.d.tslibs/uipack/src/runtime/adapters/mdx.adapter.d.tslibs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/runtime/adapters/types.d.tslibs/uipack/src/runtime/csp.d.tslibs/uipack/src/runtime/index.d.tslibs/uipack/src/runtime/mcp-bridge.d.tslibs/uipack/src/runtime/mcp-bridge.tslibs/uipack/src/runtime/renderer-runtime.d.tslibs/uipack/src/runtime/renderer-runtime.tslibs/uipack/src/runtime/sanitizer.d.tslibs/uipack/src/runtime/types.d.tslibs/uipack/src/runtime/wrapper.d.tslibs/uipack/src/runtime/wrapper.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/types/index.d.tslibs/uipack/src/types/ui-config.d.tslibs/uipack/src/types/ui-runtime.d.tslibs/uipack/src/typings/type-fetcher.tslibs/uipack/src/utils/escape-html.d.tslibs/uipack/src/utils/index.d.tslibs/uipack/src/utils/safe-stringify.d.tslibs/uipack/src/validation/error-box.d.tslibs/uipack/src/validation/index.d.tslibs/uipack/src/validation/schema-paths.d.tslibs/uipack/src/validation/template-validator.d.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/validation/wrapper.d.ts
💤 Files with no reviewable changes (42)
- libs/uipack/src/types/index.d.ts
- libs/uipack/src/renderers/registry.ts
- libs/uipack/src/validation/schema-paths.d.ts
- libs/uipack/src/utils/escape-html.d.ts
- libs/uipack/src/runtime/adapters/html.adapter.d.ts
- libs/uipack/src/dependency/resolver.ts
- libs/uipack/src/utils/index.d.ts
- libs/uipack/src/validation/error-box.d.ts
- libs/uipack/src/runtime/adapters/mdx.adapter.d.ts
- libs/uipack/src/bundler/file-cache/hash-calculator.d.ts
- libs/uipack/src/dependency/cdn-registry.d.ts
- libs/uipack/src/renderers/cache.d.ts
- libs/uipack/src/validation/wrapper.d.ts
- libs/uipack/src/dependency/import-map.d.ts
- libs/uipack/src/types/ui-config.d.ts
- libs/uipack/src/renderers/html.renderer.d.ts
- libs/uipack/src/utils/safe-stringify.d.ts
- libs/uipack/src/dependency/import-parser.d.ts
- libs/uipack/src/runtime/renderer-runtime.d.ts
- libs/uipack/src/runtime/mcp-bridge.d.ts
- libs/uipack/src/runtime/types.d.ts
- libs/uipack/src/runtime/csp.d.ts
- libs/uipack/src/handlebars/index.d.ts
- libs/uipack/src/runtime/sanitizer.d.ts
- libs/uipack/src/renderers/index.d.ts
- libs/uipack/src/runtime/adapters/index.d.ts
- libs/uipack/src/handlebars/expression-extractor.d.ts
- libs/uipack/src/validation/index.d.ts
- libs/uipack/src/types/ui-runtime.d.ts
- libs/uipack/src/renderers/types.d.ts
- libs/uipack/src/runtime/index.d.ts
- libs/uipack/src/renderers/registry.d.ts
- libs/uipack/src/runtime/adapters/types.d.ts
- libs/uipack/src/dependency/template-processor.d.ts
- libs/uipack/src/dependency/resolver.d.ts
- libs/uipack/src/dependency/types.d.ts
- libs/uipack/src/validation/template-validator.d.ts
- libs/uipack/src/dependency/template-loader.d.ts
- libs/uipack/src/handlebars/helpers.d.ts
- libs/uipack/src/runtime/wrapper.d.ts
- libs/uipack/src/dependency/index.d.ts
- libs/uipack/src/dependency/schemas.d.ts
✅ Files skipped from review due to trivial changes (1)
- libs/uipack/src/runtime/mcp-bridge.ts
🚧 Files skipped from review as they are similar to previous changes (2)
- eslint.config.mjs
- libs/uipack/src/runtime/wrapper.ts
🧰 Additional context used
📓 Path-based instructions (9)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/runtime/renderer-runtime.tslibs/uipack/src/bundler/file-cache/hash-calculator.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/bundler/file-cache/storage/redis.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/typings/type-fetcher.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/runtime/renderer-runtime.tslibs/uipack/src/bundler/file-cache/hash-calculator.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/bundler/file-cache/storage/redis.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/typings/type-fetcher.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/runtime/renderer-runtime.tslibs/uipack/src/bundler/file-cache/hash-calculator.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/bundler/file-cache/storage/redis.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/typings/type-fetcher.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/uipack/src/renderers/registry.test.ts
libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Always escape user-provided content using escapeHtml() utility to prevent XSS
Files:
libs/uipack/src/renderers/registry.test.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/renderers/registry.test.ts
libs/uipack/src/{components,web-components,renderers}/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Test HTML escaping for user-provided content in component tests
Files:
libs/uipack/src/renderers/registry.test.ts
libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use Handlebars template engine for dynamic template rendering with variable substitution
Files:
libs/uipack/src/handlebars/index.tslibs/uipack/src/handlebars/expression-extractor.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/cdn.ts
🧠 Learnings (26)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/runtime/renderer-runtime.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/runtime/adapters/mdx.adapter.tslibs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/runtime/renderer-runtime.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/uipack/src/dependency/cdn-registry.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/renderers/registry.test.tslibs/uipack/src/runtime/renderer-runtime.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/uipack/src/renderers/registry.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/typings/type-fetcher.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/renderers/registry.test.tslibs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/handlebars/expression-extractor.tslibs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/bundler/file-cache/hash-calculator.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/uipack/src/tool-template/builder.tslibs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/theme/cdn.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
Applied to files:
libs/uipack/src/tool-template/builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/uipack/src/tool-template/builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Applied to files:
libs/uipack/src/tool-template/builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/uipack/src/tool-template/builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/uipack/src/tool-template/builder.tslibs/uipack/src/bundler/file-cache/component-builder.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/uipack/src/tool-template/builder.tslibs/uipack/src/bundler/file-cache/hash-calculator.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Applied to files:
libs/uipack/src/tool-template/builder.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/uipack/src/handlebars/index.tslibs/uipack/src/dependency/import-map.tslibs/uipack/src/bundler/file-cache/component-builder.tslibs/uipack/src/validation/template-validator.tslibs/uipack/src/typings/type-fetcher.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Use `changeScope` property instead of `scope` in change events to avoid confusion with Scope class
Applied to files:
libs/uipack/src/handlebars/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.adapter.ts : Implement client-side hydration for interactive widgets using ReactRendererAdapter
Applied to files:
libs/uipack/src/runtime/renderer-runtime.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.ts : Validate all component options using validateOptions() helper with the component's Zod schema
Applied to files:
libs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.schema.ts : Support HTMX attributes in component schemas (get, post, target, swap) with `.strict()` validation
Applied to files:
libs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/uipack/src/validation/template-validator.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/common/records/**/*.ts : Centralize record types in common/records directory and import from there instead of module-specific files
Applied to files:
libs/uipack/src/typings/type-fetcher.ts
🧬 Code graph analysis (2)
libs/uipack/src/dependency/cdn-registry.ts (1)
libs/uipack/src/index.ts (1)
CDNPlatformType(200-200)
libs/uipack/src/renderers/registry.test.ts (1)
libs/sdk/src/common/metadata/tool-ui.metadata.ts (1)
TemplateContext(16-16)
🪛 ast-grep (0.40.3)
libs/uipack/src/typings/type-fetcher.ts
[warning] 653-653: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(/${escapeRegExp(packageName)}@[^/]+(/.*)?$)
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: E2E Tests (demo-e2e-ui)
- GitHub Check: E2E Tests (demo-e2e-notifications)
- GitHub Check: Unit Tests
🔇 Additional comments (17)
libs/uipack/src/tool-template/builder.ts (1)
13-13: LGTM! Clean removal of unused type import.The
UIContentSecurityPolicytype is not referenced anywhere in this file. Removing it reduces the import surface and maintains cleaner code.libs/uipack/src/theme/cdn.ts (3)
100-103: LGTM: Efficient cache lookup.The change from
has()+get()to a singleget()with truthy check eliminates redundant Map lookups and improves code clarity.
248-286: LGTM: Streamlined inline script handling.The refactor from
isScriptCached()+getCachedScript()to a singlegetCachedScript()call with truthy check is applied consistently across all four script types (Tailwind, HTMX, Alpine, Lucide). This eliminates redundant Map lookups while preserving the warning behavior for uncached scripts.
375-413: LGTM: Theme-aware inline script optimization.The same optimization pattern from
buildCdnScriptsis correctly applied to the theme-aware version, eliminating duplicate Map lookups for all four script types while preserving warning messages that correctly referencefetchAndCacheScriptsFromTheme().libs/uipack/src/bundler/file-cache/storage/redis.ts (1)
11-11: LGTM! Correct removal of unused type import.The
CacheEntryMetadatatype is not directly used in this file—all metadata access is done through theCacheEntry.metadata.*pattern throughout the implementation. This cleanup improves maintainability by removing the unused import.libs/uipack/src/runtime/renderer-runtime.ts (1)
340-356: LGTM! Excellent refactoring that improves safety and efficiency.The changes eliminate non-null assertions and reduce cache lookups from two operations (has + get) to one (get + null check). This is both safer and more efficient while maintaining identical behavior.
The adapter caching logic correctly handles:
- Returning cached adapters for the original type
- Auto-detecting UI types when type is 'auto'
- Returning cached adapters for resolved types
- Loading and caching under both original and resolved types when needed
libs/uipack/src/handlebars/index.ts (1)
40-40: LGTM! Unused type import removed.The
TemplateContexttype was not referenced anywhere in this file, so removing it from the import is appropriate cleanup.libs/uipack/src/validation/template-validator.ts (1)
11-12: LGTM! Import consolidation is appropriate.The consolidated imports remove unused symbols while retaining all imports that are actually used throughout the file.
libs/uipack/src/bundler/file-cache/hash-calculator.ts (1)
183-183: LGTM! Externals correctly excluded from hash calculation.The underscore prefix (
_externals) correctly signals that this parameter is intentionally unused in the hash calculation. This is the expected behavior since external packages are loaded from CDN and versioned separately, so they shouldn't affect the component's content hash. The hash correctly includes only local files, bundle options, and dependency configurations.libs/uipack/src/bundler/file-cache/component-builder.ts (1)
12-12: LGTM! Cleanup of unused imports.The removal of
dirnameandgenerateBuildIdimports is correct. The file usesrandomUUID()(line 285) instead ofgenerateBuildId()for build ID generation, and no directory path manipulation requiringdirnameis present in the visible code.Also applies to: 23-23
libs/uipack/src/renderers/registry.test.ts (1)
237-238: LGTM: Improved type safety.The change from
{}toRecord<string, never>is a good improvement.Record<string, never>explicitly represents an object with no properties, while{}is a top type that matches almost any non-nullish value. This provides better type safety and clarity.libs/uipack/src/dependency/cdn-registry.ts (1)
704-708: The_platformparameter with the underscore prefix is correct—it intentionally indicates an unused parameter. All call sites in the codebase (resolver.ts:151and test files) use positional arguments, not named parameters, so the concern about breaking named parameter usage is not applicable to the current code.Likely an incorrect or invalid review comment.
libs/uipack/src/typings/type-fetcher.ts (5)
19-19: LGTM! Clean integration of per-file metadata.The new
TypeFileimport and the integration ofbuildTypeFiles()at lines 259-260 correctly extends the type fetcher with per-file metadata while maintaining backwards compatibility via the existingcontentfield.Also applies to: 259-271
614-618: LGTM! Correct relative path calculation.The logic correctly calculates the relative import path based on subpath depth. The examples in the JSDoc are accurate.
673-675: LGTM! Standard regex escaping implementation.The implementation correctly escapes all special regex metacharacters.
564-564: Public API additions may need documentation updates.Three new functions are exported as part of the public API:
buildTypeFiles()getRelativeImportPath()urlToVirtualPath()Since this file is in
libs/uipack(a publishable SDK library), these API additions should be documented. Please verify that documentation updates are included or planned for this PR.Based on coding guidelines: libs/** contains publishable SDK libraries that should have matching docs updates for public API changes.
Also applies to: 614-614, 632-632
564-602: The alias generation logic is sound. The check at line 586 (aliasExists) prevents creating a synthetic alias if actual subpath types are fetched; in that case, the real fetched types are used. The alias is only synthesized as a fallback when subpath resolution fails and root types are used, which is intentional and acceptable behavior for typical packages.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
♻️ Duplicate comments (1)
libs/ui/src/bundler/bundler.ts (1)
56-56: Broken import path still present.This import from
@frontmcp/uipack/buildwas flagged in a previous review as non-existent. The functionbuildCDNScriptTagand constantCLOUDFLARE_CDNshould be imported from@frontmcp/uipack/themeinstead.
🧹 Nitpick comments (3)
libs/ui/src/bundler/bundler.ts (3)
727-742: Platform mapping has unreachable default case.The switch statement covers all
ConcretePlatformvalues exhaustively, making thedefaultcase unreachable. While harmless, TypeScript's exhaustiveness checking would catch future additions.🔎 Consider using exhaustive switch pattern
private mapTargetPlatformToAIPlatform(platform: ConcretePlatform): AIPlatformType { switch (platform) { case 'openai': return 'openai'; case 'claude': return 'claude'; case 'cursor': return 'cursor'; case 'ext-apps': return 'ext-apps'; case 'generic': return 'generic-mcp'; - default: - return 'generic-mcp'; } + // TypeScript exhaustiveness check + const _exhaustive: never = platform; + return _exhaustive; }
1376-1390: Tailwind CDN handling has commented-out code.Lines 1380-1386 contain commented-out code for custom Tailwind URL handling. Either remove the dead code or implement the custom URL support.
🔎 Suggested cleanup
parts.push(buildCDNScriptTag(CLOUDFLARE_CDN.tailwindCss)); - // // Tailwind CSS (same for all platforms - CSS file from cdnjs) - // const tailwindConfig = opts.externals.tailwind ?? 'cdn'; - // if (tailwindConfig === 'cdn') { - // } else if (tailwindConfig !== 'inline' && tailwindConfig) { - // // Custom URL - // parts.push(`<link rel="stylesheet" href="${tailwindConfig}">`); - // }
1812-1817: Complex boolean expression in template literal.Line 1812 embeds a complex boolean expression directly in the template. This is harder to read and debug.
🔎 Extract to named variable for clarity
+ const shouldShowLoading = !includeInitialData && window.__mcpToolOutput === null && !window.__mcpHybridError; // Initialize FrontMCP context with appropriate loading/error state if (window.__frontmcp && window.__frontmcp.setContext) { window.__frontmcp.setContext({ toolName: window.__mcpToolName, toolInput: window.__mcpToolInput, toolOutput: window.__mcpToolOutput, structuredContent: window.__mcpStructuredContent, - loading: ${!includeInitialData} && window.__mcpToolOutput === null && !window.__mcpHybridError, + loading: shouldShowLoading, error: window.__mcpHybridError, }); }Note: This requires restructuring how the IIFE is built to inject the computed value.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
libs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.tslibs/ui/src/layouts/base.tslibs/ui/src/pages/error.tslibs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.ts
💤 Files with no reviewable changes (1)
- libs/ui/src/pages/error.ts
🚧 Files skipped from review as they are similar to previous changes (2)
- libs/uipack/src/theme/platforms.ts
- libs/ui/src/layouts/base.ts
🧰 Additional context used
📓 Path-based instructions (8)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/uipack/src/theme/platforms.test.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/platforms.test.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/theme/platforms.test.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/theme/platforms.test.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
🧠 Learnings (27)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bridge/core/bridge-factory.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/platforms.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.test.ts : Test invalid inputs for every component to validate error handling
Applied to files:
libs/uipack/src/theme/platforms.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/platforms.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Use `getCapabilities()` method for dynamic capability exposure instead of hardcoding capabilities
Applied to files:
libs/ui/src/bridge/core/bridge-factory.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Applied to files:
libs/ui/src/bridge/core/bridge-factory.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Applied to files:
libs/ui/src/bridge/core/bridge-factory.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
libs/ui/src/bridge/core/bridge-factory.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/ui/src/bundler/bundler.tslibs/ui/src/bundler/types.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Avoid non-null assertions (`!`) - use proper error handling and throw specific errors instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Use strict TypeScript mode with no `any` types without strong justification - use `unknown` instead for generic type defaults
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/ui/src/bundler/bundler.ts
🧬 Code graph analysis (2)
libs/uipack/src/theme/platforms.test.ts (1)
libs/uipack/src/theme/platforms.ts (2)
CLAUDE_PLATFORM(103-117)GEMINI_PLATFORM(123-134)
libs/ui/src/bundler/bundler.ts (5)
libs/ui/src/bundler/types.ts (14)
HYBRID_DATA_PLACEHOLDER(29-29)HYBRID_INPUT_PLACEHOLDER(35-35)MultiPlatformBuildOptions(1187-1193)MultiPlatformBuildResult(1217-1251)StaticHTMLOptions(801-1001)ALL_PLATFORMS(757-763)ConcretePlatform(751-751)PlatformBuildResult(1199-1211)getCdnTypeForPlatform(1109-1112)DEFAULT_STATIC_HTML_OPTIONS(1117-1137)StaticHTMLExternalConfig(772-796)BuildMode(23-23)DynamicModeOptions(40-54)HybridModeOptions(59-71)libs/ui/src/bundler/index.ts (14)
HYBRID_DATA_PLACEHOLDER(93-93)HYBRID_INPUT_PLACEHOLDER(94-94)MultiPlatformBuildOptions(72-72)MultiPlatformBuildResult(74-74)StaticHTMLOptions(69-69)ALL_PLATFORMS(91-91)ConcretePlatform(67-67)PlatformBuildResult(73-73)getCdnTypeForPlatform(89-89)DEFAULT_STATIC_HTML_OPTIONS(87-87)StaticHTMLExternalConfig(68-68)BuildMode(76-76)DynamicModeOptions(77-77)HybridModeOptions(78-78)libs/ui/src/universal/types.ts (1)
ContentType(21-21)libs/uipack/src/adapters/index.ts (1)
buildUIMeta(19-19)libs/uipack/src/adapters/platform-meta.ts (1)
buildUIMeta(189-251)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (11)
libs/ui/src/bundler/types.ts (4)
9-10: LGTM - Theme integration via @frontmcp/uipack/theme.The import aligns with the coding guideline to use theme configuration from uipack rather than hard-coding CDN URLs. Based on learnings, this follows the established pattern.
15-72: Build mode types are well-structured with clear documentation.The
BuildModetype and associated interfaces (DynamicModeOptions,HybridModeOptions) provide a clean API for the three modes. The placeholder constants are appropriately namespaced (__FRONTMCP_*) to avoid collisions.
742-763: Platform taxonomy extension looks correct.The
ConcretePlatformtype properly excludes'auto'for use in multi-platform builds.ALL_PLATFORMSusesreadonlywithas constfor proper type inference.
1179-1251: Multi-platform build types are well-designed.The
MultiPlatformBuildResult.platformscorrectly usesPartial<Record<ConcretePlatform, PlatformBuildResult>>to reflect that only requested platforms are included in the result. Themetafield inPlatformBuildResultprovides a clean integration point for MCP response metadata.libs/ui/src/bundler/bundler.ts (4)
503-570: Multi-platform bundling implementation looks solid.The
bundleToStaticHTMLAllmethod correctly:
- Transpiles once and reuses across platforms
- Handles both universal and standard modes
- Returns
Partial<Record<...>>matching the type definitionThe
cachedfield fallback at line 568 handles the case wherebundleResultis null (for non-React universal content).
646-650: Non-null guard added - addresses past review feedback.The explicit check at lines 648-650 throws a clear error when
transpiledCodeis null in standard mode, replacing the previous non-null assertion pattern.
1669-1678: Data injection dispatch is clean and extensible.The switch-based dispatch to mode-specific builders provides a clear extension point for future build modes.
1927-1932: Unused_inputparameter in buildHybridDataScript.The
_inputparameter is prefixed with underscore indicating it's intentionally unused, but hybrid mode should likely still support input injection via the placeholder. The input placeholder logic at lines 1942 and 1948 shows it is being used.Verify that the underscore prefix is intentional. If input should be baked in for hybrid mode rather than replaced at runtime, the current approach is correct. Otherwise, consider using
inputin the static portion or updating the parameter name.libs/ui/src/bridge/core/bridge-factory.ts (3)
367-376: Clean refactor: _ensureInitialized now returns the adapter.This pattern eliminates the need for callers to access
this._adapterafter validation, reducing the risk of accessing an undefined adapter. The JSDoc update at line 369 clearly documents the new return behavior.
222-273: Data access methods consistently use returned adapter.All data access methods (
getTheme,getDisplayMode,getToolInput,getToolOutput,getStructuredContent,getWidgetState,getHostContext) now follow the same pattern: get the adapter from_ensureInitialized()and delegate to it. This is cleaner and more type-safe than the previous approach.
284-361: Action and event methods follow the same improved pattern.The consistency across all bridge methods (
callTool,sendMessage,openLink, etc.) makes the code easier to maintain and reason about.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
♻️ Duplicate comments (3)
libs/ui/src/bundler/bundler.ts (1)
56-56: Remove broken import path (duplicate issue).The import from
@frontmcp/uipack/buildwas flagged in previous reviews as non-existent. The correct import should be from@frontmcp/uipack/themeas documented in learnings and previous review comments.Based on learnings, use
buildCdnScriptsFromTheme()from@frontmcp/uipack/themefor platform-aware CDN script handling.libs/uipack/src/theme/platforms.test.ts (1)
45-46: Bug: Wrong platform constant (duplicate issue).Line 45 asserts
CLAUDE_PLATFORM.scriptStrategyinstead ofGEMINI_PLATFORM.scriptStrategy. This is the same copy-paste error flagged in previous reviews.🔎 Fix the assertion
- expect(CLAUDE_PLATFORM.scriptStrategy).toBe('cdn'); + expect(GEMINI_PLATFORM.scriptStrategy).toBe('inline');libs/ui/src/universal/cached-runtime.ts (1)
1176-1194: Reliance on undocumented OpenAI Canvas API.This concern was raised in a previous review. The code defensively checks for API existence before use, which is good practice. The subscription logic is otherwise well-structured with proper DOMContentLoaded handling.
🧹 Nitpick comments (3)
libs/ui/src/universal/cached-runtime.ts (3)
215-241: Consider removing event listener after bridge initialization.The implementation is defensive with proper null checks. However, the
mcp:bridge-readyevent listener is never removed afterinitFromBridgeexecutes. This is a minor memory consideration since the event typically fires once, but cleanup would be cleaner.🔎 Optional cleanup improvement
// Initialize from bridge when ready if (window.mcpBridge) { initFromBridge(); } else { // Wait for bridge to be ready - window.addEventListener('mcp:bridge-ready', initFromBridge); + window.addEventListener('mcp:bridge-ready', function onBridgeReady() { + window.removeEventListener('mcp:bridge-ready', onBridgeReady); + initFromBridge(); + }); }
1202-1267: Consider extracting shared placeholder parsing logic.The
buildHybridDataInjectionCodeandbuildDynamicWithPlaceholdersCodefunctions share nearly identical placeholder parsing logic. While functional, this duplication could be reduced.🔎 Example: Extract shared parsing template
function buildPlaceholderParsingBlock( outputPlaceholder: string, inputPlaceholder: string, errorOnUnreplaced: boolean, ): string { return ` var __outputRaw = "${outputPlaceholder}"; var __inputRaw = "${inputPlaceholder}"; var __output = null; var __input = null; var __error = null; var __outputNotReplaced = false; if (typeof __outputRaw === 'string' && __outputRaw !== "${outputPlaceholder}") { try { __output = JSON.parse(__outputRaw); } catch (e) { console.warn('[FrontMCP] Failed to parse output:', e); __error = 'Failed to parse output data'; } } else if (__outputRaw === "${outputPlaceholder}") { __outputNotReplaced = true; } if (typeof __inputRaw === 'string' && __inputRaw !== "${inputPlaceholder}") { try { __input = JSON.parse(__inputRaw); } catch (e) { console.warn('[FrontMCP] Failed to parse input:', e); } } if (__outputNotReplaced${errorOnUnreplaced ? '' : ' && __includeInitialData'}) { __error = 'No data provided. The output placeholder was not replaced.'; }`; }
890-908: DuplicateBuildModetype definition should be consolidated.This
BuildModetype is defined in bothlibs/ui/src/bundler/types.ts(line 23) andlibs/ui/src/universal/cached-runtime.ts(line 894). The inline comment claiming this is "imported inline to avoid circular deps" is misleading—there are no actual circular imports detected.Consider importing from
bundler/types.tsinstead of redefining:export type { BuildMode } from '../bundler/types';Alternatively, if bundler/types should remain internal, move the canonical definition to a shared types location that both modules can import from.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (15)
docs/draft/docs/guides/ui-library.mdxdocs/draft/docs/ui/api-reference/theme.mdxdocs/live/docs/guides/ui-library.mdxdocs/live/docs/ui/api-reference/theme.mdxdocs/live/docs/v/0.5/guides/ui-library.mdxdocs/live/docs/v/0.5/ui/advanced/platforms.mdxdocs/live/docs/v/0.5/ui/api-reference/theme.mdxlibs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.tslibs/uipack/src/base-template/default-base-template.tslibs/uipack/src/theme/index.test.tslibs/uipack/src/theme/index.tslibs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/types.ts
💤 Files with no reviewable changes (7)
- libs/uipack/src/theme/index.ts
- libs/uipack/src/base-template/default-base-template.ts
- docs/live/docs/v/0.5/ui/api-reference/theme.mdx
- docs/draft/docs/ui/api-reference/theme.mdx
- docs/live/docs/v/0.5/ui/advanced/platforms.mdx
- libs/uipack/src/theme/index.test.ts
- docs/live/docs/ui/api-reference/theme.mdx
✅ Files skipped from review due to trivial changes (1)
- docs/draft/docs/guides/ui-library.mdx
🚧 Files skipped from review as they are similar to previous changes (1)
- libs/uipack/src/typings/types.ts
🧰 Additional context used
📓 Path-based instructions (10)
docs/**
⚙️ CodeRabbit configuration file
docs/**: Repository documentation for the SDK, using MDX and hosted by Mintlify. See more specific rules for: - docs/docs/** (latest rendered docs, automation-only) - docs/v/** (archived versions, read-only) - docs/draft/docs/** (human-editable drafts) - docs/blogs/** (blogs, human edited) - docs/docs.json (Mintlify navigation)
Files:
docs/live/docs/v/0.5/guides/ui-library.mdxdocs/live/docs/guides/ui-library.mdx
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/universal/cached-runtime.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/uipack/src/theme/platforms.test.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/theme/platforms.test.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/universal/cached-runtime.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
libs/ui/src/universal/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Files:
libs/ui/src/universal/cached-runtime.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/bundler.ts
🧠 Learnings (26)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
docs/live/docs/v/0.5/guides/ui-library.mdxlibs/uipack/src/theme/platforms.test.tsdocs/live/docs/guides/ui-library.mdxlibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
docs/live/docs/v/0.5/guides/ui-library.mdxlibs/uipack/src/theme/platforms.test.tsdocs/live/docs/guides/ui-library.mdxlibs/ui/src/universal/cached-runtime.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
docs/live/docs/v/0.5/guides/ui-library.mdxlibs/uipack/src/theme/platforms.test.tsdocs/live/docs/guides/ui-library.mdxlibs/ui/src/universal/cached-runtime.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/platforms.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/*.ts : Use `getCapabilities()` method for dynamic capability exposure instead of hardcoding capabilities
Applied to files:
libs/uipack/src/theme/platforms.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Applied to files:
libs/ui/src/universal/cached-runtime.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Applied to files:
libs/ui/src/universal/cached-runtime.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
libs/ui/src/universal/cached-runtime.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Avoid non-null assertions (`!`) - use proper error handling and throw specific errors instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Use strict TypeScript mode with no `any` types without strong justification - use `unknown` instead for generic type defaults
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Ensure all builds complete without TypeScript warnings and 100% test pass rate is required
Applied to files:
libs/ui/src/bundler/bundler.ts
🧬 Code graph analysis (3)
libs/uipack/src/theme/platforms.test.ts (1)
libs/uipack/src/theme/platforms.ts (2)
CLAUDE_PLATFORM(103-117)GEMINI_PLATFORM(123-134)
libs/ui/src/universal/cached-runtime.ts (1)
libs/ui/src/bundler/types.ts (1)
BuildMode(23-23)
libs/uipack/src/theme/platforms.ts (1)
libs/uipack/src/theme/index.ts (1)
PlatformId(36-36)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (14)
libs/ui/src/bundler/bundler.ts (2)
1366-1424: LGTM! Theme integration follows best practices.The theme CSS variable injection is well-structured:
- Uses
buildThemeCssfrom the theme package- Correctly orders CSS: Tailwind → theme variables → custom CSS
- Provides sensible DEFAULT_THEME fallback
- Injects variables at
:rootscope for global availabilityBased on learnings, this correctly uses theme.cdn configuration instead of hard-coding CDN URLs.
503-570: Verify type consistency forMultiPlatformBuildResult.platformsfield.The
platformResultsvariable is typed asPartial<Record<ConcretePlatform, PlatformBuildResult>>(line 543), reflecting that only requested platforms are built and some platforms may be absent. Ensure theMultiPlatformBuildResultinterface definition also types itsplatformsfield asPartial<Record<ConcretePlatform, PlatformBuildResult>>to maintain type safety at the return statement (lines 561-565).docs/live/docs/v/0.5/guides/ui-library.mdx (1)
95-95: LGTM! Documentation updated to reflect ngrok removal.The guidance now correctly lists platforms that support network-loaded scripts (OpenAI, Gemini), aligning with the PR's removal of ngrok platform support.
docs/live/docs/guides/ui-library.mdx (1)
99-99: LGTM! Consistent documentation update.Matches the change in the versioned docs, correctly removing ngrok from the platform list.
libs/uipack/src/theme/platforms.ts (3)
21-21: LGTM! Platform type updated to remove ngrok.The
PlatformIdunion type correctly removes 'ngrok' support, aligning with the PR's objective to remove ngrok platform references.
103-117: LGTM! Claude platform configuration updated.The changes make sense:
networkMode: 'limited'allows specific CDN access instead of complete blockingscriptStrategy: 'cdn'can load from allowed domains- Maintains artifacts mode constraints (no HTMX due to API call restrictions)
123-134: LGTM! Gemini platform configuration updated.The
networkMode: 'limited'change is appropriate for Gemini's capabilities, allowing constrained network access while maintaining inline script strategy for reliability.libs/ui/src/universal/cached-runtime.ts (7)
15-15: LGTM!Import correctly sources MCP Bridge script from
@frontmcp/uipack/runtime, following the coding guideline to use@frontmcp/uipackfor React-free utilities.
126-134: LGTM!The
includeBridgeoption is well-documented with clear JSDoc explaining its purpose, platform-specific behavior, and default values for different build modes.
180-191: LGTM!The
updateOutputandupdateInputmethods provide a clean API for dynamic mode updates while maintaining backward compatibility by mirroring values to global window variables.
744-751: LGTM!Correct initialization order: MCP Bridge script is added before the store runtime, ensuring
window.mcpBridgeis available wheninitFromBridge()executes during store initialization.
819-833: LGTM!The conservative minification approach is significantly safer than aggressive comment stripping. The strategy correctly avoids corrupting URL strings (like
http://) by only removing full-line comments rather than inline//patterns.
914-964: LGTM!Clean mode-switching implementation with proper defaults (
staticmode,esmCDN type) maintaining backward compatibility. The delegation pattern keeps each build mode's logic isolated.
1060-1126: LGTM!The placeholder-based dynamic injection for non-OpenAI platforms is well-structured with proper error handling when placeholders aren't replaced. The
includeInitialDataoption provides flexibility for different use cases.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
libs/uipack/src/typings/types.ts (1)
463-478: Fix inconsistency between DEFAULT_TYPE_FETCHER_OPTIONS and TypeFetcher constructor fallback.The constant sets
maxDepth: 4, butTypeFetcherconstructor at line 108 defaults to2when options are omitted (this.maxDepth = options.maxDepth ?? 2). This creates inconsistent behavior: users relying onDEFAULT_TYPE_FETCHER_OPTIONSwill get depth 4, but users creatingnew TypeFetcher()without options will get depth 2.Additionally, update JSDoc documentation to reflect the actual default:
TypeFetcherOptionsinterface (line 384): change@default 2to@default 4TypeFetchBatchRequestinterface (line 199): change@default 2to@default 4- Constructor example in
type-fetcher.ts(line 81): change examplemaxDepth: 2tomaxDepth: 4Add a CHANGELOG entry documenting this breaking behavior change, as it affects type resolution depth for existing users. Per SDK library guidelines, public API behavior changes require documentation updates.
libs/uipack/src/theme/platforms.ts (1)
103-117: Test/implementation mismatch:supportsWidgetsisfalsehere but test expectstrue.Line 106 sets
supportsWidgets: false, butplatforms.test.tsline 30 expectstrue. One of these needs to be corrected:
- If Claude Artifacts truly support widgets, change line 106 to
true- If they don't, update the test to expect
falseThe comment on test line 30 says "Claude Artifacts support widgets" which contradicts this implementation.
🔎 Likely fix - update implementation to match test
If Claude Artifacts do support widgets (per the test comment):
export const CLAUDE_PLATFORM: PlatformCapabilities = { id: 'claude', name: 'Claude (Artifacts)', - supportsWidgets: false, + supportsWidgets: true, supportsTailwind: true,Or update the test if widgets are not supported:
- expect(CLAUDE_PLATFORM.supportsWidgets).toBe(true); // Claude Artifacts support widgets + expect(CLAUDE_PLATFORM.supportsWidgets).toBe(false); // Claude Artifacts don't support widgets
♻️ Duplicate comments (2)
libs/ui/src/universal/cached-runtime.ts (1)
1114-1132: Reliance on undocumentedwindow.openai.canvas.onToolResultAPI.This code subscribes to
window.openai.canvas.onToolResultwhich, as noted in a previous review, is not documented in public OpenAI Canvas documentation. The defensive check for API existence is good, but this remains a fragility risk.libs/ui/src/bundler/bundler.ts (1)
1849-1891: Reliance on undocumentedwindow.openai.canvas.onToolResultAPI.Similar to
cached-runtime.ts, this code subscribes to an undocumented OpenAI Canvas API. The defensive existence check is present, but the API stability concern remains.
🧹 Nitpick comments (4)
libs/ui/src/universal/cached-runtime.ts (1)
828-846: Duplicate type definitions - consider single source of truth.
BuildModeandDataInjectionOptionsare also defined inlibs/ui/src/bundler/types.ts(line 22). Having duplicate type definitions requires manual synchronization and risks divergence.Consider importing from
types.tsinstead or consolidating these definitions in one location. The comment mentions avoiding circular deps, but ashared-types.tsfile could resolve this.🔎 Proposed approach
-// ============================================ -// Build Mode Types (imported inline to avoid circular deps) -// ============================================ - -export type BuildMode = 'static' | 'dynamic' | 'hybrid'; - -export interface DataInjectionOptions { - buildMode?: BuildMode; - /** CDN type - needed for platform-aware dynamic mode */ - cdnType?: 'esm' | 'umd'; - dynamicOptions?: { - includeInitialData?: boolean; - subscribeToUpdates?: boolean; - }; - hybridOptions?: { - placeholder?: string; - inputPlaceholder?: string; - }; -} +// Re-export from types to maintain single source of truth +export type { BuildMode, DataInjectionOptions } from '../bundler/types';If circular dependency exists, extract shared types to a dedicated
shared-types.tsfile that both modules can import from.libs/ui/src/bundler/browser-components.ts (2)
86-99: Component props typed asany- consider stronger typing.Lines 86, 141, 190, and 252 use
props: anyfor component functions. Per coding guidelines: "Avoid usinganytype without justification in TypeScript code."While this is generated/transpiled code where full typing is complex, consider using a minimal interface or
Record<string, unknown>for better type safety.🔎 Minimal typing example
interface CardProps { title?: string; subtitle?: string; // ... other known props [key: string]: unknown; } export function Card(props: CardProps) { ... }Also applies to: 141-155, 190-201, 252-262
357-391: Remove unused_transpileWithEsbuildfunction.This function is marked as "not currently used" in the comment at line 357-358. Per coding guidelines, unused/dead code should be removed to improve maintainability.
If it's intended as a fallback option, consider moving it to a separate utility file or adding a clear
@deprecatedor@internalJSDoc tag explaining when it would be used.libs/ui/src/bundler/bundler.ts (1)
1680-1686: Extract duplicatesafeJsonhelper to reduce code repetition.The
safeJsonfunction is identically defined in four locations (lines 1680, 1737, 1820, 1924). Extract it as a private class method or module-level utility.🔎 Proposed extraction
Add near the top of the class:
/** * Safely serialize value to JSON, returning 'null' on error. */ private safeJson(value: unknown): string { try { return JSON.stringify(value); } catch { return 'null'; } }Then replace the local definitions with
this.safeJson(...)calls.Also applies to: 1737-1743, 1820-1826, 1924-1930
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (3)
libs/uipack/src/build/hybrid-data.tsis excluded by!**/build/**libs/uipack/src/build/index.tsis excluded by!**/build/**libs/uipack/src/build/ui-components-browser.tsis excluded by!**/build/**
📒 Files selected for processing (7)
libs/ui/src/bundler/browser-components.tslibs/ui/src/bundler/bundler.tslibs/ui/src/universal/cached-runtime.tslibs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/__tests__/type-fetcher.test.tslibs/uipack/src/typings/types.ts
🧰 Additional context used
📓 Path-based instructions (9)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/browser-components.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/types.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/types.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/browser-components.tslibs/uipack/src/theme/platforms.tslibs/uipack/src/typings/types.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
libs/ui/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Do not import React-free utilities from @frontmcp/ui; use @frontmcp/uipack instead
Files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
libs/ui/src/bundler/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/bundler/bundler.ts
libs/ui/src/universal/**/*.{ts,tsx}
📄 CodeRabbit inference engine (libs/ui/CLAUDE.md)
Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Files:
libs/ui/src/universal/cached-runtime.ts
🧠 Learnings (33)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/browser-components.tslibs/uipack/src/theme/platforms.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/theme/platforms.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/browser-components.tslibs/uipack/src/typings/types.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/uipack/src/theme/platforms.test.tslibs/ui/src/bundler/browser-components.tslibs/uipack/src/typings/types.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/uipack/src/theme/platforms.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Use React 18/19 with TypeScript for all components in frontmcp/ui
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Ensure SSR support via react-dom/server for React components
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Include SSR tests to verify server-side rendering output for React components
Applied to files:
libs/ui/src/bundler/browser-components.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
libs/uipack/src/theme/platforms.tslibs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Avoid using `any` type without justification in TypeScript code
Applied to files:
libs/uipack/src/typings/types.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/typings/types.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/common/records/**/*.ts : Centralize record types in common/records directory and import from there instead of module-specific files
Applied to files:
libs/uipack/src/typings/types.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Use MCP bridge hooks (useMcpBridge, useCallTool, useToolInput, useToolOutput) for tool communication in components
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/hooks/**/*.{ts,tsx} : Handle loading and error states in MCP bridge hooks (useMcpBridge, useCallTool, etc.)
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/ui/src/universal/cached-runtime.tslibs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Avoid non-null assertions (`!`) - use proper error handling and throw specific errors instead
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers,utils}/**/*.ts : Always escape user-provided content using escapeHtml() utility to prevent XSS
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.{ts,tsx} : Every component must have a Zod schema with `.strict()` mode to reject unknown properties
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.ts : Use strict TypeScript mode with no `any` types without strong justification - use `unknown` instead for generic type defaults
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to **/*.test.{ts,tsx} : Test all code paths including error cases and constructor validation
Applied to files:
libs/ui/src/bundler/bundler.tslibs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/react/**/*.{ts,tsx} : Provide TypeScript types for all component props without using 'any' type without justification
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Ensure all builds complete without TypeScript warnings and 100% test pass rate is required
Applied to files:
libs/ui/src/bundler/bundler.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/typings/__tests__/type-fetcher.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Zero React dependency constraint - this is the React-free core package
Applied to files:
libs/uipack/src/typings/__tests__/type-fetcher.test.ts
🧬 Code graph analysis (3)
libs/ui/src/universal/cached-runtime.ts (1)
libs/ui/src/bundler/types.ts (1)
BuildMode(23-23)
libs/ui/src/bundler/bundler.ts (6)
libs/ui/src/bundler/types.ts (13)
HYBRID_DATA_PLACEHOLDER(29-29)HYBRID_INPUT_PLACEHOLDER(35-35)MultiPlatformBuildOptions(1187-1193)MultiPlatformBuildResult(1217-1251)StaticHTMLOptions(801-1001)ALL_PLATFORMS(757-763)ConcretePlatform(751-751)PlatformBuildResult(1199-1211)getCdnTypeForPlatform(1109-1112)DEFAULT_STATIC_HTML_OPTIONS(1117-1137)BuildMode(23-23)DynamicModeOptions(40-54)HybridModeOptions(59-71)libs/ui/src/bundler/index.ts (13)
HYBRID_DATA_PLACEHOLDER(93-93)HYBRID_INPUT_PLACEHOLDER(94-94)MultiPlatformBuildOptions(72-72)MultiPlatformBuildResult(74-74)StaticHTMLOptions(69-69)ALL_PLATFORMS(91-91)ConcretePlatform(67-67)PlatformBuildResult(73-73)getCdnTypeForPlatform(89-89)DEFAULT_STATIC_HTML_OPTIONS(87-87)BuildMode(76-76)DynamicModeOptions(77-77)HybridModeOptions(78-78)libs/ui/src/universal/types.ts (1)
ContentType(21-21)libs/uipack/src/adapters/platform-meta.ts (2)
buildUIMeta(189-251)AIPlatformType(24-33)libs/uipack/src/theme/index.ts (3)
ThemeConfig(85-85)DEFAULT_THEME(94-94)buildThemeCss(89-89)libs/ui/src/bundler/browser-components.ts (1)
getBrowserComponents(460-485)
libs/uipack/src/typings/__tests__/type-fetcher.test.ts (3)
libs/uipack/src/typings/index.ts (8)
getRelativeImportPath(159-159)urlToVirtualPath(160-160)buildTypeFiles(158-158)MemoryTypeCache(134-134)TYPE_CACHE_PREFIX(64-64)TypeFetcher(156-156)DEFAULT_ALLOWED_PACKAGES(66-66)DEFAULT_TYPE_FETCHER_OPTIONS(63-63)libs/uipack/src/typings/type-fetcher.ts (4)
getRelativeImportPath(724-728)urlToVirtualPath(742-778)buildTypeFiles(674-712)TypeFetcher(96-562)libs/uipack/src/typings/types.ts (3)
TYPE_CACHE_PREFIX(483-483)DEFAULT_ALLOWED_PACKAGES(467-467)DEFAULT_TYPE_FETCHER_OPTIONS(472-478)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Build Libraries
- GitHub Check: Lint & Format Checks
🔇 Additional comments (26)
libs/uipack/src/typings/types.ts (5)
14-43: LGTM! Well-designed interface for per-file type metadata.The TypeFile interface is clearly documented with practical examples showing how it integrates with browser editors like Monaco. The separation of path, url, and content provides the flexibility needed for virtual file systems.
75-81: LGTM! Clear subpath tracking for nested imports.The optional subpath field enables proper handling of nested package imports and supports alias generation for browser editors. The documentation clearly explains its purpose with a relevant example.
93-116: LGTM! Proper deprecation strategy with clear migration path.The deprecation of the combined
contentfield in favor of thefilesarray is well-documented. The Monaco integration example provides clear guidance for consumers migrating to the new API. The note about complex packages like Zod reinforces the practical need for this change.
158-165: LGTM! Error code addition aligns with allowlist feature.The new PACKAGE_NOT_ALLOWED error code properly extends the existing error handling to support the allowlist functionality.
414-423: LGTM! Flexible allowlist configuration with clear defaults.The allowedPackages option design is well-thought-out:
- String array allows additions to the default allowlist
falsevalue disables the allowlist entirely for advanced use cases- Clear documentation with glob pattern support mentioned
libs/uipack/src/typings/__tests__/type-fetcher.test.ts (4)
21-24: LGTM! Comprehensive test coverage for new helper functions.The test suites for the new helper functions are well-structured:
getRelativeImportPathtests validate relative path calculation for various nesting levelsurlToVirtualPathtests cover URL parsing edge cases including invalid inputsbuildTypeFilestests thoroughly validate the alias generation logic, including the crucial check that no duplicate aliases are created when files already existThe test coverage meets the 95%+ requirement and validates all code paths including edge cases.
Based on learnings, maintaining 95%+ test coverage across statements, branches, functions, and lines is required for libs/uipack/src/**/*.test.ts files.
Also applies to: 234-337
357-378: LGTM! Consistent test data updates maintaining backwards compatibility.All TypeFetchResult test fixtures have been properly updated to include the new
filesarray while maintaining the deprecatedcontentfield for backwards compatibility testing. The test data structure is consistent and realistic across all test cases.Also applies to: 641-647, 713-719, 750-756, 898-904, 936-942, 972-978, 1008-1014, 1184-1190
779-1141: LGTM! Thorough test coverage for allowlist functionality.The allowlist test suite provides excellent coverage:
- Default package validation including the glob pattern for @frontmcp/*
- Wildcard matching logic with edge cases (preventing false positives for similar scopes)
- Custom package additions via options
- Disabled allowlist mode for unrestricted access
- Proper error handling with PACKAGE_NOT_ALLOWED code
- Initialize method behavior with glob pattern filtering
The tests properly use mocked fetch and pre-populated cache to isolate the allowlist logic, ensuring reliable and fast test execution.
Based on learnings, test all code paths including error cases is required for **/*.test.{ts,tsx} files.
1147-1153: LGTM! Test correctly updated for new default.The test expectation for
maxDepthhas been properly updated from 2 to 4, confirming this is an intentional change. This aligns with the updated default in types.ts.libs/ui/src/universal/cached-runtime.ts (4)
15-16: LGTM - Imports align with library guidelines.The imports from
@frontmcp/uipack/runtimeand@frontmcp/uipack/buildfollow the coding guideline to use@frontmcp/uipackfor React-free utilities rather than importing from@frontmcp/ui. Based on learnings, this is the correct pattern.
748-771: Good improvement - safer minification preserves string integrity.The updated
minifyScriptfunction correctly avoids corrupting string literals containing//(like URLs). The conservative approach of only removing full-line comments and block comments is appropriate.
216-241: LGTM - Bridge initialization has appropriate defensive checks.The
initFromBridgefunction properly:
- Checks for
window.mcpBridgeexistence before accessing properties- Uses
!= nullto handle both null and undefined- Falls back to event listener if bridge isn't immediately available
181-192: LGTM - Store update methods provide clean API for dynamic updates.The
updateOutputandupdateInputmethods properly:
- Update internal state via
setState- Mirror values to window globals for compatibility with existing code
- Support the dynamic/hybrid build mode patterns
libs/uipack/src/theme/platforms.test.ts (3)
108-136: LGTM - Utility function tests align with expected platform behaviors.The
canUseCdnandneedsInlineScriptstests correctly validate:
CLAUDE_PLATFORM:canUseCdn=false(limited network),needsInlineScripts=false(cdn strategy)GEMINI_PLATFORM:canUseCdn=false(inline strategy),needsInlineScripts=true(inline strategy)OPENAI_PLATFORM:canUseCdn=true(full network + cdn),needsInlineScripts=false
28-35: No action needed. The test expectations forCLAUDE_PLATFORMare correct and match the implementation perfectly.supportsWidgetsistruein both the test (line 30) and the implementation (line 106), along with all other assertions.Likely an incorrect or invalid review comment.
38-46: GEMINI_PLATFORM test expectations are correct and match implementation.All assertions in the test (lines 40-45) align with the GEMINI_PLATFORM definition:
id,supportsWidgets,supportsTailwind,supportsHtmx,networkMode, andscriptStrategyall match their expected values. The previous copy-paste error has been resolved—line 45 correctly referencesGEMINI_PLATFORM.scriptStrategyinstead ofCLAUDE_PLATFORM.scriptStrategy.libs/uipack/src/theme/platforms.ts (2)
123-134: LGTM - GEMINI_PLATFORM configuration aligns with test expectations.The Gemini platform configuration correctly reflects:
supportsTailwind: true- enables Tailwind CSS supportnetworkMode: 'limited'- restricted network accessscriptStrategy: 'inline'- scripts must be inlined
21-21: Unable to verify removal claim — insufficient context.The review asserts that
'ngrok'was removed fromPlatformId, but the current codebase contains no references to ngrok as a platform (only a comment mentioning "ngrok/iframe scenarios" in polyfills.ts). Without a git diff showing that ngrok previously existed inPlatformIdandPLATFORM_PRESETS, this claim cannot be independently verified. Confirm via git history whether ngrok was actually exported as a platform in a prior version before flagging as a breaking change.libs/ui/src/bundler/browser-components.ts (2)
460-485: LGTM - Caching with concurrent build prevention is well-implemented.The
getBrowserComponentsfunction properly:
- Returns cached result if available
- Uses
buildingPromiseas a lock to prevent concurrent builds- Clears the lock on both success and failure
- Allows retry on build failure (appropriate behavior)
397-446: LGTM - esbuild configuration is appropriate for browser bundling.The
buildWithEsbuildfunction correctly:
- Uses IIFE format for browser-safe execution
- Externalizes React (mapped to
window.React)- Bundles styles inline
- Appends runtime wrapper for window assignments
libs/ui/src/bundler/bundler.ts (6)
56-61: LGTM - Imports from@frontmcp/uipack/buildare now correct.Previous review flagged a broken import. The current imports (
buildCDNScriptTag,CLOUDFLARE_CDN,buildUIComponentsRuntime) appear to be properly exported from@frontmcp/uipack/build.
654-690: Good - Non-null assertions replaced with defensive checks.Lines 656-658 now properly validate
transpiledCodewith an explicit null check and throw a descriptive error:if (!transpiledCode) { throw new Error('Failed to transpile component source'); }This addresses the previous review concern about non-null assertions.
1509-1519: LGTM - AsyncbuildFrontMCPRuntimewith graceful fallback.The method correctly:
- Awaits
getBrowserComponents()for esbuild-transpiled components- Falls back to
buildFallbackUIComponents()on any error- Callers at lines 424 and 665 properly await the result
508-575: LGTM - Multi-platform build with proper typing.The
bundleToStaticHTMLAllmethod:
- Transpiles once and generates per-platform variations (efficient)
- Returns
Partial<Record<ConcretePlatform, PlatformBuildResult>>addressing the previous type safety concern- Includes comprehensive JSDoc with usage example
1390-1429: LGTM - Theme integration follows guidelines.The theme CSS injection:
- Uses
CLOUDFLARE_CDN.tailwindCssfrom@frontmcp/uipack/build(not hard-coded)- Applies theme CSS variables via
buildThemeCss(theme)- Falls back to
DEFAULT_THEMEwhen no theme providedBased on learnings, this follows the pattern of using
theme.cdnconfiguration instead of hard-coding CDN URLs.
694-728: LGTM - Platform metadata generation is well-integrated.The
buildUIMetacall properly:
- Maps
ConcretePlatformtoAIPlatformTypeviamapTargetPlatformToAIPlatform- Includes the generated HTML and widget accessibility config
- Returns comprehensive metadata in the
PlatformBuildResult
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (3)
libs/uipack/src/theme/platforms.ts (3)
1-12: Update file-level documentation to reflect configuration changes.The header comment (line 6) states that Claude operates in "Artifacts mode - Tailwind but NO network (scripts must be inlined)". If the CLAUDE_PLATFORM changes are correct (networkMode: 'limited', scriptStrategy: 'cdn'), this comment is now outdated and should be updated to reflect the new capabilities.
Additionally, line 7 mentions "Gemini: No interactive widget support" but doesn't mention Tailwind support. Consider updating this summary to reflect the current platform capabilities.
🔎 Proposed documentation update
* Different LLM platforms have different capabilities for rendering UI: * - OpenAI: Full support (Canvas/Apps SDK) - Tailwind + HTMX with network - * - Claude: Artifacts mode - Tailwind but NO network (scripts must be inlined) - * - Gemini: No interactive widget support + * - Claude: Artifacts mode - Tailwind + widgets with limited network (CDN scripts) + * - Gemini: Tailwind support but no interactive widgets (limited network) * - Custom MCP: Configurable based on client capabilities
123-134: Consider documenting Tailwind generation limitations for Gemini.Gemini does support generating Tailwind CSS code, confirming the
supportsTailwind: truechange is technically justified. However, the platform has known quality issues—it frequently generates outdated Tailwind v3 patterns and incorrect setup steps, requiring validation and manual fixes.If this flag enables Tailwind code generation for Gemini users, document these limitations or add handling for common Tailwind v3/v4 incompatibilities. Additionally, with
networkMode: 'limited', consider specifyingallowedDomainsto clarify which external resources Gemini can access for Tailwind.
103-117: Update file header comment and clarify the configuration rationale.The configuration correctly reflects Claude Artifacts' sandboxed nature per Anthropic documentation — Claude cannot fetch arbitrary CDN resources, so the
canUseCdn()check intentionally returnsfalse. However, the comments are misleading:
Line 6 (file header) is outdated: States "NO network (scripts must be inlined)" but CLAUDE_PLATFORM now sets
scriptStrategy: 'cdn'.Line 108 misleads: Comment says "Network blocked" but configuration uses
networkMode: 'limited'(a distinct state). CSPconnect-src 'none'is correct for Claude's sandboxing.Test comment (line 125) is inaccurate: "It can use CDN resources from allowed domains" contradicts Claude's actual capabilities. Claude cannot fetch external CDN resources; the
allowedDomainsfield is unused for this platform.Clarification needed: The
scriptStrategy: 'cdn'setting won't activate for Claude (needsInlineScripts returns false, canUseCdn returns false). Either:
- Update all comments to accurately reflect that Claude relies on inlined/bundled content, or
- Change
scriptStrategyto'inline'to match the actual behavior.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
libs/uipack/src/theme/platforms.ts
🧰 Additional context used
📓 Path-based instructions (4)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/theme/platforms.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/platforms.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/theme/platforms.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/theme/platforms.ts
🧠 Learnings (7)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/theme/platforms.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/theme/platforms.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/theme/platforms.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/uipack/src/theme/platforms.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: FrontMCP is a TypeScript-first schema validation framework - all types should align with MCP protocol definitions
Applied to files:
libs/uipack/src/theme/platforms.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/uipack/src/theme/platforms.ts
🧬 Code graph analysis (1)
libs/uipack/src/theme/platforms.ts (1)
libs/uipack/src/theme/index.ts (1)
PlatformId(36-36)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Build Libraries
🔇 Additional comments (1)
libs/uipack/src/theme/platforms.ts (1)
21-21: No action required: ngrok was never a supported platform type inPlatformId.The review comment incorrectly claims that 'ngrok' was removed from the
PlatformIdtype. However, investigation of the codebase and git history shows no evidence that ngrok was ever included as a platform option in this type. The currentPlatformIddefinition contains only'openai' | 'claude' | 'gemini' | 'custom', and git history shows no removal of ngrok from this type. The recent changes to this file focus on enabling widget support for Claude Artifacts platform, not removing ngrok support.Likely an incorrect or invalid review comment.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
🧹 Nitpick comments (1)
libs/uipack/src/theme/css-to-theme.ts (1)
84-111: Consider simplifying regex usage withmatchAll().The static analysis warning about constructing a RegExp from a variable is a false positive here (COLOR_VAR_REGEX is a constant, not user input), but the code can be simplified for better readability.
🔎 Proposed refactor using matchAll()
export function cssToTailwindTheme(userCss: string): CssToThemeResult { const colorVars = new Map<string, string>(); // Extract all --color-* variables - const regex = new RegExp(COLOR_VAR_REGEX.source, 'g'); - let match; - while ((match = regex.exec(userCss)) !== null) { + for (const match of userCss.matchAll(COLOR_VAR_REGEX)) { const varName = match[1]; // e.g., "color-primary" const value = match[2].trim(); colorVars.set(varName, value); }Benefits:
- Eliminates the static analysis warning
- More concise and modern JavaScript
- Avoids potential lastIndex issues with global regex
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
libs/uipack/src/styles/variants.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/index.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/theme/theme.ts
🧰 Additional context used
📓 Path-based instructions (6)
**/*.ts
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.ts: Use strict TypeScript mode with noanytypes without strong justification - useunknowninstead for generic type defaults
Avoid non-null assertions (!) - use proper error handling and throw specific errors instead
Use type parameters with constraints instead of unconstrained generics
Do not mutate rawInput in flows - use state.set() for managing flow state instead
Files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/styles/variants.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Use theme.cdn configuration instead of hard-coding CDN URLs
Files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
libs/uipack/src/**/*.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
libs/uipack/src/**/*.ts: Do not add React dependencies to uipack - use @frontmcp/ui package for React components instead
Avoid usinganytype without justification in TypeScript code
Do not expose internal error details in user-facing error messages
Files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/styles/variants.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
libs/**
⚙️ CodeRabbit configuration file
libs/**: Contains publishable SDK libraries. Review for API correctness, breaking changes, and consistency with docs. When public APIs change, ensure there is a matching docs/draft/docs/** update (not direct edits under docs/docs/**).
Files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/styles/variants.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
**/*.test.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.test.{ts,tsx}: Achieve 95%+ test coverage across all metrics (statements, branches, functions, lines)
Test all code paths including error cases and constructor validation
Include error classinstanceofchecks in tests to validate error handling
Files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
libs/uipack/src/**/*.test.ts
📄 CodeRabbit inference engine (libs/uipack/CLAUDE.md)
Maintain 95%+ test coverage across statements, branches, functions, and lines
Files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
🧠 Learnings (17)
📓 Common learnings
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/bundler/**/*.{ts,tsx} : Use SSR component bundler (createBundler, InMemoryBundler) for bundling React components
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Configure entry points for frontmcp/ui exports: main, react, react/hooks, renderers, render, universal, and bundler
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{theme,build,layouts,pages,base-template}/**/*.ts : Use theme.cdn configuration instead of hard-coding CDN URLs
Applied to files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,build,layouts,pages}/**/*.ts : Use platform-aware theming via getPlatform(), OPENAI_PLATFORM, and CLAUDE_PLATFORM constants for network capability detection
Applied to files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/styles/variants.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,base-template,layouts,pages}/**/*.ts : Use buildCdnScriptsFromTheme() with appropriate inline flag for platform network access constraints
Applied to files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/theme/theme.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.{ts,tsx} : Do not import React-free utilities from frontmcp/ui; use frontmcp/uipack instead
Applied to files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{handlebars,build,layouts,pages}/**/*.ts : Use Handlebars template engine for dynamic template rendering with variable substitution
Applied to files:
libs/uipack/src/theme/css-to-theme.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not add React dependencies to uipack - use frontmcp/ui package for React components instead
Applied to files:
libs/uipack/src/theme/css-to-theme.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{adapters,components,web-components}/**/*.test.ts : Test component behavior across platform configurations (OpenAI, Claude, etc.)
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.tslibs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components,renderers}/**/*.test.ts : Test HTML escaping for user-provided content in component tests
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.test.ts : Maintain 95%+ test coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Use React Testing Library for component tests with 95%+ coverage across statements, branches, functions, and lines
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/**/*.test.{ts,tsx} : Include SSR tests to verify server-side rendering output for React components
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/renderers/**/*.test.{ts,tsx} : Include hydration tests to verify client-side hydration behavior
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/{components,web-components}/**/*.test.ts : Test invalid inputs for every component to validate error handling
Applied to files:
libs/uipack/src/theme/css-to-theme.test.tslibs/uipack/src/theme/theme.test.ts
📚 Learning: 2025-12-19T02:04:46.464Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-19T02:04:46.464Z
Learning: Applies to libs/sdk/src/**/index.ts : Export public API through barrel files - export users' needed items, no legacy exports with different names
Applied to files:
libs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:16.929Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/uipack/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:16.929Z
Learning: Applies to libs/uipack/src/**/*.ts : Do not expose internal error details in user-facing error messages
Applied to files:
libs/uipack/src/theme/index.ts
📚 Learning: 2025-12-22T13:01:03.646Z
Learnt from: CR
Repo: agentfront/frontmcp PR: 0
File: libs/ui/CLAUDE.md:0-0
Timestamp: 2025-12-22T13:01:03.646Z
Learning: Applies to libs/ui/src/universal/**/*.{ts,tsx} : Export FrontMCPProvider and UniversalApp from universal app shell for platform-agnostic React configuration
Applied to files:
libs/uipack/src/theme/index.ts
🧬 Code graph analysis (3)
libs/uipack/src/theme/css-to-theme.test.ts (1)
libs/uipack/src/theme/css-to-theme.ts (2)
cssToTailwindTheme(84-111)buildTailwindStyleBlock(128-138)
libs/uipack/src/theme/theme.test.ts (2)
libs/uipack/src/theme/index.ts (2)
buildThemeCss(89-89)DEFAULT_THEME(94-94)libs/uipack/src/theme/theme.ts (2)
buildThemeCss(616-707)DEFAULT_THEME(427-427)
libs/uipack/src/theme/theme.ts (1)
libs/uipack/src/theme/index.ts (2)
buildThemeCss(89-89)ThemeConfig(85-85)
🪛 ast-grep (0.40.3)
libs/uipack/src/theme/css-to-theme.ts
[warning] 87-87: Regular expression constructed from variable input detected. This can lead to Regular Expression Denial of Service (ReDoS) attacks if the variable contains malicious patterns. Use libraries like 'recheck' to validate regex safety or use static patterns.
Context: new RegExp(COLOR_VAR_REGEX.source, 'g')
Note: [CWE-1333] Inefficient Regular Expression Complexity [REFERENCES]
- https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
- https://cwe.mitre.org/data/definitions/1333.html
(regexp-from-variable)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Lint & Format Checks
- GitHub Check: Build Libraries
🔇 Additional comments (17)
libs/uipack/src/styles/variants.ts (4)
54-54: LGTM! Theme token usage improves consistency.Migrating from hardcoded blue colors to the
infotheme token ensures consistency with the theme system and improves maintainability.
77-77: LGTM! Consistent with badge variant changes.The badge dot variant correctly uses the
infotheme token to match the badge container styling.
131-131: LGTM! Improves button UX.Adding
cursor-pointerprovides better visual feedback for interactive elements.
149-150: LGTM! Alert styling now uses theme tokens.The alert info variant correctly uses the
infopalette for both container and icon, maintaining consistency with the theme system.libs/uipack/src/theme/theme.test.ts (3)
144-152: LGTM! Comprehensive opacity variant testing.The test properly validates that semantic colors generate opacity variants using CSS
color-mix()with the oklch color space, checking multiple color types (primary, success, danger) and opacity levels.
154-159: LGTM! Proper hover variant validation.The test correctly verifies that brand colors (primary and secondary) generate hover state variants, which are essential for interactive UI elements.
161-167: LGTM! Thorough opacity level coverage.The test efficiently validates all opacity levels (10, 20, 30, 50, 70, 90) are generated for color variants using an iteration pattern, ensuring complete coverage.
libs/uipack/src/theme/index.ts (1)
96-97: LGTM! Clean public API extension.The new exports for CSS-to-Tailwind theme conversion utilities follow the established barrel export pattern and extend the theme module's public API appropriately.
libs/uipack/src/theme/theme.ts (4)
566-570: LGTM! Well-defined opacity variant levels.The constant definition uses
as constfor type safety and provides a clear set of opacity levels for color variant generation.
572-589: LGTM! Clean opacity variant generation.The function properly generates opacity variants using CSS
color-mix()with the oklch color space for perceptually uniform color mixing. The implementation is well-documented with clear examples.
591-611: LGTM! Comprehensive brand color variant generation.The function generates both hover states (darkened by mixing with black) and opacity variants for brand colors. The hover mixing ratio (85%) provides appropriate visual feedback for interactive elements.
619-651: LGTM! Well-structured theme CSS generation refactoring.The updates appropriately apply variant generation:
- Brand colors (primary, secondary) receive both hover and opacity variants for interactive UI elements
- Status colors (success, warning, danger, info) receive opacity variants for non-interactive components like badges and alerts
The refactoring maintains backward compatibility while extending functionality.
libs/uipack/src/theme/css-to-theme.test.ts (2)
4-127: LGTM! Comprehensive test coverage for CSS-to-theme conversion.The test suite thoroughly validates:
- Color variable extraction and map population
- @theme block generation
- Residual CSS preservation
- Edge cases (empty input, no color variables)
- Various color syntaxes (hex, rgb/rgba, hsl/hsla)
- Non-root CSS block preservation
This achieves excellent coverage per the coding guidelines requirement of 95%+.
129-172: LGTM! Thorough style block builder testing.The tests validate:
- Complete style tag wrapping with correct type attribute
- Integration of @theme block and remaining CSS
- Edge case handling (empty input, non-color variables only)
Good coverage of the buildTailwindStyleBlock functionality.
libs/uipack/src/theme/css-to-theme.ts (3)
30-49: LGTM! Well-documented result interface.The interface clearly defines the CSS-to-theme conversion result with comprehensive JSDoc comments for each property.
55-55: LGTM! Appropriate regex pattern for color variable matching.The regex correctly matches CSS color variable declarations with the
--color-*prefix and captures both the variable name and value.
128-138: LGTM! Clean style block builder implementation.The function properly combines the @theme block and remaining CSS, handles empty input gracefully, and uses the correct
type="text/tailwindcss"attribute for Tailwind v4 processing.
Summary by CodeRabbit
New Features
Improvements
Documentation
Chores
✏️ Tip: You can customize this high-level summary in your review settings.