@coorpacademy/components 10.24.0 → 10.24.1

package/es/molecule/drag-and-drop/upload-report.js

@@ -17,6 +17,42 @@ import { EXTERNAL_CONTENT_ICONS } from '../../util/external-content';
 import InputText from '../../atom/input-text';
 import Button from '../../atom/button';
 import style from './upload-report.css';
+
+const SuccessMessage = ({
+  message
+}) => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+  className: style.emoticon
+}, "\uD83C\uDF89"), /*#__PURE__*/React.createElement("p", {
+  className: style.message
+}, message));
+
+SuccessMessage.propTypes = process.env.NODE_ENV !== "production" ? {
+  message: PropTypes.string.isRequired
+} : {};
+
+const ErrorMessage = ({
+  message,
+  buttonTitle,
+  primaryColor
+}) => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+  className: style.emoticon
+}, "\uD83E\uDD7A"), /*#__PURE__*/React.createElement("p", {
+  className: style.message
+}, message)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
+  "data-name": "cta",
+  type: "link",
+  submitValue: buttonTitle,
+  className: style.selectButton,
+  style: {
+    backgroundColor: primaryColor
+  }
+})));
+
+ErrorMessage.propTypes = process.env.NODE_ENV !== "production" ? {
+  message: PropTypes.string.isRequired,
+  buttonTitle: PropTypes.string,
+  primaryColor: PropTypes.string
+} : {};
 export const UploadReport = ({
   state,
   message,
@@ -39,26 +75,6 @@ export const UploadReport = ({
     e.preventDefault();
   }, []);
 
-  const SuccessMessage = () => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-    className: style.emoticon
-  }, "\uD83C\uDF89"), /*#__PURE__*/React.createElement("p", {
-    className: style.message
-  }, message));
-
-  const ErrorMessage = () => /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-    className: style.emoticon
-  }, "\uD83E\uDD7A"), /*#__PURE__*/React.createElement("p", {
-    className: style.message
-  }, message)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-    "data-name": "cta",
-    type: "link",
-    submitValue: buttonTitle,
-    className: style.selectButton,
-    style: {
-      backgroundColor: primaryColor
-    }
-  })));
-
   const showMessage = _includes(state, ['success', 'error']);
 
   const fileName = _pipe(_head, _getOr('', 'value'), _split('/'), _last)(fields);
@@ -120,7 +136,13 @@ export const UploadReport = ({
   }))), fileView, deleteView), /*#__PURE__*/React.createElement("div", {
     className: style.reportContainer,
     onClick: stopPropagationHandler
-  }, state === 'success' ? /*#__PURE__*/React.createElement(SuccessMessage, null) : null, state === 'error' ? /*#__PURE__*/React.createElement(ErrorMessage, null) : null, mode === 'edit' && !showMessage ? /*#__PURE__*/React.createElement("div", null, fieldsList) : null, mode === 'edit' && !showMessage ? /*#__PURE__*/React.createElement("span", {
+  }, state === 'success' ? /*#__PURE__*/React.createElement(SuccessMessage, {
+    message: message
+  }) : null, state === 'error' ? /*#__PURE__*/React.createElement(ErrorMessage, {
+    message: message,
+    buttonTitle: buttonTitle,
+    primaryColor: primaryColor
+  }) : null, mode === 'edit' && !showMessage ? /*#__PURE__*/React.createElement("div", null, fieldsList) : null, mode === 'edit' && !showMessage ? /*#__PURE__*/React.createElement("span", {
     className: style.or
   }, orLabel) : null), !showMessage ? /*#__PURE__*/React.createElement("div", {
     className: style.drop

package/es/molecule/drag-and-drop/upload-report.js.map

@@ -1 +1 @@
-{"version":3,"file":"upload-report.js","names":["React","useCallback","PropTypes","NovaCompositionCoorpacademyValidate","Validated","NovaLineContentEditionBin","TrashIcon","NovaCompositionCoorpacademyWarn","WarnIcon","classnames","EXTERNAL_CONTENT_ICONS","InputText","Button","style","UploadReport","state","message","warningMessage","type","contentType","fields","mode","orLabel","buttonTitle","primaryColor","onDelete","handleDelete","e","stopPropagation","preventDefault","stopPropagationHandler","SuccessMessage","emoticon","ErrorMessage","selectButton","backgroundColor","showMessage","fileName","fileView","fileWrapper","validateIcon","warning","showToolTip","warningIcon","emptyFileWrapper","IconType","icon","iconColor","color","buildField","field","index","deleteView","actionIcon","trashIcon","fieldsList","convert","cap","reportingContainer","reportHeader","iconContainer","oval","iconHeader","reportContainer","or","drop","propTypes","string","isRequired","arrayOf","shape","oneOf","func"],"sources":["../../../src/molecule/drag-and-drop/upload-report.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyValidate as Validated,\n  NovaLineContentEditionBin as TrashIcon,\n  NovaCompositionCoorpacademyWarn as WarnIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport {pipe, split, last, map, head, getOr, isEmpty, includes} from 'lodash/fp';\nimport {EXTERNAL_CONTENT_ICONS} from '../../util/external-content';\nimport InputText from '../../atom/input-text';\n\nimport Button from '../../atom/button';\nimport style from './upload-report.css';\n\nexport const UploadReport = ({\n  state,\n  message,\n  warningMessage,\n  type: contentType,\n  fields,\n  mode = 'upload',\n  orLabel,\n  buttonTitle,\n  primaryColor,\n  onDelete\n}) => {\n  const handleDelete = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      onDelete && onDelete(e);\n    },\n    [onDelete]\n  );\n\n  const stopPropagationHandler = useCallback(e => {\n    e.stopPropagation();\n    e.preventDefault();\n  }, []);\n\n  const SuccessMessage = () => (\n    <div>\n      <span className={style.emoticon}>🎉</span>\n      <p className={style.message}>{message}</p>\n    </div>\n  );\n  const ErrorMessage = () => (\n    <div>\n      <div>\n        <span className={style.emoticon}>🥺</span>\n        <p className={style.message}>{message}</p>\n      </div>\n      <div>\n        <Button\n          data-name=\"cta\"\n          type=\"link\"\n          submitValue={buttonTitle}\n          className={style.selectButton}\n          style={{backgroundColor: primaryColor}}\n        />\n      </div>\n    </div>\n  );\n  const showMessage = includes(state, ['success', 'error']);\n\n  const fileName = pipe(head, getOr('', 'value'), split('/'), last)(fields);\n  const fileView = fileName ? (\n    <div className={style.fileWrapper}>\n      <div className={style.fileName} title={fileName}>\n        {fileName}\n      </div>\n      {isEmpty(warningMessage) ? (\n        <Validated className={style.validateIcon} />\n      ) : (\n        <div className={style.warning}>\n          <div className={style.showToolTip}>\n            <span>{warningMessage}</span>\n          </div>\n          <div className={style.warningIcon}>\n            <WarnIcon width={11} height={11} />\n          </div>\n        </div>\n      )}\n    </div>\n  ) : (\n    <div className={style.emptyFileWrapper} />\n  );\n  const IconType = EXTERNAL_CONTENT_ICONS[contentType].icon;\n  const iconColor = EXTERNAL_CONTENT_ICONS[contentType].color;\n  const buildField = (field, index) => <InputText {...field} key={index} theme={'cockpit'} />;\n  const deleteView = onDelete ? (\n    <div onClick={handleDelete} className={classnames(style.actionIcon, style.trashIcon)}>\n      <TrashIcon width={20} height={20} />\n    </div>\n  ) : null;\n  const fieldsList = map.convert({cap: false})(buildField, fields);\n  return (\n    <div className={style.reportingContainer}>\n      <div className={style.reportHeader} onClick={stopPropagationHandler}>\n        <div className={style.iconContainer} style={{backgroundColor: iconColor}}>\n          <div className={style.oval}>\n            <IconType className={style.iconHeader} color={iconColor} />\n          </div>\n        </div>\n        {fileView}\n        {deleteView}\n      </div>\n      <div className={style.reportContainer} onClick={stopPropagationHandler}>\n        {state === 'success' ? <SuccessMessage /> : null}\n        {state === 'error' ? <ErrorMessage /> : null}\n        {mode === 'edit' && !showMessage ? <div>{fieldsList}</div> : null}\n        {mode === 'edit' && !showMessage ? <span className={style.or}>{orLabel}</span> : null}\n      </div>\n      {!showMessage ? (\n        <div className={style.drop}>\n          <p className={style.message}>{message}</p>\n          <Button\n            data-name=\"cta\"\n            type=\"link\"\n            submitValue={buttonTitle}\n            className={style.selectButton}\n            style={{backgroundColor: primaryColor}}\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default UploadReport;\n\nUploadReport.propTypes = {\n  state: PropTypes.string.isRequired,\n  message: PropTypes.string.isRequired,\n  warningMessage: PropTypes.string,\n  orLabel: PropTypes.string,\n  type: PropTypes.string,\n  fields: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...InputText.propTypes,\n      type: PropTypes.oneOf(['text'])\n    })\n  ),\n  mode: PropTypes.oneOf(['edit', 'upload']),\n  buttonTitle: PropTypes.string,\n  primaryColor: PropTypes.string,\n  onDelete: PropTypes.func\n};\n"],"mappings":"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"}
+{"version":3,"file":"upload-report.js","names":["React","useCallback","PropTypes","NovaCompositionCoorpacademyValidate","Validated","NovaLineContentEditionBin","TrashIcon","NovaCompositionCoorpacademyWarn","WarnIcon","classnames","EXTERNAL_CONTENT_ICONS","InputText","Button","style","SuccessMessage","message","emoticon","propTypes","string","isRequired","ErrorMessage","buttonTitle","primaryColor","selectButton","backgroundColor","UploadReport","state","warningMessage","type","contentType","fields","mode","orLabel","onDelete","handleDelete","e","stopPropagation","preventDefault","stopPropagationHandler","showMessage","fileName","fileView","fileWrapper","validateIcon","warning","showToolTip","warningIcon","emptyFileWrapper","IconType","icon","iconColor","color","buildField","field","index","deleteView","actionIcon","trashIcon","fieldsList","convert","cap","reportingContainer","reportHeader","iconContainer","oval","iconHeader","reportContainer","or","drop","arrayOf","shape","oneOf","func"],"sources":["../../../src/molecule/drag-and-drop/upload-report.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaCompositionCoorpacademyValidate as Validated,\n  NovaLineContentEditionBin as TrashIcon,\n  NovaCompositionCoorpacademyWarn as WarnIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport {pipe, split, last, map, head, getOr, isEmpty, includes} from 'lodash/fp';\nimport {EXTERNAL_CONTENT_ICONS} from '../../util/external-content';\nimport InputText from '../../atom/input-text';\n\nimport Button from '../../atom/button';\nimport style from './upload-report.css';\n\nconst SuccessMessage = ({message}) => (\n  <div>\n    <span className={style.emoticon}>🎉</span>\n    <p className={style.message}>{message}</p>\n  </div>\n);\n\nSuccessMessage.propTypes = {\n  message: PropTypes.string.isRequired\n};\n\nconst ErrorMessage = ({message, buttonTitle, primaryColor}) => (\n  <div>\n    <div>\n      <span className={style.emoticon}>🥺</span>\n      <p className={style.message}>{message}</p>\n    </div>\n    <div>\n      <Button\n        data-name=\"cta\"\n        type=\"link\"\n        submitValue={buttonTitle}\n        className={style.selectButton}\n        style={{backgroundColor: primaryColor}}\n      />\n    </div>\n  </div>\n);\n\nErrorMessage.propTypes = {\n  message: PropTypes.string.isRequired,\n  buttonTitle: PropTypes.string,\n  primaryColor: PropTypes.string\n};\n\nexport const UploadReport = ({\n  state,\n  message,\n  warningMessage,\n  type: contentType,\n  fields,\n  mode = 'upload',\n  orLabel,\n  buttonTitle,\n  primaryColor,\n  onDelete\n}) => {\n  const handleDelete = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      onDelete && onDelete(e);\n    },\n    [onDelete]\n  );\n\n  const stopPropagationHandler = useCallback(e => {\n    e.stopPropagation();\n    e.preventDefault();\n  }, []);\n\n  const showMessage = includes(state, ['success', 'error']);\n\n  const fileName = pipe(head, getOr('', 'value'), split('/'), last)(fields);\n  const fileView = fileName ? (\n    <div className={style.fileWrapper}>\n      <div className={style.fileName} title={fileName}>\n        {fileName}\n      </div>\n      {isEmpty(warningMessage) ? (\n        <Validated className={style.validateIcon} />\n      ) : (\n        <div className={style.warning}>\n          <div className={style.showToolTip}>\n            <span>{warningMessage}</span>\n          </div>\n          <div className={style.warningIcon}>\n            <WarnIcon width={11} height={11} />\n          </div>\n        </div>\n      )}\n    </div>\n  ) : (\n    <div className={style.emptyFileWrapper} />\n  );\n  const IconType = EXTERNAL_CONTENT_ICONS[contentType].icon;\n  const iconColor = EXTERNAL_CONTENT_ICONS[contentType].color;\n  const buildField = (field, index) => <InputText {...field} key={index} theme={'cockpit'} />;\n  const deleteView = onDelete ? (\n    <div onClick={handleDelete} className={classnames(style.actionIcon, style.trashIcon)}>\n      <TrashIcon width={20} height={20} />\n    </div>\n  ) : null;\n  const fieldsList = map.convert({cap: false})(buildField, fields);\n  return (\n    <div className={style.reportingContainer}>\n      <div className={style.reportHeader} onClick={stopPropagationHandler}>\n        <div className={style.iconContainer} style={{backgroundColor: iconColor}}>\n          <div className={style.oval}>\n            <IconType className={style.iconHeader} color={iconColor} />\n          </div>\n        </div>\n        {fileView}\n        {deleteView}\n      </div>\n      <div className={style.reportContainer} onClick={stopPropagationHandler}>\n        {state === 'success' ? <SuccessMessage message={message} /> : null}\n        {state === 'error' ? (\n          <ErrorMessage message={message} buttonTitle={buttonTitle} primaryColor={primaryColor} />\n        ) : null}\n        {mode === 'edit' && !showMessage ? <div>{fieldsList}</div> : null}\n        {mode === 'edit' && !showMessage ? <span className={style.or}>{orLabel}</span> : null}\n      </div>\n      {!showMessage ? (\n        <div className={style.drop}>\n          <p className={style.message}>{message}</p>\n          <Button\n            data-name=\"cta\"\n            type=\"link\"\n            submitValue={buttonTitle}\n            className={style.selectButton}\n            style={{backgroundColor: primaryColor}}\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default UploadReport;\n\nUploadReport.propTypes = {\n  state: PropTypes.string.isRequired,\n  message: PropTypes.string.isRequired,\n  warningMessage: PropTypes.string,\n  orLabel: PropTypes.string,\n  type: PropTypes.string,\n  fields: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...InputText.propTypes,\n      type: PropTypes.oneOf(['text'])\n    })\n  ),\n  mode: PropTypes.oneOf(['edit', 'upload']),\n  buttonTitle: PropTypes.string,\n  primaryColor: PropTypes.string,\n  onDelete: PropTypes.func\n};\n"],"mappings":"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"}

package/es/molecule/feedback/index.js

@@ -55,7 +55,7 @@ const Feedback = (props, context) => {
     dangerouslySetInnerHTML: {
       __html: mediaDescription
     }
-  })) : null))) : null) || '';
+  })) : null))) : null) || null;
 };
 
 Feedback.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -63,7 +63,7 @@ Feedback.propTypes = process.env.NODE_ENV !== "production" ? {
   description: PropTypes.string,
   media: PropTypes.shape({
     type: PropTypes.oneOf([TYPE_IMAGE, TYPE_PDF, TYPE_VIDEO, TYPE_AUDIO]),
-    src: PropTypes.array
+    src: PropTypes.arrayOf(PropTypes.any)
   }),
   mediaDescription: PropTypes.string
 } : {};

package/es/molecule/feedback/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","classnames","ResourcePlayer","TYPE_IMAGE","TYPE_VIDEO","TYPE_PDF","TYPE_AUDIO","style","Feedback","props","context","media","mediaDescription","title","description","mode","resource","type","feedbackContainerScorm","feedback","innerHTML","__html","descWrapper","resourcePlayer","propTypes","string","shape","oneOf","src","array"],"sources":["../../../src/molecule/feedback/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {pipe, get, extend} from 'lodash/fp';\nimport classnames from 'classnames';\nimport ResourcePlayer, {TYPE_IMAGE, TYPE_VIDEO, TYPE_PDF, TYPE_AUDIO} from '../resource-player';\nimport style from './style.css';\n\nconst Feedback = (props, context) => {\n  const {media, mediaDescription, title, description, mode = 'default'} = props;\n  const resource = media &&\n    media.type && {\n      ...media,\n      ...pipe(get('src.0'), extend({description: mediaDescription}))(media)\n    };\n\n  return (\n    (resource || title || description ? (\n      <div className={mode === 'scorm' ? style.feedbackContainerScorm : null}>\n        <div className={style.feedback} data-name=\"feedback\" id=\"feedback\">\n          <div\n            className={classnames(style.title, style.innerHTML)}\n            data-name=\"title\"\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: title}}\n          />\n          <div className={style.descWrapper}>\n            <div\n              className={classnames(style.description, style.innerHTML)}\n              data-name=\"description\"\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: description}}\n            />\n            {resource ? (\n              <div>\n                <ResourcePlayer className={style.resourcePlayer} resource={resource} />\n                <div\n                  data-name=\"mediaDescription\"\n                  className={classnames(style.mediaDescription, style.innerHTML)}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: mediaDescription}}\n                />\n              </div>\n            ) : null}\n          </div>\n        </div>\n      </div>\n    ) : null) || ''\n  );\n};\n\nFeedback.propTypes = {\n  title: PropTypes.string,\n  description: PropTypes.string,\n  media: PropTypes.shape({\n    type: PropTypes.oneOf([TYPE_IMAGE, TYPE_PDF, TYPE_VIDEO, TYPE_AUDIO]),\n    src: PropTypes.array\n  }),\n  mediaDescription: PropTypes.string\n};\n\nexport default Feedback;\n"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,cAAP,IAAwBC,UAAxB,EAAoCC,UAApC,EAAgDC,QAAhD,EAA0DC,UAA1D,QAA2E,oBAA3E;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACnC,MAAM;IAACC,KAAD;IAAQC,gBAAR;IAA0BC,KAA1B;IAAiCC,WAAjC;IAA8CC,IAAI,GAAG;EAArD,IAAkEN,KAAxE;;EACA,MAAMO,QAAQ,GAAGL,KAAK,IACpBA,KAAK,CAACM,IADS,iBAEVN,KAFU,EAGV,MAAK,KAAI,OAAJ,CAAL,EAAmB,QAAO;IAACG,WAAW,EAAEF;EAAd,CAAP,CAAnB,EAA4DD,KAA5D,CAHU,CAAjB;;EAMA,OACE,CAACK,QAAQ,IAAIH,KAAZ,IAAqBC,WAArB,gBACC;IAAK,SAAS,EAAEC,IAAI,KAAK,OAAT,GAAmBR,KAAK,CAACW,sBAAzB,GAAkD;EAAlE,gBACE;IAAK,SAAS,EAAEX,KAAK,CAACY,QAAtB;IAAgC,aAAU,UAA1C;IAAqD,EAAE,EAAC;EAAxD,gBACE;IACE,SAAS,EAAElB,UAAU,CAACM,KAAK,CAACM,KAAP,EAAcN,KAAK,CAACa,SAApB,CADvB;IAEE,aAAU,OAFZ,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAER;IAAT;EAJ3B,EADF,eAOE;IAAK,SAAS,EAAEN,KAAK,CAACe;EAAtB,gBACE;IACE,SAAS,EAAErB,UAAU,CAACM,KAAK,CAACO,WAAP,EAAoBP,KAAK,CAACa,SAA1B,CADvB;IAEE,aAAU,aAFZ,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAEP;IAAT;EAJ3B,EADF,EAOGE,QAAQ,gBACP,8CACE,oBAAC,cAAD;IAAgB,SAAS,EAAET,KAAK,CAACgB,cAAjC;IAAiD,QAAQ,EAAEP;EAA3D,EADF,eAEE;IACE,aAAU,kBADZ;IAEE,SAAS,EAAEf,UAAU,CAACM,KAAK,CAACK,gBAAP,EAAyBL,KAAK,CAACa,SAA/B,CAFvB,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAET;IAAT;EAJ3B,EAFF,CADO,GAUL,IAjBN,CAPF,CADF,CADD,GA8BG,IA9BJ,KA8Ba,EA/Bf;AAiCD,CAzCD;;AA2CAJ,QAAQ,CAACgB,SAAT,2CAAqB;EACnBX,KAAK,EAAEb,SAAS,CAACyB,MADE;EAEnBX,WAAW,EAAEd,SAAS,CAACyB,MAFJ;EAGnBd,KAAK,EAAEX,SAAS,CAAC0B,KAAV,CAAgB;IACrBT,IAAI,EAAEjB,SAAS,CAAC2B,KAAV,CAAgB,CAACxB,UAAD,EAAaE,QAAb,EAAuBD,UAAvB,EAAmCE,UAAnC,CAAhB,CADe;IAErBsB,GAAG,EAAE5B,SAAS,CAAC6B;EAFM,CAAhB,CAHY;EAOnBjB,gBAAgB,EAAEZ,SAAS,CAACyB;AAPT,CAArB;AAUA,eAAejB,QAAf"}
+{"version":3,"file":"index.js","names":["React","PropTypes","classnames","ResourcePlayer","TYPE_IMAGE","TYPE_VIDEO","TYPE_PDF","TYPE_AUDIO","style","Feedback","props","context","media","mediaDescription","title","description","mode","resource","type","feedbackContainerScorm","feedback","innerHTML","__html","descWrapper","resourcePlayer","propTypes","string","shape","oneOf","src","arrayOf","any"],"sources":["../../../src/molecule/feedback/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {pipe, get, extend} from 'lodash/fp';\nimport classnames from 'classnames';\nimport ResourcePlayer, {TYPE_IMAGE, TYPE_VIDEO, TYPE_PDF, TYPE_AUDIO} from '../resource-player';\nimport style from './style.css';\n\nconst Feedback = (props, context) => {\n  const {media, mediaDescription, title, description, mode = 'default'} = props;\n  const resource = media &&\n    media.type && {\n      ...media,\n      ...pipe(get('src.0'), extend({description: mediaDescription}))(media)\n    };\n\n  return (\n    (resource || title || description ? (\n      <div className={mode === 'scorm' ? style.feedbackContainerScorm : null}>\n        <div className={style.feedback} data-name=\"feedback\" id=\"feedback\">\n          <div\n            className={classnames(style.title, style.innerHTML)}\n            data-name=\"title\"\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: title}}\n          />\n          <div className={style.descWrapper}>\n            <div\n              className={classnames(style.description, style.innerHTML)}\n              data-name=\"description\"\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: description}}\n            />\n            {resource ? (\n              <div>\n                <ResourcePlayer className={style.resourcePlayer} resource={resource} />\n                <div\n                  data-name=\"mediaDescription\"\n                  className={classnames(style.mediaDescription, style.innerHTML)}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: mediaDescription}}\n                />\n              </div>\n            ) : null}\n          </div>\n        </div>\n      </div>\n    ) : null) || null\n  );\n};\n\nFeedback.propTypes = {\n  title: PropTypes.string,\n  description: PropTypes.string,\n  media: PropTypes.shape({\n    type: PropTypes.oneOf([TYPE_IMAGE, TYPE_PDF, TYPE_VIDEO, TYPE_AUDIO]),\n    src: PropTypes.arrayOf(PropTypes.any)\n  }),\n  mediaDescription: PropTypes.string\n};\n\nexport default Feedback;\n"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,cAAP,IAAwBC,UAAxB,EAAoCC,UAApC,EAAgDC,QAAhD,EAA0DC,UAA1D,QAA2E,oBAA3E;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACnC,MAAM;IAACC,KAAD;IAAQC,gBAAR;IAA0BC,KAA1B;IAAiCC,WAAjC;IAA8CC,IAAI,GAAG;EAArD,IAAkEN,KAAxE;;EACA,MAAMO,QAAQ,GAAGL,KAAK,IACpBA,KAAK,CAACM,IADS,iBAEVN,KAFU,EAGV,MAAK,KAAI,OAAJ,CAAL,EAAmB,QAAO;IAACG,WAAW,EAAEF;EAAd,CAAP,CAAnB,EAA4DD,KAA5D,CAHU,CAAjB;;EAMA,OACE,CAACK,QAAQ,IAAIH,KAAZ,IAAqBC,WAArB,gBACC;IAAK,SAAS,EAAEC,IAAI,KAAK,OAAT,GAAmBR,KAAK,CAACW,sBAAzB,GAAkD;EAAlE,gBACE;IAAK,SAAS,EAAEX,KAAK,CAACY,QAAtB;IAAgC,aAAU,UAA1C;IAAqD,EAAE,EAAC;EAAxD,gBACE;IACE,SAAS,EAAElB,UAAU,CAACM,KAAK,CAACM,KAAP,EAAcN,KAAK,CAACa,SAApB,CADvB;IAEE,aAAU,OAFZ,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAER;IAAT;EAJ3B,EADF,eAOE;IAAK,SAAS,EAAEN,KAAK,CAACe;EAAtB,gBACE;IACE,SAAS,EAAErB,UAAU,CAACM,KAAK,CAACO,WAAP,EAAoBP,KAAK,CAACa,SAA1B,CADvB;IAEE,aAAU,aAFZ,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAEP;IAAT;EAJ3B,EADF,EAOGE,QAAQ,gBACP,8CACE,oBAAC,cAAD;IAAgB,SAAS,EAAET,KAAK,CAACgB,cAAjC;IAAiD,QAAQ,EAAEP;EAA3D,EADF,eAEE;IACE,aAAU,kBADZ;IAEE,SAAS,EAAEf,UAAU,CAACM,KAAK,CAACK,gBAAP,EAAyBL,KAAK,CAACa,SAA/B,CAFvB,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAET;IAAT;EAJ3B,EAFF,CADO,GAUL,IAjBN,CAPF,CADF,CADD,GA8BG,IA9BJ,KA8Ba,IA/Bf;AAiCD,CAzCD;;AA2CAJ,QAAQ,CAACgB,SAAT,2CAAqB;EACnBX,KAAK,EAAEb,SAAS,CAACyB,MADE;EAEnBX,WAAW,EAAEd,SAAS,CAACyB,MAFJ;EAGnBd,KAAK,EAAEX,SAAS,CAAC0B,KAAV,CAAgB;IACrBT,IAAI,EAAEjB,SAAS,CAAC2B,KAAV,CAAgB,CAACxB,UAAD,EAAaE,QAAb,EAAuBD,UAAvB,EAAmCE,UAAnC,CAAhB,CADe;IAErBsB,GAAG,EAAE5B,SAAS,CAAC6B,OAAV,CAAkB7B,SAAS,CAAC8B,GAA5B;EAFgB,CAAhB,CAHY;EAOnBlB,gBAAgB,EAAEZ,SAAS,CAACyB;AAPT,CAArB;AAUA,eAAejB,QAAf"}

package/es/molecule/filters/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionNavigationArrowDown","ArrowDown","Select","Provider","style","FiltersWrapper","Filters","Component","constructor","props","state","filter","openFilters","sorted","openSorts","handleOpenFilter","bind","handleOpenSort","handleSearch","onToggleFilters","newValue","setState","onToggleSorts","onSearch","render","sorting","filterCTALabel","filterTabLabel","sortCTALabel","sortTabLabel","filters","skin","context","defaultColor","darkColor","filtersActive","sortingActive","sortView","undefined","select","search","activeDefault","default","title","arrow","activeWrapperSortBy","wrapperSortBy","activeWrapperFilters","wrapperFilters","wrapper","CTAfilter","backgroundColor","activeSorting","contextTypes","childContextTypes","propTypes","string","bool","shape","func"],"sources":["../../../src/molecule/filters/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport Select from '../../atom/select';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\nimport FiltersWrapper from './filters-wrapper';\n\nclass Filters extends React.Component {\n  static propTypes = {\n    filterCTALabel: PropTypes.string,\n    filterTabLabel: PropTypes.string,\n    sortCTALabel: PropTypes.string,\n    sortTabLabel: PropTypes.string,\n    openFilters: PropTypes.bool,\n    openSorts: PropTypes.bool,\n    filters: FiltersWrapper.propTypes.filters,\n    sorting: PropTypes.shape(Select.propTypes),\n    onSearch: PropTypes.func,\n    onToggleFilters: PropTypes.func,\n    onToggleSorts: PropTypes.func\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      filter: !!props.openFilters,\n      sorted: !!props.openSorts\n    };\n    this.handleOpenFilter = this.handleOpenFilter.bind(this);\n    this.handleOpenSort = this.handleOpenSort.bind(this);\n    this.handleSearch = this.handleSearch.bind(this);\n  }\n\n  handleOpenFilter() {\n    const {filter} = this.state;\n    const {onToggleFilters} = this.props;\n\n    const newValue = !filter;\n\n    this.setState({\n      filter: newValue,\n      sorted: false\n    });\n\n    if (onToggleFilters) {\n      onToggleFilters(newValue);\n    }\n  }\n\n  handleOpenSort() {\n    const {sorted} = this.state;\n    const {onToggleSorts} = this.props;\n\n    const newValue = !sorted;\n\n    this.setState({\n      sorted: newValue,\n      filter: false\n    });\n\n    if (onToggleSorts) onToggleSorts(newValue);\n  }\n\n  handleSearch() {\n    const {onSearch} = this.props;\n    this.setState({\n      sorted: false,\n      filter: false\n    });\n    if (onSearch) onSearch();\n  }\n\n  render() {\n    const {\n      sorting,\n      filterCTALabel,\n      filterTabLabel,\n      sortCTALabel,\n      sortTabLabel,\n      filters\n    } = this.props;\n    const {filter, sorted} = this.state;\n    const {skin} = this.context;\n\n    const defaultColor = get('common.primary', skin);\n    const darkColor = get('common.dark', skin);\n    const filtersActive = filter === true;\n    const sortingActive = sorted === true;\n\n    const sortView =\n      sorting !== undefined ? (\n        <div data-name=\"choice\" className={style.select}>\n          <Select {...sorting} />\n        </div>\n      ) : null;\n\n    return (\n      <div data-name=\"search\" className={style.search}>\n        <div\n          data-name=\"filter\"\n          data-open={filtersActive}\n          className={filtersActive ? style.activeDefault : style.default}\n        >\n          <div className={style.title} data-name=\"filterButton\" onClick={this.handleOpenFilter}>\n            {filterTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"sortBy\"\n          data-open={sortingActive}\n          className={sortingActive ? style.activeWrapperSortBy : style.wrapperSortBy}\n        >\n          <div className={style.title} data-name=\"sortButton\" onClick={this.handleOpenSort}>\n            {sortTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"filterWrapper\"\n          className={filtersActive ? style.activeWrapperFilters : style.wrapperFilters}\n        >\n          <FiltersWrapper className={style.wrapper} filters={filters} />\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {filterCTALabel}\n          </div>\n        </div>\n        <div\n          data-name=\"sortWrapper\"\n          className={sortingActive ? style.activeSorting : style.sorting}\n        >\n          {sortView}\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {sortCTALabel}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Filters;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionNavigationArrowDown","ArrowDown","Select","Provider","style","FiltersWrapper","Filters","Component","constructor","props","state","filter","openFilters","sorted","openSorts","handleOpenFilter","bind","handleOpenSort","handleSearch","onToggleFilters","newValue","setState","onToggleSorts","onSearch","render","sorting","filterCTALabel","filterTabLabel","sortCTALabel","sortTabLabel","filters","skin","context","defaultColor","darkColor","filtersActive","sortingActive","sortView","undefined","select","search","activeDefault","default","title","arrow","activeWrapperSortBy","wrapperSortBy","activeWrapperFilters","wrapperFilters","wrapper","CTAfilter","backgroundColor","activeSorting","contextTypes","childContextTypes","propTypes","string","bool","shape","func"],"sources":["../../../src/molecule/filters/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDown} from '@coorpacademy/nova-icons';\nimport Select from '../../atom/select';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\nimport FiltersWrapper from './filters-wrapper';\n\nclass Filters extends React.Component {\n  static propTypes = {\n    filterCTALabel: PropTypes.string,\n    filterTabLabel: PropTypes.string,\n    sortCTALabel: PropTypes.string,\n    sortTabLabel: PropTypes.string,\n    openFilters: PropTypes.bool,\n    openSorts: PropTypes.bool,\n    filters: FiltersWrapper.propTypes.filters,\n    sorting: PropTypes.shape(Select.propTypes),\n    onSearch: PropTypes.func,\n    onToggleFilters: PropTypes.func,\n    onToggleSorts: PropTypes.func\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      filter: !!props.openFilters,\n      sorted: !!props.openSorts\n    };\n    this.handleOpenFilter = this.handleOpenFilter.bind(this);\n    this.handleOpenSort = this.handleOpenSort.bind(this);\n    this.handleSearch = this.handleSearch.bind(this);\n  }\n\n  handleOpenFilter() {\n    const {filter} = this.state;\n    const {onToggleFilters} = this.props;\n\n    const newValue = !filter;\n\n    this.setState({\n      filter: newValue,\n      sorted: false\n    });\n\n    if (onToggleFilters) {\n      onToggleFilters(newValue);\n    }\n  }\n\n  handleOpenSort() {\n    const {sorted} = this.state;\n    const {onToggleSorts} = this.props;\n\n    const newValue = !sorted;\n\n    this.setState({\n      sorted: newValue,\n      filter: false\n    });\n\n    if (onToggleSorts) onToggleSorts(newValue);\n  }\n\n  handleSearch() {\n    const {onSearch} = this.props;\n    this.setState({\n      sorted: false,\n      filter: false\n    });\n    if (onSearch) onSearch();\n  }\n\n  render() {\n    const {sorting, filterCTALabel, filterTabLabel, sortCTALabel, sortTabLabel, filters} =\n      this.props;\n    const {filter, sorted} = this.state;\n    const {skin} = this.context;\n\n    const defaultColor = get('common.primary', skin);\n    const darkColor = get('common.dark', skin);\n    const filtersActive = filter === true;\n    const sortingActive = sorted === true;\n\n    const sortView =\n      sorting !== undefined ? (\n        <div data-name=\"choice\" className={style.select}>\n          <Select {...sorting} />\n        </div>\n      ) : null;\n\n    return (\n      <div data-name=\"search\" className={style.search}>\n        <div\n          data-name=\"filter\"\n          data-open={filtersActive}\n          className={filtersActive ? style.activeDefault : style.default}\n        >\n          <div className={style.title} data-name=\"filterButton\" onClick={this.handleOpenFilter}>\n            {filterTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"sortBy\"\n          data-open={sortingActive}\n          className={sortingActive ? style.activeWrapperSortBy : style.wrapperSortBy}\n        >\n          <div className={style.title} data-name=\"sortButton\" onClick={this.handleOpenSort}>\n            {sortTabLabel}\n            <div className={style.arrow}>\n              <ArrowDown color={darkColor} height={14} />\n            </div>\n          </div>\n        </div>\n        <div\n          data-name=\"filterWrapper\"\n          className={filtersActive ? style.activeWrapperFilters : style.wrapperFilters}\n        >\n          <FiltersWrapper className={style.wrapper} filters={filters} />\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {filterCTALabel}\n          </div>\n        </div>\n        <div\n          data-name=\"sortWrapper\"\n          className={sortingActive ? style.activeSorting : style.sorting}\n        >\n          {sortView}\n          <div\n            data-name=\"cta\"\n            className={style.CTAfilter}\n            style={{\n              backgroundColor: defaultColor\n            }}\n            onClick={this.handleSearch}\n          >\n            {sortCTALabel}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default Filters;\n"],"mappings":"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"}

package/es/molecule/menu-list/index.js

@@ -33,7 +33,8 @@ const MenuList = props => {
     }, /*#__PURE__*/React.createElement("a", {
       href: href,
       target: outgoing ? '_blank' : '_self',
-      onClick: onClick
+      onClick: onClick,
+      rel: "noreferrer"
     }, title), subItemsView);
   });
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {

package/es/molecule/menu-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","SsMenuList","style","buttonStyle","primary","secondary","MenuList","props","menuItems","MenuitemDiv","map","item","index","title","href","type","subItems","outgoing","onClick","subItemsView","subNav","toggleBox","toggler","list","propTypes","arrayOf","shape","string","oneOf","bool"],"sources":["../../../src/molecule/menu-list/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {keys, isNil} from 'lodash/fp';\nimport SsMenuList from '../ssmenu-list';\nimport style from './style.css';\n\nconst buttonStyle = {\n  primary: style.primary,\n  secondary: style.secondary\n};\n\nconst MenuList = props => {\n  const {menuItems = []} = props;\n\n  const MenuitemDiv = menuItems.map((item, index) => {\n    const {title, href, type, subItems, outgoing = false, onClick} = item;\n\n    const subItemsView = !isNil(subItems) ? (\n      <div className={style.subNav}>\n        <SsMenuList items={item.subItems} />\n      </div>\n    ) : null;\n\n    return (\n      <li key={index} className={type ? buttonStyle[type] : style.item}>\n        <a href={href} target={outgoing ? '_blank' : '_self'} onClick={onClick}>\n          {title}\n        </a>\n        {subItemsView}\n      </li>\n    );\n  });\n\n  return (\n    <div>\n      <input type=\"checkbox\" id=\"toggle\" className={style.toggleBox} />\n      <label htmlFor=\"toggle\" className={style.toggler}>\n        ≡\n      </label>\n      <ul className={style.list}>{MenuitemDiv}</ul>\n    </div>\n  );\n};\n\nMenuList.propTypes = {\n  menuItems: PropTypes.arrayOf(\n    PropTypes.shape({\n      href: PropTypes.string,\n      title: PropTypes.string,\n      type: PropTypes.oneOf(keys(buttonStyle)),\n      outgoing: PropTypes.bool\n    })\n  )\n};\n\nexport default MenuList;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,UAAP,MAAuB,gBAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,WAAW,GAAG;EAClBC,OAAO,EAAEF,KAAK,CAACE,OADG;EAElBC,SAAS,EAAEH,KAAK,CAACG;AAFC,CAApB;;AAKA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,SAAS,GAAG;EAAb,IAAmBD,KAAzB;EAEA,MAAME,WAAW,GAAGD,SAAS,CAACE,GAAV,CAAc,CAACC,IAAD,EAAOC,KAAP,KAAiB;IACjD,MAAM;MAACC,KAAD;MAAQC,IAAR;MAAcC,IAAd;MAAoBC,QAApB;MAA8BC,QAAQ,GAAG,KAAzC;MAAgDC;IAAhD,IAA2DP,IAAjE;IAEA,MAAMQ,YAAY,GAAG,CAAC,OAAMH,QAAN,CAAD,gBACnB;MAAK,SAAS,EAAEd,KAAK,CAACkB;IAAtB,gBACE,oBAAC,UAAD;MAAY,KAAK,EAAET,IAAI,CAACK;IAAxB,EADF,CADmB,GAIjB,IAJJ;IAMA,oBACE;MAAI,GAAG,EAAEJ,KAAT;MAAgB,SAAS,EAAEG,IAAI,GAAGZ,WAAW,CAACY,IAAD,CAAd,GAAuBb,KAAK,CAACS;IAA5D,gBACE;MAAG,IAAI,EAAEG,IAAT;MAAe,MAAM,EAAEG,QAAQ,GAAG,QAAH,GAAc,OAA7C;MAAsD,OAAO,EAAEC;IAA/D,GACGL,KADH,CADF,EAIGM,YAJH,CADF;EAQD,CAjBmB,CAApB;EAmBA,oBACE,8CACE;IAAO,IAAI,EAAC,UAAZ;IAAuB,EAAE,EAAC,QAA1B;IAAmC,SAAS,EAAEjB,KAAK,CAACmB;EAApD,EADF,eAEE;IAAO,OAAO,EAAC,QAAf;IAAwB,SAAS,EAAEnB,KAAK,CAACoB;EAAzC,YAFF,eAKE;IAAI,SAAS,EAAEpB,KAAK,CAACqB;EAArB,GAA4Bd,WAA5B,CALF,CADF;AASD,CA/BD;;AAiCAH,QAAQ,CAACkB,SAAT,2CAAqB;EACnBhB,SAAS,EAAER,SAAS,CAACyB,OAAV,CACTzB,SAAS,CAAC0B,KAAV,CAAgB;IACdZ,IAAI,EAAEd,SAAS,CAAC2B,MADF;IAEdd,KAAK,EAAEb,SAAS,CAAC2B,MAFH;IAGdZ,IAAI,EAAEf,SAAS,CAAC4B,KAAV,CAAgB,MAAKzB,WAAL,CAAhB,CAHQ;IAIdc,QAAQ,EAAEjB,SAAS,CAAC6B;EAJN,CAAhB,CADS;AADQ,CAArB;AAWA,eAAevB,QAAf"}
+{"version":3,"file":"index.js","names":["React","PropTypes","SsMenuList","style","buttonStyle","primary","secondary","MenuList","props","menuItems","MenuitemDiv","map","item","index","title","href","type","subItems","outgoing","onClick","subItemsView","subNav","toggleBox","toggler","list","propTypes","arrayOf","shape","string","oneOf","bool"],"sources":["../../../src/molecule/menu-list/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {keys, isNil} from 'lodash/fp';\nimport SsMenuList from '../ssmenu-list';\nimport style from './style.css';\n\nconst buttonStyle = {\n  primary: style.primary,\n  secondary: style.secondary\n};\n\nconst MenuList = props => {\n  const {menuItems = []} = props;\n\n  const MenuitemDiv = menuItems.map((item, index) => {\n    const {title, href, type, subItems, outgoing = false, onClick} = item;\n\n    const subItemsView = !isNil(subItems) ? (\n      <div className={style.subNav}>\n        <SsMenuList items={item.subItems} />\n      </div>\n    ) : null;\n\n    return (\n      <li key={index} className={type ? buttonStyle[type] : style.item}>\n        <a href={href} target={outgoing ? '_blank' : '_self'} onClick={onClick} rel=\"noreferrer\">\n          {title}\n        </a>\n        {subItemsView}\n      </li>\n    );\n  });\n\n  return (\n    <div>\n      <input type=\"checkbox\" id=\"toggle\" className={style.toggleBox} />\n      <label htmlFor=\"toggle\" className={style.toggler}>\n        ≡\n      </label>\n      <ul className={style.list}>{MenuitemDiv}</ul>\n    </div>\n  );\n};\n\nMenuList.propTypes = {\n  menuItems: PropTypes.arrayOf(\n    PropTypes.shape({\n      href: PropTypes.string,\n      title: PropTypes.string,\n      type: PropTypes.oneOf(keys(buttonStyle)),\n      outgoing: PropTypes.bool\n    })\n  )\n};\n\nexport default MenuList;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,UAAP,MAAuB,gBAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,WAAW,GAAG;EAClBC,OAAO,EAAEF,KAAK,CAACE,OADG;EAElBC,SAAS,EAAEH,KAAK,CAACG;AAFC,CAApB;;AAKA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,SAAS,GAAG;EAAb,IAAmBD,KAAzB;EAEA,MAAME,WAAW,GAAGD,SAAS,CAACE,GAAV,CAAc,CAACC,IAAD,EAAOC,KAAP,KAAiB;IACjD,MAAM;MAACC,KAAD;MAAQC,IAAR;MAAcC,IAAd;MAAoBC,QAApB;MAA8BC,QAAQ,GAAG,KAAzC;MAAgDC;IAAhD,IAA2DP,IAAjE;IAEA,MAAMQ,YAAY,GAAG,CAAC,OAAMH,QAAN,CAAD,gBACnB;MAAK,SAAS,EAAEd,KAAK,CAACkB;IAAtB,gBACE,oBAAC,UAAD;MAAY,KAAK,EAAET,IAAI,CAACK;IAAxB,EADF,CADmB,GAIjB,IAJJ;IAMA,oBACE;MAAI,GAAG,EAAEJ,KAAT;MAAgB,SAAS,EAAEG,IAAI,GAAGZ,WAAW,CAACY,IAAD,CAAd,GAAuBb,KAAK,CAACS;IAA5D,gBACE;MAAG,IAAI,EAAEG,IAAT;MAAe,MAAM,EAAEG,QAAQ,GAAG,QAAH,GAAc,OAA7C;MAAsD,OAAO,EAAEC,OAA/D;MAAwE,GAAG,EAAC;IAA5E,GACGL,KADH,CADF,EAIGM,YAJH,CADF;EAQD,CAjBmB,CAApB;EAmBA,oBACE,8CACE;IAAO,IAAI,EAAC,UAAZ;IAAuB,EAAE,EAAC,QAA1B;IAAmC,SAAS,EAAEjB,KAAK,CAACmB;EAApD,EADF,eAEE;IAAO,OAAO,EAAC,QAAf;IAAwB,SAAS,EAAEnB,KAAK,CAACoB;EAAzC,YAFF,eAKE;IAAI,SAAS,EAAEpB,KAAK,CAACqB;EAArB,GAA4Bd,WAA5B,CALF,CADF;AASD,CA/BD;;AAiCAH,QAAQ,CAACkB,SAAT,2CAAqB;EACnBhB,SAAS,EAAER,SAAS,CAACyB,OAAV,CACTzB,SAAS,CAAC0B,KAAV,CAAgB;IACdZ,IAAI,EAAEd,SAAS,CAAC2B,MADF;IAEdd,KAAK,EAAEb,SAAS,CAAC2B,MAFH;IAGdZ,IAAI,EAAEf,SAAS,CAAC4B,KAAV,CAAgB,MAAKzB,WAAL,CAAhB,CAHQ;IAIdc,QAAQ,EAAEjB,SAAS,CAAC6B;EAJN,CAAhB,CADS;AADQ,CAArB;AAWA,eAAevB,QAAf"}

package/es/molecule/questions/free-text/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useMemo","useState","PropTypes","convert","Provider","GetSkinFromContext","style","FreeText","props","legacyContext","skin","placeholder","value","onChange","ariaLabel","hovered","setHovered","handleChange","e","target","primarySkinColor","handleMouseOver","handleMouseLeave","shadowBoxPrimaryColor","wrapper","boxShadow","freeText","color","contextTypes","childContextTypes","propTypes","string","func"],"sources":["../../../../src/molecule/questions/free-text/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport style from './style.css';\n\nconst FreeText = (props, legacyContext) => {\n  const skin = GetSkinFromContext(legacyContext);\n  const {placeholder = '', value = '', onChange = noop, 'aria-label': ariaLabel} = props;\n  const [hovered, setHovered] = useState(false);\n\n  const handleChange = useCallback(e => onChange(e.target.value), [onChange]);\n  const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n  const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n  const shadowBoxPrimaryColor = useMemo(() => convert(`color(${primarySkinColor} a(12%))`), [\n    primarySkinColor\n  ]);\n\n  return (\n    <div\n      data-name=\"freeText\"\n      className={style.wrapper}\n      onMouseOver={handleMouseOver}\n      onMouseLeave={handleMouseLeave}\n      style={{\n        ...(value && {\n          boxShadow: hovered ? 'none' : `0 4px 16px ${shadowBoxPrimaryColor}`\n        })\n      }}\n    >\n      <input\n        data-name=\"free-text-input\"\n        type=\"text\"\n        aria-label={ariaLabel || value || placeholder}\n        className={style.freeText}\n        placeholder={placeholder}\n        value={value}\n        onInput={handleChange}\n        onChange={noop}\n        style={{\n          boxShadow: `0 4px 16px ${shadowBoxPrimaryColor}`,\n          ...(value && {\n            boxShadow: `0 4px 16px ${\n              hovered ? convert(`color(${primarySkinColor} a(20%))`) : shadowBoxPrimaryColor\n            }`\n          }),\n          color: primarySkinColor\n        }}\n      />\n    </div>\n  );\n};\n\nFreeText.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nFreeText.propTypes = {\n  placeholder: PropTypes.string,\n  value: PropTypes.string,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string\n};\n\nexport default FreeText;\n"],"mappings":";;;;;AAAA,OAAOA,KAAP,IAAeC,WAAf,EAA4BC,OAA5B,EAAqCC,QAArC,QAAoD,OAApD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,OAAR,QAAsB,oBAAtB;AACA,OAAOC,QAAP,IAAkBC,kBAAlB,QAA2C,wBAA3C;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACzC,MAAMC,IAAI,GAAGL,kBAAkB,CAACI,aAAD,CAA/B;EACA,MAAM;IAACE,WAAW,GAAG,EAAf;IAAmBC,KAAK,GAAG,EAA3B;IAA+BC,QAAQ,QAAvC;IAAgD,cAAcC;EAA9D,IAA2EN,KAAjF;EACA,MAAM,CAACO,OAAD,EAAUC,UAAV,IAAwBf,QAAQ,CAAC,KAAD,CAAtC;EAEA,MAAMgB,YAAY,GAAGlB,WAAW,CAACmB,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,KAAV,CAAd,EAAgC,CAACC,QAAD,CAAhC,CAAhC;;EACA,MAAMO,gBAAgB,GAAG,OAAM,SAAN,EAAiB,gBAAjB,EAAmCV,IAAnC,CAAzB;;EAEA,MAAMW,eAAe,GAAGtB,WAAW,CAAC,MAAMiB,UAAU,CAAC,IAAD,CAAjB,EAAyB,CAACA,UAAD,CAAzB,CAAnC;EAEA,MAAMM,gBAAgB,GAAGvB,WAAW,CAAC,MAAMiB,UAAU,CAAC,KAAD,CAAjB,EAA0B,CAACA,UAAD,CAA1B,CAApC;EAEA,MAAMO,qBAAqB,GAAGvB,OAAO,CAAC,MAAMG,OAAO,CAAE,SAAQiB,gBAAiB,UAA3B,CAAd,EAAqD,CACxFA,gBADwF,CAArD,CAArC;EAIA,oBACE;IACE,aAAU,UADZ;IAEE,SAAS,EAAEd,KAAK,CAACkB,OAFnB;IAGE,WAAW,EAAEH,eAHf;IAIE,YAAY,EAAEC,gBAJhB;IAKE,KAAK,eACCV,KAAK,IAAI;MACXa,SAAS,EAAEV,OAAO,GAAG,MAAH,GAAa,cAAaQ,qBAAsB;IADvD,CADV;EALP,gBAWE;IACE,aAAU,iBADZ;IAEE,IAAI,EAAC,MAFP;IAGE,cAAYT,SAAS,IAAIF,KAAb,IAAsBD,WAHpC;IAIE,SAAS,EAAEL,KAAK,CAACoB,QAJnB;IAKE,WAAW,EAAEf,WALf;IAME,KAAK,EAAEC,KANT;IAOE,OAAO,EAAEK,YAPX;IAQE,QAAQ,OARV;IASE,KAAK;MACHQ,SAAS,EAAG,cAAaF,qBAAsB;IAD5C,GAECX,KAAK,IAAI;MACXa,SAAS,EAAG,cACVV,OAAO,GAAGZ,OAAO,CAAE,SAAQiB,gBAAiB,UAA3B,CAAV,GAAkDG,qBAC1D;IAHU,CAFV;MAOHI,KAAK,EAAEP;IAPJ;EATP,EAXF,CADF;AAiCD,CAjDD;;AAmDAb,QAAQ,CAACqB,YAAT,GAAwB;EACtBlB,IAAI,EAAEN,QAAQ,CAACyB,iBAAT,CAA2BnB;AADX,CAAxB;AAIAH,QAAQ,CAACuB,SAAT,2CAAqB;EACnBnB,WAAW,EAAET,SAAS,CAAC6B,MADJ;EAEnBnB,KAAK,EAAEV,SAAS,CAAC6B,MAFE;EAGnBlB,QAAQ,EAAEX,SAAS,CAAC8B,IAHD;EAInB,cAAc9B,SAAS,CAAC6B;AAJL,CAArB;AAOA,eAAexB,QAAf"}
+{"version":3,"file":"index.js","names":["React","useCallback","useMemo","useState","PropTypes","convert","Provider","GetSkinFromContext","style","FreeText","props","legacyContext","skin","placeholder","value","onChange","ariaLabel","hovered","setHovered","handleChange","e","target","primarySkinColor","handleMouseOver","handleMouseLeave","shadowBoxPrimaryColor","wrapper","boxShadow","freeText","color","contextTypes","childContextTypes","propTypes","string","func"],"sources":["../../../../src/molecule/questions/free-text/index.js"],"sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider, {GetSkinFromContext} from '../../../atom/provider';\nimport style from './style.css';\n\nconst FreeText = (props, legacyContext) => {\n  const skin = GetSkinFromContext(legacyContext);\n  const {placeholder = '', value = '', onChange = noop, 'aria-label': ariaLabel} = props;\n  const [hovered, setHovered] = useState(false);\n\n  const handleChange = useCallback(e => onChange(e.target.value), [onChange]);\n  const primarySkinColor = getOr('#00B0FF', 'common.primary', skin);\n\n  const handleMouseOver = useCallback(() => setHovered(true), [setHovered]);\n\n  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n  const shadowBoxPrimaryColor = useMemo(\n    () => convert(`color(${primarySkinColor} a(12%))`),\n    [primarySkinColor]\n  );\n\n  return (\n    <div\n      data-name=\"freeText\"\n      className={style.wrapper}\n      onMouseOver={handleMouseOver}\n      onMouseLeave={handleMouseLeave}\n      style={{\n        ...(value && {\n          boxShadow: hovered ? 'none' : `0 4px 16px ${shadowBoxPrimaryColor}`\n        })\n      }}\n    >\n      <input\n        data-name=\"free-text-input\"\n        type=\"text\"\n        aria-label={ariaLabel || value || placeholder}\n        className={style.freeText}\n        placeholder={placeholder}\n        value={value}\n        onInput={handleChange}\n        onChange={noop}\n        style={{\n          boxShadow: `0 4px 16px ${shadowBoxPrimaryColor}`,\n          ...(value && {\n            boxShadow: `0 4px 16px ${\n              hovered ? convert(`color(${primarySkinColor} a(20%))`) : shadowBoxPrimaryColor\n            }`\n          }),\n          color: primarySkinColor\n        }}\n      />\n    </div>\n  );\n};\n\nFreeText.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nFreeText.propTypes = {\n  placeholder: PropTypes.string,\n  value: PropTypes.string,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string\n};\n\nexport default FreeText;\n"],"mappings":";;;;;AAAA,OAAOA,KAAP,IAAeC,WAAf,EAA4BC,OAA5B,EAAqCC,QAArC,QAAoD,OAApD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,OAAR,QAAsB,oBAAtB;AACA,OAAOC,QAAP,IAAkBC,kBAAlB,QAA2C,wBAA3C;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACzC,MAAMC,IAAI,GAAGL,kBAAkB,CAACI,aAAD,CAA/B;EACA,MAAM;IAACE,WAAW,GAAG,EAAf;IAAmBC,KAAK,GAAG,EAA3B;IAA+BC,QAAQ,QAAvC;IAAgD,cAAcC;EAA9D,IAA2EN,KAAjF;EACA,MAAM,CAACO,OAAD,EAAUC,UAAV,IAAwBf,QAAQ,CAAC,KAAD,CAAtC;EAEA,MAAMgB,YAAY,GAAGlB,WAAW,CAACmB,CAAC,IAAIL,QAAQ,CAACK,CAAC,CAACC,MAAF,CAASP,KAAV,CAAd,EAAgC,CAACC,QAAD,CAAhC,CAAhC;;EACA,MAAMO,gBAAgB,GAAG,OAAM,SAAN,EAAiB,gBAAjB,EAAmCV,IAAnC,CAAzB;;EAEA,MAAMW,eAAe,GAAGtB,WAAW,CAAC,MAAMiB,UAAU,CAAC,IAAD,CAAjB,EAAyB,CAACA,UAAD,CAAzB,CAAnC;EAEA,MAAMM,gBAAgB,GAAGvB,WAAW,CAAC,MAAMiB,UAAU,CAAC,KAAD,CAAjB,EAA0B,CAACA,UAAD,CAA1B,CAApC;EAEA,MAAMO,qBAAqB,GAAGvB,OAAO,CACnC,MAAMG,OAAO,CAAE,SAAQiB,gBAAiB,UAA3B,CADsB,EAEnC,CAACA,gBAAD,CAFmC,CAArC;EAKA,oBACE;IACE,aAAU,UADZ;IAEE,SAAS,EAAEd,KAAK,CAACkB,OAFnB;IAGE,WAAW,EAAEH,eAHf;IAIE,YAAY,EAAEC,gBAJhB;IAKE,KAAK,eACCV,KAAK,IAAI;MACXa,SAAS,EAAEV,OAAO,GAAG,MAAH,GAAa,cAAaQ,qBAAsB;IADvD,CADV;EALP,gBAWE;IACE,aAAU,iBADZ;IAEE,IAAI,EAAC,MAFP;IAGE,cAAYT,SAAS,IAAIF,KAAb,IAAsBD,WAHpC;IAIE,SAAS,EAAEL,KAAK,CAACoB,QAJnB;IAKE,WAAW,EAAEf,WALf;IAME,KAAK,EAAEC,KANT;IAOE,OAAO,EAAEK,YAPX;IAQE,QAAQ,OARV;IASE,KAAK;MACHQ,SAAS,EAAG,cAAaF,qBAAsB;IAD5C,GAECX,KAAK,IAAI;MACXa,SAAS,EAAG,cACVV,OAAO,GAAGZ,OAAO,CAAE,SAAQiB,gBAAiB,UAA3B,CAAV,GAAkDG,qBAC1D;IAHU,CAFV;MAOHI,KAAK,EAAEP;IAPJ;EATP,EAXF,CADF;AAiCD,CAlDD;;AAoDAb,QAAQ,CAACqB,YAAT,GAAwB;EACtBlB,IAAI,EAAEN,QAAQ,CAACyB,iBAAT,CAA2BnB;AADX,CAAxB;AAIAH,QAAQ,CAACuB,SAAT,2CAAqB;EACnBnB,WAAW,EAAET,SAAS,CAAC6B,MADJ;EAEnBnB,KAAK,EAAEV,SAAS,CAAC6B,MAFE;EAGnBlB,QAAQ,EAAEX,SAAS,CAAC8B,IAHD;EAInB,cAAc9B,SAAS,CAAC6B;AAJL,CAArB;AAOA,eAAexB,QAAf"}

package/es/molecule/questions/free-text/index.native.js

@@ -1,17 +1,23 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import { View, StyleSheet, TextInput } from 'react-native';
 import React, { useState, useEffect, useCallback } from 'react';
 import { useTemplateContext } from '../../../template/app-review/template-context';
 import { ANALYTICS_EVENT_TYPE } from '../../../variables/analytics';
+import { BOX_STYLE } from '../../../variables/shadow';
 
 const createStyleSheet = (brandTheme, theme) => StyleSheet.create({
-  input: {
+  // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread
+  input: _extends({
     padding: theme.spacing.tiny,
-    borderWidth: 1,
     borderColor: theme.colors.gray.lightMedium,
-    borderRadius: theme.radius.common,
-    backgroundColor: theme.colors.white,
-    minWidth: 175
-  },
+    borderRadius: theme.radius.regular,
+    minWidth: 175,
+    marginHorizontal: 12,
+    paddingVertical: 16
+  }, BOX_STYLE, {
+    backgroundColor: theme.colors.white
+  }),
   text: {
     borderColor: brandTheme?.colors.primary,
     color: brandTheme?.colors.primary || theme.colors.gray.medium,

package/es/molecule/questions/free-text/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["View","StyleSheet","TextInput","React","useState","useEffect","useCallback","useTemplateContext","ANALYTICS_EVENT_TYPE","createStyleSheet","brandTheme","theme","create","input","padding","spacing","tiny","borderWidth","borderColor","colors","gray","lightMedium","borderRadius","radius","common","backgroundColor","white","minWidth","text","primary","color","medium","fontWeight","bold","fontSize","regular","textAlign","spaced","paddingVertical","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","styleSheet","setStylesheet","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","INPUT_FOCUS","handleBlur","INPUT_BLUR","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n  fullWidth?: boolean;\n  testID: string;\n  questionType: QuestionType;\n  analytics?: Analytics;\n  onChange: (text: string) => void;\n  isDisabled?: boolean;\n  value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n  input: ViewStyle;\n  text: ViewStyle;\n  spaced: ViewStyle;\n  fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: any, theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    input: {\n      padding: theme.spacing.tiny,\n      borderWidth: 1,\n      borderColor: theme.colors.gray.lightMedium,\n      borderRadius: theme.radius.common,\n      backgroundColor: theme.colors.white,\n      minWidth: 175\n    },\n    text: {\n      borderColor: brandTheme?.colors.primary,\n      color: brandTheme?.colors.primary || theme.colors.gray.medium,\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.regular,\n      textAlign: 'center'\n    },\n    spaced: {\n      paddingVertical: theme.spacing.tiny\n    },\n    fullWitdh: {\n      width: '100%'\n    }\n  });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n  analytics &&\n    analytics.logEvent(eventName, {\n      id: `question-input-text`,\n      questionType\n    });\n};\n\nconst FreeText = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {brandTheme, theme, translations} = templateContext;\n  const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n  // ------------------------------------\n\n  const {\n    analytics,\n    questionType,\n    fullWidth = false,\n    testID,\n    onChange,\n    isDisabled = false,\n    value\n  } = props;\n\n  // ------------------------------------\n\n  const handleFocus = useCallback(\n    () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n    [analytics, questionType]\n  );\n\n  const handleBlur = useCallback(\n    () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n    [analytics, questionType]\n  );\n\n  // ------------------------------------\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(brandTheme, theme);\n    setStylesheet(_stylesheet);\n  }, [brandTheme, theme]);\n\n  // ------------------------------------\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n      <TextInput\n        style={[styleSheet.input, styleSheet.text]}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onChangeText={onChange}\n        placeholder={translations.typeHere}\n        placeholderTextColor={PLACEHOLDER_COLOR}\n        value={value}\n        testID={testID}\n        editable={!isDisabled}\n        selectTextOnFocus={!isDisabled}\n      />\n    </View>\n  );\n};\n\nexport default FreeText;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["View","StyleSheet","TextInput","React","useState","useEffect","useCallback","useTemplateContext","ANALYTICS_EVENT_TYPE","BOX_STYLE","createStyleSheet","brandTheme","theme","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","styleSheet","setStylesheet","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","INPUT_FOCUS","handleBlur","INPUT_BLUR","_stylesheet","typeHere"],"sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"sourcesContent":["import {View, StyleSheet, TextInput, ViewStyle} from 'react-native';\nimport React, {useState, useEffect, useCallback} from 'react';\nimport {useTemplateContext} from '../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE, Analytics} from '../../../variables/analytics';\nimport {Theme} from '../../../variables/theme.native';\nimport {BOX_STYLE} from '../../../variables/shadow';\n\ntype QuestionType = 'basic' | 'template';\n\ninterface Props {\n  fullWidth?: boolean;\n  testID: string;\n  questionType: QuestionType;\n  analytics?: Analytics;\n  onChange: (text: string) => void;\n  isDisabled?: boolean;\n  value?: string; // when value is undefined, TextInput acts as not controlled\n}\n\ntype StyleSheetType = {\n  input: ViewStyle;\n  text: ViewStyle;\n  spaced: ViewStyle;\n  fullWitdh: ViewStyle;\n};\n\nconst createStyleSheet = (brandTheme: any, theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n    input: {\n      padding: theme.spacing.tiny,\n      borderColor: theme.colors.gray.lightMedium,\n      borderRadius: theme.radius.regular,\n      minWidth: 175,\n      marginHorizontal: 12,\n      paddingVertical: 16,\n      ...BOX_STYLE,\n      backgroundColor: theme.colors.white\n    },\n    text: {\n      borderColor: brandTheme?.colors.primary,\n      color: brandTheme?.colors.primary || theme.colors.gray.medium,\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.regular,\n      textAlign: 'center'\n    },\n    spaced: {\n      paddingVertical: theme.spacing.tiny\n    },\n    fullWitdh: {\n      width: '100%'\n    }\n  });\n\nconst logEvent = (eventName: string, analytics: Analytics, questionType: QuestionType) => {\n  analytics &&\n    analytics.logEvent(eventName, {\n      id: `question-input-text`,\n      questionType\n    });\n};\n\nconst FreeText = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {brandTheme, theme, translations} = templateContext;\n  const PLACEHOLDER_COLOR = theme.colors.gray.medium;\n\n  // ------------------------------------\n\n  const {\n    analytics,\n    questionType,\n    fullWidth = false,\n    testID,\n    onChange,\n    isDisabled = false,\n    value\n  } = props;\n\n  // ------------------------------------\n\n  const handleFocus = useCallback(\n    () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType),\n    [analytics, questionType]\n  );\n\n  const handleBlur = useCallback(\n    () => analytics && logEvent(ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType),\n    [analytics, questionType]\n  );\n\n  // ------------------------------------\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(brandTheme, theme);\n    setStylesheet(_stylesheet);\n  }, [brandTheme, theme]);\n\n  // ------------------------------------\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={[styleSheet.spaced, fullWidth && styleSheet.fullWitdh]}>\n      <TextInput\n        style={[styleSheet.input, styleSheet.text]}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onChangeText={onChange}\n        placeholder={translations.typeHere}\n        placeholderTextColor={PLACEHOLDER_COLOR}\n        value={value}\n        testID={testID}\n        editable={!isDisabled}\n        selectTextOnFocus={!isDisabled}\n      />\n    </View>\n  );\n};\n\nexport default FreeText;\n"],"mappings":"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"}

package/es/molecule/questions/mobile/template/index.native.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useEffect, useState } from 'react';
 import { View } from 'react-native';
 import trim from 'lodash/fp/trim';
@@ -7,9 +9,10 @@ import Space from '../../../../atom/space/index.native';
 import FreeText from '../../free-text/index.native';
 import { useTemplateContext } from '../../../../template/app-review/template-context';
 import parseTemplateString from '../../../../util/parse-template-string';
+import { BOX_STYLE } from '../../../../variables/shadow';
 
 const createStyleSheet = theme => ({
-  section: {
+  container: {
     width: '100%',
     flexDirection: 'row',
     flexWrap: 'wrap',
@@ -19,21 +22,22 @@ const createStyleSheet = theme => ({
   spaced: {
     paddingVertical: theme.spacing.tiny
   },
-  input: {
-    padding: theme.spacing.tiny,
-    borderWidth: 1,
-    borderColor: theme.colors.gray.lightMedium,
-    borderRadius: theme.radius.common,
-    backgroundColor: theme.colors.white,
-    minWidth: 175
-  },
   htmlText: {
-    padding: theme.spacing.tiny,
     color: theme.colors.black,
     fontWeight: theme.fontWeight.bold,
-    lineHeight: 30
+    lineHeight: 25
   },
-  text: {
+  // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread
+  selectInput: _extends({
+    padding: theme.spacing.tiny,
+    borderRadius: theme.radius.regular,
+    minWidth: 175,
+    marginHorizontal: 12,
+    paddingVertical: 16
+  }, BOX_STYLE, {
+    backgroundColor: theme.colors.white
+  }),
+  selectText: {
     color: theme.colors.gray.medium,
     fontWeight: theme.fontWeight.bold,
     fontSize: theme.fontSize.regular,
@@ -41,49 +45,10 @@ const createStyleSheet = theme => ({
   }
 });
 
-const Section = ({
-  section,
-  choices,
-  index,
-  focusedSelectId,
-  onInputChange,
-  handleBlur,
-  handleFocus,
-  isDisabled,
-  styles
-}) => {
-  const prefix = `question-section-${index + 1}`;
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles.section,
-    key: `container-${prefix}`
-  }, section.map((part, id) => {
-    return /*#__PURE__*/React.createElement(View, {
-      key: `${prefix}-${id}`,
-      style: {
-        flexDirection: 'row'
-      }
-    }, /*#__PURE__*/React.createElement(Item, {
-      prefix: prefix,
-      part: part,
-      choices: choices,
-      index: id,
-      focusedSelectId: focusedSelectId,
-      isDisabled: isDisabled,
-      handleBlur: handleBlur,
-      handleFocus: handleFocus,
-      onInputChange: onInputChange,
-      styles: styles
-    }), /*#__PURE__*/React.createElement(Space, {
-      type: "micro"
-    }));
-  }));
-};
-
 const Item = props => {
   const {
     part,
     index,
-    prefix,
     isDisabled = false,
     focusedSelectId,
     choices,
@@ -99,10 +64,9 @@ const Item = props => {
     translations
   } = templateContext;
   const inputNames = choices.map(choice => choice.name);
-  const id = `${prefix}-part-${index + 1}`;
+  const id = `question-part-${index + 1}`;
   const isFocused = focusedSelectId === id;
-  const selectedStyle = brandTheme && {
-    borderColor: brandTheme.colors.primary,
+  const coloredText = brandTheme && {
     color: brandTheme.colors.primary
   };
 
@@ -136,10 +100,16 @@ const Item = props => {
       }));
     }
 
-    const selectStyle = [styles.input];
+    const selectInputStyle = [styles.selectInput];
+
+    if (value) {
+      selectInputStyle.push(coloredText);
+    }
+
+    const selectTextStyle = [styles.selectText];
 
     if (value) {
-      selectStyle.push(selectedStyle);
+      selectTextStyle.push(coloredText);
     }
 
     if (choice.type === 'select') {
@@ -156,8 +126,8 @@ const Item = props => {
         onBlur: handleBlur,
         onFocus: handleFocus(id),
         onChange: handleInputChange(choice),
-        textStyle: styles.text,
-        style: selectStyle,
+        textStyle: selectTextStyle,
+        style: selectInputStyle,
         analyticsID: `${id}-select${selectedSuffix}${disabledSuffix}`,
         testID: `${id}-select${selectedSuffix}${disabledSuffix}`
       }));
@@ -198,22 +168,27 @@ const QuestionTemplate = props => {
   }
 
   const parts = parseTemplateString(template);
-  const sections = [parts]; // @todo remove useless sections
-
   return /*#__PURE__*/React.createElement(View, {
+    style: styleSheet.container,
     testID: "question-template"
-  }, sections.map((section, index) => /*#__PURE__*/React.createElement(Section, {
-    key: index,
-    section: section,
+  }, parts.map((part, id) => /*#__PURE__*/React.createElement(View, {
+    key: `question-part-${id}`,
+    style: {
+      flexDirection: 'row'
+    }
+  }, /*#__PURE__*/React.createElement(Item, {
+    part: part,
     choices: choices,
-    index: index,
+    index: id,
+    focusedSelectId: focusedSelectId,
+    isDisabled: isDisabled,
     handleBlur: handleBlur,
     handleFocus: handleFocus,
-    focusedSelectId: focusedSelectId,
     onInputChange: onInputChange,
-    isDisabled: isDisabled,
     styles: styleSheet
-  })));
+  }), /*#__PURE__*/React.createElement(Space, {
+    type: "micro"
+  }))));
 };
 
 export default QuestionTemplate;

package/es/molecule/questions/mobile/template/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useEffect","useState","View","trim","Html","Select","Space","FreeText","useTemplateContext","parseTemplateString","createStyleSheet","theme","section","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","input","padding","borderWidth","borderColor","colors","gray","lightMedium","borderRadius","radius","common","backgroundColor","white","minWidth","htmlText","color","black","fontWeight","bold","lineHeight","text","medium","fontSize","regular","textAlign","Section","choices","index","focusedSelectId","onInputChange","handleBlur","handleFocus","isDisabled","styles","prefix","map","part","id","Item","props","templateContext","brandTheme","translations","inputNames","choice","name","isFocused","selectedStyle","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectStyle","push","items","selectAnAnswer","QuestionTemplate","template","styleSheet","setStylesheet","_stylesheet","parts","sections"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n  FocusedSelectId,\n  HandleBlur,\n  HandleFocus,\n  useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\n\ntype StyleSheetType = {\n  section: ViewStyle;\n  spaced: ViewStyle;\n  input: ViewStyle;\n  htmlText: TextStyle;\n  text: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n  section: {\n    width: '100%',\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  spaced: {\n    paddingVertical: theme.spacing.tiny\n  },\n  input: {\n    padding: theme.spacing.tiny,\n    borderWidth: 1,\n    borderColor: theme.colors.gray.lightMedium,\n    borderRadius: theme.radius.common,\n    backgroundColor: theme.colors.white,\n    minWidth: 175\n  },\n  htmlText: {\n    padding: theme.spacing.tiny,\n    color: theme.colors.black,\n    fontWeight: theme.fontWeight.bold,\n    lineHeight: 30\n  },\n  text: {\n    color: theme.colors.gray.medium,\n    fontWeight: theme.fontWeight.bold,\n    fontSize: theme.fontSize.regular,\n    textAlign: 'center'\n  }\n});\n\ntype TemplatePart = {\n  type: 'string' | 'answerField';\n  value: string;\n};\n\ntype SectionProps = {\n  isDisabled: boolean;\n  section: Array<TemplatePart>;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  index: number;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n  styles: any;\n};\n\nconst Section = ({\n  section,\n  choices,\n  index,\n  focusedSelectId,\n  onInputChange,\n  handleBlur,\n  handleFocus,\n  isDisabled,\n  styles\n}: SectionProps) => {\n  const prefix = `question-section-${index + 1}`;\n\n  return (\n    <View style={styles.section} key={`container-${prefix}`}>\n      {section.map((part, id) => {\n        return (\n          <View key={`${prefix}-${id}`} style={{flexDirection: 'row'}}>\n            <Item\n              prefix={prefix}\n              part={part}\n              choices={choices}\n              index={id}\n              focusedSelectId={focusedSelectId}\n              isDisabled={isDisabled}\n              handleBlur={handleBlur}\n              handleFocus={handleFocus}\n              onInputChange={onInputChange}\n              styles={styles}\n            />\n            <Space type=\"micro\" />\n          </View>\n        );\n      })}\n    </View>\n  );\n};\n\ntype ItemProps = {\n  part: TemplatePart;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  index: number;\n  prefix: string;\n  isDisabled?: boolean;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n  styles: any;\n};\n\nconst Item = (props: ItemProps) => {\n  const {\n    part,\n    index,\n    prefix,\n    isDisabled = false,\n    focusedSelectId,\n    choices,\n    onInputChange,\n    handleBlur,\n    handleFocus,\n    styles\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme, translations} = templateContext;\n\n  const inputNames = choices.map(choice => choice.name);\n  const id = `${prefix}-part-${index + 1}`;\n  const isFocused = focusedSelectId === id;\n\n  const selectedStyle = brandTheme && {\n    borderColor: brandTheme.colors.primary,\n    color: brandTheme.colors.primary\n  };\n\n  if (part.type === 'answerField' && inputNames.includes(part.value)) {\n    const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n    const choice = choices[choiceIndex];\n    const {value} = choice;\n\n    if (!choice || !choice.type || !choice.name) {\n      return null;\n    }\n\n    const disabledSuffix = isDisabled ? '-disabled' : '';\n    const selectedSuffix = value ? '-selected' : '';\n\n    const handleInputChange = (_item: TemplateTextChoice | TemplateListOfChoices) => (\n      _value: string\n    ) => onInputChange(_item, _value);\n\n    if (choice.type === 'text') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <FreeText\n            key={id}\n            isDisabled={isDisabled}\n            onChange={handleInputChange(choice)}\n            value={value}\n            testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n            questionType=\"template\"\n          />\n        </View>\n      );\n    }\n\n    const selectStyle: ViewStyle[] = [styles.input];\n    if (value) {\n      selectStyle.push(selectedStyle);\n    }\n\n    if (choice.type === 'select') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <Select\n            isDisabled={isDisabled}\n            questionType=\"template\"\n            values={choice.items}\n            value={value}\n            placeholder={translations.selectAnAnswer}\n            isFocused={isFocused}\n            onBlur={handleBlur}\n            onFocus={handleFocus(id)}\n            onChange={handleInputChange(choice)}\n            textStyle={styles.text}\n            style={selectStyle}\n            analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n            testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n          />\n        </View>\n      );\n    }\n  }\n\n  return (\n    <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n      {trim(part.value || '')}\n    </Html>\n  );\n};\n\nexport type Props = {\n  isDisabled?: boolean;\n  template: string;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n  const {\n    template,\n    onInputChange,\n    choices,\n    handleBlur,\n    handleFocus,\n    focusedSelectId,\n    isDisabled = false\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!template || !styleSheet) {\n    return null;\n  }\n\n  const parts: TemplatePart[] = parseTemplateString(template);\n  const sections = [parts]; // @todo remove useless sections\n\n  return (\n    <View testID=\"question-template\">\n      {sections.map((section, index) => (\n        <Section\n          key={index}\n          section={section}\n          choices={choices}\n          index={index}\n          handleBlur={handleBlur}\n          handleFocus={handleFocus}\n          focusedSelectId={focusedSelectId}\n          onInputChange={onInputChange}\n          isDisabled={isDisabled}\n          styles={styleSheet}\n        />\n      ))}\n    </View>\n  );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useEffect","useState","View","trim","Html","Select","Space","FreeText","useTemplateContext","parseTemplateString","BOX_STYLE","createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","QuestionTemplate","template","styleSheet","setStylesheet","_stylesheet","parts"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n  FocusedSelectId,\n  HandleBlur,\n  HandleFocus,\n  useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  spaced: ViewStyle;\n  htmlText: TextStyle;\n  selectInput: ViewStyle;\n  selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n  container: {\n    width: '100%',\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  spaced: {\n    paddingVertical: theme.spacing.tiny\n  },\n  htmlText: {\n    color: theme.colors.black,\n    fontWeight: theme.fontWeight.bold,\n    lineHeight: 25\n  },\n  // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n  selectInput: {\n    padding: theme.spacing.tiny,\n    borderRadius: theme.radius.regular,\n    minWidth: 175,\n    marginHorizontal: 12,\n    paddingVertical: 16,\n    ...BOX_STYLE,\n    backgroundColor: theme.colors.white\n  },\n  selectText: {\n    color: theme.colors.gray.medium,\n    fontWeight: theme.fontWeight.bold,\n    fontSize: theme.fontSize.regular,\n    textAlign: 'center'\n  }\n});\n\ntype TemplatePart = {\n  type: 'string' | 'answerField';\n  value: string;\n};\n\ntype ItemProps = {\n  part: TemplatePart;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  index: number;\n  isDisabled?: boolean;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n  styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n  const {\n    part,\n    index,\n    isDisabled = false,\n    focusedSelectId,\n    choices,\n    onInputChange,\n    handleBlur,\n    handleFocus,\n    styles\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme, translations} = templateContext;\n\n  const inputNames = choices.map(choice => choice.name);\n  const id = `question-part-${index + 1}`;\n  const isFocused = focusedSelectId === id;\n\n  const coloredText = brandTheme && {\n    color: brandTheme.colors.primary\n  };\n\n  if (part.type === 'answerField' && inputNames.includes(part.value)) {\n    const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n    const choice = choices[choiceIndex];\n    const {value} = choice;\n\n    if (!choice || !choice.type || !choice.name) {\n      return null;\n    }\n\n    const disabledSuffix = isDisabled ? '-disabled' : '';\n    const selectedSuffix = value ? '-selected' : '';\n\n    const handleInputChange = (_item: TemplateTextChoice | TemplateListOfChoices) => (\n      _value: string\n    ) => onInputChange(_item, _value);\n\n    if (choice.type === 'text') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <FreeText\n            key={id}\n            isDisabled={isDisabled}\n            onChange={handleInputChange(choice)}\n            value={value}\n            testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n            questionType=\"template\"\n          />\n        </View>\n      );\n    }\n\n    const selectInputStyle: ViewStyle[] = [styles.selectInput];\n    if (value) {\n      selectInputStyle.push(coloredText);\n    }\n\n    const selectTextStyle: ViewStyle[] = [styles.selectText];\n    if (value) {\n      selectTextStyle.push(coloredText);\n    }\n\n    if (choice.type === 'select') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <Select\n            isDisabled={isDisabled}\n            questionType=\"template\"\n            values={choice.items}\n            value={value}\n            placeholder={translations.selectAnAnswer}\n            isFocused={isFocused}\n            onBlur={handleBlur}\n            onFocus={handleFocus(id)}\n            onChange={handleInputChange(choice)}\n            textStyle={selectTextStyle}\n            style={selectInputStyle}\n            analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n            testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n          />\n        </View>\n      );\n    }\n  }\n\n  return (\n    <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n      {trim(part.value || '')}\n    </Html>\n  );\n};\n\nexport type Props = {\n  isDisabled?: boolean;\n  template: string;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n  const {\n    template,\n    onInputChange,\n    choices,\n    handleBlur,\n    handleFocus,\n    focusedSelectId,\n    isDisabled = false\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!template || !styleSheet) {\n    return null;\n  }\n\n  const parts: TemplatePart[] = parseTemplateString(template);\n\n  return (\n    <View style={styleSheet.container} testID=\"question-template\">\n      {parts.map((part, id) => (\n        <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n          <Item\n            part={part}\n            choices={choices}\n            index={id}\n            focusedSelectId={focusedSelectId}\n            isDisabled={isDisabled}\n            handleBlur={handleBlur}\n            handleFocus={handleFocus}\n            onInputChange={onInputChange}\n            styles={styleSheet}\n          />\n          <Space type=\"micro\" />\n        </View>\n      ))}\n    </View>\n  );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}