@strictly/react-form 0.0.13 → 0.0.14

package/core/mobx/types.ts

@@ -10,11 +10,12 @@ import {
  */
 export type ValuePathsOfModel<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  Presenter extends FormModel<any, any, any, any>,
-> = Presenter extends FormModel<
+  Model extends FormModel<any, any, any, any, any>,
+> = Model extends FormModel<
   infer _1,
   infer _2,
   infer _3,
+  infer _4,
   infer ValuePathsToAdapters
 > ? keyof ValuePathsToAdapters
   : never
@@ -25,12 +26,13 @@ export type ValuePathsOfModel<
  */
 export type ToValueOfModelValuePath<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  Presenter extends FormModel<any, any, any, any>,
-  K extends ValuePathsOfModel<Presenter>,
-> = Presenter extends FormModel<
+  Model extends FormModel<any, any, any, any, any>,
+  K extends ValuePathsOfModel<Model>,
+> = Model extends FormModel<
   infer _1,
   infer _2,
   infer _3,
+  infer _4,
   infer ValuePathsToAdapters
 > ? ToOfFieldAdapter<ValuePathsToAdapters[K]>
   : never
@@ -44,11 +46,12 @@ export type ToValueOfModelValuePath<
  */
 export type FormFieldsOfModel<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  Presenter extends FormModel<any, any, any, any>,
-> = Presenter extends FormModel<
+  Model extends FormModel<any, any, any, any, any>,
+> = Model extends FormModel<
   infer _1,
   infer _2,
   infer _3,
+  infer _4,
   infer ValuePathsToAdapters
 > ? FlattenedConvertedFieldsOf<ValuePathsToAdapters>
   : never

package/dist/index.cjs

@@ -88,6 +88,8 @@ var index_exports = {};
 __export(index_exports, {
   AbstractSelectValueTypeConverter: () => AbstractSelectValueTypeConverter,
   DefaultErrorRenderer: () => DefaultErrorRenderer,
+  Empty: () => Empty,
+  FieldView: () => FieldView,
   FormModel: () => FormModel,
   IntegerToStringConverter: () => IntegerToStringConverter,
   NullableToBooleanConverter: () => NullableToBooleanConverter,
@@ -355,8 +357,8 @@ function listAdapter() {
 var import_base2 = require("@strictly/base");
 var import_define = require("@strictly/define");
 var import_mobx = require("mobx");
-var _accessors_dec, _knownFields_dec, _fields_dec, _errors_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _errors;
-_value_dec = [import_mobx.observable.ref], _fieldOverrides_dec = [import_mobx.observable.shallow], _errors_dec = [import_mobx.observable.shallow], _fields_dec = [import_mobx.computed], _knownFields_dec = [import_mobx.computed], _accessors_dec = [import_mobx.computed];
+var _accessors_dec, _knownFields_dec, _fields_dec, _context_dec, _errors_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _errors;
+_value_dec = [import_mobx.observable.ref], _fieldOverrides_dec = [import_mobx.observable.shallow], _errors_dec = [import_mobx.observable.shallow], _context_dec = [import_mobx.computed.struct], _fields_dec = [import_mobx.computed], _knownFields_dec = [import_mobx.computed], _accessors_dec = [import_mobx.computed];
 var FormModel = class {
   constructor(type, value, adapters) {
     this.type = type;
@@ -368,6 +370,7 @@ var FormModel = class {
     __publicField(this, "flattenedTypeDefs");
     this.value = (0, import_define.mobxCopy)(type, value);
     this.flattenedTypeDefs = (0, import_define.flattenTypesOfType)(type);
+    const contextValue = this.toContext(value);
     const conversions = (0, import_define.flattenValueTo)(
       type,
       this.value,
@@ -385,13 +388,16 @@ var FormModel = class {
         if (revert == null) {
           return;
         }
-        return convert(value2, valuePath, this.value);
+        return convert(value2, valuePath, contextValue);
       }
     );
     this.fieldOverrides = (0, import_base2.map)(conversions, function(_k, v) {
       return v && [v.value];
     });
   }
+  get context() {
+    return this.toContext(this.value);
+  }
   get fields() {
     return new Proxy(
       this.knownFields,
@@ -459,11 +465,11 @@ var FormModel = class {
       accessor != null ? accessor.value : fieldTypeDef != null ? (0, import_define.mobxCopy)(
         fieldTypeDef,
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-        create(valuePath, this.value)
-      ) : create(valuePath, this.value),
+        create(valuePath, this.context)
+      ) : create(valuePath, this.context),
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
       valuePath,
-      this.value
+      this.context
     );
     const error = this.errors[valuePath];
     return {
@@ -521,7 +527,7 @@ var FormModel = class {
     const element = elementValue != null ? elementValue[0] : elementAdapter.create(
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
       elementTypePath,
-      this.value
+      this.context
     );
     const originalList = accessor.value;
     const newList = [
@@ -639,7 +645,7 @@ var FormModel = class {
   internalSetFieldValue(valuePath, value, displayValidation) {
     const { revert } = this.getAdapterForValuePath(valuePath);
     (0, import_base2.assertExists)(revert, "setting value not supported {}", valuePath);
-    const conversion = revert(value, valuePath, this.value);
+    const conversion = revert(value, valuePath, this.context);
     const accessor = this.getAccessorForValuePath(valuePath);
     return (0, import_mobx.runInAction)(() => {
       this.fieldOverrides[valuePath] = [value];
@@ -679,10 +685,10 @@ var FormModel = class {
       convert,
       create
     } = adapter2;
-    const value = create(valuePath, this.value);
+    const value = create(valuePath, this.context);
     const {
       value: displayValue
-    } = convert(value, valuePath, this.value);
+    } = convert(value, valuePath, this.context);
     const key = valuePath;
     (0, import_mobx.runInAction)(() => {
       this.fieldOverrides[key] = [displayValue];
@@ -711,10 +717,10 @@ var FormModel = class {
     const {
       value: storedValue
     } = convert(
-      accessor != null ? accessor.value : create(valuePath, this.value),
+      accessor != null ? accessor.value : create(valuePath, this.context),
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
       valuePath,
-      this.value
+      this.context
     );
     const value = fieldOverride != null ? fieldOverride[0] : storedValue;
     const dirty = storedValue !== value;
@@ -722,12 +728,12 @@ var FormModel = class {
     if (ignoreDefaultValue) {
       const {
         value: defaultDisplayValue
-      } = convert(create(valuePath, this.value), valuePath, this.value);
+      } = convert(create(valuePath, this.context), valuePath, this.context);
       if (defaultDisplayValue === value) {
         return true;
       }
     }
-    const conversion = revert(value, valuePath, this.value);
+    const conversion = revert(value, valuePath, this.context);
     return (0, import_mobx.runInAction)(() => {
       switch (conversion.type) {
         case 1 /* Failure */:
@@ -772,10 +778,10 @@ var FormModel = class {
           const fieldOverride = this.fieldOverrides[adapterPath];
           const {
             value: storedValue
-          } = convert(accessor.value, valuePath, this.value);
+          } = convert(accessor.value, valuePath, this.context);
           const value = fieldOverride != null ? fieldOverride[0] : storedValue;
           const dirty = fieldOverride != null && fieldOverride[0] !== storedValue;
-          const conversion = revert(value, valuePath, this.value);
+          const conversion = revert(value, valuePath, this.context);
           switch (conversion.type) {
             case 1 /* Failure */:
               this.errors[adapterPath] = conversion.error;
@@ -805,6 +811,7 @@ _errors = new WeakMap();
 __decorateElement(_init, 4, "value", _value_dec, FormModel, _value);
 __decorateElement(_init, 4, "fieldOverrides", _fieldOverrides_dec, FormModel, _fieldOverrides);
 __decorateElement(_init, 4, "errors", _errors_dec, FormModel, _errors);
+__decorateElement(_init, 2, "context", _context_dec, FormModel);
 __decorateElement(_init, 2, "fields", _fields_dec, FormModel);
 __decorateElement(_init, 2, "knownFields", _knownFields_dec, FormModel);
 __decorateElement(_init, 2, "accessors", _accessors_dec, FormModel);
@@ -939,17 +946,12 @@ function mergeAdaptersWithValidators(adapters, validators) {
 }
 
 // core/mobx/sub_form_field_adapters.ts
-var import_define3 = require("@strictly/define");
-function subFormFieldAdapters(subAdapters, parentTypePath, contextType) {
+function subFormFieldAdapters(subAdapters, parentTypePath) {
   const dotCount = parentTypePath.split(".").length;
-  function getSubValuePathAndContext(valuePath, context) {
+  function getSubValuePath(valuePath) {
     const parentValuePath = valuePath.split(".").slice(0, dotCount).join(".");
     const subValuePath = valuePath.replace(parentValuePath, "$");
-    const subContext = (0, import_define3.flattenValuesOfType)(contextType, context)[parentValuePath];
-    return [
-      subValuePath,
-      subContext
-    ];
+    return subValuePath;
   }
   return Object.entries(subAdapters).reduce((acc, [
     subTypePath,
@@ -958,13 +960,13 @@ function subFormFieldAdapters(subAdapters, parentTypePath, contextType) {
     const typePath = subTypePath.replace("$", parentTypePath);
     const adaptedAdapter = {
       convert: (from, valuePath, context) => {
-        return subAdapter.convert(from, ...getSubValuePathAndContext(valuePath, context));
+        return subAdapter.convert(from, getSubValuePath(valuePath), context);
       },
       create: (valuePath, context) => {
-        return subAdapter.create(...getSubValuePathAndContext(valuePath, context));
+        return subAdapter.create(getSubValuePath(valuePath), context);
       },
       revert: subAdapter.revert && ((from, valuePath, context) => {
-        return subAdapter.revert(from, ...getSubValuePathAndContext(valuePath, context));
+        return subAdapter.revert(from, getSubValuePath(valuePath), context);
       })
     };
     acc[typePath] = adaptedAdapter;
@@ -1004,7 +1006,7 @@ var IntegerToStringConverter = class {
 };
 
 // field_converters/nullable_to_boolean_converter.ts
-var import_define4 = require("@strictly/define");
+var import_define3 = require("@strictly/define");
 var NullableToBooleanConverter = class {
   constructor(typeDef, prototype, nullType, defaultToNull = true) {
     this.typeDef = typeDef;
@@ -1022,7 +1024,7 @@ var NullableToBooleanConverter = class {
   }
   revert(from) {
     if (from) {
-      const value = (0, import_define4.copy)(this.typeDef, this.prototype);
+      const value = (0, import_define3.copy)(this.typeDef, this.prototype);
       return {
         type: 0 /* Success */,
         value
@@ -1040,7 +1042,7 @@ var NullableToBooleanConverter = class {
 
 // field_converters/select_value_type_converter.ts
 var import_base5 = require("@strictly/base");
-var import_define5 = require("@strictly/define");
+var import_define4 = require("@strictly/define");
 var AbstractSelectValueTypeConverter = class {
   constructor(typeDef, values, defaultValueKey, noSuchValueError, required) {
     this.typeDef = typeDef;
@@ -1058,7 +1060,7 @@ var AbstractSelectValueTypeConverter = class {
         value: null
       };
     }
-    const value = prototype == null ? prototype : (0, import_define5.copy)(this.typeDef, prototype);
+    const value = prototype == null ? prototype : (0, import_define4.copy)(this.typeDef, prototype);
     return {
       type: 0 /* Success */,
       value
@@ -1132,13 +1134,13 @@ var SelectStringConverter = class extends AbstractSelectValueTypeConverter {
 };
 
 // field_converters/validating_converter.ts
-var import_define6 = require("@strictly/define");
+var import_define5 = require("@strictly/define");
 function validatingConverter(validators = []) {
   return function(value, valuePath, context) {
     return validators.reduce(
       function(acc, validator) {
         if (acc.type === 0 /* Success */) {
-          const error = (0, import_define6.validate)(validator, value, valuePath, context);
+          const error = (0, import_define5.validate)(validator, value, valuePath, context);
           if (error != null) {
             return {
               type: 1 /* Failure */,
@@ -1165,6 +1167,34 @@ function DefaultErrorRenderer({
   return JSON.stringify(error);
 }
 
+// mantine/field_view.tsx
+var import_mobx_react = require("mobx-react");
+
+// util/empty.tsx
+function Empty() {
+  return null;
+}
+
+// mantine/field_view.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function FieldView({
+  fields,
+  valuePath,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mobx_react.Observer, { children: () => {
+    const {
+      value,
+      error
+    } = fields[valuePath];
+    return children({
+      value,
+      error,
+      ErrorSink: Empty
+    });
+  } });
+}
+
 // mantine/hooks.tsx
 var import_core = require("@mantine/core");
 var import_base6 = require("@strictly/base");
@@ -1172,14 +1202,14 @@ var import_mobx2 = require("mobx");
 var import_react4 = require("react");
 
 // util/partial.tsx
-var import_mobx_react = require("mobx-react");
+var import_mobx_react2 = require("mobx-react");
 var import_react2 = require("react");
-var import_jsx_runtime = require("react/jsx-runtime");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function createSimplePartialComponent(Component, curriedProps) {
   return (0, import_react2.forwardRef)(
     function(exposedProps, ref) {
       const C = Component;
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
         C,
         __spreadValues(__spreadValues({
           ref
@@ -1219,7 +1249,7 @@ function createPartialComponent(Component, curriedPropsSource, additionalPropKey
         ]
       );
       const curriedProps = curriedPropsSource(additionalProps);
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
         C,
         __spreadValues(__spreadValues({
           ref
@@ -1255,7 +1285,7 @@ function createPartialObserverComponent(Component, curriedPropsSource, additiona
   );
 }
 function createUnsafePartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
-  return (0, import_mobx_react.observer)(
+  return (0, import_mobx_react2.observer)(
     (0, import_react2.forwardRef)(
       function(props, ref) {
         const C = Component;
@@ -1286,7 +1316,7 @@ function createUnsafePartialObserverComponent(Component, curriedPropsSource, add
           ]
         );
         const curriedProps = curriedPropsSource(additionalProps);
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
           C,
           __spreadValues(__spreadValues({
             ref
@@ -1317,7 +1347,7 @@ function usePartialObserverComponent(curriedPropsSource, deps, Component, additi
 }
 
 // mantine/create_checkbox.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 function createCheckbox(valuePath, Checkbox) {
   const onChange = (e) => {
     var _a;
@@ -1354,7 +1384,7 @@ function createCheckbox(valuePath, Checkbox) {
       checked: value,
       disabled: readonly,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1369,15 +1399,15 @@ function createCheckbox(valuePath, Checkbox) {
 }
 
 // mantine/create_fields_view.tsx
-var import_define7 = require("@strictly/define");
-var import_mobx_react2 = require("mobx-react");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_define6 = require("@strictly/define");
+var import_mobx_react3 = require("mobx-react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 function createFieldsView(valuePath, FieldsView, observableProps) {
   function toKey(subKey) {
-    return (0, import_define7.jsonPathPrefix)(valuePath, subKey);
+    return (0, import_define6.jsonPathPrefix)(valuePath, subKey);
   }
   function toSubKey(key) {
-    return (0, import_define7.jsonPathUnprefix)(valuePath, key);
+    return (0, import_define6.jsonPathUnprefix)(valuePath, key);
   }
   function onFieldValueChange(subKey, value) {
     observableProps.onFieldValueChange(toKey(subKey), value);
@@ -1394,7 +1424,7 @@ function createFieldsView(valuePath, FieldsView, observableProps) {
     var _a;
     (_a = observableProps.onFieldSubmit) == null ? void 0 : _a.call(observableProps, toKey(subKey));
   }
-  const Component = (0, import_mobx_react2.observer)(
+  const Component = (0, import_mobx_react3.observer)(
     function(props) {
       const subFields = Object.entries(observableProps.fields).reduce(
         (acc, [
@@ -1409,7 +1439,7 @@ function createFieldsView(valuePath, FieldsView, observableProps) {
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
         {}
       );
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
         FieldsView,
         __spreadProps(__spreadValues({}, props), {
           fields: subFields,
@@ -1434,16 +1464,16 @@ function createFieldsView(valuePath, FieldsView, observableProps) {
 }
 
 // mantine/create_form.tsx
-var import_mobx_react3 = require("mobx-react");
+var import_mobx_react4 = require("mobx-react");
 var import_react3 = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function createForm(valuePath, Form, observableProps) {
-  return (0, import_mobx_react3.observer)((props) => {
+  return (0, import_mobx_react4.observer)((props) => {
     const { value } = observableProps.fields[valuePath];
     const onValueChange = (0, import_react3.useCallback)((value2) => {
       observableProps.onFieldValueChange(valuePath, value2);
     }, []);
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       Form,
       __spreadProps(__spreadValues({}, props), {
         onValueChange,
@@ -1454,7 +1484,7 @@ function createForm(valuePath, Form, observableProps) {
 }
 
 // mantine/create_list.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function createList(valuePath, List) {
   const propSource = () => {
     const values = [...this.fields[valuePath].value];
@@ -1470,7 +1500,7 @@ function DefaultList({
   listPath,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: values.map(function(value, index) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_jsx_runtime6.Fragment, { children: values.map(function(value, index) {
     const valuePath = `${listPath}.${index}`;
     return children(valuePath, value, index);
   }) });
@@ -1509,7 +1539,7 @@ function createRadio(valuePath, value, Radio) {
 }
 
 // mantine/create_radio_group.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function createRadioGroup(valuePath, RadioGroup) {
   const onChange = (value) => {
     var _a;
@@ -1541,7 +1571,7 @@ function createRadioGroup(valuePath, RadioGroup) {
       name: valuePath,
       value,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1552,7 +1582,7 @@ function createRadioGroup(valuePath, RadioGroup) {
 }
 
 // mantine/create_text_input.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function createTextInput(valuePath, TextInput) {
   const onChange = (e) => {
     var _a;
@@ -1593,7 +1623,7 @@ function createTextInput(valuePath, TextInput) {
       value,
       disabled: readonly,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1608,7 +1638,7 @@ function createTextInput(valuePath, TextInput) {
 }
 
 // mantine/create_value_input.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function createValueInput(valuePath, ValueInput) {
   const onChange = (value) => {
     var _a;
@@ -1646,7 +1676,7 @@ function createValueInput(valuePath, ValueInput) {
       value,
       disabled: readonly,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1661,9 +1691,9 @@ function createValueInput(valuePath, ValueInput) {
 }
 
 // mantine/hooks.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function SimpleSelect(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core.Select, __spreadValues({}, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core.Select, __spreadValues({}, props));
 }
 function useMantineFormFields({
   onFieldValueChange,
@@ -1832,7 +1862,7 @@ __decorateElement(_init2, 4, "fields", _fields_dec2, MantineFormImpl, _fields);
 __decoratorMetadata(_init2, MantineFormImpl);
 
 // types/merge_validators.ts
-var import_define8 = require("@strictly/define");
+var import_define7 = require("@strictly/define");
 function mergeValidators(validators1, validators2) {
   const validators = __spreadValues(__spreadValues({}, validators1), validators2);
   const keys1 = new Set(Object.keys(validators1));
@@ -1844,16 +1874,16 @@ function mergeValidators(validators1, validators2) {
       validators3[key] = {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         validate: function(value, valuePath, context) {
-          const error = (0, import_define8.validate)(validator1, value, valuePath, context);
+          const error = (0, import_define7.validate)(validator1, value, valuePath, context);
           if (error != null) {
             return error;
           }
-          return (0, import_define8.validate)(validator2, value, valuePath, context);
+          return (0, import_define7.validate)(validator2, value, valuePath, context);
         },
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         annotations: function(valuePath, context) {
-          const annotations1 = (0, import_define8.annotations)(validator1, valuePath, context);
-          const annotations22 = (0, import_define8.annotations)(validator2, valuePath, context);
+          const annotations1 = (0, import_define7.annotations)(validator1, valuePath, context);
+          const annotations22 = (0, import_define7.annotations)(validator2, valuePath, context);
           return {
             readonly: annotations1.readonly || annotations22.readonly,
             required: annotations1.required || annotations22.required
@@ -1870,6 +1900,8 @@ function mergeValidators(validators1, validators2) {
 0 && (module.exports = {
   AbstractSelectValueTypeConverter,
   DefaultErrorRenderer,
+  Empty,
+  FieldView,
   FormModel,
   IntegerToStringConverter,
   NullableToBooleanConverter,