snow-flow 3.4.35 → 3.4.39

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 (50) hide show
  1. package/README.md +412 -287
  2. package/dist/cli/deploy-artifact.js +2 -2
  3. package/dist/mcp/servicenow-deployment-mcp.js +1 -1
  4. package/dist/mcp/servicenow-mcp-server.js +2 -2
  5. package/dist/mcp/shared/mcp-logger.js +6 -12
  6. package/dist/queen/agent-factory.js +134 -52
  7. package/dist/queen/servicenow-queen.d.ts +127 -2
  8. package/dist/queen/servicenow-queen.js +978 -618
  9. package/dist/services/widget-deployment-service.d.ts +1 -1
  10. package/dist/services/widget-deployment-service.js +1 -1
  11. package/dist/templates/claude-md-template.d.ts +1 -1
  12. package/dist/templates/claude-md-template.js +2 -2
  13. package/dist/types/servicenow.types.d.ts +1 -1
  14. package/dist/utils/dependency-detector.d.ts +1 -1
  15. package/dist/utils/dependency-detector.js +1 -1
  16. package/dist/utils/servicenow-client.d.ts +1 -1
  17. package/dist/utils/servicenow-client.js +4 -8
  18. package/package.json +1 -1
  19. package/website/components/README.md +419 -0
  20. package/website/components/code-display/CodeDisplay.css +583 -0
  21. package/website/components/code-display/CodeDisplay.html +200 -0
  22. package/website/components/code-display/CodeDisplay.js +375 -0
  23. package/website/components/code-display/CodeDisplay.jsx +268 -0
  24. package/website/components/demo/ComponentLibraryDemo.html +845 -0
  25. package/website/components/feature-cards/FeatureCards.css +573 -0
  26. package/website/components/feature-cards/FeatureCards.html +247 -0
  27. package/website/components/feature-cards/FeatureCards.js +382 -0
  28. package/website/components/feature-cards/FeatureCards.jsx +235 -0
  29. package/website/components/hero/Hero.css +558 -0
  30. package/website/components/hero/Hero.html +98 -0
  31. package/website/components/hero/Hero.js +415 -0
  32. package/website/components/hero/Hero.jsx +214 -0
  33. package/website/components/interactive/InteractiveElements.css +776 -0
  34. package/website/components/interactive/InteractiveElements.html +283 -0
  35. package/website/components/interactive/InteractiveElements.js +489 -0
  36. package/website/components/interactive/InteractiveElements.jsx +444 -0
  37. package/website/components/layout/LayoutComponents.css +697 -0
  38. package/website/components/layout/LayoutComponents.html +374 -0
  39. package/website/components/layout/LayoutComponents.js +447 -0
  40. package/website/components/layout/LayoutComponents.jsx +379 -0
  41. package/website/components/navigation/Navigation.css +383 -0
  42. package/website/components/navigation/Navigation.html +89 -0
  43. package/website/components/navigation/Navigation.js +248 -0
  44. package/website/components/navigation/Navigation.jsx +124 -0
  45. package/website/css/animations.css +854 -0
  46. package/website/css/style.css +916 -948
  47. package/website/index.html +394 -424
  48. package/website/js/animations.js +707 -0
  49. package/website/js/main.js +310 -383
  50. package/website/mcp-servers.html +310 -0
package/website/components/layout/LayoutComponents.html ADDED
@@ -0,0 +1,374 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Snow-Flow Layout Components</title>
7
+ <link rel="stylesheet" href="LayoutComponents.css">
8
+ <style>
9
+ body {
10
+ margin: 0;
11
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
12
+ }
13
+ </style>
14
+ </head>
15
+ <body>
16
+ <!-- Layout Components Demo -->
17
+ <div class="sf-layout-demo">
18
+ <div class="sf-container sf-container--medium">
19
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-large">
20
+ <!-- Header -->
21
+ <div class="sf-layout-demo__header">
22
+ <h1 class="sf-layout-demo__title">Layout Components</h1>
23
+ <p class="sf-layout-demo__subtitle">
24
+ Essential building blocks for creating structured, responsive layouts
25
+ </p>
26
+ </div>
27
+
28
+ <!-- Container Demo -->
29
+ <section class="sf-section sf-section--bg-light sf-section--padding-large">
30
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
31
+ <h2 class="sf-demo-title">Container</h2>
32
+ <p>Responsive containers with configurable max-widths and padding</p>
33
+
34
+ <div class="sf-card sf-card--padding-small sf-card--border">
35
+ <div class="sf-container sf-container--medium" style="max-width: 800px;">
36
+ <p>This content is inside a container with max-width: 800px</p>
37
+ </div>
38
+ </div>
39
+
40
+ <div class="sf-card sf-card--padding-small sf-card--border">
41
+ <div class="sf-container sf-container--fluid sf-container--small">
42
+ <p>This is a fluid container that takes full width</p>
43
+ </div>
44
+ </div>
45
+ </div>
46
+ </section>
47
+
48
+ <!-- Grid Demo -->
49
+ <section class="sf-section sf-section--bg-default sf-section--padding-large">
50
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
51
+ <h2 class="sf-demo-title">Grid System</h2>
52
+ <p>Flexible CSS Grid layouts with responsive behavior</p>
53
+
54
+ <div class="sf-demo-grid-container">
55
+ <h3>Auto-fit Grid (default)</h3>
56
+ <div class="sf-grid sf-grid--gap-medium sf-grid--responsive">
57
+ <div class="sf-card sf-card--padding-medium">Item 1</div>
58
+ <div class="sf-card sf-card--padding-medium">Item 2</div>
59
+ <div class="sf-card sf-card--padding-medium">Item 3</div>
60
+ <div class="sf-card sf-card--padding-medium">Item 4</div>
61
+ </div>
62
+ </div>
63
+
64
+ <div class="sf-demo-grid-container">
65
+ <h3>3-Column Fixed Grid</h3>
66
+ <div class="sf-grid sf-grid--gap-small" style="grid-template-columns: repeat(3, 1fr);">
67
+ <div class="sf-card sf-card--padding-medium">Column 1</div>
68
+ <div class="sf-card sf-card--padding-medium">Column 2</div>
69
+ <div class="sf-card sf-card--padding-medium">Column 3</div>
70
+ </div>
71
+ </div>
72
+
73
+ <div class="sf-demo-grid-container">
74
+ <h3>Custom Grid Template</h3>
75
+ <div class="sf-grid sf-grid--gap-medium" style="grid-template-columns: 2fr 1fr 1fr;">
76
+ <div class="sf-card sf-card--padding-medium">Wide Column</div>
77
+ <div class="sf-card sf-card--padding-medium">Small</div>
78
+ <div class="sf-card sf-card--padding-medium">Small</div>
79
+ </div>
80
+ </div>
81
+ </div>
82
+ </section>
83
+
84
+ <!-- Flex Demo -->
85
+ <section class="sf-section sf-section--bg-light sf-section--padding-large">
86
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
87
+ <h2 class="sf-demo-title">Flex Layouts</h2>
88
+ <p>Flexbox utilities for common layout patterns</p>
89
+
90
+ <div class="sf-demo-flex-container">
91
+ <h3>Horizontal Flex (space-between)</h3>
92
+ <div class="sf-flex sf-flex--row sf-flex--justify-between sf-flex--align-center">
93
+ <div class="sf-card sf-card--padding-small">Left</div>
94
+ <div class="sf-card sf-card--padding-small">Center</div>
95
+ <div class="sf-card sf-card--padding-small">Right</div>
96
+ </div>
97
+ </div>
98
+
99
+ <div class="sf-demo-flex-container">
100
+ <h3>Vertical Flex with Gap</h3>
101
+ <div class="sf-flex sf-flex--column sf-flex--gap-small" style="height: 200px;">
102
+ <div class="sf-card sf-card--padding-small">Top</div>
103
+ <div class="sf-card sf-card--padding-small">Middle</div>
104
+ <div class="sf-card sf-card--padding-small">Bottom</div>
105
+ </div>
106
+ </div>
107
+
108
+ <div class="sf-demo-flex-container">
109
+ <h3>Flex Wrap with Center Alignment</h3>
110
+ <div class="sf-flex sf-flex--row sf-flex--wrap sf-flex--justify-center sf-flex--gap-medium">
111
+ <div class="sf-card sf-card--padding-small">Item A</div>
112
+ <div class="sf-card sf-card--padding-small">Item B</div>
113
+ <div class="sf-card sf-card--padding-small">Item C</div>
114
+ <div class="sf-card sf-card--padding-small">Item D</div>
115
+ <div class="sf-card sf-card--padding-small">Item E</div>
116
+ </div>
117
+ </div>
118
+ </div>
119
+ </section>
120
+
121
+ <!-- Dividers Demo -->
122
+ <section class="sf-section sf-section--bg-default sf-section--padding-large">
123
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
124
+ <h2 class="sf-demo-title">Dividers</h2>
125
+ <p>Various divider styles to separate content</p>
126
+
127
+ <div class="sf-divider-demo">
128
+ <div class="sf-card sf-card--padding-small">Content above</div>
129
+ <div class="sf-divider sf-divider--line"></div>
130
+ <div class="sf-card sf-card--padding-small">Content below (line divider)</div>
131
+
132
+ <div class="sf-divider sf-divider--dots">
133
+ <div class="sf-divider__dots">
134
+ <span></span>
135
+ <span></span>
136
+ <span></span>
137
+ </div>
138
+ </div>
139
+ <div class="sf-card sf-card--padding-small">Content below (dots divider)</div>
140
+
141
+ <div class="sf-divider sf-divider--line sf-divider--gradient sf-divider--animated"></div>
142
+ <div class="sf-card sf-card--padding-small">Content below (gradient animated divider)</div>
143
+
144
+ <div class="sf-divider sf-divider--wave">
145
+ <svg class="sf-divider__wave" viewBox="0 0 1200 120" preserveAspectRatio="none">
146
+ <path d="M985.66,92.83C906.67,72,823.78,31,743.84,14.19c-82.26-17.34-168.06-16.33-250.45.39-57.84,11.73-114,31.07-172,41.86A600.21,600.21,0,0,1,0,27.35V120H1200V95.8C1132.19,118.92,1055.71,111.31,985.66,92.83Z"/>
147
+ </svg>
148
+ </div>
149
+ <div class="sf-card sf-card--padding-small">Content below (wave divider)</div>
150
+
151
+ <div class="sf-divider sf-divider--space sf-divider--thick"></div>
152
+ <div class="sf-card sf-card--padding-small">Content below (space divider)</div>
153
+ </div>
154
+ </div>
155
+ </section>
156
+
157
+ <!-- Cards Demo -->
158
+ <section class="sf-section sf-section--bg-light sf-section--padding-large">
159
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
160
+ <h2 class="sf-demo-title">Cards</h2>
161
+ <p>Card components with various elevations and styles</p>
162
+
163
+ <div class="sf-grid sf-grid--gap-medium" style="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));">
164
+ <div class="sf-card sf-card--elevation-low sf-card--padding-medium">
165
+ <h3>Low Elevation</h3>
166
+ <p>Subtle shadow for minimal depth</p>
167
+ </div>
168
+
169
+ <div class="sf-card sf-card--elevation-medium sf-card--padding-medium sf-card--hover">
170
+ <h3>Medium Elevation + Hover</h3>
171
+ <p>Standard elevation with hover effect</p>
172
+ </div>
173
+
174
+ <div class="sf-card sf-card--elevation-high sf-card--padding-medium sf-card--border">
175
+ <h3>High Elevation + Border</h3>
176
+ <p>Strong shadow with border accent</p>
177
+ </div>
178
+ </div>
179
+
180
+ <div class="sf-spacer sf-spacer--medium"></div>
181
+
182
+ <h3>Card Padding and Radius Variants</h3>
183
+ <div class="sf-grid sf-grid--gap-small" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
184
+ <div class="sf-card sf-card--elevation-medium sf-card--padding-small sf-card--radius-small">
185
+ <strong>Small Padding + Radius</strong>
186
+ </div>
187
+
188
+ <div class="sf-card sf-card--elevation-medium sf-card--padding-large sf-card--radius-large">
189
+ <strong>Large Padding + Radius</strong>
190
+ </div>
191
+
192
+ <div class="sf-card sf-card--elevation-medium sf-card--padding-xl sf-card--radius-xl">
193
+ <strong>XL Padding + Radius</strong>
194
+ </div>
195
+ </div>
196
+ </div>
197
+ </section>
198
+
199
+ <!-- Stack and Spacing Demo -->
200
+ <section class="sf-section sf-section--bg-default sf-section--padding-large">
201
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
202
+ <h2 class="sf-demo-title">Stack & Spacing</h2>
203
+ <p>Consistent spacing utilities and stacking layouts</p>
204
+
205
+ <div class="sf-stack-demo">
206
+ <h3>Vertical Stack with Medium Spacing</h3>
207
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
208
+ <div class="sf-card sf-card--padding-small">Item 1</div>
209
+ <div class="sf-card sf-card--padding-small">Item 2</div>
210
+ <div class="sf-card sf-card--padding-small">Item 3</div>
211
+ </div>
212
+
213
+ <div class="sf-spacer sf-spacer--large"></div>
214
+
215
+ <h3>Horizontal Stack</h3>
216
+ <div class="sf-stack sf-stack--horizontal sf-stack--spacing-small">
217
+ <div class="sf-card sf-card--padding-small">A</div>
218
+ <div class="sf-card sf-card--padding-small">B</div>
219
+ <div class="sf-card sf-card--padding-small">C</div>
220
+ </div>
221
+
222
+ <div class="sf-spacer sf-spacer--large"></div>
223
+
224
+ <h3>Different Spacing Sizes</h3>
225
+ <div class="sf-grid sf-grid--gap-medium" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
226
+ <div>
227
+ <h4>XS Spacing</h4>
228
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-xs">
229
+ <div class="sf-card sf-card--padding-small">Item</div>
230
+ <div class="sf-card sf-card--padding-small">Item</div>
231
+ </div>
232
+ </div>
233
+
234
+ <div>
235
+ <h4>Large Spacing</h4>
236
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-large">
237
+ <div class="sf-card sf-card--padding-small">Item</div>
238
+ <div class="sf-card sf-card--padding-small">Item</div>
239
+ </div>
240
+ </div>
241
+
242
+ <div>
243
+ <h4>XL Spacing</h4>
244
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-xl">
245
+ <div class="sf-card sf-card--padding-small">Item</div>
246
+ <div class="sf-card sf-card--padding-small">Item</div>
247
+ </div>
248
+ </div>
249
+ </div>
250
+ </div>
251
+ </div>
252
+ </section>
253
+
254
+ <!-- Center Demo -->
255
+ <section class="sf-section sf-section--bg-light sf-section--padding-large">
256
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
257
+ <h2 class="sf-demo-title">Centering</h2>
258
+ <p>Perfect centering for content</p>
259
+
260
+ <div class="sf-card sf-card--border" style="height: 200px;">
261
+ <div class="sf-center sf-h-full">
262
+ <div class="sf-card sf-card--padding-medium sf-card--elevation-medium">
263
+ <h3>Perfectly Centered</h3>
264
+ <p>Both horizontally and vertically</p>
265
+ </div>
266
+ </div>
267
+ </div>
268
+
269
+ <div class="sf-spacer sf-spacer--medium"></div>
270
+
271
+ <h3>Different Center Scenarios</h3>
272
+ <div class="sf-grid sf-grid--gap-medium" style="grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));">
273
+ <div class="sf-card sf-card--border" style="height: 150px;">
274
+ <div class="sf-center sf-h-full">
275
+ <div class="sf-card sf-card--padding-small sf-card--elevation-low">
276
+ <strong>Simple Center</strong>
277
+ </div>
278
+ </div>
279
+ </div>
280
+
281
+ <div class="sf-card sf-card--border" style="height: 150px;">
282
+ <div class="sf-center sf-h-full">
283
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-small sf-stack--align-center">
284
+ <div class="sf-card sf-card--padding-small sf-card--elevation-low">Top</div>
285
+ <div class="sf-card sf-card--padding-small sf-card--elevation-low">Bottom</div>
286
+ </div>
287
+ </div>
288
+ </div>
289
+
290
+ <div class="sf-card sf-card--border" style="height: 150px;">
291
+ <div class="sf-center sf-h-full">
292
+ <div class="sf-stack sf-stack--horizontal sf-stack--spacing-small">
293
+ <div class="sf-card sf-card--padding-small sf-card--elevation-low">L</div>
294
+ <div class="sf-card sf-card--padding-small sf-card--elevation-low">R</div>
295
+ </div>
296
+ </div>
297
+ </div>
298
+ </div>
299
+ </div>
300
+ </section>
301
+
302
+ <!-- Utility Classes Demo -->
303
+ <section class="sf-section sf-section--bg-default sf-section--padding-large">
304
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
305
+ <h2 class="sf-demo-title">Utility Classes</h2>
306
+ <p>Helpful utility classes for quick styling</p>
307
+
308
+ <div class="sf-grid sf-grid--gap-medium" style="grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));">
309
+ <div class="sf-card sf-card--padding-medium">
310
+ <h4>Text Alignment</h4>
311
+ <div class="sf-text-left sf-card sf-card--padding-small">Left aligned</div>
312
+ <div class="sf-spacer sf-spacer--small"></div>
313
+ <div class="sf-text-center sf-card sf-card--padding-small">Center aligned</div>
314
+ <div class="sf-spacer sf-spacer--small"></div>
315
+ <div class="sf-text-right sf-card sf-card--padding-small">Right aligned</div>
316
+ </div>
317
+
318
+ <div class="sf-card sf-card--padding-medium">
319
+ <h4>Width Utilities</h4>
320
+ <div class="sf-card sf-card--padding-small sf-w-full">Full width</div>
321
+ <div class="sf-spacer sf-spacer--small"></div>
322
+ <div class="sf-card sf-card--padding-small sf-w-auto" style="display: inline-block;">Auto width</div>
323
+ </div>
324
+
325
+ <div class="sf-card sf-card--padding-medium">
326
+ <h4>Display Utilities</h4>
327
+ <div class="sf-d-flex sf-flex--justify-between sf-card sf-card--padding-small">
328
+ <span>Flex</span>
329
+ <span>Layout</span>
330
+ </div>
331
+ <div class="sf-spacer sf-spacer--small"></div>
332
+ <div class="sf-d-grid sf-card sf-card--padding-small" style="grid-template-columns: 1fr 1fr; gap: 0.5rem;">
333
+ <span>Grid</span>
334
+ <span>Layout</span>
335
+ </div>
336
+ </div>
337
+ </div>
338
+ </div>
339
+ </section>
340
+
341
+ <!-- Responsive Demo -->
342
+ <section class="sf-section sf-section--bg-light sf-section--padding-large">
343
+ <div class="sf-stack sf-stack--vertical sf-stack--spacing-medium">
344
+ <h2 class="sf-demo-title">Responsive Behavior</h2>
345
+ <p>Components adapt to different screen sizes</p>
346
+
347
+ <div class="sf-card sf-card--padding-medium sf-card--border">
348
+ <h3>Resize your browser to see responsive behavior</h3>
349
+ <div class="sf-spacer sf-spacer--medium"></div>
350
+
351
+ <div class="sf-grid sf-grid--responsive sf-grid--gap-medium">
352
+ <div class="sf-card sf-card--elevation-low sf-card--padding-medium">
353
+ <h4>Responsive Card 1</h4>
354
+ <p>This grid adapts from 1 column on mobile to multiple columns on desktop</p>
355
+ </div>
356
+ <div class="sf-card sf-card--elevation-low sf-card--padding-medium">
357
+ <h4>Responsive Card 2</h4>
358
+ <p>Spacing and padding also adjust based on screen size</p>
359
+ </div>
360
+ <div class="sf-card sf-card--elevation-low sf-card--padding-medium">
361
+ <h4>Responsive Card 3</h4>
362
+ <p>Mobile-first approach ensures great experience on all devices</p>
363
+ </div>
364
+ </div>
365
+ </div>
366
+ </div>
367
+ </section>
368
+ </div>
369
+ </div>
370
+ </div>
371
+
372
+ <script src="LayoutComponents.js"></script>
373
+ </body>
374
+ </html>