mirror of https://github.com/hanzoai/branding.git synced 2026-10-30 18:46:35 +00:00

Files

T

zeekay d9a5a9abaa chore: purge tamagui — rename API to @hanzo/gui

- src/tg: createTamaguiConfig → createGuiConfig
- src/tg/types.ts: TamaguiConfigOptions → GuiConfigOptions
- README.md, COMPONENTS.md: 'Tamagui' prose → @hanzo/gui

2026-04-28 08:45:00 -07:00

1.5 KiB

Raw Permalink Blame History

Components

Themed components built on @hanzo/gui and aware of our theming mechanism, so they work with any palette — not just primary.

import { ThemedButton, StatusBox, ToggleSwitch } from '@hanzo/branding/tg-components'

ThemedButton

Solid color button. Defaults to theme="primary".

<ThemedButton onPress={handleSubmit}>Submit</ThemedButton>
<ThemedButton theme="danger" onPress={handleDelete}>Delete</ThemedButton>
<ThemedButton theme={null}>Cancel</ThemedButton>

GhostButton

Borderless button that reveals border + tint on hover/press.

<GhostButton onPress={handleAlt}>Try another way</GhostButton>

OutlineButton

Outlined button with border and subtle background.

<OutlineButton onPress={handleCancel}>Cancel</OutlineButton>

StatusBox

Callout box for tips, errors, warnings. Takes a theme name and bullet points.

<StatusBox title="Tip" points={['First point', 'Second point']} />
<StatusBox title="Error" points={['Something broke']} theme="danger" symbol="⚠️" />
<StatusBox title="Done" points={['All set']} theme="success" symbol="✓" />

ToggleSwitch

Branded toggle. Uses the theme palette when checked, neutral when unchecked.

<ToggleSwitch checked={value} onCheckedChange={setValue} />
<ToggleSwitch checked={value} onCheckedChange={setValue} theme="success" />

StyledCard

Pressable card with optional icon slots.

<StyledCard
  title="Bank Account"
  subtitle="Chase ••1234"
  iconLeft={<BankIcon />}
  onPress={handleSelect}
/>

1.5 KiB Raw Permalink Blame History