ska-suite-airxtouch-ui-components

SKA Suite - UI Components

Usage no npm install needed!

<script type="module">
  import skaSuiteAirxtouchUiComponents from 'https://cdn.skypack.dev/ska-suite-airxtouch-ui-components';
</script>

README

Ska Suite - Form

Installation

Ska Suite Forms is an npm package.

// with npm
npm install ska-suite-form --save

// with yarn
yarn add ska-suite-form

Peer 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