@coorpacademy/components 11.9.3-alpha.29 → 11.9.3-alpha.31

package/lib/molecule/popin/index.js

@@ -2,17 +2,29 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _novaIcons = require("@coorpacademy/nova-icons");
+
 var _button = _interopRequireDefault(require("../../atom/button"));
+
 var _loader = _interopRequireDefault(require("../../atom/loader"));
+
 var _style = _interopRequireDefault(require("./style.css"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 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); }
+
 const Popin = (props, context) => {
   const {
     skin
@@ -77,8 +89,7 @@ const Popin = (props, context) => {
     "data-name": `cockpit-popin-header-${type}`
   }, header), /*#__PURE__*/_react.default.createElement("p", {
     className: _style.default.content,
-    "data-name": `cockpit-popin-content-${type}`
-    // eslint-disable-next-line react/no-danger
+    "data-name": `cockpit-popin-content-${type}` // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: content
@@ -133,6 +144,7 @@ const Popin = (props, context) => {
     disabled: isAssistancePopin && !value.message
   }) : null)));
 };
+
 Popin.propTypes = process.env.NODE_ENV !== "production" ? {
   header: _propTypes.default.string,
   content: _propTypes.default.string,

package/lib/molecule/popin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Popin","props","context","skin","primaryColor","header","content","firstButtonLabel","onFirstButtonClick","secondeButtonLabel","onSecondeButtonClick","onClose","type","isLoading","backgroundImageUrl","logo","hiddenStateManagment","Hide","deleteContent","Bin","videoTranslate","LocalesIcon","LogoComponent","backgroundImageStyle","backgroundImage","value","setValue","useState","object","message","email","handleChange","useMemo","event","target","name","isAssistancePopin","handleClickOnSecondButton","style","background","loader","popin","popinHeader","headerCloseIcon","icon","color","__html","width","inputText","inputTextArea","lastInputText","buttonContainer","button","backgroundColor","propTypes","PropTypes","string","func","oneOf","bool"],"sources":["../../../src/molecule/popin/index.js"],"sourcesContent":["import React, {useState, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr} from 'lodash/fp';\n\nimport {\n  NovaCompositionCoorpacademyLocales as LocalesIcon,\n  NovaSolidStatusClose as Close,\n  NovaLineContentEditionBin as Bin,\n  NovaLineContentEditionHide as Hide\n} from '@coorpacademy/nova-icons';\nimport Cta from '../../atom/button';\nimport Loader from '../../atom/loader';\nimport style from './style.css';\n\nconst Popin = (props, context) => {\n  const {skin} = context;\n  const primaryColor = getOr('#00B0FF', 'common.primary', skin);\n  const {\n    header,\n    content,\n    firstButtonLabel,\n    onFirstButtonClick,\n    secondeButtonLabel,\n    onSecondeButtonClick,\n    onClose,\n    type,\n    isLoading = false,\n    backgroundImageUrl\n  } = props;\n\n  const logo = {\n    hiddenStateManagment: Hide,\n    deleteContent: Bin,\n    videoTranslate: LocalesIcon\n  };\n\n  const LogoComponent = logo[type];\n  const backgroundImageStyle = backgroundImageUrl\n    ? {\n        backgroundImage: `url(${backgroundImageUrl})`\n      }\n    : {};\n\n  const [value, setValue] = useState({object: '', message: '', email: ''});\n\n  const handleChange = useMemo(\n    () => event => {\n      setValue({...value, [event.target.name]: event.target.value});\n    },\n    [value]\n  );\n\n  const isAssistancePopin = type === 'assistance';\n\n  const handleClickOnSecondButton = useMemo(() => {\n    return type === 'assistance' ? onSecondeButtonClick(value) : onSecondeButtonClick;\n  }, [value, type, onSecondeButtonClick]);\n\n  return (\n    <div className={style.background} style={backgroundImageStyle}>\n      {isLoading ? (\n        <div className={style.loader}>\n          <Loader data-name=\"cockpit-popin-loader\" />\n        </div>\n      ) : (\n        <div className={style.popin}>\n          <header className={style.popinHeader}>\n            <Close onClick={onClose} className={style.headerCloseIcon} />\n          </header>\n          {LogoComponent ? (\n            <LogoComponent className={style.icon} style={{color: primaryColor}} />\n          ) : null}\n          <div className={style.header} data-name={`cockpit-popin-header-${type}`}>\n            {header}\n          </div>\n          <p\n            className={style.content}\n            data-name={`cockpit-popin-content-${type}`}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: content}}\n          />\n\n          {isAssistancePopin ? (\n            <div style={{width: '70%'}}>\n              <input\n                data-name=\"contact-object\"\n                className={style.inputText}\n                name=\"object\"\n                type=\"text\"\n                placeholder=\"Object\"\n                value={value.object}\n                onChange={handleChange}\n              />\n              <textarea\n                className={(style.inputText, style.inputTextArea)}\n                data-name=\"contact-message\"\n                name=\"message\"\n                type=\"text\"\n                placeholder=\"Message\"\n                value={value.message}\n                onChange={handleChange}\n              />\n              <input\n                className={style.lastInputText}\n                data-name=\"contact-email\"\n                name=\"email\"\n                type=\"text\"\n                placeholder=\"Email\"\n                value={value.email}\n                onChange={handleChange}\n              />\n            </div>\n          ) : null}\n\n          <div className={style.buttonContainer}>\n            {firstButtonLabel ? (\n              <Cta\n                submitValue={firstButtonLabel}\n                onClick={onFirstButtonClick}\n                name={`cockpit-popin-cta-${type}`}\n                className={style.button}\n                style={{\n                  backgroundColor: 'white',\n                  color: 'gray'\n                }}\n              />\n            ) : null}\n            {secondeButtonLabel ? (\n              <Cta\n                submitValue={secondeButtonLabel}\n                onClick={handleClickOnSecondButton}\n                name={`cockpit-popin-cta-${type}`}\n                className={style.button}\n                style={{backgroundColor: primaryColor}}\n                disabled={isAssistancePopin && !value.message}\n              />\n            ) : null}\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nPopin.propTypes = {\n  header: PropTypes.string,\n  content: PropTypes.string,\n  firstButtonLabel: PropTypes.string,\n  onFirstButtonClick: PropTypes.func,\n  secondeButtonLabel: PropTypes.string,\n  onSecondeButtonClick: PropTypes.func,\n  onClose: PropTypes.func,\n  type: PropTypes.oneOf(['videoTranslate', 'hiddenStateManagment', 'deleteContent', 'assistance']),\n  isLoading: PropTypes.bool,\n  backgroundImageUrl: PropTypes.string\n};\n\nexport default Popin;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Popin","props","context","skin","primaryColor","header","content","firstButtonLabel","onFirstButtonClick","secondeButtonLabel","onSecondeButtonClick","onClose","type","isLoading","backgroundImageUrl","logo","hiddenStateManagment","Hide","deleteContent","Bin","videoTranslate","LocalesIcon","LogoComponent","backgroundImageStyle","backgroundImage","value","setValue","useState","object","message","email","handleChange","useMemo","event","target","name","isAssistancePopin","handleClickOnSecondButton","style","background","loader","popin","popinHeader","headerCloseIcon","icon","color","__html","width","inputText","inputTextArea","lastInputText","buttonContainer","button","backgroundColor","propTypes","PropTypes","string","func","oneOf","bool"],"sources":["../../../src/molecule/popin/index.js"],"sourcesContent":["import React, {useState, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr} from 'lodash/fp';\n\nimport {\n  NovaCompositionCoorpacademyLocales as LocalesIcon,\n  NovaSolidStatusClose as Close,\n  NovaLineContentEditionBin as Bin,\n  NovaLineContentEditionHide as Hide\n} from '@coorpacademy/nova-icons';\nimport Cta from '../../atom/button';\nimport Loader from '../../atom/loader';\nimport style from './style.css';\n\nconst Popin = (props, context) => {\n  const {skin} = context;\n  const primaryColor = getOr('#00B0FF', 'common.primary', skin);\n  const {\n    header,\n    content,\n    firstButtonLabel,\n    onFirstButtonClick,\n    secondeButtonLabel,\n    onSecondeButtonClick,\n    onClose,\n    type,\n    isLoading = false,\n    backgroundImageUrl\n  } = props;\n\n  const logo = {\n    hiddenStateManagment: Hide,\n    deleteContent: Bin,\n    videoTranslate: LocalesIcon\n  };\n\n  const LogoComponent = logo[type];\n  const backgroundImageStyle = backgroundImageUrl\n    ? {\n        backgroundImage: `url(${backgroundImageUrl})`\n      }\n    : {};\n\n  const [value, setValue] = useState({object: '', message: '', email: ''});\n\n  const handleChange = useMemo(\n    () => event => {\n      setValue({...value, [event.target.name]: event.target.value});\n    },\n    [value]\n  );\n\n  const isAssistancePopin = type === 'assistance';\n\n  const handleClickOnSecondButton = useMemo(() => {\n    return type === 'assistance' ? onSecondeButtonClick(value) : onSecondeButtonClick;\n  }, [value, type, onSecondeButtonClick]);\n\n  return (\n    <div className={style.background} style={backgroundImageStyle}>\n      {isLoading ? (\n        <div className={style.loader}>\n          <Loader data-name=\"cockpit-popin-loader\" />\n        </div>\n      ) : (\n        <div className={style.popin}>\n          <header className={style.popinHeader}>\n            <Close onClick={onClose} className={style.headerCloseIcon} />\n          </header>\n          {LogoComponent ? (\n            <LogoComponent className={style.icon} style={{color: primaryColor}} />\n          ) : null}\n          <div className={style.header} data-name={`cockpit-popin-header-${type}`}>\n            {header}\n          </div>\n          <p\n            className={style.content}\n            data-name={`cockpit-popin-content-${type}`}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: content}}\n          />\n\n          {isAssistancePopin ? (\n            <div style={{width: '70%'}}>\n              <input\n                data-name=\"contact-object\"\n                className={style.inputText}\n                name=\"object\"\n                type=\"text\"\n                placeholder=\"Object\"\n                value={value.object}\n                onChange={handleChange}\n              />\n              <textarea\n                className={(style.inputText, style.inputTextArea)}\n                data-name=\"contact-message\"\n                name=\"message\"\n                type=\"text\"\n                placeholder=\"Message\"\n                value={value.message}\n                onChange={handleChange}\n              />\n              <input\n                className={style.lastInputText}\n                data-name=\"contact-email\"\n                name=\"email\"\n                type=\"text\"\n                placeholder=\"Email\"\n                value={value.email}\n                onChange={handleChange}\n              />\n            </div>\n          ) : null}\n\n          <div className={style.buttonContainer}>\n            {firstButtonLabel ? (\n              <Cta\n                submitValue={firstButtonLabel}\n                onClick={onFirstButtonClick}\n                name={`cockpit-popin-cta-${type}`}\n                className={style.button}\n                style={{\n                  backgroundColor: 'white',\n                  color: 'gray'\n                }}\n              />\n            ) : null}\n            {secondeButtonLabel ? (\n              <Cta\n                submitValue={secondeButtonLabel}\n                onClick={handleClickOnSecondButton}\n                name={`cockpit-popin-cta-${type}`}\n                className={style.button}\n                style={{backgroundColor: primaryColor}}\n                disabled={isAssistancePopin && !value.message}\n              />\n            ) : null}\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nPopin.propTypes = {\n  header: PropTypes.string,\n  content: PropTypes.string,\n  firstButtonLabel: PropTypes.string,\n  onFirstButtonClick: PropTypes.func,\n  secondeButtonLabel: PropTypes.string,\n  onSecondeButtonClick: PropTypes.func,\n  onClose: PropTypes.func,\n  type: PropTypes.oneOf(['videoTranslate', 'hiddenStateManagment', 'deleteContent', 'assistance']),\n  isLoading: PropTypes.bool,\n  backgroundImageUrl: PropTypes.string\n};\n\nexport default Popin;\n"],"mappings":"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"}

package/lib/molecule/product-card/index.js

@@ -2,12 +2,19 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _template2 = _interopRequireDefault(require("lodash/fp/template"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _provider = _interopRequireDefault(require("../../atom/provider"));
+
 var _style = _interopRequireDefault(require("./style.css"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const ProductCard = (props, context) => {
   const {
     title,
@@ -58,6 +65,7 @@ const ProductCard = (props, context) => {
     className: _style.default.cancelText
   }, translate('product_cancel')))));
 };
+
 ProductCard.contextTypes = {
   translate: _provider.default.childContextTypes.translate
 };

package/lib/molecule/product-card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ProductCard","props","context","title","subtitle","price","currency","checkImage","translate","descriptionItemTranslationKeys","priceTemplate","priceValue","items","map","itemDescription","index","style","productDescriptionItem","productCheckbox","productDescriptionText","product","productHeader","productHeaderTitle","productHeaderSubtitle","productBody","productSeparation","productPrice","cancelText","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","isRequired"],"sources":["../../../src/molecule/product-card/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {template} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst ProductCard = (props, context) => {\n  const {title, subtitle, price, currency, checkImage} = props;\n\n  const {translate} = context;\n\n  const descriptionItemTranslationKeys = [\n    translate('product_desc_culture'),\n    translate('product_desc_partnership'),\n    translate('product_desc_battle'),\n    translate('product_desc_coach'),\n    translate('product_desc_forum'),\n    translate('product_desc_certificates')\n  ];\n\n  const priceTemplate = translate('subscription_price');\n  const priceValue = template(priceTemplate)({price, currency});\n\n  const items = descriptionItemTranslationKeys.map((itemDescription, index) => {\n    return (\n      <div className={style.productDescriptionItem} key={index}>\n        <img className={style.productCheckbox} src={checkImage} />\n        <div className={style.productDescriptionText}>{itemDescription}</div>\n      </div>\n    );\n  });\n\n  return (\n    <div className={style.product}>\n      <div className={style.productHeader}>\n        <div className={style.productHeaderTitle}>{title}</div>\n        <div className={style.productHeaderSubtitle}>{subtitle}</div>\n      </div>\n      <div className={style.productBody}>\n        <div className=\"product__description\">{items}</div>\n        <hr className={style.productSeparation} />\n        <div className={style.productPrice}>\n          <div className={style.priceValue}>{priceValue}</div>\n          <div className={style.cancelText}>{translate('product_cancel')}</div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nProductCard.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nProductCard.propTypes = {\n  title: PropTypes.string.isRequired,\n  subtitle: PropTypes.string.isRequired,\n  currency: PropTypes.string.isRequired,\n  price: PropTypes.string.isRequired,\n  checkImage: PropTypes.string.isRequired\n};\n\nexport default ProductCard;\n"],"mappings":";;;;;AAAA;AACA;AAEA;AACA;AAAgC;AAEhC,MAAMA,WAAW,GAAG,CAACC,KAAK,EAAEC,OAAO,KAAK;EACtC,MAAM;IAACC,KAAK;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,QAAQ;IAAEC;EAAU,CAAC,GAAGN,KAAK;EAE5D,MAAM;IAACO;EAAS,CAAC,GAAGN,OAAO;EAE3B,MAAMO,8BAA8B,GAAG,CACrCD,SAAS,CAAC,sBAAsB,CAAC,EACjCA,SAAS,CAAC,0BAA0B,CAAC,EACrCA,SAAS,CAAC,qBAAqB,CAAC,EAChCA,SAAS,CAAC,oBAAoB,CAAC,EAC/BA,SAAS,CAAC,oBAAoB,CAAC,EAC/BA,SAAS,CAAC,2BAA2B,CAAC,CACvC;EAED,MAAME,aAAa,GAAGF,SAAS,CAAC,oBAAoB,CAAC;EACrD,MAAMG,UAAU,GAAG,wBAASD,aAAa,CAAC,CAAC;IAACL,KAAK;IAAEC;EAAQ,CAAC,CAAC;EAE7D,MAAMM,KAAK,GAAGH,8BAA8B,CAACI,GAAG,CAAC,CAACC,eAAe,EAAEC,KAAK,KAAK;IAC3E,oBACE;MAAK,SAAS,EAAEC,cAAK,CAACC,sBAAuB;MAAC,GAAG,EAAEF;IAAM,gBACvD;MAAK,SAAS,EAAEC,cAAK,CAACE,eAAgB;MAAC,GAAG,EAAEX;IAAW,EAAG,eAC1D;MAAK,SAAS,EAAES,cAAK,CAACG;IAAuB,GAAEL,eAAe,CAAO,CACjE;EAEV,CAAC,CAAC;EAEF,oBACE;IAAK,SAAS,EAAEE,cAAK,CAACI;EAAQ,gBAC5B;IAAK,SAAS,EAAEJ,cAAK,CAACK;EAAc,gBAClC;IAAK,SAAS,EAAEL,cAAK,CAACM;EAAmB,GAAEnB,KAAK,CAAO,eACvD;IAAK,SAAS,EAAEa,cAAK,CAACO;EAAsB,GAAEnB,QAAQ,CAAO,CACzD,eACN;IAAK,SAAS,EAAEY,cAAK,CAACQ;EAAY,gBAChC;IAAK,SAAS,EAAC;EAAsB,GAAEZ,KAAK,CAAO,eACnD;IAAI,SAAS,EAAEI,cAAK,CAACS;EAAkB,EAAG,eAC1C;IAAK,SAAS,EAAET,cAAK,CAACU;EAAa,gBACjC;IAAK,SAAS,EAAEV,cAAK,CAACL;EAAW,GAAEA,UAAU,CAAO,eACpD;IAAK,SAAS,EAAEK,cAAK,CAACW;EAAW,GAAEnB,SAAS,CAAC,gBAAgB,CAAC,CAAO,CACjE,CACF,CACF;AAEV,CAAC;AAEDR,WAAW,CAAC4B,YAAY,GAAG;EACzBpB,SAAS,EAAEqB,iBAAQ,CAACC,iBAAiB,CAACtB;AACxC,CAAC;AAEDR,WAAW,CAAC+B,SAAS,2CAAG;EACtB5B,KAAK,EAAE6B,kBAAS,CAACC,MAAM,CAACC,UAAU;EAClC9B,QAAQ,EAAE4B,kBAAS,CAACC,MAAM,CAACC,UAAU;EACrC5B,QAAQ,EAAE0B,kBAAS,CAACC,MAAM,CAACC,UAAU;EACrC7B,KAAK,EAAE2B,kBAAS,CAACC,MAAM,CAACC,UAAU;EAClC3B,UAAU,EAAEyB,kBAAS,CAACC,MAAM,CAACC;AAC/B,CAAC;AAAC,eAEalC,WAAW;AAAA"}
+{"version":3,"file":"index.js","names":["ProductCard","props","context","title","subtitle","price","currency","checkImage","translate","descriptionItemTranslationKeys","priceTemplate","priceValue","items","map","itemDescription","index","style","productDescriptionItem","productCheckbox","productDescriptionText","product","productHeader","productHeaderTitle","productHeaderSubtitle","productBody","productSeparation","productPrice","cancelText","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","isRequired"],"sources":["../../../src/molecule/product-card/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {template} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nconst ProductCard = (props, context) => {\n  const {title, subtitle, price, currency, checkImage} = props;\n\n  const {translate} = context;\n\n  const descriptionItemTranslationKeys = [\n    translate('product_desc_culture'),\n    translate('product_desc_partnership'),\n    translate('product_desc_battle'),\n    translate('product_desc_coach'),\n    translate('product_desc_forum'),\n    translate('product_desc_certificates')\n  ];\n\n  const priceTemplate = translate('subscription_price');\n  const priceValue = template(priceTemplate)({price, currency});\n\n  const items = descriptionItemTranslationKeys.map((itemDescription, index) => {\n    return (\n      <div className={style.productDescriptionItem} key={index}>\n        <img className={style.productCheckbox} src={checkImage} />\n        <div className={style.productDescriptionText}>{itemDescription}</div>\n      </div>\n    );\n  });\n\n  return (\n    <div className={style.product}>\n      <div className={style.productHeader}>\n        <div className={style.productHeaderTitle}>{title}</div>\n        <div className={style.productHeaderSubtitle}>{subtitle}</div>\n      </div>\n      <div className={style.productBody}>\n        <div className=\"product__description\">{items}</div>\n        <hr className={style.productSeparation} />\n        <div className={style.productPrice}>\n          <div className={style.priceValue}>{priceValue}</div>\n          <div className={style.cancelText}>{translate('product_cancel')}</div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nProductCard.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nProductCard.propTypes = {\n  title: PropTypes.string.isRequired,\n  subtitle: PropTypes.string.isRequired,\n  currency: PropTypes.string.isRequired,\n  price: PropTypes.string.isRequired,\n  checkImage: PropTypes.string.isRequired\n};\n\nexport default ProductCard;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;AAEA,MAAMA,WAAW,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACtC,MAAM;IAACC,KAAD;IAAQC,QAAR;IAAkBC,KAAlB;IAAyBC,QAAzB;IAAmCC;EAAnC,IAAiDN,KAAvD;EAEA,MAAM;IAACO;EAAD,IAAcN,OAApB;EAEA,MAAMO,8BAA8B,GAAG,CACrCD,SAAS,CAAC,sBAAD,CAD4B,EAErCA,SAAS,CAAC,0BAAD,CAF4B,EAGrCA,SAAS,CAAC,qBAAD,CAH4B,EAIrCA,SAAS,CAAC,oBAAD,CAJ4B,EAKrCA,SAAS,CAAC,oBAAD,CAL4B,EAMrCA,SAAS,CAAC,2BAAD,CAN4B,CAAvC;EASA,MAAME,aAAa,GAAGF,SAAS,CAAC,oBAAD,CAA/B;EACA,MAAMG,UAAU,GAAG,wBAASD,aAAT,EAAwB;IAACL,KAAD;IAAQC;EAAR,CAAxB,CAAnB;EAEA,MAAMM,KAAK,GAAGH,8BAA8B,CAACI,GAA/B,CAAmC,CAACC,eAAD,EAAkBC,KAAlB,KAA4B;IAC3E,oBACE;MAAK,SAAS,EAAEC,cAAA,CAAMC,sBAAtB;MAA8C,GAAG,EAAEF;IAAnD,gBACE;MAAK,SAAS,EAAEC,cAAA,CAAME,eAAtB;MAAuC,GAAG,EAAEX;IAA5C,EADF,eAEE;MAAK,SAAS,EAAES,cAAA,CAAMG;IAAtB,GAA+CL,eAA/C,CAFF,CADF;EAMD,CAPa,CAAd;EASA,oBACE;IAAK,SAAS,EAAEE,cAAA,CAAMI;EAAtB,gBACE;IAAK,SAAS,EAAEJ,cAAA,CAAMK;EAAtB,gBACE;IAAK,SAAS,EAAEL,cAAA,CAAMM;EAAtB,GAA2CnB,KAA3C,CADF,eAEE;IAAK,SAAS,EAAEa,cAAA,CAAMO;EAAtB,GAA8CnB,QAA9C,CAFF,CADF,eAKE;IAAK,SAAS,EAAEY,cAAA,CAAMQ;EAAtB,gBACE;IAAK,SAAS,EAAC;EAAf,GAAuCZ,KAAvC,CADF,eAEE;IAAI,SAAS,EAAEI,cAAA,CAAMS;EAArB,EAFF,eAGE;IAAK,SAAS,EAAET,cAAA,CAAMU;EAAtB,gBACE;IAAK,SAAS,EAAEV,cAAA,CAAML;EAAtB,GAAmCA,UAAnC,CADF,eAEE;IAAK,SAAS,EAAEK,cAAA,CAAMW;EAAtB,GAAmCnB,SAAS,CAAC,gBAAD,CAA5C,CAFF,CAHF,CALF,CADF;AAgBD,CA1CD;;AA4CAR,WAAW,CAAC4B,YAAZ,GAA2B;EACzBpB,SAAS,EAAEqB,iBAAA,CAASC,iBAAT,CAA2BtB;AADb,CAA3B;AAIAR,WAAW,CAAC+B,SAAZ,2CAAwB;EACtB5B,KAAK,EAAE6B,kBAAA,CAAUC,MAAV,CAAiBC,UADF;EAEtB9B,QAAQ,EAAE4B,kBAAA,CAAUC,MAAV,CAAiBC,UAFL;EAGtB5B,QAAQ,EAAE0B,kBAAA,CAAUC,MAAV,CAAiBC,UAHL;EAItB7B,KAAK,EAAE2B,kBAAA,CAAUC,MAAV,CAAiBC,UAJF;EAKtB3B,UAAU,EAAEyB,kBAAA,CAAUC,MAAV,CAAiBC;AALP,CAAxB;eAQelC,W"}

package/lib/molecule/progress-bar/index.js

@@ -2,13 +2,21 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _times2 = _interopRequireDefault(require("lodash/fp/times"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _style = _interopRequireDefault(require("./style.css"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 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); }
+
 const ProgressBar = props => {
   const {
     className,
@@ -42,6 +50,7 @@ const ProgressBar = props => {
     className: _style.default.steps
   }, stepList));
 };
+
 ProgressBar.propTypes = process.env.NODE_ENV !== "production" ? {
   className: _propTypes.default.string,
   value: _propTypes.default.number.isRequired,

package/lib/molecule/progress-bar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ProgressBar","props","className","value","max","desc","steps","style","propsStyle","ratio","percentage","Math","floor","text","stepList","index","step","classnames","background","progress","width","texts","description","propTypes","PropTypes","string","number","isRequired","objectOf","oneOfType"],"sources":["../../../src/molecule/progress-bar/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {times} from 'lodash/fp';\nimport style from './style.css';\n\nconst ProgressBar = props => {\n  const {className, value, max, desc = '', steps = 0, style: propsStyle} = props;\n\n  const ratio = value / max;\n  const percentage = Math.floor(ratio * 100);\n  const text = `${percentage}%`;\n  const stepList = times(index => <div className={style.step} key={index} />, steps);\n  return (\n    <div className={classnames(style.background, className)}>\n      <div\n        className={style.progress}\n        style={{\n          ...propsStyle,\n          width: `${ratio * 100}%`\n        }}\n      />\n      <p className={style.texts}>\n        <span className={style.description}>{`${value}/${max} ${desc}`}</span>\n        <span className={style.percentage}>{text}</span>\n      </p>\n      <div className={style.steps}>{stepList}</div>\n    </div>\n  );\n};\n\nProgressBar.propTypes = {\n  className: PropTypes.string,\n  value: PropTypes.number.isRequired,\n  max: PropTypes.number.isRequired,\n  desc: PropTypes.string,\n  steps: PropTypes.number,\n  style: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default ProgressBar;\n"],"mappings":";;;;;AAAA;AACA;AACA;AAEA;AAAgC;AAAA;AAEhC,MAAMA,WAAW,GAAGC,KAAK,IAAI;EAC3B,MAAM;IAACC,SAAS;IAAEC,KAAK;IAAEC,GAAG;IAAEC,IAAI,GAAG,EAAE;IAAEC,KAAK,GAAG,CAAC;IAAEC,KAAK,EAAEC;EAAU,CAAC,GAAGP,KAAK;EAE9E,MAAMQ,KAAK,GAAGN,KAAK,GAAGC,GAAG;EACzB,MAAMM,UAAU,GAAGC,IAAI,CAACC,KAAK,CAACH,KAAK,GAAG,GAAG,CAAC;EAC1C,MAAMI,IAAI,GAAI,GAAEH,UAAW,GAAE;EAC7B,MAAMI,QAAQ,GAAG,qBAAMC,KAAK,iBAAI;IAAK,SAAS,EAAER,cAAK,CAACS,IAAK;IAAC,GAAG,EAAED;EAAM,EAAG,EAAET,KAAK,CAAC;EAClF,oBACE;IAAK,SAAS,EAAE,IAAAW,mBAAU,EAACV,cAAK,CAACW,UAAU,EAAEhB,SAAS;EAAE,gBACtD;IACE,SAAS,EAAEK,cAAK,CAACY,QAAS;IAC1B,KAAK,eACAX,UAAU;MACbY,KAAK,EAAG,GAAEX,KAAK,GAAG,GAAI;IAAE;EACxB,EACF,eACF;IAAG,SAAS,EAAEF,cAAK,CAACc;EAAM,gBACxB;IAAM,SAAS,EAAEd,cAAK,CAACe;EAAY,GAAG,GAAEnB,KAAM,IAAGC,GAAI,IAAGC,IAAK,EAAC,CAAQ,eACtE;IAAM,SAAS,EAAEE,cAAK,CAACG;EAAW,GAAEG,IAAI,CAAQ,CAC9C,eACJ;IAAK,SAAS,EAAEN,cAAK,CAACD;EAAM,GAAEQ,QAAQ,CAAO,CACzC;AAEV,CAAC;AAEDd,WAAW,CAACuB,SAAS,2CAAG;EACtBrB,SAAS,EAAEsB,kBAAS,CAACC,MAAM;EAC3BtB,KAAK,EAAEqB,kBAAS,CAACE,MAAM,CAACC,UAAU;EAClCvB,GAAG,EAAEoB,kBAAS,CAACE,MAAM,CAACC,UAAU;EAChCtB,IAAI,EAAEmB,kBAAS,CAACC,MAAM;EACtBnB,KAAK,EAAEkB,kBAAS,CAACE,MAAM;EACvBnB,KAAK,EAAEiB,kBAAS,CAACI,QAAQ,CAACJ,kBAAS,CAACK,SAAS,CAAC,CAACL,kBAAS,CAACC,MAAM,EAAED,kBAAS,CAACE,MAAM,CAAC,CAAC;AACrF,CAAC;AAAC,eAEa1B,WAAW;AAAA"}
+{"version":3,"file":"index.js","names":["ProgressBar","props","className","value","max","desc","steps","style","propsStyle","ratio","percentage","Math","floor","text","stepList","index","step","classnames","background","progress","width","texts","description","propTypes","PropTypes","string","number","isRequired","objectOf","oneOfType"],"sources":["../../../src/molecule/progress-bar/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {times} from 'lodash/fp';\nimport style from './style.css';\n\nconst ProgressBar = props => {\n  const {className, value, max, desc = '', steps = 0, style: propsStyle} = props;\n\n  const ratio = value / max;\n  const percentage = Math.floor(ratio * 100);\n  const text = `${percentage}%`;\n  const stepList = times(index => <div className={style.step} key={index} />, steps);\n  return (\n    <div className={classnames(style.background, className)}>\n      <div\n        className={style.progress}\n        style={{\n          ...propsStyle,\n          width: `${ratio * 100}%`\n        }}\n      />\n      <p className={style.texts}>\n        <span className={style.description}>{`${value}/${max} ${desc}`}</span>\n        <span className={style.percentage}>{text}</span>\n      </p>\n      <div className={style.steps}>{stepList}</div>\n    </div>\n  );\n};\n\nProgressBar.propTypes = {\n  className: PropTypes.string,\n  value: PropTypes.number.isRequired,\n  max: PropTypes.number.isRequired,\n  desc: PropTypes.string,\n  steps: PropTypes.number,\n  style: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default ProgressBar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;;;;;AAEA,MAAMA,WAAW,GAAGC,KAAK,IAAI;EAC3B,MAAM;IAACC,SAAD;IAAYC,KAAZ;IAAmBC,GAAnB;IAAwBC,IAAI,GAAG,EAA/B;IAAmCC,KAAK,GAAG,CAA3C;IAA8CC,KAAK,EAAEC;EAArD,IAAmEP,KAAzE;EAEA,MAAMQ,KAAK,GAAGN,KAAK,GAAGC,GAAtB;EACA,MAAMM,UAAU,GAAGC,IAAI,CAACC,KAAL,CAAWH,KAAK,GAAG,GAAnB,CAAnB;EACA,MAAMI,IAAI,GAAI,GAAEH,UAAW,GAA3B;EACA,MAAMI,QAAQ,GAAG,qBAAMC,KAAK,iBAAI;IAAK,SAAS,EAAER,cAAA,CAAMS,IAAtB;IAA4B,GAAG,EAAED;EAAjC,EAAf,EAA2DT,KAA3D,CAAjB;EACA,oBACE;IAAK,SAAS,EAAE,IAAAW,mBAAA,EAAWV,cAAA,CAAMW,UAAjB,EAA6BhB,SAA7B;EAAhB,gBACE;IACE,SAAS,EAAEK,cAAA,CAAMY,QADnB;IAEE,KAAK,eACAX,UADA;MAEHY,KAAK,EAAG,GAAEX,KAAK,GAAG,GAAI;IAFnB;EAFP,EADF,eAQE;IAAG,SAAS,EAAEF,cAAA,CAAMc;EAApB,gBACE;IAAM,SAAS,EAAEd,cAAA,CAAMe;EAAvB,GAAsC,GAAEnB,KAAM,IAAGC,GAAI,IAAGC,IAAK,EAA7D,CADF,eAEE;IAAM,SAAS,EAAEE,cAAA,CAAMG;EAAvB,GAAoCG,IAApC,CAFF,CARF,eAYE;IAAK,SAAS,EAAEN,cAAA,CAAMD;EAAtB,GAA8BQ,QAA9B,CAZF,CADF;AAgBD,CAvBD;;AAyBAd,WAAW,CAACuB,SAAZ,2CAAwB;EACtBrB,SAAS,EAAEsB,kBAAA,CAAUC,MADC;EAEtBtB,KAAK,EAAEqB,kBAAA,CAAUE,MAAV,CAAiBC,UAFF;EAGtBvB,GAAG,EAAEoB,kBAAA,CAAUE,MAAV,CAAiBC,UAHA;EAItBtB,IAAI,EAAEmB,kBAAA,CAAUC,MAJM;EAKtBnB,KAAK,EAAEkB,kBAAA,CAAUE,MALK;EAMtBnB,KAAK,EAAEiB,kBAAA,CAAUI,QAAV,CAAmBJ,kBAAA,CAAUK,SAAV,CAAoB,CAACL,kBAAA,CAAUC,MAAX,EAAmBD,kBAAA,CAAUE,MAA7B,CAApB,CAAnB;AANe,CAAxB;eASe1B,W"}

package/lib/molecule/questions/drop-down/index.js

@@ -2,14 +2,23 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _find2 = _interopRequireDefault(require("lodash/fp/find"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _select = _interopRequireWildcard(require("../../../atom/select"));
+
 var _style = _interopRequireDefault(require("./style.css"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const DropDown = props => {
   const {
     options,
@@ -32,6 +41,7 @@ const DropDown = props => {
     onChange: onChange
   }));
 };
+
 DropDown.propTypes = process.env.NODE_ENV !== "production" ? {
   onChange: _select.default.propTypes.onChange,
   options: _propTypes.default.arrayOf(_propTypes.default.shape(_select.SelectOptionPropTypes)),

package/lib/molecule/questions/drop-down/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["DropDown","props","options","onChange","theme","propsTheme","ariaLabel","groupAriaLabel","currentSelection","defaultTheme","validOption","style","wrapper","propTypes","Select","PropTypes","arrayOf","shape","SelectOptionPropTypes","string"],"sources":["../../../../src/molecule/questions/drop-down/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {find} from 'lodash/fp';\nimport Select, {SelectOptionPropTypes} from '../../../atom/select';\nimport style from './style.css';\n\nconst DropDown = props => {\n  const {options, onChange, theme: propsTheme, 'aria-label': ariaLabel, groupAriaLabel} = props;\n\n  const currentSelection = find('selected', options);\n  const defaultTheme =\n    !currentSelection || currentSelection.validOption === false ? 'invalid' : 'question';\n\n  const theme = propsTheme || defaultTheme;\n\n  return (\n    <div className={style.wrapper} role=\"group\" aria-label={groupAriaLabel}>\n      <Select aria-label={ariaLabel} theme={theme} options={options} onChange={onChange} />\n    </div>\n  );\n};\n\nDropDown.propTypes = {\n  onChange: Select.propTypes.onChange,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  theme: Select.propTypes.theme,\n  'aria-label': PropTypes.string,\n  groupAriaLabel: PropTypes.string\n};\n\nexport default DropDown;\n"],"mappings":";;;;;AAAA;AACA;AAEA;AACA;AAAgC;AAAA;AAAA;AAEhC,MAAMA,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,OAAO;IAAEC,QAAQ;IAAEC,KAAK,EAAEC,UAAU;IAAE,YAAY,EAAEC,SAAS;IAAEC;EAAc,CAAC,GAAGN,KAAK;EAE7F,MAAMO,gBAAgB,GAAG,oBAAK,UAAU,EAAEN,OAAO,CAAC;EAClD,MAAMO,YAAY,GAChB,CAACD,gBAAgB,IAAIA,gBAAgB,CAACE,WAAW,KAAK,KAAK,GAAG,SAAS,GAAG,UAAU;EAEtF,MAAMN,KAAK,GAAGC,UAAU,IAAII,YAAY;EAExC,oBACE;IAAK,SAAS,EAAEE,cAAK,CAACC,OAAQ;IAAC,IAAI,EAAC,OAAO;IAAC,cAAYL;EAAe,gBACrE,6BAAC,eAAM;IAAC,cAAYD,SAAU;IAAC,KAAK,EAAEF,KAAM;IAAC,OAAO,EAAEF,OAAQ;IAAC,QAAQ,EAAEC;EAAS,EAAG,CACjF;AAEV,CAAC;AAEDH,QAAQ,CAACa,SAAS,2CAAG;EACnBV,QAAQ,EAAEW,eAAM,CAACD,SAAS,CAACV,QAAQ;EACnCD,OAAO,EAAEa,kBAAS,CAACC,OAAO,CAACD,kBAAS,CAACE,KAAK,CAACC,6BAAqB,CAAC,CAAC;EAClEd,KAAK,EAAEU,eAAM,CAACD,SAAS,CAACT,KAAK;EAC7B,YAAY,EAAEW,kBAAS,CAACI,MAAM;EAC9BZ,cAAc,EAAEQ,kBAAS,CAACI;AAC5B,CAAC;AAAC,eAEanB,QAAQ;AAAA"}
+{"version":3,"file":"index.js","names":["DropDown","props","options","onChange","theme","propsTheme","ariaLabel","groupAriaLabel","currentSelection","defaultTheme","validOption","style","wrapper","propTypes","Select","PropTypes","arrayOf","shape","SelectOptionPropTypes","string"],"sources":["../../../../src/molecule/questions/drop-down/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {find} from 'lodash/fp';\nimport Select, {SelectOptionPropTypes} from '../../../atom/select';\nimport style from './style.css';\n\nconst DropDown = props => {\n  const {options, onChange, theme: propsTheme, 'aria-label': ariaLabel, groupAriaLabel} = props;\n\n  const currentSelection = find('selected', options);\n  const defaultTheme =\n    !currentSelection || currentSelection.validOption === false ? 'invalid' : 'question';\n\n  const theme = propsTheme || defaultTheme;\n\n  return (\n    <div className={style.wrapper} role=\"group\" aria-label={groupAriaLabel}>\n      <Select aria-label={ariaLabel} theme={theme} options={options} onChange={onChange} />\n    </div>\n  );\n};\n\nDropDown.propTypes = {\n  onChange: Select.propTypes.onChange,\n  options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes)),\n  theme: Select.propTypes.theme,\n  'aria-label': PropTypes.string,\n  groupAriaLabel: PropTypes.string\n};\n\nexport default DropDown;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAEA,MAAMA,QAAQ,GAAGC,KAAK,IAAI;EACxB,MAAM;IAACC,OAAD;IAAUC,QAAV;IAAoBC,KAAK,EAAEC,UAA3B;IAAuC,cAAcC,SAArD;IAAgEC;EAAhE,IAAkFN,KAAxF;EAEA,MAAMO,gBAAgB,GAAG,oBAAK,UAAL,EAAiBN,OAAjB,CAAzB;EACA,MAAMO,YAAY,GAChB,CAACD,gBAAD,IAAqBA,gBAAgB,CAACE,WAAjB,KAAiC,KAAtD,GAA8D,SAA9D,GAA0E,UAD5E;EAGA,MAAMN,KAAK,GAAGC,UAAU,IAAII,YAA5B;EAEA,oBACE;IAAK,SAAS,EAAEE,cAAA,CAAMC,OAAtB;IAA+B,IAAI,EAAC,OAApC;IAA4C,cAAYL;EAAxD,gBACE,6BAAC,eAAD;IAAQ,cAAYD,SAApB;IAA+B,KAAK,EAAEF,KAAtC;IAA6C,OAAO,EAAEF,OAAtD;IAA+D,QAAQ,EAAEC;EAAzE,EADF,CADF;AAKD,CAdD;;AAgBAH,QAAQ,CAACa,SAAT,2CAAqB;EACnBV,QAAQ,EAAEW,eAAA,CAAOD,SAAP,CAAiBV,QADR;EAEnBD,OAAO,EAAEa,kBAAA,CAAUC,OAAV,CAAkBD,kBAAA,CAAUE,KAAV,CAAgBC,6BAAhB,CAAlB,CAFU;EAGnBd,KAAK,EAAEU,eAAA,CAAOD,SAAP,CAAiBT,KAHL;EAInB,cAAcW,kBAAA,CAAUI,MAJL;EAKnBZ,cAAc,EAAEQ,kBAAA,CAAUI;AALP,CAArB;eAQenB,Q"}

package/lib/molecule/questions/free-text/index.js

@@ -2,17 +2,29 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
+
 var _noop2 = _interopRequireDefault(require("lodash/fp/noop"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _cssColorFunction = require("css-color-function");
+
 var _provider = _interopRequireWildcard(require("../../../atom/provider"));
+
 var _style = _interopRequireDefault(require("./style.css"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 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); }
+
 const FreeText = (props, legacyContext) => {
   const skin = (0, _provider.GetSkinFromContext)(legacyContext);
   const {
@@ -53,6 +65,7 @@ const FreeText = (props, legacyContext) => {
     })
   }));
 };
+
 FreeText.contextTypes = {
   skin: _provider.default.childContextTypes.skin
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["FreeText","props","legacyContext","skin","GetSkinFromContext","placeholder","value","onChange","ariaLabel","hovered","setHovered","useState","handleChange","useCallback","e","target","primarySkinColor","handleMouseOver","handleMouseLeave","shadowBoxPrimaryColor","useMemo","convert","style","wrapper","boxShadow","freeText","color","contextTypes","Provider","childContextTypes","propTypes","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;AACA;AAEA;AACA;AACA;AAAgC;AAAA;AAAA;AAAA;AAEhC,MAAMA,QAAQ,GAAG,CAACC,KAAK,EAAEC,aAAa,KAAK;EACzC,MAAMC,IAAI,GAAG,IAAAC,4BAAkB,EAACF,aAAa,CAAC;EAC9C,MAAM;IAACG,WAAW,GAAG,EAAE;IAAEC,KAAK,GAAG,EAAE;IAAEC,QAAQ,iBAAO;IAAE,YAAY,EAAEC;EAAS,CAAC,GAAGP,KAAK;EACtF,MAAM,CAACQ,OAAO,EAAEC,UAAU,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EAE7C,MAAMC,YAAY,GAAG,IAAAC,kBAAW,EAACC,CAAC,IAAIP,QAAQ,CAACO,CAAC,CAACC,MAAM,CAACT,KAAK,CAAC,EAAE,CAACC,QAAQ,CAAC,CAAC;EAC3E,MAAMS,gBAAgB,GAAG,qBAAM,SAAS,EAAE,gBAAgB,EAAEb,IAAI,CAAC;EAEjE,MAAMc,eAAe,GAAG,IAAAJ,kBAAW,EAAC,MAAMH,UAAU,CAAC,IAAI,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEzE,MAAMQ,gBAAgB,GAAG,IAAAL,kBAAW,EAAC,MAAMH,UAAU,CAAC,KAAK,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAE3E,MAAMS,qBAAqB,GAAG,IAAAC,cAAO,EACnC,MAAM,IAAAC,yBAAO,EAAE,SAAQL,gBAAiB,UAAS,CAAC,EAClD,CAACA,gBAAgB,CAAC,CACnB;EAED,oBACE;IACE,aAAU,UAAU;IACpB,SAAS,EAAEM,cAAK,CAACC,OAAQ;IACzB,WAAW,EAAEN,eAAgB;IAC7B,YAAY,EAAEC,gBAAiB;IAC/B,KAAK,eACCZ,KAAK,IAAI;MACXkB,SAAS,EAAEf,OAAO,GAAG,MAAM,GAAI,cAAaU,qBAAsB;IACpE,CAAC;EACD,gBAEF;IACE,aAAU,iBAAiB;IAC3B,IAAI,EAAC,MAAM;IACX,cAAYX,SAAS,IAAIF,KAAK,IAAID,WAAY;IAC9C,SAAS,EAAEiB,cAAK,CAACG,QAAS;IAC1B,WAAW,EAAEpB,WAAY;IACzB,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEM,YAAa;IACtB,QAAQ,gBAAO;IACf,KAAK;MACHY,SAAS,EAAG,cAAaL,qBAAsB;IAAC,GAC5Cb,KAAK,IAAI;MACXkB,SAAS,EAAG,cACVf,OAAO,GAAG,IAAAY,yBAAO,EAAE,SAAQL,gBAAiB,UAAS,CAAC,GAAGG,qBAC1D;IACH,CAAC;MACDO,KAAK,EAAEV;IAAgB;EACvB,EACF,CACE;AAEV,CAAC;AAEDhB,QAAQ,CAAC2B,YAAY,GAAG;EACtBxB,IAAI,EAAEyB,iBAAQ,CAACC,iBAAiB,CAAC1B;AACnC,CAAC;AAEDH,QAAQ,CAAC8B,SAAS,2CAAG;EACnBzB,WAAW,EAAE0B,kBAAS,CAACC,MAAM;EAC7B1B,KAAK,EAAEyB,kBAAS,CAACC,MAAM;EACvBzB,QAAQ,EAAEwB,kBAAS,CAACE,IAAI;EACxB,YAAY,EAAEF,kBAAS,CAACC;AAC1B,CAAC;AAAC,eAEahC,QAAQ;AAAA"}
+{"version":3,"file":"index.js","names":["FreeText","props","legacyContext","skin","GetSkinFromContext","placeholder","value","onChange","ariaLabel","hovered","setHovered","useState","handleChange","useCallback","e","target","primarySkinColor","handleMouseOver","handleMouseLeave","shadowBoxPrimaryColor","useMemo","convert","style","wrapper","boxShadow","freeText","color","contextTypes","Provider","childContextTypes","propTypes","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;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,QAAQ,GAAG,CAACC,KAAD,EAAQC,aAAR,KAA0B;EACzC,MAAMC,IAAI,GAAG,IAAAC,4BAAA,EAAmBF,aAAnB,CAAb;EACA,MAAM;IAACG,WAAW,GAAG,EAAf;IAAmBC,KAAK,GAAG,EAA3B;IAA+BC,QAAQ,iBAAvC;IAAgD,cAAcC;EAA9D,IAA2EP,KAAjF;EACA,MAAM,CAACQ,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;EAEA,MAAMC,YAAY,GAAG,IAAAC,kBAAA,EAAYC,CAAC,IAAIP,QAAQ,CAACO,CAAC,CAACC,MAAF,CAAST,KAAV,CAAzB,EAA2C,CAACC,QAAD,CAA3C,CAArB;EACA,MAAMS,gBAAgB,GAAG,qBAAM,SAAN,EAAiB,gBAAjB,EAAmCb,IAAnC,CAAzB;EAEA,MAAMc,eAAe,GAAG,IAAAJ,kBAAA,EAAY,MAAMH,UAAU,CAAC,IAAD,CAA5B,EAAoC,CAACA,UAAD,CAApC,CAAxB;EAEA,MAAMQ,gBAAgB,GAAG,IAAAL,kBAAA,EAAY,MAAMH,UAAU,CAAC,KAAD,CAA5B,EAAqC,CAACA,UAAD,CAArC,CAAzB;EAEA,MAAMS,qBAAqB,GAAG,IAAAC,cAAA,EAC5B,MAAM,IAAAC,yBAAA,EAAS,SAAQL,gBAAiB,UAAlC,CADsB,EAE5B,CAACA,gBAAD,CAF4B,CAA9B;EAKA,oBACE;IACE,aAAU,UADZ;IAEE,SAAS,EAAEM,cAAA,CAAMC,OAFnB;IAGE,WAAW,EAAEN,eAHf;IAIE,YAAY,EAAEC,gBAJhB;IAKE,KAAK,eACCZ,KAAK,IAAI;MACXkB,SAAS,EAAEf,OAAO,GAAG,MAAH,GAAa,cAAaU,qBAAsB;IADvD,CADV;EALP,gBAWE;IACE,aAAU,iBADZ;IAEE,IAAI,EAAC,MAFP;IAGE,cAAYX,SAAS,IAAIF,KAAb,IAAsBD,WAHpC;IAIE,SAAS,EAAEiB,cAAA,CAAMG,QAJnB;IAKE,WAAW,EAAEpB,WALf;IAME,KAAK,EAAEC,KANT;IAOE,OAAO,EAAEM,YAPX;IAQE,QAAQ,gBARV;IASE,KAAK;MACHY,SAAS,EAAG,cAAaL,qBAAsB;IAD5C,GAECb,KAAK,IAAI;MACXkB,SAAS,EAAG,cACVf,OAAO,GAAG,IAAAY,yBAAA,EAAS,SAAQL,gBAAiB,UAAlC,CAAH,GAAkDG,qBAC1D;IAHU,CAFV;MAOHO,KAAK,EAAEV;IAPJ;EATP,EAXF,CADF;AAiCD,CAlDD;;AAoDAhB,QAAQ,CAAC2B,YAAT,GAAwB;EACtBxB,IAAI,EAAEyB,iBAAA,CAASC,iBAAT,CAA2B1B;AADX,CAAxB;AAIAH,QAAQ,CAAC8B,SAAT,2CAAqB;EACnBzB,WAAW,EAAE0B,kBAAA,CAAUC,MADJ;EAEnB1B,KAAK,EAAEyB,kBAAA,CAAUC,MAFE;EAGnBzB,QAAQ,EAAEwB,kBAAA,CAAUE,IAHD;EAInB,cAAcF,kBAAA,CAAUC;AAJL,CAArB;eAOehC,Q"}

package/lib/molecule/questions/free-text/index.native.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Analytics } from '../../../variables/analytics';
-type QuestionType = 'basic' | 'template';
+declare type QuestionType = 'basic' | 'template';
 interface Props {
     fullWidth?: boolean;
     testID: string;

package/lib/molecule/questions/free-text/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAuB,SAAS,EAAC,MAAM,8BAA8B,CAAC;AAK7E,KAAK,YAAY,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzC,UAAU,KAAK;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,YAAY,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA6CD,QAAA,MAAM,QAAQ,UAAW,KAAK,uBA2D7B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/molecule/questions/free-text/index.native.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAuB,SAAS,EAAC,MAAM,8BAA8B,CAAC;AAK7E,aAAK,YAAY,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzC,UAAU,KAAK;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,YAAY,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA6CD,QAAA,MAAM,QAAQ,UAAW,KAAK,uBA2D7B,CAAC;AAEF,eAAe,QAAQ,CAAC"}

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

@@ -2,14 +2,23 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _reactNative = require("react-native");
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _templateContext = require("../../../template/app-review/template-context");
+
 var _analytics = require("../../../variables/analytics");
+
 var _shadow = require("../../../variables/shadow");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 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); }
+
 const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
   // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread
   input: _extends({
@@ -36,12 +45,14 @@ const createStyleSheet = (brandTheme, theme) => _reactNative.StyleSheet.create({
     width: '100%'
   }
 });
+
 const logEvent = (eventName, analytics, questionType) => {
   analytics && analytics.logEvent(eventName, {
     id: `question-input-text`,
     questionType
   });
 };
+
 const FreeText = props => {
   const templateContext = (0, _templateContext.useTemplateContext)();
   const [styleSheet, setStylesheet] = (0, _react.useState)(null);
@@ -50,9 +61,7 @@ const FreeText = props => {
     theme,
     translations
   } = templateContext;
-  const PLACEHOLDER_COLOR = theme.colors.gray.medium;
-
-  // ------------------------------------
+  const PLACEHOLDER_COLOR = theme.colors.gray.medium; // ------------------------------------
 
   const {
     analytics,
@@ -62,25 +71,21 @@ const FreeText = props => {
     onChange,
     isDisabled = false,
     value
-  } = props;
-
-  // ------------------------------------
+  } = props; // ------------------------------------
 
   const handleFocus = (0, _react.useCallback)(() => analytics && logEvent(_analytics.ANALYTICS_EVENT_TYPE.INPUT_FOCUS, analytics, questionType), [analytics, questionType]);
-  const handleBlur = (0, _react.useCallback)(() => analytics && logEvent(_analytics.ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType), [analytics, questionType]);
-
-  // ------------------------------------
+  const handleBlur = (0, _react.useCallback)(() => analytics && logEvent(_analytics.ANALYTICS_EVENT_TYPE.INPUT_BLUR, analytics, questionType), [analytics, questionType]); // ------------------------------------
 
   (0, _react.useEffect)(() => {
     const _stylesheet = createStyleSheet(brandTheme, theme);
-    setStylesheet(_stylesheet);
-  }, [brandTheme, theme]);
 
-  // ------------------------------------
+    setStylesheet(_stylesheet);
+  }, [brandTheme, theme]); // ------------------------------------
 
   if (!styleSheet) {
     return null;
   }
+
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: [styleSheet.spaced, fullWidth && styleSheet.fullWitdh]
   }, /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, {
@@ -96,6 +101,7 @@ const FreeText = props => {
     selectTextOnFocus: !isDisabled
   }));
 };
+
 var _default = FreeText;
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_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';\nimport {Brand} from '../../../variables/brand.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: Brand, 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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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","brandTheme","theme","StyleSheet","create","input","padding","spacing","tiny","borderColor","colors","gray","lightMedium","borderRadius","radius","regular","minWidth","marginHorizontal","paddingVertical","BOX_STYLE","backgroundColor","white","text","primary","color","medium","fontWeight","bold","fontSize","textAlign","spaced","fullWitdh","width","logEvent","eventName","analytics","questionType","id","FreeText","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","PLACEHOLDER_COLOR","fullWidth","testID","onChange","isDisabled","value","handleFocus","useCallback","ANALYTICS_EVENT_TYPE","INPUT_FOCUS","handleBlur","INPUT_BLUR","useEffect","_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';\nimport {Brand} from '../../../variables/brand.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: Brand, 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":";;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;AAsBA,MAAMA,gBAAgB,GAAG,CAACC,UAAD,EAAoBC,KAApB,KACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChB;EACAC,KAAK;IACHC,OAAO,EAAEJ,KAAK,CAACK,OAAN,CAAcC,IADpB;IAEHC,WAAW,EAAEP,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBC,WAF5B;IAGHC,YAAY,EAAEX,KAAK,CAACY,MAAN,CAAaC,OAHxB;IAIHC,QAAQ,EAAE,GAJP;IAKHC,gBAAgB,EAAE,EALf;IAMHC,eAAe,EAAE;EANd,GAOAC,iBAPA;IAQHC,eAAe,EAAElB,KAAK,CAACQ,MAAN,CAAaW;EAR3B,EAFW;EAYhBC,IAAI,EAAE;IACJb,WAAW,EAAER,UAAU,EAAES,MAAZ,EAAoBa,OAD7B;IAEJC,KAAK,EAAEvB,UAAU,EAAES,MAAZ,EAAoBa,OAApB,IAA+BrB,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBc,MAFpD;IAGJC,UAAU,EAAExB,KAAK,CAACwB,UAAN,CAAiBC,IAHzB;IAIJC,QAAQ,EAAE1B,KAAK,CAAC0B,QAAN,CAAeb,OAJrB;IAKJc,SAAS,EAAE;EALP,CAZU;EAmBhBC,MAAM,EAAE;IACNZ,eAAe,EAAEhB,KAAK,CAACK,OAAN,CAAcC;EADzB,CAnBQ;EAsBhBuB,SAAS,EAAE;IACTC,KAAK,EAAE;EADE;AAtBK,CAAlB,CADF;;AA4BA,MAAMC,QAAQ,GAAG,CAACC,SAAD,EAAoBC,SAApB,EAA0CC,YAA1C,KAAyE;EACxFD,SAAS,IACPA,SAAS,CAACF,QAAV,CAAmBC,SAAnB,EAA8B;IAC5BG,EAAE,EAAG,qBADuB;IAE5BD;EAF4B,CAA9B,CADF;AAKD,CAND;;AAQA,MAAME,QAAQ,GAAIC,KAAD,IAAkB;EACjC,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAAC3C,UAAD;IAAaC,KAAb;IAAoB2C;EAApB,IAAoCL,eAA1C;EACA,MAAMM,iBAAiB,GAAG5C,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBc,MAA5C,CAJiC,CAMjC;;EAEA,MAAM;IACJU,SADI;IAEJC,YAFI;IAGJW,SAAS,GAAG,KAHR;IAIJC,MAJI;IAKJC,QALI;IAMJC,UAAU,GAAG,KANT;IAOJC;EAPI,IAQFZ,KARJ,CARiC,CAkBjC;;EAEA,MAAMa,WAAW,GAAG,IAAAC,kBAAA,EAClB,MAAMlB,SAAS,IAAIF,QAAQ,CAACqB,+BAAA,CAAqBC,WAAtB,EAAmCpB,SAAnC,EAA8CC,YAA9C,CADT,EAElB,CAACD,SAAD,EAAYC,YAAZ,CAFkB,CAApB;EAKA,MAAMoB,UAAU,GAAG,IAAAH,kBAAA,EACjB,MAAMlB,SAAS,IAAIF,QAAQ,CAACqB,+BAAA,CAAqBG,UAAtB,EAAkCtB,SAAlC,EAA6CC,YAA7C,CADV,EAEjB,CAACD,SAAD,EAAYC,YAAZ,CAFiB,CAAnB,CAzBiC,CA8BjC;;EAEA,IAAAsB,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAG3D,gBAAgB,CAACC,UAAD,EAAaC,KAAb,CAApC;;IACAyC,aAAa,CAACgB,WAAD,CAAb;EACD,CAHD,EAGG,CAAC1D,UAAD,EAAaC,KAAb,CAHH,EAhCiC,CAqCjC;;EAEA,IAAI,CAACwC,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAACZ,MAAZ,EAAoBiB,SAAS,IAAIL,UAAU,CAACX,SAA5C;EAAb,gBACE,6BAAC,sBAAD;IACE,KAAK,EAAE,CAACW,UAAU,CAACrC,KAAZ,EAAmBqC,UAAU,CAACpB,IAA9B,CADT;IAEE,OAAO,EAAE8B,WAFX;IAGE,MAAM,EAAEI,UAHV;IAIE,YAAY,EAAEP,QAJhB;IAKE,WAAW,EAAEJ,YAAY,CAACe,QAL5B;IAME,oBAAoB,EAAEd,iBANxB;IAOE,KAAK,EAAEK,KAPT;IAQE,MAAM,EAAEH,MARV;IASE,QAAQ,EAAE,CAACE,UATb;IAUE,iBAAiB,EAAE,CAACA;EAVtB,EADF,CADF;AAgBD,CA3DD;;eA6DeZ,Q"}

package/lib/molecule/questions/mobile/draggable/index.native.js

@@ -2,13 +2,21 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _reactNative = require("react-native");
+
 var _index = _interopRequireDefault(require("../../../../atom/choice/index.native"));
+
 var _templateContext = require("../../../../template/app-review/template-context");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 const createSelectionStyle = theme => _reactNative.StyleSheet.create({
   choice: {
     margin: theme.spacing.micro
@@ -21,6 +29,7 @@ const createSelectionStyle = theme => _reactNative.StyleSheet.create({
     color: theme.colors.gray.medium
   }
 });
+
 const Selection = props => {
   const templateContext = (0, _templateContext.useTemplateContext)();
   const {
@@ -32,11 +41,14 @@ const Selection = props => {
   const [styleSheet, setStylesheet] = (0, _react.useState)(null);
   (0, _react.useEffect)(() => {
     const _stylesheet = createSelectionStyle(theme);
+
     setStylesheet(_stylesheet);
   }, [theme]);
+
   if (!styleSheet) {
     return null;
   }
+
   const {
     choices
   } = props;
@@ -53,6 +65,7 @@ const Selection = props => {
     style: styleSheet.selectionArea
   }, mappedSortedChoices);
 };
+
 const createStyleSheet = theme => _reactNative.StyleSheet.create({
   container: {
     flex: 1
@@ -74,6 +87,7 @@ const createStyleSheet = theme => _reactNative.StyleSheet.create({
     height: 2
   }
 });
+
 const QuestionDraggable = props => {
   const templateContext = (0, _templateContext.useTemplateContext)();
   const {
@@ -82,11 +96,14 @@ const QuestionDraggable = props => {
   const [styleSheet, setStylesheet] = (0, _react.useState)(null);
   (0, _react.useEffect)(() => {
     const _stylesheet = createStyleSheet(theme);
+
     setStylesheet(_stylesheet);
   }, [theme]);
+
   if (!styleSheet) {
     return null;
   }
+
   const {
     choices,
     onPress,
@@ -113,6 +130,7 @@ const QuestionDraggable = props => {
     style: styleSheet.pickableChoices
   }, pickableChoices));
 };
+
 var _default = QuestionDraggable;
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map