I want to be able to define collections of input elements, which can be combined with set of properties.
Some possible input types
text
number
date
time
checkbox
or group
radio buttons group
dropdown
with autocomplete
Instead of setting every field definition individually, the user would import from a set of components and use with the FieldTemplates builder
import { datePicker, autocomplete } from '@lit-any/paper-elements';
import { FieldTemplates } from 'lit-any';
// simple rendering
FieldTemplates.default.when
.fieldMatches(f => t.type === 'date')
.renders(datePicker());
// a factory function could accept extra parameters for the control
FieldTemplates.default.when
.fieldMatches(f => t.type === 'Person')
.renders(autocomplete({
suggestions: (text, field) => loadPeople(field.suggestionsUrl, text),
}));
Default binding
A most common JS-native set of types could be used to define basic controls
string -> <input type=text>
number -> <input type=number>
boolean -> <input type=checkbox>
date -> <input type=date>
Common mappings would be defined simply by calling a method on the registry, which would do
all default calls to set up individual controls to render for the default types.
import * as PaperElements from '@lit-any/paper-elements';
FieldTemplates.default
.useCollection(PaperElements);
Binding to vocabulary
Finally a custom vocabulary could be set up to combine its terms with controls coming from collections.
import Schema from '@lit-html/vocabulary/schema.org';
import * as PaperElements from '@lit-any/paper-elements';
Schema(FieldTemplates.default)
.useCollection(PaperElements);
Such call would do all the set up, as supported by PaperElements collections to pair schema.org types with controls. For example using <paper-checbox> for https://schema.org/Boolean
I want to be able to define collections of input elements, which can be combined with set of properties.
Some possible input types
Instead of setting every field definition individually, the user would import from a set of components and use with the
FieldTemplates
builderDefault binding
A most common JS-native set of types could be used to define basic controls
Common mappings would be defined simply by calling a method on the registry, which would do all default calls to set up individual controls to render for the default types.
Binding to vocabulary
Finally a custom vocabulary could be set up to combine its terms with controls coming from collections.
Such call would do all the set up, as supported by
PaperElements
collections to pair schema.org types with controls. For example using<paper-checbox>
forhttps://schema.org/Boolean