first commit

.gitignore

@@ -0,0 +1,5 @@
+node_modules/
+dist/
+generated/
+.DS_Store
+*.log

.opencode/.gitignore

@@ -0,0 +1,4 @@
+/node_modules/
+/package.json
+/package-lock.json
+/bun.lock*

.opencode/skills/likec4/SKILL.md

@@ -0,0 +1,25 @@
+---
+name: likec4
+description: Use when reading, creating, reviewing, or modifying LikeC4 *.c4 files. Enforces LikeC4 nomenclature, syntax, modeling conventions, and recommended practices.
+---
+
+# LikeC4 modeling
+
+Before changing any `*.c4` file:
+
+1. Read `references/llms.txt` to locate the relevant documentation.
+2. Consult the applicable sections of `references/llms-full.txt`.
+3. Inspect the existing project models and follow `docs/modeling-conventions.md`.
+4. Use documented LikeC4 syntax rather than guessing.
+5. Follow LikeC4-recommended modeling practices.
+6. After editing, run `npm run validate` and resolve any errors caused by the change.
+
+Pay particular attention to:
+
+- element and relationship syntax
+- specification and model boundaries
+- views and predicates
+- deployment models
+- identifiers, titles, and naming conventions
+- supported styling and metadata
+- deprecated or discouraged syntax

.opencode/skills/likec4/references/llms.txt

@@ -0,0 +1,43 @@
+# LikeC4 Documentation
+
+- [Project config](https://likec4.dev/dsl/config/)
+- [Multi-projects](https://likec4.dev/dsl/config/multi-projects/)
+- [TypeScript/JavaScript Config](https://likec4.dev/dsl/config/programmatic/)
+- [Deployment Model](https://likec4.dev/dsl/deployment/model/)
+- [Deployment views](https://likec4.dev/dsl/deployment/views/)
+- [Extending model](https://likec4.dev/dsl/extend/)
+- [Introduction](https://likec4.dev/dsl/intro/)
+- [Model](https://likec4.dev/dsl/model/)
+- [View Notations](https://likec4.dev/dsl/notations/)
+- [References](https://likec4.dev/dsl/references/)
+- [Relationships](https://likec4.dev/dsl/relationships/)
+- [Specification](https://likec4.dev/dsl/specification/)
+- [Styling](https://likec4.dev/dsl/styling/)
+- [Views](https://likec4.dev/dsl/views/)
+- [Generated Views](https://likec4.dev/dsl/views-generated/)
+- [Dynamic views](https://likec4.dev/dsl/views/dynamic/)
+- [Organize views](https://likec4.dev/dsl/views/organize/)
+- [View Predicates](https://likec4.dev/dsl/views/predicates/)
+- [Deploy to GitHub Pages](https://likec4.dev/guides/deploy-github-pages/)
+- [Embed to website](https://likec4.dev/guides/embed-to-website/)
+- [Preview changes in PR](https://likec4.dev/guides/preview-changes-in-pr/)
+- [Deploy a static website](https://likec4.dev/guides/static-website/)
+- [Enforce and validate your model](https://likec4.dev/guides/validate-your-model/)
+- [LikeC4](https://likec4.dev/index/)
+- [AI Tools](https://likec4.dev/tooling/ai-tools/)
+- [LikeC4 CLI](https://likec4.dev/tooling/cli/)
+- [Custom Generators](https://likec4.dev/tooling/code-generation/custom/)
+- [Generate LikeC4Model](https://likec4.dev/tooling/code-generation/model/)
+- [Generate React](https://likec4.dev/tooling/code-generation/react/)
+- [Generate Web Components](https://likec4.dev/tooling/code-generation/webcomponent/)
+- [AspireC4](https://likec4.dev/tooling/community/aspirec4/)
+- [Erode](https://likec4.dev/tooling/community/erode/)
+- [MkDocs plugin](https://likec4.dev/tooling/community/mkdocs-plugin/)
+- [LikeC4 Docker](https://likec4.dev/tooling/docker/)
+- [Draw.io integration](https://likec4.dev/tooling/drawio/)
+- [Editors](https://likec4.dev/tooling/editors/)
+- [GitHub Actions](https://likec4.dev/tooling/github/)
+- [LikeC4 API](https://likec4.dev/tooling/model-api/)
+- [React Components](https://likec4.dev/tooling/react/)
+- [LikeC4 Vite Plugin](https://likec4.dev/tooling/vite-plugin/)
+- [Getting Started](https://likec4.dev/tutorial/)

AGENTS.md

@@ -0,0 +1,11 @@
+# Project instructions
+
+## LikeC4 files
+
+For every task that reads, creates, reviews, or modifies a `*.c4` file:
+
+- Load the `likec4` skill before proposing or making changes.
+- Consult the LikeC4 documentation bundled with that skill.
+- Do not infer LikeC4 syntax from similar architecture DSLs.
+- Follow `docs/modeling-conventions.md` and keep it synchronized with `src/specification.c4`.
+- Run `npm run validate` after changes and resolve any resulting errors.

README.md

@@ -0,0 +1,65 @@
+# LikeC4 template
+
+A small, vendor-neutral starter for describing software architecture with LikeC4. The included fictional Parcel Workshop model demonstrates a system boundary, two services, one relationship kind, and one view without prescribing a real architecture.
+
+## Prerequisites
+
+- Node.js 22.22.3 or newer
+- npm
+
+## Setup
+
+```bash
+npm ci
+npm start
+```
+
+The development viewer serves the model locally and reloads when LikeC4 sources change.
+
+## Scripts
+
+| Command | Purpose |
+| --- | --- |
+| `npm start` | Start the local LikeC4 viewer. |
+| `npm run dev` | Start the local LikeC4 viewer. |
+| `npm run validate` | Validate the model. |
+| `npm run format` | Format LikeC4 sources. |
+| `npm run format:check` | Check LikeC4 source formatting. |
+| `npm run build` | Build the static viewer into `dist/`. |
+| `npm run export:drawio` | Export Draw.io files into `generated/drawio/`. |
+| `npm run export:png` | Export PNG files into `generated/png/`. |
+| `npm run export:json` | Export the model into `generated/model.json`. |
+
+## Layout
+
+```text
+likec4-template/
+|-- .opencode/skills/likec4/  LikeC4 guidance for OpenCode
+|-- docs/modeling-conventions.md
+|-- src/specification.c4      Element and relationship kinds
+|-- src/model.c4              Architecture elements and relationships
+|-- src/views.c4              Diagram views
+|-- AGENTS.md                 Project instructions for OpenCode
+|-- likec4.config.json        LikeC4 project configuration
+|-- opencode.json             OpenCode project configuration
+|-- package.json              npm scripts and LikeC4 dependency
+`-- package-lock.json         Reproducible npm dependency lock
+```
+
+## Replace the starter
+
+1. Replace the fictional elements and relationships in `src/model.c4`.
+2. Keep only the kinds used by your model in `src/specification.c4`.
+3. Update `src/views.c4` to show the perspectives your readers need.
+4. Keep the relationship-kind table in `docs/modeling-conventions.md` synchronized with the specification.
+5. Run `npm run format`, `npm run validate`, and `npm run build`.
+
+LikeC4 merges source files, so a larger model can be split into additional `*.c4` files under `src/` while retaining the specification/model/views separation.
+
+## Generated output
+
+Build output is written to `dist/`; exports are written to `generated/`. Both directories are ignored by Git and can be recreated from the model sources.
+
+## OpenCode support
+
+`opencode.json` loads the project instructions in `AGENTS.md`. The bundled `.opencode/skills/likec4/` skill supplies LikeC4 documentation and directs model changes to follow `docs/modeling-conventions.md` and pass `npm run validate`.

docs/modeling-conventions.md

@@ -0,0 +1,48 @@
+# LikeC4 modeling conventions
+
+These conventions keep a model readable and consistent as it grows.
+
+## Relationship direction
+
+Arrows point from the initiating element to the receiving element:
+
+> initiator -> receiver
+
+A normal response to a request is implicit. Model a reverse relationship only when it represents an independent architectural interaction.
+
+Use the most specific useful endpoints. Prefer a parent element when implementation detail would make the view harder to read.
+
+## Relationship labels
+
+- Give every relationship a concise, active, present-tense label.
+- Prefer precise verbs over the generic `uses`.
+- Describe one architectural responsibility per relationship.
+- Put protocols and communication technologies in the relationship's `technology` property rather than its title.
+
+## Relationship kinds
+
+Use the smallest applicable relationship kind from `src/specification.c4`:
+
+| Kind | Meaning |
+| --- | --- |
+| `sends` | Transfers a request or message to another service. |
+
+The relationship title describes the specific interaction; the kind provides consistent classification.
+
+```likec4
+intakeDesk .sends routingDesk 'forwards sorting requests'
+```
+
+Do not introduce a relationship kind for a single exceptional interaction. Add one only when it captures a recurring architectural distinction, and update this table in the same change.
+
+## Static and dynamic views
+
+Static views show enduring dependencies and interactions. Use dynamic views when sequence, timing, callbacks, or a multi-step scenario is the subject of the diagram.
+
+## Visual styling
+
+Relationship semantics come from direction, kind, and label, not color alone. Keep styling simple unless a visual distinction materially improves a view.
+
+## Validation
+
+Run `npm run validate` after every model change. LikeC4 validation checks model correctness, but these project-specific naming and labeling conventions still require review.

likec4.config.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "https://likec4.dev/schemas/config.json",
+  "name": "likec4-template",
+  "title": "LikeC4 Template",
+  "exclude": [
+    "**/node_modules/**",
+    "**/dist/**",
+    "**/generated/**"
+  ]
+}

opencode.json

@@ -0,0 +1,4 @@
+{
+  "$schema": "https://opencode.ai/config.json",
+  "instructions": ["AGENTS.md"]
+}

package.json

@@ -0,0 +1,23 @@
+{
+  "name": "likec4-template",
+  "version": "0.1.0",
+  "private": true,
+  "description": "A neutral starter project for LikeC4 architecture models",
+  "engines": {
+    "node": ">=22.22.3"
+  },
+  "scripts": {
+    "start": "likec4 serve",
+    "dev": "likec4 serve",
+    "validate": "likec4 validate",
+    "format": "likec4 format",
+    "format:check": "likec4 format --check",
+    "build": "likec4 build -o dist",
+    "export:drawio": "likec4 export drawio --uncompressed -o generated/drawio",
+    "export:png": "likec4 export png -o generated/png --flat",
+    "export:json": "likec4 export json -o generated/model.json"
+  },
+  "devDependencies": {
+    "likec4": "1.59.1"
+  }
+}

src/model.c4

@@ -0,0 +1,8 @@
+model {
+  parcelWorkshop = system 'Parcel Workshop' 'Coordinates fictional parcel sorting' {
+    intakeDesk = service 'Intake Desk' 'Accepts sorting requests'
+    routingDesk = service 'Routing Desk' 'Plans parcel routes'
+
+    intakeDesk .sends routingDesk 'forwards sorting requests'
+  }
+}

src/specification.c4

@@ -0,0 +1,23 @@
+specification {
+  element system {
+    notation 'System'
+
+    style {
+      shape rectangle
+      color primary
+    }
+  }
+
+  element service {
+    notation 'Service'
+
+    style {
+      shape component
+      color secondary
+    }
+  }
+
+  relationship sends {
+    notation 'Message transfer'
+  }
+}

src/views.c4

@@ -0,0 +1,8 @@
+views {
+  view index {
+    title 'Parcel Workshop Overview'
+
+    include parcelWorkshop
+    include parcelWorkshop.*
+  }
+}