Definition Shorthand
Form's model & resources objects are very descriptive, making a lot of definitions be defined by object
s to allow more current / future sub definitions expandable.
For example - a field formatter definition is an object which contains the name
of the formatter resource, and optional args
object.
birthDate.formatter = { name: 'join', args: { separator: ';' } }
Sometimes, only the name
is defined, making the definition be larger with no good reason.
birthDate.formatter = { name: 'toDate' }
For these and more cases Cofi offers a definition shorthand
, allowing shorter model and resources objects to be defined and passed to the Form.
Internally, we first transpile the given model and resources to their expanded structures, and store / manage the form using the expanded structures (to avoid a lot of if-else
in the code and potential bugs). This means that all places which expose model and resources do it with the expanded (transpiled) objects (such as hooks that pass model and resources to the hook handlers).
The following sections list and demonstrate the available shorthand for form definition.
Components
Optional shorthand for components:
- Define field's component as a
string
// shorthand
model.fields.firstName.component = 'InputText';
// transpiles to
model.fields.firstName.component = { name: 'InputText' };
- Define component resource as a
function
const Greeting = ({ value }) => `Hi ${value}`;
// shorthand
resources.components.Greeting = Greeting;
// transpiles to
resources.components.Greeting = { renderer: Greeting };
- Define field's component as a
function
. In this case there is no need to have a definition in the resources object.
const Greeting = ({ value }) => `Hi ${value}`;
// shorthand
model.fields.firstName.component = Greeting;
// transpiles to
model.fields.firstName.component = { name: 'component1' };
resources.components.component1 = { renderer: Greeting };
Formatters Parsers
Optional shorthand for formatters / parsers:
- Define field's formatter as a
string
// shorthand
model.fields.birthDate.formatter = 'toDate';
// transpiles to
model.fields.birthDate.formatter = { name: 'toDate' };
- Define formatter resource as a
function
const addPrefix = ({ value }) => `Hi ${value}`;
// shorthand
resources.conversions.addPrefix = addPrefix;
// transpiles to
resources.conversions.addPrefix = { func: addPrefix };
- Define field's formatter as a
function
. In this case there is no need to have a definition in the resources object.
const addPrefix = ({ value }) => `Hi ${value}`;
// shorthand
model.fields.birthDate.formatter = addPrefix;
// transpiles to
model.fields.birthDate.formatter = { name: 'formatter1' };
resources.conversions.formatter1 = { func: addPrefix };
Dependencies Change
Optional shorthand for dependencies change:
- Define field's dependenciesChange as a
string
// shorthand
model.fields.city.dependenciesChange = 'handleCountryChange';
// transpiles to
model.fields.city.dependenciesChange = { name: 'handleCountryChange' };
- Define dependenciesChange resource as a
function
const handleCountryChange = () => {};
// shorthand
resources.conversions.handleCountryChange = handleCountryChange;
// transpiles to
resources.conversions.handleCountryChange = { func: handleCountryChange };
- Define field's dependenciesChange as a
function
. In this case there is no need to have a definition in the resources object.
const handleCountryChange = () => {};
// shorthand
model.fields.city.dependenciesChange = handleCountryChange;
// transpiles to
model.fields.city.dependenciesChange = { name: 'dependenciesChange1' };
resources.conversions.dependenciesChange1 = { func: handleCountryChange };
Validators
Optional shorthand for validators:
- Define field's validator (in the validators array) as a
string
// shorthand
model.fields.firstName.validators = ['unique'];
// transpiles to
model.fields.firstName.validators = [{ name: 'unique' }];
- Define validator resource as a
function
const unique = () => {};
// shorthand
resources.validators.unique = unique;
// transpiles to
resources.validators.unique = { func: unique };
- Define field's validator as a
function
. In this case there is no need to have a definition in the resources object.
const unique = () => {};
// shorthand
model.fields.firstName.validators = [unique];
// transpiles to
model.fields.firstName.validators = { name: 'validator1' };
resources.validators.validator1 = { func: unique };
Terms
Optional shorthand for terms (excludeTerms / disableTerms / requireTerms):
- Define field's logical term as a
string
// shorthand
model.fields.firstName.disableTerm = 'isNotAllowed';
model.fields.lastName.disableTerm = { // conditional term
operator: 'or',
terms: [
'isNotAllowed', // logical term
{ name: 'empty', args: { fieldId: 'firstName' } } // logical term
],
};
// transpiles to
model.fields.firstName.disableTerm = { name: 'isNotAllowed' };
model.fields.lastName.disableTerm = {
operator: 'or',
terms: [
{ name: 'isNotAllowed' }
{ name: 'empty', args: { fieldId: 'firstName' } }
],
};
- Define term resource as a
function
const isNotAllowed = () => {};
// shorthand
resources.terms.isNotAllowed = isNotAllowed;
// transpiles to
resources.terms.isNotAllowed = { func: isNotAllowed };
- Define field's term logical term as a
function
. In this case there is no need to have a definition in the resources object.
const isNotAllowed = () => {};
// shorthand
model.fields.firstName.disableTerm = isNotAllowed;
// transpiles to
model.fields.firstName.disableTerm = { name: 'term1' };
resources.terms.term1 = { func: isNotAllowed };