@valbuild/core 0.102.0 → 0.105.0

package/dist/{index-30ecb49c.cjs.dev.js → index-730a5254.cjs.dev.js}

@@ -2,6 +2,46 @@
 
 var result = require('./result-bb1f436e.cjs.dev.js');
 
+function _arrayWithHoles(r) {
+  if (Array.isArray(r)) return r;
+}
+
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) {
+        if (Object(t) !== t) return;
+        f = !1;
+      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _slicedToArray(r, e) {
+  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || result._unsupportedIterableToArray(r, e) || _nonIterableRest();
+}
+
 function _arrayWithoutHoles(r) {
   if (Array.isArray(r)) return result._arrayLikeToArray(r);
 }
@@ -53,82 +93,69 @@ function _defineProperty(e, r, t) {
   }) : e[r] = t, e;
 }
 
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function (r) {
-      return Object.getOwnPropertyDescriptor(e, r).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
+function _classCallCheck(a, n) {
+  if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function");
 }
-function _objectSpread2(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
-      _defineProperty(e, r, t[r]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
-      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
-    });
+
+function _defineProperties(e, r) {
+  for (var t = 0; t < r.length; t++) {
+    var o = r[t];
+    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o);
   }
-  return e;
+}
+function _createClass(e, r, t) {
+  return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", {
+    writable: !1
+  }), e;
 }
 
-function _arrayWithHoles(r) {
-  if (Array.isArray(r)) return r;
+function _getPrototypeOf(t) {
+  return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) {
+    return t.__proto__ || Object.getPrototypeOf(t);
+  }, _getPrototypeOf(t);
 }
 
-function _iterableToArrayLimit(r, l) {
-  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
-  if (null != t) {
-    var e,
-      n,
-      i,
-      u,
-      a = [],
-      f = !0,
-      o = !1;
-    try {
-      if (i = (t = t.call(r)).next, 0 === l) {
-        if (Object(t) !== t) return;
-        f = !1;
-      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
-    } catch (r) {
-      o = !0, n = r;
-    } finally {
-      try {
-        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
-      } finally {
-        if (o) throw n;
-      }
-    }
-    return a;
-  }
+function _isNativeReflectConstruct() {
+  try {
+    var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
+  } catch (t) {}
+  return (_isNativeReflectConstruct = function () {
+    return !!t;
+  })();
 }
 
-function _nonIterableRest() {
-  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+function _assertThisInitialized(e) {
+  if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return e;
 }
 
-function _slicedToArray(r, e) {
-  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || result._unsupportedIterableToArray(r, e) || _nonIterableRest();
+function _possibleConstructorReturn(t, e) {
+  if (e && ("object" == typeof e || "function" == typeof e)) return e;
+  if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined");
+  return _assertThisInitialized(t);
 }
 
-function _classCallCheck(a, n) {
-  if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function");
+function _callSuper(t, o, e) {
+  return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e));
 }
 
-function _defineProperties(e, r) {
-  for (var t = 0; t < r.length; t++) {
-    var o = r[t];
-    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o);
-  }
+function _setPrototypeOf(t, e) {
+  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
+    return t.__proto__ = e, t;
+  }, _setPrototypeOf(t, e);
 }
-function _createClass(e, r, t) {
-  return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", {
+
+function _inherits(t, e) {
+  if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function");
+  t.prototype = Object.create(e && e.prototype, {
+    constructor: {
+      value: t,
+      writable: !0,
+      configurable: !0
+    }
+  }), Object.defineProperty(t, "prototype", {
     writable: !1
-  }), e;
+  }), e && _setPrototypeOf(t, e);
 }
 
 // import { RemoteCompatibleSource, RemoteSource } from "../source/remote";
@@ -255,55 +282,6 @@ var Schema = /*#__PURE__*/function () {
 
 // TODO: SourceError<"Could not determine type of Schema">
 
-function _getPrototypeOf(t) {
-  return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) {
-    return t.__proto__ || Object.getPrototypeOf(t);
-  }, _getPrototypeOf(t);
-}
-
-function _isNativeReflectConstruct() {
-  try {
-    var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
-  } catch (t) {}
-  return (_isNativeReflectConstruct = function () {
-    return !!t;
-  })();
-}
-
-function _assertThisInitialized(e) {
-  if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  return e;
-}
-
-function _possibleConstructorReturn(t, e) {
-  if (e && ("object" == typeof e || "function" == typeof e)) return e;
-  if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined");
-  return _assertThisInitialized(t);
-}
-
-function _callSuper(t, o, e) {
-  return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e));
-}
-
-function _setPrototypeOf(t, e) {
-  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
-    return t.__proto__ = e, t;
-  }, _setPrototypeOf(t, e);
-}
-
-function _inherits(t, e) {
-  if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function");
-  t.prototype = Object.create(e && e.prototype, {
-    constructor: {
-      value: t,
-      writable: !0,
-      configurable: !0
-    }
-  }), Object.defineProperty(t, "prototype", {
-    writable: !1
-  }), e && _setPrototypeOf(t, e);
-}
-
 // Identity symbols are registered in the global Symbol registry so that
 // multiple bundled copies of @valbuild/core (e.g. the editor SPA bundle vs.
 // the host Next.js bundle) resolve to the same Symbol instance. Without
@@ -345,73 +323,6 @@ function getSchema(selector) {
   return selector[GetSchema];
 }
 
-/* Branded extension types: file, remote, i18n  */
-var VAL_EXTENSION = "_type";
-
-/**
- * A phantom type parameter is one that doesn't show up at runtime, but is checked statically (and only) at compile time.
- *
- * An example where this is useful is remote types, where the type of the remote source is known at compile time,
- * but the value is not there before it is fetched.
- *
- * @example
- * type Example<T> = string & PhantomType<T>;
- *
- **/
-
-var FILE_REF_PROP = "_ref";
-var FILE_REF_SUBTYPE_TAG = "_tag"; // TODO: used earlier by c.rt.image, when we remove c.rt we can remove this
-
-/**
- * A file source represents the path to a (local) file.
- *
- * It will be resolved into a Asset object.
- *
- */
-
-var initFile = function initFile(config) {
-  var _config$files$directo, _config$files;
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  (_config$files$directo = config === null || config === void 0 || (_config$files = config.files) === null || _config$files === void 0 ? void 0 : _config$files.directory) !== null && _config$files$directo !== void 0 ? _config$files$directo : "/public/val";
-  function file(ref, metadata) {
-    return _defineProperty(_defineProperty(_defineProperty({}, FILE_REF_PROP, ref), VAL_EXTENSION, "file"), "metadata", metadata);
-  }
-  return file;
-};
-
-// type Directory =
-//   | (typeof config extends { files: { directory: infer D } } ? D : never)
-//   | `/public/val`;
-// console.log("path", config);
-// const userSpecifiedDirectory: Directory = config ?? "/public/val";
-
-// const directory = userSpecifiedDirectory;
-
-// export function file<Metadata extends { readonly [key: string]: Json }>(
-//   ref: `${typeof directory}/${string}`,
-//   metadata: Metadata
-// ): FileSource<Metadata>;
-// export function file(
-//   ref: `${typeof directory}/${string}`,
-//   metadata?: undefined
-// ): FileSource<undefined>;
-// export function file<
-//   Metadata extends { readonly [key: string]: Json } | undefined
-// >(
-//   ref: `${typeof directory}/${string}`,
-//   metadata?: Metadata
-// ): FileSource<Metadata> {
-//   return {
-//     [FILE_REF_PROP]: ref,
-//     [VAL_EXTENSION]: "file",
-//     metadata,
-//   } as FileSource<Metadata>;
-// }
-
-function isFile(obj) {
-  return _typeof(obj) === "object" && obj !== null && VAL_EXTENSION in obj && obj[VAL_EXTENSION] === "file" && FILE_REF_PROP in obj && typeof obj[FILE_REF_PROP] === "string";
-}
-
 function isVal(val) {
   return _typeof(val) === "object" && val !== null && val !== undefined && Path in val && "val" in val;
 }
@@ -438,290 +349,21 @@ function isVal(val) {
  */
 
 /**
- * The patchId of the parent patch, or "head" if there is no parent patch.
- */
-
-function getValPath(valOrSelector) {
-  return valOrSelector[Path];
-}
-
-var FileSchema = /*#__PURE__*/function (_Schema) {
-  function FileSchema(options) {
-    var _this;
-    var opt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-    var isRemote = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-    var customValidateFunctions = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
-    var moduleMetadata = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
-    var isReadonly = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
-    var isHidden = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-    var description = arguments.length > 7 ? arguments[7] : undefined;
-    _classCallCheck(this, FileSchema);
-    _this = _callSuper(this, FileSchema);
-    _this.options = options;
-    _this.opt = opt;
-    _this.isRemote = isRemote;
-    _this.customValidateFunctions = customValidateFunctions;
-    _this.moduleMetadata = moduleMetadata;
-    _this.isReadonly = isReadonly;
-    _this.isHidden = isHidden;
-    _this.description = description;
-    return _this;
-  }
-  _inherits(FileSchema, _Schema);
-  return _createClass(FileSchema, [{
-    key: "describe",
-    value: function describe(description) {
-      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined);
-    }
-  }, {
-    key: "remote",
-    value: function remote() {
-      return new FileSchema(this.options, this.opt, true, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
-    }
-  }, {
-    key: "validate",
-    value: function validate(validationFunction) {
-      return new FileSchema(this.options, this.opt, this.isRemote, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
-    }
-  }, {
-    key: "executeValidate",
-    value: function executeValidate(path, src) {
-      var customValidationErrors = this.executeCustomValidateFunctions(src, this.customValidateFunctions, {
-        path: path
-      });
-      if (this.opt && (src === null || src === undefined)) {
-        return customValidationErrors.length > 0 ? _defineProperty({}, path, customValidationErrors) : false;
-      }
-      if (src === null || src === undefined) {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Non-optional file was null or undefined.",
-          value: src
-        }]));
-      }
-      if (typeof src[FILE_REF_PROP] !== "string") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "File did not have a file reference string. Got: ".concat(_typeof(src[FILE_REF_PROP])),
-          value: src
-        }]));
-      }
-      if (this.isRemote && src[VAL_EXTENSION] !== "remote") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Expected a remote file, but got a local file.",
-          value: src,
-          fixes: ["file:upload-remote"]
-        }]));
-      }
-      if (this.isRemote && src[VAL_EXTENSION] === "remote") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Remote file was not checked.",
-          value: src,
-          fixes: ["file:check-remote"]
-        }]));
-      }
-      if (!this.isRemote && src[VAL_EXTENSION] === "remote") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Expected locale file, but found remote.",
-          value: src,
-          fixes: ["file:download-remote"]
-        }]));
-      }
-      if (src[VAL_EXTENSION] !== "file") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "File did not have the valid file extension type. Got: ".concat(src[VAL_EXTENSION]),
-          value: src
-        }]));
-      }
-      var _ref8 = this.options || {},
-        accept = _ref8.accept;
-      var _ref9 = src.metadata || {},
-        mimeType = _ref9.mimeType;
-      if (accept && mimeType && !mimeType.includes("/")) {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Invalid mime type format. Got: ".concat(mimeType),
-          value: src
-        }]));
-      }
-      if (accept && mimeType && mimeType.includes("/")) {
-        var acceptedTypes = accept.split(",").map(function (type) {
-          return type.trim();
-        });
-        var isValidMimeType = acceptedTypes.some(function (acceptedType) {
-          if (acceptedType === "*/*") {
-            return true;
-          }
-          if (acceptedType.endsWith("/*")) {
-            var baseType = acceptedType.slice(0, -2);
-            return mimeType.startsWith(baseType);
-          }
-          return acceptedType === mimeType;
-        });
-        if (!isValidMimeType) {
-          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-            message: "Mime type mismatch. Found '".concat(mimeType, "' but schema accepts '").concat(accept, "'"),
-            value: src
-          }]));
-        }
-      }
-      var fileMimeType = Internal.filenameToMimeType(src[FILE_REF_PROP]);
-      if (!fileMimeType) {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Could not determine mime type from file extension. Got: ".concat(src[FILE_REF_PROP]),
-          value: src
-        }]));
-      }
-      if (fileMimeType !== mimeType) {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Mime type and file extension not matching. Mime type is '".concat(mimeType, "' but file extension is '").concat(fileMimeType, "'"),
-          value: src
-        }]));
-      }
-      if (src.metadata) {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Found metadata, but it could not be validated. File metadata must be an object with the mimeType.",
-          // These validation errors will have to be picked up by logic outside of this package and revalidated. Reasons: 1) we have to read files to verify the metadata, which is handled differently in different runtimes (Browser, QuickJS, Node.js); 2) we want to keep this package dependency free.
-          value: src,
-          fixes: ["file:check-metadata"]
-        }]));
-      }
-      return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-        message: "Missing File metadata.",
-        value: src,
-        fixes: ["file:add-metadata"]
-      }]));
-    }
-  }, {
-    key: "executeAssert",
-    value: function executeAssert(path, src) {
-      if (this.opt && src === null) {
-        return {
-          success: true,
-          data: src
-        };
-      }
-      if (src === null) {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Expected 'object', got 'null'",
-            typeError: true
-          }])
-        };
-      }
-      if (_typeof(src) !== "object") {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Expected object, got '".concat(_typeof(src), "'"),
-            typeError: true
-          }])
-        };
-      }
-      if (!(FILE_REF_PROP in src)) {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Value of this schema must use: 'c.file' (error type: missing_ref_prop)",
-            typeError: true
-          }])
-        };
-      }
-      if (!(VAL_EXTENSION in src && src[VAL_EXTENSION] === "file")) {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Value of this schema must use: 'c.file' (error type: missing_file_extension)",
-            typeError: true
-          }])
-        };
-      }
-      return {
-        success: true,
-        data: src
-      };
-    }
-  }, {
-    key: "nullable",
-    value: function nullable() {
-      return new FileSchema(this.options, true, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
-    }
-  }, {
-    key: "readonly",
-    value: function readonly() {
-      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, true, this.isHidden, this.description);
-    }
-  }, {
-    key: "hidden",
-    value: function hidden() {
-      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, true, this.description);
-    }
-  }, {
-    key: "executeCustomValidateAt",
-    value: function executeCustomValidateAt(path, src) {
-      return this.executeCustomValidateFunctions(src, this.customValidateFunctions, {
-        path: path
-      });
-    }
-  }, {
-    key: "executeSerialize",
-    value: function executeSerialize() {
-      var _this$customValidateF;
-      var modulePaths = this.moduleMetadata ? Object.keys(this.moduleMetadata) : [];
-      return {
-        type: "file",
-        options: this.options,
-        opt: this.opt,
-        remote: this.isRemote,
-        customValidate: this.customValidateFunctions && ((_this$customValidateF = this.customValidateFunctions) === null || _this$customValidateF === void 0 ? void 0 : _this$customValidateF.length) > 0,
-        referencedModule: modulePaths.length > 0 ? modulePaths[0] : undefined,
-        readonly: this.isReadonly,
-        hidden: this.isHidden,
-        description: this.description
-      };
-    }
-  }, {
-    key: "executeRender",
-    value: function executeRender() {
-      return {};
-    }
-  }]);
-}(Schema);
-var file = function file(options) {
-  var isModule = !!options && !!Internal.getValPath(options);
-  if (isModule) {
-    var allModules = {};
-    for (var _i = 0, _arr = [options]; _i < _arr.length; _i++) {
-      var valModule = _arr[_i];
-      var modulePath = getValPath(valModule);
-      if (modulePath === undefined) {
-        throw new Error("Invalid argument passed to s.file(). Expected a ValModule constructed through c.define, but got an object without a valid module path.");
-      }
-      allModules[modulePath] = getSource(valModule);
-    }
-    return new FileSchema({}, false, false, [], allModules);
-  }
-  return new FileSchema(options);
-};
-function convertFileSource(src) {
-  // TODO: /public should be configurable
-  if (!src[FILE_REF_PROP].startsWith("/public")) {
-    return {
-      url: src[FILE_REF_PROP] + (src.patch_id ? "?patch_id=".concat(src["patch_id"]) : ""),
-      metadata: src.metadata
-    };
-  }
-  if (src.patch_id) {
-    return {
-      url: "/api/val/files" + src[FILE_REF_PROP] + "?patch_id=".concat(src["patch_id"]),
-      metadata: src.metadata
-    };
-  }
-  return {
-    url: src[FILE_REF_PROP].slice("/public".length),
-    metadata: src.metadata
-  };
+ * The patchId of the parent patch, or "head" if there is no parent patch.
+ */
+
+function getValPath(valOrSelector) {
+  return valOrSelector[Path];
 }
 
-function createValPathOfItem(arrayPath, prop) {
+function createValPathOfItem(
+/**
+ * `ModuleFilePath` is accepted because the no-separator branch below is
+ * exactly that case: a path with no `?p=` yet gets one, and the key becomes
+ * the first module-path segment. Callers walking a module from its root had
+ * to widen the type themselves, and hand-rolled the concatenation instead.
+ */
+arrayPath, prop) {
   if (_typeof(prop) === "symbol") {
     throw Error("Cannot create val path of array item with symbol prop: ".concat(prop.toString()));
   }
@@ -748,6 +390,28 @@ function unsafeCreateSourcePath(path, itemKey) {
   return "".concat(path).concat(Internal.ModuleFilePathSep).concat(JSON.stringify(itemKey));
 }
 
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread2(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
+
 var StringSchema = /*#__PURE__*/function (_Schema) {
   function StringSchema(options) {
     var _this;
@@ -919,10 +583,10 @@ var StringSchema = /*#__PURE__*/function (_Schema) {
   }, {
     key: "executeSerialize",
     value: function executeSerialize() {
-      var _this$options4, _this$options5, _this$options6, _this$customValidateF, _this$customValidateF2;
+      var _this$renderInput, _this$options4, _this$options5, _this$options6, _this$customValidateF, _this$customValidateF2;
       return {
         type: "string",
-        render: this.renderInput ? true : undefined,
+        render: (_this$renderInput = this.renderInput) !== null && _this$renderInput !== void 0 ? _this$renderInput : undefined,
         options: {
           maxLength: (_this$options4 = this.options) === null || _this$options4 === void 0 ? void 0 : _this$options4.maxLength,
           minLength: (_this$options5 = this.options) === null || _this$options5 === void 0 ? void 0 : _this$options5.minLength,
@@ -941,36 +605,28 @@ var StringSchema = /*#__PURE__*/function (_Schema) {
         description: this.description
       };
     }
+
+    /**
+     * How this field is laid out in the editor: a textarea, or a code editor for
+     * the given language.
+     *
+     * Static configuration, not a callback — see `render.ts`. What a CONTAINER
+     * shows for its items is a `preview`, which is a different thing entirely.
+     */
   }, {
     key: "render",
     value: function render(input) {
       return new StringSchema(this.options, this.opt, this.isRaw, this.customValidateFunctions, input, this.isReadonly, this.isHidden, this.description);
     }
+
+    /**
+     * Nothing: a string has no items, so there is nothing to preview. Its layout
+     * is a `render`, which travels in the serialized schema instead of through
+     * this pipeline.
+     */
   }, {
-    key: "executeRender",
-    value: function executeRender(sourcePath, src,
-    // Accepted and unused: a string's render is a static layout hint
-    // (`{as:"textarea"}` / `{as:"code",language}`) with no closure behind it, so
-    // there is nothing a scope could prune. Declared so the signature is uniform
-    // across every schema rather than something a reader has to check.
-    _scope) {
-      if (this.renderInput) {
-        if (this.renderInput.as === "code") {
-          return _defineProperty({}, sourcePath, {
-            status: "success",
-            data: {
-              layout: this.renderInput.as,
-              language: this.renderInput.language
-            }
-          });
-        }
-        return _defineProperty({}, sourcePath, {
-          status: "success",
-          data: {
-            layout: this.renderInput.as
-          }
-        });
-      }
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -1165,8 +821,8 @@ var ObjectSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender(sourcePath, src, scope) {
+    key: "executePreview",
+    value: function executePreview(sourcePath, src, scope) {
       var res = {};
       if (src === null) {
         return res;
@@ -1177,13 +833,13 @@ var ObjectSchema = /*#__PURE__*/function (_Schema) {
           continue;
         }
         var subPath = unsafeCreateSourcePath(sourcePath, _key3);
-        // An object produces no render of its own, so it is pure recursion — and
+        // An object produces no preview of its own, so it is pure recursion — and
         // pruning it is the whole contribution: a field deep in one branch stops
-        // paying for every sibling branch's renders.
+        // paying for every sibling branch's previews.
         if (scope !== undefined && !scope.wantsUnder(subPath)) {
           continue;
         }
-        var itemResult = this.items[_key3]["executeRender"](subPath, itemSrc, scope);
+        var itemResult = this.items[_key3]["executePreview"](subPath, itemSrc, scope);
         for (var keyS in itemResult) {
           var _key4 = keyS;
           res[_key4] = itemResult[_key4];
@@ -1210,7 +866,7 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
     var isReadonly = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
     var isHidden = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
     var description = arguments.length > 5 ? arguments[5] : undefined;
-    var renderInput = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : null;
+    var previewInput = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : null;
     _classCallCheck(this, ArraySchema);
     _this = _callSuper(this, ArraySchema);
     _this.item = item;
@@ -1219,19 +875,19 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
     _this.isReadonly = isReadonly;
     _this.isHidden = isHidden;
     _this.description = description;
-    _this.renderInput = renderInput;
+    _this.previewInput = previewInput;
     return _this;
   }
   _inherits(ArraySchema, _Schema);
   return _createClass(ArraySchema, [{
     key: "describe",
     value: function describe(description) {
-      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined, this.renderInput);
+      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined, this.previewInput);
     }
   }, {
     key: "validate",
     value: function validate(validationFunction) {
-      return new ArraySchema(this.item, this.opt, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.isReadonly, this.isHidden, this.description, this.renderInput);
+      return new ArraySchema(this.item, this.opt, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.isReadonly, this.isHidden, this.description, this.previewInput);
     }
   }, {
     key: "executeValidate",
@@ -1298,17 +954,17 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
   }, {
     key: "nullable",
     value: function nullable() {
-      return new ArraySchema(this.item, true, [], this.isReadonly, this.isHidden, this.description, this.renderInput);
+      return new ArraySchema(this.item, true, [], this.isReadonly, this.isHidden, this.description, this.previewInput);
     }
   }, {
     key: "readonly",
     value: function readonly() {
-      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, true, this.isHidden, this.description, this.renderInput);
+      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, true, this.isHidden, this.description, this.previewInput);
     }
   }, {
     key: "hidden",
     value: function hidden() {
-      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, true, this.description, this.renderInput);
+      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, true, this.description, this.previewInput);
     }
   }, {
     key: "executeCustomValidateAt",
@@ -1325,7 +981,7 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
         type: "array",
         item: this.item["executeSerialize"](),
         opt: this.opt,
-        render: this.renderInput ? true : undefined,
+        preview: this.previewInput ? true : undefined,
         customValidate: this.customValidateFunctions && ((_this$customValidateF = this.customValidateFunctions) === null || _this$customValidateF === void 0 ? void 0 : _this$customValidateF.length) > 0,
         readonly: this.isReadonly,
         hidden: this.isHidden,
@@ -1333,8 +989,8 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender(sourcePath, src, scope) {
+    key: "executePreview",
+    value: function executePreview(sourcePath, src, scope) {
       var res = {};
       if (src === null) {
         return res;
@@ -1349,26 +1005,18 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
         if (scope !== undefined && !scope.wantsUnder(subPath)) {
           continue;
         }
-        var itemResult = this.item["executeRender"](subPath, itemSrc, scope);
+        var itemResult = this.item["executePreview"](subPath, itemSrc, scope);
         for (var keyS in itemResult) {
           var _key = keyS;
           res[_key] = itemResult[_key];
         }
       }
-      if (this.renderInput) {
-        var _this$renderInput = this.renderInput,
-          select = _this$renderInput.select,
-          layout = _this$renderInput.as;
-        if (layout !== "list") {
-          res[sourcePath] = {
-            status: "error",
-            message: "Unknown layout type: " + layout
-          };
-        }
+      if (this.previewInput) {
+        var select = this.previewInput;
         // The whole list when the LIST is what is being shown; only the wanted
-        // rows when it is not. `select` is the user's closure and the real expense
-        // — a list view asks for the container and gets every row, a single field
-        // asks for its own path and costs one call.
+        // rows when it is not. The user's closure is the real expense — a list
+        // view asks for the container and gets every row, a single field asks for
+        // its own path and costs one call.
         // Non-null once, as a value, rather than a boolean the compiler cannot
         // tie back to `scope`: no scope and a scope that wants this exact path
         // both mean the whole list, and anything else is a window.
@@ -1378,10 +1026,10 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
           if (window !== null && !window.wantsUnder(unsafeCreateSourcePath(sourcePath, index))) {
             continue;
           }
-          // Per ITEM, not per list, matching what `record` already does: `select`
-          // is user code, and one row whose data trips it up must not take out the
-          // whole list. Before scoping, one throwing row produced an error at the
-          // container and no items at all.
+          // Per ITEM, not per list, matching what `record` already does: the
+          // closure is user code, and one row whose data trips it up must not take
+          // out the whole list. Before scoping, one throwing row produced an error
+          // at the container and no items at all.
           try {
             // NB NB: display is actually defined by the user
             var _select = select({
@@ -1405,7 +1053,6 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
         res[sourcePath] = {
           status: "success",
           data: {
-            layout: "list",
             parent: "array",
             items: items
           }
@@ -1413,10 +1060,18 @@ var ArraySchema = /*#__PURE__*/function (_Schema) {
       }
       return res;
     }
+
+    /**
+     * What the editor shows for each ITEM of this array: a title, and optionally a
+     * subtitle and an image.
+     *
+     * `select` is your own code over the item's source, so it is run on demand for
+     * the rows that are actually being looked at — see `PreviewScope`.
+     */
   }, {
-    key: "render",
-    value: function render(input) {
-      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, this.isHidden, this.description, input);
+    key: "preview",
+    value: function preview(select) {
+      return new ArraySchema(this.item, this.opt, this.customValidateFunctions, this.isReadonly, this.isHidden, this.description, select);
     }
   }]);
 }(Schema);
@@ -1548,8 +1203,8 @@ var LiteralSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -1982,8 +1637,8 @@ var UnionSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender(sourcePath, src, scope) {
+    key: "executePreview",
+    value: function executePreview(sourcePath, src, scope) {
       var res = {};
       if (src === null) {
         return res;
@@ -2005,7 +1660,7 @@ var UnionSchema = /*#__PURE__*/function (_Schema) {
           return false;
         });
         if (thisSchema) {
-          var itemResult = thisSchema["executeRender"](sourcePath, src, scope);
+          var itemResult = thisSchema["executePreview"](sourcePath, src, scope);
           for (var keyS in itemResult) {
             var _key3 = keyS;
             res[_key3] = itemResult[_key3];
@@ -2032,6 +1687,170 @@ var union = function union(key) {
   return new UnionSchema(key, objects);
 };
 
+var RegEx = /^(https?:\/\/[^/]+)\/file\/p\/([^/]+)\/b\/([^/]+)\/v\/([^/]+)\/h\/([^/]+)\/f\/([^/]+)\/p\/(.+)$/;
+function splitRemoteRef(ref) {
+  if (ref[0] === "/") {
+    return {
+      status: "error",
+      error: "Not a remote ref: " + ref
+    };
+  }
+  var match = ref.match(RegEx);
+  if (!match) {
+    return {
+      status: "error",
+      error: "Invalid remote ref: " + ref
+    };
+  }
+  if (match[7].indexOf("public/") !== 0) {
+    return {
+      status: "error",
+      error: "Invalid remote ref: " + ref
+    };
+  }
+  if (match[7].split("/").some(function (segment) {
+    return segment === "." || segment === "..";
+  })) {
+    return {
+      status: "error",
+      error: "Invalid remote ref: " + ref
+    };
+  }
+  return {
+    status: "success",
+    remoteHost: match[1],
+    projectId: match[2],
+    bucket: match[3],
+    version: match[4],
+    validationHash: match[5],
+    fileHash: match[6],
+    filePath: match[7]
+  };
+}
+
+/** What must stay in frame when a page crops an image. */
+
+/**
+ * The authored fields of a gallery-backed image (`s.image(galleryModule)`):
+ * `width`/`height`/`mimeType` live in the gallery, so they are not repeated
+ * here. One place per fact.
+ */
+
+/**
+ * The structural supertype of every media source.
+ *
+ * It is a named member of the `Source` / `SelectorSource` unions rather than
+ * "just an object" because `SourceObject` is `{[key: string]: Source}` and
+ * `Source` excludes `undefined` — an object with optional properties does not
+ * satisfy it.
+ */
+
+/** A path is remote unless it is under `/public`. */
+function isRemoteMediaPath(path) {
+  return !path.startsWith("/public");
+}
+
+/**
+ * Where the bytes of a media source are actually served from.
+ *
+ * Two states, and conflating them is the recurring bug: uncommitted bytes live
+ * in the patch directory and are served by the API with the `patch_id` that put
+ * them there; committed bytes live at the path itself, with `/public` stripped.
+ */
+function mediaUrl(src) {
+  var path = src.path;
+  // TODO: /public should be configurable
+  if (!isRemoteMediaPath(path)) {
+    if (src.patch_id) {
+      return "/api/val/files".concat(path, "?patch_id=").concat(src.patch_id);
+    }
+    return path.slice("/public".length);
+  }
+  if (src.patch_id) {
+    var splitRemoteRefRes = splitRemoteRef(path);
+    if (splitRemoteRefRes.status === "success") {
+      return "/api/val/files/".concat(splitRemoteRefRes.filePath, "?patch_id=").concat(src.patch_id, "&remote=true&ref=").concat(encodeURIComponent(path));
+    }
+    // Not a remote ref either — an absolute path outside /public. Serve it as
+    // written, but keep the patch id so a draft still resolves.
+    return "".concat(path, "?patch_id=").concat(src.patch_id);
+  }
+  return path;
+}
+
+/**
+ * A media source plus the URL its bytes are served from.
+ *
+ * `url` is the only generated field: everything else the consumer sees was
+ * either authored or filled in from the gallery.
+ */
+function resolveMedia(src) {
+  return _objectSpread2(_objectSpread2({}, src), {}, {
+    url: mediaUrl(src)
+  });
+}
+function isMediaSchema(schema) {
+  return _typeof(schema) === "object" && schema !== null && "type" in schema && (schema.type === "image" || schema.type === "file");
+}
+
+/**
+ * Fill in what a gallery-backed field does not carry itself.
+ *
+ * `s.image(galleryModule)` stores only `{path, alt?, hotspot?}` — the
+ * dimensions and mime type live in the gallery module, keyed by path. This is
+ * the single implementation of that lookup; core, stega/RSC and the Studio all
+ * call it rather than each rolling their own.
+ *
+ * `alt` is filled in too, because a gallery holds the alt text an editor typed
+ * once for a file used in several places — but only when the field does not
+ * have its own, so a per-image override wins. A gallery whose `alt` schema is a
+ * locale record holds an object rather than a string; that is left alone rather
+ * than copied into a field typed `string`, and making the override
+ * locale-shaped is a separate change.
+ *
+ * The double lookup is load-bearing: a remote gallery keys its entries by the
+ * remote URL while the file itself stays on disk under its local path.
+ */
+function fillFromGallery(src, schema, getModuleSource) {
+  if (!isMediaSchema(schema) || !schema.referencedModule) {
+    return src;
+  }
+  var moduleSource = getModuleSource(schema.referencedModule);
+  if (!moduleSource || _typeof(moduleSource) !== "object" || Array.isArray(moduleSource)) {
+    return src;
+  }
+  var entries = moduleSource;
+  var key = src.path in entries ? src.path : null;
+  if (key === null) {
+    var splitRemoteRefRes = splitRemoteRef(src.path);
+    if (splitRemoteRefRes.status === "success" && splitRemoteRefRes.filePath in entries) {
+      key = splitRemoteRefRes.filePath;
+    }
+  }
+  if (key === null) {
+    return src;
+  }
+  var entry = entries[key];
+  if (!entry || _typeof(entry) !== "object" || Array.isArray(entry)) {
+    return src;
+  }
+  var _ref = entry,
+    width = _ref.width,
+    height = _ref.height,
+    mimeType = _ref.mimeType,
+    alt = _ref.alt;
+  var hasOwnAlt = typeof src.alt === "string";
+  return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, src), width !== undefined ? {
+    width: width
+  } : {}), height !== undefined ? {
+    height: height
+  } : {}), mimeType !== undefined ? {
+    mimeType: mimeType
+  } : {}), !hasOwnAlt && typeof alt === "string" ? {
+    alt: alt
+  } : {});
+}
+
 var ImageSchema = /*#__PURE__*/function (_Schema) {
   function ImageSchema(options) {
     var _this;
@@ -2073,7 +1892,7 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
   }, {
     key: "executeValidate",
     value: function executeValidate(path, src) {
-      var _src$metadata$mimeTyp, _src$metadata;
+      var _src$mimeType;
       var customValidationErrors = this.executeCustomValidateFunctions(src, this.customValidateFunctions, {
         path: path
       });
@@ -2086,42 +1905,68 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
           value: src
         }]));
       }
-      if (this.isRemote && src[VAL_EXTENSION] !== "remote") {
+      if (typeof src.path !== "string") {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Image did not have a path string. Got: ".concat(_typeof(src.path)),
+          value: src
+        }]));
+      }
+      // Remote-ness is a property of the path, not of a marker on the value:
+      // anything outside /public is remote.
+      var isRemotePath = isRemoteMediaPath(src.path);
+      if (this.isRemote && !isRemotePath) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
           message: "Expected a remote image, but got a local image.",
           value: src,
           fixes: ["image:upload-remote"]
         }]));
       }
-      if (this.isRemote && src[VAL_EXTENSION] === "remote") {
+      if (this.isRemote && isRemotePath) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
           message: "Remote image was not checked.",
           value: src,
           fixes: ["image:check-remote"]
         }]));
       }
-      if (!this.isRemote && src[VAL_EXTENSION] === "remote") {
+      if (!this.isRemote && isRemotePath) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Expected locale image, but found remote.",
+          message: "Expected local image, but found remote.",
           value: src,
           fixes: ["image:download-remote"]
         }]));
       }
-      if (typeof src[FILE_REF_PROP] !== "string") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Image did not have a file reference string. Got: ".concat(_typeof(src[FILE_REF_PROP])),
-          value: src
-        }]));
+      if (src.hotspot !== undefined) {
+        if (_typeof(src.hotspot) !== "object" || src.hotspot === null || typeof src.hotspot.x !== "number" || typeof src.hotspot.y !== "number") {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "Hotspot must be an object with x and y as numbers.",
+            value: src
+          }]));
+        }
       }
-      if (src[VAL_EXTENSION] !== "file") {
-        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Image did not have the valid file extension type. Got: ".concat(src[VAL_EXTENSION]),
-          value: src
-        }]));
+      var galleryEntries = this.galleryEntries();
+      if (galleryEntries) {
+        // The dimensions and mime type of a gallery image are stored once, in the
+        // gallery. Repeating them on the field is how the two get to disagree.
+        var repeated = ["width", "height", "mimeType"].filter(function (key) {
+          return src[key] !== undefined;
+        });
+        if (repeated.length > 0) {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "An image from a gallery must not carry its own ".concat(repeated.join(", "), ": ").concat(repeated.length === 1 ? "it is" : "they are", " stored in the gallery module."),
+            value: src
+          }]));
+        }
+        if (!(src.path in galleryEntries)) {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "The gallery does not have an image at '".concat(src.path, "'."),
+            value: src
+          }]));
+        }
+        return customValidationErrors.length > 0 ? _defineProperty({}, path, customValidationErrors) : false;
       }
-      var _ref8 = this.options || {},
-        accept = _ref8.accept;
-      var mimeType = (_src$metadata$mimeTyp = (_src$metadata = src.metadata) === null || _src$metadata === void 0 ? void 0 : _src$metadata.mimeType) !== null && _src$metadata$mimeTyp !== void 0 ? _src$metadata$mimeTyp : "";
+      var _ref1 = this.options || {},
+        accept = _ref1.accept;
+      var mimeType = (_src$mimeType = src.mimeType) !== null && _src$mimeType !== void 0 ? _src$mimeType : "";
       if (accept && mimeType && !mimeType.includes("/")) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
           message: "Invalid mime type format. Got: '".concat(mimeType, "'"),
@@ -2151,10 +1996,10 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
           }]));
         }
       }
-      var fileMimeType = Internal.filenameToMimeType(src[FILE_REF_PROP]);
+      var fileMimeType = Internal.filenameToMimeType(src.path);
       if (!fileMimeType) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Could not determine mime type from file extension. Got: ".concat(src[FILE_REF_PROP]),
+          message: "Could not determine mime type from file extension. Got: ".concat(src.path),
           value: src,
           fixes: ["image:check-metadata"]
         }]));
@@ -2166,35 +2011,37 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
           fixes: ["image:check-metadata"]
         }]));
       }
-      if (src.metadata) {
-        if (src.metadata.hotspot) {
-          if (_typeof(src.metadata.hotspot) !== "object" || typeof src.metadata.hotspot.x !== "number" || typeof src.metadata.hotspot.y !== "number") {
-            return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-              message: "Hotspot must be an object with x and y as numbers.",
-              value: src
-            }]));
-          }
-        }
+
+      // Whether the dimensions match the bytes can only be answered by reading
+      // the file, which this package deliberately cannot do — so it is always
+      // handed on as a fix.
+      if (src.width !== undefined || src.height !== undefined || src.mimeType !== undefined) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Found metadata, but it could not be validated. Image metadata must be an object with the required props: width (positive number), height (positive number) and the mime type.",
-          // These validation errors will have to be picked up by logic outside of this package and revalidated. Reasons: 1) we have to read files to verify the metadata, which is handled differently in different runtimes (Browser, QuickJS, Node.js); 2) we want to keep this package dependency free.
+          message: "Found image metadata, but it could not be validated. An image must have a width (positive number), a height (positive number) and a mime type.",
           value: src,
           fixes: ["image:check-metadata"]
         }]));
       }
-      var isReferencedModule = Object.keys(this.moduleMetadata).length > 0;
-      if (src.metadata === undefined && isReferencedModule) {
-        if (customValidationErrors.length === 0) {
-          return false;
-        }
-        return _defineProperty({}, path, _toConsumableArray(customValidationErrors));
-      }
       return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
         message: "Could not validate Image metadata.",
         value: src,
         fixes: ["image:add-metadata"]
       }]));
     }
+
+    /**
+     * The entries of the gallery this field points at, or null when it is a
+     * standalone field.
+     */
+  }, {
+    key: "galleryEntries",
+    value: function galleryEntries() {
+      var modulePaths = Object.keys(this.moduleMetadata);
+      if (modulePaths.length === 0) {
+        return null;
+      }
+      return this.moduleMetadata[modulePaths[0]];
+    }
   }, {
     key: "executeAssert",
     value: function executeAssert(path, src) {
@@ -2222,20 +2069,11 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
           }])
         };
       }
-      if (!(FILE_REF_PROP in src)) {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Value of this schema must use: 'c.image' (error type: missing_ref_prop)",
-            typeError: true
-          }])
-        };
-      }
-      if (!(VAL_EXTENSION in src && src[VAL_EXTENSION] === "file")) {
+      if (!("path" in src) || typeof src.path !== "string") {
         return {
           success: false,
           errors: _defineProperty({}, path, [{
-            message: "Value of this schema must use: 'c.image' (error type: missing_file_extension)",
+            message: "An image must be an object with a 'path' (error type: missing_path)",
             typeError: true
           }])
         };
@@ -2285,13 +2123,21 @@ var ImageSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
 }(Schema);
-var image = function image(options) {
+
+/**
+ * An image picked from a gallery. Its dimensions and mime type live in the
+ * gallery, so the field carries only what a person typed.
+ */
+
+/** An image of its own, carrying its own dimensions and mime type. */
+
+function image(options) {
   var isModule = !!options && !!Internal.getValPath(options);
   if (isModule) {
     var allModules = {};
@@ -2306,7 +2152,7 @@ var image = function image(options) {
     return new ImageSchema({}, false, false, [], allModules);
   }
   return new ImageSchema(options);
-};
+}
 
 var RouteSchema = /*#__PURE__*/function (_Schema) {
   function RouteSchema(options) {
@@ -2474,8 +2320,8 @@ var RouteSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -3033,8 +2879,8 @@ var RichTextSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -3179,6 +3025,20 @@ function _asyncToGenerator(n) {
   };
 }
 
+/* Branded extension types: file, remote, i18n  */
+var VAL_EXTENSION = "_type";
+
+/**
+ * A phantom type parameter is one that doesn't show up at runtime, but is checked statically (and only) at compile time.
+ *
+ * An example where this is useful is remote types, where the type of the remote source is known at compile time,
+ * but the value is not there before it is fetched.
+ *
+ * @example
+ * type Example<T> = string & PhantomType<T>;
+ *
+ **/
+
 /**
  * The string used as the `_type` discriminator of a {@link JsonSource}.
  */
@@ -3327,47 +3187,6 @@ function _resolveJsonValues() {
   return _resolveJsonValues.apply(this, arguments);
 }
 
-var RegEx = /^(https?:\/\/[^/]+)\/file\/p\/([^/]+)\/b\/([^/]+)\/v\/([^/]+)\/h\/([^/]+)\/f\/([^/]+)\/p\/(.+)$/;
-function splitRemoteRef(ref) {
-  if (ref[0] === "/") {
-    return {
-      status: "error",
-      error: "Not a remote ref: " + ref
-    };
-  }
-  var match = ref.match(RegEx);
-  if (!match) {
-    return {
-      status: "error",
-      error: "Invalid remote ref: " + ref
-    };
-  }
-  if (match[7].indexOf("public/") !== 0) {
-    return {
-      status: "error",
-      error: "Invalid remote ref: " + ref
-    };
-  }
-  if (match[7].split("/").some(function (segment) {
-    return segment === "." || segment === "..";
-  })) {
-    return {
-      status: "error",
-      error: "Invalid remote ref: " + ref
-    };
-  }
-  return {
-    status: "success",
-    remoteHost: match[1],
-    projectId: match[2],
-    bucket: match[3],
-    version: match[4],
-    validationHash: match[5],
-    fileHash: match[6],
-    filePath: match[7]
-  };
-}
-
 /**
  * The source type of a `.jsonValues()` record: every entry value is EITHER a
  * lazily loaded {@link JsonSource} whose resolved content is the (loosened, see
@@ -3394,7 +3213,7 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
     var isHidden = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
     var description = arguments.length > 8 ? arguments[8] : undefined;
     var isJsonValues = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
-    var renderInput = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : null;
+    var previewInput = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : null;
     _classCallCheck(this, RecordSchema);
     _this = _callSuper(this, RecordSchema);
     _this.item = item;
@@ -3407,19 +3226,19 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
     _this.isHidden = isHidden;
     _this.description = description;
     _this.isJsonValues = isJsonValues;
-    _this.renderInput = renderInput;
+    _this.previewInput = previewInput;
     return _this;
   }
   _inherits(RecordSchema, _Schema);
   return _createClass(RecordSchema, [{
     key: "describe",
     value: function describe(description) {
-      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "validate",
     value: function validate(validationFunction) {
-      return new RecordSchema(this.item, this.opt, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, this.opt, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "executeValidate",
@@ -3778,29 +3597,29 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
   }, {
     key: "nullable",
     value: function nullable() {
-      return new RecordSchema(this.item, true, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, true, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "readonly",
     value: function readonly() {
-      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, true, this.isHidden, this.description, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, true, this.isHidden, this.description, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "hidden",
     value: function hidden() {
-      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, true, this.description, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, true, this.description, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "router",
     value: function router(_router) {
-      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, _router, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.renderInput);
+      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, _router, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.previewInput);
     }
   }, {
     key: "remote",
     value: function remote() {
       return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions ? _objectSpread2(_objectSpread2({}, this.mediaOptions), {}, {
         remote: true
-      }) : undefined, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.renderInput);
+      }) : undefined, this.isReadonly, this.isHidden, this.description, this.isJsonValues, this.previewInput);
     }
 
     /**
@@ -3832,7 +3651,7 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
       }
       return new RecordSchema(this.item, this.opt,
       // Empty by construction: the guard above rejects any that were registered.
-      [], this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, true, this.renderInput);
+      [], this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, true, this.previewInput);
     }
   }, {
     key: "getRouterValidations",
@@ -3892,7 +3711,7 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
         item: this.item["executeSerialize"](),
         key: (_this$keySchema = this.keySchema) === null || _this$keySchema === void 0 ? void 0 : _this$keySchema["executeSerialize"](),
         opt: this.opt,
-        render: this.renderInput ? true : undefined,
+        preview: this.previewInput ? true : undefined,
         router: (_this$currentRouter = this.currentRouter) === null || _this$currentRouter === void 0 ? void 0 : _this$currentRouter.getRouterId(),
         customValidate: this.customValidateFunctions && ((_this$customValidateF = this.customValidateFunctions) === null || _this$customValidateF === void 0 ? void 0 : _this$customValidateF.length) > 0,
         jsonValues: this.isJsonValues ? true : undefined,
@@ -3924,8 +3743,8 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
       return this.item["executeValidate"](path, content);
     }
   }, {
-    key: "executeRender",
-    value: function executeRender(sourcePath, src, scope) {
+    key: "executePreview",
+    value: function executePreview(sourcePath, src, scope) {
       var res = {};
       if (src === null) {
         return res;
@@ -3937,31 +3756,23 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
         }
         if (isJson(itemSrc)) {
           // An un-loaded `.jsonValues()` entry: an opaque marker, not the item this
-          // schema describes. Skipping it is what makes rendering a partially
+          // schema describes. Skipping it is what makes previewing a partially
           // loaded record work — the result comes out covering exactly the loaded
-          // keys, and the caller renders a placeholder for the rest.
+          // keys, and the caller shows a placeholder for the rest.
           continue;
         }
         var subPath = unsafeCreateSourcePath(sourcePath, _key);
         if (scope !== undefined && !scope.wantsUnder(subPath)) {
           continue;
         }
-        var itemResult = this.item["executeRender"](subPath, itemSrc, scope);
+        var itemResult = this.item["executePreview"](subPath, itemSrc, scope);
         for (var keyS in itemResult) {
           var _key2 = keyS;
           res[_key2] = itemResult[_key2];
         }
       }
-      if (this.renderInput) {
-        var _this$renderInput = this.renderInput,
-          prepare = _this$renderInput.select,
-          layout = _this$renderInput.layout;
-        if (layout !== "list") {
-          res[sourcePath] = {
-            status: "error",
-            message: "Unknown layout type: " + layout
-          };
-        }
+      if (this.previewInput) {
+        var prepare = this.previewInput;
         // See the same block in `array`: the whole record when the record is what
         // is being shown, only the wanted entries when it is not.
         var window = scope !== undefined && !scope.wants(sourcePath) ? scope : null;
@@ -3976,7 +3787,7 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
           if (window !== null && !window.wantsUnder(unsafeCreateSourcePath(sourcePath, _key3))) {
             continue;
           }
-          // Per KEY, not per record: `select` is user code, and one entry whose
+          // Per KEY, not per record: the closure is user code, and one entry whose
           // data trips it up must not take out the whole list.
           try {
             // NB NB: display is actually defined by the user
@@ -4002,7 +3813,6 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
         res[sourcePath] = {
           status: "success",
           data: {
-            layout: "list",
             parent: "record",
             items: items
           }
@@ -4010,13 +3820,19 @@ var RecordSchema = /*#__PURE__*/function (_Schema) {
       }
       return res;
     }
-  }, {
-    key: "render",
-    value: function render(input) {
-      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, {
-        layout: input.as,
-        select: input.select
-      });
+
+    /**
+     * What the editor shows for each ENTRY of this record: a title, and optionally
+     * a subtitle and an image.
+     *
+     * `select` is your own code over the entry's key and source, so it is run on
+     * demand for the entries that are actually being looked at — see
+     * `PreviewScope`.
+     */
+  }, {
+    key: "preview",
+    value: function preview(select) {
+      return new RecordSchema(this.item, this.opt, this.customValidateFunctions, this.currentRouter, this.keySchema, this.mediaOptions, this.isReadonly, this.isHidden, this.description, this.isJsonValues, select);
     }
   }]);
 }(Schema);
@@ -4709,8 +4525,8 @@ var NumberSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -4829,8 +4645,8 @@ var BooleanSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -4883,48 +4699,378 @@ var KeyOfSchema = /*#__PURE__*/function (_Schema) {
           message: "Schema not found for module. keyOf must be used with a Val Module"
         }]));
       }
-      var serializedSchema = this.schema;
-      if (!(serializedSchema.type === "object" || serializedSchema.type === "record")) {
+      var serializedSchema = this.schema;
+      if (!(serializedSchema.type === "object" || serializedSchema.type === "record")) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          message: "Schema in keyOf must be an 'object' or 'record'. Found '".concat(serializedSchema.type || "unknown", "'")
+        }]));
+      }
+      if (serializedSchema.opt && (src === null || src === undefined)) {
+        return false;
+      }
+      if (serializedSchema.type === "record" && typeof src !== "string") {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Type of value in keyof (record) must be 'string'"
+        }]));
+      }
+      if (serializedSchema.type === "object") {
+        var keys = serializedSchema.keys;
+        if (!keys.includes(src)) {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "Value of keyOf (object) must be: ".concat(keys.join(", "), ". Found: ").concat(src)
+          }]));
+        }
+      }
+      if (serializedSchema.type === "record") {
+        if (typeof src !== "string") {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "Value of keyOf (record) must be 'string'. Found: ".concat(_typeof(src))
+          }]));
+        }
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          fixes: ["keyof:check-keys"],
+          message: "Did not validate keyOf (record). This error (keyof:check-keys) should typically be processed by Val internally. Seeing this error most likely means you have a Val version mismatch.",
+          value: {
+            key: src,
+            sourcePath: this.sourcePath
+          }
+        }]));
+      }
+      if (customValidationErrors.length > 0) {
+        return _defineProperty({}, path, customValidationErrors);
+      }
+      return false;
+    }
+  }, {
+    key: "executeAssert",
+    value: function executeAssert(path, src) {
+      if (this.opt && src === null) {
+        return {
+          success: true,
+          data: src
+        };
+      }
+      if (src === null) {
+        return {
+          success: false,
+          errors: _defineProperty({}, path, [{
+            message: "Expected 'string', got 'null'",
+            typeError: true
+          }])
+        };
+      }
+      var schema = this.schema;
+      if (!schema) {
+        return {
+          success: false,
+          errors: _defineProperty({}, path, [{
+            message: "Neither key nor schema was found. keyOf is missing an argument.",
+            typeError: true
+          }])
+        };
+      }
+      var serializedSchema = schema;
+      if (!(serializedSchema.type === "object" || serializedSchema.type === "record")) {
+        return {
+          success: false,
+          errors: _defineProperty({}, path, [{
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            message: "Schema of first argument must be either: 'array', 'object' or 'record'. Found '".concat(serializedSchema.type || "unknown", "'"),
+            typeError: true
+          }])
+        };
+      }
+      if (serializedSchema.type === "record" && typeof src !== "string") {
+        return {
+          success: false,
+          errors: _defineProperty({}, path, [{
+            message: "Value of keyOf (record) must be 'string', got '".concat(_typeof(src), "'"),
+            typeError: true
+          }])
+        };
+      }
+      // We check actual value here, since TypeScript also does this. Literals are used in other types (unions),
+      // and there it also makes sense to check the actual string values (i.e. that it is not just a string) since
+      // missing one would lead to a runtime error. At least this is what we are thinking currently.
+      if (serializedSchema.type === "object") {
+        var keys = serializedSchema.keys;
+        if (!keys.includes(src)) {
+          return {
+            success: false,
+            errors: _defineProperty({}, path, [{
+              message: "Value of keyOf (object) must be: ".concat(keys.join(", "), ". Found: ").concat(src),
+              typeError: true
+            }])
+          };
+        }
+      }
+      return {
+        success: true,
+        data: src
+      };
+    }
+  }, {
+    key: "nullable",
+    value: function nullable() {
+      return new KeyOfSchema(this.schema, this.sourcePath, true, [], this.isReadonly, this.isHidden, this.description);
+    }
+  }, {
+    key: "readonly",
+    value: function readonly() {
+      return new KeyOfSchema(this.schema, this.sourcePath, this.opt, this.customValidateFunctions, true, this.isHidden, this.description);
+    }
+  }, {
+    key: "hidden",
+    value: function hidden() {
+      return new KeyOfSchema(this.schema, this.sourcePath, this.opt, this.customValidateFunctions, this.isReadonly, true, this.description);
+    }
+  }, {
+    key: "executeCustomValidateAt",
+    value: function executeCustomValidateAt(path, src) {
+      return this.executeCustomValidateFunctions(src, this.customValidateFunctions, {
+        path: path
+      });
+    }
+  }, {
+    key: "executeSerialize",
+    value: function executeSerialize() {
+      var _this$customValidateF;
+      var path = this.sourcePath;
+      if (!path) {
+        throw new Error("Cannot serialize keyOf schema with empty selector. TIP: keyOf must be used with a Val Module of record schema.");
+      }
+      var serializedSchema = this.schema;
+      if (!serializedSchema) {
+        throw new Error("Cannot serialize keyOf schema with empty selector.");
+      }
+      var values;
+      switch (serializedSchema.type) {
+        case "record":
+          values = "string";
+          break;
+        case "object":
+          values = serializedSchema.keys;
+          break;
+        default:
+          throw new Error(// eslint-disable-next-line @typescript-eslint/no-explicit-any
+          "Cannot serialize keyOf schema with selector of type '".concat(serializedSchema.type || "unknown", "'"));
+      }
+      return {
+        type: "keyOf",
+        path: path,
+        schema: serializedSchema,
+        opt: this.opt,
+        values: values,
+        customValidate: this.customValidateFunctions && ((_this$customValidateF = this.customValidateFunctions) === null || _this$customValidateF === void 0 ? void 0 : _this$customValidateF.length) > 0,
+        readonly: this.isReadonly,
+        hidden: this.isHidden,
+        description: this.description
+      };
+    }
+  }, {
+    key: "executePreview",
+    value: function executePreview() {
+      return {};
+    }
+  }]);
+}(Schema);
+var keyOf = function keyOf(valModule) {
+  var refSchema = valModule === null || valModule === void 0 ? void 0 : valModule[GetSchema];
+  var serializedRefSchema = undefined;
+  if (refSchema instanceof ObjectSchema) {
+    var keys = [];
+    try {
+      keys = Object.keys((refSchema === null || refSchema === void 0 ? void 0 : refSchema["items"]) || {});
+    } catch (e) {
+      // ignore this error here
+    }
+    serializedRefSchema = {
+      type: "object",
+      keys: keys,
+      opt: refSchema === null || refSchema === void 0 ? void 0 : refSchema["opt"]
+    };
+  } else if (refSchema instanceof RecordSchema) {
+    serializedRefSchema = {
+      type: "record",
+      opt: refSchema === null || refSchema === void 0 ? void 0 : refSchema["opt"]
+    };
+  }
+  return new KeyOfSchema(serializedRefSchema, getValPath(valModule));
+};
+
+var FileSchema = /*#__PURE__*/function (_Schema) {
+  function FileSchema(options) {
+    var _this;
+    var opt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    var isRemote = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    var customValidateFunctions = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
+    var moduleMetadata = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+    var isReadonly = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
+    var isHidden = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
+    var description = arguments.length > 7 ? arguments[7] : undefined;
+    _classCallCheck(this, FileSchema);
+    _this = _callSuper(this, FileSchema);
+    _this.options = options;
+    _this.opt = opt;
+    _this.isRemote = isRemote;
+    _this.customValidateFunctions = customValidateFunctions;
+    _this.moduleMetadata = moduleMetadata;
+    _this.isReadonly = isReadonly;
+    _this.isHidden = isHidden;
+    _this.description = description;
+    return _this;
+  }
+  _inherits(FileSchema, _Schema);
+  return _createClass(FileSchema, [{
+    key: "describe",
+    value: function describe(description) {
+      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, description !== null && description !== void 0 ? description : undefined);
+    }
+  }, {
+    key: "remote",
+    value: function remote() {
+      return new FileSchema(this.options, this.opt, true, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
+    }
+  }, {
+    key: "validate",
+    value: function validate(validationFunction) {
+      return new FileSchema(this.options, this.opt, this.isRemote, [].concat(_toConsumableArray(this.customValidateFunctions), [validationFunction]), this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
+    }
+  }, {
+    key: "executeValidate",
+    value: function executeValidate(path, src) {
+      var customValidationErrors = this.executeCustomValidateFunctions(src, this.customValidateFunctions, {
+        path: path
+      });
+      if (this.opt && (src === null || src === undefined)) {
+        return customValidationErrors.length > 0 ? _defineProperty({}, path, customValidationErrors) : false;
+      }
+      if (src === null || src === undefined) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Non-optional file was null or undefined.",
+          value: src
+        }]));
+      }
+      if (typeof src.path !== "string") {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "File did not have a path string. Got: ".concat(_typeof(src.path)),
+          value: src
+        }]));
+      }
+      // Remote-ness is a property of the path, not of a marker on the value:
+      // anything outside /public is remote.
+      var isRemotePath = isRemoteMediaPath(src.path);
+      if (this.isRemote && !isRemotePath) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          message: "Schema in keyOf must be an 'object' or 'record'. Found '".concat(serializedSchema.type || "unknown", "'")
+          message: "Expected a remote file, but got a local file.",
+          value: src,
+          fixes: ["file:upload-remote"]
         }]));
       }
-      if (serializedSchema.opt && (src === null || src === undefined)) {
-        return false;
+      if (this.isRemote && isRemotePath) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Remote file was not checked.",
+          value: src,
+          fixes: ["file:check-remote"]
+        }]));
       }
-      if (serializedSchema.type === "record" && typeof src !== "string") {
+      if (!this.isRemote && isRemotePath) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          message: "Type of value in keyof (record) must be 'string'"
+          message: "Expected local file, but found remote.",
+          value: src,
+          fixes: ["file:download-remote"]
         }]));
       }
-      if (serializedSchema.type === "object") {
-        var keys = serializedSchema.keys;
-        if (!keys.includes(src)) {
+      var galleryEntries = this.galleryEntries();
+      if (galleryEntries) {
+        if (src.mimeType !== undefined) {
           return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-            message: "Value of keyOf (object) must be: ".concat(keys.join(", "), ". Found: ").concat(src)
+            message: "A file from a gallery must not carry its own mimeType: it is stored in the gallery module.",
+            value: src
           }]));
         }
-      }
-      if (serializedSchema.type === "record") {
-        if (typeof src !== "string") {
+        if (!(src.path in galleryEntries)) {
           return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-            message: "Value of keyOf (record) must be 'string'. Found: ".concat(_typeof(src))
+            message: "The gallery does not have a file at '".concat(src.path, "'."),
+            value: src
           }]));
         }
+        return customValidationErrors.length > 0 ? _defineProperty({}, path, customValidationErrors) : false;
+      }
+      var _ref0 = this.options || {},
+        accept = _ref0.accept;
+      var mimeType = src.mimeType;
+      if (accept && mimeType && !mimeType.includes("/")) {
         return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
-          fixes: ["keyof:check-keys"],
-          message: "Did not validate keyOf (record). This error (keyof:check-keys) should typically be processed by Val internally. Seeing this error most likely means you have a Val version mismatch.",
-          value: {
-            key: src,
-            sourcePath: this.sourcePath
+          message: "Invalid mime type format. Got: ".concat(mimeType),
+          value: src
+        }]));
+      }
+      if (accept && mimeType && mimeType.includes("/")) {
+        var acceptedTypes = accept.split(",").map(function (type) {
+          return type.trim();
+        });
+        var isValidMimeType = acceptedTypes.some(function (acceptedType) {
+          if (acceptedType === "*/*") {
+            return true;
+          }
+          if (acceptedType.endsWith("/*")) {
+            var baseType = acceptedType.slice(0, -2);
+            return mimeType.startsWith(baseType);
           }
+          return acceptedType === mimeType;
+        });
+        if (!isValidMimeType) {
+          return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+            message: "Mime type mismatch. Found '".concat(mimeType, "' but schema accepts '").concat(accept, "'"),
+            value: src
+          }]));
+        }
+      }
+      var fileMimeType = Internal.filenameToMimeType(src.path);
+      if (!fileMimeType) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Could not determine mime type from file extension. Got: ".concat(src.path),
+          value: src
         }]));
       }
-      if (customValidationErrors.length > 0) {
-        return _defineProperty({}, path, customValidationErrors);
+      if (fileMimeType !== mimeType) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Mime type and file extension not matching. Mime type is '".concat(mimeType, "' but file extension is '").concat(fileMimeType, "'"),
+          value: src
+        }]));
       }
-      return false;
+
+      // The mime type read so far came from the filename. Whether it matches the
+      // bytes can only be answered by reading the file, which this package
+      // deliberately cannot do — so it is always handed on as a fix.
+      if (mimeType !== undefined) {
+        return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+          message: "Found mimeType, but it could not be validated.",
+          value: src,
+          fixes: ["file:check-metadata"]
+        }]));
+      }
+      return _defineProperty({}, path, [].concat(_toConsumableArray(customValidationErrors), [{
+        message: "Missing File mimeType.",
+        value: src,
+        fixes: ["file:add-metadata"]
+      }]));
+    }
+
+    /**
+     * The entries of the gallery this field points at, or null when it is a
+     * standalone field.
+     */
+  }, {
+    key: "galleryEntries",
+    value: function galleryEntries() {
+      var modulePaths = Object.keys(this.moduleMetadata);
+      if (modulePaths.length === 0) {
+        return null;
+      }
+      return this.moduleMetadata[modulePaths[0]];
     }
   }, {
     key: "executeAssert",
@@ -4939,56 +5085,29 @@ var KeyOfSchema = /*#__PURE__*/function (_Schema) {
         return {
           success: false,
           errors: _defineProperty({}, path, [{
-            message: "Expected 'string', got 'null'",
-            typeError: true
-          }])
-        };
-      }
-      var schema = this.schema;
-      if (!schema) {
-        return {
-          success: false,
-          errors: _defineProperty({}, path, [{
-            message: "Neither key nor schema was found. keyOf is missing an argument.",
+            message: "Expected 'object', got 'null'",
             typeError: true
           }])
         };
       }
-      var serializedSchema = schema;
-      if (!(serializedSchema.type === "object" || serializedSchema.type === "record")) {
+      if (_typeof(src) !== "object") {
         return {
           success: false,
           errors: _defineProperty({}, path, [{
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            message: "Schema of first argument must be either: 'array', 'object' or 'record'. Found '".concat(serializedSchema.type || "unknown", "'"),
+            message: "Expected object, got '".concat(_typeof(src), "'"),
             typeError: true
           }])
         };
       }
-      if (serializedSchema.type === "record" && typeof src !== "string") {
+      if (!("path" in src) || typeof src.path !== "string") {
         return {
           success: false,
           errors: _defineProperty({}, path, [{
-            message: "Value of keyOf (record) must be 'string', got '".concat(_typeof(src), "'"),
+            message: "A file must be an object with a 'path' (error type: missing_path)",
             typeError: true
           }])
         };
       }
-      // We check actual value here, since TypeScript also does this. Literals are used in other types (unions),
-      // and there it also makes sense to check the actual string values (i.e. that it is not just a string) since
-      // missing one would lead to a runtime error. At least this is what we are thinking currently.
-      if (serializedSchema.type === "object") {
-        var keys = serializedSchema.keys;
-        if (!keys.includes(src)) {
-          return {
-            success: false,
-            errors: _defineProperty({}, path, [{
-              message: "Value of keyOf (object) must be: ".concat(keys.join(", "), ". Found: ").concat(src),
-              typeError: true
-            }])
-          };
-        }
-      }
       return {
         success: true,
         data: src
@@ -4997,17 +5116,17 @@ var KeyOfSchema = /*#__PURE__*/function (_Schema) {
   }, {
     key: "nullable",
     value: function nullable() {
-      return new KeyOfSchema(this.schema, this.sourcePath, true, [], this.isReadonly, this.isHidden, this.description);
+      return new FileSchema(this.options, true, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, this.isHidden, this.description);
     }
   }, {
     key: "readonly",
     value: function readonly() {
-      return new KeyOfSchema(this.schema, this.sourcePath, this.opt, this.customValidateFunctions, true, this.isHidden, this.description);
+      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, true, this.isHidden, this.description);
     }
   }, {
     key: "hidden",
     value: function hidden() {
-      return new KeyOfSchema(this.schema, this.sourcePath, this.opt, this.customValidateFunctions, this.isReadonly, true, this.description);
+      return new FileSchema(this.options, this.opt, this.isRemote, this.customValidateFunctions, this.moduleMetadata, this.isReadonly, true, this.description);
     }
   }, {
     key: "executeCustomValidateAt",
@@ -5020,68 +5139,50 @@ var KeyOfSchema = /*#__PURE__*/function (_Schema) {
     key: "executeSerialize",
     value: function executeSerialize() {
       var _this$customValidateF;
-      var path = this.sourcePath;
-      if (!path) {
-        throw new Error("Cannot serialize keyOf schema with empty selector. TIP: keyOf must be used with a Val Module of record schema.");
-      }
-      var serializedSchema = this.schema;
-      if (!serializedSchema) {
-        throw new Error("Cannot serialize keyOf schema with empty selector.");
-      }
-      var values;
-      switch (serializedSchema.type) {
-        case "record":
-          values = "string";
-          break;
-        case "object":
-          values = serializedSchema.keys;
-          break;
-        default:
-          throw new Error(// eslint-disable-next-line @typescript-eslint/no-explicit-any
-          "Cannot serialize keyOf schema with selector of type '".concat(serializedSchema.type || "unknown", "'"));
-      }
+      var modulePaths = this.moduleMetadata ? Object.keys(this.moduleMetadata) : [];
       return {
-        type: "keyOf",
-        path: path,
-        schema: serializedSchema,
+        type: "file",
+        options: this.options,
         opt: this.opt,
-        values: values,
+        remote: this.isRemote,
         customValidate: this.customValidateFunctions && ((_this$customValidateF = this.customValidateFunctions) === null || _this$customValidateF === void 0 ? void 0 : _this$customValidateF.length) > 0,
+        referencedModule: modulePaths.length > 0 ? modulePaths[0] : undefined,
         readonly: this.isReadonly,
         hidden: this.isHidden,
         description: this.description
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
 }(Schema);
-var keyOf = function keyOf(valModule) {
-  var refSchema = valModule === null || valModule === void 0 ? void 0 : valModule[GetSchema];
-  var serializedRefSchema = undefined;
-  if (refSchema instanceof ObjectSchema) {
-    var keys = [];
-    try {
-      keys = Object.keys((refSchema === null || refSchema === void 0 ? void 0 : refSchema["items"]) || {});
-    } catch (e) {
-      // ignore this error here
+
+/**
+ * A file picked from a gallery. Its mime type lives in the gallery, so the
+ * field carries only the path.
+ */
+
+/** A file of its own, carrying its own mime type. */
+
+function file(options) {
+  var isModule = !!options && !!Internal.getValPath(options);
+  if (isModule) {
+    var allModules = {};
+    for (var _i = 0, _arr = [options]; _i < _arr.length; _i++) {
+      var valModule = _arr[_i];
+      var modulePath = getValPath(valModule);
+      if (modulePath === undefined) {
+        throw new Error("Invalid argument passed to s.file(). Expected a ValModule constructed through c.define, but got an object without a valid module path.");
+      }
+      allModules[modulePath] = getSource(valModule);
     }
-    serializedRefSchema = {
-      type: "object",
-      keys: keys,
-      opt: refSchema === null || refSchema === void 0 ? void 0 : refSchema["opt"]
-    };
-  } else if (refSchema instanceof RecordSchema) {
-    serializedRefSchema = {
-      type: "record",
-      opt: refSchema === null || refSchema === void 0 ? void 0 : refSchema["opt"]
-    };
+    return new FileSchema({}, false, false, [], allModules);
   }
-  return new KeyOfSchema(serializedRefSchema, getValPath(valModule));
-};
+  return new FileSchema(options);
+}
 
 /**
  * Options for s.files()
@@ -5283,8 +5384,8 @@ var DateSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -5487,8 +5588,8 @@ var DateTimeSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -6128,8 +6229,8 @@ var ColorSchema = /*#__PURE__*/function (_Schema) {
       };
     }
   }, {
-    key: "executeRender",
-    value: function executeRender() {
+    key: "executePreview",
+    value: function executePreview() {
       return {};
     }
   }]);
@@ -6236,88 +6337,6 @@ function initSchema() {
   };
 }
 
-/**
- * A image source represents the path to a (local) image.
- *
- */
-
-var initImage = function initImage(config) {
-  var _config$files$directo, _config$files;
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  (_config$files$directo = config === null || config === void 0 || (_config$files = config.files) === null || _config$files === void 0 ? void 0 : _config$files.directory) !== null && _config$files$directo !== void 0 ? _config$files$directo : "/public/val";
-
-  /**
-   * Define the source of an image file.
-   *
-   * @example
-   * c.image("/public/val/example.png", {
-   *   width: 944,
-   *   height: 944,
-   *   mimeType: "image/png",
-   *})
-   *
-   * @param ref /public/val/example.png
-   * @param metadata Image metadata: width, height, mimeType and optionally a hotspot.
-   */
-
-  /**
-   * Define the source of an image file.
-   *
-   * NOTE: this will **not** validate since metadata has not been defined.
-   *
-   * Run `npx -p @valbuild/cli val validate --fix` to automatically add metadata.
-   *
-   * @example
-   * c.image("/public/val/example.png")
-   *
-   * @param ref /public/val/example.png
-   * @param metadata Image metadata: width, height, mimeType and optionally a hotspot.
-   */
-
-  /**
-   * Define the source of an image file.
-   *
-   * @example
-   * c.image("/public/val/example.png", {
-   *   width: 944,
-   *   height: 944,
-   *   mimeType: "image/png",
-   *})
-   *
-   * @param ref /public/val/example.png
-   * @param metadata Image metadata: width, height, mimeType and optionally a hotspot.
-   */
-  function image(ref, metadata) {
-    return _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, FILE_REF_PROP, ref), VAL_EXTENSION, "file"), FILE_REF_SUBTYPE_TAG, "image"), "metadata", metadata);
-  }
-  return image;
-};
-
-/**
- * A remote source represents data that is not stored locally.
- */
-
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-var initRemote = function initRemote(config) {
-  function remote(ref, metadata) {
-    return _defineProperty(_defineProperty(_defineProperty({}, FILE_REF_PROP, ref), VAL_EXTENSION, "remote"), "metadata", metadata);
-  }
-  return remote;
-};
-
-// NOTE: the segments must match the ref built by createRemoteRef below and the RegEx in splitRemoteRef.
-
-function createRemoteRef(remoteHost, _ref2) {
-  var publicProjectId = _ref2.publicProjectId,
-    coreVersion = _ref2.coreVersion,
-    validationHash = _ref2.validationHash,
-    fileHash = _ref2.fileHash,
-    filePath = _ref2.filePath,
-    bucket = _ref2.bucket;
-  // NOTE: the core version is part of the validation hash, but it is also in the uri to make it easier to understand which version the remote file was validated against.
-  return "".concat(remoteHost, "/file/p/").concat(publicProjectId, "/b/").concat(bucket, "/v/").concat(coreVersion, "/h/").concat(validationHash, "/f/").concat(fileHash, "/p/").concat(filePath);
-}
-
 // import { i18n, I18n } from "./source/future/i18n";
 // import { remote } from "./source/future/remote";
 
@@ -6354,9 +6373,6 @@ var initVal = function initVal(config) {
     },
     c: {
       define: define,
-      remote: initRemote(),
-      file: initFile(config),
-      image: initImage(config),
       json: json
     },
     s: s,
@@ -7073,23 +7089,6 @@ function hasRemoteFileSchema(schema) {
 }
 
 var DEFAULT_VAL_REMOTE_HOST = "https://remote.val.build";
-function convertRemoteSource(src) {
-  if (src !== null && src !== void 0 && src.patch_id) {
-    var splitRemoteRefDataRes = splitRemoteRef(src[FILE_REF_PROP]);
-    if (splitRemoteRefDataRes.status === "success") {
-      return {
-        url: "/api/val/files/" + splitRemoteRefDataRes.filePath + "?patch_id=".concat(src["patch_id"], "&remote=true&ref=").concat(encodeURIComponent(src[FILE_REF_PROP])),
-        metadata: src.metadata
-      };
-    } else {
-      console.warn("Internal Val error: failed to split remote ref: ".concat(src[FILE_REF_PROP], ". The data format is different than what is expected. Check Val versions for mismatches."), splitRemoteRefDataRes.error);
-    }
-  }
-  return {
-    url: src[FILE_REF_PROP],
-    metadata: src.metadata
-  };
-}
 
 var PatchError = /*#__PURE__*/_createClass(function PatchError(message) {
   _classCallCheck(this, PatchError);
@@ -7159,14 +7158,15 @@ function derefPatch(patch, document, ops) {
           var maybeValue = ops.get(document, dereffedPath);
           if (result.isOk(maybeValue)) {
             var value = maybeValue.value;
-            if (isFile(value)) {
+            var mediaPath = mediaPathOf(value);
+            if (mediaPath !== null) {
               if (referencedPath.length > 0) {
                 return result.err(new PatchError("Cannot sub-reference file reference at path: ".concat(dereffedPath.join("/"))));
               }
               if (typeof op.value !== "string") {
                 return result.err(new PatchError("Expected base64 encoded string value for file reference, got ".concat(JSON.stringify(op.value))));
               }
-              fileUpdates[value[FILE_REF_PROP]] = op.value;
+              fileUpdates[mediaPath] = op.value;
               // } else if (isRemote(value)) {
               //   if (!remotePatches[value[REMOTE_REF_PROP]]) {
               //     remotePatches[value[REMOTE_REF_PROP]] = [];
@@ -7217,6 +7217,21 @@ function derefPatch(patch, document, ops) {
   });
 }
 
+/**
+ * The path of a media value, or null when it is not media.
+ *
+ * A `$` deref op names its target explicitly, so there is no schema in hand
+ * here — the shape is all there is to go on. Everywhere a schema IS available,
+ * media is recognised from it instead.
+ */
+function mediaPathOf(value) {
+  if (_typeof(value) !== "object" || value === null || Array.isArray(value)) {
+    return null;
+  }
+  var path = value.path;
+  return typeof path === "string" ? path : null;
+}
+
 var EXT_TO_MIME_TYPES = {
   x3d: "application/vnd.hzn-3d-crossword",
   "3gp": "video/3gpp",
@@ -7940,6 +7955,19 @@ function filenameToMimeType(filename) {
   }
 }
 
+// NOTE: the segments must match the ref built by createRemoteRef below and the RegEx in splitRemoteRef.
+
+function createRemoteRef(remoteHost, _ref) {
+  var publicProjectId = _ref.publicProjectId,
+    coreVersion = _ref.coreVersion,
+    validationHash = _ref.validationHash,
+    fileHash = _ref.fileHash,
+    filePath = _ref.filePath,
+    bucket = _ref.bucket;
+  // NOTE: the core version is part of the validation hash, but it is also in the uri to make it easier to understand which version the remote file was validated against.
+  return "".concat(remoteHost, "/file/p/").concat(publicProjectId, "/b/").concat(bucket, "/v/").concat(coreVersion, "/h/").concat(validationHash, "/f/").concat(fileHash, "/p/").concat(filePath);
+}
+
 /**
  * The validation basis is used in remote refs to determine if the remote content needs to be re-validated.
  *
@@ -7981,13 +8009,16 @@ function deserializeSchema(serialized) {
   return schema;
 }
 function deserializeSchemaImpl(serialized) {
-  var _serialized$options, _serialized$options2, _serialized$accept, _serialized$directory, _serialized$remote, _serialized$jsonValue;
+  var _serialized$options, _serialized$options2, _serialized$render, _serialized$accept, _serialized$directory, _serialized$remote, _serialized$jsonValue;
   switch (serialized.type) {
     case "string":
       return new StringSchema(_objectSpread2(_objectSpread2({}, serialized.options), {}, {
         regexp: ((_serialized$options = serialized.options) === null || _serialized$options === void 0 ? void 0 : _serialized$options.regexp) && new RegExp(serialized.options.regexp.source, serialized.options.regexp.flags),
         regExpMessage: (_serialized$options2 = serialized.options) === null || _serialized$options2 === void 0 || (_serialized$options2 = _serialized$options2.regexp) === null || _serialized$options2 === void 0 ? void 0 : _serialized$options2.message
-      }), serialized.opt, serialized.raw, [], null, false, false, serialized.description);
+      }), serialized.opt, serialized.raw, [], // A render is static data, so it survives serialization and must be
+      // carried back: it is the schema's own configuration now, not something
+      // recomputed from an instance.
+      (_serialized$render = serialized.render) !== null && _serialized$render !== void 0 ? _serialized$render : null, false, false, serialized.description);
     case "literal":
       return new LiteralSchema(serialized.value, serialized.opt, [], false, false, serialized.description);
     case "boolean":
@@ -8064,31 +8095,46 @@ function deserializeSchemaImpl(serialized) {
   }
 }
 
-// TODO: we want to change layout -> as to be more consistent across the board
-
-// Main render type:
+/**
+ * What a container shows for ONE of its items: the user's `preview` callback
+ * returns this, and the Studio draws a row from it.
+ *
+ * NB: {@link ArrayPreview} / {@link RecordPreview} name the DATA a container
+ * previews with. The Studio also has React components called `ArrayPreview` /
+ * `RecordPreview` (the fallback rendering of an array / record field, part of
+ * the `<Type>Preview` convention in `components/Preview.tsx`). They do not
+ * collide today because no file needs both - if one ever does, alias this type
+ * at the import rather than renaming that convention.
+ */
 
-//
+/**
+ * Main preview type.
+ *
+ * Deliberately not exported: `parent` is the discriminant, and every consumer
+ * narrows on it rather than on the union as a whole. There is no `layout` here
+ * on purpose - how a preview is laid out is the editor's business, not the
+ * schema's.
+ */
 
 /**
- * Which paths a render is being computed FOR.
+ * Which paths a preview is being computed FOR.
  *
- * `executeRender` takes a whole module, so one request has always walked every
- * node in it and run every `select` closure — for `handboka`, with `select` at
+ * `executePreview` takes a whole module, so one request has always walked every
+ * node in it and run every `preview` closure - for `handboka`, with `preview` at
  * two nested array levels, that is every chapter and every section to serve one
  * visible row. A scope is what makes the walk proportional to what is being
  * looked at instead of to the project.
  *
  * Two questions, because a container and its items need different answers:
  *
- * - {@link RenderScope.wants} — is a render AT this exact path wanted? A
+ * - {@link PreviewScope.wants} - is a preview AT this exact path wanted? A
  *   container answers `true` here when the whole of it is being shown, and its
- *   list render is then computed in full.
- * - {@link RenderScope.wantsUnder} — could anything at or below this path be
+ *   preview is then computed in full.
+ * - {@link PreviewScope.wantsUnder} - could anything at or below this path be
  *   wanted? Recursion is pruned where this is `false`, and a container whose own
- *   path is not wanted but which has wanted descendants renders a WINDOW: only
+ *   path is not wanted but which has wanted descendants previews a WINDOW: only
  *   the items that were asked for. That is the case a single visible row is, and
- *   it is why {@link ListArrayRender} carries indices.
+ *   it is why {@link ArrayPreview} carries indices.
  *
  * Absent scope means the whole module, which is what every existing caller
  * passes and what every existing caller got.
@@ -8100,10 +8146,10 @@ function deserializeSchemaImpl(serialized) {
  * Compares SEGMENTS rather than string prefixes. A source path's module path is
  * a quoted, dot-joined encoding (`?p="a".1."b"`), so `startsWith` gets the
  * ancestor test wrong wherever a key is a prefix of a sibling key or contains a
- * dot or a quote — `"title"` against `"titles"` being the cheapest example.
+ * dot or a quote - `"title"` against `"titles"` being the cheapest example.
  * Segments are parsed once here, not per comparison.
  */
-function renderScope(paths) {
+function previewScope(paths) {
   var wanted = paths.map(function (path) {
     var _splitModuleFilePathA = splitModuleFilePathAndModulePath(path),
       _splitModuleFilePathA2 = _slicedToArray(_splitModuleFilePathA, 2),
@@ -8152,6 +8198,37 @@ function renderScope(paths) {
 
 // TODO: improve this so that we do not get RawString and string, only string. Are there other things?
 
+/**
+ * A RENDER is how one field is laid out in the editor: `s.string().render({ as:
+ * "textarea" })`, `.render({ as: "code", language })`.
+ *
+ * It is static configuration - plain data, with no closure behind it and no
+ * dependency on source - which is why it lives in the SERIALIZED schema
+ * (`SerializedStringSchema.render`) and is read straight off it where the field
+ * is drawn. There is no render pipeline, no store and no host round-trip.
+ *
+ * That "static" is an ASSUMPTION we are taking deliberately, for simplicity,
+ * not a law. A future render could plausibly want to depend on source - a
+ * layout that varies with the value, a callback of its own. If that day comes,
+ * the shape it needs back is `executePreview`'s, and the honest move is to give
+ * `render` its own execute/store pair again. It is NOT to re-merge the two:
+ * conflating them is what this file was split up to undo.
+ *
+ * The dynamic, source-dependent, demand-scoped thing - what a container shows
+ * for its items - is a PREVIEW. See `preview.ts`.
+ */
+/**
+ * The list is the declaration and {@link CodeLanguage} is derived from it, so
+ * that a validator elsewhere (`shared`'s zod schema) can enumerate the same
+ * languages without a second copy that drifts. Same shape as `COLOR_FORMATS`.
+ */
+var CODE_LANGUAGES = ["typescript", "javascript", "javascriptreact", "typescriptreact", "json", "java", "html", "css", "xml", "markdown", "sql", "python", "rust", "php", "go", "cpp", "sass", "vue", "angular"];
+
+/**
+ * What `s.string().render(...)` takes, and what the serialized schema carries
+ * verbatim.
+ */
+
 var externalPageRouter = {
   getRouterId: function getRouterId() {
     return "external-url-router";
@@ -8414,8 +8491,12 @@ var Internal = {
       }
     }()
   },
-  convertFileSource: convertFileSource,
-  convertRemoteSource: convertRemoteSource,
+  mediaUrl: mediaUrl,
+  resolveMedia: resolveMedia,
+  isRemoteMediaPath: isRemoteMediaPath,
+  media: {
+    fillFromGallery: fillFromGallery
+  },
   getSchema: getSchema,
   getValPath: getValPath,
   getSource: getSource,
@@ -8445,7 +8526,6 @@ var Internal = {
     return val && ((_getSchema = getSchema(val)) === null || _getSchema === void 0 ? void 0 : _getSchema["executeValidate"](path, src));
   },
   isVal: isVal,
-  isFile: isFile,
   isJson: isJson,
   getJsonImport: getJsonImport,
   resolveJsonValues: resolveJsonValues,
@@ -8514,6 +8594,7 @@ function tryJsonParse(str) {
 
 exports.ArraySchema = ArraySchema;
 exports.BooleanSchema = BooleanSchema;
+exports.CODE_LANGUAGES = CODE_LANGUAGES;
 exports.COLOR_FORMATS = COLOR_FORMATS;
 exports.ColorSchema = ColorSchema;
 exports.DEFAULT_APP_HOST = DEFAULT_APP_HOST;
@@ -8523,8 +8604,6 @@ exports.DEFAULT_VAL_REMOTE_HOST = DEFAULT_VAL_REMOTE_HOST;
 exports.DateSchema = DateSchema;
 exports.DateTimeSchema = DateTimeSchema;
 exports.FATAL_ERROR_TYPES = FATAL_ERROR_TYPES;
-exports.FILE_REF_PROP = FILE_REF_PROP;
-exports.FILE_REF_SUBTYPE_TAG = FILE_REF_SUBTYPE_TAG;
 exports.FileSchema = FileSchema;
 exports.GenericSelector = GenericSelector;
 exports.ImageSchema = ImageSchema;
@@ -8554,5 +8633,5 @@ exports.getSourcePathFromRoute = getSourcePathFromRoute;
 exports.hasRemoteFileSchema = hasRemoteFileSchema;
 exports.initVal = initVal;
 exports.modules = modules;
-exports.renderScope = renderScope;
+exports.previewScope = previewScope;
 exports.splitModuleFilePathAndModulePath = splitModuleFilePathAndModulePath;