@hai3/react 0.3.0-alpha.0 → 0.4.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +255 -43
- package/commands/hai3-new-component.md +5 -31
- package/commands/hai3-new-mfe.md +167 -0
- package/commands/hai3-new-screen.md +12 -53
- package/commands/hai3-new-screenset.md +14 -51
- package/dist/index.cjs +541 -280
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +342 -90
- package/dist/index.d.ts +342 -90
- package/dist/index.js +424 -149
- package/dist/index.js.map +1 -1
- package/dist/types-CcLYaLwF.d.cts +136 -0
- package/dist/types-CcLYaLwF.d.ts +136 -0
- package/dist/types.cjs.map +1 -1
- package/dist/types.d.cts +3 -238
- package/dist/types.d.ts +3 -238
- package/llms.txt +72 -9
- package/package.json +10 -3
|
@@ -4,15 +4,13 @@
|
|
|
4
4
|
## PREREQUISITES (CRITICAL - STOP IF FAILED)
|
|
5
5
|
Run `hai3 --version`.
|
|
6
6
|
STOP: If fails, tell user to install.
|
|
7
|
-
FORBIDDEN: Proceeding without CLI tools.
|
|
8
7
|
FORBIDDEN: Creating screenset manually or by copying peers.
|
|
9
8
|
|
|
10
9
|
## AI WORKFLOW (REQUIRED)
|
|
11
10
|
1) Check prerequisites above.
|
|
12
11
|
2) Read .ai/targets/SCREENSETS.md and .ai/targets/EVENTS.md before starting.
|
|
13
12
|
3) Gather requirements from user (including UI sections).
|
|
14
|
-
4)
|
|
15
|
-
5) After approval, implement via `.claude/commands/openspec-apply.md` (REQUIRED).
|
|
13
|
+
4) Implement.
|
|
16
14
|
|
|
17
15
|
## GATHER REQUIREMENTS
|
|
18
16
|
Ask user for:
|
|
@@ -21,54 +19,7 @@ Ask user for:
|
|
|
21
19
|
- Initial screens.
|
|
22
20
|
- UI sections per screen (e.g., "stats cards, charts, activity feed").
|
|
23
21
|
|
|
24
|
-
## STEP 1:
|
|
25
|
-
Execute openspec:proposal command (see `.claude/commands/openspec-proposal.md`).
|
|
26
|
-
Proposal name: `add-{screenset-name}`
|
|
27
|
-
|
|
28
|
-
### proposal.md content
|
|
29
|
-
```
|
|
30
|
-
# Proposal: Add {ScreensetName} Screenset
|
|
31
|
-
|
|
32
|
-
## Summary
|
|
33
|
-
Add new {category} screenset "{screensetName}" with {screens} screen(s).
|
|
34
|
-
|
|
35
|
-
## Details
|
|
36
|
-
- Name: {screensetName}
|
|
37
|
-
- Category: {category}
|
|
38
|
-
- Initial screens: {screens}
|
|
39
|
-
|
|
40
|
-
## Component Plan
|
|
41
|
-
- REQUIRED: Use @hai3/uikit components first; local uikit only if missing.
|
|
42
|
-
- uikit/base/: rare primitives (inline styles allowed, needs justification)
|
|
43
|
-
- uikit/composite/: screenset composites (theme tokens only)
|
|
44
|
-
- components/: multi-screen components
|
|
45
|
-
- screens/{screen}/components/: screen-specific components
|
|
46
|
-
|
|
47
|
-
## Data Flow
|
|
48
|
-
- Events: {domain events per EVENTS.md}
|
|
49
|
-
- State: slices/, events/, effects/, actions/
|
|
50
|
-
- API: api/{Name}ApiService.ts with mocks
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
### tasks.md minimum required tasks
|
|
54
|
-
NOTE: Proposal may include additional tasks, but MUST include these:
|
|
55
|
-
```
|
|
56
|
-
- [ ] Create screenset: `hai3 screenset create {name} --category={category}`
|
|
57
|
-
- [ ] Create components per Component Plan (BEFORE screen file)
|
|
58
|
-
- [ ] Implement data flow per EVENTS.md (actions emit events, effects update slices)
|
|
59
|
-
- [ ] Add API service with mocks
|
|
60
|
-
- [ ] Validate: `npm run type-check && npm run arch:check && npm run lint`
|
|
61
|
-
- [ ] Test via Chrome DevTools MCP
|
|
62
|
-
```
|
|
63
|
-
|
|
64
|
-
## STEP 2: Wait for Approval
|
|
65
|
-
Tell user: "Review proposal at `openspec/changes/add-{screenset-name}/`."
|
|
66
|
-
Tell user: "Execute openspec:apply command to implement."
|
|
67
|
-
|
|
68
|
-
## STEP 3: Implementation (via openspec:apply)
|
|
69
|
-
BEFORE executing openspec:apply, verify tasks.md contains all minimum required tasks above.
|
|
70
|
-
Execute openspec:apply command (see `.claude/commands/openspec-apply.md`).
|
|
71
|
-
Follow tasks.md strictly:
|
|
22
|
+
## STEP 1: Implementation
|
|
72
23
|
1) Create screenset via `hai3 screenset create` (REQUIRED).
|
|
73
24
|
2) Create components BEFORE screen file per Component Plan.
|
|
74
25
|
3) Implement data flow per .ai/targets/EVENTS.md:
|
|
@@ -83,3 +34,15 @@ Follow tasks.md strictly:
|
|
|
83
34
|
- Test user interactions trigger correct events
|
|
84
35
|
- Verify state updates via Redux DevTools
|
|
85
36
|
- STOP if MCP connection fails
|
|
37
|
+
|
|
38
|
+
## COMPONENT PLAN
|
|
39
|
+
- REQUIRED: Use @hai3/uikit components first; local uikit only if missing.
|
|
40
|
+
- uikit/base/: rare primitives (inline styles allowed, needs justification)
|
|
41
|
+
- uikit/composite/: screenset composites (theme tokens only)
|
|
42
|
+
- components/: multi-screen components
|
|
43
|
+
- screens/{screen}/components/: screen-specific components
|
|
44
|
+
|
|
45
|
+
## DATA FLOW
|
|
46
|
+
- Events: {domain events per EVENTS.md}
|
|
47
|
+
- State: slices/, events/, effects/, actions/
|
|
48
|
+
- API: api/{Name}ApiService.ts with mocks
|