dev-process-kit 0.0.2-beta.1 → 0.0.3

package/README.md

@@ -19,6 +19,7 @@ browser, and the review comes back as structured change requests the agent can a
 - **Rich diagrams with almost no code.** Parts for the traditional diagrams a development process uses, ready to drop into your markup.
 - **No setup.** The components are made for a single-file HTML page and ship as Web Components: one `<script>` tag, and they are there.
 - **Feedback without leaving the page.** Operate the diagram and comment on individual elements in the UI, then copy the operations and the comments out as a hand-off to an agent.
+- **First-class support for Claude Artifacts.** Published from Claude Code as a Claude Artifact, the page follows the claude.ai theme and sends the review straight back to the Claude session with one click: no copy and paste.
 
 ## Why dev-process-kit?
 
@@ -50,6 +51,16 @@ Create a USM for this product.
 Follow https://raw.githubusercontent.com/d-kimuson/dev-process-kit/main/skills/dev-process-kit/SKILL.md.
 ```
 
+### Claude Artifacts
+
+Claude Code can publish the page as a Claude Artifact instead of a local file, and dev-process-kit supports that as a first-class target:
+
+- **One-click hand-off.** With the `comments` and `db` capabilities declared, the review rail offers **Send to Claude** in place of copying. The review arrives in the Claude Code session that published the page, which applies it and republishes to the same URL.
+- **Fits the viewer.** The template follows the reader's claude.ai light / dark theme and sizes itself to the viewer's frame.
+- **Nothing to configure.** The page detects the Artifact at runtime; outside one, or when a send cannot land, the copy hand-off stays as it is.
+
+The skill's [Claude Artifact reference](skills/dev-process-kit/references/claude-artifact.md) tells the agent how to write and publish such a page.
+
 ### Install the skill
 
 The `dev-process-kit` agent skill tells the agent when to reach for a page and how to keep it focused.
@@ -71,20 +82,22 @@ dev-process-kit ships **templates**, which make up a whole page, and **component
 
 ### Templates
 
-| Template           | Element                        | What it is                                                                                                                                                  |
-| ------------------ | ------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| UX Prototype       | `dpk-template-prototype`       | `Activity › UserStory › Step › Preview[]`: one step is one page or experience state, with previews per viewport                                             |
-| User Story Mapping | `dpk-template-usm`             | The backbone (activity › step) as columns, milestones as rows                                                                                               |
-| Event Storming     | `dpk-template-event-storming`  | Sticky notes on swimlanes in timeline order, with causality links between them                                                                              |
-| Example Mapping    | `dpk-template-example-mapping` | One story per column, rules beneath it, examples beneath each rule, questions pinned to any of them                                                         |
-| Grill              | `dpk-template-grill`           | A review of questions over whatever you put in the main area: the questions are base data, the answers are draft actions, the badges sit on your own markup |
-| Plain              | `dpk-template-plain`           | For a page no other template fits: only the header and the review (comments) pipeline around your own markup                                                |
+| Template           | Element                        | What it is                                                                                                                                                                                                                                                                                                         |
+| ------------------ | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| UX Prototype       | `dpk-template-prototype`       | `Activity › UserStory › Step › Preview[]`: one step is one page or experience state, with previews per viewport                                                                                                                                                                                                    |
+| User Story Mapping | `dpk-template-usm`             | The backbone (activity › step) as columns, milestones as rows                                                                                                                                                                                                                                                      |
+| Event Storming     | `dpk-template-event-storming`  | Sticky notes on swimlanes in timeline order, with causality links between them                                                                                                                                                                                                                                     |
+| Example Mapping    | `dpk-template-example-mapping` | One story per column, rules beneath it, examples beneath each rule, questions pinned to any of them                                                                                                                                                                                                                |
+| Grill              | `dpk-template-grill`           | A review of questions over whatever you put in the main area: the questions are base data, the answers are draft actions, the badges sit on your own markup                                                                                                                                                        |
+| Plain              | `dpk-template-plain`           | For a page no other template fits: only the header and the review (comments) pipeline around your own markup                                                                                                                                                                                                       |
+| Slides             | `dpk-template-slides`          | A slide deck for explaining something step by step: slide titles and points are base data, richer bodies are your own markup, comments go on the slide on screen                                                                                                                                                   |
+| Task Context Board | `dpk-template-task-board`      | Where a task shared by an agent and a person stands: why and what (a short design doc, with diagrams), todos with assignees and proposals, outputs (URLs / paths), the conversation log with the current status, and questions the agent works around on an assumption; replies and todo changes go back as drafts |
 
 ### Components
 
 | Component        | Element                          | What it is                                                                                   |
 | ---------------- | -------------------------------- | -------------------------------------------------------------------------------------------- |
-| Review rail      | `dpk-component-comment-panel`    | The draft actions and comments, stale markers, deletion, and the copy hand-off for the agent |
+| Review rail      | `dpk-component-comment-panel`    | Draft actions and comments, stale markers, deletion, and the copy or send-to-Claude hand-off |
 | Inline editing   | `dpk-component-inline-edit`      | A text/multiline editor that emits `dpk-commit`                                              |
 | State diagram    | `dpk-component-state-diagram`    | Which states exist, and what moves between them                                              |
 | Sequence diagram | `dpk-component-sequence-diagram` | In what order participants talk                                                              |