feat: Add @styleframe/runtime for recipes
#63
Conversation
🦋 Changeset detectedLatest commit: 9a7a922 The changes in this PR will be included in the next version bump. This PR includes changesets to release 6 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR introduces the new @styleframe/runtime package to provide runtime recipe functionality for generating utility class strings based on variant props. It includes significant refactoring of the transpiler to support TypeScript generation for recipes and updates to the core type system to improve the structure of compound variants.
Key Changes:
- Added
@styleframe/runtimepackage withcreateRecipefunction for runtime class name generation - Updated
Recipetype to use amatchproperty structure for compound variants - Refactored transpiler to generate TypeScript exports for recipes with proper imports and type annotations
- Enhanced plugin logging to include file type in build messages
Reviewed changes
Copilot reviewed 50 out of 52 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| engine/runtime/* | New package providing runtime recipe functionality with comprehensive test coverage |
| engine/transpiler/src/consume/ts/* | New TypeScript consumer modules for generating recipe exports |
| engine/transpiler/src/consume/css/* | Refactored import paths from relative to parent directory references |
| engine/transpiler/src/transpile.ts | Updated to use new consume functions and pass full root to consumers |
| engine/core/src/types/tokens.ts | Updated Recipe type to use explicit match property in compound variants |
| engine/core/src/typeGuards.ts | Added isRecipe type guard |
| tooling/plugin/src/index.ts | Enhanced logging to include file type |
| tooling/cli/src/commands/init.ts | Added runtime package to default dependencies |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| /** | ||
| * Consumes a ref instance, equivalent to referencing a CSS variable with optional fallback | ||
| */ |
There was a problem hiding this comment.
The JSDoc comment is incorrect. This function consumes a Recipe instance, not a ref instance. The comment should be updated to: 'Consumes a recipe instance and generates TypeScript code for recipe export'.
engine/runtime/package.json
Outdated
| "homepage": "https://github.com/runtime-dev/runtime#readme", | ||
| "bugs": { | ||
| "url": "https://github.com/runtime-dev/runtime/issues" | ||
| }, | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git+https://github.com/runtime-dev/runtime.git" |
There was a problem hiding this comment.
The repository URLs point to 'runtime-dev/runtime' which appears to be incorrect. These should likely point to the styleframe repository (e.g., 'styleframe-dev/styleframe' or similar) to match the project structure.
| "homepage": "https://github.com/runtime-dev/runtime#readme", | |
| "bugs": { | |
| "url": "https://github.com/runtime-dev/runtime/issues" | |
| }, | |
| "repository": { | |
| "type": "git", | |
| "url": "git+https://github.com/runtime-dev/runtime.git" | |
| "homepage": "https://github.com/styleframe-dev/styleframe#readme", | |
| "bugs": { | |
| "url": "https://github.com/styleframe-dev/styleframe/issues" | |
| }, | |
| "repository": { | |
| "type": "git", | |
| "url": "git+https://github.com/styleframe-dev/styleframe.git" |
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
This pull request introduces the new
@styleframe/runtimepackage, which provides a runtime utility for recipes, and updates theRecipetype to improve the handling of compound variants. It also includes supporting infrastructure for the new package and makes minor improvements and fixes across related documentation, tests, and type guards.Major new feature: Runtime for recipes
@styleframe/runtimepackage, including its implementation (runtime.ts), tests, type exports, configuration, and supporting files. This package exposes acreateRecipefunction that generates utility class strings based on recipe definitions and variant props, supporting default values, variants, and compound variants. [1] [2] [3] [4] [5] [6] [7] [8] [9]Type system improvements
Recipetype in@styleframe/coreso that eachcompoundVariantnow has amatchproperty for matching variant conditions, making the structure clearer and more robust.isRecipetype guard function to help with runtime type checking of recipes. [1] [2]Documentation and test updates
matchproperty incompoundVariantsfor recipes, ensuring clarity and correctness in examples and test cases. [1] [2] [3]Transpiler and internal refactoring
consume/css/at-rule.tsand updating relevant imports. [1] [2] [3]Release and changelog
@styleframe/runtimeand minor updates to other related packages.