@shopgate/engage
Version:
Shopgate's ENGAGE library.
7 lines • 1.98 kB
JavaScript
import _camelCase from"lodash/camelCase";function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{memo}from'react';import PropTypes from'prop-types';import classNames from'classnames';import TextField from'@shopgate/pwa-ui-shared/TextField';import FormHelper from"./FormHelper";import{ELEMENT_TYPE_TEXT,ELEMENT_TYPE_NUMBER,ELEMENT_TYPE_EMAIL,ELEMENT_TYPE_PASSWORD,ELEMENT_TYPE_DATE,ELEMENT_TYPE_PHONE}from"./Builder.constants";// Map element type to input type
var mapping=_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({},ELEMENT_TYPE_TEXT,'text'),ELEMENT_TYPE_NUMBER,'number'),ELEMENT_TYPE_EMAIL,'email'),ELEMENT_TYPE_PASSWORD,'password'),ELEMENT_TYPE_DATE,'date'),ELEMENT_TYPE_PHONE,'tel');/**
* Takes an element and renders it, if the type matches
* @param {Object} props Component props.
* @param {Object} props.element The data of the element to be rendered
* @returns {JSX.Element}
*/var ElementText=function ElementText(props){var element=props.element,errorText=props.errorText,name=props.name,value=props.value,visible=props.visible,formName=props.formName;if(!visible){return null;}var required=element.required,disabled=element.disabled,handleChange=element.handleChange,label=element.label;var type=mapping[element.type];return React.createElement("div",{className:classNames(_camelCase(name),'engage__form-text','formBuilderField',{validationError:!!errorText})},React.createElement(TextField,{required:required,type:type,name:name,label:label,value:value,onChange:handleChange,errorText:errorText,isControlled:true,translateErrorText:false,showErrorText:false,disabled:disabled}),React.createElement(FormHelper,{errorText:errorText,element:element,formName:formName,elementName:name}));};ElementText.defaultProps={value:'',visible:true};export default memo(ElementText);