Files
zeekay 6c65e3e941 @hanzo/app 0.2.0: the app SDK, renamed from @hanzo/rooms
Every import, the catalog pin and the docs name @hanzo/app and
github.com/hanzoai/app. lib/rooms.ts is lib/app.ts and
components/rooms.tsx is components/app.tsx.
2026-10-22 19:07:20 -07:00

81 lines
3.0 KiB
TypeScript

import { dev } from '@hanzo/app/lib/host'
import { Grid } from '@hanzo/ui/grid'
import { Band, Head } from './band'
import { CardBody, CardLink, CardTitle } from './plate'
import { CLOUD } from './nav-data'
/**
* What Hanzo is, in the four things you can do with it.
*
* The order is the arc a company actually walks: ask it something, have it
* build the thing, run the thing here, or take the thing home. Each card is a
* verb and one sentence of specifics, because a stranger recognises themselves
* in a verb and skims a paragraph.
*
* NO COUNT IN THE HEADING. "Four ways in" is a fact about today's card list and
* breaks the moment a fifth is right; the heading states the arc instead, which
* is the thing that is not going to change. Same rule the products menu follows
* — membership is measured, never written down beside itself.
*
* NO NUMBER IN A CARD either, and no page above this one states one any more:
* the band that carried the model count is gone, so a "500+" typed here would
* be a figure with no registry behind it — the drift the derived one existed to
* prevent, arriving by the other route. "Every model" is true whatever the
* registry does, and the catalog is where a reader goes to count.
*
* Inline style over tokens throughout, never a utility class: this site's
* Tailwind count is a ratchet that may not grow (scripts/tailwind-floor.mjs).
*
* `CARD_LINK` arrives finished and is NOT spread here. This file is a Server
* Component and `plate` is a client module, so a spread of one of its constants
* silently yields nothing — see the note beside that export.
*/
type Way = { verb: string; what: string; href: string }
const WAYS: Way[] = [
{
verb: 'Ask',
what: 'Use every model through one conversation and one API. Your app stays as it is.',
href: '/models',
},
{
verb: 'Build',
what: 'Give Dev a goal. It reads the repo, makes the change, runs the tests, and prepares it to ship.',
href: dev(),
},
{
verb: 'Deploy',
what: 'Launch with data, identity, secrets, storage, search, and events already connected.',
href: CLOUD,
},
{
verb: 'Own it',
what: 'Take the same open stack to your Kubernetes or laptop. Keep the control plane and data where you choose.',
href: '/open-source',
},
]
export function Ways() {
return (
<Band>
<Head
title="One system from the first prompt to production."
lede="Ask a question, ship a change, launch a product, or run the stack yourself. Every path opens onto the same models, agents, data, and policy."
/>
{/* 220 puts four across a laptop, two on a tablet and one on a phone,
without a breakpoint being named anywhere. */}
<Grid columns={{ min: 220, max: 4 }} gap={16} pt={40}>
{WAYS.map((w) => (
<CardLink key={w.verb} href={w.href}>
<CardTitle render="h3">{w.verb}</CardTitle>
<CardBody>{w.what}</CardBody>
</CardLink>
))}
</Grid>
</Band>
)
}
export default Ways