Mixins / foldkit-mixins/theme

Knobs

namespace · packages/mixins/src/theme.ts:68

const Knobs = { standard, schema, paths, at, valueAt, withValue }

The knobs a theme sets: Knobs.standard, every knob the shipped tokens read.

In the guides

Members

Knobs.standard

const · packages/mixins/src/theme/knobs.ts:36

standard: { readonly accent: { readonly hue: Knob.Knob<number, "accent-h">; readonly chroma: Knob.Schemed<"accent-c", "accent-c-dark">; readonly lightness: Knob.Schemed<"accent-l", "accent-l-dark">; readonly secondaryShift: Knob.Knob<number, "secondary-shift">; readonly tertiaryShift: Knob.Knob<number, "tertiary-shift">; }; readonly surface: { readonly hue: Knob.Knob<number, "neutral-h">; readonly saturation: Knob.Schemed<"surface-c", "surface-c-dark">; readonly lightness: Knob.Schemed<"base-l", "base-l-dark">; readonly contrast: Knob.Knob<number, "surface-contrast">; readonly textContrast: Knob.Knob<number, "contrast-factor">; readonly hover: Knob.Choice<{ readonly surface: { readonly 'surface-ink': "1"; readonly 'state-ink': "currentColor"; }; readonly neutral: { readonly 'surface-ink': "0"; readonly 'state-ink': "currentColor"; }; readonly accent: { readonly 'surface-ink': "1"; readonly 'state-ink': string; }; }>; }; readonly shape: { readonly radius: Knob.Knob<number, "radius-factor">; readonly density: Knob.Knob<number, "density">; readonly size: Knob.Choice<{ readonly default: { readonly step: "0"; }; readonly compact: { readonly step: "1"; }; }>; readonly controls: Knob.Choice<{ readonly rounded: { readonly 'control-round': "0"; }; readonly pill: { readonly 'control-round': "1"; }; }>; readonly border: Knob.Knob<number, "border-width">; readonly outlines: Knob.Choice<{ readonly soft: { readonly 'outline-ink': "0"; readonly 'outline-ink-subtle': "0%"; readonly 'outline-ink-defaul …;

Knobs.schema

function · packages/mixins/src/theme/knobs.ts:562

schema<S extends KnobSet>(knobs: S): Schema.Codec<Values<S>>

The Schema of a theme's values over knobs: each group and knob optional, each value checked by its knob, for a Model field or a decoded URL. Decode with onExcessProperty: 'error' where an unknown key must be refused rather than dropped.

Knobs.paths

function · packages/mixins/src/theme/knobs.ts:639

paths<S extends KnobSet>(knobs: S): ReadonlyArray<PathOf<S>>

Every knob's path in knobs, in the order they are declared.

Knobs.at

function · packages/mixins/src/theme/knobs.ts:645

at<S extends KnobSet, P extends PathOf<S>>(knobs: S, path: P): KnobAt<S, P>

The knob at path.

Knobs.valueAt

function · packages/mixins/src/theme/knobs.ts:651

valueAt<S extends KnobSet, P extends PathOf<S>>(
  knobs: S,
  values: Values<S>,
  path: P,
): ValueOf<KnobAt<S, P>>

What values set the knob at path to, or its default.

Knobs.withValue

function · packages/mixins/src/theme/knobs.ts:662

withValue<S extends KnobSet, P extends PathOf<S>>(
  knobs: S,
  values: Values<S>,
  path: P,
  value: ValueOf<KnobAt<S, P>>,
): Values<S>

values with the knob at path set to value, checked by the knob as make checks it.