@trypattern/sdk 0.0.0-stage → 0.1.1

package/dist/rules/messages.d.ts

@@ -0,0 +1,48 @@
+export declare const SRC_STRUCTURE_MESSAGE = "src/ follows the four layers, one folder each, and each folder holds only its kind. Data comes from the server through stores: Pattern gives every table in schema.ts a store, and stores/ holds the others as <Name>.ts with a class extending Store({ state, persist }) (stores/Toasts.ts, stores/IssuesView.ts), listed in `stores` in stores/index.ts; a store reaches the app\u2019s own server calls as this.services.<group>.<call>(). services/ holds the app\u2019s own server calls, declared once with their inputs, replies and the memory fake flows run against: services/<group>.ts holds defineServices({ <group>: { ... } }) and its memory handlers, and services/index.ts exports `services` and `memory` for App.ts (server/<group>.ts serves them with serveServices). Stores call them; models never do. models/ holds each model, the state, answers and commands behind a screen or app chrome, as <Name>.ts with a class extending Model({ state, persist }) (models/IssueList.ts holds class IssueList), listed in `models` in models/index.ts under the route id of its page. actions/ holds the menu entries and shortcuts, one file per thing they act on (actions/issues.ts, actions/appearance.ts), each `export const issueActions = defineActions(({ page, models }) => [...])`, listed in `actions` in actions/index.ts. screens/ holds the pages you see, one file each, named <Name>Screen.tsx (IssueListScreen.tsx), each reading its model with useModel and arranging primitives, with no styles of its own. components/<Name>/ groups the pieces this app adds, and every file in it starts with the folder name (components/IssueList/IssueListRow.tsx); they take props, and only screens and layouts may call useModel. layouts/ holds <Name>Layout.tsx files (layouts/AppLayout.tsx), the frames pages render inside: which pages need sign-in, the sidebar or top bar, and where the Toaster and CommandPalette go. A piece may draw a shape no primitive gives, with tokens for every value, <Text> for its words and primitives for anything clickable. App.ts wires the app together from tables, services, stores, models, routes and actions. hooks/ holds hooks (use<Name>.ts); lib/ holds non-UI helpers and data (.ts only); theme/ holds theme.ts (the tokens this app re-values) and icons.ts (the icons this app adds). Primitives (Screen, Stack, Text, Button, Menu, Icon) come from @trypattern/sdk/react and are not in this project. Styles live only at the bottom of the component file that owns them; there are no style files. To reuse a look, reuse the component. Move the file where it belongs.";
+export declare const SCRIPTS_WIRED_MESSAGE = "A project script lives in a labelled folder under scripts/ (a folder named for what it does) and is used by something: package.json, the app launcher, vite.config.ts, flows/, or another script. Delete scripts nothing uses; never leave one-off scripts behind. Checks and tools every Pattern app needs belong in @trypattern/sdk, not here.";
+export declare const NO_COMMENTS_MESSAGE = "Comments are not allowed in Pattern, including directives like @ts-expect-error or oxlint-disable: there are no escape hatches, fix the code. Express intent with names, types and structure; put lasting rationale in the error message of the rule that enforces it, or in the commit message.";
+export declare const NO_POINTER_CURSOR_MESSAGE = "cursor: pointer is not allowed in Pattern. Pattern apps feel native, and native apps keep the default arrow over links and buttons. Remove it; the reset Pattern ships already sets cursor: default.";
+export declare const USE_COLOR_TOKEN_MESSAGE = "Raw colors are not allowed in styles. Use a token from @trypattern/sdk/tokens.stylex (colors.*). To change what a token looks like in this app, re-value it in src/theme/theme.ts, the one file where raw colors are allowed. Keywords like transparent and currentColor are fine.";
+export declare const USE_FONT_TOKEN_MESSAGE = "Raw font sizes, families and weights are not allowed in styles. Use fontSizes.*, fonts.* or fontWeights.* from @trypattern/sdk/tokens.stylex; to change a font or a size for the whole app, re-value it in src/theme/theme.ts. Text inherits Inter 13px/20px (15px/24px on phones) from <body>, so most styles need no font properties at all.";
+export declare const NO_INTERACTIVE_TRANSITION_MESSAGE = "Hover and press transitions use the motion tokens, as Interfere does: motion.fast with motion.easeOut for buttons, motion.instant for fields, motion.base for segmented controls. Never a raw duration or easing, so every control responds at the same speed. Navigation items change instantly with no transition.";
+export declare const HOVER_USES_HIGHLIGHT_MESSAGE = "Hover, active and selected backgrounds must be colors.transparentHover (with radii.md), so hovering then selecting an item never flashes a second color. Styles named *Active, *Selected or *Current count as selected. Buttons and switches, which have no selected state, may instead use their own colors.*Hover and colors.*Active tokens.";
+export declare const SCROLL_VIEW_ONLY_MESSAGE = "Only ScrollArea may scroll (overflow auto/scroll). The page itself never scrolls or bounces in Pattern; wrap scrollable content in <ScrollArea> from @trypattern/sdk/react.";
+export declare const SELECTABLE_ONLY_MESSAGE = "Do not set userSelect. Text is not selectable by default in Pattern (inputs and editable fields are). For words people need to copy, write <Text isSelectable> from @trypattern/sdk/react.";
+export declare const USE_BREAKPOINTS_MESSAGE = "Media queries come from breakpoints in @trypattern/sdk/tokens.stylex, e.g. [breakpoints.compact]: value, so every screen adapts at the same sizes.";
+export declare const DARK_MODE_IN_TOKENS_MESSAGE = "Dark mode lives only in the color tokens: each is light-dark(lightValue, darkValue), in @trypattern/sdk/tokens.stylex and in the overrides in src/theme/theme.ts. The Appearance setting sets color-scheme on <html>, which picks the side. Components never branch on the color scheme.";
+export declare const NO_CLASSNAME_STRINGS_MESSAGE = "Hand-written class names are not allowed. Style with StyleX: {...stylex.props(styles.x)}, or className={stylex.props(...).className} where a component needs a className.";
+export declare const TYPED_STYLE_PROP_MESSAGE = "A `style` prop must be StyleXStyles<{ ...allowed properties }> (directly or via a type alias), so callers can only override what the component allows and anything else is a type error. Merge it last: {...stylex.props(styles.x, style)}.";
+export declare const COMPONENT_FILE_NAME_MESSAGE = "Each .tsx file under src/components and src/screens holds one component, exported as a named function with the same name as the file (Sidebar.tsx exports function Sidebar).";
+export declare const COMPONENT_FIRST_MESSAGE = "A component file reads top to bottom: imports, its props type, then the component, so the first thing a reader sees is what the file draws. Constants and helper functions it uses (sortOptions, LOADING_ROWS, sectionsOf) go below the component, above `styles`.";
+export declare const ROUTES_UNDER_APP_LAYOUT_MESSAGE = "Every route is a child of AppLayout (src/layouts/AppLayout.tsx) in `routes = defineRoutes([...])` in src/routes.tsx, directly or through another layout from src/layouts/ (a route with a Component and children but no path), so every page sits inside a layout the app chose. Add a page as { id, path, Component } inside the children of the layout it belongs to, above the * route. Its id is the page name the snapshot reports (page: 'issues'), and opening it calls onPageOpen() on the model with the same name in src/models/index.ts, if there is one. A sidebar entry goes in the `navigation` answer of the layout model in src/models/Layout.ts.";
+export declare const NO_ROUTE_DATA_APIS_MESSAGE = "React Router is used in data mode without loaders, actions or lazy routes: models own the state, so router-managed data would compete with it. Load data in the model's onPageOpen() instead.";
+export declare const USE_LINK_MESSAGE = "Use <Link to=\"...\"> from @trypattern/sdk/react for in-app navigation, not <a href=\"/...\">, so navigation stays client-side and looks like every other link. A whole row that opens a page is a <ListRow to=\"...\">.";
+export declare const STORES_IN_APP_MESSAGE = "Only src/stores/index.ts (the `stores` list) and src/App.ts may import values from src/stores/. Every model reads every store as this.stores.<name>; a screen reads its model with useModel('issueList'). Import types from stores freely (import type).";
+export declare const DEV_ONLY_SIGN_IN_MESSAGE = "The server has exactly one dev-only switch, inside @trypattern/sdk: createServer mounts /api/auth/dev-sign-in only in the dev server. Nothing in server/ may branch on dev mode, so there is never an \"if dev, skip auth\" path. To test as a signed-in user, run `app sign-in <email>` (or a flow, which signs in as ada@acme.test by default): it sets the real session cookie, so the real auth code runs.";
+export declare const STATE_VIA_HOOKS_MESSAGE = "A screen reads only its model: const issueList = useModel('issueList'), then issueList.issues, issueList.isLoading and issueList.createIssue(). Reading .state, .models, .stores or getSnapshot() directly does not subscribe, so the screen would show stale data. If the screen needs something from a store, add a getter for it to the model.";
+export declare const CLASSES_NOT_FACTORIES_MESSAGE = "A function that returns an object of methods is a class in disguise: write it as a class, with private fields for its state and methods for its behaviour. One shape for everything that has state keeps the codebase predictable. Plain functions are for pure helpers that compute a value (sortProjects, newClientSideId).";
+export declare const ACCESS_FLOWS_MESSAGE = "flows/Access.flow.ts runs Pattern's generated access flows, which prove every table's access rules against the seed on each app test. Keep it: `import { accessFlows } from '@trypattern/sdk/flows'` and `accessFlows({ App })`.";
+export declare const SCHEMA_TABLES_MESSAGE = "schema.ts defines every saved table in one place and says who may do what: `export const tables = defineTables({ issues: { columns: { title: z.string() }, access: { read: 'signedIn', create: 'signedIn', update: 'signedIn', delete: 'signedIn' }, writes: 'optimistic' } })`. It exports a row type for each table, named for one row (`export type Issue = Row<typeof tables.issues>`), and the emails of the people who run the app, `export const admins: string[] = []`, even when there are none yet, so the question is answered on purpose. Add the line shown.";
+export declare const NO_UNUSED_EXPORTS_MESSAGE = "Export only what another file imports. Nothing imports this, so remove `export` (and the code itself if this file does not use it either). Unused exports hide dead code and make a file look like it offers more than it does. Pattern reads `tables` from schema.ts and `seed` from seed.ts, and vite.config.ts and server/worker.ts default-export their config, so those stay.";
+export declare const NO_RE_EXPORTS_MESSAGE = "Do not pass imports through: a file exports only what it defines. Import the thing from where it lives instead (command from @trypattern/sdk, a component from its own file), so every import names the real source. server/worker.ts is the one exception: Cloudflare runs the Workflow and Durable Object classes its Worker exports, so it may export them from where they live.";
+export declare const EXPLICIT_ACCESS_MESSAGE = "Mark every class member public or private (or protected, to override a base class member), so a reader sees at a glance what other code may call: `public setSort = command(...)`, `public override onPageOpen()`, `private loadIssues()`. Use the word private, never #name, so there is one way to say it. Constructors need neither.";
+export declare const IMPORT_FROM_ROOT_MESSAGE = "Import project files by their path from the project root, the way errors and docs name them: `@/src/models/Issues.ts`, `@/schema.ts`. `./File.ts` is fine for a file in the same folder; never `../` or `./folder/File.ts`, so every import says exactly where the file is and moving a file never breaks the files beside it.";
+export declare const MODEL_MEMBERS_MESSAGE = "A model shows the outside world three kinds of public member, so a reader can tell them apart at a glance: getters are its answers (public get hasNext()), command() fields are what it can do (public openNext = command(() => ...)), and onPageOpen() runs when its page opens. Everything else is private, and a private helper that works something out is a method (private neighbours()), never a getter, because Pattern publishes every getter to the screen and the snapshot. A model has no `actions`: menu entries and shortcuts live in src/actions/.";
+export declare const MODEL_BY_NAME_MESSAGE = "Keep the model whole and read it by name: const issueList = useModel('issueList'), then issueList.isLoading and onClick={issueList.createIssue}. Destructuring it hides where each value comes from and leaves loose names a reader has to trace back.";
+export declare const USE_MODEL_WHERE_MESSAGE = "useModel is for screens (src/screens/) and layouts (src/layouts/). Other components take what they show as props and the commands they call as callbacks, so the screen decides what they read: <IssueListRow issue={issue} onDelete={issueList.deleteIssue} />.";
+export declare const PURE_GETTERS_MESSAGE = "A getter works an answer out from this.state and this.stores.<name>.state and nothing else. It never changes anything (this.set, a store method, this.app.navigate), never waits, and never reads the clock, randomness or a private field, because Pattern caches each getter until the state it read changes, and flows compare its value. Put the change in a command.";
+export declare const ACTIONS_WHERE_MESSAGE = "Menu entries and shortcuts are actions, and actions live only in src/actions/: one file per thing they act on, `export const issueActions = defineActions(({ page, models }) => [action({ id: 'issues.next', label: 'Next issue', keys: ['j'], send: [{ type: 'issueDetail.openNext' }] })])`, listed in src/actions/index.ts. If a person can see it in a menu or press a key for it, it is an action; what it does is a command on a model, and an action only sends commands. Models never build actions.";
+export declare const PURE_ACTIONS_MESSAGE = "An actions file works its entries out from `page` and `models` (each model's state and answers) and nothing else, because Pattern reruns it only when something it read changes, and flows compare the result. It never waits, never uses `this`, never reads the clock or randomness, and imports only types from src/models/, src/stores/ and src/components/. If an entry needs something a model does not answer yet, add a getter to that model.";
+export declare const USE_PRIMITIVES_MESSAGE = "Write <Button>, <IconButton>, <TextField>, <Select>, <Switch> or <Dialog> from @trypattern/sdk/react instead of this element. The primitives carry the focus, keyboard, disabled, pending and error behaviour and the design system's look, so a screen only says what the control does. If no primitive fits, the gap is in the SDK; do not build around it here.";
+export declare const NO_WIDGET_ROLES_MESSAGE = "This role rebuilds a primitive by hand. Use the component from @trypattern/sdk/react with that behaviour (Button, Switch, Menu, Tooltip, Dialog, Divider, CommandMenu): it already has the role, the keyboard handling and the focus management, and it will keep working when the SDK is upgraded.";
+export declare const NO_CLICK_ON_STATIC_MESSAGE = "A click on a <div> or <span> cannot be reached from the keyboard or by a screen reader. Make it a <Button variant=\"transparent\"> or an <IconButton> from @trypattern/sdk/react, or a <Link> if it goes somewhere.";
+export declare const PRIMITIVE_NAMES_MESSAGE = "{name} is a primitive in @trypattern/sdk/react; a second one with the same name would drift from it. Import the SDK's, and if yours adds something (a fixed icon, a confirm step) name it for what it does, like DeleteIssue{name}, and render the SDK {name} inside.";
+export declare const USE_SPACE_TOKENS_MESSAGE = "Paddings, gaps and margins come from space in @trypattern/sdk/tokens.stylex (space.sm, space.lg), never a number, so one theme can make the whole app roomier or tighter. Write 0 or auto for none, and calc() over tokens for a negative margin: `calc(-1 * ${space.sm})`.";
+export declare const USE_SIZE_TOKENS_MESSAGE = "Heights, widths, font sizes and line heights read a token (controls.heightMd, iconSizes.md, widths.contentMd, lineHeights.bodySm), or are a percentage, auto or calc() over tokens, so re-valuing a scale in the app's theme moves every piece together and rows still line up.";
+export declare const THEME_SCALES_MESSAGE = "src/theme/theme.ts may re-value the size scales (space, fontSizes, lineHeights, controls, iconSizes, borders, widths) as well as colors, radii, fonts and shadows, and Pattern checks the result against the SDK defaults it leaves alone: every value is whole pixels, each scale only grows from one step to the next, a control is at least as tall as the text and icon inside it, and a line height is at least its font size. Each finding names the two values that disagree; change one of them.";
+export declare const TEXT_VIA_TEXT_MESSAGE = "Words are drawn with <Text variant=\"label\"> from @trypattern/sdk/react, never with font, line height, alignment or wrapping properties in a style, so every app has one set of text styles and the theme can resize them all at once. Pick the variant closest to what you meant (heading, subheading, title, label, body, caption, code), its tone for the colour, and align, isTruncated or isSelectable for the rest. If none fits, that is an SDK change.";
+export declare const TEXT_ELEMENTS_MESSAGE = "Write <Text as=\"h1\" variant=\"heading\"> or <Text as=\"p\"> from @trypattern/sdk/react instead of this element. `as` says what the words are for screen readers and `variant` how they look, so a heading never needs a style of its own. A form label comes from the field: <TextField label=\"Email\">.";
+export declare const LOOSE_TEXT_MESSAGE = "Words inside a plain element are drawn with whatever style happens to surround them. Wrap them in <Text> from @trypattern/sdk/react (<Text tone=\"secondary\">Unassigned</Text>), or pass them to the primitive that shows them (<Button>Save</Button>, <Badge>3</Badge>).";
+export declare const COMPOSE_IN_SCREENS_MESSAGE = "A screen or layout arranges primitives (Screen, Content, Stack, Row, Card, Text, Button, AppFrame, Toaster and the rest from @trypattern/sdk/react) and the pieces in src/components; it draws nothing itself, so it has no styles, no tokens and no plain elements like <div>. If a screen needs a shape no primitive gives it, make it a piece in src/components/<Name>/ and use that here, so the design system can list it.";
+export declare const NO_HOVER_IN_APP_MESSAGE = "Only primitives react to the pointer and to focus. A thing that highlights on hover is a Button, IconButton, ListRow or Link from @trypattern/sdk/react, which already have the hover, press and focus looks, so every clickable thing in the app feels the same.";
+export declare const TOASTER_ONCE_MESSAGE = "Toasts need exactly one place to appear: render <Toaster /> from @trypattern/sdk/react once, in the layout that wraps every page (src/layouts/AppLayout.tsx), so a toast shows whichever page is open and never twice.";

package/dist/rules/messages.js

@@ -0,0 +1,48 @@
+export const SRC_STRUCTURE_MESSAGE = 'src/ follows the four layers, one folder each, and each folder holds only its kind. Data comes from the server through stores: Pattern gives every table in schema.ts a store, and stores/ holds the others as <Name>.ts with a class extending Store({ state, persist }) (stores/Toasts.ts, stores/IssuesView.ts), listed in `stores` in stores/index.ts; a store reaches the app’s own server calls as this.services.<group>.<call>(). services/ holds the app’s own server calls, declared once with their inputs, replies and the memory fake flows run against: services/<group>.ts holds defineServices({ <group>: { ... } }) and its memory handlers, and services/index.ts exports `services` and `memory` for App.ts (server/<group>.ts serves them with serveServices). Stores call them; models never do. models/ holds each model, the state, answers and commands behind a screen or app chrome, as <Name>.ts with a class extending Model({ state, persist }) (models/IssueList.ts holds class IssueList), listed in `models` in models/index.ts under the route id of its page. actions/ holds the menu entries and shortcuts, one file per thing they act on (actions/issues.ts, actions/appearance.ts), each `export const issueActions = defineActions(({ page, models }) => [...])`, listed in `actions` in actions/index.ts. screens/ holds the pages you see, one file each, named <Name>Screen.tsx (IssueListScreen.tsx), each reading its model with useModel and arranging primitives, with no styles of its own. components/<Name>/ groups the pieces this app adds, and every file in it starts with the folder name (components/IssueList/IssueListRow.tsx); they take props, and only screens and layouts may call useModel. layouts/ holds <Name>Layout.tsx files (layouts/AppLayout.tsx), the frames pages render inside: which pages need sign-in, the sidebar or top bar, and where the Toaster and CommandPalette go. A piece may draw a shape no primitive gives, with tokens for every value, <Text> for its words and primitives for anything clickable. App.ts wires the app together from tables, services, stores, models, routes and actions. hooks/ holds hooks (use<Name>.ts); lib/ holds non-UI helpers and data (.ts only); theme/ holds theme.ts (the tokens this app re-values) and icons.ts (the icons this app adds). Primitives (Screen, Stack, Text, Button, Menu, Icon) come from @trypattern/sdk/react and are not in this project. Styles live only at the bottom of the component file that owns them; there are no style files. To reuse a look, reuse the component. Move the file where it belongs.';
+export const SCRIPTS_WIRED_MESSAGE = 'A project script lives in a labelled folder under scripts/ (a folder named for what it does) and is used by something: package.json, the app launcher, vite.config.ts, flows/, or another script. Delete scripts nothing uses; never leave one-off scripts behind. Checks and tools every Pattern app needs belong in @trypattern/sdk, not here.';
+export const NO_COMMENTS_MESSAGE = 'Comments are not allowed in Pattern, including directives like @ts-expect-error or oxlint-disable: there are no escape hatches, fix the code. Express intent with names, types and structure; put lasting rationale in the error message of the rule that enforces it, or in the commit message.';
+export const NO_POINTER_CURSOR_MESSAGE = 'cursor: pointer is not allowed in Pattern. Pattern apps feel native, and native apps keep the default arrow over links and buttons. Remove it; the reset Pattern ships already sets cursor: default.';
+export const USE_COLOR_TOKEN_MESSAGE = 'Raw colors are not allowed in styles. Use a token from @trypattern/sdk/tokens.stylex (colors.*). To change what a token looks like in this app, re-value it in src/theme/theme.ts, the one file where raw colors are allowed. Keywords like transparent and currentColor are fine.';
+export const USE_FONT_TOKEN_MESSAGE = 'Raw font sizes, families and weights are not allowed in styles. Use fontSizes.*, fonts.* or fontWeights.* from @trypattern/sdk/tokens.stylex; to change a font or a size for the whole app, re-value it in src/theme/theme.ts. Text inherits Inter 13px/20px (15px/24px on phones) from <body>, so most styles need no font properties at all.';
+export const NO_INTERACTIVE_TRANSITION_MESSAGE = 'Hover and press transitions use the motion tokens, as Interfere does: motion.fast with motion.easeOut for buttons, motion.instant for fields, motion.base for segmented controls. Never a raw duration or easing, so every control responds at the same speed. Navigation items change instantly with no transition.';
+export const HOVER_USES_HIGHLIGHT_MESSAGE = 'Hover, active and selected backgrounds must be colors.transparentHover (with radii.md), so hovering then selecting an item never flashes a second color. Styles named *Active, *Selected or *Current count as selected. Buttons and switches, which have no selected state, may instead use their own colors.*Hover and colors.*Active tokens.';
+export const SCROLL_VIEW_ONLY_MESSAGE = 'Only ScrollArea may scroll (overflow auto/scroll). The page itself never scrolls or bounces in Pattern; wrap scrollable content in <ScrollArea> from @trypattern/sdk/react.';
+export const SELECTABLE_ONLY_MESSAGE = 'Do not set userSelect. Text is not selectable by default in Pattern (inputs and editable fields are). For words people need to copy, write <Text isSelectable> from @trypattern/sdk/react.';
+export const USE_BREAKPOINTS_MESSAGE = 'Media queries come from breakpoints in @trypattern/sdk/tokens.stylex, e.g. [breakpoints.compact]: value, so every screen adapts at the same sizes.';
+export const DARK_MODE_IN_TOKENS_MESSAGE = 'Dark mode lives only in the color tokens: each is light-dark(lightValue, darkValue), in @trypattern/sdk/tokens.stylex and in the overrides in src/theme/theme.ts. The Appearance setting sets color-scheme on <html>, which picks the side. Components never branch on the color scheme.';
+export const NO_CLASSNAME_STRINGS_MESSAGE = 'Hand-written class names are not allowed. Style with StyleX: {...stylex.props(styles.x)}, or className={stylex.props(...).className} where a component needs a className.';
+export const TYPED_STYLE_PROP_MESSAGE = 'A `style` prop must be StyleXStyles<{ ...allowed properties }> (directly or via a type alias), so callers can only override what the component allows and anything else is a type error. Merge it last: {...stylex.props(styles.x, style)}.';
+export const COMPONENT_FILE_NAME_MESSAGE = 'Each .tsx file under src/components and src/screens holds one component, exported as a named function with the same name as the file (Sidebar.tsx exports function Sidebar).';
+export const COMPONENT_FIRST_MESSAGE = 'A component file reads top to bottom: imports, its props type, then the component, so the first thing a reader sees is what the file draws. Constants and helper functions it uses (sortOptions, LOADING_ROWS, sectionsOf) go below the component, above `styles`.';
+export const ROUTES_UNDER_APP_LAYOUT_MESSAGE = "Every route is a child of AppLayout (src/layouts/AppLayout.tsx) in `routes = defineRoutes([...])` in src/routes.tsx, directly or through another layout from src/layouts/ (a route with a Component and children but no path), so every page sits inside a layout the app chose. Add a page as { id, path, Component } inside the children of the layout it belongs to, above the * route. Its id is the page name the snapshot reports (page: 'issues'), and opening it calls onPageOpen() on the model with the same name in src/models/index.ts, if there is one. A sidebar entry goes in the `navigation` answer of the layout model in src/models/Layout.ts.";
+export const NO_ROUTE_DATA_APIS_MESSAGE = "React Router is used in data mode without loaders, actions or lazy routes: models own the state, so router-managed data would compete with it. Load data in the model's onPageOpen() instead.";
+export const USE_LINK_MESSAGE = 'Use <Link to="..."> from @trypattern/sdk/react for in-app navigation, not <a href="/...">, so navigation stays client-side and looks like every other link. A whole row that opens a page is a <ListRow to="...">.';
+export const STORES_IN_APP_MESSAGE = "Only src/stores/index.ts (the `stores` list) and src/App.ts may import values from src/stores/. Every model reads every store as this.stores.<name>; a screen reads its model with useModel('issueList'). Import types from stores freely (import type).";
+export const DEV_ONLY_SIGN_IN_MESSAGE = 'The server has exactly one dev-only switch, inside @trypattern/sdk: createServer mounts /api/auth/dev-sign-in only in the dev server. Nothing in server/ may branch on dev mode, so there is never an "if dev, skip auth" path. To test as a signed-in user, run `app sign-in <email>` (or a flow, which signs in as ada@acme.test by default): it sets the real session cookie, so the real auth code runs.';
+export const STATE_VIA_HOOKS_MESSAGE = "A screen reads only its model: const issueList = useModel('issueList'), then issueList.issues, issueList.isLoading and issueList.createIssue(). Reading .state, .models, .stores or getSnapshot() directly does not subscribe, so the screen would show stale data. If the screen needs something from a store, add a getter for it to the model.";
+export const CLASSES_NOT_FACTORIES_MESSAGE = 'A function that returns an object of methods is a class in disguise: write it as a class, with private fields for its state and methods for its behaviour. One shape for everything that has state keeps the codebase predictable. Plain functions are for pure helpers that compute a value (sortProjects, newClientSideId).';
+export const ACCESS_FLOWS_MESSAGE = "flows/Access.flow.ts runs Pattern's generated access flows, which prove every table's access rules against the seed on each app test. Keep it: `import { accessFlows } from '@trypattern/sdk/flows'` and `accessFlows({ App })`.";
+export const SCHEMA_TABLES_MESSAGE = "schema.ts defines every saved table in one place and says who may do what: `export const tables = defineTables({ issues: { columns: { title: z.string() }, access: { read: 'signedIn', create: 'signedIn', update: 'signedIn', delete: 'signedIn' }, writes: 'optimistic' } })`. It exports a row type for each table, named for one row (`export type Issue = Row<typeof tables.issues>`), and the emails of the people who run the app, `export const admins: string[] = []`, even when there are none yet, so the question is answered on purpose. Add the line shown.";
+export const NO_UNUSED_EXPORTS_MESSAGE = 'Export only what another file imports. Nothing imports this, so remove `export` (and the code itself if this file does not use it either). Unused exports hide dead code and make a file look like it offers more than it does. Pattern reads `tables` from schema.ts and `seed` from seed.ts, and vite.config.ts and server/worker.ts default-export their config, so those stay.';
+export const NO_RE_EXPORTS_MESSAGE = 'Do not pass imports through: a file exports only what it defines. Import the thing from where it lives instead (command from @trypattern/sdk, a component from its own file), so every import names the real source. server/worker.ts is the one exception: Cloudflare runs the Workflow and Durable Object classes its Worker exports, so it may export them from where they live.';
+export const EXPLICIT_ACCESS_MESSAGE = 'Mark every class member public or private (or protected, to override a base class member), so a reader sees at a glance what other code may call: `public setSort = command(...)`, `public override onPageOpen()`, `private loadIssues()`. Use the word private, never #name, so there is one way to say it. Constructors need neither.';
+export const IMPORT_FROM_ROOT_MESSAGE = 'Import project files by their path from the project root, the way errors and docs name them: `@/src/models/Issues.ts`, `@/schema.ts`. `./File.ts` is fine for a file in the same folder; never `../` or `./folder/File.ts`, so every import says exactly where the file is and moving a file never breaks the files beside it.';
+export const MODEL_MEMBERS_MESSAGE = 'A model shows the outside world three kinds of public member, so a reader can tell them apart at a glance: getters are its answers (public get hasNext()), command() fields are what it can do (public openNext = command(() => ...)), and onPageOpen() runs when its page opens. Everything else is private, and a private helper that works something out is a method (private neighbours()), never a getter, because Pattern publishes every getter to the screen and the snapshot. A model has no `actions`: menu entries and shortcuts live in src/actions/.';
+export const MODEL_BY_NAME_MESSAGE = "Keep the model whole and read it by name: const issueList = useModel('issueList'), then issueList.isLoading and onClick={issueList.createIssue}. Destructuring it hides where each value comes from and leaves loose names a reader has to trace back.";
+export const USE_MODEL_WHERE_MESSAGE = 'useModel is for screens (src/screens/) and layouts (src/layouts/). Other components take what they show as props and the commands they call as callbacks, so the screen decides what they read: <IssueListRow issue={issue} onDelete={issueList.deleteIssue} />.';
+export const PURE_GETTERS_MESSAGE = 'A getter works an answer out from this.state and this.stores.<name>.state and nothing else. It never changes anything (this.set, a store method, this.app.navigate), never waits, and never reads the clock, randomness or a private field, because Pattern caches each getter until the state it read changes, and flows compare its value. Put the change in a command.';
+export const ACTIONS_WHERE_MESSAGE = "Menu entries and shortcuts are actions, and actions live only in src/actions/: one file per thing they act on, `export const issueActions = defineActions(({ page, models }) => [action({ id: 'issues.next', label: 'Next issue', keys: ['j'], send: [{ type: 'issueDetail.openNext' }] })])`, listed in src/actions/index.ts. If a person can see it in a menu or press a key for it, it is an action; what it does is a command on a model, and an action only sends commands. Models never build actions.";
+export const PURE_ACTIONS_MESSAGE = "An actions file works its entries out from `page` and `models` (each model's state and answers) and nothing else, because Pattern reruns it only when something it read changes, and flows compare the result. It never waits, never uses `this`, never reads the clock or randomness, and imports only types from src/models/, src/stores/ and src/components/. If an entry needs something a model does not answer yet, add a getter to that model.";
+export const USE_PRIMITIVES_MESSAGE = "Write <Button>, <IconButton>, <TextField>, <Select>, <Switch> or <Dialog> from @trypattern/sdk/react instead of this element. The primitives carry the focus, keyboard, disabled, pending and error behaviour and the design system's look, so a screen only says what the control does. If no primitive fits, the gap is in the SDK; do not build around it here.";
+export const NO_WIDGET_ROLES_MESSAGE = 'This role rebuilds a primitive by hand. Use the component from @trypattern/sdk/react with that behaviour (Button, Switch, Menu, Tooltip, Dialog, Divider, CommandMenu): it already has the role, the keyboard handling and the focus management, and it will keep working when the SDK is upgraded.';
+export const NO_CLICK_ON_STATIC_MESSAGE = 'A click on a <div> or <span> cannot be reached from the keyboard or by a screen reader. Make it a <Button variant="transparent"> or an <IconButton> from @trypattern/sdk/react, or a <Link> if it goes somewhere.';
+export const PRIMITIVE_NAMES_MESSAGE = "{name} is a primitive in @trypattern/sdk/react; a second one with the same name would drift from it. Import the SDK's, and if yours adds something (a fixed icon, a confirm step) name it for what it does, like DeleteIssue{name}, and render the SDK {name} inside.";
+export const USE_SPACE_TOKENS_MESSAGE = 'Paddings, gaps and margins come from space in @trypattern/sdk/tokens.stylex (space.sm, space.lg), never a number, so one theme can make the whole app roomier or tighter. Write 0 or auto for none, and calc() over tokens for a negative margin: `calc(-1 * ${space.sm})`.';
+export const USE_SIZE_TOKENS_MESSAGE = "Heights, widths, font sizes and line heights read a token (controls.heightMd, iconSizes.md, widths.contentMd, lineHeights.bodySm), or are a percentage, auto or calc() over tokens, so re-valuing a scale in the app's theme moves every piece together and rows still line up.";
+export const THEME_SCALES_MESSAGE = 'src/theme/theme.ts may re-value the size scales (space, fontSizes, lineHeights, controls, iconSizes, borders, widths) as well as colors, radii, fonts and shadows, and Pattern checks the result against the SDK defaults it leaves alone: every value is whole pixels, each scale only grows from one step to the next, a control is at least as tall as the text and icon inside it, and a line height is at least its font size. Each finding names the two values that disagree; change one of them.';
+export const TEXT_VIA_TEXT_MESSAGE = 'Words are drawn with <Text variant="label"> from @trypattern/sdk/react, never with font, line height, alignment or wrapping properties in a style, so every app has one set of text styles and the theme can resize them all at once. Pick the variant closest to what you meant (heading, subheading, title, label, body, caption, code), its tone for the colour, and align, isTruncated or isSelectable for the rest. If none fits, that is an SDK change.';
+export const TEXT_ELEMENTS_MESSAGE = 'Write <Text as="h1" variant="heading"> or <Text as="p"> from @trypattern/sdk/react instead of this element. `as` says what the words are for screen readers and `variant` how they look, so a heading never needs a style of its own. A form label comes from the field: <TextField label="Email">.';
+export const LOOSE_TEXT_MESSAGE = 'Words inside a plain element are drawn with whatever style happens to surround them. Wrap them in <Text> from @trypattern/sdk/react (<Text tone="secondary">Unassigned</Text>), or pass them to the primitive that shows them (<Button>Save</Button>, <Badge>3</Badge>).';
+export const COMPOSE_IN_SCREENS_MESSAGE = 'A screen or layout arranges primitives (Screen, Content, Stack, Row, Card, Text, Button, AppFrame, Toaster and the rest from @trypattern/sdk/react) and the pieces in src/components; it draws nothing itself, so it has no styles, no tokens and no plain elements like <div>. If a screen needs a shape no primitive gives it, make it a piece in src/components/<Name>/ and use that here, so the design system can list it.';
+export const NO_HOVER_IN_APP_MESSAGE = 'Only primitives react to the pointer and to focus. A thing that highlights on hover is a Button, IconButton, ListRow or Link from @trypattern/sdk/react, which already have the hover, press and focus looks, so every clickable thing in the app feels the same.';
+export const TOASTER_ONCE_MESSAGE = 'Toasts need exactly one place to appear: render <Toaster /> from @trypattern/sdk/react once, in the layout that wraps every page (src/layouts/AppLayout.tsx), so a toast shows whichever page is open and never twice.';

package/dist/rules/themeTokens.d.ts

@@ -0,0 +1,6 @@
+export type TokenValue = {
+    value: string;
+    offset: number | undefined;
+};
+export declare function themeFileOf(root: string): string;
+export declare function themeTokens(root: string): Map<string, TokenValue>;

package/dist/rules/themeTokens.js

@@ -0,0 +1,64 @@
+import { existsSync, readFileSync } from 'node:fs';
+import { extname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import ts from 'typescript';
+const SDK_TOKENS_FILE = fileURLToPath(new URL(`../theme/tokens.stylex${extname(import.meta.filename)}`, import.meta.url));
+export function themeFileOf(root) {
+    return join(root, 'src', 'theme', 'theme.ts');
+}
+function objectEntries(literal) {
+    return literal.properties.flatMap((property) => ts.isPropertyAssignment(property) &&
+        (ts.isIdentifier(property.name) || ts.isStringLiteral(property.name)) &&
+        ts.isStringLiteralLike(property.initializer)
+        ? [
+            {
+                key: property.name.text,
+                value: property.initializer.text,
+                offset: property.getStart()
+            }
+        ]
+        : []);
+}
+function stylexCalls(path, name) {
+    const source = ts.createSourceFile(path, readFileSync(path, 'utf8'), ts.ScriptTarget.Latest, true);
+    const calls = [];
+    const visit = (node) => {
+        if (ts.isCallExpression(node) &&
+            ts.isPropertyAccessExpression(node.expression) &&
+            node.expression.name.text === name) {
+            const [first, second] = node.arguments;
+            const parent = node.parent;
+            const group = name === 'defineVars' &&
+                ts.isVariableDeclaration(parent) &&
+                ts.isIdentifier(parent.name)
+                ? parent.name.text
+                : first !== undefined && ts.isIdentifier(first)
+                    ? first.text
+                    : '';
+            const literal = name === 'defineVars' ? first : second;
+            if (literal !== undefined && ts.isObjectLiteralExpression(literal)) {
+                calls.push({ group, entries: objectEntries(literal) });
+            }
+        }
+        ts.forEachChild(node, visit);
+    };
+    visit(source);
+    return calls;
+}
+export function themeTokens(root) {
+    const tokens = new Map();
+    for (const { group, entries } of stylexCalls(SDK_TOKENS_FILE, 'defineVars')) {
+        for (const { key, value } of entries) {
+            tokens.set(`${group}.${key}`, { value, offset: undefined });
+        }
+    }
+    const themeFile = themeFileOf(root);
+    if (!existsSync(themeFile))
+        return tokens;
+    for (const { group, entries } of stylexCalls(themeFile, 'createTheme')) {
+        for (const { key, value, offset } of entries) {
+            tokens.set(`${group}.${key}`, { value, offset });
+        }
+    }
+    return tokens;
+}

package/dist/schema.d.ts

@@ -0,0 +1,4 @@
+export { call, defineServices } from './services.ts';
+export type { CallInput, CallReply, ServiceCall, ServiceMemory, Services } from './services.ts';
+export { defineTables } from './table.ts';
+export type { Access, Columns, Fields, Level, PublicRow, Row, Seed, Table, TableDefinition, TableOf, Tables, Value, Writes } from './table.ts';

package/dist/schema.js

@@ -0,0 +1,2 @@
+export { call, defineServices } from "./services.js";
+export { defineTables } from "./table.js";

package/dist/server/auth.d.ts

@@ -0,0 +1,115 @@
+import type { ServerEnv } from './env.ts';
+export declare const auth: import("hono/hono-base").HonoBase<ServerEnv, {
+    "/google": {
+        $get: {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 503;
+        } | {
+            input: {};
+            output: undefined;
+            outputFormat: "redirect";
+            status: 302;
+        };
+    };
+} & {
+    "/finish": {
+        $get: {
+            input: {};
+            output: undefined;
+            outputFormat: "redirect";
+            status: 302;
+        };
+    };
+} & {
+    "/email": {
+        $post: {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 400;
+        } | {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 503;
+        } | {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 429;
+        } | {
+            input: {};
+            output: {
+                ok: true;
+            };
+            outputFormat: "json";
+            status: import("hono/utils/http-status").ContentfulStatusCode;
+        };
+    };
+} & {
+    "/email/verify": {
+        $post: {
+            input: {};
+            output: {
+                isAdmin: boolean;
+                id: string;
+                name: string;
+                email: string;
+                avatarUrl: string | null;
+            };
+            outputFormat: "json";
+            status: import("hono/utils/http-status").ContentfulStatusCode;
+        } | {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 401;
+        };
+    };
+} & {
+    "/sign-out": {
+        $post: {
+            input: {};
+            output: {
+                ok: true;
+            };
+            outputFormat: "json";
+            status: import("hono/utils/http-status").ContentfulStatusCode;
+        };
+    };
+}, "/", "/sign-out">;
+export declare const devSignIn: import("hono/hono-base").HonoBase<ServerEnv, {
+    "/dev-sign-in": {
+        $post: {
+            input: {};
+            output: {
+                isAdmin: boolean;
+                id: string;
+                name: string;
+                email: string;
+                avatarUrl: string | null;
+            };
+            outputFormat: "json";
+            status: import("hono/utils/http-status").ContentfulStatusCode;
+        } | {
+            input: {};
+            output: {
+                error: string;
+            };
+            outputFormat: "json";
+            status: 400;
+        };
+    };
+}, "/", "/dev-sign-in">;

package/dist/server/auth.js

@@ -0,0 +1,134 @@
+import { Hono } from 'hono';
+import { deleteCookie, getCookie, setCookie } from 'hono/cookie';
+import { z } from 'zod';
+import { AUTH_URL, authServiceFor } from "./authService.js";
+import { forgetSession, readPass, startSession } from "./session.js";
+import { readTitle } from "./settings.js";
+import { deleteSession } from "./sessions.js";
+import { saveUser } from "./users.js";
+const GOOGLE_COOKIE = 'pattern_google';
+const EMAIL_COOKIE = 'pattern_email';
+const signInCookie = {
+    path: '/api/auth',
+    httpOnly: true,
+    secure: true,
+    sameSite: 'Lax',
+    maxAge: 600
+};
+const NOT_SET_UP = 'Sign-in is not set up for this app: it has no AUTH_SECRET. Pattern sets it when it deploys the app.';
+const GOOGLE_ONLY_DEPLOYED = 'Google sign-in goes through auth.trypattern.ai, which only knows deployed apps. Locally, sign in with an email code or run `app sign-in <email>`.';
+const googleFlow = z.object({ nonce: z.string(), next: z.string() });
+const emailBody = z.object({ email: z.email() });
+const codeBody = z.object({ code: z.string().regex(/^\d{6}$/) });
+const devSignInBody = z.object({ email: z.email() });
+function randomToken() {
+    const bytes = crypto.getRandomValues(new Uint8Array(32));
+    return btoa(String.fromCharCode(...bytes))
+        .replaceAll('+', '-')
+        .replaceAll('/', '_')
+        .replaceAll('=', '');
+}
+function safePath(path) {
+    return path !== undefined && path.startsWith('/') && !path.startsWith('//')
+        ? path
+        : '/';
+}
+function readGoogleFlow(c) {
+    const value = getCookie(c, GOOGLE_COOKIE);
+    if (value === undefined)
+        return undefined;
+    try {
+        const parsed = googleFlow.safeParse(JSON.parse(value));
+        return parsed.success ? parsed.data : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
+function hostnameOf(c) {
+    return new URL(c.req.url).hostname;
+}
+async function signIn(c, person) {
+    const user = await saveUser(c.env.DB, person);
+    await startSession(c, user);
+    return { ...user, isAdmin: c.get('admins').has(user.email) };
+}
+export const auth = new Hono()
+    .get('/google', (c) => {
+    if (c.env.AUTH_SECRET === undefined) {
+        return c.json({ error: GOOGLE_ONLY_DEPLOYED }, 503);
+    }
+    const nonce = randomToken();
+    const next = safePath(c.req.query('next'));
+    setCookie(c, GOOGLE_COOKIE, JSON.stringify({ nonce, next }), signInCookie);
+    const start = new URL('/google', AUTH_URL);
+    start.searchParams.set('hostname', hostnameOf(c));
+    start.searchParams.set('state', nonce);
+    return c.redirect(start.href);
+})
+    .get('/finish', async (c) => {
+    const flow = readGoogleFlow(c);
+    deleteCookie(c, GOOGLE_COOKIE, signInCookie);
+    const { code, state } = c.req.query();
+    const service = authServiceFor(c.env);
+    if (flow === undefined ||
+        service === undefined ||
+        code === undefined ||
+        state !== flow.nonce) {
+        return c.redirect('/');
+    }
+    const found = await service.exchange(code);
+    if (found === undefined || found.hostname !== hostnameOf(c)) {
+        return c.redirect('/');
+    }
+    await signIn(c, found.identity);
+    return c.redirect(flow.next);
+})
+    .post('/email', async (c) => {
+    const parsed = emailBody.safeParse(await c.req.json());
+    if (!parsed.success) {
+        return c.json({ error: 'Enter a valid email address.' }, 400);
+    }
+    const service = authServiceFor(c.env);
+    if (service === undefined)
+        return c.json({ error: NOT_SET_UP }, 503);
+    const appName = await readTitle(c.env.DB);
+    const sent = await service.sendCode({
+        email: parsed.data.email.toLowerCase(),
+        hostname: hostnameOf(c),
+        ...(appName === '' ? {} : { appName })
+    });
+    if (sent === undefined) {
+        return c.json({ error: 'Couldn’t send a code to that address.' }, 429);
+    }
+    setCookie(c, EMAIL_COOKIE, sent.challenge, signInCookie);
+    return c.json({ ok: true });
+})
+    .post('/email/verify', async (c) => {
+    const parsed = codeBody.safeParse(await c.req.json());
+    const challenge = getCookie(c, EMAIL_COOKIE);
+    const service = authServiceFor(c.env);
+    const identity = !parsed.success || challenge === undefined || service === undefined
+        ? undefined
+        : await service.verifyCode({ challenge, code: parsed.data.code });
+    if (identity === undefined) {
+        return c.json({ error: 'That code is wrong or has expired.' }, 401);
+    }
+    deleteCookie(c, EMAIL_COOKIE, signInCookie);
+    return c.json(await signIn(c, identity));
+})
+    .post('/sign-out', async (c) => {
+    const pass = await readPass(c);
+    if (pass !== undefined)
+        await deleteSession(c.env.DB, pass.sessionId);
+    forgetSession(c);
+    return c.json({ ok: true });
+});
+export const devSignIn = new Hono().post('/dev-sign-in', async (c) => {
+    const parsed = devSignInBody.safeParse(await c.req.json());
+    if (!parsed.success) {
+        return c.json({ error: z.prettifyError(parsed.error) }, 400);
+    }
+    const { email } = parsed.data;
+    return c.json(await signIn(c, { email, name: null, avatarUrl: null }));
+});

package/dist/server/authService.d.ts

@@ -0,0 +1,9 @@
+import type { ServerBindings } from './env.ts';
+import type { ExchangeReply, SendCodeReply, SendCodeRequest, VerifiedIdentity, VerifyCodeRequest } from './signInWire.ts';
+export declare const AUTH_URL = "https://auth.trypattern.ai";
+export type AuthService = {
+    exchange: (code: string) => Promise<ExchangeReply | undefined>;
+    sendCode: (request: SendCodeRequest) => Promise<SendCodeReply | undefined>;
+    verifyCode: (request: VerifyCodeRequest) => Promise<VerifiedIdentity | undefined>;
+};
+export declare function authServiceFor(env: ServerBindings): AuthService | undefined;

package/dist/server/authService.js

@@ -0,0 +1,50 @@
+import { exchangeReply, sendCodeReply, verifyCodeReply } from "./signInWire.js";
+export const AUTH_URL = 'https://auth.trypattern.ai';
+function httpAuthService(secret) {
+    async function post(path, body, reply) {
+        const response = await fetch(`${AUTH_URL}${path}`, {
+            method: 'POST',
+            headers: {
+                authorization: `Bearer ${secret}`,
+                'content-type': 'application/json'
+            },
+            body: JSON.stringify(body)
+        });
+        if (!response.ok)
+            return undefined;
+        const parsed = reply.safeParse(await response.json());
+        return parsed.success ? parsed.data : undefined;
+    }
+    return {
+        exchange: (code) => post('/exchange', { code }, exchangeReply),
+        sendCode: (request) => post('/email/send', request, sendCodeReply),
+        verifyCode: async (request) => (await post('/email/verify', request, verifyCodeReply))?.identity
+    };
+}
+const devCodes = new Map();
+function sixDigits() {
+    const [value = 0] = crypto.getRandomValues(new Uint32Array(1));
+    return String(value % 1_000_000).padStart(6, '0');
+}
+const devAuthService = {
+    exchange: async () => undefined,
+    sendCode: async ({ email }) => {
+        const challenge = crypto.randomUUID();
+        const code = sixDigits();
+        devCodes.set(challenge, { email, code });
+        console.log(`Sign-in code for ${email}: ${code}`);
+        return { challenge };
+    },
+    verifyCode: async ({ challenge, code }) => {
+        const sent = devCodes.get(challenge);
+        if (sent === undefined || sent.code !== code)
+            return undefined;
+        devCodes.delete(challenge);
+        return { email: sent.email, name: null, avatarUrl: null, via: 'email' };
+    }
+};
+export function authServiceFor(env) {
+    if (env.AUTH_SECRET !== undefined)
+        return httpAuthService(env.AUTH_SECRET);
+    return import.meta.env.DEV ? devAuthService : undefined;
+}