@elevasis/ui 2.67.0 → 2.68.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 (98) hide show
  1. package/dist/api/index.d.ts +1 -1
  2. package/dist/api/index.js +3 -3
  3. package/dist/app/index.d.ts +1 -6
  4. package/dist/app/index.js +15 -12
  5. package/dist/auth/index.js +10 -12
  6. package/dist/charts/index.js +10 -12
  7. package/dist/chunk-2MTP3H3A.js +425 -0
  8. package/dist/chunk-3KMDHCAR.js +52 -0
  9. package/dist/chunk-3MEXPLWT.js +265 -0
  10. package/dist/{chunk-XNW3O6QW.js → chunk-5NRJ2BLQ.js} +1 -1
  11. package/dist/chunk-75NOC536.js +2162 -0
  12. package/dist/chunk-76IVMVI3.js +1764 -0
  13. package/dist/chunk-AH52XQB7.js +1 -0
  14. package/dist/chunk-BZZCNLT6.js +12 -0
  15. package/dist/chunk-DLR4SDZW.js +51 -0
  16. package/dist/chunk-FK3K2VK2.js +2103 -0
  17. package/dist/chunk-GBXTRSAU.js +37 -0
  18. package/dist/chunk-HJVPVS57.js +1934 -0
  19. package/dist/{chunk-M535KHLW.js → chunk-JC5W55J3.js} +1 -1
  20. package/dist/{chunk-I7BZVVVU.js → chunk-L3HFJFYF.js} +89 -382
  21. package/dist/chunk-LGKLC5MG.js +44 -0
  22. package/dist/{chunk-4DV4ECMG.js → chunk-N7U24M2J.js} +4 -0
  23. package/dist/chunk-NDHMZT2G.js +383 -0
  24. package/dist/chunk-OOACTYRA.js +10 -0
  25. package/dist/chunk-PDHTXPSF.js +12 -0
  26. package/dist/chunk-QYI5BZKM.js +85 -0
  27. package/dist/{chunk-4OEVLV66.js → chunk-R6NMRXNO.js} +112 -147
  28. package/dist/chunk-SIVUCZXQ.js +1194 -0
  29. package/dist/{chunk-JFBZ6XDW.js → chunk-SNZDFCOQ.js} +3 -49
  30. package/dist/chunk-TGPJNKDU.js +1595 -0
  31. package/dist/chunk-TUMSNGTX.js +35 -0
  32. package/dist/chunk-TYKAKJGW.js +67 -0
  33. package/dist/chunk-UD657ICS.js +589 -0
  34. package/dist/chunk-WPIASV3H.js +194 -0
  35. package/dist/chunk-ZFISGKYW.js +39 -0
  36. package/dist/chunk-ZGCWTWBD.js +16127 -0
  37. package/dist/chunk-ZNKZMK2E.js +4528 -0
  38. package/dist/chunk-ZWS3TCQR.js +11032 -0
  39. package/dist/components/chat/index.js +2 -1
  40. package/dist/components/index.d.ts +23 -11
  41. package/dist/components/index.js +2773 -14
  42. package/dist/components/navigation/index.js +11 -12
  43. package/dist/features/auth/index.d.ts +0 -4
  44. package/dist/features/auth/index.js +12 -13
  45. package/dist/features/clients/index.js +14 -12
  46. package/dist/features/crm/index.d.ts +1371 -15
  47. package/dist/features/crm/index.js +15 -12
  48. package/dist/features/dashboard/index.d.ts +1 -2
  49. package/dist/features/dashboard/index.js +15 -12
  50. package/dist/features/delivery/index.d.ts +0 -4
  51. package/dist/features/delivery/index.js +15 -12
  52. package/dist/features/knowledge/index.js +10 -12
  53. package/dist/features/lead-gen/index.d.ts +35 -15
  54. package/dist/features/lead-gen/index.js +16 -12
  55. package/dist/features/monitoring/index.js +15 -12
  56. package/dist/features/monitoring/requests/index.js +13 -13
  57. package/dist/features/operations/index.d.ts +1 -2
  58. package/dist/features/operations/index.js +21 -12
  59. package/dist/features/public-agent-chat/index.js +2 -1
  60. package/dist/features/seo/index.js +2 -1
  61. package/dist/features/settings/index.d.ts +0 -4
  62. package/dist/features/settings/index.js +14 -12
  63. package/dist/hooks/access/index.js +10 -12
  64. package/dist/hooks/delivery/index.d.ts +0 -4
  65. package/dist/hooks/delivery/index.js +2 -23
  66. package/dist/hooks/index.d.ts +13 -7
  67. package/dist/hooks/index.js +10 -12
  68. package/dist/hooks/operations/command-view/utils/transformCommandViewData.d.ts +1 -2
  69. package/dist/hooks/published.d.ts +13 -7
  70. package/dist/hooks/published.js +10 -12
  71. package/dist/initialization/index.d.ts +1 -5
  72. package/dist/knowledge/index.d.ts +1 -2
  73. package/dist/knowledge/index.js +15 -13
  74. package/dist/layout/index.js +14 -12
  75. package/dist/organization/index.d.ts +3 -3
  76. package/dist/organization/index.js +1 -21
  77. package/dist/profile/index.d.ts +0 -4
  78. package/dist/provider/index.d.ts +2 -7
  79. package/dist/provider/index.js +10 -12
  80. package/dist/provider/published.d.ts +2 -7
  81. package/dist/provider/published.js +10 -12
  82. package/dist/supabase/index.d.ts +0 -8
  83. package/dist/test-utils/index.d.ts +5 -0
  84. package/dist/test-utils/index.js +5 -5
  85. package/dist/test-utils/setup-integration.js +1 -1
  86. package/dist/test-utils/setup.js +1 -1
  87. package/dist/theme/index.js +2 -1
  88. package/dist/typeform/index.js +2049 -1
  89. package/dist/types/index.d.ts +13 -7
  90. package/dist/utils/index.d.ts +1 -2
  91. package/dist/utils/index.js +1 -1
  92. package/package.json +4 -4
  93. package/dist/chunk-5TERYXOO.js +0 -51390
  94. package/dist/chunk-AUDNF2Q7.js +0 -2050
  95. package/dist/index.css +0 -659
  96. package/dist/index.d.ts +0 -17888
  97. package/dist/index.js +0 -30
  98. package/dist/{chunk-GMXGDO3I.js → chunk-MISHPEJX.js} +1 -1
package/dist/index.css DELETED
@@ -1,659 +0,0 @@
1
- /* src/components/display/StatCard.module.css */
2
- .heroCard {
3
- background: var(--glass-background);
4
- backdrop-filter: var(--glass-blur);
5
- border: 1px solid var(--color-border);
6
- }
7
- .iconRing {
8
- position: relative;
9
- display: flex;
10
- align-items: center;
11
- justify-content: center;
12
- width: 46px;
13
- height: 46px;
14
- border-radius: 50%;
15
- background: color-mix(in srgb, var(--color-primary) 12%, transparent);
16
- border: 1px solid color-mix(in srgb, var(--color-primary) 25%, transparent);
17
- color: var(--color-primary);
18
- flex-shrink: 0;
19
- box-shadow: 0 0 12px color-mix(in srgb, var(--color-primary) 15%, transparent);
20
- }
21
- .iconRingSm {
22
- position: relative;
23
- display: flex;
24
- align-items: center;
25
- justify-content: center;
26
- width: 36px;
27
- height: 36px;
28
- border-radius: 50%;
29
- background: color-mix(in srgb, var(--color-primary) 12%, transparent);
30
- border: 1px solid color-mix(in srgb, var(--color-primary) 25%, transparent);
31
- color: var(--color-primary);
32
- flex-shrink: 0;
33
- box-shadow: 0 0 8px color-mix(in srgb, var(--color-primary) 12%, transparent);
34
- }
35
- .heroValue {
36
- font-family: var(--elevasis-font-family-subtitle);
37
- font-size: 1.85rem;
38
- font-weight: 800;
39
- line-height: 1;
40
- letter-spacing: -0.02em;
41
- font-variant-numeric: tabular-nums;
42
- }
43
- [data-mantine-color-scheme=dark] .heroValue {
44
- text-shadow: 0 0 20px color-mix(in srgb, var(--color-primary) 20%, transparent);
45
- }
46
- .heroValueSm {
47
- font-family: var(--elevasis-font-family-subtitle);
48
- font-size: 1.35rem;
49
- font-weight: 700;
50
- line-height: 1;
51
- letter-spacing: -0.02em;
52
- font-variant-numeric: tabular-nums;
53
- }
54
- .heroLabel {
55
- font-size: 0.68rem;
56
- font-weight: 700;
57
- text-transform: uppercase;
58
- letter-spacing: 0.12em;
59
- color: var(--color-text-dimmed);
60
- }
61
- .heroLabelSm {
62
- font-size: 0.62rem;
63
- font-weight: 700;
64
- text-transform: uppercase;
65
- letter-spacing: 0.12em;
66
- color: var(--color-text-dimmed);
67
- }
68
-
69
- /* src/components/display/ElevasisLoader.module.css */
70
- .wrapper {
71
- display: inline-flex;
72
- align-items: center;
73
- justify-content: center;
74
- width: var(--loader-size);
75
- height: var(--loader-size);
76
- overflow: visible;
77
- }
78
- .loader {
79
- width: 100%;
80
- height: 100%;
81
- display: block;
82
- overflow: visible;
83
- }
84
- .chevron {
85
- stroke: var(--loader-color);
86
- stroke-width: 2;
87
- stroke-linecap: square;
88
- stroke-linejoin: miter;
89
- fill: none;
90
- opacity: 0.15;
91
- animation: chevronPulse 2s ease-in-out infinite;
92
- filter: drop-shadow(0 0 1.5px var(--loader-color));
93
- }
94
- [data-mantine-color-scheme=light] .chevron {
95
- filter: none;
96
- }
97
- .c1 {
98
- animation-delay: 0s;
99
- }
100
- .c2 {
101
- animation-delay: 0.2s;
102
- }
103
- .c3 {
104
- animation-delay: 0.4s;
105
- }
106
- @keyframes chevronPulse {
107
- 0%, 100% {
108
- opacity: 0.12;
109
- filter: drop-shadow(0 0 1px var(--loader-color));
110
- }
111
- 40%, 60% {
112
- opacity: 1;
113
- filter: drop-shadow(0 0 3px var(--loader-color));
114
- }
115
- }
116
- [data-mantine-color-scheme=light] .chevron {
117
- animation-name: chevronPulseLight;
118
- }
119
- @keyframes chevronPulseLight {
120
- 0%, 100% {
121
- opacity: 0.2;
122
- }
123
- 40%, 60% {
124
- opacity: 1;
125
- }
126
- }
127
-
128
- /* src/theme/custom.css */
129
- .mantine-Button-root[data-variant=default] {
130
- background-color: var(--color-surface);
131
- backdrop-filter: var(--glass-blur);
132
- -webkit-backdrop-filter: var(--glass-blur);
133
- border: 1px solid var(--color-border);
134
- color: var(--color-text);
135
- }
136
- .mantine-Button-root[data-variant=default]:hover {
137
- background-color: var(--color-surface-hover);
138
- }
139
- .lead-gen-build-action-button:disabled,
140
- .lead-gen-build-action-button[data-disabled] {
141
- background-color: var(--surface-primary-muted) !important;
142
- border-color: var(--border-primary-subtle) !important;
143
- color: color-mix(in srgb, var(--color-text-subtle) 88%, var(--color-text-dimmed) 12%) !important;
144
- opacity: 0.78;
145
- }
146
- .lead-gen-build-action-button:disabled:hover,
147
- .lead-gen-build-action-button[data-disabled]:hover {
148
- background-color: var(--surface-primary-muted) !important;
149
- }
150
- .mantine-Accordion-control:hover {
151
- background-color: var(--color-surface-hover);
152
- }
153
- [data-mantine-color-scheme] .mantine-Accordion-root .mantine-Accordion-item {
154
- --item-filled-color: var(--color-surface);
155
- --item-border-color: var(--color-border);
156
- }
157
- [data-mantine-color-scheme] .mantine-Accordion-root[data-variant=separated] .mantine-Accordion-item[data-active] {
158
- background-color: var(--color-surface);
159
- border-color: var(--color-border);
160
- }
161
- .mantine-Menu-item:hover:not([data-disabled]) {
162
- background-color: var(--color-surface-hover);
163
- }
164
- .mantine-Select-option:hover,
165
- .mantine-MultiSelect-option:hover,
166
- .mantine-TagsInput-option:hover,
167
- .mantine-Combobox-option:hover {
168
- background-color: var(--surface-primary-muted) !important;
169
- }
170
- .mantine-Select-option[data-combobox-selected],
171
- .mantine-MultiSelect-option[data-combobox-selected],
172
- .mantine-TagsInput-option[data-combobox-selected],
173
- .mantine-Combobox-option[data-combobox-selected] {
174
- background-color: var(--surface-primary-subtle) !important;
175
- color: var(--color-text);
176
- }
177
- [data-mantine-color-scheme] .mantine-Tabs-root {
178
- --tab-border-color: var(--color-border);
179
- --tab-hover-color: var(--color-surface-hover);
180
- --tabs-radius: var(--mantine-radius-xs);
181
- }
182
- [data-mantine-color-scheme] .mantine-Tabs-root .mantine-Tabs-tab {
183
- color: var(--color-text);
184
- }
185
- [data-mantine-color-scheme] .mantine-Tabs-root .mantine-Tabs-tab:hover {
186
- background-color: var(--color-surface-hover);
187
- }
188
- [data-mantine-color-scheme] .mantine-Tabs-root .mantine-Tabs-tab[data-active] {
189
- background-color: var(--color-surface-hover);
190
- border-color: var(--color-primary);
191
- color: var(--color-text);
192
- }
193
- .mantine-Pagination-control:not([data-active]) {
194
- background: var(--color-surface);
195
- }
196
- ::-webkit-scrollbar {
197
- width: 5px;
198
- height: 5px;
199
- }
200
- ::-webkit-scrollbar-track {
201
- background: transparent;
202
- }
203
- ::-webkit-scrollbar-thumb {
204
- background: color-mix(in srgb, var(--color-text-subtle) 50%, var(--color-border));
205
- border-radius: 4px;
206
- }
207
- ::-webkit-scrollbar-thumb:hover {
208
- background: var(--color-text-subtle);
209
- }
210
- [data-mantine-color-scheme] .mantine-Checkbox-input:not(:disabled):not(:checked):not([data-indeterminate]) {
211
- background-color: var(--color-surface);
212
- border-color: var(--color-border);
213
- }
214
- [data-mantine-color-scheme] .mantine-Checkbox-input:checked,
215
- [data-mantine-color-scheme] .mantine-Checkbox-input[data-indeterminate] {
216
- background-color: var(--color-primary);
217
- border-color: var(--color-primary);
218
- }
219
- .mantine-Switch-root:has(input:not(:checked)) .mantine-Switch-track {
220
- background-color: var(--color-surface-hover);
221
- border-color: var(--color-border);
222
- }
223
- .mantine-Timeline-root {
224
- --tl-color: var(--color-primary);
225
- }
226
- .mantine-Timeline-item {
227
- --item-border-color: var(--color-border);
228
- }
229
- .mantine-Timeline-itemBullet {
230
- border-color: var(--color-border);
231
- }
232
- .mantine-Timeline-itemBullet:where([data-with-child]) {
233
- background-color: var(--color-primary);
234
- border-color: var(--color-primary);
235
- }
236
- .mantine-Tree-node:focus-visible > [data-value] {
237
- outline: 2px solid color-mix(in srgb, var(--color-primary) 55%, transparent);
238
- outline-offset: 2px;
239
- }
240
- .mantine-Tree-label[data-hovered] {
241
- background-color: var(--color-surface-hover);
242
- border-color: var(--color-border);
243
- }
244
- .mantine-Tree-label[data-selected] {
245
- background-color: color-mix(in srgb, var(--color-primary) 12%, transparent);
246
- border-color: color-mix(in srgb, var(--color-primary) 38%, var(--color-border));
247
- color: var(--color-primary);
248
- }
249
- [data-knowledge-article] pre {
250
- white-space: pre-wrap;
251
- word-break: break-word;
252
- overflow-x: auto;
253
- max-width: 100%;
254
- padding: var(--mantine-spacing-sm);
255
- background-color: var(--color-surface);
256
- border: 1px solid var(--color-border);
257
- border-radius: var(--mantine-radius-sm);
258
- }
259
- [data-knowledge-article] pre code {
260
- background: transparent;
261
- border: none;
262
- padding: 0;
263
- white-space: inherit;
264
- word-break: inherit;
265
- }
266
- .recharts-surface:focus {
267
- outline: none;
268
- }
269
- .hide-scrollbar {
270
- scrollbar-width: none;
271
- -ms-overflow-style: none;
272
- }
273
- .hide-scrollbar::-webkit-scrollbar {
274
- display: none;
275
- }
276
-
277
- /* src/graph/Graph.globals.css */
278
- .elevasis-graph-root .react-flow__node.selected,
279
- .elevasis-graph-root .react-flow__node:focus,
280
- .elevasis-graph-root .react-flow__node:focus-visible {
281
- outline: none !important;
282
- }
283
- .elevasis-graph-root .react-flow__node.selected > * {
284
- box-shadow: none;
285
- }
286
-
287
- /* src/graph/Graph.module.css */
288
- @keyframes edgeFlow {
289
- 0% {
290
- stroke-dashoffset: 24;
291
- }
292
- 100% {
293
- stroke-dashoffset: 0;
294
- }
295
- }
296
- @keyframes edgeFlowReverse {
297
- 0% {
298
- stroke-dashoffset: 0;
299
- }
300
- 100% {
301
- stroke-dashoffset: 24;
302
- }
303
- }
304
- @keyframes pulse {
305
- 0%, 100% {
306
- opacity: 0.6;
307
- }
308
- 50% {
309
- opacity: 1;
310
- }
311
- }
312
- @keyframes livePulse {
313
- 0%, 100% {
314
- opacity: 1;
315
- }
316
- 50% {
317
- opacity: 0.6;
318
- }
319
- }
320
- .livePulse {
321
- animation: livePulse 2s ease-in-out infinite;
322
- }
323
- @keyframes glowPulse {
324
- 0%, 100% {
325
- box-shadow: 0 0 5px var(--glow-color, color-mix(in srgb, var(--color-primary) 30%, transparent)), 0 0 15px var(--glow-color, color-mix(in srgb, var(--color-primary) 10%, transparent));
326
- }
327
- 50% {
328
- box-shadow: 0 0 10px var(--glow-color, color-mix(in srgb, var(--color-primary) 50%, transparent)), 0 0 20px var(--glow-color, color-mix(in srgb, var(--color-primary) 20%, transparent));
329
- }
330
- }
331
- @keyframes nodeEnter {
332
- 0% {
333
- opacity: 0;
334
- transform: scale(0.8) translateY(10px);
335
- }
336
- 100% {
337
- opacity: 1;
338
- transform: scale(1) translateY(0);
339
- }
340
- }
341
- @keyframes handlePulse {
342
- 0%, 100% {
343
- transform: scale(1);
344
- box-shadow: 0 0 0 0 var(--handle-color, color-mix(in srgb, var(--color-primary) 40%, transparent));
345
- }
346
- 50% {
347
- transform: scale(1.2);
348
- box-shadow: 0 0 0 4px var(--handle-color, color-mix(in srgb, var(--color-primary) 0%, transparent));
349
- }
350
- }
351
- @keyframes gridMove {
352
- 0% {
353
- background-position: 0 0;
354
- }
355
- 100% {
356
- background-position: 40px 40px;
357
- }
358
- }
359
- @keyframes labelFadeIn {
360
- 0% {
361
- opacity: 0;
362
- transform: translate(-50%, -50%) translate(var(--label-x), var(--label-y)) scale(0.8);
363
- }
364
- 100% {
365
- opacity: 1;
366
- transform: translate(-50%, -50%) translate(var(--label-x), var(--label-y)) scale(1);
367
- }
368
- }
369
- @keyframes scanLine {
370
- 0% {
371
- transform: translateY(-100%);
372
- opacity: 0;
373
- }
374
- 50% {
375
- opacity: 0.5;
376
- }
377
- 100% {
378
- transform: translateY(100%);
379
- opacity: 0;
380
- }
381
- }
382
- .graphContainer {
383
- position: relative;
384
- background-image:
385
- linear-gradient(color-mix(in srgb, var(--color-primary) 5%, transparent) 1px, transparent 1px),
386
- linear-gradient(
387
- 90deg,
388
- color-mix(in srgb, var(--color-primary) 5%, transparent) 1px,
389
- transparent 1px),
390
- radial-gradient(
391
- ellipse at 50% 50%,
392
- color-mix(in srgb, var(--color-primary) 1.25%, transparent) 0%,
393
- transparent 70%);
394
- background-color: color-mix(in srgb, var(--color-background) 50%, var(--glass-background));
395
- backdrop-filter: var(--glass-blur);
396
- background-size:
397
- 40px 40px,
398
- 40px 40px,
399
- 100% 100%;
400
- animation: gridMove 20s linear infinite;
401
- }
402
- [data-mantine-color-scheme=dark] .graphContainer {
403
- background-image:
404
- linear-gradient(color-mix(in srgb, var(--color-primary) 9%, transparent) 1px, transparent 1px),
405
- linear-gradient(
406
- 90deg,
407
- color-mix(in srgb, var(--color-primary) 9%, transparent) 1px,
408
- transparent 1px),
409
- radial-gradient(
410
- ellipse at 50% 50%,
411
- color-mix(in srgb, var(--color-primary) 2.25%, transparent) 0%,
412
- transparent 70%);
413
- background-size:
414
- 40px 40px,
415
- 40px 40px,
416
- 100% 100%;
417
- }
418
- .node {
419
- transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
420
- position: relative;
421
- }
422
- .node:nth-child(1) {
423
- animation-delay: 0.05s;
424
- }
425
- .node:nth-child(2) {
426
- animation-delay: 0.1s;
427
- }
428
- .node:nth-child(3) {
429
- animation-delay: 0.15s;
430
- }
431
- .node:nth-child(4) {
432
- animation-delay: 0.2s;
433
- }
434
- .node:nth-child(5) {
435
- animation-delay: 0.25s;
436
- }
437
- .node:nth-child(6) {
438
- animation-delay: 0.3s;
439
- }
440
- .node:nth-child(7) {
441
- animation-delay: 0.35s;
442
- }
443
- .node:nth-child(8) {
444
- animation-delay: 0.4s;
445
- }
446
- .node:nth-child(9) {
447
- animation-delay: 0.45s;
448
- }
449
- .node:nth-child(10) {
450
- animation-delay: 0.5s;
451
- }
452
- .node:nth-child(11) {
453
- animation-delay: 0.55s;
454
- }
455
- .node:nth-child(12) {
456
- animation-delay: 0.6s;
457
- }
458
- .nodeCard {
459
- position: relative;
460
- border-radius: var(--mantine-radius-md);
461
- overflow: hidden;
462
- transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
463
- }
464
- .nodeCard::before {
465
- content: "";
466
- position: absolute;
467
- inset: 0;
468
- background:
469
- linear-gradient(
470
- 135deg,
471
- var(--node-color-light, color-mix(in srgb, var(--color-primary) 10%, transparent)) 0%,
472
- transparent 50%,
473
- var(--node-color-light, color-mix(in srgb, var(--color-primary) 5%, transparent)) 100%);
474
- pointer-events: none;
475
- opacity: 0;
476
- transition: opacity 0.3s ease;
477
- }
478
- .nodeCard::after {
479
- content: "";
480
- position: absolute;
481
- left: 0;
482
- right: 0;
483
- height: 30%;
484
- background:
485
- linear-gradient(
486
- 180deg,
487
- transparent 0%,
488
- var(--node-color-glow, color-mix(in srgb, var(--color-primary) 10%, transparent)) 50%,
489
- transparent 100%);
490
- pointer-events: none;
491
- opacity: 0;
492
- }
493
- .nodeCard:hover::before,
494
- .nodeCardSelected::before {
495
- opacity: 1;
496
- }
497
- .nodeCard:hover::after,
498
- .nodeCardSelected::after {
499
- animation: scanLine 3s ease-in-out infinite;
500
- }
501
- .nodeCard:hover {
502
- transform: translateY(-2px) scale(1.02);
503
- }
504
- .nodeCardSelected {
505
- transform: translateY(-2px) scale(1.02);
506
- animation: glowPulse 2s ease-in-out infinite;
507
- }
508
- .nodeAgent {
509
- --glow-color: rgba(139, 92, 246, 0.4);
510
- --node-color-light: rgba(139, 92, 246, 0.1);
511
- --node-color-glow: rgba(139, 92, 246, 0.15);
512
- --handle-color: rgba(139, 92, 246, 0.5);
513
- --gradient-start: rgba(139, 92, 246, 0.15);
514
- --gradient-end: rgba(139, 92, 246, 0.05);
515
- }
516
- .nodeWorkflow {
517
- --glow-color: rgba(59, 130, 246, 0.4);
518
- --node-color-light: rgba(59, 130, 246, 0.1);
519
- --node-color-glow: rgba(59, 130, 246, 0.15);
520
- --handle-color: rgba(59, 130, 246, 0.5);
521
- --gradient-start: rgba(59, 130, 246, 0.15);
522
- --gradient-end: rgba(59, 130, 246, 0.05);
523
- }
524
- .nodeTrigger {
525
- --glow-color: rgba(249, 115, 22, 0.4);
526
- --node-color-light: rgba(249, 115, 22, 0.1);
527
- --node-color-glow: rgba(249, 115, 22, 0.15);
528
- --handle-color: rgba(249, 115, 22, 0.5);
529
- --gradient-start: rgba(249, 115, 22, 0.15);
530
- --gradient-end: rgba(249, 115, 22, 0.05);
531
- }
532
- .nodeIntegration {
533
- --glow-color: rgba(20, 184, 166, 0.4);
534
- --node-color-light: rgba(20, 184, 166, 0.1);
535
- --node-color-glow: rgba(20, 184, 166, 0.15);
536
- --handle-color: rgba(20, 184, 166, 0.5);
537
- --gradient-start: rgba(20, 184, 166, 0.15);
538
- --gradient-end: rgba(20, 184, 166, 0.05);
539
- }
540
- .nodeExternal {
541
- --glow-color: rgba(107, 114, 128, 0.4);
542
- --node-color-light: rgba(107, 114, 128, 0.1);
543
- --node-color-glow: rgba(107, 114, 128, 0.15);
544
- --handle-color: rgba(107, 114, 128, 0.5);
545
- --gradient-start: rgba(107, 114, 128, 0.15);
546
- --gradient-end: rgba(107, 114, 128, 0.05);
547
- }
548
- .nodeHuman {
549
- --glow-color: rgba(245, 158, 11, 0.4);
550
- --node-color-light: rgba(245, 158, 11, 0.1);
551
- --node-color-glow: rgba(245, 158, 11, 0.15);
552
- --handle-color: rgba(245, 158, 11, 0.5);
553
- --gradient-start: rgba(245, 158, 11, 0.15);
554
- --gradient-end: rgba(245, 158, 11, 0.05);
555
- }
556
- .nodePrimary {
557
- --glow-color: rgba(37, 99, 235, 0.4);
558
- --node-color-light: rgba(37, 99, 235, 0.1);
559
- --node-color-glow: rgba(37, 99, 235, 0.15);
560
- --handle-color: rgba(37, 99, 235, 0.5);
561
- --gradient-start: rgba(37, 99, 235, 0.15);
562
- --gradient-end: rgba(37, 99, 235, 0.05);
563
- }
564
- .handle {
565
- transition: all 0.2s ease;
566
- }
567
- .handle:hover {
568
- animation: handlePulse 1s ease-in-out infinite;
569
- }
570
- .nodeIcon {
571
- transition: all 0.3s ease;
572
- }
573
- .badge {
574
- transition: all 0.2s ease;
575
- backdrop-filter: blur(4px);
576
- }
577
- .nodeCard:hover .badge {
578
- transform: scale(1.05);
579
- }
580
- .badgeProd {
581
- box-shadow: 0 0 8px rgba(34, 197, 94, 0.3);
582
- }
583
- .edge {
584
- transition: all 0.3s ease;
585
- }
586
- .edgeAnimated {
587
- stroke-dasharray: 8 4;
588
- animation: edgeFlow 1s linear infinite;
589
- }
590
- .edgeGlow {
591
- filter: drop-shadow(0 0 3px var(--edge-color, color-mix(in srgb, var(--color-primary) 50%, transparent)));
592
- }
593
- .edgeHighlighted {
594
- stroke-width: 3px;
595
- }
596
- .edgeLabel {
597
- backdrop-filter: blur(8px);
598
- border: 1px solid rgba(255, 255, 255, 0.1);
599
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 0 20px var(--label-glow, color-mix(in srgb, var(--color-primary) 20%, transparent));
600
- transition: box-shadow 0.2s ease;
601
- }
602
- .edgeLabel:hover {
603
- box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2), 0 0 30px var(--label-glow, color-mix(in srgb, var(--color-primary) 30%, transparent));
604
- }
605
- .legend {
606
- backdrop-filter: var(--glass-blur);
607
- background: var(--glass-background);
608
- border: 1px solid color-mix(in srgb, var(--color-primary) 20%, transparent);
609
- box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1), 0 0 40px color-mix(in srgb, var(--color-primary) 10%, transparent);
610
- }
611
- [data-mantine-color-scheme=dark] .legend {
612
- border-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
613
- }
614
- .legendDot {
615
- transition: all 0.2s ease;
616
- box-shadow: 0 0 8px currentColor;
617
- }
618
- .legendDot:hover {
619
- transform: scale(1.3);
620
- box-shadow: 0 0 12px currentColor;
621
- }
622
- .nodeHighlighted .nodeCard {
623
- transform: translateY(-2px) scale(1.02);
624
- }
625
- .nodeHighlighted .nodeCard::before {
626
- opacity: 1;
627
- }
628
- .nodeHighlighted .nodeCard::after {
629
- animation: scanLine 3s ease-in-out infinite;
630
- }
631
- .nodeDimmed {
632
- opacity: 0.3;
633
- filter: grayscale(0.5);
634
- transition: all 0.3s ease;
635
- }
636
- .edgeHighlighted {
637
- stroke-width: 4px !important;
638
- }
639
- .edgeDimmed {
640
- opacity: 0.15;
641
- transition: all 0.3s ease;
642
- }
643
- .edgeLabelDimmed {
644
- opacity: 0.15;
645
- transition: opacity 0.3s ease;
646
- }
647
- @media (prefers-reduced-motion: reduce) {
648
- .node,
649
- .nodeCard::after,
650
- .edgeAnimated,
651
- .nodeIcon,
652
- .handle:hover,
653
- .graphContainer {
654
- animation: none;
655
- }
656
- .nodeCard:hover {
657
- transform: none;
658
- }
659
- }