Annotations plugin for Roqueform
Manages Roqueform field annotations.
npm install --save-prod @roqueform/annotations-pluginOverview
🔎 API documentation is available here.
Annotations allow to associate arbitrary data with fields.
import { createField } from 'roqueform';
import { annotationsPlugin } from '@roqueform/annotations-plugin';
const planetField = createField(
{ name: 'Pluto' },
annotationsPlugin({ isDisabled: false })
);
planetField.at('name').annotations.isDisabled // ⮕ falseUpdate annotations for a single field:
planetField.annotate({ isDisabled: true });
planetField.annotations.isDisabled // ⮕ true
planetField.at('name').annotations.isDisabled // ⮕ falseAnnotate field and all of its children recursively:
planetField.annotate({ isDisabled: true }, { recursive: true });
planetField.annotations.isDisabled // ⮕ true
// 🌕 The child field was annotated along with its parent
planetField.at('name').annotations.isDisabled // ⮕ trueAnnotations can be updated using a callback. This is especially useful in conjunction with recursive flag:
planetField.annotate(
field => {
// Toggle disabled flag for the field and its children
return { isDisabled: !field.annotations.isDisabled };
},
{ recursive: true }
);Subscribe to annotation changes:
planetField.subscribe('change:annotations', event => {
event.target.annotations;
// ⮕ { isDisabled: boolean }
});