@bpmn-io/form-js-viewer
Advanced tools
Comparing version 0.2.4 to 0.3.0
import { isArray, isFunction, isNumber, bind, assign, get, set, isString } from 'min-dash'; | ||
import snarkdown from 'snarkdown'; | ||
import snarkdown from '@bpmn-io/snarkdown'; | ||
import { jsx, jsxs } from 'preact/jsx-runtime'; | ||
@@ -641,8 +641,10 @@ import { useContext, useState, useCallback } from 'preact/hooks'; | ||
/** | ||
* Import schema adding `_id`, `_parent` and `_path` information to each field and adding it to the form field registry. | ||
* Import schema adding `id`, `_parent` and `_path` | ||
* information to each field and adding it to the | ||
* form field registry. | ||
* | ||
* @param {any} schema | ||
* @param {any} data | ||
* @param {any} [data] | ||
* | ||
* @returns {Promise} | ||
* @return { { warnings: Array<any>, schema: any, data: any } } | ||
*/ | ||
@@ -652,20 +654,27 @@ | ||
importSchema(schema, data = {}) { | ||
this._formFieldRegistry.clear(); // TODO: Add warnings | ||
// TODO: Add warnings | ||
const warnings = []; | ||
return new Promise((resolve, reject) => { | ||
try { | ||
this.importFormField(schema, data); | ||
} catch (err) { | ||
err.warnings = warnings; | ||
reject(err); | ||
} | ||
resolve({ | ||
warnings | ||
}); | ||
}); | ||
try { | ||
const importedData = clone(data); | ||
const importedSchema = this.importFormField(clone(schema), importedData); | ||
return { | ||
warnings, | ||
schema: importedSchema, | ||
data: importedData | ||
}; | ||
} catch (err) { | ||
err.warnings = warnings; | ||
throw err; | ||
} | ||
} | ||
/** | ||
* @param {any} formField | ||
* @param {Object} [data] | ||
* @param {string} [parentId] | ||
* | ||
* @return {any} field | ||
*/ | ||
importFormField(formField, data = {}, parentId) { | ||
@@ -675,3 +684,4 @@ const { | ||
key, | ||
type | ||
type, | ||
id = generateIdForType(type) | ||
} = formField; | ||
@@ -699,11 +709,17 @@ | ||
const _id = generateIdForType(type); // Set form field ID | ||
if (id) { | ||
this._formFieldRegistry.forEach(formField => { | ||
if (formField.id === id) { | ||
throw new Error(`form field with id <${id}> already exists`); | ||
} | ||
}); | ||
} // Set form field ID | ||
formField._id = _id; | ||
formField.id = id; | ||
this._formFieldRegistry.set(_id, formField); | ||
this._formFieldRegistry.set(id, formField); | ||
if (components) { | ||
this.importFormFields(components, data, _id); | ||
this.importFormFields(components, data, id); | ||
} | ||
@@ -730,3 +746,3 @@ | ||
const ALLOWED_NODES = ['h1', 'h2', 'h3', 'h4', 'h5', 'span', 'em', 'a', 'p', 'div', 'ul', 'ol', 'li', 'hr', 'blockquote', 'img', 'pre', 'code', 'br', 'strong']; | ||
const ALLOWED_ATTRIBUTES = ['align', 'alt', 'class', 'href', 'id', 'name', 'src']; | ||
const ALLOWED_ATTRIBUTES = ['align', 'alt', 'class', 'href', 'id', 'name', 'rel', 'target', 'src']; | ||
const ALLOWED_URI_PATTERN = /^(?:(?:(?:f|ht)tps?|mailto|tel|callto|cid|xmpp):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i; // eslint-disable-line no-useless-escape | ||
@@ -802,2 +818,7 @@ | ||
} | ||
} // force noopener on target="_blank" links | ||
if (lcTag === 'a' && node.getAttribute('target') === '_blank' && node.getAttribute('rel') !== 'noopener') { | ||
node.setAttribute('rel', 'noopener'); | ||
} | ||
@@ -830,2 +851,6 @@ | ||
return false; | ||
} | ||
if (lcName === 'target' && value !== '_blank') { | ||
return false; | ||
} // allow valid url links only | ||
@@ -867,3 +892,3 @@ | ||
const type = 'button'; | ||
const type$6 = 'button'; | ||
function Button(props) { | ||
@@ -878,3 +903,3 @@ const { | ||
return jsx("div", { | ||
class: formFieldClasses(type), | ||
class: formFieldClasses(type$6), | ||
children: jsx("button", { | ||
@@ -890,10 +915,4 @@ class: "fjs-button", | ||
Button.create = function (options = {}) { | ||
const _id = generateIdForType(type); | ||
return { | ||
action: 'submit', | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type, | ||
...options | ||
@@ -903,4 +922,5 @@ }; | ||
Button.type = type; | ||
Button.type = type$6; | ||
Button.label = 'Button'; | ||
Button.keyed = true; | ||
@@ -964,3 +984,3 @@ function Description(props) { | ||
const type$1 = 'checkbox'; | ||
const type$5 = 'checkbox'; | ||
function Checkbox(props) { | ||
@@ -975,3 +995,3 @@ const { | ||
description, | ||
_id, | ||
id, | ||
label | ||
@@ -990,5 +1010,5 @@ } = field; | ||
return jsxs("div", { | ||
class: formFieldClasses(type$1, errors), | ||
class: formFieldClasses(type$5, errors), | ||
children: [jsx(Label, { | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
label: label, | ||
@@ -1000,3 +1020,3 @@ required: false, | ||
disabled: disabled, | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
type: "checkbox", | ||
@@ -1014,15 +1034,9 @@ onChange: onChange | ||
Checkbox.create = function (options = {}) { | ||
const _id = generateIdForType(type$1); | ||
return { | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type: type$1, | ||
...options | ||
return { ...options | ||
}; | ||
}; | ||
Checkbox.type = type$1; | ||
Checkbox.type = type$5; | ||
Checkbox.label = 'Checkbox'; | ||
Checkbox.keyed = true; | ||
@@ -1061,3 +1075,3 @@ const FormRenderContext = createContext({ | ||
const noop = () => false; | ||
const noop$1 = () => false; | ||
@@ -1092,8 +1106,9 @@ function FormField(props) { | ||
const fieldErrors = findErrors(errors, _path); | ||
const disabled = properties.readOnly || field.disabled || false; | ||
return jsx(Element, { | ||
field: field, | ||
children: jsx(FormFieldComponent, { ...props, | ||
disabled: properties.readOnly || false, | ||
disabled: disabled, | ||
errors: fieldErrors, | ||
onChange: properties.readOnly ? noop : onChange, | ||
onChange: disabled ? noop$1 : onChange, | ||
value: value | ||
@@ -1113,5 +1128,2 @@ }) | ||
const { | ||
_id | ||
} = field; | ||
const { | ||
components = [] | ||
@@ -1122,6 +1134,6 @@ } = field; | ||
field: field, | ||
children: [components.map(field => { | ||
children: [components.map(childField => { | ||
return createElement(FormField, { ...props, | ||
key: _id, | ||
field: field | ||
key: childField.id, | ||
field: childField | ||
}); | ||
@@ -1133,9 +1145,4 @@ }), components.length ? null : jsx(Empty, {})] | ||
Default.create = function (options = {}) { | ||
const _id = generateIdForType(this.type); | ||
return { | ||
components: [], | ||
_id, | ||
label: this.label, | ||
type: this.type, | ||
...options | ||
@@ -1146,3 +1153,3 @@ }; | ||
Default.type = 'default'; | ||
Default.label = 'Default'; | ||
Default.keyed = false; | ||
@@ -1246,3 +1253,3 @@ /** | ||
const noop$1 = () => {}; | ||
const noop = () => {}; | ||
@@ -1257,5 +1264,5 @@ function FormComponent(props) { | ||
const { | ||
onSubmit = noop$1, | ||
onReset = noop$1, | ||
onChange = noop$1 | ||
onSubmit = noop, | ||
onReset = noop, | ||
onChange = noop | ||
} = props; | ||
@@ -1284,3 +1291,3 @@ | ||
const type$2 = 'number'; | ||
const type$4 = 'number'; | ||
function Number(props) { | ||
@@ -1291,7 +1298,7 @@ const { | ||
field, | ||
value | ||
value = '' | ||
} = props; | ||
const { | ||
description, | ||
_id, | ||
id, | ||
label, | ||
@@ -1315,5 +1322,5 @@ validate = {} | ||
return jsxs("div", { | ||
class: formFieldClasses(type$2, errors), | ||
class: formFieldClasses(type$4, errors), | ||
children: [jsx(Label, { | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
label: label, | ||
@@ -1324,3 +1331,3 @@ required: required | ||
disabled: disabled, | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
onInput: onChange, | ||
@@ -1338,14 +1345,8 @@ type: "number", | ||
Number.create = function (options = {}) { | ||
const _id = generateIdForType(type$2); | ||
return { | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type: type$2, | ||
...options | ||
return { ...options | ||
}; | ||
}; | ||
Number.type = type$2; | ||
Number.type = type$4; | ||
Number.keyed = true; | ||
Number.label = 'Number'; | ||
@@ -1363,3 +1364,3 @@ | ||
description, | ||
_id, | ||
id, | ||
label, | ||
@@ -1387,3 +1388,3 @@ validate = {}, | ||
return jsx(Label, { | ||
id: prefixId(`${_id}-${index}`), | ||
id: prefixId(`${id}-${index}`), | ||
label: v.label, | ||
@@ -1395,7 +1396,7 @@ required: false, | ||
disabled: disabled, | ||
id: prefixId(`${_id}-${index}`), | ||
id: prefixId(`${id}-${index}`), | ||
type: "radio", | ||
onClick: () => onChange(v.value) | ||
}) | ||
}); | ||
}, v.value); | ||
}), jsx(Description, { | ||
@@ -1410,9 +1411,3 @@ description: description | ||
Radio.create = function (options = {}) { | ||
const _id = generateIdForType(type$3); | ||
return { | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type: type$3, | ||
values: [{ | ||
@@ -1428,4 +1423,5 @@ label: 'Value', | ||
Radio.label = 'Radio'; | ||
Radio.keyed = true; | ||
const type$4 = 'select'; | ||
const type$2 = 'select'; | ||
function Select(props) { | ||
@@ -1440,3 +1436,3 @@ const { | ||
description, | ||
_id, | ||
id, | ||
label, | ||
@@ -1460,4 +1456,5 @@ validate = {}, | ||
return jsxs("div", { | ||
class: formFieldClasses(type$4, errors), | ||
class: formFieldClasses(type$2, errors), | ||
children: [jsx(Label, { | ||
id: prefixId(id), | ||
label: label, | ||
@@ -1468,3 +1465,3 @@ required: required | ||
disabled: disabled, | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
onChange: onChange, | ||
@@ -1474,7 +1471,7 @@ value: value, | ||
value: "" | ||
}), values.map((v, index) => { | ||
}), values.map(v => { | ||
return jsx("option", { | ||
value: v.value, | ||
children: v.label | ||
}); | ||
}, v.value); | ||
})] | ||
@@ -1490,9 +1487,3 @@ }), jsx(Description, { | ||
Select.create = function (options = {}) { | ||
const _id = generateIdForType(type$4); | ||
return { | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type: type$4, | ||
values: [{ | ||
@@ -1506,6 +1497,7 @@ label: 'Value', | ||
Select.type = type$4; | ||
Select.type = type$2; | ||
Select.label = 'Select'; | ||
Select.keyed = true; | ||
const type$5 = 'text'; | ||
const type$1 = 'text'; | ||
function Text(props) { | ||
@@ -1519,3 +1511,3 @@ const { | ||
return jsx("div", { | ||
class: formFieldClasses(type$5), | ||
class: formFieldClasses(type$1), | ||
children: jsx(Markup, { | ||
@@ -1529,8 +1521,4 @@ markup: safeMarkdown(text), | ||
Text.create = function (options = {}) { | ||
const _id = generateIdForType(type$5); | ||
return { | ||
_id, | ||
text: '# Text', | ||
type: type$5, | ||
...options | ||
@@ -1540,5 +1528,6 @@ }; | ||
Text.type = type$5; | ||
Text.type = type$1; | ||
Text.keyed = false; | ||
const type$6 = 'textfield'; | ||
const type = 'textfield'; | ||
function Textfield(props) { | ||
@@ -1553,3 +1542,3 @@ const { | ||
description, | ||
_id, | ||
id, | ||
label, | ||
@@ -1572,5 +1561,5 @@ validate = {} | ||
return jsxs("div", { | ||
class: formFieldClasses(type$6, errors), | ||
class: formFieldClasses(type, errors), | ||
children: [jsx(Label, { | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
label: label, | ||
@@ -1581,3 +1570,3 @@ required: required | ||
disabled: disabled, | ||
id: prefixId(_id), | ||
id: prefixId(id), | ||
onInput: onChange, | ||
@@ -1595,15 +1584,9 @@ type: "text", | ||
Textfield.create = function (options = {}) { | ||
const _id = generateIdForType(type$6); | ||
return { | ||
_id, | ||
key: _id, | ||
label: this.label, | ||
type: type$6, | ||
...options | ||
return { ...options | ||
}; | ||
}; | ||
Textfield.type = type$6; | ||
Textfield.type = type; | ||
Textfield.label = 'Text Field'; | ||
Textfield.keyed = true; | ||
@@ -1722,2 +1705,3 @@ const formFields = [Button, Checkbox, Default, Number, Radio, Select, Text, Textfield]; | ||
* data: Data, | ||
* initialData: Data, | ||
* errors: Errors, | ||
@@ -1751,2 +1735,3 @@ * properties: FormProperties, | ||
this._state = { | ||
initialData: null, | ||
data: null, | ||
@@ -1757,8 +1742,2 @@ properties, | ||
}; | ||
/** | ||
* @private | ||
* @type {Data} | ||
*/ | ||
this._importedData = null; | ||
this.get = injector.get; | ||
@@ -1773,10 +1752,32 @@ this.invoke = injector.invoke; | ||
clear() { | ||
// Clear form services | ||
this._emit('diagram.clear'); // Clear diagram services (e.g. EventBus) | ||
this._emit('form.clear'); | ||
this.get('formFieldRegistry').clear(); | ||
} | ||
/** | ||
* Destroy the form, removing it from DOM, | ||
* if attached. | ||
*/ | ||
destroy() { | ||
this.get('eventBus').fire('form.destroy'); | ||
// Destroy form services | ||
this.get('eventBus').fire('form.destroy'); // Destroy diagram services (e.g. EventBus) | ||
this.get('eventBus').fire('diagram.destroy'); | ||
this._detach(false); | ||
} | ||
/** | ||
* Open a form schema with the given initial data. | ||
* | ||
* @param {Schema} schema | ||
* @param {Data} [data] | ||
* | ||
* @return Promise<{ warnings: Array<any> }> | ||
*/ | ||
@@ -1786,27 +1787,38 @@ | ||
importSchema(schema, data = {}) { | ||
this._importedData = null; | ||
return new Promise((resolve, reject) => { | ||
const importer = this.get('importer'); | ||
schema = clone(schema); | ||
data = clone(data); | ||
importer.importSchema(schema, data).then(({ | ||
warnings | ||
}) => { | ||
this._importedData = clone(data); | ||
try { | ||
this.clear(); | ||
const { | ||
schema: importedSchema, | ||
data: importedData, | ||
warnings | ||
} = this.get('importer').importSchema(schema, data); | ||
this._setState({ | ||
data, | ||
data: importedData, | ||
errors: {}, | ||
schema | ||
schema: importedSchema, | ||
initialData: clone(importedData) | ||
}); | ||
resolve({ | ||
this._emit('import.done', { | ||
warnings | ||
}); | ||
}).catch(err => { | ||
reject(err); | ||
}); | ||
return resolve({ | ||
warnings | ||
}); | ||
} catch (error) { | ||
this._emit('import.done', { | ||
error, | ||
warnings: error.warnings || [] | ||
}); | ||
return reject(error); | ||
} | ||
}); | ||
} | ||
/** | ||
* Submit the form, triggering all field validations. | ||
* | ||
* @returns { { data: Data, errors: Errors } } | ||
@@ -1857,3 +1869,3 @@ */ | ||
this._setState({ | ||
data: clone(this._importedData), | ||
data: clone(this._state.initialData), | ||
errors: {} | ||
@@ -1924,2 +1936,4 @@ }); | ||
/** | ||
* @private | ||
* | ||
* @param {boolean} [emit] | ||
@@ -1958,2 +1972,3 @@ */ | ||
* @param {FormEvent} type | ||
* @param {number} priority | ||
* @param {Function} handler | ||
@@ -1963,4 +1978,4 @@ */ | ||
on(type, handler) { | ||
this.get('eventBus').on(type, handler); | ||
on(type, priority, handler) { | ||
this.get('eventBus').on(type, priority, handler); | ||
} | ||
@@ -1974,5 +1989,7 @@ /** | ||
off(type, handler) { | ||
this.get('eventBus').on(type, handler); | ||
this.get('eventBus').off(type, handler); | ||
} | ||
/** | ||
* @private | ||
* | ||
* @param {FormOptions} options | ||
@@ -2001,3 +2018,7 @@ * @param {Element} container | ||
} | ||
/** | ||
* @private | ||
*/ | ||
_emit(type, data) { | ||
@@ -2007,2 +2028,4 @@ this.get('eventBus').fire(type, data); | ||
/** | ||
* @internal | ||
* | ||
* @param { { add?: boolean, field: any, remove?: number, value?: any } } update | ||
@@ -2036,7 +2059,15 @@ */ | ||
} | ||
/** | ||
* @internal | ||
*/ | ||
_getState() { | ||
return this._state; | ||
} | ||
/** | ||
* @internal | ||
*/ | ||
_setState(state) { | ||
@@ -2052,3 +2083,3 @@ this._state = { ...this._state, | ||
const schemaVersion = 1; | ||
const schemaVersion = 2; | ||
/** | ||
@@ -2055,0 +2086,0 @@ * @typedef { import('didi').Injector } Injector |
@@ -0,10 +1,66 @@ | ||
/** | ||
* @typedef { import('didi').Injector } Injector | ||
* | ||
* @typedef { { [x: string]: any } } Data | ||
* @typedef { { [x: string]: string[] } } Errors | ||
* @typedef { any[] } Modules | ||
* @typedef { ('readOnly' | string) } FormProperty | ||
* @typedef { ('submit' | 'changed' | string) } FormEvent | ||
* @typedef { { [x: string]: any } } FormProperties | ||
* @typedef { any } Schema | ||
* | ||
* @typedef { { | ||
* additionalModules?: Modules, | ||
* container?: Element|string, | ||
* injector?: Injector, | ||
* modules?: Modules, | ||
* properties?: FormProperties | ||
* } } FormOptions | ||
* | ||
* @typedef { { | ||
* data: Data, | ||
* initialData: Data, | ||
* errors: Errors, | ||
* properties: FormProperties, | ||
* schema: Schema | ||
* } } State | ||
*/ | ||
export default class Form { | ||
/** | ||
* @constructor | ||
* @param {FormOptions} options | ||
*/ | ||
constructor(options?: FormOptions); | ||
/** | ||
* @private | ||
* @type {Element} | ||
*/ | ||
private _container; | ||
/** | ||
* @private | ||
* @type {State} | ||
*/ | ||
private _state; | ||
private _importedData; | ||
get: any; | ||
invoke: any; | ||
clear(): void; | ||
/** | ||
* Destroy the form, removing it from DOM, | ||
* if attached. | ||
*/ | ||
destroy(): void; | ||
/** | ||
* Open a form schema with the given initial data. | ||
* | ||
* @param {Schema} schema | ||
* @param {Data} [data] | ||
* | ||
* @return Promise<{ warnings: Array<any> }> | ||
*/ | ||
importSchema(schema: Schema, data?: Data): Promise<any>; | ||
/** | ||
* Submit the form, triggering all field validations. | ||
* | ||
* @returns { { data: Data, errors: Errors } } | ||
*/ | ||
submit(): { | ||
@@ -15,11 +71,51 @@ data: Data; | ||
reset(): void; | ||
/** | ||
* @returns {Errors} | ||
*/ | ||
validate(): Errors; | ||
/** | ||
* @param {Element|string} parentNode | ||
*/ | ||
attachTo(parentNode: Element | string): void; | ||
detach(): void; | ||
_detach(emit?: boolean): void; | ||
/** | ||
* @private | ||
* | ||
* @param {boolean} [emit] | ||
*/ | ||
private _detach; | ||
/** | ||
* @param {FormProperty} property | ||
* @param {any} value | ||
*/ | ||
setProperty(property: FormProperty, value: any): void; | ||
on(type: FormEvent, handler: Function): void; | ||
/** | ||
* @param {FormEvent} type | ||
* @param {number} priority | ||
* @param {Function} handler | ||
*/ | ||
on(type: FormEvent, priority: number, handler: Function): void; | ||
/** | ||
* @param {FormEvent} type | ||
* @param {Function} handler | ||
*/ | ||
off(type: FormEvent, handler: Function): void; | ||
_createInjector(options: FormOptions, container: Element): any; | ||
_emit(type: any, data: any): void; | ||
/** | ||
* @private | ||
* | ||
* @param {FormOptions} options | ||
* @param {Element} container | ||
* | ||
* @returns {Injector} | ||
*/ | ||
private _createInjector; | ||
/** | ||
* @private | ||
*/ | ||
private _emit; | ||
/** | ||
* @internal | ||
* | ||
* @param { { add?: boolean, field: any, remove?: number, value?: any } } update | ||
*/ | ||
_update(update: { | ||
@@ -31,3 +127,9 @@ add?: boolean; | ||
}): void; | ||
/** | ||
* @internal | ||
*/ | ||
_getState(): State; | ||
/** | ||
* @internal | ||
*/ | ||
_setState(state: any): void; | ||
@@ -43,4 +145,4 @@ } | ||
export type Modules = any[]; | ||
export type FormProperty = string; | ||
export type FormEvent = string; | ||
export type FormProperty = ('readOnly' | string); | ||
export type FormEvent = ('submit' | 'changed' | string); | ||
export type FormProperties = { | ||
@@ -51,5 +153,5 @@ [x: string]: any; | ||
export type FormOptions = { | ||
additionalModules?: Modules; | ||
additionalModules?: any[]; | ||
container?: Element | string; | ||
injector?: any; | ||
injector?: Injector; | ||
modules?: Modules; | ||
@@ -60,2 +162,3 @@ properties?: FormProperties; | ||
data: Data; | ||
initialData: Data; | ||
errors: Errors; | ||
@@ -62,0 +165,0 @@ properties: FormProperties; |
declare class Importer { | ||
constructor(formFieldRegistry: import('../core/FormFieldRegistry').default, formFields: import('../render/FormFields').default); | ||
/** | ||
* @constructor | ||
* @param { import('../core/FormFieldRegistry').default } formFieldRegistry | ||
* @param { import('../render/FormFields').default } formFields | ||
*/ | ||
constructor(formFieldRegistry: Map<any, any>, formFields: import('../render/FormFields').default); | ||
_formFieldRegistry: Map<any, any>; | ||
_formFields: import("../render/FormFields").default; | ||
importSchema(schema: any, data?: any): Promise<any>; | ||
importFormField(formField: any, data: {}, parentId: any): any; | ||
/** | ||
* Import schema adding `id`, `_parent` and `_path` | ||
* information to each field and adding it to the | ||
* form field registry. | ||
* | ||
* @param {any} schema | ||
* @param {any} [data] | ||
* | ||
* @return { { warnings: Array<any>, schema: any, data: any } } | ||
*/ | ||
importSchema(schema: any, data?: any): { | ||
warnings: Array<any>; | ||
schema: any; | ||
data: any; | ||
}; | ||
/** | ||
* @param {any} formField | ||
* @param {Object} [data] | ||
* @param {string} [parentId] | ||
* | ||
* @return {any} field | ||
*/ | ||
importFormField(formField: any, data?: any, parentId?: string): any; | ||
importFormFields(components: any, data: {}, parentId: any): void; | ||
@@ -8,0 +34,0 @@ } |
@@ -0,1 +1,26 @@ | ||
/** | ||
* @typedef { import('didi').Injector } Injector | ||
* | ||
* @typedef { { [x: string]: any } } Data | ||
* @typedef { any } Schema | ||
* @typedef { any[] } Modules | ||
* @typedef { { [x: string]: any } } FormPropertyOptions | ||
* | ||
* @typedef { { | ||
* additionalModules?: Modules, | ||
* container?: Element|string, | ||
* data?: Data, | ||
* injector?: Injector, | ||
* modules?: Modules, | ||
* properties?: FormPropertyOptions, | ||
* schema: Schema | ||
* } } FormViewerOptions | ||
*/ | ||
/** | ||
* Create a form. | ||
* | ||
* @param {FormViewerOptions} options | ||
* | ||
* @return {Promise<Form>} | ||
*/ | ||
export function createForm(options: FormViewerOptions): Promise<Form>; | ||
@@ -14,6 +39,6 @@ export * from "./render"; | ||
export type FormViewerOptions = { | ||
additionalModules?: Modules; | ||
additionalModules?: any[]; | ||
container?: Element | string; | ||
data?: Data; | ||
injector?: any; | ||
injector?: Injector; | ||
modules?: Modules; | ||
@@ -24,3 +49,3 @@ properties?: FormPropertyOptions; | ||
import Form from "./Form"; | ||
export const schemaVersion: 1; | ||
export const schemaVersion: 2; | ||
export { Form }; |
@@ -5,11 +5,8 @@ declare function Button(props: any): import("preact").JSX.Element; | ||
action: string; | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
}; | ||
export { type }; | ||
export const label: string; | ||
export const keyed: boolean; | ||
} | ||
export default Button; | ||
declare const type: "button"; |
declare function Checkbox(props: any): import("preact").JSX.Element; | ||
declare namespace Checkbox { | ||
export function create(options?: {}): { | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
}; | ||
export function create(options?: {}): {}; | ||
export { type }; | ||
export const label: string; | ||
export const keyed: boolean; | ||
} | ||
export default Checkbox; | ||
declare const type: "checkbox"; |
@@ -5,9 +5,6 @@ declare function Default(props: any): import("preact").JSX.Element; | ||
components: any[]; | ||
_id: string; | ||
label: string; | ||
type: string; | ||
}; | ||
const type: string; | ||
const label: string; | ||
const keyed: boolean; | ||
} | ||
export default Default; |
declare function Number(props: any): import("preact").JSX.Element; | ||
declare namespace Number { | ||
export function create(options?: {}): { | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
}; | ||
export function create(options?: {}): {}; | ||
export { type }; | ||
export const keyed: boolean; | ||
export const label: string; | ||
@@ -11,0 +7,0 @@ } |
declare function Radio(props: any): import("preact").JSX.Element; | ||
declare namespace Radio { | ||
export function create(options?: {}): { | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
values: { | ||
@@ -15,4 +11,5 @@ label: string; | ||
export const label: string; | ||
export const keyed: boolean; | ||
} | ||
export default Radio; | ||
declare const type: "radio"; |
declare function Select(props: any): import("preact").JSX.Element; | ||
declare namespace Select { | ||
export function create(options?: {}): { | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
values: { | ||
@@ -15,4 +11,5 @@ label: string; | ||
export const label: string; | ||
export const keyed: boolean; | ||
} | ||
export default Select; | ||
declare const type: "select"; |
declare function Text(props: any): import("preact").JSX.Element; | ||
declare namespace Text { | ||
export function create(options?: {}): { | ||
_id: string; | ||
text: string; | ||
type: string; | ||
}; | ||
export { type }; | ||
export const keyed: boolean; | ||
} | ||
export default Text; | ||
declare const type: "text"; |
declare function Textfield(props: any): import("preact").JSX.Element; | ||
declare namespace Textfield { | ||
export function create(options?: {}): { | ||
_id: string; | ||
key: string; | ||
label: string; | ||
type: string; | ||
}; | ||
export function create(options?: {}): {}; | ||
export { type }; | ||
export const label: string; | ||
export const keyed: boolean; | ||
} | ||
export default Textfield; | ||
declare const type: "textfield"; |
@@ -0,1 +1,7 @@ | ||
/** | ||
* Sanitize a HTML string and return the cleaned, safe version. | ||
* | ||
* @param {string} html | ||
* @return {string} | ||
*/ | ||
export function sanitizeHTML(html: string): string; |
@@ -5,2 +5,8 @@ export default FormContext; | ||
}>; | ||
/** | ||
* @param {string} type | ||
* @param {boolean} [strict] | ||
* | ||
* @returns {any} | ||
*/ | ||
declare function getService(type: string, strict?: boolean): any; |
@@ -0,1 +1,13 @@ | ||
/** | ||
* @typedef { { container } } Config | ||
* @typedef { import('didi').Injector } Injector | ||
* @typedef { import('../core/EventBus').default } EventBus | ||
* @typedef { import('../Form').default } Form | ||
*/ | ||
/** | ||
* @param {Config} config | ||
* @param {EventBus} eventBus | ||
* @param {Form} form | ||
* @param {Injector} injector | ||
*/ | ||
declare function Renderer(config: Config, eventBus: any, form: Form, injector: any): void; | ||
@@ -7,6 +19,6 @@ declare namespace Renderer { | ||
export type Config = { | ||
container: any; | ||
container; | ||
}; | ||
export type Injector = any; | ||
export type EventBus = any; | ||
export type Form = import("../Form").default; | ||
export type Form = import('../Form').default; |
@@ -0,1 +1,6 @@ | ||
/** | ||
* @param {string?} prefix | ||
* | ||
* @returns Element | ||
*/ | ||
export function createFormContainer(prefix?: string | null): HTMLDivElement; |
@@ -8,4 +8,10 @@ export function findErrors(errors: any, path: any): any; | ||
export function generateIdForType(type: any): string; | ||
/** | ||
* @template T | ||
* @param {T} data | ||
* @param {(this: any, key: string, value: any) => any} [replacer] | ||
* @return {T} | ||
*/ | ||
export function clone<T>(data: T, replacer?: (this: any, key: string, value: any) => any): T; | ||
export * from "./injector"; | ||
export * from "./form"; |
{ | ||
"name": "@bpmn-io/form-js-viewer", | ||
"version": "0.2.4", | ||
"version": "0.3.0", | ||
"description": "View forms - powered by bpmn.io", | ||
@@ -26,3 +26,3 @@ "exports": { | ||
"dev": "npm test -- --auto-watch --no-single-run", | ||
"generate-types": "tsc --allowJs --skipLibCheck --declaration --emitDeclarationOnly --removeComments --outDir dist/types src/index.js", | ||
"generate-types": "tsc --allowJs --skipLibCheck --declaration --emitDeclarationOnly --outDir dist/types src/index.js", | ||
"test": "karma start", | ||
@@ -42,7 +42,7 @@ "prepublishOnly": "npm run build" | ||
"dependencies": { | ||
"@bpmn-io/snarkdown": "^2.1.0", | ||
"didi": "^5.2.1", | ||
"min-dash": "^3.7.0", | ||
"preact": "^10.5.12", | ||
"preact-markup": "^2.1.1", | ||
"snarkdown": "^2.0.0" | ||
"preact": "^10.5.13", | ||
"preact-markup": "^2.1.1" | ||
}, | ||
@@ -55,3 +55,3 @@ "sideEffects": [ | ||
], | ||
"gitHead": "b4764afdaefaeaf9bae4924cff713552592222eb" | ||
"gitHead": "d843d0668e69e09cad1220e9dd25a0e1cbcc1461" | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
310358
4212
+ Added@bpmn-io/snarkdown@^2.1.0
+ Added@bpmn-io/snarkdown@2.2.0(transitive)
- Removedsnarkdown@^2.0.0
- Removedsnarkdown@2.0.0(transitive)
Updatedpreact@^10.5.13