Skip to main content
The Types object is an enum of all valid prop types in Solar. Use it when defining prop schemas in defineComponent to avoid relying on magic strings and to get autocompletion support in your editor.

​
Import and usage

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

const MyComponent = defineComponent({
  name: 'MyComponent',
  props: {
    label:    { type: Types.string,   required: true },
    count:    { type: Types.number,   default: 0 },
    active:   { type: Types.boolean,  default: true },
    onSubmit: { type: Types.function, required: true },
    data:     { type: Types.object },
    tags:     { type: Types.array },
    anything: { type: Types.any },
    action:   { type: Types.slot,     accepts: 'Button', required: true },
  },
  render(props) { /* ... */ },
})

​
Type reference

ConstantString valueValidation
Types.string'string'typeof value === 'string'
Types.number'number'typeof value === 'number'
Types.boolean'boolean'typeof value === 'boolean'
Types.function'function'typeof value === 'function'
Types.object'object'typeof value === 'object' — arrays also pass this check
Types.array'array'Array.isArray(value)
Types.any'any'Skips type checking entirely
Types.slot'slot'Value is a vnode produced by a Solar component; use with accepts to restrict which one
Types.object accepts any value where typeof value === 'object', which includes arrays — since typeof [] === 'object' in JavaScript. If you need to require specifically an array, use Types.array, which checks Array.isArray(value) instead.

​
The slot type

Types.slot validates that a prop receives a vnode produced by a Solar component rather than a raw createElement call or a plain value. When you add an accepts field to the prop schema, Solar additionally checks the vnode’s _source tag to ensure it came from the correct component. 
// Card expects its action prop to be a Button vnode
const Card = defineComponent({
  name: 'Card',
  props: {
    title:  { type: Types.string, required: true },
    action: { type: Types.slot,   accepts: 'Button', required: true },
  },
  render({ title, action }) {
    return createElement('div', { class: 'card' },
      createElement('h3', {}, title),
      action,
    )
  },
})

// valid — Button produces a tagged vnode
Card({ title: 'Hello', action: Button({ label: 'Go', onClick: () => {} }) })

// throws ContractError — plain createElement has no _source tag
Card({ title: 'Hello', action: createElement('button', {}, 'Go') })
If accepts is omitted, any Solar component vnode satisfies the slot — only raw createElement nodes and non-object values are rejected.
You can use plain string literals ('string', 'number', 'slot', etc.) interchangeably with the Types constants — they are the same values. Types exists purely for autocompletion convenience. Both forms produce identical runtime behavior.