@eventcatalog/visualiser 3.22.1 → 4.0.0-beta.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 (9) hide show
  1. package/dist/index.d.mts +56 -22
  2. package/dist/index.d.ts +56 -22
  3. package/dist/index.js +1529 -1189
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +1195 -837
  6. package/dist/index.mjs.map +1 -1
  7. package/dist/styles-core.css +55 -0
  8. package/dist/styles.css +55 -0
  9. package/package.json +1 -1
package/dist/styles-core.css CHANGED
@@ -153,6 +153,7 @@
153
153
  --radius-md: 0.375rem;
154
154
  --radius-lg: 0.5rem;
155
155
  --radius-xl: 0.75rem;
156
+ --radius-2xl: 1rem;
156
157
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
157
158
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
158
159
  --animate-spin: spin 1s linear infinite;
@@ -191,6 +192,9 @@
191
192
  .eventcatalog-visualizer .-top-3 {
192
193
  top: calc(var(--spacing) * -3);
193
194
  }
195
+ .eventcatalog-visualizer .-top-4 {
196
+ top: calc(var(--spacing) * -4);
197
+ }
194
198
  .eventcatalog-visualizer .-top-10 {
195
199
  top: calc(var(--spacing) * -10);
196
200
  }
@@ -461,6 +465,9 @@
461
465
  .eventcatalog-visualizer .h-7 {
462
466
  height: calc(var(--spacing) * 7);
463
467
  }
468
+ .eventcatalog-visualizer .h-8 {
469
+ height: calc(var(--spacing) * 8);
470
+ }
464
471
  .eventcatalog-visualizer .h-9 {
465
472
  height: calc(var(--spacing) * 9);
466
473
  }
@@ -542,6 +549,9 @@
542
549
  .eventcatalog-visualizer .w-7 {
543
550
  width: calc(var(--spacing) * 7);
544
551
  }
552
+ .eventcatalog-visualizer .w-8 {
553
+ width: calc(var(--spacing) * 8);
554
+ }
545
555
  .eventcatalog-visualizer .w-9 {
546
556
  width: calc(var(--spacing) * 9);
547
557
  }
@@ -554,6 +564,9 @@
554
564
  .eventcatalog-visualizer .w-24 {
555
565
  width: calc(var(--spacing) * 24);
556
566
  }
567
+ .eventcatalog-visualizer .w-44 {
568
+ width: calc(var(--spacing) * 44);
569
+ }
557
570
  .eventcatalog-visualizer .w-96 {
558
571
  width: calc(var(--spacing) * 96);
559
572
  }
@@ -820,6 +833,9 @@
820
833
  .eventcatalog-visualizer .rounded {
821
834
  border-radius: 0.25rem;
822
835
  }
836
+ .eventcatalog-visualizer .rounded-2xl {
837
+ border-radius: var(--radius-2xl);
838
+ }
823
839
  .eventcatalog-visualizer .rounded-full {
824
840
  border-radius: calc(infinity * 1px);
825
841
  }
@@ -1267,6 +1283,9 @@
1267
1283
  .eventcatalog-visualizer .bg-\[rgb\(var\(--ec-page-text\)\)\] {
1268
1284
  background-color: rgb(var(--ec-page-text));
1269
1285
  }
1286
+ .eventcatalog-visualizer .bg-\[var\(--ec-actor-node-bg\,rgb\(var\(--ec-card-bg\)\)\)\] {
1287
+ background-color: var(--ec-actor-node-bg,rgb(var(--ec-card-bg)));
1288
+ }
1270
1289
  .eventcatalog-visualizer .bg-amber-100 {
1271
1290
  background-color: var(--color-amber-100);
1272
1291
  }
@@ -1895,6 +1914,9 @@
1895
1914
  .eventcatalog-visualizer .pt-3\.5 {
1896
1915
  padding-top: calc(var(--spacing) * 3.5);
1897
1916
  }
1917
+ .eventcatalog-visualizer .pt-5 {
1918
+ padding-top: calc(var(--spacing) * 5);
1919
+ }
1898
1920
  .eventcatalog-visualizer .pr-6 {
1899
1921
  padding-right: calc(var(--spacing) * 6);
1900
1922
  }
@@ -1910,6 +1932,9 @@
1910
1932
  .eventcatalog-visualizer .pb-2\.5 {
1911
1933
  padding-bottom: calc(var(--spacing) * 2.5);
1912
1934
  }
1935
+ .eventcatalog-visualizer .pb-3 {
1936
+ padding-bottom: calc(var(--spacing) * 3);
1937
+ }
1913
1938
  .eventcatalog-visualizer .pl-7 {
1914
1939
  padding-left: calc(var(--spacing) * 7);
1915
1940
  }
@@ -2065,6 +2090,9 @@
2065
2090
  .eventcatalog-visualizer .text-blue-500 {
2066
2091
  color: var(--color-blue-500);
2067
2092
  }
2093
+ .eventcatalog-visualizer .text-blue-600 {
2094
+ color: var(--color-blue-600);
2095
+ }
2068
2096
  .eventcatalog-visualizer .text-blue-700 {
2069
2097
  color: var(--color-blue-700);
2070
2098
  }
@@ -2101,6 +2129,9 @@
2101
2129
  .eventcatalog-visualizer .text-cyan-100 {
2102
2130
  color: var(--color-cyan-100);
2103
2131
  }
2132
+ .eventcatalog-visualizer .text-cyan-600 {
2133
+ color: var(--color-cyan-600);
2134
+ }
2104
2135
  .eventcatalog-visualizer .text-emerald-100 {
2105
2136
  color: var(--color-emerald-100);
2106
2137
  }
@@ -2161,6 +2192,9 @@
2161
2192
  .eventcatalog-visualizer .text-green-500 {
2162
2193
  color: var(--color-green-500);
2163
2194
  }
2195
+ .eventcatalog-visualizer .text-green-600 {
2196
+ color: var(--color-green-600);
2197
+ }
2164
2198
  .eventcatalog-visualizer .text-green-700 {
2165
2199
  color: var(--color-green-700);
2166
2200
  }
@@ -2200,6 +2234,9 @@
2200
2234
  .eventcatalog-visualizer .text-indigo-300 {
2201
2235
  color: var(--color-indigo-300);
2202
2236
  }
2237
+ .eventcatalog-visualizer .text-indigo-600 {
2238
+ color: var(--color-indigo-600);
2239
+ }
2203
2240
  .eventcatalog-visualizer .text-indigo-900\/40 {
2204
2241
  color: color-mix(in srgb, oklch(35.9% 0.144 278.697) 40%, transparent);
2205
2242
  @supports (color: color-mix(in lab, red, red)) {
@@ -2242,6 +2279,9 @@
2242
2279
  .eventcatalog-visualizer .text-orange-500 {
2243
2280
  color: var(--color-orange-500);
2244
2281
  }
2282
+ .eventcatalog-visualizer .text-orange-600 {
2283
+ color: var(--color-orange-600);
2284
+ }
2245
2285
  .eventcatalog-visualizer .text-orange-700 {
2246
2286
  color: var(--color-orange-700);
2247
2287
  }
@@ -2281,6 +2321,9 @@
2281
2321
  .eventcatalog-visualizer .text-pink-500 {
2282
2322
  color: var(--color-pink-500);
2283
2323
  }
2324
+ .eventcatalog-visualizer .text-pink-600 {
2325
+ color: var(--color-pink-600);
2326
+ }
2284
2327
  .eventcatalog-visualizer .text-pink-700 {
2285
2328
  color: var(--color-pink-700);
2286
2329
  }
@@ -2320,6 +2363,9 @@
2320
2363
  .eventcatalog-visualizer .text-purple-300 {
2321
2364
  color: var(--color-purple-300);
2322
2365
  }
2366
+ .eventcatalog-visualizer .text-purple-600 {
2367
+ color: var(--color-purple-600);
2368
+ }
2323
2369
  .eventcatalog-visualizer .text-purple-900 {
2324
2370
  color: var(--color-purple-900);
2325
2371
  }
@@ -2368,6 +2414,9 @@
2368
2414
  .eventcatalog-visualizer .text-sky-500 {
2369
2415
  color: var(--color-sky-500);
2370
2416
  }
2417
+ .eventcatalog-visualizer .text-sky-600 {
2418
+ color: var(--color-sky-600);
2419
+ }
2371
2420
  .eventcatalog-visualizer .text-sky-700 {
2372
2421
  color: var(--color-sky-700);
2373
2422
  }
@@ -2380,6 +2429,9 @@
2380
2429
  .eventcatalog-visualizer .text-teal-500 {
2381
2430
  color: var(--color-teal-500);
2382
2431
  }
2432
+ .eventcatalog-visualizer .text-teal-600 {
2433
+ color: var(--color-teal-600);
2434
+ }
2383
2435
  .eventcatalog-visualizer .text-teal-700 {
2384
2436
  color: var(--color-teal-700);
2385
2437
  }
@@ -2389,6 +2441,9 @@
2389
2441
  .eventcatalog-visualizer .text-violet-500 {
2390
2442
  color: var(--color-violet-500);
2391
2443
  }
2444
+ .eventcatalog-visualizer .text-violet-600 {
2445
+ color: var(--color-violet-600);
2446
+ }
2392
2447
  .eventcatalog-visualizer .text-violet-700 {
2393
2448
  color: var(--color-violet-700);
2394
2449
  }
package/dist/styles.css CHANGED
@@ -153,6 +153,7 @@
153
153
  --radius-md: 0.375rem;
154
154
  --radius-lg: 0.5rem;
155
155
  --radius-xl: 0.75rem;
156
+ --radius-2xl: 1rem;
156
157
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
157
158
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
158
159
  --animate-spin: spin 1s linear infinite;
@@ -191,6 +192,9 @@
191
192
  .eventcatalog-visualizer .-top-3 {
192
193
  top: calc(var(--spacing) * -3);
193
194
  }
195
+ .eventcatalog-visualizer .-top-4 {
196
+ top: calc(var(--spacing) * -4);
197
+ }
194
198
  .eventcatalog-visualizer .-top-10 {
195
199
  top: calc(var(--spacing) * -10);
196
200
  }
@@ -461,6 +465,9 @@
461
465
  .eventcatalog-visualizer .h-7 {
462
466
  height: calc(var(--spacing) * 7);
463
467
  }
468
+ .eventcatalog-visualizer .h-8 {
469
+ height: calc(var(--spacing) * 8);
470
+ }
464
471
  .eventcatalog-visualizer .h-9 {
465
472
  height: calc(var(--spacing) * 9);
466
473
  }
@@ -542,6 +549,9 @@
542
549
  .eventcatalog-visualizer .w-7 {
543
550
  width: calc(var(--spacing) * 7);
544
551
  }
552
+ .eventcatalog-visualizer .w-8 {
553
+ width: calc(var(--spacing) * 8);
554
+ }
545
555
  .eventcatalog-visualizer .w-9 {
546
556
  width: calc(var(--spacing) * 9);
547
557
  }
@@ -554,6 +564,9 @@
554
564
  .eventcatalog-visualizer .w-24 {
555
565
  width: calc(var(--spacing) * 24);
556
566
  }
567
+ .eventcatalog-visualizer .w-44 {
568
+ width: calc(var(--spacing) * 44);
569
+ }
557
570
  .eventcatalog-visualizer .w-96 {
558
571
  width: calc(var(--spacing) * 96);
559
572
  }
@@ -820,6 +833,9 @@
820
833
  .eventcatalog-visualizer .rounded {
821
834
  border-radius: 0.25rem;
822
835
  }
836
+ .eventcatalog-visualizer .rounded-2xl {
837
+ border-radius: var(--radius-2xl);
838
+ }
823
839
  .eventcatalog-visualizer .rounded-full {
824
840
  border-radius: calc(infinity * 1px);
825
841
  }
@@ -1267,6 +1283,9 @@
1267
1283
  .eventcatalog-visualizer .bg-\[rgb\(var\(--ec-page-text\)\)\] {
1268
1284
  background-color: rgb(var(--ec-page-text));
1269
1285
  }
1286
+ .eventcatalog-visualizer .bg-\[var\(--ec-actor-node-bg\,rgb\(var\(--ec-card-bg\)\)\)\] {
1287
+ background-color: var(--ec-actor-node-bg,rgb(var(--ec-card-bg)));
1288
+ }
1270
1289
  .eventcatalog-visualizer .bg-amber-100 {
1271
1290
  background-color: var(--color-amber-100);
1272
1291
  }
@@ -1895,6 +1914,9 @@
1895
1914
  .eventcatalog-visualizer .pt-3\.5 {
1896
1915
  padding-top: calc(var(--spacing) * 3.5);
1897
1916
  }
1917
+ .eventcatalog-visualizer .pt-5 {
1918
+ padding-top: calc(var(--spacing) * 5);
1919
+ }
1898
1920
  .eventcatalog-visualizer .pr-6 {
1899
1921
  padding-right: calc(var(--spacing) * 6);
1900
1922
  }
@@ -1910,6 +1932,9 @@
1910
1932
  .eventcatalog-visualizer .pb-2\.5 {
1911
1933
  padding-bottom: calc(var(--spacing) * 2.5);
1912
1934
  }
1935
+ .eventcatalog-visualizer .pb-3 {
1936
+ padding-bottom: calc(var(--spacing) * 3);
1937
+ }
1913
1938
  .eventcatalog-visualizer .pl-7 {
1914
1939
  padding-left: calc(var(--spacing) * 7);
1915
1940
  }
@@ -2065,6 +2090,9 @@
2065
2090
  .eventcatalog-visualizer .text-blue-500 {
2066
2091
  color: var(--color-blue-500);
2067
2092
  }
2093
+ .eventcatalog-visualizer .text-blue-600 {
2094
+ color: var(--color-blue-600);
2095
+ }
2068
2096
  .eventcatalog-visualizer .text-blue-700 {
2069
2097
  color: var(--color-blue-700);
2070
2098
  }
@@ -2101,6 +2129,9 @@
2101
2129
  .eventcatalog-visualizer .text-cyan-100 {
2102
2130
  color: var(--color-cyan-100);
2103
2131
  }
2132
+ .eventcatalog-visualizer .text-cyan-600 {
2133
+ color: var(--color-cyan-600);
2134
+ }
2104
2135
  .eventcatalog-visualizer .text-emerald-100 {
2105
2136
  color: var(--color-emerald-100);
2106
2137
  }
@@ -2161,6 +2192,9 @@
2161
2192
  .eventcatalog-visualizer .text-green-500 {
2162
2193
  color: var(--color-green-500);
2163
2194
  }
2195
+ .eventcatalog-visualizer .text-green-600 {
2196
+ color: var(--color-green-600);
2197
+ }
2164
2198
  .eventcatalog-visualizer .text-green-700 {
2165
2199
  color: var(--color-green-700);
2166
2200
  }
@@ -2200,6 +2234,9 @@
2200
2234
  .eventcatalog-visualizer .text-indigo-300 {
2201
2235
  color: var(--color-indigo-300);
2202
2236
  }
2237
+ .eventcatalog-visualizer .text-indigo-600 {
2238
+ color: var(--color-indigo-600);
2239
+ }
2203
2240
  .eventcatalog-visualizer .text-indigo-900\/40 {
2204
2241
  color: color-mix(in srgb, oklch(35.9% 0.144 278.697) 40%, transparent);
2205
2242
  @supports (color: color-mix(in lab, red, red)) {
@@ -2242,6 +2279,9 @@
2242
2279
  .eventcatalog-visualizer .text-orange-500 {
2243
2280
  color: var(--color-orange-500);
2244
2281
  }
2282
+ .eventcatalog-visualizer .text-orange-600 {
2283
+ color: var(--color-orange-600);
2284
+ }
2245
2285
  .eventcatalog-visualizer .text-orange-700 {
2246
2286
  color: var(--color-orange-700);
2247
2287
  }
@@ -2281,6 +2321,9 @@
2281
2321
  .eventcatalog-visualizer .text-pink-500 {
2282
2322
  color: var(--color-pink-500);
2283
2323
  }
2324
+ .eventcatalog-visualizer .text-pink-600 {
2325
+ color: var(--color-pink-600);
2326
+ }
2284
2327
  .eventcatalog-visualizer .text-pink-700 {
2285
2328
  color: var(--color-pink-700);
2286
2329
  }
@@ -2320,6 +2363,9 @@
2320
2363
  .eventcatalog-visualizer .text-purple-300 {
2321
2364
  color: var(--color-purple-300);
2322
2365
  }
2366
+ .eventcatalog-visualizer .text-purple-600 {
2367
+ color: var(--color-purple-600);
2368
+ }
2323
2369
  .eventcatalog-visualizer .text-purple-900 {
2324
2370
  color: var(--color-purple-900);
2325
2371
  }
@@ -2368,6 +2414,9 @@
2368
2414
  .eventcatalog-visualizer .text-sky-500 {
2369
2415
  color: var(--color-sky-500);
2370
2416
  }
2417
+ .eventcatalog-visualizer .text-sky-600 {
2418
+ color: var(--color-sky-600);
2419
+ }
2371
2420
  .eventcatalog-visualizer .text-sky-700 {
2372
2421
  color: var(--color-sky-700);
2373
2422
  }
@@ -2380,6 +2429,9 @@
2380
2429
  .eventcatalog-visualizer .text-teal-500 {
2381
2430
  color: var(--color-teal-500);
2382
2431
  }
2432
+ .eventcatalog-visualizer .text-teal-600 {
2433
+ color: var(--color-teal-600);
2434
+ }
2383
2435
  .eventcatalog-visualizer .text-teal-700 {
2384
2436
  color: var(--color-teal-700);
2385
2437
  }
@@ -2389,6 +2441,9 @@
2389
2441
  .eventcatalog-visualizer .text-violet-500 {
2390
2442
  color: var(--color-violet-500);
2391
2443
  }
2444
+ .eventcatalog-visualizer .text-violet-600 {
2445
+ color: var(--color-violet-600);
2446
+ }
2392
2447
  .eventcatalog-visualizer .text-violet-700 {
2393
2448
  color: var(--color-violet-700);
2394
2449
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eventcatalog/visualiser",
3
- "version": "3.22.1",
3
+ "version": "4.0.0-beta.0",
4
4
  "description": "ReactFlow nodes and visualiser components for EventCatalog - framework agnostic",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",