Server App

Use this shape for authenticated Hono apps and workflows where the server owns state.

Recipe docsRecipes

Required Packages

@macavitymadcap/hyper-dank-ui for server-rendered controls, panels, forms, menus, and status views.
@macavitymadcap/hyper-dank-transport for form values, route params, HTMX detection, and progressive redirects.
@macavitymadcap/hyper-dank-data for provider lifecycle, migration planning, repository contracts, and adapter test harnesses.
@macavitymadcap/hyper-dank-automation for verification gates, local server readiness, Pa11y, screenshots, and PR evidence.

import { Button, FormField, HxForm, Panel } from "@macavitymadcap/hyper-dank-ui";

export function SettingsPanel() {
  return (
    <Panel labelledBy="settings-heading">
      <h2 id="settings-heading">Settings</h2>
      <HxForm action="/settings" method="post" hx-post="/settings" hx-target="#settings-panel">
        <FormField id="display-name" label="Display name" name="displayName" required />
        <Button type="submit">Save</Button>
      </HxForm>
    </Panel>
  );
}

App-Owned Responsibilities

Keep auth, permissions, domain validation, route names, schemas, services, repositories, seeded users, and deployment targets in the app.

Verification

Use route tests for full pages, HTMX contract tests for fragments, repository contract tests for adapter behaviour, Playwright for browser journeys, and Pa11y for user-facing screens.

References

UI, Transport, Data, Automation, and Storybook.