pixi-silk/ui/inspector

Inspector: property fields bound to the selection.

import { ChoiceField, ColorField, Field, Inspector } from 'pixi-silk/ui/inspector';

Classes#

Class	Description
ChoiceField	Segmented choices: a thumb slides to the chosen one and stretches on the way, like `SegmentedSwitch`, but it fills its row and shows no thumb for mixed values.
ColorField	A colour swatch and its hex code. A press opens the colour picker.
Field	A field: a box of a given size that shows values and edits them. It holds no data. It shows what Field.show gives it and reports edits through its options. The `Inspector` builds these.
Inspector	A property inspector built from a schema. Rows hold number fields you scrub or type, text fields, switches, segmented choices, colour swatches with a picker and vector rows with an aspect lock. Sections fold. It edits whatever its InspectorBinding points at: one object, a multi-selection (differing values show as Mixed) or a set of signals.
NumberField	A number you drag or type. Drag sideways to scrub: Shift is ten times faster, Alt ten times finer. Click without dragging to type a value. Mixed values scrub together, each from its own start.
TextField	A one-line text field, edited in place with a TextEditor.
ToggleField	An on and off switch with a springy knob. Mixed values park the knob in the middle.
VectorField	Two number fields in a row, such as X and Y or W and H, with an optional aspect lock.

Interface	Description
ChoiceFieldOptions	Options of ChoiceField.
ChoiceFieldSpec	Segmented choices.
ChoiceOption	One choice of a ChoiceField.
ColorFieldOptions	Options of ColorField.
ColorFieldSpec	A colour swatch that opens a colour picker. Values are 0xRRGGBB numbers.
FieldContext	What every field needs from the inspector around it.
FieldEdit	The callbacks of a field’s edit gesture: one `begin`, any number of `input`, one `end`.
FieldValue	What a field shows for a list of values: the shared value, or `mixed` when they differ.
InspectorBinding	Where an inspector reads and writes values. `read` returns one value per edited object, so a multi-selection shows mixed values. Write your own to edit a store, or use bindObjects and bindSignals.
InspectorOptions	Options of Inspector.
InspectorState	The reactive state of an Inspector.
NumberFieldOptions	Options of NumberField.
NumberFieldSpec	A number you scrub or type.
SectionSpec	A titled group of fields that folds.
TextFieldOptions	Options of TextField.
TextFieldSpec	A one-line text field.
ToggleFieldOptions	Options of ToggleField.
ToggleFieldSpec	An on and off switch.
VectorFieldOptions	Options of VectorField.
VectorFieldSpec	Two numbers in one row, such as X and Y, or W and H with an aspect lock.
WritableSignal	A signal the inspector can write.

Type Alias	Description
ColorPickerFactory	Something a colour picker popover shows: a Pixi container that edits a ColorModel.
InspectorField	One entry of an inspector schema.

Function	Description
bindObjects	Edits plain objects or display objects. Keys are dot paths, such as `position.x`, `alpha` or `style.fill`. Pass the selection’s items to edit several objects at once. The list is copied. The binding does not watch the objects: call `Inspector.refresh` after changing them elsewhere.
bindSignals	Edits signals, one per key: a settings panel for app state. Changes made elsewhere show in the inspector at once.
fieldValue	Folds the values of a multi-selection into what one field shows. Numbers within `epsilon` count as equal.
getPath	The value at a dot path such as `position.x`. Undefined when a step on the way is missing.
setPath	Sets the value at a dot path such as `position.x`. Missing objects on the way are not created, and the write is skipped.