diff --git a/app/packages/core/src/plugins/SchemaIO/components/AutocompleteView.tsx b/app/packages/core/src/plugins/SchemaIO/components/AutocompleteView.tsx
index 4abf36779e..8a1f749a9a 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/AutocompleteView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/AutocompleteView.tsx
@@ -4,6 +4,7 @@ import FieldWrapper from "./FieldWrapper";
 import autoFocus from "../utils/auto-focus";
 import { getComponentProps } from "../utils";
 import ChoiceMenuItemBody from "./ChoiceMenuItemBody";
+import { useKey } from "../hooks";
 
 export default function AutocompleteView(props) {
   const { onChange, path, schema, data } = props;
@@ -11,17 +12,22 @@ export default function AutocompleteView(props) {
   const { choices = [], readOnly } = view;
 
   const multiple = schema.type === "array";
+  const [key, setUserChanged] = useKey(path, schema, data, true);
 
   return (
     <FieldWrapper {...props}>
       <Autocomplete
+        key={key}
         disabled={readOnly}
         autoHighlight
         clearOnBlur={multiple}
-        defaultValue={getDefaultValue(data ?? schema?.default, choices)}
+        defaultValue={getDefaultValue(data, choices)}
         freeSolo
         size="small"
-        onChange={(e, choice) => onChange(path, choice?.value || choice)}
+        onChange={(e, choice) => {
+          onChange(path, choice?.value || choice);
+          setUserChanged();
+        }}
         options={choices.map((choice) => ({
           id: choice.value,
           label: choice.label || choice.value,
diff --git a/app/packages/core/src/plugins/SchemaIO/components/CheckboxView.tsx b/app/packages/core/src/plugins/SchemaIO/components/CheckboxView.tsx
index 7f05412e8b..94acb000cd 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/CheckboxView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/CheckboxView.tsx
@@ -3,18 +3,24 @@ import React from "react";
 import HeaderView from "./HeaderView";
 import autoFocus from "../utils/auto-focus";
 import { getComponentProps } from "../utils";
+import { useKey } from "../hooks";
 
 export default function CheckboxView(props) {
   const { onChange, path, schema, data } = props;
+  const [key, setUserChanged] = useKey(path, schema, data, true);
 
   return (
     <FormControlLabel
       control={
         <Checkbox
+          key={key}
           disabled={schema.view?.readOnly}
           autoFocus={autoFocus(props)}
-          defaultChecked={data === true || schema.default === true}
-          onChange={(e, value) => onChange(path, value)}
+          defaultChecked={data === true}
+          onChange={(e, value) => {
+            onChange(path, value);
+            setUserChanged();
+          }}
           {...getComponentProps(props, "checkbox")}
         />
       }
diff --git a/app/packages/core/src/plugins/SchemaIO/components/CodeView.tsx b/app/packages/core/src/plugins/SchemaIO/components/CodeView.tsx
index 35656c0829..ec06669392 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/CodeView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/CodeView.tsx
@@ -4,13 +4,14 @@ import React from "react";
 import HeaderView from "./HeaderView";
 import autoFocus from "../utils/auto-focus";
 import { getComponentProps } from "../utils";
+import { useKey } from "../hooks";
 
 export default function CodeView(props) {
   const { mode } = useColorScheme();
   const { onChange, path, schema, data } = props;
-  const { default: defaultValue, view = {} } = schema;
+  const { view = {} } = schema;
   const { language, readOnly } = view;
-  const src = data ?? defaultValue;
+  const src = data;
   let height = view.height ?? 250;
   if (view.height === "auto") {
     const lineHeight = 19;
@@ -18,6 +19,8 @@ export default function CodeView(props) {
     height = lineHeight * numLines;
   }
 
+  const [key, setUserChanged] = useKey(path, schema, data, true);
+
   return (
     <Box
       sx={{
@@ -33,11 +36,15 @@ export default function CodeView(props) {
     >
       <HeaderView {...props} nested />
       <Editor
+        key={key}
         height={height}
         theme={mode === "dark" ? "vs-dark" : "light"}
-        value={readOnly ? data : undefined}
+        value={data}
         defaultValue={src}
-        onChange={(value) => onChange(path, value)}
+        onChange={(value) => {
+          onChange(path, value);
+          setUserChanged();
+        }}
         language={language}
         options={{ readOnly }}
         onMount={(editor) => {
diff --git a/app/packages/core/src/plugins/SchemaIO/components/ColorView.tsx b/app/packages/core/src/plugins/SchemaIO/components/ColorView.tsx
index c790cfe9be..d5478caab3 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/ColorView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/ColorView.tsx
@@ -1,25 +1,36 @@
 import { Box, Popper, Stack, TextField } from "@mui/material";
-import React, { useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import * as ColorPickers from "react-color";
 import { colorPicker } from "./ColorView.module.css";
 import HeaderView from "./HeaderView";
 import autoFocus from "../utils/auto-focus";
 import { getComponentProps } from "../utils";
+import { useKey } from "../hooks";
 
 export default function ColorView(props) {
   const { onChange, path, schema, data } = props;
   const { view = {} } = schema;
   const { compact, variant, readOnly } = view;
   const [open, setOpen] = useState(false);
-  const [color, setColor] = useState(data ?? defaultColor);
+  const [color, setColor] = useState(data ?? fallbackColor);
   const [anchor, setAnchor] = React.useState<null | HTMLElement>(null);
   const Component = ColorPickers[variant] || ColorPickers.ChromePicker;
 
   const { bgColor, hexColor } = formatColor(color);
+  const [key, setUserChanged] = useKey(path, schema, data, true);
+
+  const handleChange = useCallback(
+    (color) => {
+      setColor(color);
+      onChange(path, color);
+      setUserChanged();
+    },
+    [onChange, path, setUserChanged]
+  );
 
   useEffect(() => {
-    onChange(path, color);
-  }, [color]);
+    setColor(data ?? fallbackColor);
+  }, [key]);
 
   return (
     <Box {...getComponentProps(props, "container")}>
@@ -47,11 +58,12 @@ export default function ColorView(props) {
         />
         {!compact && (
           <TextField
+            key={key}
             autoFocus={autoFocus(props)}
             size="small"
             value={hexColor}
             onChange={(e) => {
-              setColor({ hex: e.target.value });
+              handleChange({ hex: e.target.value });
             }}
             disabled={readOnly}
             {...getComponentProps(props, "field")}
@@ -62,13 +74,12 @@ export default function ColorView(props) {
         open={open}
         anchorEl={anchor}
         placement="bottom-start"
+        sx={{ zIndex: (theme) => theme.zIndex.modal + 1 }}
         {...getComponentProps(props, "popper")}
       >
         <Component
           color={color.hsl || color.hex}
-          onChange={(color) => {
-            setColor(color);
-          }}
+          onChange={handleChange}
           className={colorPicker}
           {...getComponentProps(props, "picker")}
         />
@@ -77,19 +88,17 @@ export default function ColorView(props) {
   );
 }
 
-function formatColor(color) {
+function formatColor(color: ColorType) {
   const { hsl = {}, hex } = color;
   const { h, s, l, a } = hsl;
-  const bgColor = color.hsl
-    ? `hsla(${h},${s * 100}%,${l * 100}%,${a})`
-    : color.hex;
+  const bgColor = hsl ? `hsla(${h},${s * 100}%,${l * 100}%,${a})` : color.hex;
   const hexColor = (hex.startsWith("#") ? hex : `#${hex}`).toLowerCase();
   return { ...color, bgColor, hexColor };
 }
 
-const defaultColor: defaultColorType = { hex: "#FF6D05" };
+const fallbackColor: ColorType = { hex: "#FF6D05" };
 
-type defaultColorType = {
+type ColorType = {
   hex: string;
   hsl?: {
     h: number;
diff --git a/app/packages/core/src/plugins/SchemaIO/components/DropdownView.tsx b/app/packages/core/src/plugins/SchemaIO/components/DropdownView.tsx
index f6798e9482..426503283a 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/DropdownView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/DropdownView.tsx
@@ -5,12 +5,13 @@ import autoFocus from "../utils/auto-focus";
 import AlertView from "./AlertView";
 import FieldWrapper from "./FieldWrapper";
 import ChoiceMenuItemBody from "./ChoiceMenuItemBody";
+import { useKey } from "../hooks";
 
 const MULTI_SELECT_TYPES = ["string", "array"];
 
 export default function DropdownView(props) {
   const { onChange, schema, path, data } = props;
-  const { default: defaultValue, view = {}, type } = schema;
+  const { view = {}, type } = schema;
   const {
     choices,
     multiple: multiSelect,
@@ -18,6 +19,7 @@ export default function DropdownView(props) {
     separator = ",",
     readOnly,
   } = view;
+  const [key, setUserChanged] = useKey(path, schema, data, true);
 
   if (multiSelect && !MULTI_SELECT_TYPES.includes(type))
     return (
@@ -37,7 +39,7 @@ export default function DropdownView(props) {
   const isArrayType = type === "array";
   const multiple = multiSelect || isArrayType;
   const fallbackDefaultValue = multiple ? [] : "";
-  const rawDefaultValue = data ?? defaultValue ?? fallbackDefaultValue;
+  const rawDefaultValue = data ?? fallbackDefaultValue;
   const computedDefaultValue =
     multiple && !Array.isArray(rawDefaultValue)
       ? rawDefaultValue.toString().split(separator)
@@ -51,6 +53,7 @@ export default function DropdownView(props) {
   return (
     <FieldWrapper {...props}>
       <Select
+        key={key}
         disabled={readOnly}
         autoFocus={autoFocus(props)}
         defaultValue={computedDefaultValue}
@@ -73,6 +76,7 @@ export default function DropdownView(props) {
               ? value.join(separator)
               : value;
           onChange(path, computedValue);
+          setUserChanged();
         }}
         multiple={multiple}
         {...getComponentProps(props, "select")}
diff --git a/app/packages/core/src/plugins/SchemaIO/components/DynamicIO.tsx b/app/packages/core/src/plugins/SchemaIO/components/DynamicIO.tsx
index b54a8d75c7..ed78e47abb 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/DynamicIO.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/DynamicIO.tsx
@@ -1,21 +1,39 @@
 import { PluginComponentType, useActivePlugins } from "@fiftyone/plugins";
+import { isPrimitiveType } from "@fiftyone/utilities";
+import { get } from "lodash";
 import React, { useEffect } from "react";
 import { getComponent, getErrorsForView } from "../utils";
-import { isNullish } from "@fiftyone/utilities";
+import { isPathUserChanged } from "../hooks";
 
 export default function DynamicIO(props) {
-  const { data, schema, onChange, path } = props;
+  const { data, schema, onChange, path, parentSchema, relativePath } = props;
   const customComponents = useCustomComponents();
   const Component = getComponent(schema, customComponents);
+  const computedSchema = schemaWithInheritedDefault(
+    schema,
+    parentSchema,
+    relativePath
+  );
+  const { default: defaultValue, type } = computedSchema;
 
   // todo: need to improve initializing default value in state
   useEffect(() => {
-    if (!isNullish(data)) return;
-    if (schema.default) onChange(path, schema.default);
-    else if (schema.type === "boolean") onChange(path, false);
-  }, []);
+    if (
+      isPrimitiveType(type) &&
+      data !== defaultValue &&
+      !isPathUserChanged(path)
+    ) {
+      onChange(path, defaultValue);
+    }
+  }, [defaultValue]);
 
-  return <Component {...props} validationErrors={getErrorsForView(props)} />;
+  return (
+    <Component
+      {...props}
+      schema={computedSchema}
+      validationErrors={getErrorsForView(props)}
+    />
+  );
 }
 
 function useCustomComponents() {
@@ -27,3 +45,10 @@ function useCustomComponents() {
     return componentsByName;
   }, {});
 }
+
+function schemaWithInheritedDefault(schema, parentSchema, path) {
+  const providedDefault = get(schema, "default");
+  const inheritedDefault = get(parentSchema, `default.${path}`);
+  const computedDefault = providedDefault ?? inheritedDefault;
+  return { ...schema, default: computedDefault };
+}
diff --git a/app/packages/core/src/plugins/SchemaIO/components/Header.tsx b/app/packages/core/src/plugins/SchemaIO/components/Header.tsx
index e4c7509cb9..a40a3c946d 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/Header.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/Header.tsx
@@ -29,7 +29,8 @@ export default function Header(props: HeaderProps) {
     !label &&
     !description &&
     (!caption || omitCaption) &&
-    (errors.length === 0 || omitErrors)
+    (errors.length === 0 || omitErrors) &&
+    !Actions
   ) {
     return null;
   }
diff --git a/app/packages/core/src/plugins/SchemaIO/components/ImageView.tsx b/app/packages/core/src/plugins/SchemaIO/components/ImageView.tsx
index ca08ba55de..65de8275d8 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/ImageView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/ImageView.tsx
@@ -5,7 +5,6 @@ import { getComponentProps } from "../utils";
 
 export default function ImageView(props) {
   const { schema, data } = props;
-  const { view = {} } = schema;
   const imageURI = data ?? schema?.default;
 
   return (
diff --git a/app/packages/core/src/plugins/SchemaIO/components/JSONView.tsx b/app/packages/core/src/plugins/SchemaIO/components/JSONView.tsx
index 42432d2b74..f548e7ce86 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/JSONView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/JSONView.tsx
@@ -8,7 +8,7 @@ import { HeaderView } from ".";
 import { getComponentProps } from "../utils";
 
 export default function JSONView(props) {
-  const { data, schema } = props;
+  const { data } = props;
   const { mode } = useColorScheme();
   const isDarkMode = mode === "dark";
 
@@ -17,7 +17,7 @@ export default function JSONView(props) {
       <HeaderView {...props} nested />
       <ReactJSONContainer {...getComponentProps(props, "jsonContainer")}>
         <ReactJSON
-          src={data ?? schema?.default}
+          src={data}
           theme={`ashes${!isDarkMode ? ":inverted" : ""}`}
           style={{
             padding: "1rem",
diff --git a/app/packages/core/src/plugins/SchemaIO/components/ListView.tsx b/app/packages/core/src/plugins/SchemaIO/components/ListView.tsx
index 183deb1fbb..7eea79466a 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/ListView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/ListView.tsx
@@ -8,6 +8,7 @@ import Button from "./Button";
 import DynamicIO from "./DynamicIO";
 import EmptyState from "./EmptyState";
 import HeaderView from "./HeaderView";
+import { NumberKeyObjectType } from "@fiftyone/utilities";
 
 export default function ListView(props) {
   const { schema, onChange, path, data, errors } = props;
@@ -52,6 +53,8 @@ export default function ListView(props) {
           </Grid>
         )}
         {Object.keys(state).map((id, index) => {
+          const fullPath = `${path}.${index}`;
+          const subPath = id.toString();
           const value = state[id];
           const ItemComponent = collapsible
             ? CollapsibleListItem
@@ -62,15 +65,20 @@ export default function ListView(props) {
               {...props}
               key={`${path}.${id}`}
               id={id}
-              path={id.toString()}
+              path={fullPath}
               index={index}
               data={value}
-              onChange={updateItem}
+              onChange={(path: string, value: unknown) => {
+                const relativePath = subPath + path.replace(fullPath, "");
+                updateItem(relativePath, value);
+              }}
               onDelete={deleteItem}
               errors={errors}
               schema={itemsSchema}
               readOnly={readOnly}
               hideIndexLabel={schema?.view?.hideIndexLabel}
+              parentSchema={schema}
+              relativePath={id}
             />
           );
         })}
@@ -154,27 +162,29 @@ function DeleteButton(props) {
 
 function useListState(initialState: Array<unknown>) {
   let initialNextId = 0;
-  const initialStateById = initialState.reduce((stateById, item) => {
-    stateById[initialNextId++] = item;
-    return stateById;
-  }, {});
 
-  const [state, setState] = useState(initialStateById);
+  const [state, setState] = useState<NumberKeyObjectType>(() => {
+    const initialStateById: NumberKeyObjectType = {};
+    for (const item of initialState) {
+      initialStateById[initialNextId++] = item;
+    }
+    return initialStateById;
+  });
   const [nextId, setNextId] = useState(initialNextId);
 
-  function addItem(item) {
+  function addItem(item: unknown) {
     setState((state) => ({ ...state, [nextId]: item }));
     setNextId((nextId) => nextId + 1);
   }
 
-  function deleteItem(id) {
+  function deleteItem(id: number) {
     setState((state) => {
       const updatedState = { ...state };
       delete updatedState[id];
       return updatedState;
     });
   }
-  function updateItem(path, value) {
+  function updateItem(path: string, value: unknown) {
     setState((state) => {
       const updatedState = { ...state };
       set(updatedState, path, value);
diff --git a/app/packages/core/src/plugins/SchemaIO/components/MapView.tsx b/app/packages/core/src/plugins/SchemaIO/components/MapView.tsx
index 76df249477..30f91a7321 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/MapView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/MapView.tsx
@@ -3,7 +3,7 @@ import ListView from "./ListView";
 import { getComponentProps } from "../utils";
 
 export default function MapView(props) {
-  const { id, schema, onChange, path, data, errors } = props;
+  const { id, schema, onChange, data } = props;
   const { additionalProperties, view = {} } = schema;
   const keyLabel = schema?.view?.key?.label || "Key";
 
diff --git a/app/packages/core/src/plugins/SchemaIO/components/MarkdownView.tsx b/app/packages/core/src/plugins/SchemaIO/components/MarkdownView.tsx
index 3b05d0ff51..7dc8354481 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/MarkdownView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/MarkdownView.tsx
@@ -122,7 +122,7 @@ const componentsMap = {
 };
 
 export default function MarkdownView(props) {
-  const { schema, data } = props;
+  const { data } = props;
 
   return (
     <Box {...getComponentProps(props, "container")}>
@@ -132,7 +132,7 @@ export default function MarkdownView(props) {
         remarkPlugins={[remarkGfm]}
         {...getComponentProps(props, "markdown")}
       >
-        {data || schema?.default}
+        {data}
       </ReactMarkdown>
     </Box>
   );
diff --git a/app/packages/core/src/plugins/SchemaIO/components/ObjectView.tsx b/app/packages/core/src/plugins/SchemaIO/components/ObjectView.tsx
index c6417ad34c..99f5330e38 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/ObjectView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/ObjectView.tsx
@@ -25,9 +25,10 @@ export default function ObjectView(props) {
       >
         {propertiesAsArray.map((property, i) => {
           const space = property?.view?.space || 12;
+          const { id } = property;
           return (
             <Grid
-              key={property.id}
+              key={id}
               item
               xs={space}
               {...getComponentProps(props, "gridItem")}
@@ -35,8 +36,10 @@ export default function ObjectView(props) {
               <DynamicIO
                 {...props}
                 schema={property}
-                path={getPath(path, property.id)}
-                data={data?.[property.id]}
+                path={getPath(path, id)}
+                data={data?.[id]}
+                parentSchema={schema}
+                relativePath={id}
               />
             </Grid>
           );
diff --git a/app/packages/core/src/plugins/SchemaIO/components/PlotlyView.tsx b/app/packages/core/src/plugins/SchemaIO/components/PlotlyView.tsx
index 5427e38013..a3a89571be 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/PlotlyView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/PlotlyView.tsx
@@ -7,24 +7,22 @@ import { getComponentProps } from "../utils";
 
 export default function PlotlyView(props) {
   const { data, schema } = props;
-  const { default: defaultData, view = {} } = schema;
-  const { config = {}, layout = {}, onSelectionChange } = view;
+  const { view = {} } = schema;
+  const { config = {}, layout = {} } = view;
   const theme = useTheme();
 
-  // todo: ...
-  function handleSelectionChange(selection) {
-    // invoke operator in onSelectionChange
-    // onSelectionChange.execute(selection)
+  function handleSelectionChange() {
+    // invoke operator name in view.onSelectionChange
   }
 
   return (
     <Box {...getComponentProps(props, "container")}>
       <HeaderView {...props} nested />
       <Plot
-        data={data || defaultData}
+        data={data}
         style={{ zIndex: 1 }}
         onSelected={handleSelectionChange}
-        onDeselect={() => handleSelectionChange(null)}
+        onDeselect={() => handleSelectionChange()}
         config={{
           scrollZoom: true,
           displaylogo: false,
diff --git a/app/packages/core/src/plugins/SchemaIO/components/PopoutButton.tsx b/app/packages/core/src/plugins/SchemaIO/components/PopoutButton.tsx
index fa3f7eab81..3a9986d30b 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/PopoutButton.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/PopoutButton.tsx
@@ -1,6 +1,6 @@
 import { IconButton, Popout } from "@fiftyone/components";
 import { useOutsideClick } from "@fiftyone/state";
-import { Box, Typography } from "@mui/material";
+import { Box } from "@mui/material";
 import React, { useRef, useState } from "react";
 
 // todo: convert to a view
diff --git a/app/packages/core/src/plugins/SchemaIO/components/RadioView.tsx b/app/packages/core/src/plugins/SchemaIO/components/RadioView.tsx
index 406b214f5a..6f070b88a6 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/RadioView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/RadioView.tsx
@@ -8,11 +8,15 @@ import {
 import React from "react";
 import { HeaderView } from ".";
 import { autoFocus, getComponentProps } from "../utils";
+import { useKey } from "../hooks";
 
 export default function RadioView(props: RadioGroupProps) {
   const { schema, onChange, path, data } = props;
   const { view = {} } = schema;
   const { choices, label, description, orientation, readOnly } = view;
+
+  const [key, setUserChanged] = useKey(path, schema, data, true);
+
   return (
     <FormControl {...getComponentProps(props, "container")}>
       {(label || description) && (
@@ -24,9 +28,11 @@ export default function RadioView(props: RadioGroupProps) {
         </FormLabel>
       )}
       <MUIRadioGroup
-        defaultValue={data ?? schema.default}
+        key={key}
+        defaultValue={data}
         onChange={(e, value) => {
           onChange(path, value);
+          setUserChanged();
         }}
         sx={{ alignItems: "flex-start" }}
         row={orientation !== "vertical"}
@@ -81,5 +87,8 @@ export type RadioGroupProps = {
   label?: string;
   description?: string;
   choices: Array<Choice>;
-  onChange: (selected: string) => void;
+  onChange: (path: string, value: string) => void;
+  schema: any; // todo
+  path: string;
+  data: unknown;
 };
diff --git a/app/packages/core/src/plugins/SchemaIO/components/SliderView.tsx b/app/packages/core/src/plugins/SchemaIO/components/SliderView.tsx
index a899e30012..d41509b4d2 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/SliderView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/SliderView.tsx
@@ -2,12 +2,19 @@ import React, { useEffect, useRef } from "react";
 import { Slider } from "@mui/material";
 import FieldWrapper from "./FieldWrapper";
 import { autoFocus, getComponentProps } from "../utils";
+import { useKey } from "../hooks";
+import { isNumber } from "lodash";
 
 export default function SliderView(props) {
   const { data, onChange, path, schema } = props;
   const sliderRef = useRef<HTMLInputElement>(null);
   const focus = autoFocus(props);
-  const { min = 0, max = 100, multipleOf = 1 } = schema;
+  const { type, min, max, multipleOf } = schema;
+  const computedMin = isNumber(min) ? min : 0;
+  const computedMax = isNumber(max) ? max : 100;
+  const computedMultipleOf = isNumber(multipleOf)
+    ? multipleOf
+    : (computedMax - computedMin) / 100;
 
   useEffect(() => {
     if (sliderRef.current && focus) {
@@ -15,17 +22,21 @@ export default function SliderView(props) {
     }
   }, [sliderRef, focus]);
 
+  const [key, setUserChanged] = useKey(path, schema, data, true);
+
   return (
     <FieldWrapper {...props}>
       <Slider
-        min={min}
-        max={max}
-        step={multipleOf}
+        min={computedMin}
+        max={computedMax}
+        step={computedMultipleOf}
+        key={key}
         disabled={schema.view?.readOnly}
         valueLabelDisplay="auto"
-        value={data ?? schema.default}
-        onChange={(e, value) => {
-          onChange(path, value);
+        defaultValue={data}
+        onChange={(e, value: string) => {
+          onChange(path, type === "number" ? parseFloat(value) : value);
+          setUserChanged();
         }}
         ref={sliderRef}
         {...getComponentProps(props, "slider")}
diff --git a/app/packages/core/src/plugins/SchemaIO/components/SwitchView.tsx b/app/packages/core/src/plugins/SchemaIO/components/SwitchView.tsx
index 9ea1b35bf7..c44f3787a7 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/SwitchView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/SwitchView.tsx
@@ -2,18 +2,25 @@ import { FormControlLabel, Switch } from "@mui/material";
 import React from "react";
 import { HeaderView } from ".";
 import { autoFocus, getComponentProps } from "../utils";
+import { useKey } from "../hooks";
 
 export default function SwitchView(props) {
-  const { schema, data, onChange, path } = props;
+  const { onChange, path, schema, data } = props;
+
+  const [key, setUserChanged] = useKey(path, schema, data, true);
 
   return (
     <FormControlLabel
       control={
         <Switch
+          key={key}
           disabled={schema.view?.readOnly}
           autoFocus={autoFocus(props)}
-          defaultChecked={data === true || schema.default === true}
-          onChange={(e, checked) => onChange(path, checked)}
+          defaultChecked={data === true}
+          onChange={(e, checked) => {
+            onChange(path, checked);
+            setUserChanged();
+          }}
           {...getComponentProps(props, "switch")}
         />
       }
diff --git a/app/packages/core/src/plugins/SchemaIO/components/TextFieldView.tsx b/app/packages/core/src/plugins/SchemaIO/components/TextFieldView.tsx
index d288d26391..caa765c9bf 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/TextFieldView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/TextFieldView.tsx
@@ -1,8 +1,9 @@
-import React from "react";
 import { TextField } from "@mui/material";
-import FieldWrapper from "./FieldWrapper";
-import autoFocus from "../utils/auto-focus";
+import React from "react";
+import { useKey } from "../hooks";
 import { getComponentProps } from "../utils";
+import autoFocus from "../utils/auto-focus";
+import FieldWrapper from "./FieldWrapper";
 
 export default function TextFieldView(props) {
   const { schema, onChange, path, data } = props;
@@ -10,12 +11,15 @@ export default function TextFieldView(props) {
 
   const { inputProps = {}, ...fieldProps } = getComponentProps(props, "field");
 
+  const [key, setUserChanged] = useKey(path, schema, data, true);
+
   return (
     <FieldWrapper {...props}>
       <TextField
+        key={key}
         disabled={view.readOnly}
         autoFocus={autoFocus(props)}
-        defaultValue={data ?? schema.default}
+        defaultValue={data}
         size="small"
         fullWidth
         placeholder={view.placeholder}
@@ -23,6 +27,7 @@ export default function TextFieldView(props) {
         onChange={(e) => {
           const value = e.target.value;
           onChange(path, type === "number" ? parseFloat(value) : value);
+          setUserChanged();
         }}
         inputProps={{ min, max, step: multipleOf, ...inputProps }}
         {...fieldProps}
diff --git a/app/packages/core/src/plugins/SchemaIO/components/TupleView.tsx b/app/packages/core/src/plugins/SchemaIO/components/TupleView.tsx
index b3f3825f9f..355eb29752 100644
--- a/app/packages/core/src/plugins/SchemaIO/components/TupleView.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/components/TupleView.tsx
@@ -36,6 +36,8 @@ export default function TuplesView(props) {
                 schema={itemSchema}
                 path={getPath(path, i)}
                 data={data?.[i] ?? itemSchema?.default ?? schema?.default?.[i]}
+                parentSchema={schema}
+                relativePath={i}
               />
             </Grid>
           );
diff --git a/app/packages/core/src/plugins/SchemaIO/hooks/index.ts b/app/packages/core/src/plugins/SchemaIO/hooks/index.ts
new file mode 100644
index 0000000000..f3c4de3833
--- /dev/null
+++ b/app/packages/core/src/plugins/SchemaIO/hooks/index.ts
@@ -0,0 +1 @@
+export * from "./useKey";
diff --git a/app/packages/core/src/plugins/SchemaIO/hooks/useKey.tsx b/app/packages/core/src/plugins/SchemaIO/hooks/useKey.tsx
new file mode 100644
index 0000000000..0be9141ab6
--- /dev/null
+++ b/app/packages/core/src/plugins/SchemaIO/hooks/useKey.tsx
@@ -0,0 +1,42 @@
+import { isNullish } from "@fiftyone/utilities";
+import { get } from "lodash";
+import { useCallback, useMemo } from "react";
+
+const userChangedPaths = new Set<string>();
+const pathsRefreshCount = new Map<string, number>();
+
+export function useKey(
+  path: string,
+  schema: { default: unknown },
+  data?: unknown,
+  useData?: boolean
+): [string, () => void] {
+  const value = useMemo(() => {
+    return useData ? data : data ?? get(schema, "default");
+  }, [useData, data, schema]);
+  const memoizedPath = useMemo(() => path, [path]);
+
+  const key = useMemo(() => {
+    let refreshCount: number = pathsRefreshCount.get(memoizedPath) || 0;
+    if (!isNullish(value) && !userChangedPaths.has(memoizedPath)) {
+      refreshCount++;
+      pathsRefreshCount.set(memoizedPath, refreshCount);
+    }
+    return `${memoizedPath}-${refreshCount}`;
+  }, [memoizedPath, value]);
+
+  const setUserChanged = useCallback(() => {
+    userChangedPaths.add(memoizedPath);
+  }, [memoizedPath]);
+
+  return [key, setUserChanged];
+}
+
+export function clearUseKeyStores() {
+  userChangedPaths.clear();
+  pathsRefreshCount.clear();
+}
+
+export function isPathUserChanged(path: string) {
+  return userChangedPaths.has(path);
+}
diff --git a/app/packages/core/src/plugins/SchemaIO/index.tsx b/app/packages/core/src/plugins/SchemaIO/index.tsx
index 2e5a184d43..888a633f21 100644
--- a/app/packages/core/src/plugins/SchemaIO/index.tsx
+++ b/app/packages/core/src/plugins/SchemaIO/index.tsx
@@ -1,24 +1,32 @@
-import React, { useEffect, useRef, useState } from "react";
-import DynamicIO from "./components/DynamicIO";
-import { set } from "lodash";
 import { PluginComponentType, registerComponent } from "@fiftyone/plugins";
+import { cloneDeep, set } from "lodash";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import DynamicIO from "./components/DynamicIO";
+import { clearUseKeyStores } from "./hooks";
 
 export function SchemaIOComponent(props) {
   const { onChange } = props;
   const [state, setState] = useState({});
   const autoFocused = useRef(false);
 
-  function onIOChange(path, value) {
-    setState((state) => {
-      const updatedState = structuredClone(state);
-      set(updatedState, path, structuredClone(value));
-      return updatedState;
-    });
-  }
+  useEffect(() => {
+    clearUseKeyStores();
+  }, []);
 
   useEffect(() => {
     if (onChange) onChange(state);
-  }, [state]);
+  }, [onChange, state]);
+
+  const onIOChange = useCallback(
+    (path, value) => {
+      setState((state) => {
+        const updatedState = cloneDeep(state);
+        set(updatedState, path, cloneDeep(value));
+        return updatedState;
+      });
+    },
+    [setState]
+  );
 
   return (
     <DynamicIO
diff --git a/app/packages/core/src/plugins/SchemaIO/utils/generate-schema.ts b/app/packages/core/src/plugins/SchemaIO/utils/generate-schema.ts
index 41b47199d6..93eff4a613 100644
--- a/app/packages/core/src/plugins/SchemaIO/utils/generate-schema.ts
+++ b/app/packages/core/src/plugins/SchemaIO/utils/generate-schema.ts
@@ -1,4 +1,7 @@
 // Auto generate SchemaIO compatible schema based on a value
+
+import { isPrimitiveType } from "@fiftyone/utilities";
+
 // todo: add support for OneOfView, TupleView, and MapView
 export function generateSchema(value, options?) {
   const type = getType(value);
@@ -16,7 +19,7 @@ export function generateSchema(value, options?) {
           readOnly: true,
         },
       };
-    } else if (primitives.includes(dominantType) && readOnly) {
+    } else if (isPrimitiveType(dominantType) && readOnly) {
       return {
         type,
         view: {
@@ -87,7 +90,7 @@ function getDominantType(array) {
     } else if (count > dominantTypeCount) {
       dominantType = type;
       dominantTypeCount = count;
-    } else if (count === dominantTypeCount && primitives.includes(type)) {
+    } else if (count === dominantTypeCount && isPrimitiveType(type)) {
       dominantType = type;
     }
   }
@@ -116,5 +119,3 @@ function getTableColumns(array) {
   const [firstItem] = array;
   return Object.keys(firstItem).map((key) => ({ key, label: key }));
 }
-
-const primitives = ["string", "number", "boolean"];
diff --git a/app/packages/utilities/src/type-check.ts b/app/packages/utilities/src/type-check.ts
index f49128db0e..5fee55ea31 100644
--- a/app/packages/utilities/src/type-check.ts
+++ b/app/packages/utilities/src/type-check.ts
@@ -5,3 +5,13 @@ export function isPrimitiveString(value: unknown) {
 export function isNullish(value) {
   return value === undefined || value === null;
 }
+
+export function isPrimitiveType(type: string) {
+  return PRIMITIVE_TYPES.includes(type);
+}
+
+export type NumberKeyObjectType<V = unknown> = {
+  [key: string]: V;
+};
+
+const PRIMITIVE_TYPES = ["string", "number", "boolean"];