synthos 0.10.0 → 0.11.0

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 (312) hide show
  1. package/README.md +5 -5
  2. package/default-pages/elevenlabs_effects_studio/chat-history.json +1 -0
  3. package/default-pages/elevenlabs_effects_studio/page.html +1345 -1363
  4. package/default-pages/elevenlabs_effects_studio/page.json +13 -11
  5. package/default-pages/elevenlabs_voice_studio/chat-history.json +1 -0
  6. package/default-pages/elevenlabs_voice_studio/page.html +782 -801
  7. package/default-pages/elevenlabs_voice_studio/page.json +13 -11
  8. package/default-pages/json_tools/chat-history.json +1 -0
  9. package/default-pages/json_tools/page.html +70 -90
  10. package/default-pages/json_tools/page.json +12 -10
  11. package/default-pages/my_notes/chat-history.json +1 -0
  12. package/default-pages/my_notes/page.html +115 -131
  13. package/default-pages/my_notes/page.json +14 -12
  14. package/default-pages/neon_asteroids/chat-history.json +1 -0
  15. package/default-pages/neon_asteroids/page.html +1777 -1803
  16. package/default-pages/neon_asteroids/page.json +14 -12
  17. package/default-pages/oregon_trail/chat-history.json +1 -0
  18. package/default-pages/oregon_trail/page.html +290 -307
  19. package/default-pages/oregon_trail/page.json +14 -12
  20. package/default-pages/solar_explorer/chat-history.json +1 -0
  21. package/default-pages/solar_explorer/page.html +1929 -1951
  22. package/default-pages/solar_explorer/page.json +14 -12
  23. package/default-pages/solar_tutorial/chat-history.json +1 -0
  24. package/default-pages/solar_tutorial/page.html +464 -478
  25. package/default-pages/solar_tutorial/page.json +12 -10
  26. package/default-pages/us_map/chat-history.json +1 -0
  27. package/default-pages/us_map/page.html +170 -193
  28. package/default-pages/us_map/page.json +14 -12
  29. package/default-pages/us_map/page.light.png +0 -0
  30. package/default-pages/us_map_1850/chat-history.json +1 -0
  31. package/default-pages/us_map_1850/page.html +302 -326
  32. package/default-pages/us_map_1850/page.json +14 -12
  33. package/default-pages/western_cities_1850/chat-history.json +1 -0
  34. package/default-pages/western_cities_1850/page.html +503 -527
  35. package/default-pages/western_cities_1850/page.json +14 -12
  36. package/default-themes/aurora-dawn.v3.css +15 -14
  37. package/default-themes/aurora-dusk.v3.css +26 -26
  38. package/default-themes/cosmos-dawn.v3.css +15 -14
  39. package/default-themes/cosmos-dusk.v3.css +26 -26
  40. package/default-themes/elemental-dawn.v3.css +200 -0
  41. package/default-themes/nebula-dawn.v3.css +15 -14
  42. package/default-themes/nebula-dusk.v3.css +24 -24
  43. package/default-themes/solar-flare-dawn.v3.css +15 -14
  44. package/default-themes/solar-flare-dusk.v3.css +26 -26
  45. package/dist/builders/anthropic.d.ts +26 -2
  46. package/dist/builders/anthropic.d.ts.map +1 -1
  47. package/dist/builders/anthropic.js +132 -31
  48. package/dist/builders/anthropic.js.map +1 -1
  49. package/dist/builders/claudecode.d.ts +13 -0
  50. package/dist/builders/claudecode.d.ts.map +1 -0
  51. package/dist/builders/claudecode.js +253 -0
  52. package/dist/builders/claudecode.js.map +1 -0
  53. package/dist/builders/index.d.ts +2 -1
  54. package/dist/builders/index.d.ts.map +1 -1
  55. package/dist/builders/index.js +8 -1
  56. package/dist/builders/index.js.map +1 -1
  57. package/dist/builders/openai.js +2 -1
  58. package/dist/builders/openai.js.map +1 -1
  59. package/dist/builders/types.d.ts +31 -7
  60. package/dist/builders/types.d.ts.map +1 -1
  61. package/dist/builders/types.js +60 -28
  62. package/dist/builders/types.js.map +1 -1
  63. package/dist/connectors/types.d.ts +8 -0
  64. package/dist/connectors/types.d.ts.map +1 -1
  65. package/dist/init.d.ts.map +1 -1
  66. package/dist/init.js +13 -6
  67. package/dist/init.js.map +1 -1
  68. package/dist/migrations.d.ts.map +1 -1
  69. package/dist/migrations.js +161 -14
  70. package/dist/migrations.js.map +1 -1
  71. package/dist/models/anthropic.d.ts +1 -0
  72. package/dist/models/anthropic.d.ts.map +1 -1
  73. package/dist/models/anthropic.js +129 -29
  74. package/dist/models/anthropic.js.map +1 -1
  75. package/dist/models/chainOfThought.d.ts.map +1 -1
  76. package/dist/models/chainOfThought.js +32 -19
  77. package/dist/models/chainOfThought.js.map +1 -1
  78. package/dist/models/index.d.ts +2 -2
  79. package/dist/models/index.d.ts.map +1 -1
  80. package/dist/models/index.js +2 -1
  81. package/dist/models/index.js.map +1 -1
  82. package/dist/models/providers.d.ts +1 -0
  83. package/dist/models/providers.d.ts.map +1 -1
  84. package/dist/models/providers.js +12 -4
  85. package/dist/models/providers.js.map +1 -1
  86. package/dist/models/types.d.ts +15 -1
  87. package/dist/models/types.d.ts.map +1 -1
  88. package/dist/models/types.js.map +1 -1
  89. package/dist/pages.d.ts +57 -8
  90. package/dist/pages.d.ts.map +1 -1
  91. package/dist/pages.js +258 -45
  92. package/dist/pages.js.map +1 -1
  93. package/dist/service/createCompletePrompt.d.ts.map +1 -1
  94. package/dist/service/createCompletePrompt.js +5 -0
  95. package/dist/service/createCompletePrompt.js.map +1 -1
  96. package/dist/service/mediaCache.d.ts +36 -0
  97. package/dist/service/mediaCache.d.ts.map +1 -0
  98. package/dist/service/mediaCache.js +182 -0
  99. package/dist/service/mediaCache.js.map +1 -0
  100. package/dist/service/pageValidator.d.ts +25 -0
  101. package/dist/service/pageValidator.d.ts.map +1 -0
  102. package/dist/service/pageValidator.js +315 -0
  103. package/dist/service/pageValidator.js.map +1 -0
  104. package/dist/service/server.d.ts.map +1 -1
  105. package/dist/service/server.js +4 -0
  106. package/dist/service/server.js.map +1 -1
  107. package/dist/service/sharedTableSchema.d.ts +73 -0
  108. package/dist/service/sharedTableSchema.d.ts.map +1 -0
  109. package/dist/service/sharedTableSchema.js +206 -0
  110. package/dist/service/sharedTableSchema.js.map +1 -0
  111. package/dist/service/transformPage.d.ts +49 -11
  112. package/dist/service/transformPage.d.ts.map +1 -1
  113. package/dist/service/transformPage.js +354 -241
  114. package/dist/service/transformPage.js.map +1 -1
  115. package/dist/service/useApiRoutes.d.ts.map +1 -1
  116. package/dist/service/useApiRoutes.js +288 -34
  117. package/dist/service/useApiRoutes.js.map +1 -1
  118. package/dist/service/useConnectorRoutes.d.ts.map +1 -1
  119. package/dist/service/useConnectorRoutes.js +170 -32
  120. package/dist/service/useConnectorRoutes.js.map +1 -1
  121. package/dist/service/useDataRoutes.d.ts.map +1 -1
  122. package/dist/service/useDataRoutes.js +59 -2
  123. package/dist/service/useDataRoutes.js.map +1 -1
  124. package/dist/service/useExtractRoutes.d.ts +4 -0
  125. package/dist/service/useExtractRoutes.d.ts.map +1 -0
  126. package/dist/service/useExtractRoutes.js +304 -0
  127. package/dist/service/useExtractRoutes.js.map +1 -0
  128. package/dist/service/usePageRoutes.d.ts +17 -0
  129. package/dist/service/usePageRoutes.d.ts.map +1 -1
  130. package/dist/service/usePageRoutes.js +1385 -483
  131. package/dist/service/usePageRoutes.js.map +1 -1
  132. package/dist/service/useSharedDataRoutes.d.ts.map +1 -1
  133. package/dist/service/useSharedDataRoutes.js +54 -2
  134. package/dist/service/useSharedDataRoutes.js.map +1 -1
  135. package/dist/settings.d.ts +27 -0
  136. package/dist/settings.d.ts.map +1 -1
  137. package/dist/settings.js +40 -1
  138. package/dist/settings.js.map +1 -1
  139. package/dist/themes.d.ts +0 -5
  140. package/dist/themes.d.ts.map +1 -1
  141. package/dist/themes.js +3 -95
  142. package/dist/themes.js.map +1 -1
  143. package/migration-rules/v2-to-v3.md +277 -119
  144. package/package.json +5 -1
  145. package/{default-pages/application → required-pages/_shell}/page.html +56 -42
  146. package/required-pages/_shell/page.json +14 -0
  147. package/required-pages/_starters/page.html +534 -0
  148. package/required-pages/_starters/page.json +12 -0
  149. package/required-pages/builder/page.html +353 -43
  150. package/required-pages/builder/page.json +12 -10
  151. package/required-pages/pages/page.html +697 -924
  152. package/required-pages/pages/page.json +12 -10
  153. package/required-pages/settings/page.html +1879 -1753
  154. package/required-pages/settings/page.json +12 -10
  155. package/required-pages/synthos_apis/page.html +834 -845
  156. package/required-pages/synthos_apis/page.json +12 -10
  157. package/required-pages/synthos_scripts/page.html +74 -88
  158. package/required-pages/synthos_scripts/page.json +12 -10
  159. package/scripts/append-instructions.py +90 -0
  160. package/scripts/audit-instructions.py +76 -0
  161. package/scripts/cleanup-shell-markup.mjs +112 -0
  162. package/service-connectors/buffer/connector.json +46 -0
  163. package/service-connectors/canva/connector.json +67 -0
  164. package/service-connectors/elevenlabs/connector.json +1 -1
  165. package/src/builders/anthropic.ts +155 -30
  166. package/src/builders/claudecode.ts +310 -0
  167. package/src/builders/index.ts +7 -1
  168. package/src/builders/openai.ts +2 -1
  169. package/src/builders/types.ts +93 -32
  170. package/src/connectors/types.ts +8 -0
  171. package/src/init.ts +13 -7
  172. package/src/migrations.ts +187 -16
  173. package/src/models/anthropic.ts +140 -30
  174. package/src/models/chainOfThought.ts +33 -18
  175. package/src/models/index.ts +2 -2
  176. package/src/models/providers.ts +12 -3
  177. package/src/models/types.ts +21 -1
  178. package/src/pages.ts +271 -35
  179. package/src/service/createCompletePrompt.ts +6 -0
  180. package/src/service/mediaCache.ts +206 -0
  181. package/src/service/pageValidator.ts +337 -0
  182. package/src/service/server.ts +4 -0
  183. package/src/service/sharedTableSchema.ts +236 -0
  184. package/src/service/transformPage.ts +370 -260
  185. package/src/service/useApiRoutes.ts +282 -32
  186. package/src/service/useConnectorRoutes.ts +189 -34
  187. package/src/service/useDataRoutes.ts +198 -116
  188. package/src/service/useExtractRoutes.ts +331 -0
  189. package/src/service/usePageRoutes.ts +1411 -394
  190. package/src/service/useSharedDataRoutes.ts +184 -109
  191. package/src/settings.ts +65 -0
  192. package/src/themes.ts +78 -180
  193. package/starters/blank_starter/chat-history.json +1 -0
  194. package/starters/blank_starter/page.dark.png +0 -0
  195. package/starters/blank_starter/page.html +47 -0
  196. package/starters/blank_starter/page.json +13 -0
  197. package/starters/blank_starter/page.light.png +0 -0
  198. package/starters/calculator_starter/chat-history.json +1 -0
  199. package/starters/calculator_starter/page.dark.png +0 -0
  200. package/starters/calculator_starter/page.html +232 -0
  201. package/starters/calculator_starter/page.json +13 -0
  202. package/starters/calculator_starter/page.light.png +0 -0
  203. package/starters/calendar_starter/chat-history.json +1 -0
  204. package/starters/calendar_starter/page.dark.png +0 -0
  205. package/starters/calendar_starter/page.html +495 -0
  206. package/starters/calendar_starter/page.json +13 -0
  207. package/starters/calendar_starter/page.light.png +0 -0
  208. package/starters/chat_starter/chat-history.json +1 -0
  209. package/starters/chat_starter/page.dark.png +0 -0
  210. package/starters/chat_starter/page.html +351 -0
  211. package/starters/chat_starter/page.json +13 -0
  212. package/starters/chat_starter/page.light.png +0 -0
  213. package/starters/checklist_starter/chat-history.json +1 -0
  214. package/starters/checklist_starter/page.dark.png +0 -0
  215. package/starters/checklist_starter/page.html +437 -0
  216. package/starters/checklist_starter/page.json +13 -0
  217. package/starters/checklist_starter/page.light.png +0 -0
  218. package/starters/dashboard_starter/chat-history.json +1 -0
  219. package/starters/dashboard_starter/page.dark.png +0 -0
  220. package/starters/dashboard_starter/page.html +195 -0
  221. package/starters/dashboard_starter/page.json +13 -0
  222. package/starters/dashboard_starter/page.light.png +0 -0
  223. package/starters/form_starter/chat-history.json +1 -0
  224. package/starters/form_starter/page.dark.png +0 -0
  225. package/starters/form_starter/page.html +313 -0
  226. package/starters/form_starter/page.json +13 -0
  227. package/starters/form_starter/page.light.png +0 -0
  228. package/starters/gallery_starter/chat-history.json +1 -0
  229. package/starters/gallery_starter/page.dark.png +0 -0
  230. package/starters/gallery_starter/page.html +418 -0
  231. package/starters/gallery_starter/page.json +13 -0
  232. package/starters/gallery_starter/page.light.png +0 -0
  233. package/starters/generator_starter/chat-history.json +1 -0
  234. package/starters/generator_starter/page.dark.png +0 -0
  235. package/starters/generator_starter/page.html +261 -0
  236. package/starters/generator_starter/page.json +13 -0
  237. package/starters/generator_starter/page.light.png +0 -0
  238. package/starters/index.html +538 -0
  239. package/starters/kanban_starter/chat-history.json +1 -0
  240. package/starters/kanban_starter/page.dark.png +0 -0
  241. package/starters/kanban_starter/page.html +432 -0
  242. package/starters/kanban_starter/page.json +13 -0
  243. package/starters/kanban_starter/page.light.png +0 -0
  244. package/starters/presentation_builder/chat-history.json +1 -0
  245. package/starters/presentation_builder/page.dark.png +0 -0
  246. package/starters/presentation_builder/page.html +970 -0
  247. package/starters/presentation_builder/page.json +15 -0
  248. package/starters/presentation_builder/page.light.png +0 -0
  249. package/starters/presentation_builder/presentation_voice/voice_config.json +9 -0
  250. package/starters/pulse_starter/chat-history.json +1 -0
  251. package/starters/pulse_starter/page.dark.png +0 -0
  252. package/starters/pulse_starter/page.html +698 -0
  253. package/starters/pulse_starter/page.json +13 -0
  254. package/starters/pulse_starter/page.light.png +0 -0
  255. package/starters/quiz_starter/chat-history.json +1 -0
  256. package/starters/quiz_starter/page.dark.png +0 -0
  257. package/starters/quiz_starter/page.html +292 -0
  258. package/starters/quiz_starter/page.json +13 -0
  259. package/starters/quiz_starter/page.light.png +0 -0
  260. package/starters/reference_starter/chat-history.json +1 -0
  261. package/starters/reference_starter/page.dark.png +0 -0
  262. package/starters/reference_starter/page.html +250 -0
  263. package/starters/reference_starter/page.json +13 -0
  264. package/starters/reference_starter/page.light.png +0 -0
  265. package/starters/retro_game_starter/chat-history.json +1 -0
  266. package/starters/retro_game_starter/page.dark.png +0 -0
  267. package/{default-pages → starters}/retro_game_starter/page.html +1281 -1308
  268. package/starters/retro_game_starter/page.json +15 -0
  269. package/starters/retro_game_starter/page.light.png +0 -0
  270. package/starters/roster_starter/chat-history.json +1 -0
  271. package/starters/roster_starter/page.dark.png +0 -0
  272. package/starters/roster_starter/page.html +600 -0
  273. package/starters/roster_starter/page.json +13 -0
  274. package/starters/roster_starter/page.light.png +0 -0
  275. package/starters/server.js +182 -0
  276. package/starters/start.cmd +1 -0
  277. package/starters/timeline_starter/chat-history.json +1 -0
  278. package/starters/timeline_starter/page.dark.png +0 -0
  279. package/starters/timeline_starter/page.html +446 -0
  280. package/starters/timeline_starter/page.json +13 -0
  281. package/starters/timeline_starter/page.light.png +0 -0
  282. package/starters/tutorial_starter/chat-history.json +1 -0
  283. package/starters/tutorial_starter/page.dark.png +0 -0
  284. package/starters/tutorial_starter/page.html +283 -0
  285. package/starters/tutorial_starter/page.json +13 -0
  286. package/starters/tutorial_starter/page.light.png +0 -0
  287. package/static-files/agent.v3.js +122 -0
  288. package/static-files/connector.v3.js +48 -0
  289. package/static-files/extract.v3.js +188 -0
  290. package/static-files/helpers.v3.js +50 -6
  291. package/static-files/page-bridge.js +114 -0
  292. package/static-files/page.v3.js +1292 -1290
  293. package/static-files/script.v3.js +32 -0
  294. package/static-files/server.v3.js +89 -0
  295. package/static-files/shell-bridge.v3.js +174 -0
  296. package/static-files/shell-modals.v3.js +521 -0
  297. package/static-files/{shell.css → shell.v3.css} +271 -22
  298. package/static-files/shell.v3.js +1865 -0
  299. package/static-files/storage.v3.js +176 -0
  300. package/tests/anthropic.spec.ts +42 -7
  301. package/tests/builders.spec.ts +72 -4
  302. package/tests/pageValidator.spec.ts +548 -0
  303. package/tests/profiles.spec.ts +122 -0
  304. package/tests/providers.spec.ts +1 -1
  305. package/tests/sharedTableSchema.spec.ts +242 -0
  306. package/tests/transformPage.spec.ts +62 -81
  307. package/default-pages/application/page.json +0 -10
  308. package/default-pages/retro_game_starter/page.json +0 -12
  309. package/default-pages/sidebar_page/page.html +0 -51
  310. package/default-pages/sidebar_page/page.json +0 -10
  311. package/default-pages/two-panel_page/page.html +0 -68
  312. package/default-pages/two-panel_page/page.json +0 -10
@@ -1,10 +1,12 @@
1
- {
2
- "title": "Solar Tutorial",
3
- "categories": [
4
- "Tutorials"
5
- ],
6
- "pinned": false,
7
- "showInAll": true,
8
- "pageVersion": 3,
9
- "mode": "unlocked"
10
- }
1
+ {
2
+ "title": "Solar Tutorial",
3
+ "categories": [
4
+ "Tutorials"
5
+ ],
6
+ "pinned": false,
7
+ "showInAll": true,
8
+ "pageVersion": 3,
9
+ "mode": "unlocked",
10
+ "greeting": "Welcome to this Solar Tutorial! I'll guide you through building interactive features for this simulation of the Solar System. Let's start with something simple — click the chip below to try the first step:\n\n[Add a reverse time button](suggest:add%20a%20reverse%20time%20button%20so%20users%20can%20watch%20planets%20orbit%20backwards.)",
11
+ "firstRunGreeting": ""
12
+ }
@@ -0,0 +1 @@
1
+ [{"role":"assistant","content":"Here's your interactive US map! You can customize it by adding data to visualize \u2014 just tell me what you'd like to overlay. Here are a couple of ideas: Population by state \u2014 color-coded choropleth showing population density; Election results \u2014 red/blue map of voting outcomes by state; Custom data \u2014 provide your own values per state (sales figures, temperatures, rankings, etc.). What data would you like to see on the map?"}]
@@ -1,193 +1,170 @@
1
- <!DOCTYPE html><html lang="en"><head>
2
- <meta charset="UTF-8">
3
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
4
- <title>SynthOS</title>
5
- <script id="theme-info" src="/api/theme-info.js" data-locked="true"></script>
6
- <link id="theme-css" rel="stylesheet" href="/api/theme.css" data-locked="true">
7
- <style>.idle-container{position:absolute;width:100%;height:100%;pointer-events:none;opacity:1;transition:opacity 1s ease-out}.idle-container.hidden{opacity:0}.breathing-orb{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,rgba(102,126,234,.15) 0,transparent 70%);animation:4s ease-in-out infinite breathe}.breathing-orb::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:rgba(183,148,246,.6);box-shadow:0 0 20px rgba(183,148,246,.4);animation:4s ease-in-out infinite core-pulse}@keyframes breathe{0%,100%{width:80px;height:80px;opacity:.3}50%{width:120px;height:120px;opacity:.6}}@keyframes core-pulse{0%,100%{opacity:.4;box-shadow:0 0 20px rgba(183,148,246,.3)}50%{opacity:.8;box-shadow:0 0 30px rgba(183,148,246,.5)}}.orbit-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;border:1px solid rgba(102,126,234,.1);border-radius:50%;animation:20s linear infinite orbit-rotate}.orbit-ring::after{content:'';position:absolute;top:-3px;left:50%;transform:translateX(-50%);width:6px;height:6px;background:rgba(240,147,251,.5);border-radius:50%;box-shadow:0 0 10px rgba(240,147,251,.3)}@keyframes orbit-rotate{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}</style>
8
- <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js"></script>
9
- <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/14.1.1/marked.min.js"></script>
10
- <script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/11.1.0/mermaid.min.js"></script>
11
- <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
12
- <script id="page-info" src="/api/page-info.js?page=builder"></script>
13
- <script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/3.0.2/topojson.min.js" id="topojson-lib"></script><style id="us-map-styles">
14
- #us-map-container {
15
- width: 100%;
16
- height: 100%;
17
- display: flex;
18
- flex-direction: column;
19
- align-items: center;
20
- justify-content: center;
21
- background: var(--bg-primary);
22
- position: relative;
23
- overflow: hidden;
24
- }
25
- #us-map-container h2 {
26
- color: var(--text-primary);
27
- margin: 0;
28
- padding: 12px 0 4px 0;
29
- font-size: 1.4rem;
30
- font-weight: 600;
31
- letter-spacing: 0.02em;
32
- }
33
- #us-map-svg {
34
- width: 100%;
35
- flex: 1;
36
- min-height: 0;
37
- }
38
- #us-map-svg .state {
39
- fill: var(--accent-primary);
40
- stroke: var(--bg-primary);
41
- stroke-width: 1;
42
- cursor: pointer;
43
- transition: fill 0.2s ease;
44
- }
45
- #us-map-svg .state:hover {
46
- fill: var(--accent-tertiary);
47
- }
48
- #us-map-svg .state-border {
49
- fill: none;
50
- stroke: var(--bg-primary);
51
- stroke-width: 1.5;
52
- }
53
- #us-map-svg .nation-border {
54
- fill: none;
55
- stroke: var(--text-secondary);
56
- stroke-width: 1.5;
57
- }
58
- #map-tooltip {
59
- position: absolute;
60
- pointer-events: none;
61
- background: var(--bg-tertiary);
62
- color: var(--text-primary);
63
- border: 1px solid var(--border-color);
64
- border-radius: 6px;
65
- padding: 6px 12px;
66
- font-size: 0.9rem;
67
- font-weight: 500;
68
- box-shadow: 0 2px 8px rgba(0,0,0,0.12);
69
- opacity: 0;
70
- transition: opacity 0.15s ease;
71
- z-index: 10;
72
- }
73
- .light-mode #us-map-svg .state {
74
- fill: var(--accent-primary);
75
- stroke: var(--bg-primary);
76
- }
77
- .light-mode #us-map-svg .state:hover {
78
- fill: var(--accent-tertiary);
79
- }
80
- </style></head>
81
- <body>
82
- <div class="shell-toolbar" data-locked="true">
83
- <button class="shell-toolbar-btn" id="builderToggle" aria-label="Page Builder" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M7 18.5H6.2c-1.77 0-3.2-1.43-3.2-3.2V7.7C3 5.93 4.43 4.5 6.2 4.5h11.6c1.77 0 3.2 1.43 3.2 3.2v7.6c0 1.77-1.43 3.2-3.2 3.2H12l-4.2 3.2c-.5.38-1.2.02-1.2-.6V18.5Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><circle cx="8.5" cy="11.5" r="1" fill="currentColor"/><circle cx="12" cy="11.5" r="1" fill="currentColor"/><circle cx="15.5" cy="11.5" r="1" fill="currentColor"/></svg></button>
84
- <button class="shell-toolbar-btn" id="pagesBtn" aria-label="View All Pages" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none"><rect x="3" y="3" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M6 7.5h5M6 10h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><rect x="18" y="3" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M21 7.5h5M21 10h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><rect x="3" y="18" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M6 22.5h5M6 25h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><rect x="18" y="18" width="11" height="12" rx="1.5" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M21 22.5h5M21 25h3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg></button>
85
- <button class="shell-toolbar-btn" id="saveBtn" aria-label="Save Page" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M17 21v-8H7v8" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/><path d="M7 3v5h8" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/></svg></button>
86
- <div class="shell-toolbar-spacer" data-locked="true"></div>
87
- <button class="shell-toolbar-btn" id="settingsBtn" aria-label="Settings" data-locked="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" stroke="currentColor" stroke-width="1.8"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1Z" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg></button>
88
- </div>
89
- <div class="chat-panel" data-locked="true">
90
- <div class="chat-header" data-locked="true"><span>Page Builder</span><button class="chat-header-close" id="builderClose" aria-label="Close builder" data-locked="true">&times;</button></div>
91
- <div class="chat-messages" id="chatMessages" data-locked="true">
92
- <div class="chat-message" id="defaultGreeting"><p><strong>SynthOS:</strong> Here's your interactive US map! You can customize it by adding data to visualize — just tell me what you'd like to overlay. Here are a couple of ideas:
93
- <ul style="margin:8px 0 4px 0;padding-left:20px;">
94
- <li><strong>Population by state</strong> — color-coded choropleth showing population density</li>
95
- <li><strong>Election results</strong> — red/blue map of voting outcomes by state</li>
96
- <li><strong>Custom data</strong> — provide your own values per state (sales figures, temperatures, rankings, etc.)</li>
97
- </ul>
98
- What data would you like to see on the map?</p></div>
99
-
100
- </div> <form action="/" method="POST" id="chatForm" data-locked="true">
101
- <textarea class="chat-input" id="chatInput" name="message" rows="2" placeholder="Type a message..." data-locked="true"></textarea>
102
- </form>
103
- </div>
104
- <div class="viewer-panel full-viewer" id="viewerPanel"><div id="us-map-container">
105
- <h2>United States</h2>
106
- <svg id="us-map-svg"></svg>
107
- <div id="map-tooltip"></div>
108
- </div>
109
- <div id="loadingOverlay" class="loading-overlay"><div class="spinner"></div></div></div>
110
- <div id="instructions" style="display: none;" data-locked="true"></div>
111
- <div id="thoughts" style="display: none;" data-locked="true"></div>
112
- <script id="idle-animation">function hideIdleAnimation(){const idleContainer=document.getElementById("idleAnimation");idleContainer&&(idleContainer.classList.add("hidden"),setTimeout(()=>{idleContainer.style.display="none"},1e3))}function showIdleAnimation(){const idleContainer=document.getElementById("idleAnimation");idleContainer&&(idleContainer.style.display="block",setTimeout(()=>{idleContainer.classList.remove("hidden")},10))}</script>
113
- <button class="chat-toggle" aria-label="Toggle chat panel">
114
- <span class="chat-toggle-dots">
115
- <span class="chat-toggle-dot"></span>
116
- <span class="chat-toggle-dot"></span>
117
- <span class="chat-toggle-dot"></span>
118
- </span>
119
- </button>
120
-
121
-
122
- <script id="us-map-script">
123
- (function() {
124
- function initMap() {
125
- if (typeof topojson === 'undefined') {
126
- setTimeout(initMap, 100);
127
- return;
128
- }
129
-
130
- const container = document.getElementById('us-map-container');
131
- const svg = d3.select('#us-map-svg');
132
- const tooltip = document.getElementById('map-tooltip');
133
-
134
- const width = container.clientWidth;
135
- const height = container.clientHeight - 50;
136
-
137
- svg.attr('viewBox', `0 0 ${width} ${height}`)
138
- .attr('preserveAspectRatio', 'xMidYMid meet');
139
-
140
- const projection = d3.geoAlbersUsa()
141
- .fitSize([width - 40, height - 20], { type: 'Sphere' })
142
- .translate([width / 2, height / 2]);
143
-
144
- const path = d3.geoPath().projection(projection);
145
-
146
- d3.json('https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json').then(function(us) {
147
- const states = topojson.feature(us, us.objects.states);
148
-
149
- svg.selectAll('.state')
150
- .data(states.features)
151
- .enter()
152
- .append('path')
153
- .attr('class', 'state')
154
- .attr('d', path)
155
- .on('mousemove', function(event, d) {
156
- tooltip.textContent = d.properties.name;
157
- tooltip.style.opacity = '1';
158
- const rect = container.getBoundingClientRect();
159
- const x = event.clientX - rect.left + 12;
160
- const y = event.clientY - rect.top - 30;
161
- tooltip.style.left = x + 'px';
162
- tooltip.style.top = y + 'px';
163
- })
164
- .on('mouseleave', function() {
165
- tooltip.style.opacity = '0';
166
- });
167
-
168
- svg.append('path')
169
- .datum(topojson.mesh(us, us.objects.states, (a, b) => a !== b))
170
- .attr('class', 'state-border')
171
- .attr('d', path);
172
-
173
- svg.append('path')
174
- .datum(topojson.mesh(us, us.objects.nation))
175
- .attr('class', 'nation-border')
176
- .attr('d', path);
177
- }).catch(function(err) {
178
- console.error('Failed to load US map data:', err);
179
- container.innerHTML = '<p style="color:var(--text-secondary);text-align:center;padding:2rem;">Failed to load map data. Please try again.</p>';
180
- });
181
-
182
- window.addEventListener('resize', function() {
183
- const w = container.clientWidth;
184
- const h = container.clientHeight - 50;
185
- svg.attr('viewBox', `0 0 ${w} ${h}`);
186
- projection.fitSize([w - 40, h - 20], { type: 'Sphere' }).translate([w / 2, h / 2]);
187
- svg.selectAll('path').attr('d', path);
188
- });
189
- }
190
-
191
- initMap();
192
- })();
193
- </script><script id="page-helpers" src="/api/page-helpers.js?v=3" data-locked="true"></script><script id="page-script" src="/api/page-script.js?v=3" data-locked="true"></script></body></html>
1
+ <!DOCTYPE html><html lang="en"><head>
2
+ <meta charset="UTF-8">
3
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
4
+ <title>SynthOS</title>
5
+ <script id="theme-info" src="/api/theme-info.js" data-locked="true"></script>
6
+ <link id="theme-css" rel="stylesheet" href="/api/theme.css" data-locked="true">
7
+ <style>.idle-container{position:absolute;width:100%;height:100%;pointer-events:none;opacity:1;transition:opacity 1s ease-out}.idle-container.hidden{opacity:0}.breathing-orb{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,rgba(102,126,234,.15) 0,transparent 70%);animation:4s ease-in-out infinite breathe}.breathing-orb::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:rgba(183,148,246,.6);box-shadow:0 0 20px rgba(183,148,246,.4);animation:4s ease-in-out infinite core-pulse}@keyframes breathe{0%,100%{width:80px;height:80px;opacity:.3}50%{width:120px;height:120px;opacity:.6}}@keyframes core-pulse{0%,100%{opacity:.4;box-shadow:0 0 20px rgba(183,148,246,.3)}50%{opacity:.8;box-shadow:0 0 30px rgba(183,148,246,.5)}}.orbit-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;border:1px solid rgba(102,126,234,.1);border-radius:50%;animation:20s linear infinite orbit-rotate}.orbit-ring::after{content:'';position:absolute;top:-3px;left:50%;transform:translateX(-50%);width:6px;height:6px;background:rgba(240,147,251,.5);border-radius:50%;box-shadow:0 0 10px rgba(240,147,251,.3)}@keyframes orbit-rotate{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}</style>
8
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js"></script>
9
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/14.1.1/marked.min.js"></script>
10
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/11.1.0/mermaid.min.js"></script>
11
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
12
+ <script id="page-info" src="/api/page-info.js?page=builder"></script>
13
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/3.0.2/topojson.min.js" id="topojson-lib"></script><style id="us-map-styles">
14
+ #us-map-container {
15
+ width: 100%;
16
+ height: 100%;
17
+ display: flex;
18
+ flex-direction: column;
19
+ align-items: center;
20
+ justify-content: center;
21
+ background: var(--bodyBackground);
22
+ position: relative;
23
+ overflow: hidden;
24
+ }
25
+ #us-map-container h2 {
26
+ color: var(--bodyText);
27
+ margin: 0;
28
+ padding: 12px 0 4px 0;
29
+ font-size: 1.4rem;
30
+ font-weight: 600;
31
+ letter-spacing: 0.02em;
32
+ }
33
+ #us-map-svg {
34
+ width: 100%;
35
+ flex: 1;
36
+ min-height: 0;
37
+ }
38
+ #us-map-svg .state {
39
+ fill: var(--themePrimary);
40
+ stroke: var(--bodyBackground);
41
+ stroke-width: 1;
42
+ cursor: pointer;
43
+ transition: fill 0.2s ease;
44
+ }
45
+ #us-map-svg .state:hover {
46
+ fill: var(--themeSecondary);
47
+ }
48
+ #us-map-svg .state-border {
49
+ fill: none;
50
+ stroke: var(--bodyBackground);
51
+ stroke-width: 1.5;
52
+ }
53
+ #us-map-svg .nation-border {
54
+ fill: none;
55
+ stroke: var(--bodySubtext);
56
+ stroke-width: 1.5;
57
+ }
58
+ #map-tooltip {
59
+ position: absolute;
60
+ pointer-events: none;
61
+ background: var(--defaultStateBackground);
62
+ color: var(--bodyText);
63
+ border: 1px solid var(--bodyDivider);
64
+ border-radius: 6px;
65
+ padding: 6px 12px;
66
+ font-size: 0.9rem;
67
+ font-weight: 500;
68
+ box-shadow: 0 2px 8px rgba(0,0,0,0.12);
69
+ opacity: 0;
70
+ transition: opacity 0.15s ease;
71
+ z-index: 10;
72
+ }
73
+ .light-mode #us-map-svg .state {
74
+ fill: var(--themePrimary);
75
+ stroke: var(--bodyBackground);
76
+ }
77
+ .light-mode #us-map-svg .state:hover {
78
+ fill: var(--themeSecondary);
79
+ }
80
+ </style></head>
81
+ <body>
82
+ <div class="viewer-panel full-viewer" id="viewerPanel"><div id="us-map-container">
83
+ <h2>United States</h2>
84
+ <svg id="us-map-svg"></svg>
85
+ <div id="map-tooltip"></div>
86
+ </div>
87
+ </div>
88
+ <div id="instructions" style="display: none;" data-locked="true"></div>
89
+ <div id="thoughts" style="display: none;" data-locked="true"></div>
90
+ <script id="idle-animation">function hideIdleAnimation(){const idleContainer=document.getElementById("idleAnimation");idleContainer&&(idleContainer.classList.add("hidden"),setTimeout(()=>{idleContainer.style.display="none"},1e3))}function showIdleAnimation(){const idleContainer=document.getElementById("idleAnimation");idleContainer&&(idleContainer.style.display="block",setTimeout(()=>{idleContainer.classList.remove("hidden")},10))}</script>
91
+ <button class="chat-toggle" aria-label="Toggle chat panel">
92
+ <span class="chat-toggle-dots">
93
+ <span class="chat-toggle-dot"></span>
94
+ <span class="chat-toggle-dot"></span>
95
+ <span class="chat-toggle-dot"></span>
96
+ </span>
97
+ </button>
98
+
99
+ <script id="us-map-script">
100
+ (function() {
101
+ function initMap() {
102
+ if (typeof topojson === 'undefined') {
103
+ setTimeout(initMap, 100);
104
+ return;
105
+ }
106
+
107
+ const container = document.getElementById('us-map-container');
108
+ const svg = d3.select('#us-map-svg');
109
+ const tooltip = document.getElementById('map-tooltip');
110
+
111
+ const width = container.clientWidth;
112
+ const height = container.clientHeight - 50;
113
+
114
+ svg.attr('viewBox', `0 0 ${width} ${height}`)
115
+ .attr('preserveAspectRatio', 'xMidYMid meet');
116
+
117
+ const projection = d3.geoAlbersUsa()
118
+ .fitSize([width - 40, height - 20], { type: 'Sphere' })
119
+ .translate([width / 2, height / 2]);
120
+
121
+ const path = d3.geoPath().projection(projection);
122
+
123
+ d3.json('https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json').then(function(us) {
124
+ const states = topojson.feature(us, us.objects.states);
125
+
126
+ svg.selectAll('.state')
127
+ .data(states.features)
128
+ .enter()
129
+ .append('path')
130
+ .attr('class', 'state')
131
+ .attr('d', path)
132
+ .on('mousemove', function(event, d) {
133
+ tooltip.textContent = d.properties.name;
134
+ tooltip.style.opacity = '1';
135
+ const rect = container.getBoundingClientRect();
136
+ const x = event.clientX - rect.left + 12;
137
+ const y = event.clientY - rect.top - 30;
138
+ tooltip.style.left = x + 'px';
139
+ tooltip.style.top = y + 'px';
140
+ })
141
+ .on('mouseleave', function() {
142
+ tooltip.style.opacity = '0';
143
+ });
144
+
145
+ svg.append('path')
146
+ .datum(topojson.mesh(us, us.objects.states, (a, b) => a !== b))
147
+ .attr('class', 'state-border')
148
+ .attr('d', path);
149
+
150
+ svg.append('path')
151
+ .datum(topojson.mesh(us, us.objects.nation))
152
+ .attr('class', 'nation-border')
153
+ .attr('d', path);
154
+ }).catch(function(err) {
155
+ console.error('Failed to load US map data:', err);
156
+ container.innerHTML = '<p style="color:var(--bodySubtext);text-align:center;padding:2rem;">Failed to load map data. Please try again.</p>';
157
+ });
158
+
159
+ window.addEventListener('resize', function() {
160
+ const w = container.clientWidth;
161
+ const h = container.clientHeight - 50;
162
+ svg.attr('viewBox', `0 0 ${w} ${h}`);
163
+ projection.fitSize([w - 40, h - 20], { type: 'Sphere' }).translate([w / 2, h / 2]);
164
+ svg.selectAll('path').attr('d', path);
165
+ });
166
+ }
167
+
168
+ initMap();
169
+ })();
170
+ </script></body></html>
@@ -1,12 +1,14 @@
1
- {
2
- "title": "US Map",
3
- "categories": [
4
- "Starters"
5
- ],
6
- "pinned": false,
7
- "showInAll": false,
8
- "createdDate": "2026-02-17T16:47:12.135Z",
9
- "lastModified": "2026-02-17T16:51:44.761Z",
10
- "pageVersion": 3,
11
- "mode": "unlocked"
12
- }
1
+ {
2
+ "title": "US Map",
3
+ "categories": [
4
+ "_Starters"
5
+ ],
6
+ "pinned": false,
7
+ "showInAll": false,
8
+ "createdDate": "2026-02-17T16:47:12.135Z",
9
+ "lastModified": "2026-02-17T16:51:44.761Z",
10
+ "pageVersion": 3,
11
+ "mode": "unlocked",
12
+ "greeting": "Here's your interactive US map! You can customize it by adding data to visualize — just tell me what you'd like to overlay. Here are a couple of ideas: Population by state — color-coded choropleth showing population density; Election results — red/blue map of voting outcomes by state; Custom data — provide your own values per state (sales figures, temperatures, rankings, etc.). What data would you like to see on the map?",
13
+ "firstRunGreeting": ""
14
+ }
@@ -0,0 +1 @@
1
+ [{"role":"assistant","content":"Welcome! This is an interactive map of the United States circa the 1850s, showing how the country was politically organized after the Compromise of 1850. It's designed for interactive exploration \u2014 here are a few things you could try: Population density overlay \u2014 Visualize estimated population distribution across states and territories in the 1850s; Railroad & transportation routes \u2014 Map the major rail lines, trails, and waterways that connected the nation; Climate & geography zones \u2014 Overlay biomes, elevation, or average rainfall data onto the territorial boundaries; Statehood timeline animation \u2014 Animate how territories became states over time from 1776 to 1860; Resource & agriculture map \u2014 Show where key crops, minerals, and natural resources were concentrated. Just tell me what you'd like to explore!"}]