@tomino/dynamic-form-semantic-ui
Version:
Semantic UI form renderer based on dynamic form generation
139 lines • 4.42 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const form_query_data_1 = require("./form_query_data");
const dynamic_form_1 = require("@tomino/dynamic-form");
const common_1 = require("./common");
const toolbelt_1 = require("@tomino/toolbelt");
describe('Tabs', () => {
const formData = {
description: 'Some Description',
people: [
{
name: 'Tomas Trescak',
address: 'Sydney, Slovakia'
},
{
name: 'Valeria Toscani',
address: 'Sydney, Italy'
},
{
name: 'Vittoria Trescakova',
address: 'Sydney, Australia',
title: 'Princess'
}
]
};
const schema = {
type: 'object',
properties: {
people: {
type: 'array',
items: {
type: 'object',
properties: {
name: { type: 'string' },
address: { type: 'string' },
title: { type: 'string' }
}
}
}
},
required: ['name']
};
const formDefinition = form_query_data_1.create.stack({
props: {
editable: false
},
elements: [
{
control: 'Tabs',
props: {
value: { source: 'people' },
valueField: { value: 'name' },
textField: { value: 'name' }
},
elements: [
{
control: 'Grid',
props: {
rows: 1,
columns: 2,
gap: '24px'
},
elements: [
{
props: { row: 1, column: 1, value: { source: 'name' }, label: 'Name' },
control: 'Input'
},
{
props: { row: 1, column: 2, value: { source: 'address' }, label: 'Address' },
control: 'Input'
}
]
}
]
},
{
control: 'Tabs',
props: {},
elements: []
}
]
});
describe('Tabular Items', () => {
let modified = toolbelt_1.clone(formDefinition);
let menu = modified.elements[0].elements[0];
menu.props.value.source = undefined;
menu.props = {
menuItems: [
{
text: 'Tab A',
value: 'Tab A'
},
{
text: 'Tab B',
value: 'Tab B'
},
{
text: 'Tab C',
value: 'Tab C'
}
]
};
menu.elements = [
{ control: 'Text', props: { text: 'Content A' } },
{ control: 'Text', props: { text: 'Content B' } }
];
return {
component: common_1.prepareComponent(modified, schema, formData, {
showReadOnly: false,
addEditor: true
})
};
});
describe('Tabular Bound', () => {
return {
component: common_1.prepareComponent(formDefinition, schema, formData, {
addEditor: true,
showStandard: false
})
};
});
describe('Side Menu', () => {
function component() {
let modified = toolbelt_1.clone(formDefinition);
let menu = modified.elements[0].elements[0];
menu.props = {
...menu.props,
vertical: true,
secondary: true
};
const form = new dynamic_form_1.FormModel(modified, schema, formData);
return React.createElement(common_1.TestComponent, { form: form });
}
return { component };
});
});
//# sourceMappingURL=tab_view.test.js.map