@sensenet/controls-react
v10.0.0
Published
React controls for sensenet
Downloads
78
Readme
@sensenet/controls-react
Collection of React components for sensenet with Material-UI
Install
# Yarn
yarn add @sensenet/controls-react
# NPM
npm install @sensenet/controls-react
Usage
You can import fieldcontrol and viewcontrol components into your React App the conventional way.
import { NewView, EditView, CommandButtons } '@sensenet/controls-react';
...
View Controls
View Controls are almost the same as the old .ascx Content Views were in sensenet Webpages. This components define how the given Content will be rendered. As a Content is built up of Fields the View Control displays the Content using Field Controls to provide a surface to display/modify the Field values of the Content. View Control therefore depends on the Content Type of the specific Content.
Content creation form (NewView)
import { NewView } from '@sensenet/controls-react'
// repository: Repository | required | Repository instance
// contentTypeName: string | required | Type of the new content
// onSubmit: Function | optional | called on submit event
<NewView
repository={repository}
contentTypeName="Folder"
onSubmit={() => {})} />
Content editor form (EditView)
import { EditView } from '@sensenet/controls-react'
// repository: Repository | required | Repository instance
// content: Content | required | empty Content Object
// contentTypeName: string | required | Type of edited content
// onSubmit: Function | optional | called on submit event
<EditView
repository={repository}
content={content}
contentTypeName={content.Type}
onSubmit={() => {})} />
Content browse view (BrowseView)
import { BrowseView } from '@sensenet/controls-react'
// content: Content | required | empty Content Object
;<BrowseView content={content} />
Field Controls
Just as legacy controls in sensenet Webpages Field Control components provide GUI for setting/modifying Field values of a Content but this time not as .ascx views but React Components.