@mongoosejs/studio 0.2.13 → 0.3.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 (81) hide show
  1. package/backend/actions/ChatMessage/executeScript.js +5 -1
  2. package/backend/actions/ChatThread/createChatMessage.js +2 -1
  3. package/backend/actions/ChatThread/streamChatMessage.js +2 -2
  4. package/eslint.config.js +4 -1
  5. package/frontend/public/app.js +24642 -543
  6. package/frontend/public/dark-theme.css +365 -0
  7. package/frontend/public/images/mongoose-studio.svg +4 -0
  8. package/frontend/public/index.html +21 -1
  9. package/frontend/public/style.css +5 -7
  10. package/frontend/public/theme-variables.css +294 -0
  11. package/frontend/public/tw.css +305 -252
  12. package/frontend/src/ace-editor/ace-editor.html +4 -0
  13. package/frontend/src/ace-editor/ace-editor.js +89 -0
  14. package/frontend/src/aceEditor.js +69 -0
  15. package/frontend/src/chat/chat-message/chat-message.html +1 -1
  16. package/frontend/src/chat/chat-message/chat-message.js +1 -1
  17. package/frontend/src/chat/chat-message-script/chat-message-script.html +51 -34
  18. package/frontend/src/chat/chat-message-script/chat-message-script.js +12 -55
  19. package/frontend/src/chat/chat.html +68 -39
  20. package/frontend/src/chat/chat.js +26 -2
  21. package/frontend/src/clone-document/clone-document.html +7 -2
  22. package/frontend/src/clone-document/clone-document.js +1 -8
  23. package/frontend/src/create-dashboard/create-dashboard.html +11 -6
  24. package/frontend/src/create-dashboard/create-dashboard.js +0 -7
  25. package/frontend/src/create-document/create-document.html +15 -9
  26. package/frontend/src/create-document/create-document.js +5 -12
  27. package/frontend/src/dashboard/dashboard.html +14 -12
  28. package/frontend/src/dashboard/dashboard.js +12 -4
  29. package/frontend/src/dashboard/edit-dashboard/edit-dashboard.html +13 -7
  30. package/frontend/src/dashboard/edit-dashboard/edit-dashboard.js +13 -21
  31. package/frontend/src/dashboard-result/dashboard-chart/dashboard-chart.html +19 -17
  32. package/frontend/src/dashboard-result/dashboard-chart/dashboard-chart.js +97 -2
  33. package/frontend/src/dashboard-result/dashboard-map/dashboard-map.js +27 -3
  34. package/frontend/src/dashboard-result/dashboard-result.html +3 -3
  35. package/frontend/src/dashboards/dashboards.html +101 -109
  36. package/frontend/src/dashboards/dashboards.js +25 -1
  37. package/frontend/src/detail-default/detail-default.html +2 -2
  38. package/frontend/src/detail-default/detail-default.js +24 -3
  39. package/frontend/src/document/confirm-changes/confirm-changes.html +1 -1
  40. package/frontend/src/document/confirm-delete/confirm-delete.html +1 -1
  41. package/frontend/src/document/document.css +1 -1
  42. package/frontend/src/document/document.html +28 -28
  43. package/frontend/src/document/execute-script/execute-script.html +20 -21
  44. package/frontend/src/document/execute-script/execute-script.js +1 -43
  45. package/frontend/src/document-details/document-details.css +4 -9
  46. package/frontend/src/document-details/document-details.html +34 -33
  47. package/frontend/src/document-details/document-details.js +2 -53
  48. package/frontend/src/document-details/document-property/document-property.html +12 -12
  49. package/frontend/src/edit-array/edit-array.html +7 -6
  50. package/frontend/src/edit-array/edit-array.js +10 -50
  51. package/frontend/src/edit-boolean/edit-boolean.html +12 -12
  52. package/frontend/src/edit-date/edit-date.html +2 -2
  53. package/frontend/src/edit-default/edit-default.html +1 -1
  54. package/frontend/src/edit-string/edit-string.html +3 -3
  55. package/frontend/src/edit-subdocument/edit-subdocument.html +5 -3
  56. package/frontend/src/edit-subdocument/edit-subdocument.js +1 -15
  57. package/frontend/src/export-query-results/export-query-results.html +3 -3
  58. package/frontend/src/json-node/json-node.html +3 -3
  59. package/frontend/src/list-json/json-node.html +1 -1
  60. package/frontend/src/models/document-search/document-search.html +3 -3
  61. package/frontend/src/models/model-switcher/model-switcher.html +53 -0
  62. package/frontend/src/models/model-switcher/model-switcher.js +123 -0
  63. package/frontend/src/models/models.css +3 -10
  64. package/frontend/src/models/models.html +146 -80
  65. package/frontend/src/models/models.js +108 -4
  66. package/frontend/src/navbar/navbar.html +157 -97
  67. package/frontend/src/navbar/navbar.js +31 -12
  68. package/frontend/src/routes.js +1 -1
  69. package/frontend/src/splash/splash.html +5 -5
  70. package/frontend/src/task-single/task-single.html +29 -29
  71. package/frontend/src/task-single/task-single.js +10 -10
  72. package/frontend/src/tasks/task-details/task-details.html +38 -38
  73. package/frontend/src/tasks/task-details/task-details.js +7 -2
  74. package/frontend/src/tasks/tasks.html +36 -35
  75. package/frontend/src/tasks/tasks.js +2 -25
  76. package/frontend/src/team/new-invitation/new-invitation.html +8 -8
  77. package/frontend/src/team/team.html +27 -27
  78. package/frontend/src/update-document/update-document.html +7 -2
  79. package/frontend/src/update-document/update-document.js +2 -11
  80. package/package.json +2 -1
  81. package/tailwind.config.js +75 -11
package/frontend/public/theme-variables.css ADDED
@@ -0,0 +1,294 @@
1
+ /*
2
+ * Theme variables for Mongoose Studio.
3
+ * Use these variables in component CSS and in theme overrides so we can add
4
+ * more themes (e.g. .theme-ocean) or role-based themes (e.g. data-theme="admin") later.
5
+ *
6
+ * Default theme: light. Switch by adding .dark on <html> (or future .theme-* classes).
7
+ */
8
+
9
+ /* -----------------------------------------------------------------------------
10
+ * Light theme (default)
11
+ * ----------------------------------------------------------------------------- */
12
+ :root {
13
+ color-scheme: light;
14
+
15
+ /* Page */
16
+ --studio-bg-page: #ffffff;
17
+ --studio-text-page: #111827;
18
+
19
+ /* Surfaces (cards, panels, nav) */
20
+ --studio-bg-surface: #ffffff;
21
+ --studio-bg-surface-hover: #f9fafb;
22
+ --studio-bg-muted: #f9fafb;
23
+ --studio-bg-muted-hover: #f3f4f6;
24
+ --studio-bg-subtle: #e5e7eb;
25
+ --studio-bg-subtle-hover: #d1d5db;
26
+ --studio-bg-strong: #374151;
27
+ --studio-bg-stronger: #1f2937;
28
+
29
+ /* Text */
30
+ --studio-text-primary: #111827;
31
+ --studio-text-secondary: #374151;
32
+ --studio-text-muted: #6b7280;
33
+ --studio-text-subtle: #9ca3af;
34
+
35
+ /* Borders */
36
+ --studio-border: #e5e7eb;
37
+ --studio-border-strong: #d1d5db;
38
+ --studio-ring: rgba(17, 24, 39, 0.05);
39
+ --studio-ring-strong: rgba(75, 85, 99, 0.4);
40
+
41
+ /* Links */
42
+ --studio-link: #0e5887;
43
+ --studio-link-hover: #0c4a6f;
44
+
45
+ /* Semantic (status) */
46
+ --studio-bg-error: #fef2f2;
47
+ --studio-bg-warning: #fefce8;
48
+ --studio-bg-success: #f0fdf4;
49
+ --studio-bg-info: #eff6ff;
50
+ --studio-border-error: #fecaca;
51
+ --studio-border-warning: #fde047;
52
+ --studio-border-success: #bbf7d0;
53
+ --studio-border-info: #bfdbfe;
54
+ --studio-text-error: #b91c1c;
55
+ --studio-text-success: #15803d;
56
+ --studio-ring-success: rgba(34, 197, 94, 0.2);
57
+ --studio-ring-muted: rgba(75, 85, 99, 0.2);
58
+
59
+ /* Tooltip */
60
+ --studio-tooltip-bg: #000000;
61
+ --studio-tooltip-text: #ffffff;
62
+ --studio-tooltip-border: transparent;
63
+
64
+ /* Extended (code, menu, focus, brand, buttons) */
65
+ --studio-code-bg: #f3f4f6;
66
+ --studio-code-text: #111827;
67
+ --studio-menu-bg: #ffffff;
68
+ --studio-menu-hover: rgba(0, 0, 0, 0.05);
69
+ --studio-menu-selected: rgba(0, 0, 0, 0.08);
70
+ --studio-shadow: rgba(0, 0, 0, 0.1);
71
+ --studio-focus-ring: #3b82f6;
72
+ --studio-focus-ring-shadow: rgba(59, 130, 246, 0.2);
73
+ --studio-brand-primary: #0e5887;
74
+ --studio-brand-primary-hover: #0c4a6f;
75
+ --studio-brand-primary-subtle: rgba(14, 88, 135, 0.1);
76
+ --studio-btn-bg: #e5e7eb;
77
+ --studio-btn-text-shadow: transparent;
78
+
79
+ /* Browser chrome (theme-color meta is set in JS; this is for reference/fallback) */
80
+ --studio-theme-color: #ffffff;
81
+
82
+ /* ---- Semantic Tailwind tokens ----
83
+ * These map to Tailwind color names so you can write bg-primary, text-content,
84
+ * border-edge, etc. Dark mode swaps the value automatically — zero dark: needed.
85
+ */
86
+
87
+ /* Primary action (buttons, active indicators) – merlot */
88
+ --color-primary: #7f1d2b;
89
+ --color-primary-hover: #931e2b;
90
+ --color-primary-subtle: #fde8e6;
91
+ --color-primary-text: #ffffff;
92
+
93
+ /* Surface / layout */
94
+ --color-surface: #ffffff;
95
+ --color-surface-hover: #f9fafb;
96
+ --color-page: #f9fafb;
97
+ --color-muted: #f3f4f6;
98
+ --color-subtle: #e5e7eb;
99
+
100
+ /* Text hierarchy */
101
+ --color-content: #111827;
102
+ --color-content-secondary: #374151;
103
+ --color-content-tertiary: #6b7280;
104
+ --color-content-disabled: #d1d5db;
105
+
106
+ /* Borders */
107
+ --color-edge: #e5e7eb;
108
+ --color-edge-strong: #d1d5db;
109
+ }
110
+
111
+ /* -----------------------------------------------------------------------------
112
+ * Dark theme (your preferred dark mode colors)
113
+ * Add class "dark" on <html> to enable.
114
+ * ----------------------------------------------------------------------------- */
115
+ .dark {
116
+ color-scheme: dark;
117
+
118
+ /* Page – darker base for clear hierarchy */
119
+ --studio-bg-page: #0f0f0f;
120
+ --studio-text-page: #f5f5f5;
121
+
122
+ /* Surfaces – stepped contrast so nav/sidebar/content read clearly */
123
+ --studio-bg-surface: #1c1c1e;
124
+ --studio-bg-surface-hover: #2c2c2e;
125
+ --studio-bg-muted: #252528;
126
+ --studio-bg-muted-hover: #2c2c2e;
127
+ --studio-bg-subtle: #3a3a3c;
128
+ --studio-bg-subtle-hover: #48484a;
129
+ --studio-bg-strong: #636366;
130
+ --studio-bg-stronger: #1c1c1e;
131
+
132
+ /* Text – high contrast for readability */
133
+ --studio-text-primary: #ffffff;
134
+ --studio-text-secondary: #e8e8e8;
135
+ --studio-text-muted: #b8b8bc;
136
+ --studio-text-subtle: #a0a0a5;
137
+
138
+ /* Borders */
139
+ --studio-border: #3a3a3c;
140
+ --studio-border-strong: #48484a;
141
+ --studio-ring: rgba(0, 0, 0, 0.4);
142
+ --studio-ring-strong: rgba(99, 99, 102, 0.5);
143
+
144
+ /* Links */
145
+ --studio-link: #64b5f6;
146
+ --studio-link-hover: #90caf9;
147
+
148
+ /* Semantic (status) */
149
+ --studio-bg-error: #450a0a;
150
+ --studio-bg-warning: #422006;
151
+ --studio-bg-success: #052e16;
152
+ --studio-bg-info: #1e3a8a;
153
+ --studio-border-error: #7f1d1d;
154
+ --studio-border-warning: #854d0e;
155
+ --studio-border-success: #14532d;
156
+ --studio-border-info: #1e40af;
157
+ --studio-text-error: #fca5a5;
158
+ --studio-text-success: #86efac;
159
+ --studio-ring-success: rgba(34, 197, 94, 0.3);
160
+ --studio-ring-muted: rgba(75, 85, 99, 0.4);
161
+
162
+ /* Tooltip */
163
+ --studio-tooltip-bg: #2c2c2e;
164
+ --studio-tooltip-text: #f5f5f5;
165
+ --studio-tooltip-border: #3a3a3c;
166
+
167
+ /* Extended (for nav, code, buttons, focus, brand) */
168
+ --studio-code-bg: #252525;
169
+ --studio-code-text: #e8e8e8;
170
+ --studio-menu-bg: #252525;
171
+ --studio-menu-hover: rgba(255, 255, 255, 0.1);
172
+ --studio-menu-selected: rgba(255, 255, 255, 0.15);
173
+ --studio-shadow: rgba(0, 0, 0, 0.3);
174
+ --studio-focus-ring: #FFB4B4;
175
+ --studio-focus-ring-shadow: rgba(255, 180, 180, 0.2);
176
+ --studio-brand-primary: #FF5E5E;
177
+ --studio-brand-primary-hover: #FF5555;
178
+ --studio-brand-primary-subtle: rgba(255, 180, 180, 0.1);
179
+ --studio-btn-bg: #444444;
180
+ --studio-btn-text-shadow: #222222;
181
+
182
+ --studio-theme-color: #0f0f0f;
183
+
184
+ /* ---- Semantic Tailwind tokens (dark) ---- */
185
+ --color-primary: #ef807d;
186
+ --color-primary-hover: #f6adab;
187
+ --color-primary-subtle: rgba(239, 128, 125, 0.15);
188
+ --color-primary-text: #1c1c1e;
189
+
190
+ --color-surface: #1c1c1e;
191
+ --color-surface-hover: #2c2c2e;
192
+ --color-page: #0f0f0f;
193
+ --color-muted: #252528;
194
+ --color-subtle: #3a3a3c;
195
+
196
+ --color-content: #ffffff;
197
+ --color-content-secondary: #e8e8e8;
198
+ --color-content-tertiary: #b8b8bc;
199
+ --color-content-disabled: #636366;
200
+
201
+ --color-edge: #3a3a3c;
202
+ --color-edge-strong: #48484a;
203
+ }
204
+
205
+ /* Dark mode when using data-theme (same colors as .dark) */
206
+ [data-theme="dark"] {
207
+ color-scheme: dark;
208
+ --studio-bg-page: #0f0f0f;
209
+ --studio-text-page: #f5f5f5;
210
+ --studio-bg-surface: #1c1c1e;
211
+ --studio-bg-surface-hover: #2c2c2e;
212
+ --studio-bg-muted: #252528;
213
+ --studio-bg-muted-hover: #2c2c2e;
214
+ --studio-bg-subtle: #3a3a3c;
215
+ --studio-bg-subtle-hover: #48484a;
216
+ --studio-bg-strong: #636366;
217
+ --studio-bg-stronger: #1c1c1e;
218
+ --studio-text-primary: #ffffff;
219
+ --studio-text-secondary: #e8e8e8;
220
+ --studio-text-muted: #b8b8bc;
221
+ --studio-text-subtle: #a0a0a5;
222
+ --studio-border: #3a3a3c;
223
+ --studio-border-strong: #48484a;
224
+ --studio-ring: rgba(0, 0, 0, 0.3);
225
+ --studio-ring-strong: rgba(75, 85, 99, 0.4);
226
+ --studio-link: #7BC3FF;
227
+ --studio-link-hover: #8AD0FF;
228
+ --studio-bg-error: #450a0a;
229
+ --studio-bg-warning: #422006;
230
+ --studio-bg-success: #052e16;
231
+ --studio-bg-info: #1e3a8a;
232
+ --studio-border-error: #7f1d1d;
233
+ --studio-border-warning: #854d0e;
234
+ --studio-border-success: #14532d;
235
+ --studio-border-info: #1e40af;
236
+ --studio-text-error: #fca5a5;
237
+ --studio-text-success: #86efac;
238
+ --studio-ring-success: rgba(34, 197, 94, 0.3);
239
+ --studio-ring-muted: rgba(75, 85, 99, 0.4);
240
+ --studio-tooltip-bg: #252525;
241
+ --studio-tooltip-text: #e8e8e8;
242
+ --studio-tooltip-border: #444444;
243
+ --studio-code-bg: #252525;
244
+ --studio-code-text: #e8e8e8;
245
+ --studio-menu-bg: #252525;
246
+ --studio-menu-hover: rgba(255, 255, 255, 0.1);
247
+ --studio-menu-selected: rgba(255, 255, 255, 0.15);
248
+ --studio-shadow: rgba(0, 0, 0, 0.3);
249
+ --studio-focus-ring: #FFB4B4;
250
+ --studio-focus-ring-shadow: rgba(255, 180, 180, 0.2);
251
+ --studio-brand-primary: #FF5E5E;
252
+ --studio-brand-primary-hover: #FF5555;
253
+ --studio-brand-primary-subtle: rgba(255, 180, 180, 0.1);
254
+ --studio-btn-bg: #444444;
255
+ --studio-btn-text-shadow: #222222;
256
+ --studio-theme-color: #0f0f0f;
257
+
258
+ /* ---- Semantic Tailwind tokens (data-theme dark) ---- */
259
+ --color-primary: #ef807d;
260
+ --color-primary-hover: #f6adab;
261
+ --color-primary-subtle: rgba(239, 128, 125, 0.15);
262
+ --color-primary-text: #1c1c1e;
263
+
264
+ --color-surface: #1c1c1e;
265
+ --color-surface-hover: #2c2c2e;
266
+ --color-page: #0f0f0f;
267
+ --color-muted: #252528;
268
+ --color-subtle: #3a3a3c;
269
+
270
+ --color-content: #ffffff;
271
+ --color-content-secondary: #e8e8e8;
272
+ --color-content-tertiary: #b8b8bc;
273
+ --color-content-disabled: #636366;
274
+
275
+ --color-edge: #3a3a3c;
276
+ --color-edge-strong: #48484a;
277
+ }
278
+
279
+ /*
280
+ * Future: add more themes the same way, e.g.:
281
+ *
282
+ * .theme-ocean {
283
+ * --studio-bg-page: #f0f9ff;
284
+ * --studio-link: #0369a1;
285
+ * ...
286
+ * }
287
+ *
288
+ * Or role-based (set class or data-theme from backend):
289
+ *
290
+ * [data-theme="admin"] {
291
+ * --studio-link: #7c3aed;
292
+ * ...
293
+ * }
294
+ */