A Code Component is a reusable React Component implemented as source while retaining Misaki Studio declarations, Preview, instances, and export integration.
Property: Identity · Current behavior: files below components/code/
Property: Creation · Current behavior: Create Code Component or create-code-component
Property: Workspace · Current behavior: Logic and Code; no visual element tree
Property: Contract · Current behavior: properties, states, events, validators, variants, children, test cases, animatable values
Property: Result · Current behavior: authored source plus generated wrapper/integration
Property: MCP · Current behavior: create/update source, shared contract/Preview/debug tools
Declared properties arrive on props.properties; other declared structures arrive through their supported sibling capabilities. Source must default-export the supported React function Component. Updating source in place preserves file UUID, declarations, and parent instances.
Number/color animatable properties are pushed to the mounted host at frame rate and can be read through the provided animated interface or CSS custom properties. The file has no visual Animate panel; its own timeline authoring is currently MCP-only.
create-code-component creates and seeds the file. update-code-component replaces the full source and reports compilation problems. Shared data-structure, test-case, Preview, debug-code-component, diagnostics, and export operations apply.
export-code includes authored source and generated wrapper output. Compilation in the quick update path does not prove every network-fetched import or consumer dependency exists.
Source/declaration changes use file history; external package installation and consumer edits do not. There is no editable node tree, and plain helper modules belong in a Script.