Merge pull request #36 from webgme/issue/any-of-set-selected

`AnyOf` Selection

Author: romancow

src/lib/SchemaForm.svelte

@@ -4,14 +4,12 @@
   import DownloadOptions, { type DataTransform } from './DownloadOptions';
   import UISchema from "./UISchema";
   import JsonSchemaDereferencer from "@json-schema-tools/dereferencer";
-  import Ajv, { type ValidateFunction } from "ajv";
-  import ajvFormats from "ajv-formats";
+  import Validator, { ValidationError, type ValidateFunction } from "./Validator";
   import mergeAllOf from "json-schema-merge-allof";
   import Paper, { Title, Subtitle, Content } from '@smui/paper';
   import createMountedEventDispatcher from './createMountedEventDispatcher';
   import ObjectProps from "./controls/ObjectProps.svelte";
   import Control from "./Control.svelte";
-  import ValidationError from "./ValidationError";
   import { isObjectSchema, isString, isBoolean } from './utilities';
   import libVersion from "./version";
 
@@ -26,8 +24,6 @@
    * properly (so `.default` is `undefined`).
    */
   const Dereferencer: typeof JsonSchemaDereferencer = (<any>JsonSchemaDereferencer).default ?? JsonSchemaDereferencer;
-  const ajv = new Ajv();
-  ajvFormats(ajv);
   const actions = {
     get blob() {
       return getBlob();
@@ -52,7 +48,7 @@
   });
 
   $: try {
-    validator = ajv.compile(schema);
+    validator = Validator.compile(schema);
   }
   catch (error) {
     dispatch("error", error);

src/lib/ValidationError.ts

@@ -0,0 +1,18 @@
+import Ajv, { type ErrorObject, type ValidateFunction } from "ajv";
+import ajvFormats from "ajv-formats";
+
+const ajv = new Ajv()
+ajvFormats(ajv)
+
+export default ajv
+
+export class ValidationError extends Error {
+  errors: ErrorObject[]
+
+  constructor(errors: ErrorObject[] | false) {
+    super("Data is invalid for JSON schema");
+    this.errors = errors || []
+  }
+}
+
+export type { ErrorObject, ValidateFunction }

src/lib/Validator.ts

@@ -1,5 +1,6 @@
 <script lang="ts">
   import type { JSONSchema7, JSONSchema7Definition } from "json-schema";
+  import Validator from "$lib/Validator";
   import UISchema from "$lib/UISchema";
   import deepEquals from "fast-deep-equal";
   import { isObjectSchema, omit, getLabel, isEmpty } from "$lib/utilities";
@@ -20,15 +21,13 @@
   const keys = new WeakMap<JSONSchema7, string>();
   let schemas: JSONSchema7[] = [];
   let selected: JSONSchema7 | null = null;
-  let selectedProps: string[] | undefined;
 
   $: uiOptions = UISchema.Options.get(uischema);
   $: updateSchemas(anyOf);
   $: resetSelected(schemas);
-  $: resetData(selected, type);
 
-  function isObjSchema() {
-    return isObjectSchema({ type: selected?.type ?? type });
+  function isObjSchema(schema: JSONSchema7 | null = selected) {
+    return isObjectSchema({ type: schema?.type ?? type });
   }
 
   function getKey(schema: JSONSchema7) {
@@ -48,38 +47,38 @@
     }
   }
 
-  function resetSelected(schemas: JSONSchema7[]) {
-    if ((selected == null) ? force : !schemas.includes(selected)) {
-      selected = force ? schemas[0] : null;
-    }
-  }
-
-  async function resetData(selected: JSONSchema7 | null, type: JSONSchema7['type']) {
-    await tick();
-    let newData = data;
-    if (isObjSchema() && (selected != null)) {
-      if (selectedProps && data) {
-        newData = omit(data, selectedProps, { keepUnchanged: true });
+  async function setSelected(value: JSONSchema7 | null) {
+    if (selected !== value) {
+      let newData = data;
+      if (isObjSchema(value) && (value != null)) {
+        if ((selected != null) && isObjSchema() && !isEmpty(data ?? {})) {
+          const selectedProps = Object.keys(selected?.properties ?? {});
+          newData = omit(data, selectedProps, { keepUnchanged: true });
+        }
+        else if ((data == null) || !isEmpty(data)) {
+          newData = {};
+        }
       }
-      else if ((data == null) || !isEmpty(data)) {
-        newData = {};
+      else {
+        newData = undefined;
       }
+      if (newData != data) {
+        data = newData;
+      }
+      selected = value;
     }
-    else {
-      newData = undefined;
-    }
-    if (newData !== data) {
-      data = newData;
-    }
-    resetSelectedProps();
   }
 
-  function resetSelectedProps() {
-    const newSelectedProps = isObjSchema() ? Object.keys(selected?.properties ?? {}) : undefined;
-    if (!deepEquals(newSelectedProps?.sort(), selectedProps?.sort())) {
-      selectedProps = newSelectedProps;
+  function resetSelected(schemas: JSONSchema7[]) {
+    let newSelected = schemas.find(schema => Validator.validate(schema, data)) ?? null;
+    if (force && (newSelected == null)) {
+      newSelected = schemas[0];
+    }
+    if (newSelected !== selected) {
+      selected = newSelected;
     }
   }
+
 </script>
 
 <Paper variant="unelevated" class="jsonschema-form-control control-anyof">
@@ -93,7 +92,8 @@
       disabled={$uiOptions.readonly}
       menu$class="control-anyof-menu"
       menu$portal
-      bind:value={selected}
+      value={selected}
+      on:SMUISelect:change={(event) => setSelected(event.detail.value)}
     >
       {#if !force}
         <Option value={null} />

src/lib/controls/AnyOfControl.svelte

@@ -1,6 +1,6 @@
 // Reexport your entry components here
 export { default as default } from "./SchemaForm.svelte";
 export type { JSONSchema7 } from "json-schema";
-export { default as ValidationError } from "./ValidationError";
+export { ValidationError } from "./Validator";
 export type { default as UISchema } from "./UISchema";
 export type { default as DownloadOptions } from "./DownloadOptions";