[form-builder] Simplify input resolving (#234)

packages/@sanity/form-builder/src/FormBuilderContext.js

@@ -1,15 +1,16 @@
 import PropTypes from 'prop-types'
 import React from 'react'
-import * as defaultConfig from './defaultConfig'
+import {fallbackInputs} from './fallbackInputs'
+
 import Schema from '@sanity/schema'
 import pubsub from 'nano-pubsub'
 
 const NOOP = () => {}
 
-function resolve(type, providedResolve = NOOP, defaultResolve = NOOP) {
+function resolve(type, providedResolve = NOOP) {
   let itType = type
   while (itType) {
-    const resolved = providedResolve(itType) || defaultResolve(itType)
+    const resolved = providedResolve(itType)
     if (resolved) {
       return resolved
     }
@@ -50,14 +51,13 @@ export default class FormBuilderContext extends React.Component {
 
   resolveInputComponent = type => {
     const {resolveInputComponent} = this.props
-    return resolve(type, resolveInputComponent, defaultConfig.resolveInputComponent)
-      || defaultConfig.jsonTypeFallbacks[type.jsonType]
+    return resolve(type, resolveInputComponent) || fallbackInputs[type.jsonType]
   }
 
   resolvePreviewComponent = type => {
     const {resolvePreviewComponent} = this.props
 
-    return resolve(type, resolvePreviewComponent, defaultConfig.resolvePreviewComponent)
+    return resolve(type, resolvePreviewComponent)
   }
 
   _getMemoizedChildContext() {

packages/@sanity/form-builder/src/fallbackInputs.js

@@ -0,0 +1,13 @@
+import ObjectInput from './inputs/Object/Object'
+import ArrayInput from './inputs/Array/Array'
+import BooleanInput from './inputs/Boolean'
+import NumberInput from './inputs/Number'
+import TextInput from './inputs/Text'
+
+export const fallbackInputs = {
+  object: ObjectInput,
+  array: ArrayInput,
+  boolean: BooleanInput,
+  number: NumberInput,
+  string: TextInput
+}

packages/@sanity/form-builder/src/index.js

@@ -1,12 +1,7 @@
-import * as defaultInputs from './defaultInputComponents'
 import * as FileInput from './inputs/File'
 import * as ImageInput from './inputs/Image'
 import * as ReferenceInput from './inputs/Reference'
 import * as SlugInput from './inputs/Slug'
-import * as defaultConfig from './defaultConfig'
-
-export {defaultInputs}
-export {defaultConfig}
 
 export {default as FormBuilder} from './FormBuilder'
 export {default as FormBuilderContext} from './FormBuilderContext'

packages/@sanity/form-builder/src/inputs/Boolean.js

@@ -6,8 +6,7 @@ import Checkbox from 'part:@sanity/components/toggles/checkbox'
 import PatchEvent, {set} from '../PatchEvent'
 
 // Todo: support indeterminate state, see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
-export default class Bool extends React.Component {
-  static displayName = 'Boolean'
+export default class BooleanInput extends React.Component {
 
   static propTypes = {
     type: FormBuilderPropTypes.type,

packages/@sanity/form-builder/src/inputs/OptionsArray/OptionsArray.js

@@ -42,7 +42,7 @@ function inArray(array, candidate) {
   return array ? array.some(item => isEqual(item, candidate)) : false
 }
 
-export default class OptionsArray extends React.PureComponent {
+export default class OptionsArrayInput extends React.PureComponent {
   static propTypes = {
     type: PropTypes.shape({
       options: PropTypes.shape({

packages/@sanity/form-builder/src/inputs/TagsArray/TagsArray.js

@@ -5,7 +5,7 @@ import FormField from 'part:@sanity/components/formfields/default'
 import TagInput from 'part:@sanity/components/tags/textfield'
 import PatchEvent, {set, unset} from '../../PatchEvent'
 
-export default class TagsInput extends React.PureComponent {
+export default class TagsArrayInput extends React.PureComponent {
   static propTypes = {
     type: PropTypes.object,
     value: PropTypes.arrayOf(PropTypes.string),

packages/@sanity/form-builder/src/sanity/inputResolver/customInputs.js

@@ -0,0 +1,29 @@
+// These are inputs that may be implemented by provided parts
+import BooleanInput from 'part:@sanity/form-builder/input/boolean?'
+import EmailInput from 'part:@sanity/form-builder/input/email?'
+import GeoPointInput from 'part:@sanity/form-builder/input/geopoint?'
+import NumberInput from 'part:@sanity/form-builder/input/number?'
+import ObjectInput from 'part:@sanity/form-builder/input/object?'
+import ReferenceInput from 'part:@sanity/form-builder/input/reference?'
+import RichDateInput from 'part:@sanity/form-builder/input/rich-date?'
+import StringInput from 'part:@sanity/form-builder/input/string?'
+import TextInput from 'part:@sanity/form-builder/input/text?'
+import UrlInput from 'part:@sanity/form-builder/input/url?'
+import CodeInput from 'part:@sanity/form-builder/input/code?'
+
+const DeprecatedDateInput = RichDateInput
+
+export default {
+  object: ObjectInput,
+  boolean: BooleanInput,
+  number: NumberInput,
+  string: StringInput,
+  text: TextInput,
+  reference: ReferenceInput,
+  date: DeprecatedDateInput,
+  richDate: RichDateInput,
+  email: EmailInput,
+  geopoint: GeoPointInput,
+  code: CodeInput,
+  url: UrlInput
+}

packages/@sanity/form-builder/src/sanity/inputResolver/defaultInputs.js

@@ -0,0 +1,27 @@
+
+import BooleanInput from '../../inputs/Boolean'
+import EmailInput from '../../inputs/Email'
+import NumberInput from '../../inputs/Number'
+import ObjectInput from '../../inputs/Object'
+import StringInput from '../../inputs/String'
+import TextInput from '../../inputs/Text'
+import UrlInput from '../../inputs/Url'
+
+import SanityArrayInput from '../inputs/SanityArray'
+import Image from '../inputs/Image'
+import File from '../inputs/File'
+import Slug from '../inputs/Slug'
+
+export default {
+  object: ObjectInput,
+  array: SanityArrayInput,
+  boolean: BooleanInput,
+  number: NumberInput,
+  text: TextInput,
+  email: EmailInput,
+  url: UrlInput,
+  image: Image,
+  file: File,
+  string: StringInput,
+  slug: Slug
+}

packages/@sanity/form-builder/src/sanity/inputResolver/inputResolver.js

@@ -1,42 +1,11 @@
-import ArrayInput from 'part:@sanity/form-builder/input/array?'
-import BooleanInput from 'part:@sanity/form-builder/input/boolean?'
-import EmailInput from 'part:@sanity/form-builder/input/email?'
-import GeoPointInput from 'part:@sanity/form-builder/input/geopoint?'
-import NumberInput from 'part:@sanity/form-builder/input/number?'
-import ObjectInput from 'part:@sanity/form-builder/input/object?'
-import ReferenceInput from 'part:@sanity/form-builder/input/reference?'
-import RichDateInput from 'part:@sanity/form-builder/input/rich-date?'
-import StringInput from 'part:@sanity/form-builder/input/string?'
-import TextInput from 'part:@sanity/form-builder/input/text?'
-import UrlInput from 'part:@sanity/form-builder/input/url?'
-import codeInput from 'part:@sanity/form-builder/input/code?'
-import SlugInput from '../inputs/Slug'
-import FileInput from '../inputs/File'
-import ImageInput from '../inputs/Image'
-import SanityArray from '../inputs/SanityArray'
-
-import resolveReference from './resolveReference'
-
-const DeprecatedDateInput = RichDateInput
-
-const typeInputMap = {
-  array: ArrayInput,
-  object: ObjectInput,
-  boolean: BooleanInput,
-  number: NumberInput,
-  string: StringInput,
-  text: TextInput,
-  reference: ReferenceInput,
-  date: DeprecatedDateInput,
-  richDate: RichDateInput,
-  email: EmailInput,
-  file: FileInput,
-  image: ImageInput,
-  slug: SlugInput,
-  geopoint: GeoPointInput,
-  code: codeInput,
-  url: UrlInput
-}
+import customInputs from './customInputs'
+import defaultInputs from './defaultInputs'
+import * as is from '../../utils/is'
+import SearchableStringSelect from '../../inputs/SearchableStringSelect'
+import StringSelect from '../../inputs/StringSelect'
+import resolveReferenceInput from './resolveReferenceInput'
+import resolveArrayInput from './resolveArrayInput'
+import resolveStringInput from './resolveStringInput'
 
 function getExport(obj) {
   return obj && obj.__esModule ? obj.default : obj
@@ -50,7 +19,25 @@ let getCustomResolver = () => {
   getCustomResolver = () => resolver
   return resolver
 }
-export default function inputResolver(type) {
+
+function resolveTypeVariants(type) {
+  if (is.type('array', type)) {
+    return resolveArrayInput(type)
+  }
+
+  if (is.type('reference', type)) {
+    return resolveReferenceInput(type)
+  }
+
+  // String input with a select
+  if (is.type('string', type)) {
+    return resolveStringInput(type)
+  }
+
+  return null
+}
+
+export default function resolveInputComponent(type) {
   const customResolver = getCustomResolver()
 
   const custom = customResolver && customResolver(type)
@@ -62,13 +49,7 @@ export default function inputResolver(type) {
     return type.inputComponent
   }
 
-  if (type.name === 'reference') {
-    return resolveReference(type)
-  }
-
-  if (type.name === 'array') {
-    return ArrayInput || SanityArray
-  }
-
-  return typeInputMap[type.name]
+  return resolveTypeVariants(type)
+    || customInputs[type.name]
+    || defaultInputs[type.name]
 }