Skip to main content
defineComponent is the primary building block of every Solar component. You pass it a configuration object that declares the component’s name, its props schema, and a render function. Solar validates the configuration at definition time and returns a ComponentFn that validates props on every call — giving both runtime safety and a machine-readable contract the registry exposes to AI agents and platform tools.

​
Signature

defineComponent(config) → ComponentFn

​
Parameters

​
config
object
required
The full component configuration.
​
name
string
required
The PascalCase display name for the component. Solar uses this in error messages, the component registry, and the displayName property of the returned function. Must be unique across your application.
​
props
object
A prop schema object. Each key is a prop name; each value is a schema descriptor that describes the prop’s type, whether it’s required, and any constraints. See the Prop schema descriptor section below. If omitted, the component accepts no declared props.
​
render
function
required
A function that receives the resolved props object (with defaults applied) and returns a vnode. Build your vnode tree using createElement or h() inside this function.

​
Prop schema descriptor

Each value in the props object is a schema descriptor with the following fields:
FieldTypeDescription
typestringRequired. The expected type of the prop. One of: 'string', 'number', 'boolean', 'function', 'object', 'array', 'any', 'slot'.
requiredbooleanIf true, Solar throws a ContractError when this prop is missing or null at call time.
defaultanyFallback value applied when the prop is not provided. Ignored if the prop is present.
enumarrayRestricts the prop to a list of allowed string values. Solar throws a ContractError if the value is not in the list.
acceptsstringOnly valid when type is 'slot'. The displayName of the component whose vnode the slot accepts. Passing a vnode from any other component throws a ContractError.

​
Return value

defineComponent returns a ComponentFn — a plain function you call with a props object. It validates the incoming props against the schema, applies defaults, and calls render with the resolved props.
​
ComponentFn
function
The callable component function. Invoke it with a props object to produce a vnode: Button({ label: 'Save', onClick: handleSave }).
​
displayName
string
The component name you provided in config.name. Used by the registry, error messages, and typed slot validation.

​
Example

import { defineComponent, createElement, registry } from './solar/index.js'

const Button = defineComponent({
  name: 'Button',
  props: {
    label:   { type: 'string',   required: true },
    onClick: { type: 'function', required: true },
    variant: { type: 'string',   enum: ['primary', 'secondary'], default: 'primary' },
  },
  render({ label, onClick, variant }) {
    return createElement('button', { class: variant, onclick: onClick }, label)
  },
})

registry.register(Button)
export default Button

​
Throws

ConditionError type
config.name is missing or falsyError — thrown immediately at definition time
config.render is missingError — thrown immediately at definition time
A required prop is missing or null at call timeContractError
A prop value has the wrong typeContractError
A prop value is not in the declared enum listContractError
A slot prop receives a vnode from the wrong componentContractError
ContractError extends Error and includes a .toJSON() method that returns a structured object with component, prop, expected, received, and fix fields — designed to be parseable by an AI agent for self-correction.