0.0.14 • Published 7 years ago
ska-suite-form v0.0.14

Installation
Ska Suite Forms is an npm package.
// with npm
npm install ska-suite-form --save
// with yarn
yarn add ska-suite-formPeer Dependencies
Npm documentation about Peer dependencies
"peerDependencies": {
"prop-types": "^15.7.2",
"react": "^16.8.4",
"react-dom": "^16.8.4"
}Usage
Minimal example :
import React from "react";
import ReactDOM from "react-dom";
import QuestionForm from "ska-suite-form";
import Form from "./form"; // Check API for more information
function App() {
return (
<QuestionForm
questionForm={Form}
width="100%"
lang="FR"
accentColor="#0099BC"
onFormSent={(participation) => console.log(participation)}
/>
)
}
ReactDOM.render(<App />, document.querySelector('#app'));Api
QuestionForm
All Style props object must follow React inline style
| Props | Type | Required | Description |
|---|---|---|---|
| questionForm | object | ✓ | Object generated by Reception Desk Web Designer |
| width | string | ✓ | Any valid css width ("100%", "500px" ...) |
| lang | string | ✓ | Language code in which the form will be displayed ("FR", "EN"), must be available in the questionForm props |
| onFormSent | function | ✓ | Callback for when the form is sent (returns Participation object) |
| accentColor | string | ✓ | Hexa code of the accent color used in the form ("#0099BC") |
| questionFormTextStyle | object | ✘ | Style of the question form title text |
| questionTextStyle | object | ✘ | Style of the question title text |
| questionContainerStyle | object | ✘ | Style of the question container |
| answerTextStyle | object | ✘ | Style of the answer text |
| answerContainerStyle | object | ✘ | Style of the answer container |
| inputStyle | object | ✘ | Style of the inputs (contact form) |
| thankMessage | string | ✘ | Custom message when form is completed |
| thankMessageStyle | object | ✘ | Style of the message when form is completed |