UNPKG

@vs-form/vs-form

Version:

A schema-based form generator component for React using material-ui

163 lines (158 loc) 6.05 kB
'use strict'; function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } var React = require('react'); var React__default = _interopDefault(React); require('lodash/capitalize'); require('lodash/cloneDeep'); require('lodash/get'); require('lodash/has'); require('lodash/isArray'); require('lodash/isDate'); require('lodash/isBoolean'); require('lodash/isEmpty'); require('lodash/isFunction'); require('lodash/isInteger'); require('lodash/isNull'); require('lodash/isNumber'); require('lodash/isObject'); require('lodash/isPlainObject'); require('lodash/isRegExp'); require('lodash/isString'); var isUndefined = _interopDefault(require('lodash/isUndefined')); require('lodash/merge'); require('lodash/set'); require('lodash/toInteger'); require('lodash/toNumber'); require('lodash/trimEnd'); require('lodash/uniq'); require('lodash/debounce'); require('lodash/throttle'); require('./chunk-e8808437.js'); require('@material-ui/core/FormControl'); require('@material-ui/core/FormHelperText'); require('@material-ui/core/FormLabel'); require('@material-ui/core/TextField'); require('@material-ui/core/InputAdornment'); require('./chunk-7581cbb1.js'); require('@material-ui/core/Tooltip'); var __chunk_4 = require('./chunk-364f6801.js'); require('@material-ui/core/styles'); var classNames = _interopDefault(require('classnames')); require('@material-ui/core/Icon'); require('@material-ui/core/SvgIcon'); require('./chunk-41ea4037.js'); require('./chunk-2f21f066.js'); require('date-fns'); require('events'); require('@material-ui/core/Typography'); require('./chunk-819d0a62.js'); require('@material-ui/core/Grid'); require('@material-ui/core/IconButton'); require('./chunk-f9facc49.js'); var AppBar = _interopDefault(require('@material-ui/core/AppBar')); var Tabs = _interopDefault(require('@material-ui/core/Tabs')); var Tab = _interopDefault(require('@material-ui/core/Tab')); var Paper = _interopDefault(require('@material-ui/core/Paper')); const styles = { tabIcon: { fontSize: '2em', paddingRight: '5px', paddingBottom: '35px' } }; class VsTabs extends React.Component { constructor(props) { super(props); this.PaperProps = {}; this.AppBarProps = {}; this.TabsProps = {}; this.TabProps = {}; this.IconProps = {}; this.componentEventParams = this.props.schemaManager.getComponentEventParams(this.props.comp); this.handleChange = (_event, value) => { let canChange = true; const params = { ...this.componentEventParams, newTab: value }; if (this.comp.onBeforeChange) { const p = { ...params, canChange: true }; this.comp.onBeforeChange(p); canChange = p.canChange; } if (canChange) { this.setState({ activeTab: value }); this.props.schemaManager.changeActiveTab(this.comp, value, this.props.designMode); if (this.comp.onChange) { this.comp.onChange(params); } } }; this.getTabs = () => { const list = this.comp.tabs.filter((key) => { const comp = this.props.schema.components[key]; return comp && !comp.hidden; }).map((key) => this.props.schema.components[key]); if (list.length === 0) { return null; } const compList = []; list.forEach((t) => { const { comp, ...other } = this.props; const c = t; const Icon = __chunk_4.getIcon({ comp: c, ...other }); const entry = (React.createElement(Tab, Object.assign({ key: c.id, label: c.label, icon: Icon && React.createElement(Icon, Object.assign({}, this.IconProps)) }, this.TabProps))); compList.push(entry); }); return compList; }; this.getComponent = () => { let c = null; if (this.comp.tabs.length > this.state.activeTab) { const tab = this.comp.tabs[this.state.activeTab]; const { classes, ...other } = this.props; c = React.createElement(__chunk_4.Item, Object.assign({}, other, { node: tab, comp: this.props.schema.components[tab] })); } return c; }; this.initProps(); if (isUndefined(this.comp.activeTab)) { this.comp.activeTab = 0; } const activeTab = this.comp.activeTab || 0; this.state = { activeTab }; } get comp() { return this.props.comp; } render() { return (React.createElement(Paper, Object.assign({}, this.PaperProps), React.createElement(AppBar, Object.assign({}, this.AppBarProps), React.createElement(Tabs, Object.assign({ value: this.state.activeTab, onChange: this.handleChange }, this.TabsProps), this.getTabs())), this.getComponent())); } initProps() { const { AppBarProps, TabsProps, TabProps, IconProps, ...PaperProps } = this.comp.props; if (PaperProps) { this.PaperProps = PaperProps; } if (AppBarProps) { this.AppBarProps = AppBarProps; } if (TabsProps) { this.TabsProps = TabsProps; } if (TabProps) { this.TabProps = TabProps; } if (IconProps) { this.IconProps = IconProps; } this.IconProps.className = classNames(this.IconProps.className, this.props.classes.tabIcon); if (isUndefined(this.AppBarProps.position)) { this.AppBarProps.position = 'static'; } if (isUndefined(this.AppBarProps.color)) { this.AppBarProps.color = 'default'; } } } exports.default = VsTabs; exports.styles = styles;