openuispec 0.1.18 → 0.1.20

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.
Files changed (98) hide show
  1. package/README.md +52 -34
  2. package/cli/index.ts +1 -1
  3. package/cli/init.ts +48 -211
  4. package/docs/stress-test-maturity-report.md +97 -0
  5. package/examples/todo-orbit/AGENTS.md +127 -0
  6. package/examples/todo-orbit/CLAUDE.md +75 -0
  7. package/examples/todo-orbit/README.md +62 -0
  8. package/examples/todo-orbit/generated/android/Todo Orbit/README.md +14 -0
  9. package/examples/todo-orbit/generated/android/Todo Orbit/app/build.gradle.kts +58 -0
  10. package/examples/todo-orbit/generated/android/Todo Orbit/app/proguard-rules.pro +1 -0
  11. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/AndroidManifest.xml +20 -0
  12. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/MainActivity.kt +14 -0
  13. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/TodoOrbitApp.kt +345 -0
  14. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/support/AppLogic.kt +231 -0
  15. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/support/Models.kt +169 -0
  16. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/support/Strings.kt +8 -0
  17. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/components/CommonComponents.kt +185 -0
  18. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/screens/AnalyticsScreen.kt +193 -0
  19. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/screens/SettingsScreen.kt +102 -0
  20. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/screens/TasksScreen.kt +342 -0
  21. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/sheets/EditorSheets.kt +344 -0
  22. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit/ui/theme/TodoOrbitTheme.kt +59 -0
  23. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/res/values/strings.xml +148 -0
  24. package/examples/todo-orbit/generated/android/Todo Orbit/app/src/main/res/values-ru/strings.xml +154 -0
  25. package/examples/todo-orbit/generated/android/Todo Orbit/build.gradle.kts +4 -0
  26. package/examples/todo-orbit/generated/android/Todo Orbit/gradle/wrapper/gradle-wrapper.jar +0 -0
  27. package/examples/todo-orbit/generated/android/Todo Orbit/gradle/wrapper/gradle-wrapper.properties +7 -0
  28. package/examples/todo-orbit/generated/android/Todo Orbit/gradle.properties +4 -0
  29. package/examples/todo-orbit/generated/android/Todo Orbit/gradlew +248 -0
  30. package/examples/todo-orbit/generated/android/Todo Orbit/gradlew.bat +93 -0
  31. package/examples/todo-orbit/generated/android/Todo Orbit/settings.gradle.kts +18 -0
  32. package/examples/todo-orbit/generated/ios/Todo Orbit/README.md +29 -0
  33. package/examples/todo-orbit/generated/ios/Todo Orbit/Resources/en.lproj/Localizable.strings +118 -0
  34. package/examples/todo-orbit/generated/ios/Todo Orbit/Resources/ru.lproj/Localizable.strings +118 -0
  35. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/App/TodoOrbitApp.swift +50 -0
  36. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Components/OrbitChrome.swift +204 -0
  37. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Components/SchedulePreviewView.swift +126 -0
  38. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Components/TrendChartView.swift +70 -0
  39. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Flows/RecurringRuleSheet.swift +123 -0
  40. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Flows/TaskEditorSheet.swift +60 -0
  41. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Models/DomainModels.swift +238 -0
  42. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Screens/AnalyticsView.swift +94 -0
  43. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Screens/SettingsView.swift +74 -0
  44. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Screens/TasksHomeView.swift +363 -0
  45. package/examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit/Support/AppModel.swift +324 -0
  46. package/examples/todo-orbit/generated/ios/Todo Orbit/TodoOrbit.xcodeproj/project.pbxproj +408 -0
  47. package/examples/todo-orbit/generated/ios/Todo Orbit/TodoOrbit.xcodeproj/project.xcworkspace/contents.xcworkspacedata +7 -0
  48. package/examples/todo-orbit/generated/ios/Todo Orbit/TodoOrbit.xcodeproj/xcshareddata/xcschemes/TodoOrbit.xcscheme +79 -0
  49. package/examples/todo-orbit/generated/ios/Todo Orbit/project.yml +24 -0
  50. package/examples/todo-orbit/generated/web/Todo Orbit/index.html +16 -0
  51. package/examples/todo-orbit/generated/web/Todo Orbit/package-lock.json +1087 -0
  52. package/examples/todo-orbit/generated/web/Todo Orbit/package.json +24 -0
  53. package/examples/todo-orbit/generated/web/Todo Orbit/src/App.tsx +2114 -0
  54. package/examples/todo-orbit/generated/web/Todo Orbit/src/main.tsx +13 -0
  55. package/examples/todo-orbit/generated/web/Todo Orbit/src/styles.css +886 -0
  56. package/examples/todo-orbit/generated/web/Todo Orbit/tsconfig.json +19 -0
  57. package/examples/todo-orbit/generated/web/Todo Orbit/vite.config.ts +6 -0
  58. package/examples/todo-orbit/openuispec/README.md +158 -0
  59. package/examples/todo-orbit/openuispec/contracts/.gitkeep +0 -0
  60. package/examples/todo-orbit/openuispec/contracts/action_trigger.yaml +28 -0
  61. package/examples/todo-orbit/openuispec/contracts/collection.yaml +32 -0
  62. package/examples/todo-orbit/openuispec/contracts/data_display.yaml +38 -0
  63. package/examples/todo-orbit/openuispec/contracts/feedback.yaml +32 -0
  64. package/examples/todo-orbit/openuispec/contracts/input_field.yaml +52 -0
  65. package/examples/todo-orbit/openuispec/contracts/nav_container.yaml +47 -0
  66. package/examples/todo-orbit/openuispec/contracts/surface.yaml +28 -0
  67. package/examples/todo-orbit/openuispec/contracts/x_schedule_preview.yaml +134 -0
  68. package/examples/todo-orbit/openuispec/contracts/x_task_trend_chart.yaml +139 -0
  69. package/examples/todo-orbit/openuispec/flows/.gitkeep +0 -0
  70. package/examples/todo-orbit/openuispec/flows/create_recurring_rule.yaml +253 -0
  71. package/examples/todo-orbit/openuispec/flows/create_task.yaml +118 -0
  72. package/examples/todo-orbit/openuispec/flows/edit_task.yaml +126 -0
  73. package/examples/todo-orbit/openuispec/locales/.gitkeep +0 -0
  74. package/examples/todo-orbit/openuispec/locales/en.json +150 -0
  75. package/examples/todo-orbit/openuispec/locales/ru.json +150 -0
  76. package/examples/todo-orbit/openuispec/openuispec.yaml +122 -0
  77. package/examples/todo-orbit/openuispec/platform/.gitkeep +0 -0
  78. package/examples/todo-orbit/openuispec/platform/android.yaml +19 -0
  79. package/examples/todo-orbit/openuispec/platform/ios.yaml +20 -0
  80. package/examples/todo-orbit/openuispec/platform/web.yaml +22 -0
  81. package/examples/todo-orbit/openuispec/screens/.gitkeep +0 -0
  82. package/examples/todo-orbit/openuispec/screens/analytics.yaml +140 -0
  83. package/examples/todo-orbit/openuispec/screens/home.yaml +173 -0
  84. package/examples/todo-orbit/openuispec/screens/settings.yaml +149 -0
  85. package/examples/todo-orbit/openuispec/screens/task_detail.yaml +223 -0
  86. package/examples/todo-orbit/openuispec/tokens/.gitkeep +0 -0
  87. package/examples/todo-orbit/openuispec/tokens/color.yaml +93 -0
  88. package/examples/todo-orbit/openuispec/tokens/elevation.yaml +25 -0
  89. package/examples/todo-orbit/openuispec/tokens/icons.yaml +92 -0
  90. package/examples/todo-orbit/openuispec/tokens/layout.yaml +107 -0
  91. package/examples/todo-orbit/openuispec/tokens/motion.yaml +39 -0
  92. package/examples/todo-orbit/openuispec/tokens/spacing.yaml +18 -0
  93. package/examples/todo-orbit/openuispec/tokens/themes.yaml +23 -0
  94. package/examples/todo-orbit/openuispec/tokens/typography.yaml +52 -0
  95. package/package.json +1 -1
  96. package/schema/screen.schema.json +9 -0
  97. package/schema/validate.ts +0 -2
  98. package/spec/openuispec-v0.1.md +129 -27
package/README.md CHANGED
@@ -4,6 +4,8 @@
4
4
 
5
5
  OpenUISpec is a **semantic UI specification format** that replaces cross-platform frameworks with a declarative design language. Instead of sharing runtime code across platforms, you share the *spec* — and AI generates native SwiftUI, Jetpack Compose, and React code from it.
6
6
 
7
+ OpenUISpec is a shared UI sync language for native products, optimized for solo developers but equally usable by teams. It is not a pixel-perfect design format like Figma and it is not a shared runtime like Flutter or React Native. Its job is to keep product intent, interaction contracts, flows, tokens, and platform outputs aligned while still allowing bounded native variation on iOS, Android, and web.
8
+
7
9
  ## Why
8
10
 
9
11
  Cross-platform frameworks (Flutter, React Native, KMP/CMP) solve code duplication by sharing a runtime. OpenUISpec solves it by sharing **intent**:
@@ -13,7 +15,7 @@ Cross-platform frameworks (Flutter, React Native, KMP/CMP) solve code duplicatio
13
15
  | Cross-platform framework | Runtime code | Abstraction layer |
14
16
  | **OpenUISpec** | **Semantic spec** | **Native per platform** |
15
17
 
16
- The result: each platform feels native, but every app stays consistent because it's generated from the same source of truth.
18
+ The result: each platform feels native, but every app stays semantically consistent because it's generated from the same source of truth.
17
19
 
18
20
  ## How it works
19
21
 
@@ -56,7 +58,18 @@ Then hand your spec to any AI code generator:
56
58
 
57
59
  > Generate a native iOS app from this OpenUISpec. Follow all contract state machines, apply token ranges for iOS, and implement navigation flows as defined. Use `platform/ios.yaml` for SwiftUI-specific overrides.
58
60
 
59
- See the [TaskFlow example](./examples/taskflow/) for a complete spec covering all 7 contract families.
61
+ Before platform code generation, the AI should refresh its understanding of the current target toolchain and platform conventions instead of relying on stale memory. This matters most for project formats, resource wiring, navigation APIs, packaging rules, and other implementation details that change across toolchain versions.
62
+
63
+ For platform generation, treat these as hard output constraints:
64
+
65
+ - Generate a valid native project or target that actually bundles every required runtime resource. Converting spec inputs into platform-native resource files is insufficient unless those files are attached to the final app target and resolve at runtime.
66
+ - Do not ship unresolved resource identifiers in the UI. Raw localization keys, token references, asset names, or placeholder paths mean the generated output is incomplete.
67
+ - Do not use a container or navigation primitive without defining its behavior for every supported size class and form factor. Master-detail patterns must provide a non-empty compact fallback instead of assuming large-screen behavior.
68
+
69
+ See the examples for concrete reference projects:
70
+
71
+ - [TaskFlow](./examples/taskflow/) for a compact spec covering all 7 contract families
72
+ - [Todo Orbit](./examples/todo-orbit/openuispec/) for a bilingual task app with generated iOS, Android, and web targets under `examples/todo-orbit/generated/`
60
73
 
61
74
  ## Repository structure
62
75
 
@@ -89,37 +102,41 @@ openuispec/
89
102
  │ │ └── validation.schema.json # Validation rule definitions
90
103
  │ └── validate.ts # Validation script (npm run validate)
91
104
  ├── examples/
92
- └── taskflow/ # Complete example app
93
- ├── openuispec.yaml # Root manifest + data model + API endpoints
94
- ├── tokens/
95
- │ ├── color.yaml # Brand + semantic + status colors
96
- │ ├── typography.yaml # Font family + 8-step type scale
97
- │ ├── spacing.yaml # 4px base unit, 9-step scale
98
- │ ├── elevation.yaml # 4-level elevation (none/sm/md/lg)
99
- │ ├── motion.yaml # Durations, easings, patterns
100
- │ ├── layout.yaml # Size classes, primitives, reflow rules
101
- │ ├── themes.yaml # Light, dark, warm variants
102
- │ └── icons.yaml # Icon registry with platform mappings
103
- ├── contracts/ # Standard contract extensions + custom contracts
104
- │ ├── input_field.yaml # Standard contract with cut_corner variant
105
- │ └── x_media_player.yaml # Custom media player contract (Section 12)
106
- ├── screens/
107
- │ ├── home.yaml # Task list with search, filters, FAB, adaptive nav
108
- │ ├── task_detail.yaml # Full task view with actions + assignee sheet
109
- │ ├── projects.yaml # Project grid + new project dialog
110
- │ ├── project_detail.yaml # Single project with task list (stub)
111
- │ ├── settings.yaml # Preferences, toggles, account management
112
- │ ├── profile_edit.yaml # Edit profile form (stub)
113
- │ └── calendar.yaml # Calendar view (stub)
114
- ├── flows/
115
- │ ├── create_task.yaml # Task creation form (sheet presentation)
116
- │ └── edit_task.yaml # Task editing flow
117
- ├── locales/
118
- │ └── en.json # English locale (ICU MessageFormat)
119
- └── platform/
120
- ├── ios.yaml # SwiftUI overrides + behaviors
121
- ├── android.yaml # Compose overrides + behaviors
122
- └── web.yaml # React overrides + responsive rules
105
+ ├── taskflow/ # Compact reference spec
106
+ ├── openuispec.yaml # Root manifest + data model + API endpoints
107
+ ├── tokens/
108
+ ├── color.yaml # Brand + semantic + status colors
109
+ ├── typography.yaml # Font family + 8-step type scale
110
+ ├── spacing.yaml # 4px base unit, 9-step scale
111
+ ├── elevation.yaml # 4-level elevation (none/sm/md/lg)
112
+ ├── motion.yaml # Durations, easings, patterns
113
+ ├── layout.yaml # Size classes, primitives, reflow rules
114
+ ├── themes.yaml # Light, dark, warm variants
115
+ └── icons.yaml # Icon registry with platform mappings
116
+ ├── contracts/ # Standard contract extensions + custom contracts
117
+ ├── input_field.yaml # Standard contract with cut_corner variant
118
+ └── x_media_player.yaml # Custom media player contract (Section 12)
119
+ ├── screens/
120
+ ├── home.yaml # Task list with search, filters, FAB, adaptive nav
121
+ ├── task_detail.yaml # Full task view with actions + assignee sheet
122
+ ├── projects.yaml # Project grid + new project dialog
123
+ ├── project_detail.yaml # Single project with task list (stub)
124
+ ├── settings.yaml # Preferences, toggles, account management
125
+ ├── profile_edit.yaml # Edit profile form (stub)
126
+ └── calendar.yaml # Calendar view (stub)
127
+ ├── flows/
128
+ ├── create_task.yaml # Task creation form (sheet presentation)
129
+ └── edit_task.yaml # Task editing flow
130
+ ├── locales/
131
+ └── en.json # English locale (ICU MessageFormat)
132
+ └── platform/
133
+ ├── ios.yaml # SwiftUI overrides + behaviors
134
+ ├── android.yaml # Compose overrides + behaviors
135
+ └── web.yaml # React overrides + responsive rules
136
+ │ └── todo-orbit/ # Full showcase app with generated targets
137
+ │ ├── openuispec/ # Source OpenUISpec project
138
+ │ ├── generated/ # Generated iOS, Android, and web apps
139
+ │ └── artifacts/ # Screenshots and supporting outputs
123
140
  ├── cli/ # CLI tool (openuispec init, drift, validate)
124
141
  │ ├── index.ts # Entry point
125
142
  │ └── init.ts # Project scaffolding + AI rules
@@ -214,7 +231,7 @@ Paths are relative to `openuispec.yaml`. The `.openuispec-state.json` file is st
214
231
 
215
232
  ## Status
216
233
 
217
- **v0.1 — Draft**. The spec covers all foundational layers. One complete example app (TaskFlow) demonstrates full coverage.
234
+ **v0.1 — Draft**. The spec covers all foundational layers. TaskFlow provides a compact reference app, and Todo Orbit extends coverage with localization, recurring-rule flows, custom contracts, and generated native/web targets.
218
235
 
219
236
  ### Roadmap
220
237
 
@@ -231,6 +248,7 @@ Paths are relative to `openuispec.yaml`. The `.openuispec-state.json` file is st
231
248
  - [x] Form system (validation rules, field dependencies)
232
249
  - [x] Drift detection (spec change tracking per platform)
233
250
  - [x] CLI tool (`openuispec init` for project scaffolding + AI rules)
251
+ - [x] Multi-platform showcase app (`examples/todo-orbit/`)
234
252
  - [ ] More example apps (e-commerce, social, dashboard)
235
253
 
236
254
  ## Contributing
package/cli/index.ts CHANGED
@@ -43,7 +43,7 @@ Usage:
43
43
  openuispec drift --snapshot --target <t> Snapshot current state
44
44
  openuispec validate [group...] Validate spec files
45
45
 
46
- Validate groups: manifest, tokens, screens, flows, platform, locales, custom_contracts
46
+ Validate groups: manifest, tokens, screens, flows, platform, locales, contracts
47
47
 
48
48
  Docs: https://openuispec.rsteam.uz
49
49
  `);
package/cli/init.ts CHANGED
@@ -128,7 +128,7 @@ function specReadmeTemplate(name: string, targets: string[]): string {
128
128
 
129
129
  This directory contains the **OpenUISpec** semantic UI specification for **${name}**.
130
130
 
131
- OpenUISpec is a YAML-based format that describes your app's UI semantically — tokens, screens, flows, and platform overrides. AI reads the spec and generates native code (SwiftUI, Compose, React). The spec is the single source of truth across all platforms.
131
+ **Start here:** read \`openuispec.yaml\` it defines the project structure, data model, API endpoints, and generation targets (**${targetList}**).
132
132
 
133
133
  ## Directory structure
134
134
 
@@ -137,113 +137,26 @@ OpenUISpec is a YAML-based format that describes your app's UI semantically —
137
137
  | \`tokens/\` | Design tokens — colors, typography, spacing, elevation, motion, icons, themes |
138
138
  | \`screens/\` | Screen definitions — one YAML file per screen |
139
139
  | \`flows/\` | Navigation flows — multi-step user journeys |
140
- | \`contracts/\` | Component contracts — standard extensions (variants, tokens) and custom (\`x_\` prefixed) |
140
+ | \`contracts/\` | Component contracts — standard extensions and custom (\`x_\` prefixed) |
141
141
  | \`platform/\` | Platform overrides — per-target (iOS, Android, Web) behaviors |
142
142
  | \`locales/\` | Localization — i18n strings (JSON, ICU MessageFormat) |
143
143
 
144
- All directory paths are configured in \`openuispec.yaml\` under \`includes:\` and support relative paths. For example, to share locales across projects:
145
- \`\`\`yaml
146
- includes:
147
- locales: "../../shared/locales" # resolved relative to openuispec.yaml
148
- \`\`\`
149
-
150
- ## Getting started
151
-
152
- **Start here:** read \`openuispec.yaml\` — it's the root manifest that defines the project structure, data model, API endpoints, and generation targets.
153
-
154
- ### New project (no existing UI code)
155
-
156
- 1. Define your data model and API endpoints in \`openuispec.yaml\`
157
- 2. Create token files in \`tokens/\` (colors, typography, spacing)
158
- 3. Create screen specs in \`screens/\` (one YAML per screen)
159
- 4. Create navigation flows in \`flows/\`
160
- 5. Ask AI to generate native code from the spec
161
-
162
- ### Existing project (adopting OpenUISpec)
163
-
164
- 1. Scan the codebase for existing UI screens
165
- 2. Create a stub for each screen in \`screens/\`:
166
- \`\`\`yaml
167
- screen_name:
168
- semantic: "Brief description of what this screen does"
169
- status: stub
170
- layout:
171
- type: scroll_vertical
172
- \`\`\`
173
- 3. Extract design tokens (colors, fonts, spacing) into \`tokens/\`
174
- 4. Fill in \`data_model\` and \`api.endpoints\` in \`openuispec.yaml\`
175
- 5. Spec screens incrementally: \`stub\` → \`draft\` → \`ready\`
176
-
177
- ## Screen and flow status
178
-
179
- - \`stub\` — placeholder, not yet specced. Drift detection skips these.
180
- - \`draft\` — actively being specced. Tracked by drift.
181
- - \`ready\` — fully specified (default if omitted). Tracked by drift.
182
-
183
- ## Learning OpenUISpec — where to find the docs
184
-
185
- All documentation is included in the installed \`openuispec\` package. Search for it in this order:
186
- 1. **Local:** \`node_modules/openuispec/\` (if installed as a project dependency)
187
- 2. **Global:** run \`npm root -g\` to find the global prefix, then look in \`<prefix>/openuispec/\`
188
- 3. **Online fallback:** if the package is not installed at all, fetch from:
189
- - \`https://openuispec.rsteam.uz/llms-full.txt\` — complete spec + all JSON schemas in one file
190
- - \`https://openuispec.rsteam.uz/llms.txt\` — concise summary with links
191
-
192
- Inside the package:
193
- - **Full specification:** \`spec/openuispec-v0.1.md\`
194
- - **Example app:** \`examples/taskflow/\`
195
- - **JSON Schemas:** \`schema/\`
196
-
197
- ## Token file structure — root wrapper key required
198
-
199
- Every token file must have a single root key matching the token type. Do NOT put properties at the top level.
200
-
201
- \`\`\`yaml
202
- # ✅ Correct — tokens/typography.yaml
203
- typography:
204
- font_family: ...
205
- scale: ...
206
-
207
- # ❌ Wrong — missing root wrapper key
208
- font_family: ...
209
- scale: ...
210
- \`\`\`
211
-
212
- Root keys: \`color\`, \`typography\`, \`spacing\`, \`elevation\`, \`motion\`, \`layout\`, \`themes\`, \`icons\`.
213
-
214
- ## File formats and schemas
215
-
216
- **IMPORTANT:** Before creating or editing any spec file, read the corresponding JSON Schema to understand the valid structure. Do not guess the file format.
217
-
218
- | File | Schema | Root key |
219
- |------|--------|----------|
220
- | \`openuispec.yaml\` | \`openuispec.schema.json\` | \`spec_version\` |
221
- | \`screens/*.yaml\` | \`screen.schema.json\` | \`<screen_id>\` |
222
- | \`flows/*.yaml\` | \`flow.schema.json\` | \`<flow_id>\` |
223
- | \`platform/*.yaml\` | \`platform.schema.json\` | \`platform\` |
224
- | \`locales/*.json\` | \`locale.schema.json\` | (object) |
225
- | \`contracts/<name>.yaml\` | \`contract.schema.json\` | \`<contract_name>\` |
226
- | \`contracts/x_*.yaml\` | \`custom-contract.schema.json\` | \`<x_name>\` |
227
- | \`tokens/color.yaml\` | \`tokens/color.schema.json\` | \`color\` |
228
- | \`tokens/typography.yaml\` | \`tokens/typography.schema.json\` | \`typography\` |
229
- | \`tokens/spacing.yaml\` | \`tokens/spacing.schema.json\` | \`spacing\` |
230
- | \`tokens/elevation.yaml\` | \`tokens/elevation.schema.json\` | \`elevation\` |
231
- | \`tokens/motion.yaml\` | \`tokens/motion.schema.json\` | \`motion\` |
232
- | \`tokens/layout.yaml\` | \`tokens/layout.schema.json\` | \`layout\` |
233
- | \`tokens/themes.yaml\` | \`tokens/themes.schema.json\` | \`themes\` |
234
- | \`tokens/icons.yaml\` | \`tokens/icons.schema.json\` | \`icons\` |
235
-
236
- All schemas are in \`schema/\` inside the installed package. Shared type definitions (actions, data-binding, adaptive, validation, common) are in \`schema/defs/\`.
144
+ ## IMPORTANT Read the specification before working with spec files
237
145
 
238
- **Workflow:** read the schema read an example from \`examples/taskflow/\` create the YAML → run \`openuispec validate\`.
146
+ The spec format, file schemas, and generation rules are defined in the installed \`openuispec\` package.
147
+ You MUST read these reference files before creating, editing, or generating from any spec file.
148
+ Do NOT guess the file format — skipping this step will produce invalid YAML that fails validation.
239
149
 
240
- ## Spec format quick reference
150
+ **Find the package in this order:**
151
+ 1. \`node_modules/openuispec/\` (project dependency)
152
+ 2. Run \`npm root -g\` → \`<prefix>/openuispec/\` (global install)
153
+ 3. Online: \`https://openuispec.rsteam.uz/llms-full.txt\` (if not installed)
241
154
 
242
- - **7 contract families:** nav_container, surface, action_trigger, input_field, data_display, collection, feedback
243
- - **Custom contracts:** prefixed with \`x_\` (e.g., \`x_media_player\`)
244
- - **Data binding:** \`$data:\`, \`$state:\`, \`$param:\`, \`$t:\` prefixes
245
- - **Actions:** typed objects navigate, api_call, set_state, confirm, sequence, feedback, etc.
246
- - **Adaptive layout:** size classes (compact, regular, expanded) with per-section overrides
155
+ **Reference files inside the package (read in this order):**
156
+ 1. \`README.md\` schema tables, file format reference, root keys
157
+ 2. \`spec/openuispec-v0.1.md\` full specification (contracts, layout, expressions, etc.)
158
+ 3. \`examples/taskflow/\`complete working example with all file types
159
+ 4. \`schema/\` JSON Schemas for validation
247
160
 
248
161
  ## CLI commands
249
162
 
@@ -252,34 +165,11 @@ openuispec validate # Validate spec files against schemas
252
165
  openuispec validate screens # Validate only screens
253
166
  openuispec drift --target ${targets[0]} # Check for spec drift
254
167
  openuispec drift --snapshot --target ${targets[0]} # Snapshot current state
255
- openuispec drift --all # Include stubs in drift check
256
- \`\`\`
257
-
258
- ## Targets and output directories
259
-
260
- This project generates native code for: **${targetList}**
261
-
262
- By default, drift stores state in \`generated/<target>/<project>/\`. To point targets to your actual code directories, add \`output_dir\` to \`openuispec.yaml\`:
263
-
264
- \`\`\`yaml
265
- generation:
266
- targets: [ios, android, web]
267
- output_dir:
268
- web: "../web-ui/"
269
- android: "../kmp-ui/"
270
- ios: "../kmp-ui/iosApp/"
271
168
  \`\`\`
272
169
 
273
- Paths are relative to \`openuispec.yaml\`.
274
-
275
170
  ## Learn more
276
171
 
277
- All docs and examples are in the installed \`openuispec\` package — check \`node_modules/openuispec/\` or run \`npm root -g\` for the global install path.
278
-
279
- - Full spec: \`spec/openuispec-v0.1.md\`
280
- - Example app: \`examples/taskflow/\`
281
- - JSON Schemas: \`schema/\`
282
- - Online reference: \`https://openuispec.rsteam.uz/llms-full.txt\`
172
+ Docs: https://openuispec.rsteam.uz
283
173
  `;
284
174
  }
285
175
 
@@ -292,26 +182,47 @@ function aiRulesBlock(specDir: string, targets: string[]): string {
292
182
  # Spec files are the single source of truth for all UI across platforms.
293
183
  # Targets: ${targetList}
294
184
 
185
+ ## IMPORTANT — Read the specification before working with spec files
186
+
187
+ The spec format, file schemas, and generation rules are defined in the installed \`openuispec\` package.
188
+ You MUST read the reference files listed below before creating, editing, or generating from any spec file.
189
+ Do NOT guess the file format — skipping this step will produce invalid YAML that fails validation.
190
+
191
+ **Find the package in this order:**
192
+ 1. \`node_modules/openuispec/\` (project dependency)
193
+ 2. Run \`npm root -g\` → \`<prefix>/openuispec/\` (global install)
194
+ 3. Online: \`https://openuispec.rsteam.uz/llms-full.txt\` (if not installed)
195
+
196
+ **Reference files inside the package (read in this order):**
197
+ 1. \`README.md\` — schema tables, file format reference, root wrapper keys
198
+ 2. \`spec/openuispec-v0.1.md\` — full specification (contracts, layout, expressions, adaptive, etc.)
199
+ 3. \`examples/taskflow/\` — complete working example with all file types
200
+ 4. \`schema/\` — JSON Schemas for every file type
201
+
202
+ These files are updated with each package version. Always read from the installed package,
203
+ not from cached or memorized content, to ensure you use the latest spec.
204
+
295
205
  ## What is OpenUISpec
296
206
  OpenUISpec is a YAML-based spec format that describes an app's UI semantically — tokens, screens, flows, and platform overrides. AI reads the spec and generates native code (SwiftUI, Compose, React). AI reads native code and updates the spec. The spec is the sync layer between platforms.
297
207
 
298
208
  ## Spec location
299
209
  - Spec root: \`${specDir}/\`
300
210
  - Manifest: \`${specDir}/openuispec.yaml\` — always read this first.
301
- - Tokens: \`${specDir}/tokens/\` — colors, typography, spacing, motion, icons, themes
302
- - Screens: \`${specDir}/screens/\` — one YAML file per screen
303
- - Flows: \`${specDir}/flows/\` — multi-step navigation journeys
304
- - Contracts: \`${specDir}/contracts/\` — standard extensions (variants, tokens) and custom (\`x_\` prefixed)
305
- - Platform: \`${specDir}/platform/\` — per-target overrides (iOS, Android, Web)
306
- - Locales: \`${specDir}/locales/\` — i18n strings (JSON, ICU MessageFormat)
211
+ - Tokens: \`${specDir}/tokens/\`
212
+ - Screens: \`${specDir}/screens/\`
213
+ - Flows: \`${specDir}/flows/\`
214
+ - Contracts: \`${specDir}/contracts/\`
215
+ - Platform: \`${specDir}/platform/\`
216
+ - Locales: \`${specDir}/locales/\`
307
217
 
308
- **Note:** These are the default paths. Actual paths are in \`includes:\` in \`openuispec.yaml\` and may use relative paths (e.g. \`../../shared/locales\`). Always read \`openuispec.yaml\` to find the real directories.
218
+ **Note:** These are the default paths. Actual paths are in \`includes:\` in \`openuispec.yaml\` and may use relative paths. Always read \`openuispec.yaml\` to find the real directories.
309
219
 
310
220
  ## If spec directories are empty (first-time setup)
311
221
  This means the project has existing UI code but hasn't been specced yet. Your job:
312
222
 
313
- 1. **Find existing screens** — scan the codebase for UI screen files (SwiftUI views, Compose screens, React components/pages).
314
- 2. **Create stubs** — for each screen, create \`${specDir}/screens/<name>.yaml\` with:
223
+ 1. **Read the spec first** — find and read \`spec/openuispec-v0.1.md\` from the installed package.
224
+ 2. **Find existing screens** — scan the codebase for UI screen files.
225
+ 3. **Create stubs** — for each screen, create \`${specDir}/screens/<name>.yaml\` with:
315
226
  \`\`\`yaml
316
227
  screen_name:
317
228
  semantic: "Brief description of what this screen does"
@@ -319,14 +230,8 @@ This means the project has existing UI code but hasn't been specced yet. Your jo
319
230
  layout:
320
231
  type: scroll_vertical
321
232
  \`\`\`
322
- 3. **Extract tokens** — scan the codebase for colors, fonts, spacing values and create token files in \`${specDir}/tokens/\`.
323
- 4. **Update the manifest** — fill in \`data_model\` and \`api.endpoints\` in \`${specDir}/openuispec.yaml\` based on the existing code.
324
- 5. **Spec screens on demand** — when the user asks to spec a screen, read the native code, create a full spec, and change \`status: draft\` → \`ready\`.
325
-
326
- ## Screen and flow status
327
- - \`stub\` — placeholder, not yet specced. Drift detection skips these.
328
- - \`draft\` — actively being specced. Tracked by drift.
329
- - \`ready\` — fully specified (default if omitted). Tracked by drift.
233
+ 4. **Extract tokens** — scan for colors, fonts, spacing and create files in \`${specDir}/tokens/\`.
234
+ 5. **Update the manifest** — fill in \`data_model\` and \`api.endpoints\` in \`${specDir}/openuispec.yaml\`.
330
235
 
331
236
  ## Making UI changes
332
237
  1. Read the relevant spec files before modifying any UI code.
@@ -340,74 +245,6 @@ This means the project has existing UI code but hasn't been specced yet. Your jo
340
245
  2. Run \`openuispec drift --snapshot --target <target>\` for each affected platform.
341
246
  3. Run \`openuispec drift\` to verify no untracked drift remains.
342
247
 
343
- ## Learning OpenUISpec — where to find the docs
344
- All documentation is in the installed \`openuispec\` package. Search in this order:
345
- 1. **Local:** \`node_modules/openuispec/\` (project dependency)
346
- 2. **Global:** run \`npm root -g\` to get the global prefix, then look in \`<prefix>/openuispec/\`
347
- 3. **Online fallback:** if not installed, fetch from:
348
- - \`https://openuispec.rsteam.uz/llms-full.txt\` — complete spec + all JSON schemas
349
- - \`https://openuispec.rsteam.uz/llms.txt\` — concise summary with links
350
-
351
- Inside the package:
352
- 1. **Full specification:** \`spec/openuispec-v0.1.md\` — the complete spec (read this to understand the format)
353
- 2. **Example app:** \`examples/taskflow/\` — a complete working app with all file types
354
- 3. **JSON Schemas:** \`schema/\` — validation schemas that define the exact structure of every file type
355
-
356
- ## Token file structure — root wrapper key required
357
- Every token file must have a single root key matching the token type. Do NOT put properties at the top level.
358
- - \`tokens/color.yaml\` → root key: \`color\`
359
- - \`tokens/typography.yaml\` → root key: \`typography\`
360
- - \`tokens/spacing.yaml\` → root key: \`spacing\`
361
- - \`tokens/elevation.yaml\` → root key: \`elevation\`
362
- - \`tokens/motion.yaml\` → root key: \`motion\`
363
- - \`tokens/layout.yaml\` → root key: \`layout\`
364
- - \`tokens/themes.yaml\` → root key: \`themes\`
365
- - \`tokens/icons.yaml\` → root key: \`icons\`
366
-
367
- ## File formats and schemas — read before creating spec files
368
- Before creating or editing any spec file, read the corresponding JSON Schema. Do not guess the file format.
369
-
370
- | File | Schema (in \`schema/\` inside the installed package) | Root key |
371
- |------|--------|----------|
372
- | \`openuispec.yaml\` | \`openuispec.schema.json\` | \`spec_version\` |
373
- | \`screens/*.yaml\` | \`screen.schema.json\` | \`<screen_id>\` |
374
- | \`flows/*.yaml\` | \`flow.schema.json\` | \`<flow_id>\` |
375
- | \`platform/*.yaml\` | \`platform.schema.json\` | \`platform\` |
376
- | \`locales/*.json\` | \`locale.schema.json\` | (object) |
377
- | \`contracts/<name>.yaml\` | \`contract.schema.json\` | \`<contract_name>\` |
378
- | \`contracts/x_*.yaml\` | \`custom-contract.schema.json\` | \`<x_name>\` |
379
- | \`tokens/color.yaml\` | \`tokens/color.schema.json\` | \`color\` |
380
- | \`tokens/typography.yaml\` | \`tokens/typography.schema.json\` | \`typography\` |
381
- | \`tokens/spacing.yaml\` | \`tokens/spacing.schema.json\` | \`spacing\` |
382
- | \`tokens/elevation.yaml\` | \`tokens/elevation.schema.json\` | \`elevation\` |
383
- | \`tokens/motion.yaml\` | \`tokens/motion.schema.json\` | \`motion\` |
384
- | \`tokens/layout.yaml\` | \`tokens/layout.schema.json\` | \`layout\` |
385
- | \`tokens/themes.yaml\` | \`tokens/themes.schema.json\` | \`themes\` |
386
- | \`tokens/icons.yaml\` | \`tokens/icons.schema.json\` | \`icons\` |
387
-
388
- Shared type definitions (actions, data-binding, adaptive, validation, common) are in \`schema/defs/\`.
389
-
390
- Workflow: read the schema → read an example from \`examples/taskflow/\` → create the YAML → run \`openuispec validate\`.
391
-
392
- ## Spec format reference
393
- - 7 contract families: nav_container, surface, action_trigger, input_field, data_display, collection, feedback
394
- - Custom contracts: prefixed with \`x_\` (e.g., \`x_media_player\`)
395
- - Data binding: \`$data:\`, \`$state:\`, \`$param:\`, \`$t:\` prefixes
396
- - Actions: typed objects (navigate, api_call, set_state, confirm, sequence, feedback, etc.)
397
- - Adaptive layout: size classes (compact, regular, expanded) with per-section overrides
398
-
399
- ## Output directories
400
- Drift tracks spec changes per target. By default state is stored in \`generated/<target>/<project>/\`.
401
- To map targets to actual code directories, set \`generation.output_dir\` in \`openuispec.yaml\`:
402
- \`\`\`yaml
403
- generation:
404
- output_dir:
405
- web: "../web-ui/"
406
- android: "../kmp-ui/"
407
- ios: "../kmp-ui/iosApp/"
408
- \`\`\`
409
- Paths are relative to \`openuispec.yaml\`. The \`.openuispec-state.json\` file is stored inside each output directory.
410
-
411
248
  ## CLI commands
412
249
  - \`openuispec init\` — scaffold a new spec project
413
250
  - \`openuispec validate [group...]\` — validate spec files against schemas
@@ -0,0 +1,97 @@
1
+ # OpenUISpec Stress Test & Maturity Assessment
2
+
3
+ Date: 2026-03-14
4
+
5
+ ## Scope
6
+ This assessment stress-tested the project at four layers:
7
+
8
+ 1. **Schema correctness pressure** across both reference specs (`taskflow`, `todo-orbit`).
9
+ 2. **Type safety and implementation consistency** in the TypeScript toolchain.
10
+ 3. **Change-tracking workflow resilience** using drift snapshot/check across all declared targets.
11
+ 4. **Generated output comparison** to verify functional parity across platform outputs without requiring pixel-perfect identity.
12
+
13
+ ## Commands executed
14
+
15
+ ```bash
16
+ npm ci
17
+ npm run validate # from examples/taskflow (workspace script)
18
+ npx tsx ../../../schema/validate.ts # from examples/todo-orbit/openuispec
19
+ npx tsc --noEmit
20
+ for t in ios android web; do
21
+ npx tsx ../../../drift/index.ts --snapshot --target "$t"
22
+ npx tsx ../../../drift/index.ts --target "$t"
23
+ done
24
+ python - <<'PY'
25
+ from pathlib import Path
26
+ roots={
27
+ 'web':Path('examples/todo-orbit/generated/web/Todo Orbit/src'),
28
+ 'ios':Path('examples/todo-orbit/generated/ios/Todo Orbit/Sources/TodoOrbit'),
29
+ 'android':Path('examples/todo-orbit/generated/android/Todo Orbit/app/src/main/java/uz/rsteam/todoorbit')
30
+ }
31
+ for k,r in roots.items():
32
+ code=[p for p in r.rglob('*') if p.is_file() and p.suffix in ['.tsx','.ts','.swift','.kt','.css']]
33
+ loc=sum(sum(1 for _ in p.open('r',encoding='utf-8')) for p in code)
34
+ print(f"{k}: files={len(code)} loc={loc}")
35
+ PY
36
+ rg --files "examples/todo-orbit/artifacts/screenshots"
37
+ ```
38
+
39
+ ## Results summary
40
+
41
+ - **Validation stress**: Passed for both example projects (all manifests, tokens, screens, flows, platform files, locales, and contracts).
42
+ - **Compiler stress**: `tsc --noEmit` passed.
43
+ - **Workflow stress (drift)**:
44
+ - Initial condition required snapshots (expected for first run).
45
+ - After snapshot creation, all three targets (`ios`, `android`, `web`) reported **0 changed / 0 added / 0 removed**.
46
+
47
+ ## Generated output comparison (functional parity, not pixel parity)
48
+
49
+ The repository already frames Todo Orbit as a showcase with generated outputs for web, iOS, and Android. In this model, differences in structure/styling between generators or AI agents are expected.
50
+
51
+ ### Comparison policy used
52
+
53
+ - **Do compare**: coverage of screens/flows/features, data model usage, localization support, and contract intent.
54
+ - **Do not require**: identical widget trees, identical naming, exact spacing/typography values, or 1:1 rendered pixels.
55
+
56
+ ### Observed output differences (expected)
57
+
58
+ - Web output is centralized in a small React surface (`src/App.tsx`, `src/main.tsx`, `src/styles.css`), while iOS/Android split into screen/component/flow files in platform-native patterns.
59
+ - Code volume differs by target (`web: 3 files / 3013 LOC`, `ios: 11 files / 1516 LOC`, `android: 11 files / 1992 LOC`), which is normal because generated architecture choices vary by platform and template style.
60
+
61
+ ### Observed output alignment (good)
62
+
63
+ - All targets include the same core feature set represented in spec: home/tasks, analytics, settings, task editor flow, and recurring-rule flow.
64
+ - Localization assets exist for EN/RU in generated native outputs and in web runtime messages.
65
+ - Reference screenshots exist for corresponding web and Android screens (`home`, `analytics`, `settings`), indicating practical parity at user-flow level rather than pixel-level equivalence.
66
+
67
+ ## Maturity score (0–5)
68
+
69
+ - **Specification maturity: 4.0 / 5**
70
+ - Strong: clear schema decomposition, contract model, and examples.
71
+ - Gap: project still explicitly marked **v0.1 Draft**.
72
+
73
+ - **Implementation maturity: 3.9 / 5**
74
+ - Strong: deterministic validators, lint-like contract usage checks, drift hashing, and multi-target generated examples.
75
+ - Gap: limited automated unit/integration test coverage in root scripts.
76
+
77
+ - **Operational readiness: 3.7 / 5**
78
+ - Strong: practical CLI workflows for init/validate/drift and documented generated project layout.
79
+ - Gap: baseline onboarding friction for generated app dependency installation can be high in constrained environments.
80
+
81
+ **Overall maturity estimate: 3.9 / 5 (promising, near early-production for spec tooling, with remaining work in generator conformance automation).**
82
+
83
+ ## What this says about idea–implementation fit
84
+
85
+ - **Idea fit is high**: the repository architecture matches the thesis (“share semantic intent, generate native apps”).
86
+ - **Implementation fit is good**: current tooling already enforces many promised invariants (schema + contract usage + drift).
87
+ - **Cross-generator variance is acceptable**: output can differ by coding agent/LLM as long as contract behavior and user flows remain faithful to spec intent.
88
+ - **Main risk is ecosystem hardening, not concept validity**: next maturity gains likely come from deeper automated tests, generator conformance tests, and CI reproducibility across generated targets.
89
+
90
+ ## Recommended next stress tests
91
+
92
+ 1. Add a `test` script with unit tests for validator edge-cases (especially custom contracts and malformed wrappers).
93
+ 2. Add golden-file conformance tests for drift output and schema error formatting.
94
+ 3. Add CI matrix that validates both examples + executes drift check for all targets.
95
+ 4. Add conformance checks that compare generated outputs on **feature parity** (screens, flows, actions, i18n keys), not snapshot pixel identity.
96
+ 5. Add “break tests” (intentionally invalid fixtures) to ensure failure messages stay actionable.
97
+ 6. Add benchmark scripts for validator runtime and drift checks on scaled synthetic specs.