Options
All
  • Public
  • Public/Protected
  • All
Menu

External module "ext/CvFormPanel"

Index

Interfaces

Variables

Object literals

Variables

CvFormBottomSplitPane

CvFormBottomSplitPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[0]}</div></div><div className="row"><div className="col-sm-6 cv-split-pane">{formComponents[1]}</div><div className="col-sm-6 cv-split-pane">{formComponents.length > 2 ? formComponents[2] : null}</div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 3; i < formComponents.length; i++){elems.push(<div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvFormFourBoxSplitPane

CvFormFourBoxSplitPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-6 cv-split-pane">{formComponents[0]}</div><div className="col-sm-6 cv-split-pane">{formComponents[1]}</div></div><div className="row"><div className="col-sm-6 cv-split-pane">{formComponents.length > 2 ? formComponents[2] : null}</div><div className="col-sm-6 cv-split-pane">{formComponents.length > 3 ? formComponents[3] : null}</div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 4; i < formComponents.length; i++){elems.push(<div className="row" key={i}><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvFormItemPanel

CvFormItemPanel: ClassicComponentClass<CvFormItemPanelProps> = React.createClass<CvFormItemPanelProps, CvState>({mixins: [CvBaseMixin],componentWillMount: function() {if(!this.props.viewMenuElement) {this.setState({viewLoaded:'default_view'});}},getDefaultProps: function () {return {displayElement: null, paneContext: null, menuElement: null, viewMenuElement: null, initOpen:true, index:1}},getInitialState: function() {return {viewLoaded:null}},render: function () {if (this.props.paneContext && this.props.displayElement) {const paneId = (this.props.paneContext as PaneContext).paneDef.paneId;const zindex = 100 - this.props.index;return (<div className="cv-panel panel panel-primary animated fadeIn" style={{position: 'relative', zIndex: zindex}}><div className="cv-panel-heading panel-heading"><div className="row"><div className="col-sm-3"><span className="cv-panel-title">{this.findPaneTitle(this.props.paneContext)}</span><a role="button" className="cv-panel-toggle" data-toggle="collapse" href={'#'+paneId}aria-expanded="true" aria-controls={paneId}></a></div><div className="col-sm-3 col-sm-offset-6"><div className="pull-right cv-panel-menu-item">{this.props.menuElement}</div><div className="pull-right">{this.props.viewMenuElement ? React.cloneElement(this.props.viewMenuElement, {viewLoadedListener: this._viewLoaded}) : null}</div></div></div></div><div className={this.props.initOpen ? 'collapse in' : 'collapse'} id={paneId}><div className="cv-panel-body">{this.state.viewLoaded ? this.props.displayElement : null}</div></div></div>);} else {return null;}},_viewLoaded: function(viewId:string) {if(!this.state.viewLoaded || this.state.viewLoaded != viewId) {this.setState({viewLoaded: viewId});}}})

CvFormLeftSplitPane

CvFormLeftSplitPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-6"><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[0]}</div></div><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[1]}</div></div></div><div className="col-sm-6 cv-split-pane">{formComponents.length > 2 ? formComponents[2] : null}</div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 3; i < formComponents.length; i++){elems.push(<div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvFormOptionsLayoutPane

CvFormOptionsLayoutPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-12 cv-option-pane">{formComponents[0]}</div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 1; i < formComponents.length; i++){elems.push(<div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvFormPanel

CvFormPanel: ClassicComponentClass<CvFormPanelProps> = React.createClass<CvFormPanelProps, CvFormPanelState>({mixins: [CvBaseMixin],componentDidMount: function () {},getChildContext: function () {const ctx = this.getDefaultChildContext();ctx.cvContext.scopeCtx.scopeObj = this.formContext();return ctx;},getDefaultProps: function () {return {formContext: null,navigationListeners: [],actionListeners: [],navTarget: null,layoutOverrideElem: null,stateChangeListeners: [],formComponentProvider: null,displayProperties: new CvDisplayProperties(),displayPropChangeListeners: []}},render: function () {const formContext = this.formContext();if (formContext) {if (this.props.renderer) {return this.props.renderer(this.getChildContext().cvContext);} else {const defaultProvider = this._getDefaultFormComponentProvider();return <CvForm formContext={this.formContext()}stateChangeListeners={this.props.stateChangeListeners}childFormComponentRenderer={defaultProvider.getChildFormComponentRenderer()}detailsComponentRenderer={defaultProvider.getDetailsComponentRenderer()}listComponentRenderer={defaultProvider.getListComponentRenderer()}mapComponentRenderer={defaultProvider.getMapComponentRenderer()}printMarkupComponentRenderer={defaultProvider.getPrintMarkupComponentRenderer()}graphComponentRenderer={defaultProvider.getGraphComponentRenderer()}calendarComponentRenderer={defaultProvider.getCalendarComponentRenderer()}barcodeScanComponentRenderer={defaultProvider.getBarcodeScanComponentRenderer()}imagePickerComponentRenderer={defaultProvider.getImagePickerComponentRenderer()}geoFixComponentRenderer={defaultProvider.getGeoFixComponentRenderer()}geoLocationComponentRenderer={defaultProvider.getGeoLocationComponentRenderer()}formRenderer={defaultProvider.getFormRenderer()}/>}} else {return null;}},customFormComponentProvider: function() {return this.props.formComponentProvider;},formContext: function () {return this.props.formContext || this.firstInScope(FormContext);},/*This (default) component provider checks to see if there is a supplied customFormComponentProvider andwhether or not it has provided a custom component of a particular type. If it has provided a component ofa particular type, the custom component will be returned instead of the default component*/_getDefaultFormComponentProvider: function():CvFormComponentProvider {//override this provider with a custom providerconst customProvider = this.customFormComponentProvider();return {getFormRenderer: () => {return (customProvider && customProvider.getFormRenderer) ? customProvider.getFormRenderer() :(cvContext:CvContext, childComponents:Array<ReactElement<any>>)=> {return this._getFormLayoutComponent(childComponents);}},getChildFormComponentRenderer: () => {return (customProvider && customProvider.getChildFormComponentRenderer) ? customProvider.getChildFormComponentRenderer() :((formContext:FormContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <CvFormPanel formContext={formContext}navigationListeners={this.props.navigationListeners}stateChangeListeners={[stateChangeListener]}actionListeners={this.props.actionListeners}layoutOverrideElem={this.props.layoutOverrideElem}/>});},getDetailsComponentRenderer: () => {return (customProvider && customProvider.getDetailsComponentRenderer) ? customProvider.getDetailsComponentRenderer() :((detailsContext:DetailsContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {const menuDef = (detailsContext.menuDefs && detailsContext.menuDefs.length > 0) ? detailsContext.menuDefs[0].findContextMenuDef() : null;const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const VIEW_ID_PROP_NAME = detailsContext.paneRef + '_' + DISPLAY_PROP_VIEW_ID;const viewId = (this.props.displayProperties as CvDisplayProperties).getProperty(VIEW_ID_PROP_NAME);const menu = <CvDropdownMenu paneContext={detailsContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}actionHandler={actionHandlerAdapter.createValueListener()}navTarget={this.props.navTarget}/>const viewMenu = <CvDropdownViewMenu paneContext={detailsContext}selectedViewId={viewId}actionListeners={this.props.actionListeners}navigationListeners={this.props.navigationListeners}viewDescs={detailsContext.viewDescs}navTarget={this.props.navTarget}viewSelectionListener={(viewId:string)=>{this.props.displayProperties.getAndUpdate(VIEW_ID_PROP_NAME, viewId).publishToListeners(this.props.displayPropChangeListeners);}}openLeft={true}/>let panel = null;const actionSource:ActionSource = detailsContext.actionSource;if(actionSource instanceof ContextAction &&'#search' === (actionSource as ContextAction).actionId) {panel = <CvSearchPanel detailsContext={detailsContext}navigationListeners={this.props.navigationListeners}stateChangeListeners={[stateChangeListener]}actionListeners={this.props.actionListeners}actionProvider={actionHandlerAdapter}/>} else {panel = <CvDetailsPanel detailsContext={detailsContext}navigationListeners={this.props.navigationListeners}stateChangeListeners={[stateChangeListener]}actionListeners={this.props.actionListeners}actionProvider={actionHandlerAdapter}/>}//using unique key here based on the viewId, hints to React that this this be a new instance of this componentconst key = viewId ? detailsContext.paneRef + '_' + viewId : detailsContext.paneRef;return <CvFormItemPanel paneContext={detailsContext} displayElement={panel} menuElement={menu} viewMenuElement={viewMenu} key={key} index={index}/>});},getGraphComponentRenderer: () => {return (customProvider && customProvider.getGraphComponentRenderer) ? customProvider.getGraphComponentRenderer() :((graphContext:GraphContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {const menuDef = (graphContext.menuDefs && graphContext.menuDefs.length > 0) ? graphContext.menuDefs[0].findContextMenuDef() : null;const selectionAdapter:CvValueAdapter<Array<string>> = new CvValueAdapter<Array<string>>();const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const menu = <CvDropdownMenu paneContext={graphContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}navTarget={this.props.navTarget}actionHandler={actionHandlerAdapter.createValueListener()}selectionProvider={selectionAdapter}/>const panel = <CvGraphPanel graphContext={graphContext}navigationListeners={this.props.navigationListeners}selectionListener={selectionAdapter.createValueListener()}actionProvider={actionHandlerAdapter}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}/>return <CvFormItemPanel paneContext={graphContext} displayElement={panel} menuElement={menu} index={index}/>});},getListComponentRenderer: () => {return (customProvider && customProvider.getListComponentRenderer) ? customProvider.getListComponentRenderer() :((listContext:ListContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {const displayProps:CvDisplayProperties = this.props.displayProperties;const menuDef = (listContext.menuDefs && listContext.menuDefs.length > 0) ? listContext.menuDefs[0].findContextMenuDef() : null;const selectionAdapter:CvValueAdapter<Array<string>> = new CvValueAdapter<Array<string>>();const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const VIEW_ID_PROP_NAME = listContext.paneRef + '_' + DISPLAY_PROP_VIEW_ID;const viewId = displayProps.getProperty(VIEW_ID_PROP_NAME);const LIST_SELECTION_PROP_NAME = listContext.paneRef + '_' + DISPLAY_PROP_LIST_SELECTION;const selectedItems = displayProps.getProperty(LIST_SELECTION_PROP_NAME);const NUM_ROWS_PROP_NAME = listContext.paneRef + '_' + DISPLAY_PROP_LIST_TOTAL_ROWS;const initialRows = displayProps.getProperty(NUM_ROWS_PROP_NAME) ? Number(displayProps.getProperty(NUM_ROWS_PROP_NAME)) : null;const FIRST_ROW_PROP_NAME = listContext.paneRef + '_' + DISPLAY_PROP_LIST_FIRST_VISIBLE_ROW;const firstVisibleRow = displayProps.getProperty(FIRST_ROW_PROP_NAME) ? Number(displayProps.getProperty(FIRST_ROW_PROP_NAME)) : null;const menu = <CvDropdownMenu paneContext={listContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}navTarget={this.props.navTarget}actionHandler={actionHandlerAdapter.createValueListener()}selectionProvider={selectionAdapter}/>const viewMenu = <CvDropdownViewMenu paneContext={listContext}selectedViewId={viewId}actionListeners={this.props.actionListeners}navigationListeners={this.props.navigationListeners}viewDescs={listContext.viewDescs}navTarget={this.props.navTarget}viewSelectionListener={(viewId:string)=>{//new view, reset all display propsthis.props.displayProperties.getAndRemove(NUM_ROWS_PROP_NAME).getAndRemove(LIST_SELECTION_PROP_NAME).getAndRemove(FIRST_ROW_PROP_NAME).getAndUpdate(VIEW_ID_PROP_NAME, viewId).publishToListeners(this.props.displayPropChangeListeners);}}openLeft={true}/>const selectionAdapterDelegate = selectionAdapter.createValueListener(); //use this to notify the adapter, which in turn notifies it's subscribers (ie the menu)const gridListener = (event:CvGridEvent<any>) => {const displayProps = this.props.displayProperties;if(event.type === CvGridEventType.SELECTION_EVENT) {const selections:Array<string> = event.eventObj;selectionAdapterDelegate(selections); //notify the menudisplayProps.getAndUpdate(LIST_SELECTION_PROP_NAME, selections).publishToListeners(this.props.displayPropChangeListeners);} else if(event.type === CvGridEventType.TOTAL_ROWS_LOADED_EVENT) {displayProps.getAndUpdate(NUM_ROWS_PROP_NAME, String(event.eventObj)).publishToListeners(this.props.displayPropChangeListeners);} else if(event.type === CvGridEventType.FIRST_VISIBLE_ROW_CHANGE_EVENT) {displayProps.getAndUpdate(FIRST_ROW_PROP_NAME, String(event.eventObj)).publishToListeners(this.props.displayPropChangeListeners);}}//const panel = <CvListPanel listContext={listContext}const panel = <CvGridPanel listContext={listContext}initialSelectedItems={selectedItems}numInitialRows={initialRows}initialFirstVisibleRow={firstVisibleRow}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}gridListener={gridListener}actionProvider={actionHandlerAdapter}stateChangeListeners={[stateChangeListener]}searchable={menuDef && !!(menuDef.findAtId('#search'))}/>//using unique key here based on the viewId, hints to React that this this be a new instance of this componentconst key = viewId ? listContext.paneRef + '_' + viewId : listContext.paneRef;return <CvFormItemPanel paneContext={listContext} displayElement={panel} menuElement={menu} viewMenuElement={viewMenu} key={key} index={index}/>});},getMapComponentRenderer: () => {return (customProvider && customProvider.getMapComponentRenderer) ? customProvider.getMapComponentRenderer() :((mapContext:MapContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {const menuDef = (mapContext.menuDefs && mapContext.menuDefs.length > 0) ? mapContext.menuDefs[0].findContextMenuDef() : null;const selectionAdapter:CvValueAdapter<Array<string>> = new CvValueAdapter<Array<string>>();const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const menu = <CvDropdownMenu paneContext={mapContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}navTarget={this.props.navTarget}actionHandler={actionHandlerAdapter.createValueListener()}selectionProvider={selectionAdapter}/>const panel = <CvMapPanel mapContext={mapContext}navigationListeners={this.props.navigationListeners}selectionListener={selectionAdapter.createValueListener()}actionProvider={actionHandlerAdapter}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}/>return <CvFormItemPanel paneContext={mapContext} displayElement={panel} menuElement={menu} index={index}/>});},getPrintMarkupComponentRenderer: () => {return (customProvider && customProvider.getPrintMarkupComponentRenderer) ? customProvider.getPrintMarkupComponentRenderer() :((printMarkupContext:PrintMarkupContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {const menuDef = (printMarkupContext.menuDefs && printMarkupContext.menuDefs.length > 0) ? printMarkupContext.menuDefs[0].findContextMenuDef() : null;const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const menu = <CvDropdownMenu paneContext={printMarkupContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[stateChangeListener]}actionHandler={actionHandlerAdapter.createValueListener()}navTarget={this.props.navTarget}/>let panel = <CvPrintPanel printMarkupContext={printMarkupContext}navigationListeners={this.props.navigationListeners}stateChangeListeners={[stateChangeListener]}actionListeners={this.props.actionListeners}actionProvider={actionHandlerAdapter}/>return <CvFormItemPanel paneContext={printMarkupContext} displayElement={panel} menuElement={menu} index={index}/>});},/*** Pending implementation* @private*/getCalendarComponentRenderer: () => {return (customProvider && customProvider.getCalendarComponentRenderer) ? customProvider.getCalendarComponentRenderer() :((calendarContext:CalendarContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <h2>There is not yet a default Calendar Implementation. You can provide one, if you like.</h2>;});},/*** Pending implementation* @private*/getImagePickerComponentRenderer: () => {return (customProvider && customProvider.getImagePickerComponentRenderer) ? customProvider.getImagePickerComponentRenderer() :((imagePickerContext:ImagePickerContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <h2>There is not yet a default ImagePicker Implementation. You can provide one, if you like.</h2>;});},/*** Pending implementation* @private*/getBarcodeScanComponentRenderer: () => {return (customProvider && customProvider.getBarcodeScanComponentRenderer) ? customProvider.getBarcodeScanComponentRenderer() :((barcodeScanContext:BarcodeScanContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <h2>There is not yet a default BarcodeScan Implementation. You can provide one, if you like.</h2>;});},/*** Pending implementation* @private*/getGeoFixComponentRenderer: () => {return (customProvider && customProvider.getGeoFixComponentRenderer) ? customProvider.getGeoFixComponentRenderer() :((geoFixContext:GeoFixContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <h2>There is not yet a default GeoFix Implementation. You can provide one, if you like.</h2>;});},/*** Pending implementation* @private*/getGeoLocationComponentRenderer: () => {return (customProvider && customProvider.getGeoLocationComponentRenderer) ? customProvider.getGeoLocationComponentRenderer() :((geoLocationContext:GeoLocationContext, stateChangeListener:(event:CvEvent<CvStateChangeResult>)=>void, index:number)=> {return <h2>There is not yet a default GeoLocation Implementation. You can provide one, if you like.</h2>;});}}},/**** @param childComponents These are the components which have been rendered by the various child component functions* @returns {any}* @private*/_getFormLayoutComponent: function (childComponents:Array<ReactElement<any>>):ReactElement<any> {const formContext:FormContext = this.formContext();const formDef:FormDef = this.formContext().formDef;const displayProperties:CvDisplayProperties = this.props.displayProperties;let component = null;if (this.props.layoutOverrideElem) {const props = {formContext: formContext,formComponents: childComponents,navigationListeners: this.props.navigationListeners,actionListeners: this.props.actionListeners,navTarget: this.props.navTarget};component = React.createElement(this.props.layoutOverrideElem, props);} else if (formDef.isTabsLayout) {component = <CvTabbedFormPanel formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}displayProperties={displayProperties}displayPropChangeListeners={this.props.displayPropChangeListeners}/>} else if (formDef.isThreeBoxOneLeftLayout) {component = <CvFormRightSplitPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else if (formDef.isThreeBoxOneRightLayout) {component = <CvFormLeftSplitPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else if (formDef.isThreeBoxOneOverLayout) {component = <CvFormBottomSplitPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else if (formDef.isThreeBoxOneUnderLayout) {component = <CvFormTopSplitPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else if (formDef.isFourBoxSquareLayout) {component = <CvFormFourBoxSplitPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else if (formDef.isOptionsFormLayout) {component = <CvFormOptionsLayoutPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>} else {component = <CvVerticalLayoutFormPane formContext={formContext}formComponents={childComponents}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}navTarget={this.props.navTarget}/>}//@TODO - need to clarify how 'Form level menus work - it is not clear based on the original SDK's implementation of 'performMenuAction'/*const menuDef = (formContext.menuDefs && formContext.menuDefs.length > 0) ? formContext.menuDefs[0].findContextMenuDef() : null;const actionHandlerAdapter:CvValueAdapter<CvActionHandlerParams> = new CvValueAdapter<CvActionHandlerParams>();const menu = <CvDropdownMenu paneContext={formContext}menuDef={menuDef}openLeft={true}navigationListeners={this.props.navigationListeners}actionListeners={this.props.actionListeners}stateChangeListeners={[]}navTarget={this.props.navTarget}actionHandler={actionHandlerAdapter.createValueListener()}/>*/const viewMenu = <CvDropdownViewMenu paneContext={formContext}actionListeners={this.props.actionListeners}navigationListeners={this.props.navigationListeners}navTarget={this.props.navTarget}viewDescs={formContext.viewDescs}openLeft={true}/>const paneTitle = this.findPaneTitle(formContext);return (<div className="cv-form"><div className="row cv-form-header"><div className="col-sm-3"><span className="cv-form-title">{paneTitle && paneTitle !== 'Default' ? paneTitle : ''}</span></div><div className="col-sm-3 col-sm-offset-6"><div className="pull-right">{viewMenu}</div></div></div><div>{component}</div></div>);}})

Renders a FormContext, utilizing a series of composite, component renderers These may be overriden via CvFormComponentProvider

CvFormRightSplitPane

CvFormRightSplitPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-6 cv-split-pane">{formComponents[0]}</div><div className="col-sm-6"><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[1]}</div></div><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents.length > 2 ? formComponents[2] : null}</div></div></div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 3; i < formComponents.length; i++){elems.push(<div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvFormTopSplitPane

CvFormTopSplitPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {const formComponents = this.formComponents();if (formComponents && formComponents.length > 0) {if (formComponents.length < 2) {return (<div className="cv-form-container">{formComponents[0]}</div>);} else {return (<div className="cv-form-container"><div className="row"><div className="col-sm-6 cv-split-pane">{formComponents[0]}</div><div className="col-sm-6 cv-split-pane">{formComponents[1]}</div></div><div className="row"><div className="col-sm-12 cv-split-pane">{formComponents.length > 2 ? formComponents[2] : null}</div></div><div className="row"><div className="col-sm-12">{(()=>{const elems = [];for(let i = 3; i < formComponents.length; i++){elems.push(<div className="row"><div className="col-sm-12 cv-split-pane">{formComponents[i]}</div></div>);}return elems;})()}</div></div></div>);}} else {return null;}},})

CvTabbedFormMenu

CvTabbedFormMenu: ClassicComponentClass<CvTabbedFormMenuProps> = React.createClass<CvTabbedFormMenuProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], tabSelectionListener: null, formContext: null, selectedItem:0};},render: function () {if (this.formComponents() && this.formComponents().length > 0) {return <ul className="nav nav-pills">{this.formContext().childrenContexts.map((childContext:PaneContext, i:number)=> {let title = this.findPaneTitle(childContext);if (!title || title.length < 1) {title = 'View ' + (i + 1);}return <li onClick={this._itemSelected.bind(this, i)} role="presentation" key={i}className={i == this.props.selectedItem ? 'active' : ''}><a className="cv-target">{title}</a></li>})}</ul>} else {return null;}},_itemSelected(item:number) {this.props.tabSelectionListener(item);}})

CvTabbedFormPanel

CvTabbedFormPanel: ClassicComponentClass<CvTabbedFormPanelProps> = React.createClass<CvTabbedFormPanelProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null,displayProperties:new CvDisplayProperties(), displayPropChangeListeners:[]};},render: function () {if (this.formComponents() && this.formComponents().length > 0) {if (this.formComponents().length > 1) {return (<div className="cv-form-container"><div className="cv-tab-form-menu"><CvTabbedFormMenu formContext={this.formContext()}formComponents={this.formComponents()}selectedItem={this.selectedItem()}tabSelectionListener={(selectedItem:number)=>{this.displayProperties().getAndUpdate(DISPLAY_PROP_ACTIVE_FORM_TAB, selectedItem).publishToListeners(this.props.displayPropChangeListeners);}}/></div>{this.selectedElement()}</div>);} else {return <div className="cv-form-container">{this.formComponents()[0]}</div>}} else {return null;}},selectedElement: function () {return this.formComponents()[this.selectedItem()];},selectedContext: function () {return this.formContext().childrenContexts[this.selectedItem()];},selectedItem: function():number {const activeFormTab = this.displayProperties().getProperty(DISPLAY_PROP_ACTIVE_FORM_TAB);return activeFormTab ? Number(activeFormTab) : 0;}})

CvVerticalLayoutFormPane

CvVerticalLayoutFormPane: ClassicComponentClass<CvFormLayoutProps> = React.createClass<CvFormLayoutProps, CvFormLayoutState>({mixins: [CvBaseMixin, CvFormLayout],getDefaultProps: function () {return {formComponents: [], formContext: null}},render: function () {if (this.formComponents() && this.formComponents().length > 0) {return <div className="cv-form-container">{this.formComponents().map((formComponent, num)=> {if(formComponent.key) {return formComponent;} else {return React.cloneElement(formComponent, {key: num});}})}</div>} else {return null;}},})

DISPLAY_PROP_ACTIVE_FORM_TAB

DISPLAY_PROP_ACTIVE_FORM_TAB: "active_form_tab" = "active_form_tab"

DISPLAY_PROP_LIST_FIRST_VISIBLE_ROW

DISPLAY_PROP_LIST_FIRST_VISIBLE_ROW: "list_first_row" = "list_first_row"

DISPLAY_PROP_LIST_SELECTION

DISPLAY_PROP_LIST_SELECTION: "list_sel" = "list_sel"

DISPLAY_PROP_LIST_TOTAL_ROWS

DISPLAY_PROP_LIST_TOTAL_ROWS: "list_total_rows" = "list_total_rows"

DISPLAY_PROP_VIEW_ID

DISPLAY_PROP_VIEW_ID: "viewId" = "viewId"

Object literals

CvFormLayout

CvFormLayout: object

displayProperties

formComponents

  • formComponents(): Array<ReactElement<any>>

  • Returns Array<ReactElement<any>>

formContext

  • formContext(): FormContext

  • Returns FormContext

Generated using TypeDoc