From db3b51f4dbf3ed839161ad4512eca906043f6557 Mon Sep 17 00:00:00 2001
From: Denis <kolosov@huntflow.ru>
Date: Fri, 25 Feb 2022 16:18:02 +0700
Subject: [PATCH] refactor: use shallow resolve $ref instead of
 json-schema-ref-parser

---
 package-lock.json                             | 36 +++++--------------
 package.json                                  |  3 +-
 src/components/Form.vue                       | 25 +++----------
 src/components/_Form.vue                      |  9 ++---
 .../ArrayField.FixedArray.DefaultTemplate.vue |  6 ++--
 .../fields/ArrayField.FixedArray.vue          | 16 +++------
 src/components/fields/ArrayField.Item.vue     |  4 +--
 .../fields/ArrayField.MultiSelect.vue         |  4 +--
 ...ArrayField.NormalArray.DefaultTemplate.vue |  6 ++--
 .../fields/ArrayField.NormalArray.vue         | 16 +++------
 src/components/fields/ArrayField.vue          | 11 +++---
 src/components/fields/BooleanField.vue        |  4 +--
 src/components/fields/NumberField.vue         |  2 +-
 .../fields/ObjectField.DefaultTemplate.vue    |  5 ++-
 src/components/fields/ObjectField.vue         |  9 ++---
 src/components/fields/SchemaField.vue         | 23 ++++--------
 src/components/fields/StringField.vue         |  4 +--
 src/components/form-props.js                  |  2 +-
 src/helpers/dereference.js                    | 22 ------------
 src/helpers/schema.js                         | 13 ++++---
 src/utils.js                                  | 23 +-----------
 21 files changed, 66 insertions(+), 177 deletions(-)
 delete mode 100644 src/helpers/dereference.js

diff --git a/package-lock.json b/package-lock.json
index 7a2f70d..a9a0a08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,19 +1,9 @@
 {
   "name": "vjsf",
-  "version": "0.9.14",
+  "version": "0.9.16",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
-    "@apidevtools/json-schema-ref-parser": {
-      "version": "9.0.6",
-      "resolved": "https://registry.npmjs.org/@apidevtools/json-schema-ref-parser/-/json-schema-ref-parser-9.0.6.tgz",
-      "integrity": "sha512-M3YgsLjI0lZxvrpeGVk9Ap032W6TPQkH6pRAZz81Ac3WUNF79VQooAFnp8umjvVzUmD93NkogxEwbSce7qMsUg==",
-      "requires": {
-        "@jsdevtools/ono": "^7.1.3",
-        "call-me-maybe": "^1.0.1",
-        "js-yaml": "^3.13.1"
-      }
-    },
     "@axe-core/puppeteer": {
       "version": "4.3.2",
       "resolved": "https://registry.npmjs.org/@axe-core/puppeteer/-/puppeteer-4.3.2.tgz",
@@ -3794,11 +3784,6 @@
         }
       }
     },
-    "@jsdevtools/ono": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/@jsdevtools/ono/-/ono-7.1.3.tgz",
-      "integrity": "sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg=="
-    },
     "@mdx-js/mdx": {
       "version": "1.6.22",
       "resolved": "https://registry.npmjs.org/@mdx-js/mdx/-/mdx-1.6.22.tgz",
@@ -12259,6 +12244,7 @@
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
       "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+      "dev": true,
       "requires": {
         "sprintf-js": "~1.0.2"
       }
@@ -14260,7 +14246,8 @@
     "call-me-maybe": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/call-me-maybe/-/call-me-maybe-1.0.1.tgz",
-      "integrity": "sha1-JtII6onje1y95gJQoV8DHBak1ms="
+      "integrity": "sha1-JtII6onje1y95gJQoV8DHBak1ms=",
+      "dev": true
     },
     "caller-callsite": {
       "version": "2.0.0",
@@ -17055,7 +17042,8 @@
     "esprima": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
-      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A=="
+      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
+      "dev": true
     },
     "esquery": {
       "version": "1.3.1",
@@ -23199,6 +23187,7 @@
       "version": "3.14.0",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.0.tgz",
       "integrity": "sha512-/4IbIeHcD9VMHFqDR/gQ7EdZdLimOvW2DdcxFjdyyZ9NsbS+ccrXqVWDtab/lRl5AlUqmpBx8EhPaWR+OtY17A==",
+      "dev": true,
       "requires": {
         "argparse": "^1.0.7",
         "esprima": "^4.0.0"
@@ -23423,14 +23412,6 @@
       "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
       "dev": true
     },
-    "json-schema-ref-parser": {
-      "version": "9.0.6",
-      "resolved": "https://registry.npmjs.org/json-schema-ref-parser/-/json-schema-ref-parser-9.0.6.tgz",
-      "integrity": "sha512-z0JGv7rRD3CnJbZY/qCpscyArdtLJhr/wRBmFUdoZ8xMjsFyNdILSprG2degqRLjBjyhZHAEBpGOxniO9rKTxA==",
-      "requires": {
-        "@apidevtools/json-schema-ref-parser": "9.0.6"
-      }
-    },
     "json-schema-traverse": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -29336,7 +29317,8 @@
     "sprintf-js": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "dev": true
     },
     "sshpk": {
       "version": "1.16.1",
diff --git a/package.json b/package.json
index 77baa7f..5adfd7a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vjsf",
-  "version": "0.9.16",
+  "version": "0.9.17",
   "description": "Vue-component capable of building HTML forms out of a JSON schema. A port of react-jsonschema-form",
   "main": "dist/vjsf.umd.min.js",
   "scripts": {
@@ -51,7 +51,6 @@
     "ajv": "^8.6.1",
     "ajv-errors": "^3.0.0",
     "json-pointer": "^0.6.1",
-    "json-schema-ref-parser": "^9.0.6",
     "json-schema-traverse": "^0.4.1",
     "lodash": "^4.17.20",
     "shortid": "^2.2.15"
diff --git a/src/components/Form.vue b/src/components/Form.vue
index c10e825..fcf1488 100644
--- a/src/components/Form.vue
+++ b/src/components/Form.vue
@@ -1,15 +1,8 @@
 <template>
-  <base-form
-    v-if="isDereference"
-    ref="vjsf"
-    v-bind="$props"
-    :schema="dereferencedSchema"
-    v-on="$listeners"
-  />
+  <base-form ref="vjsf" v-bind="$props" :schema="enrichedSchema" v-on="$listeners" />
 </template>
 
 <script>
-import { dereference } from '@/helpers/dereference';
 import { getEnrichedSchema } from '@/helpers/schema';
 import BaseForm from './_Form';
 import { PROPS } from './form-props';
@@ -26,19 +19,9 @@ export default {
       isDereference: false
     };
   },
-  watch: {
-    schema: {
-      immediate: true,
-      handler(schema) {
-        this.isDereference = false;
-        dereference(schema)
-          .then((result) => {
-            this.dereferencedSchema = getEnrichedSchema(result);
-          })
-          .finally(() => {
-            this.isDereference = true;
-          });
-      }
+  computed: {
+    enrichedSchema() {
+      return getEnrichedSchema(this.schema);
     }
   },
   methods: {
diff --git a/src/components/_Form.vue b/src/components/_Form.vue
index 3eaeb04..c8319f1 100644
--- a/src/components/_Form.vue
+++ b/src/components/_Form.vue
@@ -22,11 +22,10 @@
     />
     <component
       :is="getRegistry().fields.SchemaField"
+      :id="idPrefix"
       :disabled="disabled"
       :error-schema="errorSchemaState"
       :form-data="formDataState"
-      :id-prefix="idPrefix"
-      :id-schema="idSchema"
       :registry="getRegistry()"
       :schema="resolvedSchema"
       :ui-schema="uiSchema"
@@ -40,7 +39,7 @@
 import pick from 'lodash/pick';
 import cloneDeep from 'lodash/cloneDeep';
 import { compileSchema, toErrorList } from '@/validate';
-import { toIdSchema, getDefaultRegistry } from '@/utils';
+import { getDefaultRegistry } from '@/utils';
 import { PROPS } from './form-props';
 import { VALIDATION_MODE } from '@/constants';
 import { getDefaults, resolveSchemaShallowly, removeEmptySchemaFields } from '@/helpers/schema';
@@ -72,9 +71,6 @@ export default {
     resolvedSchema() {
       return this.resolveSchemaShallowly(this.schema, this.formDataState);
     },
-    idSchema() {
-      return toIdSchema(this.resolvedSchema, this.uiSchema['ui:rootFieldId'], this.idPrefix);
-    },
     shouldShowErrorList() {
       return this.showErrorList !== false && this.errorsState && this.errorsState.length > 0;
     },
@@ -158,7 +154,6 @@ export default {
       const submitPayload = {
         schema: this.resolvedSchema,
         uiSchema: this.uiSchema,
-        idSchema: this.idSchema,
         formData: this.formDataState,
         edit: this.isEdit,
         errors: this.errorsState,
diff --git a/src/components/fields/ArrayField.FixedArray.DefaultTemplate.vue b/src/components/fields/ArrayField.FixedArray.DefaultTemplate.vue
index d2d7658..30636d8 100644
--- a/src/components/fields/ArrayField.FixedArray.DefaultTemplate.vue
+++ b/src/components/fields/ArrayField.FixedArray.DefaultTemplate.vue
@@ -1,9 +1,9 @@
 <template>
-  <fieldset :id="idSchema.$id">
+  <fieldset :id="id">
     <slot name="title" />
     <slot name="description" />
 
-    <div :key="'array-item-list-' + idSchema.$id" class="row array-item-list">
+    <div :key="'array-item-list-' + id" class="row array-item-list">
       <slot />
     </div>
 
@@ -15,7 +15,7 @@
 import AddButton from '../AddButton';
 
 const PROPS = {
-  idSchema: Object,
+  id: String,
   schema: Object,
   uiSchema: Object,
   canAdd: { type: Boolean, default: false },
diff --git a/src/components/fields/ArrayField.FixedArray.vue b/src/components/fields/ArrayField.FixedArray.vue
index 685b84e..ace519d 100644
--- a/src/components/fields/ArrayField.FixedArray.vue
+++ b/src/components/fields/ArrayField.FixedArray.vue
@@ -1,7 +1,7 @@
 <template>
   <component
     :is="fieldTemplateCls"
-    :id-schema="idSchema"
+    :id="id"
     :schema="resolvedSchema"
     :ui-schema="uiSchema"
     :can-add="canAdd"
@@ -13,7 +13,7 @@
     <template v-if="label" #title>
       <component
         :is="registry.fields.TitleField"
-        :id="idSchema.$id + '__title'"
+        :id="id + '__title'"
         :title="label"
         :required="required"
       />
@@ -22,13 +22,14 @@
     <template v-if="description" #description>
       <component
         :is="registry.fields.DescriptionField"
-        :id="idSchema.$id + '__description'"
+        :id="id + '__description'"
         :description="description"
       />
     </template>
 
     <array-field-item
       v-for="(keyedItem, index) in keyedFormData"
+      :id="`${id}_${index}`"
       :key="keyedItem.key"
       :registry="registry"
       :index="index"
@@ -37,7 +38,6 @@
       :can-move-down="index >= itemSchemas.length && index < formDataItems.length - 1"
       :ui-schema="uiSchema"
       :item-schema="getItemSchema(keyedItem.item, index)"
-      :item-id-schema="getItemIdSchema(keyedItem.item, index)"
       :item-ui-schema="getItemUiSchema(index)"
       :item-data="keyedItem.item"
       :item-error-schema="errorSchema ? errorSchema[index] : undefined"
@@ -49,7 +49,6 @@
 
 <script>
 import pick from 'lodash/pick';
-import { toIdSchema } from '../../utils';
 import { canAddArrayItem } from '../../helpers/can-add-array-item';
 import ArrayFieldItem from './ArrayField.Item';
 import DefaultFixedArrayFieldTemplate from './ArrayField.FixedArray.DefaultTemplate';
@@ -61,8 +60,7 @@ const PROPS = {
   uiSchema: {},
   formData: {},
   errorSchema: {},
-  idPrefix: String,
-  idSchema: Object,
+  id: String,
   registry: { type: Object, required: true },
   rawErrors: Array,
   autofocus: { type: Boolean, default: false },
@@ -124,10 +122,6 @@ export default {
         ? this.uiSchema.items[index]
         : this.uiSchema.items || {};
       return itemUiSchema;
-    },
-    getItemIdSchema(item, index) {
-      const itemIdPrefix = this.idSchema.$id + '_' + index;
-      return toIdSchema(this.getItemSchema(item, index), itemIdPrefix, this.idPrefix);
     }
   }
 };
diff --git a/src/components/fields/ArrayField.Item.vue b/src/components/fields/ArrayField.Item.vue
index e84d89e..ee42815 100644
--- a/src/components/fields/ArrayField.Item.vue
+++ b/src/components/fields/ArrayField.Item.vue
@@ -12,11 +12,11 @@
   >
     <component
       :is="registry.fields.SchemaField"
+      :id="id"
       :schema="itemSchema"
       :ui-schema="itemUiSchema"
       :form-data="itemData"
       :error-schema="itemErrorSchema"
-      :id-schema="itemIdSchema"
       :required="isRequired"
       :registry="registry"
       :disabled="disabled"
@@ -42,7 +42,7 @@ const PROPS = {
   itemSchema: Object,
   itemData: {},
   itemUiSchema: Object,
-  itemIdSchema: Object,
+  id: String,
   itemErrorSchema: Object,
   rawErrors: { type: Array },
   rawErrorInfos: { type: Array },
diff --git a/src/components/fields/ArrayField.MultiSelect.vue b/src/components/fields/ArrayField.MultiSelect.vue
index aee4cb4..31a2cdf 100644
--- a/src/components/fields/ArrayField.MultiSelect.vue
+++ b/src/components/fields/ArrayField.MultiSelect.vue
@@ -1,7 +1,7 @@
 <template>
   <component
     :is="widgetCls"
-    :id="idSchema && idSchema.$id"
+    :id="id"
     multiple
     :options="widgetWithOptions.options"
     :schema="resolvedSchema"
@@ -28,7 +28,7 @@ const PROPS = {
   description: String,
   placeholder: String,
   schema: Object,
-  idSchema: Object,
+  id: String,
   uiSchema: Object,
   formData: Array,
   registry: { type: Object, required: true },
diff --git a/src/components/fields/ArrayField.NormalArray.DefaultTemplate.vue b/src/components/fields/ArrayField.NormalArray.DefaultTemplate.vue
index 6e9b3f4..807fda5 100644
--- a/src/components/fields/ArrayField.NormalArray.DefaultTemplate.vue
+++ b/src/components/fields/ArrayField.NormalArray.DefaultTemplate.vue
@@ -1,9 +1,9 @@
 <template>
-  <fieldset :id="idSchema.$id">
+  <fieldset :id="id">
     <slot name="title" />
     <slot name="description" />
 
-    <div :key="'array-item-list-' + idSchema.$id" class="row array-item-list">
+    <div :key="'array-item-list-' + id" class="row array-item-list">
       <slot />
     </div>
 
@@ -15,7 +15,7 @@
 import AddButton from '../AddButton';
 
 const PROPS = {
-  idSchema: Object,
+  id: String,
   schema: Object,
   uiSchema: Object,
   canAdd: { type: Boolean, default: false },
diff --git a/src/components/fields/ArrayField.NormalArray.vue b/src/components/fields/ArrayField.NormalArray.vue
index 5595ad7..d46be82 100644
--- a/src/components/fields/ArrayField.NormalArray.vue
+++ b/src/components/fields/ArrayField.NormalArray.vue
@@ -1,11 +1,11 @@
 <template>
   <component
     :is="fieldTemplateCls"
+    :id="id"
     :can-add="canAdd"
     class="field field-array"
     :class="'field-array-of-' + itemsSchema.type"
     :disabled="disabled"
-    :id-schema="idSchema"
     :ui-schema="uiSchema"
     :readonly="readonly"
     :required="required"
@@ -19,7 +19,7 @@
     <template v-if="label" #title>
       <component
         :is="registry.fields.TitleField"
-        :id="idSchema.$id + '__title'"
+        :id="id + '__title'"
         :title="label"
         :required="required"
       />
@@ -28,13 +28,14 @@
     <template v-if="description" #description>
       <component
         :is="registry.fields.DescriptionField"
-        :id="idSchema.$id + '__description'"
+        :id="id + '__description'"
         :description="description"
       />
     </template>
 
     <array-field-item
       v-for="(keyedItem, index) in keyedFormData"
+      :id="`${id}_${index}`"
       :key="keyedItem.key"
       :registry="registry"
       :index="index"
@@ -42,7 +43,6 @@
       :can-move-up="index > 0"
       :can-move-down="index < formData.length - 1"
       :item-schema="getItemSchema(keyedItem.item)"
-      :item-id-schema="getItemIdSchema(keyedItem.item, index)"
       :item-ui-schema="uiSchema.items"
       :item-error-schema="errorSchema ? errorSchema[index] : undefined"
       :item-data="keyedItem.item"
@@ -54,7 +54,6 @@
 
 <script>
 import pick from 'lodash/pick';
-import { toIdSchema } from '../../utils';
 import { canAddArrayItem } from '../../helpers/can-add-array-item';
 import ArrayFieldItem from './ArrayField.Item';
 import DefaultNormalArrayFieldTemplate from './ArrayField.NormalArray.DefaultTemplate';
@@ -63,13 +62,12 @@ const PROPS = {
   name: String,
   label: String,
   description: String,
-  idPrefix: String,
+  id: String,
   keyedFormData: Array,
   schema: Object,
   uiSchema: Object,
   formData: Array,
   errorSchema: Object,
-  idSchema: Object,
   rawErrors: Array,
   rawErrorInfos: Array,
   registry: { type: Object, required: true },
@@ -109,10 +107,6 @@ export default {
     },
     getItemErrorSchema(index) {
       return this.errorSchema ? this.errorSchema[index] : undefined;
-    },
-    getItemIdSchema(item, index) {
-      const itemIdPrefix = this.idSchema.$id + '_' + index;
-      return toIdSchema(this.getItemSchema(item), itemIdPrefix, this.idPrefix);
     }
   }
 };
diff --git a/src/components/fields/ArrayField.vue b/src/components/fields/ArrayField.vue
index 1775fbf..c671e13 100644
--- a/src/components/fields/ArrayField.vue
+++ b/src/components/fields/ArrayField.vue
@@ -1,6 +1,7 @@
 <template>
   <fixed-array
     v-if="isFixedArray"
+    :id="id"
     :label="label"
     :description="description"
     :keyed-form-data="keyedFormData"
@@ -8,8 +9,6 @@
     :ui-schema="uiSchema"
     :form-data="formData"
     :error-schema="errorSchema"
-    :id-prefix="idPrefix"
-    :id-schema="idSchema"
     :name="name"
     :required="required"
     :disabled="disabled"
@@ -27,12 +26,12 @@
 
   <multiselect-array
     v-else-if="isMultiSelectArray"
+    :id="id"
     :label="label"
     :description="description"
     :schema="resolvedSchema"
     :ui-schema="uiSchema"
     :form-data="formData"
-    :id-schema="idSchema"
     :required="required"
     :disabled="disabled"
     :readonly="readonly"
@@ -46,6 +45,7 @@
 
   <normal-array
     v-else
+    :id="id"
     :label="label"
     :description="description"
     :keyed-form-data="keyedFormData"
@@ -53,8 +53,6 @@
     :ui-schema="uiSchema"
     :form-data="formData"
     :error-schema="errorSchema"
-    :id-prefix="idPrefix"
-    :id-schema="idSchema"
     :name="name"
     :required="required"
     :disabled="disabled"
@@ -83,12 +81,11 @@ const PROPS = {
   label: String,
   description: String,
   name: String,
-  idPrefix: String,
+  id: String,
   rawErrors: Array,
   rawErrorInfos: Array,
   uiSchema: { type: Object, default: () => ({}) },
   formData: { type: Array, default: () => [] },
-  idSchema: { type: Object, default: () => ({}) },
   schema: Object,
   errorSchema: Object,
   registry: { type: Object, required: true },
diff --git a/src/components/fields/BooleanField.vue b/src/components/fields/BooleanField.vue
index d3a283b..2577e72 100644
--- a/src/components/fields/BooleanField.vue
+++ b/src/components/fields/BooleanField.vue
@@ -1,7 +1,7 @@
 <template>
   <component
     :is="widgetWithOptions.widget"
-    :id="idSchema && idSchema.$id"
+    :id="id"
     :options="widgetWithOptions.options"
     :schema="schema"
     :label="label"
@@ -26,7 +26,7 @@ const PROPS = {
   description: String,
   schema: Object,
   uiSchema: Object,
-  idSchema: Object,
+  id: String,
   formData: Boolean,
   rawErrors: Array,
   rawErrorInfos: Array,
diff --git a/src/components/fields/NumberField.vue b/src/components/fields/NumberField.vue
index 5501ee1..292c45f 100644
--- a/src/components/fields/NumberField.vue
+++ b/src/components/fields/NumberField.vue
@@ -20,7 +20,7 @@ const PROPS = {
   label: String,
   description: String,
   uiSchema: Object,
-  idSchema: Object,
+  id: String,
   formData: Number,
   required: { type: Boolean, default: false },
   disabled: { type: Boolean, default: false },
diff --git a/src/components/fields/ObjectField.DefaultTemplate.vue b/src/components/fields/ObjectField.DefaultTemplate.vue
index b13c524..4b3649f 100644
--- a/src/components/fields/ObjectField.DefaultTemplate.vue
+++ b/src/components/fields/ObjectField.DefaultTemplate.vue
@@ -31,7 +31,6 @@ const PROPS = {
   titleFieldCls: Object,
   descriptionFieldCls: Object,
   formData: [String, Number, Boolean, Array, Object], // TODO: check if it's true
-  idSchema: Object,
   schema: Object,
   uiSchema: Object,
   orderedProperties: { type: Array, required: true },
@@ -52,10 +51,10 @@ export default {
       return this.disabled || this.readonly;
     },
     fieldTitleId() {
-      return this.idSchema.$id + '__title';
+      return `${this.id}__title`;
     },
     fieldDescriptionId() {
-      return this.idSchema.$id + '__description';
+      return `${this.id}__description`;
     },
     canExpand() {
       if (!this.schema.additionalProperties) {
diff --git a/src/components/fields/ObjectField.vue b/src/components/fields/ObjectField.vue
index 1c8566a..4abf65a 100644
--- a/src/components/fields/ObjectField.vue
+++ b/src/components/fields/ObjectField.vue
@@ -1,13 +1,12 @@
 <template>
   <component
     :is="objectFieldTemplateCls"
-    :id="idSchema.$id"
+    :id="id"
     :label="label"
     :title-field-cls="registry.fields.TitleField"
     :description="description"
     :description-field-cls="registry.fields.DescriptionField"
     :schema="resolvedSchema"
-    :id-schema="idSchema"
     :ui-schema="uiSchema"
     :ordered-properties="orderedProperties"
     :form-data="innerFormData"
@@ -19,14 +18,13 @@
     <template v-for="propName in orderedProperties" #[propName]="scopedProps">
       <component
         :is="schemaFieldCls"
+        :id="`${id}_${propName}`"
         :key="propName"
         :name="propName"
         :required="isRequired(propName)"
         :schema="resolvedSchema.properties[propName]"
         :ui-schema="scopedProps.uiSchema || uiSchema[propName]"
         :error-schema="errorSchema[propName]"
-        :id-schema="idSchema[propName]"
-        :id-prefix="idPrefix"
         :form-data="(innerFormData || {})[propName]"
         :was-property-key-modified="wasPropertyKeyModified"
         :registry="registry"
@@ -52,8 +50,7 @@ const PROPS = {
   label: String,
   description: String,
   uiSchema: { type: Object, default: () => ({}) },
-  idPrefix: String,
-  idSchema: { type: Object, default: () => ({}) },
+  id: String,
   errorSchema: { type: Object, default: () => ({}) },
   formData: {
     type: [String, Number, Boolean, Array, Object], // TODO: check if it's true
diff --git a/src/components/fields/SchemaField.vue b/src/components/fields/SchemaField.vue
index cda5dd5..6e0bfbf 100644
--- a/src/components/fields/SchemaField.vue
+++ b/src/components/fields/SchemaField.vue
@@ -1,7 +1,7 @@
 <template>
   <component
     :is="fieldTemplateCls"
-    :id="idSchema.$id"
+    :id="id"
     class="form-group field"
     :disabled="isDisabled"
     :hidden="isHidden"
@@ -13,6 +13,7 @@
   >
     <component
       :is="fieldCls"
+      :id="id"
       :name="name"
       :label="title"
       :description="description"
@@ -20,8 +21,6 @@
       :disabled="isDisabled"
       :error-schema="fieldErrorSchema"
       :form-data="formData"
-      :id-prefix="idPrefix"
-      :id-schema="mergedIdSchema"
       :raw-errors="errorSchema.__errors"
       :raw-error-infos="errorSchema.__errorInfos"
       :readonly="isReadOnly"
@@ -37,16 +36,14 @@
 
 <script>
 import pick from 'lodash/pick';
-import merge from 'lodash/merge';
-import { toIdSchema, getSchemaType } from '../../utils';
+import { getSchemaType } from '../../utils';
 
 import DefaultTemplate from './SchemaField.DefaultTemplate.vue';
 
 const PROPS = {
   name: String,
-  idPrefix: String,
+  id: String,
   schema: Object,
-  idSchema: { type: Object, default: () => ({}) },
   uiSchema: { type: Object, default: () => ({}) },
   errorSchema: { type: Object, default: () => ({}) },
   formData: [String, Number, Boolean, Array, Object],
@@ -83,9 +80,6 @@ export default {
     resolvedSchema() {
       return this.resolveSchemaShallowly(this.schema, this.formData);
     },
-    mergedIdSchema() {
-      return merge(toIdSchema(this.resolvedSchema, null, this.idPrefix), this.idSchema);
-    },
     isHidden() {
       return this.uiSchema['ui:widget'] === 'hidden';
     },
@@ -111,12 +105,7 @@ export default {
       return (this.errorSchema.__errors || []).filter(Boolean);
     },
     fieldCls() {
-      return getFieldComponent(
-        this.resolvedSchema,
-        this.uiSchema,
-        this.mergedIdSchema,
-        this.registry.fields
-      );
+      return getFieldComponent(this.resolvedSchema, this.uiSchema, this.registry.fields);
     },
     fieldTemplateCls() {
       return this.uiSchema['ui:FieldTemplate'] || this.registry.FieldTemplate || DefaultTemplate;
@@ -139,7 +128,7 @@ const COMPONENT_TYPES = {
   null: 'NullField'
 };
 
-function getFieldComponent(schema, uiSchema, idSchema, fields) {
+function getFieldComponent(schema, uiSchema, fields) {
   const field = uiSchema['ui:field'];
   if (typeof field === 'function') {
     return field;
diff --git a/src/components/fields/StringField.vue b/src/components/fields/StringField.vue
index 0faef75..35b27b4 100644
--- a/src/components/fields/StringField.vue
+++ b/src/components/fields/StringField.vue
@@ -1,7 +1,7 @@
 <template>
   <component
     :is="widgetCls"
-    :id="idSchema && idSchema.$id"
+    :id="id"
     :options="widgetOptions"
     :schema="resolvedSchema"
     :label="label"
@@ -28,7 +28,7 @@ const PROPS = {
   label: String,
   description: String,
   uiSchema: Object,
-  idSchema: Object,
+  id: String,
   formData: [String, Number],
   registry: { type: Object, required: true },
   rawErrors: { type: Array },
diff --git a/src/components/form-props.js b/src/components/form-props.js
index eb256f2..0fbd84e 100644
--- a/src/components/form-props.js
+++ b/src/components/form-props.js
@@ -3,7 +3,7 @@ import DefaultErrorList from './ErrorList.vue';
 
 export const PROPS = {
   id: String,
-  idPrefix: String,
+  idPrefix: { type: String, default: 'root' },
   name: String,
   method: String,
   target: String,
diff --git a/src/helpers/dereference.js b/src/helpers/dereference.js
deleted file mode 100644
index c2b76fd..0000000
--- a/src/helpers/dereference.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import $RefParser from 'json-schema-ref-parser';
-
-export function dereference(schema) {
-  return $RefParser
-    .dereference(schema, {
-      parse: {
-        json: false,
-        yaml: false,
-        text: false,
-        binary: false
-      },
-      resolve: {
-        external: false,
-        file: false,
-        http: false
-      }
-    })
-    .then((result) => {
-      const { definitions, ...rest } = result;
-      return rest;
-    });
-}
diff --git a/src/helpers/schema.js b/src/helpers/schema.js
index 7c4ecad..3d79ca5 100644
--- a/src/helpers/schema.js
+++ b/src/helpers/schema.js
@@ -12,12 +12,18 @@ jsonSchemaTraverse.arrayKeywords.prefixItems = true;
 
 const CONDITIONAL_KEYWORDS = [/*'not', 'anyOf', 'oneOf',*/ 'allOf', 'if'];
 
+const KEYWORDS_FOR_RESOLVING = ['$ref'].concat(CONDITIONAL_KEYWORDS);
+
 export function resolveSchemaShallowly(schema, { getSchema, data }) {
-  if (!schema.$id) {
+  if (!KEYWORDS_FOR_RESOLVING.some((keyword) => keyword in schema)) {
     return schema;
   }
   const resultSchema = cloneDeep(schema);
 
+  if (resultSchema.$ref) {
+    merge(resultSchema, getSchema(resultSchema.$ref).schema);
+    delete resultSchema.$ref;
+  }
   if (resultSchema.allOf) {
     resultSchema.allOf.forEach((cond) => {
       merge(resultSchema, resolveSchemaShallowly(cond, { getSchema, data }));
@@ -80,10 +86,7 @@ export function getEnrichedSchema(schema) {
 
   jsonSchemaTraverse(schema, {
     cb: (schema, currentJsonPointer, rootSchema, parentJsonPointer, parentKeyword) => {
-      if (
-        ['properties', 'prefixItems', 'additionalItems', 'items'].includes(parentKeyword) &&
-        !schema.hasOwnProperty('default')
-      ) {
+      if (parentKeyword && !schema.hasOwnProperty('default')) {
         const schemaType = getSchemaType(schema);
         switch (schemaType) {
           case 'object':
diff --git a/src/utils.js b/src/utils.js
index afba6be..b184b96 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -70,7 +70,7 @@ export function getSchemaType(schema) {
   }
 
   if (!type && schema.enum) {
-    return 'string';
+    return 'string'; // TODO: кажется что тут нужно вычислять через `guessType`
   }
 
   if (!type && (schema.properties || schema.additionalProperties)) {
@@ -291,27 +291,6 @@ export const guessType = function guessType(value) {
   return 'string';
 };
 
-export function toIdSchema(schema, id, idPrefix = 'root') {
-  const idSchema = {
-    $id: id || idPrefix
-  };
-  if ('dependencies' in schema) {
-    return toIdSchema(schema, id, idPrefix);
-  }
-  if ('items' in schema) {
-    return toIdSchema(schema.items, id, idPrefix);
-  }
-  if (schema.type !== 'object') {
-    return idSchema;
-  }
-  for (const name in schema.properties || {}) {
-    const field = schema.properties[name];
-    const fieldId = idSchema.$id + '_' + name;
-    idSchema[name] = toIdSchema(field, fieldId, idPrefix);
-  }
-  return idSchema;
-}
-
 export function rangeSpec(schema) {
   const spec = {};
   if (schema.multipleOf) {