Skip to content

color

Colour picker bound to a string attribute holding a CSS colour.

Builder F.color(attribute: string): ColorField
Wire type key color
Class chain ColorFieldField
Detail projection text-entry
Column counterpart text cell, i.e. C.text(attribute)

Example

import { F } from '@adonia/core'

F.color('accent').label('Accent').oklch().swatches(['oklch(0.7 0.2 250)'])

Props

Beyond the shared field DSL:

Prop Declared on Behaviour
hex(): this ColorField Restricts the stored notation to hex (#rrggbb); the default accepts both.
oklch(): this ColorField Restricts the stored notation to oklch(…); the default accepts both.
alpha(): this ColorField Enables the alpha channel in the picker. A rendering affordance: the §11.1 pattern accepts an alpha component in either notation regardless, because rejecting one that the picker previously produced would strand existing records.
swatches(colors: readonly string[]): this ColorField Preset swatches offered beside the picker, in the field’s notation.

Validation

Vine base: vine.string().

§11.1 mapping: vine.string() constrained by the notation’s pattern. Not trimmed — a colour with surrounding whitespace is malformed input, not sloppy typing, and silently repairing it would hide a broken client.

Contributed by ColorField.vineSchema() in packages/core/src/schema/fields/color.ts. The shared modifiers (required, nullable, requiredWhen, unique, optionality) are applied on top by Field.buildValidation, and a rules() override replaces the base entirely — the validator compiler never branches on the field class.

Declared in

  • packages/core/src/schema/fields/color.tsColorField
Navigation

Type to search…

↑↓ navigate↵ selectEsc close