Interface: BrandPickerProps

Props for BrandPicker.

Properties

className?

optional className?: string

---

onChange

onChange: (value) => void

Receives each valid edited or selected brand context.

Parameters

value

assets

{ favicon: string; icon: { dark?: string; light: string; }; logo: { dark?: string; light: string; }; } = ...

assets.favicon

string = ...

assets.icon

{ dark?: string; light: string; } = ...

assets.icon.dark?

string = ...

assets.icon.light

string = ...

assets.logo

{ dark?: string; light: string; } = ...

assets.logo.dark?

string = ...

assets.logo.light

string = ...

colors

{ accent: string; background: string; border: string; foreground: string; muted: string; primary: string; primaryHover: string; surface: string; } = BrandColorsSchema

colors.accent

string = ...

colors.background

string = ...

colors.border

string = ...

colors.foreground

string = ...

colors.muted

string = ...

colors.primary

string = ...

colors.primaryHover

string = ...

colors.surface

string = ...

description

string = ...

extensions

Record<string, unknown> = ...

links

{ documentation?: string; repository?: string; website?: string; } = ...

links.documentation?

string = ...

links.repository?

string = ...

links.website?

string = ...

name

string = ...

schemaVersion

"1" = ...

shortName

string = ...

tagline

string = ...

typography

{ mono: string; sans: string; } = ...

typography.mono

string = ...

typography.sans

string = ...

voice

{ audience: string[]; avoid: string[]; principles: string[]; tone: string[]; } = BrandVoiceSchema

voice.audience

string[] = ...

voice.avoid

string[] = ...

voice.principles

string[] = ...

voice.tone

string[] = ...

Returns

void

---

presets?

optional presets?: readonly BrandPreset[]

Optional complete brand choices rendered as quick-select buttons.

---

resetValue?

optional resetValue?: object

Value restored by Reset. Defaults to the dbx-tools brand.

assets?

optional assets?: object

assets.favicon?

optional favicon?: string

assets.icon?

optional icon?: object

assets.icon.dark?

optional dark?: string

assets.icon.light

light: string

assets.logo?

optional logo?: object

assets.logo.dark?

optional dark?: string

assets.logo.light

light: string

colors?

optional colors?: object = BrandColorsSchema

colors.accent?

optional accent?: string

colors.background?

optional background?: string

colors.border?

optional border?: string

colors.foreground?

optional foreground?: string

colors.muted?

optional muted?: string

colors.primary?

optional primary?: string

colors.primaryHover?

optional primaryHover?: string

colors.surface?

optional surface?: string

description?

optional description?: string

extensions?

optional extensions?: Record<string, unknown>

links?

optional links?: object

links.documentation?

optional documentation?: string

links.repository?

optional repository?: string

links.website?

optional website?: string

name?

optional name?: string

schemaVersion?

optional schemaVersion?: "1"

shortName?

optional shortName?: string

tagline?

optional tagline?: string

typography?

optional typography?: object

typography.mono?

optional mono?: string

typography.sans?

optional sans?: string

voice?

optional voice?: object = BrandVoiceSchema

voice.audience?

optional audience?: string[]

voice.avoid?

optional avoid?: string[]

voice.principles?

optional principles?: string[]

voice.tone?

optional tone?: string[]

---

showAssets?

optional showAssets?: boolean

Show editable icon, logo, and favicon references.

---

value?

optional value?: object

Current brand. Defaults to the nearest BrandProvider context.

assets?

optional assets?: object

assets.favicon?

optional favicon?: string

assets.icon?

optional icon?: object

assets.icon.dark?

optional dark?: string

assets.icon.light

light: string

assets.logo?

optional logo?: object

assets.logo.dark?

optional dark?: string

assets.logo.light

light: string

colors?

optional colors?: object = BrandColorsSchema

colors.accent?

optional accent?: string

colors.background?

optional background?: string

colors.border?

optional border?: string

colors.foreground?

optional foreground?: string

colors.muted?

optional muted?: string

colors.primary?

optional primary?: string

colors.primaryHover?

optional primaryHover?: string

colors.surface?

optional surface?: string

description?

optional description?: string

extensions?

optional extensions?: Record<string, unknown>

links?

optional links?: object

links.documentation?

optional documentation?: string

links.repository?

optional repository?: string

links.website?

optional website?: string

name?

optional name?: string

schemaVersion?

optional schemaVersion?: "1"

shortName?

optional shortName?: string

tagline?

optional tagline?: string

typography?

optional typography?: object

typography.mono?

optional mono?: string

typography.sans?

optional sans?: string

voice?

optional voice?: object = BrandVoiceSchema

voice.audience?

optional audience?: string[]

voice.avoid?

optional avoid?: string[]

voice.principles?

optional principles?: string[]

voice.tone?

optional tone?: string[]