完成M3动态Scheme的创建。

src/material-3-scheme.ts

@@ -64,7 +64,7 @@ export type MaterialDesign3DynamicSchemeSource = {
   error: string | null;
   custom_colors?: Record<string, string>;
   variant: number | null;
-  constrastLevel: number | null;
+  contrastLevel: number | null;
   harmonizeCustoms: boolean | null;
 };
 

src/page-components/scheme/m3-dynamic-scheme/Builder.tsx

@@ -8,6 +8,7 @@ import { VSegmentedControl } from '../../../components/VSegmentedControl';
 import { MaterialDesign3DynamicSchemeStorage } from '../../../material-3-scheme';
 import { Option, SchemeContent } from '../../../models';
 import { useUpdateScheme } from '../../../stores/schemes';
+import { mapToObject } from '../../../utls';
 import { ColorEntry, IdenticalColorEntry } from '../ColorEntry';
 import styles from './Builder.module.css';
 
@@ -46,7 +47,7 @@ export function M3DynamicSchemeBuilder({ scheme, onBuildCompleted }: M3DynamicSc
     return [];
   }, []);
   const [contrastLevel, setContrastLevel] = useState<number>(
-    scheme.schemeStorage.source?.constrastLevel ?? 0,
+    () => scheme.schemeStorage.source?.contrastLevel ?? 1,
   );
 
   const [errMsg, handleSubmitAction] = useActionState<Map<string, string>, FormData>(
@@ -61,7 +62,7 @@ export function M3DynamicSchemeBuilder({ scheme, onBuildCompleted }: M3DynamicSc
 
       try {
         const dynamicVariant = Number(formData.get('variant'));
-        const contrastLevel = Number(formData.get('contrast_level'));
+        const contrast = Number(formData.get('contrast_level'));
         const harmonizeCustoms = isEqual(formData.get('harmonize_customs'), 'true');
         const errorColor = formData.get('error') as string;
         const customColors: Record<string, string> = {};
@@ -80,7 +81,34 @@ export function M3DynamicSchemeBuilder({ scheme, onBuildCompleted }: M3DynamicSc
           harmonizeCustoms,
           customColors,
         );
-        console.debug('[generate m3d]', generate_scheme);
+        updateScheme((prev) => {
+          prev.schemeStorage.source = {
+            source: sourceColor,
+            error: errorColor,
+            custom_colors: customColors,
+            variant: dynamicVariant,
+            contrastLevel: contrast,
+            harmonizeCustoms: harmonizeCustoms,
+          };
+          prev.schemeStorage.scheme = {
+            white: generate_scheme[0].white,
+            black: generate_scheme[0].black,
+            light_baseline: {
+              ...generate_scheme[0].light_baseline,
+              customs: mapToObject(generate_scheme[0].light_baseline.customs),
+            },
+            dark_baseline: {
+              ...generate_scheme[0].dark_baseline,
+              customs: mapToObject(generate_scheme[0].dark_baseline.customs),
+            },
+          };
+          prev.schemeStorage.cssVariables = generate_scheme[1];
+          prev.schemeStorage.scssVariables = generate_scheme[2];
+          prev.schemeStorage.jsVariables = generate_scheme[3];
+          return prev;
+        });
+
+        onBuildCompleted?.();
       } catch (e) {
         console.error('[generate m3d]', e);
       }
@@ -125,7 +153,7 @@ export function M3DynamicSchemeBuilder({ scheme, onBuildCompleted }: M3DynamicSc
           <VSegmentedControl
             name="variant"
             options={variantOptions}
-            defaultValue={scheme.schemeStorage.source?.variant}
+            defaultValue={scheme.schemeStorage.source?.variant ?? 6}
           />
         </div>
         <label className={styles.label}>Contrast Level</label>