import { registerExamples } from '../register' ; import { personCoreSchema } from './person' ; export const schema = { type : 'object' , properties : { ... personCoreSchema . properties , occupation : { type : 'string' } , enableArray : { type : 'boolean' } , comments : { type : 'array' , title : 'Messages' , items : { type : 'object' , properties : { date : { type : 'string' , format : 'date' } , message : { type : 'string' , maxLength : 5 } } } } } , required : [ 'occupation' , 'nationality' ] } ; export const uischema = { type : 'VerticalLayout' , elements : [ { type : 'Control' , scope : '#/properties/occupation' } , { type : 'Control' , scope : '#/properties/enableArray' } , { type : 'Control' , scope : '#/properties/comments' , rule : { effect : 'SHOW' , condition : { type : 'OR' , conditions : [ { schema : { const : 'developer' } , scope : '#/properties/occupation' } , { schema : { const : true } , scope : '/properties/enableArray' } ] } } , options : { detail : { type : 'VerticalLayout' , elements : [ { type : 'Control' , scope : '#/properties/message' } , { type : 'Control' , scope : '#/properties/date' } ] } } } ] } ; export const data = { occupation : 'developer' , comments : [ { date : new Date ( 2001 , 8 , 11 ) . toISOString ( ) . substr ( 0 , 10 ) , message : 'This is an example message' } , { date : new Date ( ) . toISOString ( ) . substr ( 0 , 10 ) , message : 'Get ready for booohay' } ] } ; registerExamples ( [ { name : 'array-with-detail-and-rule' , label : 'Array with detail and rule' , data , schema , uischema } ] ) ;