import { Text } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';

const textReturn = () => (
  <form className="af-form" name="myform">
    <Text id="uniqueid" name="placeName" placeholder="Paris" value="Robert" />
  </form>
);
export default textReturn;

import { TextInput } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import { MessageTypes } from '@axa-fr/react-toolkit-form-core';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';

const textError = () => (
  <form className="af-form" name="myform">
    <TextInput
      id="uniqueid"
      name="placeName"
      placeholder="Paris"
      label="your label"
      value="Robert"
      messageType={MessageTypes.error}
      message="Le champ est obligatoires"
      forceDisplayMessage={true}
    />
  </form>
);
export default textError;

import { TextInput } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import { MessageTypes, HelpMessage } from '@axa-fr/react-toolkit-form-core';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';

const textSuccess = () => (
  <form className="af-form" name="myform">
    <TextInput
      id="uniqueid"
      name="placeName"
      label="your label"
      value="Robert"
      placeholder="Paris"
      messageType={MessageTypes.success}
      message="Success Message Type"
      forceDisplayMessage={true}
      helpMessage="Enter the place name, ex : Webcenteraa"
    />
    <HelpMessage />
  </form>
);
export default textSuccess;

disabled = { true };

import { TextInput } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';
import HelpButton from '@axa-fr/react-toolkit-help';

const textInputReturn = () => (
  <form className="af-form" name="myform">
    <TextInput
      id="uniqueid"
      name="placeName"
      placeholder=""
      value=""
      onChange={(e) => {
        console.log(e);
      }}
      label="Place name"
      helpMessage="Enter the place name, ex : Webcenter">
      <HelpButton>tooltip avec du text</HelpButton>
    </TextInput>
  </form>
);
export default textInputReturn;

classModifier = 'required';

import { TextInput } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import { MessageTypes } from '@axa-fr/react-toolkit-form-core';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';
import HelpButton from '@axa-fr/react-toolkit-help';

const textInputError = () => (
  <form className="af-form" name="myform">
    <TextInput
      id="uniqueid"
      name="placeName"
      label="Place name"
      placeholder="Paris"
      classModifier="required"
      value="Robert"
      messageType={MessageTypes.error}
      message="The field is required"
      forceDisplayMessage={true}>
      <HelpButton>tooltip avec du text</HelpButton>
    </TextInput>
  </form>
);
export default textInputError;

import { TextInput } from '@axa-fr/react-toolkit-form-input-text';
import '@axa-fr/react-toolkit-form-input-text/dist/af-inputtext.css';
import { MessageTypes } from '@axa-fr/react-toolkit-form-core';
import '@axa-fr/react-toolkit-form-core/dist/af-form.css';
import HelpButton from '@axa-fr/react-toolkit-help';

const richLabel = (
  <span>
    Place name <i>optional</i>
  </span>
);

const textInputRichLabel = () => (
  <form className="af-form" name="myform">
    <TextInput
      id="uniqueid"
      name="placeName"
      placeholder="Paris"
      label={richLabel}
      value="Robert"
      messageType={MessageTypes.error}
      message="Le champ est obligatoires"
      forceDisplayMessage={true}>
      <HelpButton>tooltip avec du text</HelpButton>
    </TextInput>
  </form>
);
export default textInputRichLabel;