fix: Property saving and synchronization improvements

.gitignore

@@ -2,4 +2,5 @@ node_modules
 .env
 .DS_Store
 undefined
-.vscode
+.vscode
+data.json

package.json

@@ -4,7 +4,7 @@
   "description": "make.md",
   "main": "main.js",
   "scripts": {
-    "dev": "nnode esbuild.config.mjs",
+    "dev": "node esbuild.config.mjs",
     "build": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs production",
     "preview": "tsc -noEmit -skipLibCheck && node esbuild.config.mjs preview",
     "demo": "&& node esbuild.config.mjs demo",

src/core/react/components/Explorer/PropertiesView.tsx

@@ -128,20 +128,34 @@ export const PropertiesView = (props: {
     }
   };
 
+  const pathChanged = (payload: { path: string }) => {
+    if (payload.path == pathState?.path) {
+      refreshData();
+    }
+  };
+
   useEffect(() => {
     refreshData();
     props.superstate.eventsDispatcher.addListener(
       "contextStateUpdated",
       mdbChanged
     );
+    props.superstate.eventsDispatcher.addListener(
+      "pathStateUpdated",
+      pathChanged
+    );
 
     return () => {
       props.superstate.eventsDispatcher.removeListener(
         "contextStateUpdated",
         mdbChanged
       );
+      props.superstate.eventsDispatcher.removeListener(
+        "pathStateUpdated",
+        pathChanged
+      );
     };
-  }, [props.spaces, tableData]);
+  }, [props.spaces, tableData, pathState]);
   const savePropertyValue = (value: string, f: SpaceTableColumn) => {
     if (saveProperty) {
       const property = tableData?.cols?.find((g) => g.name == f.name);

src/core/react/components/SpaceView/Contexts/DataTypeView/OptionCell.tsx

@@ -66,11 +66,11 @@ export const OptionCell = (
         .map((t, index) => ({
           ...t,
           color: editable
-            ? schemeColors
+            ? t.color?.length > 0
+              ? t.color  // Use individual option color if set
+              : schemeColors
               ? schemeColors[index % schemeColors.length]?.value ||
                 "var(--mk-color-none)"
-              : t.color?.length > 0
-              ? t.color
               : undefined
             : undefined,
           removeable: editable ? editMode >= CellEditMode.EditModeView : false,

src/core/react/components/UI/Menus/contexts/PropertyValue.tsx

@@ -444,10 +444,11 @@ export const PropertyValueComponent = (props: {
     const options = parseOptions(parsedValue.options ?? []);
 
     const saveOptionsHandler = (newOptions: SelectOption[], colorScheme?: string) => {
-      saveParsedValue("options", newOptions);
+      const updated: Record<string, any> = { ...parsedValue, options: newOptions };
       if (colorScheme !== undefined) {
-        saveParsedValue("colorScheme", colorScheme);
+        updated.colorScheme = colorScheme;
       }
+      props.saveValue(JSON.stringify(updated));
     };
 
     props.superstate.ui.openModal(

src/core/react/components/UI/Modals/EditOptionsModal.tsx

@@ -78,13 +78,17 @@ const SortableOptionItem: React.FC<SortableOptionItemProps> = ({
     e.preventDefault();
 
     // Always show color picker menu regardless of color scheme
-    showColorPickerMenu(
+    const menu = showColorPickerMenu(
       superstate,
       (e.target as HTMLElement).getBoundingClientRect(),
       windowFromDocument(e.view.document),
       option.color || "var(--mk-color-none)",
       (color: string) => {
         onEdit({ ...option, color });
+        // Auto-close menu after color selection
+        if (menu) {
+          menu.hide();
+        }
       }
     );
   };

tsconfig.json

@@ -7,7 +7,7 @@
     "inlineSources": true,
     "isolatedModules": true,
     "module": "ESNext",
-    "target": "es6",
+    "target": "es2020",
     "allowJs": true,
     "alwaysStrict": true,
     "noImplicitAny": true,