oasbox

The in-project CLI for Obsidian Arrow projects — a small, deterministic generator and validator for components, views, and stories. Package-manager agnostic (pnpm / npm / bun / yarn) and installed as a local devDependency by create-obsidian-arrow, so its behavior is pinned and reproducible for humans and agents alike.

Install

Scaffolds created with create-obsidian-arrow already include oasbox as a devDependency. To add it manually:

pnpm add -D oasbox     # or: npm i -D oasbox / bun add -d oasbox

Commands

| Command | What it does | |---|---| | oasbox generate component <Name> [--css] | Scaffold a component (primitive or composed) → src/components/<Name>/. Parent/Child → view-scoped component under src/views/<Parent>/. | | oasbox generate view <Name> [--editor] | Scaffold a full-pane view (+ story), born with the portable 3-zone oas-shell-view (pinned header, scrolling body, pinned footer). --editor → body capped at readableWidth: true (readable line width). | | oasbox generate story <Name> [--kind view\|component] | Story file only, for existing source. | | oasbox validate [--json] | Run CSS-orphan / scope / import checks + typecheck. --json for machine-readable output. | | oasbox test / oasbox dev | Pass-throughs to the project's package manager (auto-detected from the lockfile). |

Run via the local bin (oasbox …) or your package manager: pnpm oasbox … · npx oasbox … · bunx oasbox ….

What generate produces

oasbox generate view Notes            oasbox generate component Badge --css
└─ src/views/Notes/                    └─ src/components/Badge/
   ├─ Notes.ts                            ├─ Badge.ts
   ├─ Notes.css                           └─ Badge.css
   └─ state.ts                         └─ stories/components/Badge.stories.ts
└─ stories/views/Notes.stories.ts
   (kind: "view")

flowchart LR
  M["command flags"] --> K{"kind ?"}
  K -- "component" --> C["src/components/… + story"]
  K -- "view" --> S{"--editor ?"}
  S -- "no" --> P["view · full-bleed"]
  S -- "yes" --> E["view · readableWidth (oas-readable-width)"]

License

MIT