Feat: dark mode (#3652)

* feat(react/svelte): add dark mode defaults

* refactor(darkmode): minimap, edges, edge labels

* chore(style): edge label color

* feat(colorMode): add colorMode prop light/dark/system

* chore(examples): cleanup

* test(colorMode): add tests

* chore(base.css): add dark base

* chore(examples): cleanup

packages/svelte/src/lib/container/SvelteFlow/utils.ts

@@ -1,6 +1,6 @@
 import type { SvelteFlowStore } from '$lib/store/types';
 import type { EdgeTypes, NodeTypes } from '$lib/types';
-import type { CoordinateExtent } from '@xyflow/system';
+import type { ColorMode, CoordinateExtent } from '@xyflow/system';
 import type { Writable } from 'svelte/store';
 
 // this is helper function for updating the store
@@ -77,3 +77,15 @@ export function updateStoreByKeys(store: SvelteFlowStore, keys: UpdatableStorePr
     }
   });
 }
+
+export function getColorModeClass(colorMode?: ColorMode) {
+  if (colorMode !== 'system') {
+    return colorMode;
+  }
+
+  if (!colorMode || typeof window === 'undefined' || !window.matchMedia) {
+    return 'light';
+  }
+
+  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}