thomas-agentkit 0.5.0 → 0.5.3
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/README.md +21 -6
- package/dist/cli.js +2 -1
- package/package.json +1 -1
- package/templates/design-systems/apple.md +236 -0
package/README.md
CHANGED
|
@@ -14,7 +14,7 @@ Install templates into the current directory:
|
|
|
14
14
|
npx thomas-agentkit init
|
|
15
15
|
```
|
|
16
16
|
|
|
17
|
-
By default, `init` opens a short interactive setup flow in terminals.
|
|
17
|
+
By default, `init` opens a short interactive setup flow in terminals. It asks where to install files, what project type or preset to use, which AI tools you use, which template set to install, how to handle existing files, and whether to personalize repository-level placeholders such as project name, description, issue tracker, docs paths, stack summary, and project commands.
|
|
18
18
|
|
|
19
19
|
Install into another directory:
|
|
20
20
|
|
|
@@ -98,6 +98,8 @@ npx thomas-agentkit init --write-config
|
|
|
98
98
|
|
|
99
99
|
`--write-config` writes `agentkit.config.json` in the target directory. Existing config files are skipped by default; use `--force` to overwrite one intentionally.
|
|
100
100
|
|
|
101
|
+
Config values are validated when loaded. Unknown config keys, invalid preset/template/design-system names, invalid AI tool names, and non-string personalization values exit with an error.
|
|
102
|
+
|
|
101
103
|
List bundled templates:
|
|
102
104
|
|
|
103
105
|
```bash
|
|
@@ -133,7 +135,7 @@ AgentKit copies these bundled files into the target project:
|
|
|
133
135
|
|
|
134
136
|
When a preset is selected, AgentKit also installs `STACK.md` and adds a note in `AGENTS.md` telling agents to read it before changing stack-specific code.
|
|
135
137
|
|
|
136
|
-
Bundled design system guidance is stored under `templates/design-systems/` in this repository (for example `linear.md`). The CLI installs the chosen variant into `DESIGN-SYSTEM.md` in the target project; variant paths are not separate install targets.
|
|
138
|
+
Bundled design system guidance is stored under `templates/design-systems/` in this repository (for example `linear.md`, `apple.md`). The CLI installs the chosen variant into `DESIGN-SYSTEM.md` in the target project; variant paths are not separate install targets.
|
|
137
139
|
|
|
138
140
|
Existing files are skipped by default so local edits are preserved. Use `--force` when you intentionally want to refresh files from the bundled package version.
|
|
139
141
|
|
|
@@ -145,11 +147,24 @@ Generated content
|
|
|
145
147
|
<!-- agentkit:end agents -->
|
|
146
148
|
```
|
|
147
149
|
|
|
148
|
-
`agentkit update` only replaces content inside matching managed blocks. User edits before or after those blocks are preserved. Existing legacy files without managed blocks are reported as unmanaged and left untouched.
|
|
150
|
+
`agentkit update` creates missing managed files. For existing files, it only replaces content inside matching managed blocks. User edits before or after those blocks are preserved. Existing legacy files without managed blocks are reported as unmanaged and left untouched. Files with malformed managed block markers are skipped.
|
|
151
|
+
|
|
152
|
+
Interactive personalization only applies during `agentkit init` when files are created or overwritten. It does not write a config file unless `--write-config` is passed, and `agentkit update` does not reapply personalized values.
|
|
153
|
+
|
|
154
|
+
`agentkit.config.json` can set `preset`, `templateSet`, `designSystem`, `aiTools`, and `personalization` defaults. `templateSet` may be `minimal`, `standard`, or `full`; `designSystem` selects which bundled design-system variant fills `DESIGN-SYSTEM.md` (`linear` or `apple`); `aiTools` may include `codex`, `cursor`, `claude`, and `copilot`. `agentkit update` uses config `preset` and `designSystem` and continues to update all managed bundled templates.
|
|
155
|
+
|
|
156
|
+
Template set mappings:
|
|
157
|
+
|
|
158
|
+
- `minimal`: `AGENTS.md`
|
|
159
|
+
- `standard`: `AGENTS.md`, `CODE-QUALITY.md`, `DESIGN-SYSTEM.md`, `WORKFLOWS.md`
|
|
160
|
+
- `full`: all bundled templates
|
|
149
161
|
|
|
150
|
-
|
|
162
|
+
AI tool mappings:
|
|
151
163
|
|
|
152
|
-
|
|
164
|
+
- `codex`: `AGENTS.md`
|
|
165
|
+
- `cursor`: `.cursor/rules/agentkit.md`
|
|
166
|
+
- `claude`: `CLAUDE.md`
|
|
167
|
+
- `copilot`: `.github/copilot-instructions.md`
|
|
153
168
|
|
|
154
169
|
## Presets
|
|
155
170
|
|
|
@@ -181,7 +196,7 @@ Options:
|
|
|
181
196
|
- `-y, --yes`: accept defaults without prompts
|
|
182
197
|
- `--write-config`: write resolved install defaults to `agentkit.config.json`
|
|
183
198
|
- `--preset <name>`: install stack-specific guidance (`next`, `sveltekit`, `express`, `convex`, `fullstack`)
|
|
184
|
-
- `--design-system <name>`: design system variant for `DESIGN-SYSTEM.md` (`linear`)
|
|
199
|
+
- `--design-system <name>`: design system variant for `DESIGN-SYSTEM.md` (`linear`, `apple`)
|
|
185
200
|
- `--list`: list bundled template files
|
|
186
201
|
- `--list-presets`: list available presets
|
|
187
202
|
- `--list-design-systems`: list available design systems
|
package/dist/cli.js
CHANGED
|
@@ -14,9 +14,10 @@ const validPresets = ["next", "sveltekit", "express", "convex", "fullstack"];
|
|
|
14
14
|
const validProjectTypes = ["generic", ...validPresets];
|
|
15
15
|
const validAiTools = ["codex", "cursor", "claude", "copilot"];
|
|
16
16
|
const validTemplateSets = ["minimal", "standard", "full"];
|
|
17
|
-
const validDesignSystems = ["linear"];
|
|
17
|
+
const validDesignSystems = ["linear", "apple"];
|
|
18
18
|
const designSystemLabels = {
|
|
19
19
|
linear: "Linear-inspired",
|
|
20
|
+
apple: "Apple-inspired",
|
|
20
21
|
};
|
|
21
22
|
const configFileName = "agentkit.config.json";
|
|
22
23
|
const configKeys = ["preset", "templateSet", "aiTools", "designSystem", "personalization"];
|
package/package.json
CHANGED
|
@@ -0,0 +1,236 @@
|
|
|
1
|
+
# [Project Name] Design System - Apple-Inspired Foundations
|
|
2
|
+
|
|
3
|
+
This design system codifies the visual and interaction principles for [Project Name].
|
|
4
|
+
|
|
5
|
+
It is the default source of truth for app shell layout, navigation, lists, controls, and page chrome in this repository.
|
|
6
|
+
|
|
7
|
+
All colors, typography families, and radii must be consumed through semantic tokens in `[theme stylesheet path, e.g. src/styles.css]` or a dedicated theme stylesheet imported there. Components must not hardcode literal color values or font family names.
|
|
8
|
+
|
|
9
|
+
## 1) Surface And Color
|
|
10
|
+
|
|
11
|
+
### Philosophy
|
|
12
|
+
|
|
13
|
+
The interface reads as a calm, spacious canvas. Separation comes from spacing, typography, subtle grouped inset surfaces when grouping controls, and structural seams—not stacked decorative containers.
|
|
14
|
+
|
|
15
|
+
### Token Roles
|
|
16
|
+
|
|
17
|
+
Define semantic CSS custom properties and map them to the project's theme tokens:
|
|
18
|
+
|
|
19
|
+
- `--background`: app canvas
|
|
20
|
+
- `--foreground`: primary text
|
|
21
|
+
- `--muted-foreground`: secondary/meta text
|
|
22
|
+
- `--border`: structural seams
|
|
23
|
+
- `--card`: grouped inset surfaces (forms, settings groups, grouped lists) and dialogs/popovers
|
|
24
|
+
- `--popover`: overlay surfaces
|
|
25
|
+
- `--accent`: subtle hover/active in content areas
|
|
26
|
+
- `--sidebar`: sidebar canvas
|
|
27
|
+
- `--sidebar-accent`: hover/active in sidebar
|
|
28
|
+
- `--primary`: brand and primary CTA (system blue)
|
|
29
|
+
- `--destructive`: danger actions
|
|
30
|
+
- `--ring`: focus ring
|
|
31
|
+
|
|
32
|
+
### Rules
|
|
33
|
+
|
|
34
|
+
- Canvas-first for browsing and routine reading; use grouped inset surfaces only where controls belong together (forms, settings, grouped lists).
|
|
35
|
+
- No decorative gradients on product surfaces.
|
|
36
|
+
- Use one accent color, `--primary`, for brand and primary actions. Map `--primary` to system blue (for example `#007AFF` in light, `#0A84FF` in dark), expressed via tokens—not literals in components.
|
|
37
|
+
- Prefer spacing and typographic hierarchy over extra backgrounds.
|
|
38
|
+
- Keep all colors tokenized and theme-ready for light and dark modes.
|
|
39
|
+
|
|
40
|
+
## 2) Typography
|
|
41
|
+
|
|
42
|
+
### Families
|
|
43
|
+
|
|
44
|
+
- Interface text: `font-sans` backed by `--font-sans` (map theme to `-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif`).
|
|
45
|
+
- Code, IDs, and timestamps: `font-mono` backed by `--font-mono` (map theme to `"SF Mono", ui-monospace, "JetBrains Mono", monospace`).
|
|
46
|
+
|
|
47
|
+
Do not reference literal font families in component files.
|
|
48
|
+
|
|
49
|
+
### Scale
|
|
50
|
+
|
|
51
|
+
- Page heading: `text-2xl`, `font-semibold`
|
|
52
|
+
- Section heading: `text-lg`, `font-semibold`
|
|
53
|
+
- Body / row label: `text-sm`, `font-normal` to `font-medium`
|
|
54
|
+
- Meta / secondary: `text-xs`, `font-normal`
|
|
55
|
+
- Nav section label: `text-xs uppercase tracking-wide`, `font-medium`
|
|
56
|
+
- Tiny helper: `text-[11px]`, `font-normal`
|
|
57
|
+
|
|
58
|
+
### Rules
|
|
59
|
+
|
|
60
|
+
- Headlines are clear and restrained; prefer slightly tighter tracking on large display sizes (`tracking-tight` where appropriate).
|
|
61
|
+
- Use comfortable line height for body (`leading-normal` or `leading-relaxed`).
|
|
62
|
+
- Reserve uppercase for nav section labels and compact metadata.
|
|
63
|
+
|
|
64
|
+
## 3) Navigation
|
|
65
|
+
|
|
66
|
+
### Structure
|
|
67
|
+
|
|
68
|
+
1. Header row: identity, search, and create action.
|
|
69
|
+
2. Primary links.
|
|
70
|
+
3. Collapsible grouped links.
|
|
71
|
+
4. Lightweight footer affordance for help or docs.
|
|
72
|
+
|
|
73
|
+
### Item Styling
|
|
74
|
+
|
|
75
|
+
- Default: `text-sm`, muted foreground.
|
|
76
|
+
- Hover: subtle `sidebar-accent` background.
|
|
77
|
+
- Active: full-width rounded rectangle, medium weight.
|
|
78
|
+
- Icon size: 14px to 16px.
|
|
79
|
+
- Nav row baseline: `rounded-lg h-9 px-3`.
|
|
80
|
+
|
|
81
|
+
### Collapse Behavior
|
|
82
|
+
|
|
83
|
+
- Expanded width: `15rem` or 240px.
|
|
84
|
+
- Collapsed width: `3rem` or 48px, icon-only with tooltip.
|
|
85
|
+
- Mobile: sheet/drawer using expanded width.
|
|
86
|
+
- Keyboard shortcut: support the project's standard sidebar toggle shortcut, e.g. `Cmd+B`.
|
|
87
|
+
|
|
88
|
+
## 4) Layout Regions
|
|
89
|
+
|
|
90
|
+
### App Shell
|
|
91
|
+
|
|
92
|
+
- Sidebar: fixed left, full viewport height, right seam border.
|
|
93
|
+
- Content: `flex-1 min-w-0`, same background canvas.
|
|
94
|
+
- Optional inspector: right panel, `22rem` to `28rem`, collapsible.
|
|
95
|
+
|
|
96
|
+
### Common Page Patterns
|
|
97
|
+
|
|
98
|
+
- List workspace: toolbar plus scrollable list.
|
|
99
|
+
- Detail view: breadcrumbs/title plus body and optional inspector.
|
|
100
|
+
- Editor split: left rail plus center editor.
|
|
101
|
+
- Settings split: nav plus forms inside grouped inset surfaces.
|
|
102
|
+
|
|
103
|
+
### Toolbar Strip
|
|
104
|
+
|
|
105
|
+
- Height: `h-12`.
|
|
106
|
+
- Bottom seam: `border-b border-border/50`.
|
|
107
|
+
- No separate heavy background block.
|
|
108
|
+
|
|
109
|
+
### Page padding
|
|
110
|
+
|
|
111
|
+
- Content padding: `p-4` to `p-6` (16px to 24px) for comfortable reading rhythm.
|
|
112
|
+
|
|
113
|
+
## 5) Interactive Elements
|
|
114
|
+
|
|
115
|
+
### Buttons
|
|
116
|
+
|
|
117
|
+
- Primary: solid `primary` (system blue).
|
|
118
|
+
- Secondary: neutral fill.
|
|
119
|
+
- Ghost: transparent with subtle hover fill.
|
|
120
|
+
- Destructive: `destructive` only for dangerous confirms.
|
|
121
|
+
- Icon-only: `size-9` or `size-10`, ghost, tooltip.
|
|
122
|
+
|
|
123
|
+
Rules:
|
|
124
|
+
|
|
125
|
+
- Default radius: `rounded-lg` using the tokenized radius scale.
|
|
126
|
+
- Sparse shadows; prefer borders for separation on web.
|
|
127
|
+
- Primary buttons are intentional—do not pepper every row with a primary.
|
|
128
|
+
|
|
129
|
+
### Inputs
|
|
130
|
+
|
|
131
|
+
- Default height: `h-9`; relaxed contexts: `h-10` to `h-12`.
|
|
132
|
+
- Tokenized input background and border.
|
|
133
|
+
- Visible focus ring: `ring-2 ring-ring` with comfortable offset.
|
|
134
|
+
- Labels above fields. Do not use floating labels by default.
|
|
135
|
+
|
|
136
|
+
### Menus / Popovers / Dialogs
|
|
137
|
+
|
|
138
|
+
- Tokenized `popover` surface and subtle border.
|
|
139
|
+
- Typography: `text-sm` for menus; `text-sm` to `text-base` for dialogs as needed.
|
|
140
|
+
- Comfortable spacing.
|
|
141
|
+
- Dialog actions align right: secondary then primary.
|
|
142
|
+
|
|
143
|
+
## 6) Lists And Data
|
|
144
|
+
|
|
145
|
+
### Row Anatomy
|
|
146
|
+
|
|
147
|
+
- Relaxed, single-line by default where possible.
|
|
148
|
+
- Hover uses subtle accent fill.
|
|
149
|
+
- Selected row uses tinted fill derived from `--primary` (for example ~12% opacity in light, ~24% in dark) plus medium weight.
|
|
150
|
+
- Avoid per-row borders; separate by spacing and padding rhythm.
|
|
151
|
+
|
|
152
|
+
### Grouping And Tables
|
|
153
|
+
|
|
154
|
+
- Group labels are muted; children are indented or wrapped in grouped inset surfaces.
|
|
155
|
+
- Table headers: compact meta style; avoid heavy uppercase unless it aids scanability.
|
|
156
|
+
- No zebra striping or heavy gridlines.
|
|
157
|
+
|
|
158
|
+
## 7) Status And Feedback
|
|
159
|
+
|
|
160
|
+
- Status: small dots or SF-symbol-style glyphs with semantic meaning (optional).
|
|
161
|
+
- Loading: skeletons for content, spinners only for inline actions.
|
|
162
|
+
- Toasts: soft shadow, corner-pinned or non-intrusive, auto-dismiss.
|
|
163
|
+
- Empty states: icon, short message, and optional single CTA.
|
|
164
|
+
|
|
165
|
+
## 8) Motion
|
|
166
|
+
|
|
167
|
+
- Motion confirms state changes; it is never decorative.
|
|
168
|
+
- Micro interactions: about 200ms.
|
|
169
|
+
- Layout shifts: about 300ms to 350ms.
|
|
170
|
+
- Preferred easing: `cubic-bezier(0.25, 0.1, 0.25, 1)`.
|
|
171
|
+
- Sheets and popovers may use a subtle spring-like overshoot when it aids affordance; keep amplitude low on web.
|
|
172
|
+
- Respect `prefers-reduced-motion` with near-instant transitions.
|
|
173
|
+
|
|
174
|
+
## 9) Spacing System
|
|
175
|
+
|
|
176
|
+
Base unit is 4px, using the project's spacing scale.
|
|
177
|
+
|
|
178
|
+
- `p-1` or 4px: tight internals.
|
|
179
|
+
- `p-2` or 8px: compact section padding.
|
|
180
|
+
- `p-3` or 12px: dense content blocks.
|
|
181
|
+
- `p-4` or 16px: page-level rhythm.
|
|
182
|
+
- `p-6` or 24px: relaxed sections when the layout calls for breathing room.
|
|
183
|
+
|
|
184
|
+
Density guidelines:
|
|
185
|
+
|
|
186
|
+
- Sidebar: relaxed, `h-9` rows.
|
|
187
|
+
- Content: moderate, `h-10` to `h-12` rows.
|
|
188
|
+
- Forms/settings: relaxed, `h-12` to `h-14` rows.
|
|
189
|
+
|
|
190
|
+
## 10) Accessibility
|
|
191
|
+
|
|
192
|
+
- Full keyboard navigation for all controls.
|
|
193
|
+
- Consistent visible focus styles.
|
|
194
|
+
- Semantic landmarks such as `nav` and `main`.
|
|
195
|
+
- Collapsibles expose `aria-expanded`.
|
|
196
|
+
- Ensure WCAG AA contrast in both themes.
|
|
197
|
+
|
|
198
|
+
## 11) Anti-Patterns
|
|
199
|
+
|
|
200
|
+
- Do not wrap routine browsing content in grouped inset surfaces.
|
|
201
|
+
- Do not introduce multiple accent colors.
|
|
202
|
+
- Do not add decorative gradients behind core product surfaces.
|
|
203
|
+
- Do not stack multiple competing toolbars.
|
|
204
|
+
- Do not color-code nav icons.
|
|
205
|
+
- Do not use heavy drop shadows for everyday chrome.
|
|
206
|
+
- Do not hardcode colors or font families in components.
|
|
207
|
+
|
|
208
|
+
## 12) Applying This System
|
|
209
|
+
|
|
210
|
+
### Where Values Live
|
|
211
|
+
|
|
212
|
+
- Theme tokens and base layer: `[theme stylesheet path, e.g. src/styles.css]`.
|
|
213
|
+
- App shell composition: `[route/layout path, e.g. src/routes or app]`.
|
|
214
|
+
- Reusable UI primitives: `[components path, e.g. src/components/ui]`.
|
|
215
|
+
|
|
216
|
+
### New Component Checklist
|
|
217
|
+
|
|
218
|
+
1. Canvas-first or justified grouped inset for grouped controls—not card-first for everything?
|
|
219
|
+
2. Uses 2-3 text hierarchy levels max?
|
|
220
|
+
3. Has subtle hover and clear active states?
|
|
221
|
+
4. Uses primary color only where needed?
|
|
222
|
+
5. Uses spacing rhythm in 4px increments?
|
|
223
|
+
6. Has complete keyboard and focus behavior?
|
|
224
|
+
7. Uses token-driven colors and fonts?
|
|
225
|
+
8. Works in light and dark themes?
|
|
226
|
+
|
|
227
|
+
### For Coding Agents
|
|
228
|
+
|
|
229
|
+
- Read this file before changing UI, layout, navigation, styling, or components.
|
|
230
|
+
- Prefer existing UI primitives and local layout patterns.
|
|
231
|
+
- Do not introduce new visual language without documenting the reason in the implementation brief or PR.
|
|
232
|
+
- Before handoff, check responsive behavior, focus states, text overflow, loading states, empty states, and token usage.
|
|
233
|
+
|
|
234
|
+
### Working Rule
|
|
235
|
+
|
|
236
|
+
Default to these principles unless a deliberate exception is documented in a feature-specific spec.
|