@coorpacademy/components 10.24.0 → 10.24.2

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":"AAAA,SAAQA,IAAR,EAAcC,UAAd,EAA0BC,SAA1B,QAAqD,cAArD;AACA,OAAOC,KAAP,IAAeC,QAAf,EAAyBC,SAAzB,EAAoCC,WAApC,QAAsD,OAAtD;AACA,SAAQC,kBAAR,QAAiC,+CAAjC;AACA,SAAQC,oBAAR,QAA8C,8BAA9C;;AAsBA,MAAMC,gBAAgB,GAAG,CAACC,UAAD,EAAkBC,KAAlB,KACvBV,UAAU,CAACW,MAAX,CAAkB;EAChBC,KAAK,EAAE;IACLC,OAAO,EAAEH,KAAK,CAACI,OAAN,CAAcC,IADlB;IAELC,WAAW,EAAE,CAFR;IAGLC,WAAW,EAAEP,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBC,WAH1B;IAILC,YAAY,EAAEX,KAAK,CAACY,MAAN,CAAaC,MAJtB;IAKLC,eAAe,EAAEd,KAAK,CAACQ,MAAN,CAAaO,KALzB;IAMLC,QAAQ,EAAE;EANL,CADS;EAShBC,IAAI,EAAE;IACJV,WAAW,EAAER,UAAU,EAAES,MAAZ,CAAmBU,OAD5B;IAEJC,KAAK,EAAEpB,UAAU,EAAES,MAAZ,CAAmBU,OAAnB,IAA8BlB,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBW,MAFnD;IAGJC,UAAU,EAAErB,KAAK,CAACqB,UAAN,CAAiBC,IAHzB;IAIJC,QAAQ,EAAEvB,KAAK,CAACuB,QAAN,CAAeC,OAJrB;IAKJC,SAAS,EAAE;EALP,CATU;EAgBhBC,MAAM,EAAE;IACNC,eAAe,EAAE3B,KAAK,CAACI,OAAN,CAAcC;EADzB,CAhBQ;EAmBhBuB,SAAS,EAAE;IACTC,KAAK,EAAE;EADE;AAnBK,CAAlB,CADF;;AAyBA,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,GAAGzC,kBAAkB,EAA1C;EACA,MAAM,CAAC0C,UAAD,EAAaC,aAAb,IAA8B9C,QAAQ,CAAwB,IAAxB,CAA5C;EACA,MAAM;IAACM,UAAD;IAAaC,KAAb;IAAoBwC;EAApB,IAAoCH,eAA1C;EACA,MAAMI,iBAAiB,GAAGzC,KAAK,CAACQ,MAAN,CAAaC,IAAb,CAAkBW,MAA5C,CAJiC,CAMjC;;EAEA,MAAM;IACJY,SADI;IAEJC,YAFI;IAGJS,SAAS,GAAG,KAHR;IAIJC,MAJI;IAKJC,QALI;IAMJC,UAAU,GAAG,KANT;IAOJC;EAPI,IAQFV,KARJ,CARiC,CAkBjC;;EAEA,MAAMW,WAAW,GAAGpD,WAAW,CAC7B,MAAMqC,SAAS,IAAIF,QAAQ,CAACjC,oBAAoB,CAACmD,WAAtB,EAAmChB,SAAnC,EAA8CC,YAA9C,CADE,EAE7B,CAACD,SAAD,EAAYC,YAAZ,CAF6B,CAA/B;EAKA,MAAMgB,UAAU,GAAGtD,WAAW,CAC5B,MAAMqC,SAAS,IAAIF,QAAQ,CAACjC,oBAAoB,CAACqD,UAAtB,EAAkClB,SAAlC,EAA6CC,YAA7C,CADC,EAE5B,CAACD,SAAD,EAAYC,YAAZ,CAF4B,CAA9B,CAzBiC,CA8BjC;;EAEAvC,SAAS,CAAC,MAAM;IACd,MAAMyD,WAAW,GAAGrD,gBAAgB,CAACC,UAAD,EAAaC,KAAb,CAApC;;IACAuC,aAAa,CAACY,WAAD,CAAb;EACD,CAHQ,EAGN,CAACpD,UAAD,EAAaC,KAAb,CAHM,CAAT,CAhCiC,CAqCjC;;EAEA,IAAI,CAACsC,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAACZ,MAAZ,EAAoBgB,SAAS,IAAIJ,UAAU,CAACV,SAA5C;EAAb,gBACE,oBAAC,SAAD;IACE,KAAK,EAAE,CAACU,UAAU,CAACpC,KAAZ,EAAmBoC,UAAU,CAACrB,IAA9B,CADT;IAEE,OAAO,EAAE8B,WAFX;IAGE,MAAM,EAAEE,UAHV;IAIE,YAAY,EAAEL,QAJhB;IAKE,WAAW,EAAEJ,YAAY,CAACY,QAL5B;IAME,oBAAoB,EAAEX,iBANxB;IAOE,KAAK,EAAEK,KAPT;IAQE,MAAM,EAAEH,MARV;IASE,QAAQ,EAAE,CAACE,UATb;IAUE,iBAAiB,EAAE,CAACA;EAVtB,EADF,CADF;AAgBD,CA3DD;;AA6DA,eAAeV,QAAf"}
+{"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":";;AAAA,SAAQA,IAAR,EAAcC,UAAd,EAA0BC,SAA1B,QAAqD,cAArD;AACA,OAAOC,KAAP,IAAeC,QAAf,EAAyBC,SAAzB,EAAoCC,WAApC,QAAsD,OAAtD;AACA,SAAQC,kBAAR,QAAiC,+CAAjC;AACA,SAAQC,oBAAR,QAA8C,8BAA9C;AAEA,SAAQC,SAAR,QAAwB,2BAAxB;;AAqBA,MAAMC,gBAAgB,GAAG,CAACC,UAAD,EAAkBC,KAAlB,KACvBX,UAAU,CAACY,MAAX,CAAkB;EAChB;EACAC,KAAK;IACHC,OAAO,EAAEH,KAAK,CAACI,OAAN,CAAcC,IADpB;IAEHC,WAAW,EAAEN,KAAK,CAACO,MAAN,CAAaC,IAAb,CAAkBC,WAF5B;IAGHC,YAAY,EAAEV,KAAK,CAACW,MAAN,CAAaC,OAHxB;IAIHC,QAAQ,EAAE,GAJP;IAKHC,gBAAgB,EAAE,EALf;IAMHC,eAAe,EAAE;EANd,GAOAlB,SAPA;IAQHmB,eAAe,EAAEhB,KAAK,CAACO,MAAN,CAAaU;EAR3B,EAFW;EAYhBC,IAAI,EAAE;IACJZ,WAAW,EAAEP,UAAU,EAAEQ,MAAZ,CAAmBY,OAD5B;IAEJC,KAAK,EAAErB,UAAU,EAAEQ,MAAZ,CAAmBY,OAAnB,IAA8BnB,KAAK,CAACO,MAAN,CAAaC,IAAb,CAAkBa,MAFnD;IAGJC,UAAU,EAAEtB,KAAK,CAACsB,UAAN,CAAiBC,IAHzB;IAIJC,QAAQ,EAAExB,KAAK,CAACwB,QAAN,CAAeZ,OAJrB;IAKJa,SAAS,EAAE;EALP,CAZU;EAmBhBC,MAAM,EAAE;IACNX,eAAe,EAAEf,KAAK,CAACI,OAAN,CAAcC;EADzB,CAnBQ;EAsBhBsB,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,GAAGzC,kBAAkB,EAA1C;EACA,MAAM,CAAC0C,UAAD,EAAaC,aAAb,IAA8B9C,QAAQ,CAAwB,IAAxB,CAA5C;EACA,MAAM;IAACO,UAAD;IAAaC,KAAb;IAAoBuC;EAApB,IAAoCH,eAA1C;EACA,MAAMI,iBAAiB,GAAGxC,KAAK,CAACO,MAAN,CAAaC,IAAb,CAAkBa,MAA5C,CAJiC,CAMjC;;EAEA,MAAM;IACJU,SADI;IAEJC,YAFI;IAGJS,SAAS,GAAG,KAHR;IAIJC,MAJI;IAKJC,QALI;IAMJC,UAAU,GAAG,KANT;IAOJC;EAPI,IAQFV,KARJ,CARiC,CAkBjC;;EAEA,MAAMW,WAAW,GAAGpD,WAAW,CAC7B,MAAMqC,SAAS,IAAIF,QAAQ,CAACjC,oBAAoB,CAACmD,WAAtB,EAAmChB,SAAnC,EAA8CC,YAA9C,CADE,EAE7B,CAACD,SAAD,EAAYC,YAAZ,CAF6B,CAA/B;EAKA,MAAMgB,UAAU,GAAGtD,WAAW,CAC5B,MAAMqC,SAAS,IAAIF,QAAQ,CAACjC,oBAAoB,CAACqD,UAAtB,EAAkClB,SAAlC,EAA6CC,YAA7C,CADC,EAE5B,CAACD,SAAD,EAAYC,YAAZ,CAF4B,CAA9B,CAzBiC,CA8BjC;;EAEAvC,SAAS,CAAC,MAAM;IACd,MAAMyD,WAAW,GAAGpD,gBAAgB,CAACC,UAAD,EAAaC,KAAb,CAApC;;IACAsC,aAAa,CAACY,WAAD,CAAb;EACD,CAHQ,EAGN,CAACnD,UAAD,EAAaC,KAAb,CAHM,CAAT,CAhCiC,CAqCjC;;EAEA,IAAI,CAACqC,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAACX,MAAZ,EAAoBe,SAAS,IAAIJ,UAAU,CAACV,SAA5C;EAAb,gBACE,oBAAC,SAAD;IACE,KAAK,EAAE,CAACU,UAAU,CAACnC,KAAZ,EAAmBmC,UAAU,CAACnB,IAA9B,CADT;IAEE,OAAO,EAAE4B,WAFX;IAGE,MAAM,EAAEE,UAHV;IAIE,YAAY,EAAEL,QAJhB;IAKE,WAAW,EAAEJ,YAAY,CAACY,QAL5B;IAME,oBAAoB,EAAEX,iBANxB;IAOE,KAAK,EAAEK,KAPT;IAQE,MAAM,EAAEH,MARV;IASE,QAAQ,EAAE,CAACE,UATb;IAUE,iBAAiB,EAAE,CAACA;EAVtB,EADF,CADF;AAgBD,CA3DD;;AA6DA,eAAeV,QAAf"}

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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"}

package/es/molecule/share/index.js

@@ -38,7 +38,7 @@ const copyTextViaExecCommand = text => {
   return status;
 };
 
-const StatusContext = /*#__PURE__*/React.createContext(SHARE_STATUS.IDLE);
+const StatusContext = React.createContext(SHARE_STATUS.IDLE);
 export const ShareStatusProvider = ({
   children
 }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","useMemo","useCallback","useContext","useEffect","PropTypes","classnames","NovaCompositionCoorpacademyCheck","CheckIcon","NovaCompositionCoorpacademyShare","ShareIcon","NovaCompositionCoorpacademyAttention","AttentionIcon","Link","styles","SHARE_STATUS","IDLE","ERROR","SUCCESS","copyTextViaExecCommand","text","textarea","document","createElement","style","border","padding","visibility","position","setAttribute","value","body","appendChild","status","select","setSelectionRange","length","execCommand","error","removeChild","StatusContext","createContext","ShareStatusProvider","children","setStatus","timeoutId","DURATION","setTimeout","clearTimeout","ShareFeedback","successWording","errorWording","feedback","errorFeedback","checkIcon","Share","wording","onClick","browserSupportsClipboardWriteText","navigator","clipboard","writeText","copyStatus","container","cta","wrapper","shareIcon","propTypes","node","string"],"sources":["../../../src/molecule/share/index.js"],"sourcesContent":["import React, {useState, useMemo, useCallback, useContext, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n  NovaCompositionCoorpacademyCheck as CheckIcon,\n  NovaCompositionCoorpacademyShare as ShareIcon,\n  NovaCompositionCoorpacademyAttention as AttentionIcon\n} from '@coorpacademy/nova-icons';\nimport Link from '../../atom/link';\nimport styles from './style.css';\n\nconst SHARE_STATUS = {\n  IDLE: 'IDLE',\n  ERROR: 'ERROR',\n  SUCCESS: 'SUCCESS'\n};\n\nconst copyTextViaExecCommand = text => {\n  const textarea = document.createElement('textarea');\n\n  textarea.style.border = '0';\n  textarea.style.padding = '0';\n  textarea.style.visibility = 'hidden';\n  textarea.style.position = 'absolute';\n  textarea.setAttribute('readonly', '');\n  textarea.value = text;\n\n  // Element.append is not supported on IE11 :/\n  // eslint-disable-next-line unicorn/prefer-node-append\n  document.body.appendChild(textarea);\n  let status = SHARE_STATUS.IDLE;\n\n  try {\n    textarea.select();\n    textarea.setSelectionRange(0, textarea.value.length);\n    document.execCommand('copy');\n    status = SHARE_STATUS.SUCCESS;\n  } catch (error) {\n    status = SHARE_STATUS.ERROR;\n  }\n\n  // Element.remove is not supported on IE11 :/\n  // eslint-disable-next-line unicorn/prefer-node-remove\n  document.body.removeChild(textarea);\n\n  return status;\n};\n\nconst StatusContext = React.createContext(SHARE_STATUS.IDLE);\n\nexport const ShareStatusProvider = ({children}) => {\n  const [status, setStatus] = useState(SHARE_STATUS.IDLE);\n  useEffect(() => {\n    let timeoutId;\n    const DURATION = 3000;\n    if (status !== SHARE_STATUS.IDLE) {\n      timeoutId = setTimeout(() => setStatus(SHARE_STATUS.IDLE), DURATION);\n    }\n    return () => clearTimeout(timeoutId);\n  }, [status]);\n\n  const value = useMemo(() => [status, setStatus], [status]);\n\n  return <StatusContext.Provider value={value}>{children}</StatusContext.Provider>;\n};\n\nexport const ShareFeedback = ({successWording, errorWording}) => {\n  const [status] = useContext(StatusContext);\n  if (status === SHARE_STATUS.IDLE) return null;\n\n  return (\n    <div\n      className={classnames(styles.feedback, status === SHARE_STATUS.ERROR && styles.errorFeedback)}\n    >\n      {status === SHARE_STATUS.SUCCESS ? (\n        <CheckIcon className={styles.checkIcon} width={13} height={13} />\n      ) : (\n        <AttentionIcon className={styles.checkIcon} width={13} height={13} />\n      )}\n      <p>{status === SHARE_STATUS.SUCCESS ? successWording : errorWording}</p>\n    </div>\n  );\n};\n\nconst Share = ({style, text, wording}) => {\n  const [, setStatus] = useContext(StatusContext);\n  const onClick = useCallback(async () => {\n    const browserSupportsClipboardWriteText =\n      'clipboard' in navigator && 'writeText' in navigator.clipboard;\n    if (browserSupportsClipboardWriteText) {\n      try {\n        await navigator.clipboard.writeText(text);\n        setStatus(SHARE_STATUS.SUCCESS);\n      } catch (error) {\n        setStatus(SHARE_STATUS.ERROR);\n      }\n      return;\n    } else {\n      const copyStatus = copyTextViaExecCommand(text);\n      setStatus(copyStatus);\n    }\n    return;\n  }, [setStatus, text]);\n\n  return (\n    <div className={(styles.container, style)}>\n      <Link onClick={onClick} className={styles.cta} data-name={'share-button'}>\n        <div className={styles.wrapper}>\n          <ShareIcon className={styles.shareIcon} width={18} height={18} />\n          <p>{wording}</p>\n        </div>\n      </Link>\n    </div>\n  );\n};\n\nShareStatusProvider.propTypes = {\n  children: PropTypes.node\n};\n\nShareFeedback.propTypes = {\n  successWording: PropTypes.string,\n  errorWording: PropTypes.string\n};\n\nShare.propTypes = {\n  style: PropTypes.string,\n  text: PropTypes.string,\n  wording: PropTypes.string\n};\n\nexport default Share;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useState","useMemo","useCallback","useContext","useEffect","PropTypes","classnames","NovaCompositionCoorpacademyCheck","CheckIcon","NovaCompositionCoorpacademyShare","ShareIcon","NovaCompositionCoorpacademyAttention","AttentionIcon","Link","styles","SHARE_STATUS","IDLE","ERROR","SUCCESS","copyTextViaExecCommand","text","textarea","document","createElement","style","border","padding","visibility","position","setAttribute","value","body","appendChild","status","select","setSelectionRange","length","execCommand","error","removeChild","StatusContext","createContext","ShareStatusProvider","children","setStatus","timeoutId","DURATION","setTimeout","clearTimeout","ShareFeedback","successWording","errorWording","feedback","errorFeedback","checkIcon","Share","wording","onClick","browserSupportsClipboardWriteText","navigator","clipboard","writeText","copyStatus","container","cta","wrapper","shareIcon","propTypes","node","string"],"sources":["../../../src/molecule/share/index.js"],"sourcesContent":["import React, {useState, useMemo, useCallback, useContext, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n  NovaCompositionCoorpacademyCheck as CheckIcon,\n  NovaCompositionCoorpacademyShare as ShareIcon,\n  NovaCompositionCoorpacademyAttention as AttentionIcon\n} from '@coorpacademy/nova-icons';\nimport Link from '../../atom/link';\nimport styles from './style.css';\n\nconst SHARE_STATUS = {\n  IDLE: 'IDLE',\n  ERROR: 'ERROR',\n  SUCCESS: 'SUCCESS'\n};\n\nconst copyTextViaExecCommand = text => {\n  const textarea = document.createElement('textarea');\n\n  textarea.style.border = '0';\n  textarea.style.padding = '0';\n  textarea.style.visibility = 'hidden';\n  textarea.style.position = 'absolute';\n  textarea.setAttribute('readonly', '');\n  textarea.value = text;\n\n  // Element.append is not supported on IE11 :/\n  // eslint-disable-next-line unicorn/prefer-node-append\n  document.body.appendChild(textarea);\n  let status = SHARE_STATUS.IDLE;\n\n  try {\n    textarea.select();\n    textarea.setSelectionRange(0, textarea.value.length);\n    document.execCommand('copy');\n    status = SHARE_STATUS.SUCCESS;\n  } catch (error) {\n    status = SHARE_STATUS.ERROR;\n  }\n\n  // Element.remove is not supported on IE11 :/\n  // eslint-disable-next-line unicorn/prefer-node-remove\n  document.body.removeChild(textarea);\n\n  return status;\n};\n\nconst StatusContext = React.createContext(SHARE_STATUS.IDLE);\n\nexport const ShareStatusProvider = ({children}) => {\n  const [status, setStatus] = useState(SHARE_STATUS.IDLE);\n  useEffect(() => {\n    let timeoutId;\n    const DURATION = 3000;\n    if (status !== SHARE_STATUS.IDLE) {\n      timeoutId = setTimeout(() => setStatus(SHARE_STATUS.IDLE), DURATION);\n    }\n    return () => clearTimeout(timeoutId);\n  }, [status]);\n\n  const value = useMemo(() => [status, setStatus], [status]);\n\n  return <StatusContext.Provider value={value}>{children}</StatusContext.Provider>;\n};\n\nexport const ShareFeedback = ({successWording, errorWording}) => {\n  const [status] = useContext(StatusContext);\n  if (status === SHARE_STATUS.IDLE) return null;\n\n  return (\n    <div\n      className={classnames(styles.feedback, status === SHARE_STATUS.ERROR && styles.errorFeedback)}\n    >\n      {status === SHARE_STATUS.SUCCESS ? (\n        <CheckIcon className={styles.checkIcon} width={13} height={13} />\n      ) : (\n        <AttentionIcon className={styles.checkIcon} width={13} height={13} />\n      )}\n      <p>{status === SHARE_STATUS.SUCCESS ? successWording : errorWording}</p>\n    </div>\n  );\n};\n\nconst Share = ({style, text, wording}) => {\n  const [, setStatus] = useContext(StatusContext);\n  const onClick = useCallback(async () => {\n    const browserSupportsClipboardWriteText =\n      'clipboard' in navigator && 'writeText' in navigator.clipboard;\n    if (browserSupportsClipboardWriteText) {\n      try {\n        await navigator.clipboard.writeText(text);\n        setStatus(SHARE_STATUS.SUCCESS);\n      } catch (error) {\n        setStatus(SHARE_STATUS.ERROR);\n      }\n      return;\n    } else {\n      const copyStatus = copyTextViaExecCommand(text);\n      setStatus(copyStatus);\n    }\n    return;\n  }, [setStatus, text]);\n\n  return (\n    <div className={(styles.container, style)}>\n      <Link onClick={onClick} className={styles.cta} data-name={'share-button'}>\n        <div className={styles.wrapper}>\n          <ShareIcon className={styles.shareIcon} width={18} height={18} />\n          <p>{wording}</p>\n        </div>\n      </Link>\n    </div>\n  );\n};\n\nShareStatusProvider.propTypes = {\n  children: PropTypes.node\n};\n\nShareFeedback.propTypes = {\n  successWording: PropTypes.string,\n  errorWording: PropTypes.string\n};\n\nShare.propTypes = {\n  style: PropTypes.string,\n  text: PropTypes.string,\n  wording: PropTypes.string\n};\n\nexport default Share;\n"],"mappings":"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"}

package/es/molecule/skill-card/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","convert","NovaSolidInterfaceFeedbackInterfaceQuestionMark","QuestionIcon","getOr","ButtonLink","style","propTypes","getGradientBackground","baseColor","gradients","SkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","onClick","isCustom","skin","hovered","setHovered","primarySkinColor","handleMouseOver","handleMouseLeave","buttonProps","customStyle","backgroundColor","color","transition","label","titleBackgroundColor","titleBackground","skillCardWrapper","background","questionReviseText","questionReviseIcon","buttonWrapper"],"sources":["../../../src/molecule/skill-card/index.js"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport {convert} from 'css-color-function';\nimport {NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon} from '@coorpacademy/nova-icons';\nimport getOr from 'lodash/fp/getOr';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst getGradientBackground = baseColor => {\n  const gradients = [\n    convert(`color(${baseColor} lightness(30%))`),\n    convert(`color(${baseColor} lightness(47%))`),\n    convert(`color(${baseColor} lightness(55%))`)\n  ];\n\n  return `radial-gradient(62.12% 56.45% at 0% 77.29%, ${gradients[0]} 0%, ${convert(\n    `color(${gradients[0]} a(0))`\n  )} 100%), radial-gradient(113.85% 103.46% at 93.27% 7.88%, ${gradients[1]} 0%, ${convert(\n    `color(${gradients[1]} a(0))`\n  )} 100%), radial-gradient(49.66% 49.63% at 78.65% 86.26%, ${gradients[2]} 0%, ${convert(\n    `color(${gradients[2]} a(0))`\n  )} 100%), ${baseColor}`;\n};\n\nconst SkillCard = (props, context) => {\n  const {\n    'aria-label': ariaLabel,\n    skillTitle,\n    skillAriaLabel,\n    buttonLabel,\n    buttonAriaLabel,\n    reviseLabel,\n    reviseAriaLabel,\n    onClick,\n    isCustom = false\n  } = props;\n  const {skin} = context;\n  const [hovered, setHovered] = useState(false);\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 buttonProps = {\n    customStyle: {\n      backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n      color: hovered ? '#FFFFFF' : primarySkinColor,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n    },\n    onClick,\n    'aria-label': buttonAriaLabel,\n    label: buttonLabel,\n    'data-name': 'skill-card-button'\n  };\n\n  const titleBackgroundColor = useMemo(() => (isCustom ? '#128C72' : primarySkinColor), [\n    isCustom,\n    primarySkinColor\n  ]);\n\n  const titleBackground = useMemo(() => getGradientBackground(titleBackgroundColor), [\n    titleBackgroundColor\n  ]);\n\n  return (\n    <div className={style.skillCardWrapper} data-name=\"skill-card-wrapper\" aria-label={ariaLabel}>\n      <div\n        data-name=\"skill-title\"\n        className={style.skillTitle}\n        aria-label={skillAriaLabel || skillTitle}\n        style={{\n          background: titleBackground\n        }}\n      >\n        {skillTitle}\n      </div>\n      <div data-name=\"card-content-wrapper\">\n        <div\n          className={style.questionReviseText}\n          data-name=\"questions-to-revise-label\"\n          aria-label={reviseAriaLabel || reviseLabel}\n        >\n          <QuestionIcon className={style.questionReviseIcon} width={16} height={16} />\n          {reviseLabel}\n        </div>\n        <div\n          className={style.buttonWrapper}\n          onMouseOver={handleMouseOver}\n          onMouseLeave={handleMouseLeave}\n          data-name=\"button-wrapper\"\n        >\n          <ButtonLink {...buttonProps} />\n        </div>\n      </div>\n    </div>\n  );\n};\n\nSkillCard.propTypes = propTypes;\n\nexport default SkillCard;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","convert","NovaSolidInterfaceFeedbackInterfaceQuestionMark","QuestionIcon","getOr","ButtonLink","style","propTypes","getGradientBackground","baseColor","gradients","SkillCard","props","context","ariaLabel","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","onClick","isCustom","skin","hovered","setHovered","primarySkinColor","handleMouseOver","handleMouseLeave","buttonProps","customStyle","backgroundColor","color","transition","label","titleBackgroundColor","titleBackground","skillCardWrapper","background","questionReviseText","questionReviseIcon","buttonWrapper"],"sources":["../../../src/molecule/skill-card/index.js"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport {convert} from 'css-color-function';\nimport {NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon} from '@coorpacademy/nova-icons';\nimport getOr from 'lodash/fp/getOr';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst getGradientBackground = baseColor => {\n  const gradients = [\n    convert(`color(${baseColor} lightness(30%))`),\n    convert(`color(${baseColor} lightness(47%))`),\n    convert(`color(${baseColor} lightness(55%))`)\n  ];\n\n  return `radial-gradient(62.12% 56.45% at 0% 77.29%, ${gradients[0]} 0%, ${convert(\n    `color(${gradients[0]} a(0))`\n  )} 100%), radial-gradient(113.85% 103.46% at 93.27% 7.88%, ${gradients[1]} 0%, ${convert(\n    `color(${gradients[1]} a(0))`\n  )} 100%), radial-gradient(49.66% 49.63% at 78.65% 86.26%, ${gradients[2]} 0%, ${convert(\n    `color(${gradients[2]} a(0))`\n  )} 100%), ${baseColor}`;\n};\n\nconst SkillCard = (props, context) => {\n  const {\n    'aria-label': ariaLabel,\n    skillTitle,\n    skillAriaLabel,\n    buttonLabel,\n    buttonAriaLabel,\n    reviseLabel,\n    reviseAriaLabel,\n    onClick,\n    isCustom = false\n  } = props;\n  const {skin} = context;\n  const [hovered, setHovered] = useState(false);\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 buttonProps = {\n    customStyle: {\n      backgroundColor: hovered ? primarySkinColor : convert(`color(${primarySkinColor} a(0.07))`),\n      color: hovered ? '#FFFFFF' : primarySkinColor,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'\n    },\n    onClick,\n    'aria-label': buttonAriaLabel,\n    label: buttonLabel,\n    'data-name': 'skill-card-button'\n  };\n\n  const titleBackgroundColor = useMemo(\n    () => (isCustom ? '#128C72' : primarySkinColor),\n    [isCustom, primarySkinColor]\n  );\n\n  const titleBackground = useMemo(\n    () => getGradientBackground(titleBackgroundColor),\n    [titleBackgroundColor]\n  );\n\n  return (\n    <div className={style.skillCardWrapper} data-name=\"skill-card-wrapper\" aria-label={ariaLabel}>\n      <div\n        data-name=\"skill-title\"\n        className={style.skillTitle}\n        aria-label={skillAriaLabel || skillTitle}\n        style={{\n          background: titleBackground\n        }}\n      >\n        {skillTitle}\n      </div>\n      <div data-name=\"card-content-wrapper\">\n        <div\n          className={style.questionReviseText}\n          data-name=\"questions-to-revise-label\"\n          aria-label={reviseAriaLabel || reviseLabel}\n        >\n          <QuestionIcon className={style.questionReviseIcon} width={16} height={16} />\n          {reviseLabel}\n        </div>\n        <div\n          className={style.buttonWrapper}\n          onMouseOver={handleMouseOver}\n          onMouseLeave={handleMouseLeave}\n          data-name=\"button-wrapper\"\n        >\n          <ButtonLink {...buttonProps} />\n        </div>\n      </div>\n    </div>\n  );\n};\n\nSkillCard.propTypes = propTypes;\n\nexport default SkillCard;\n"],"mappings":"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"}

package/es/organism/review-stacked-slides/index.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 from 'react';
 import classnames from 'classnames';
 import _toString from 'lodash/fp/toString';
@@ -45,13 +47,14 @@ const StackedSlides = ({
       key: `slide-${slideIndex}`,
       "data-name": `slide-${slideIndex}`,
       className: classnames(style.slideBase, getSlideAnimation(animationType, position), endReview ? style.endReview : null)
-    }, /*#__PURE__*/React.createElement(ReviewSlide, {
+    }, /*#__PURE__*/React.createElement(ReviewSlide, _extends({
       slideIndex: _toString(slideIndex),
       slide,
       validateButton,
-      correctionPopinProps,
+      correctionPopinProps
+    }, {
       key: slideIndex
-    }));
+    })));
     stackedSlides.push(slideView);
   }
 

package/es/organism/review-stacked-slides/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","classnames","_toString","ReviewSlide","propTypes","style","TOTAL_SLIDES_STACK","stylesByPosition","position0","position1","position2","position3","position4","getSlideAnimation","action","position","slideOutHideAndIn","slideOutAndIn","hiddenSlide","StackedSlides","slides","endReview","validateButton","correctionPopinProps","stackedSlides","slideIndex","slide","animationType","slideView","slideBase","push","stackedSlidesYAxisOverflowContainer","stackedSlidesContainer"],"sources":["../../../src/organism/review-stacked-slides/index.js"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport _toString from 'lodash/fp/toString';\nimport ReviewSlide from '../review-slide';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nexport const TOTAL_SLIDES_STACK = 5;\n\nconst stylesByPosition = {\n  0: style.position0,\n  1: style.position1,\n  2: style.position2,\n  3: style.position3,\n  4: style.position4\n};\n\nconst getSlideAnimation = (action, position) => {\n  switch (action) {\n    case 'unstack':\n      return style.slideOutHideAndIn;\n    case 'restack':\n      return style.slideOutAndIn;\n    default:\n      return position < 0 ? style.hiddenSlide : stylesByPosition[position];\n  }\n};\n\nconst StackedSlides = ({slides, endReview, validateButton, correctionPopinProps}) => {\n  const stackedSlides = [];\n  // eslint-disable-next-line fp/no-loops\n  for (let slideIndex = 0; slideIndex < TOTAL_SLIDES_STACK; slideIndex++) {\n    const slide = slides[_toString(slideIndex)];\n    const {animationType, position} = slide;\n\n    const slideView = (\n      <div\n        key={`slide-${slideIndex}`}\n        data-name={`slide-${slideIndex}`}\n        className={classnames(\n          style.slideBase,\n          getSlideAnimation(animationType, position),\n          endReview ? style.endReview : null\n        )}\n      >\n        <ReviewSlide\n          {...{\n            slideIndex: _toString(slideIndex),\n            slide,\n            validateButton,\n            correctionPopinProps\n          }}\n          key={slideIndex}\n        />\n      </div>\n    );\n    stackedSlides.push(slideView);\n  }\n\n  return (\n    <div\n      key=\"stacked-slides-container-y-overflow\"\n      className={style.stackedSlidesYAxisOverflowContainer}\n    >\n      <div\n        key=\"stacked-slides-container\"\n        data-name=\"stacked-slides-container\"\n        className={style.stackedSlidesContainer}\n      >\n        {stackedSlides}\n      </div>\n    </div>\n  );\n};\n\nStackedSlides.propTypes = propTypes;\n\nexport default StackedSlides;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,SAAP,MAAsB,oBAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,gBAAgB,GAAG;EACvB,GAAGF,KAAK,CAACG,SADc;EAEvB,GAAGH,KAAK,CAACI,SAFc;EAGvB,GAAGJ,KAAK,CAACK,SAHc;EAIvB,GAAGL,KAAK,CAACM,SAJc;EAKvB,GAAGN,KAAK,CAACO;AALc,CAAzB;;AAQA,MAAMC,iBAAiB,GAAG,CAACC,MAAD,EAASC,QAAT,KAAsB;EAC9C,QAAQD,MAAR;IACE,KAAK,SAAL;MACE,OAAOT,KAAK,CAACW,iBAAb;;IACF,KAAK,SAAL;MACE,OAAOX,KAAK,CAACY,aAAb;;IACF;MACE,OAAOF,QAAQ,GAAG,CAAX,GAAeV,KAAK,CAACa,WAArB,GAAmCX,gBAAgB,CAACQ,QAAD,CAA1D;EANJ;AAQD,CATD;;AAWA,MAAMI,aAAa,GAAG,CAAC;EAACC,MAAD;EAASC,SAAT;EAAoBC,cAApB;EAAoCC;AAApC,CAAD,KAA+D;EACnF,MAAMC,aAAa,GAAG,EAAtB,CADmF,CAEnF;;EACA,KAAK,IAAIC,UAAU,GAAG,CAAtB,EAAyBA,UAAU,GAAGnB,kBAAtC,EAA0DmB,UAAU,EAApE,EAAwE;IACtE,MAAMC,KAAK,GAAGN,MAAM,CAAClB,SAAS,CAACuB,UAAD,CAAV,CAApB;;IACA,MAAM;MAACE,aAAD;MAAgBZ;IAAhB,IAA4BW,KAAlC;IAEA,MAAME,SAAS,gBACb;MACE,GAAG,EAAG,SAAQH,UAAW,EAD3B;MAEE,aAAY,SAAQA,UAAW,EAFjC;MAGE,SAAS,EAAExB,UAAU,CACnBI,KAAK,CAACwB,SADa,EAEnBhB,iBAAiB,CAACc,aAAD,EAAgBZ,QAAhB,CAFE,EAGnBM,SAAS,GAAGhB,KAAK,CAACgB,SAAT,GAAqB,IAHX;IAHvB,gBASE,oBAAC,WAAD;MAEII,UAAU,EAAEvB,SAAS,CAACuB,UAAD,CAFzB;MAGIC,KAHJ;MAIIJ,cAJJ;MAKIC,oBALJ;MAOE,GAAG,EAAEE;IAPP,EATF,CADF;IAqBAD,aAAa,CAACM,IAAd,CAAmBF,SAAnB;EACD;;EAED,oBACE;IACE,GAAG,EAAC,qCADN;IAEE,SAAS,EAAEvB,KAAK,CAAC0B;EAFnB,gBAIE;IACE,GAAG,EAAC,0BADN;IAEE,aAAU,0BAFZ;IAGE,SAAS,EAAE1B,KAAK,CAAC2B;EAHnB,GAKGR,aALH,CAJF,CADF;AAcD,CA7CD;;AA+CAL,aAAa,CAACf,SAAd,2CAA0BA,SAA1B;AAEA,eAAee,aAAf"}
+{"version":3,"file":"index.js","names":["React","classnames","_toString","ReviewSlide","propTypes","style","TOTAL_SLIDES_STACK","stylesByPosition","position0","position1","position2","position3","position4","getSlideAnimation","action","position","slideOutHideAndIn","slideOutAndIn","hiddenSlide","StackedSlides","slides","endReview","validateButton","correctionPopinProps","stackedSlides","slideIndex","slide","animationType","slideView","slideBase","push","stackedSlidesYAxisOverflowContainer","stackedSlidesContainer"],"sources":["../../../src/organism/review-stacked-slides/index.js"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport _toString from 'lodash/fp/toString';\nimport ReviewSlide from '../review-slide';\nimport propTypes from './prop-types';\nimport style from './style.css';\n\nexport const TOTAL_SLIDES_STACK = 5;\n\nconst stylesByPosition = {\n  0: style.position0,\n  1: style.position1,\n  2: style.position2,\n  3: style.position3,\n  4: style.position4\n};\n\nconst getSlideAnimation = (action, position) => {\n  switch (action) {\n    case 'unstack':\n      return style.slideOutHideAndIn;\n    case 'restack':\n      return style.slideOutAndIn;\n    default:\n      return position < 0 ? style.hiddenSlide : stylesByPosition[position];\n  }\n};\n\nconst StackedSlides = ({slides, endReview, validateButton, correctionPopinProps}) => {\n  const stackedSlides = [];\n  // eslint-disable-next-line fp/no-loops\n  for (let slideIndex = 0; slideIndex < TOTAL_SLIDES_STACK; slideIndex++) {\n    const slide = slides[_toString(slideIndex)];\n    const {animationType, position} = slide;\n\n    const slideView = (\n      <div\n        key={`slide-${slideIndex}`}\n        data-name={`slide-${slideIndex}`}\n        className={classnames(\n          style.slideBase,\n          getSlideAnimation(animationType, position),\n          endReview ? style.endReview : null\n        )}\n      >\n        <ReviewSlide\n          {...{\n            slideIndex: _toString(slideIndex),\n            slide,\n            validateButton,\n            correctionPopinProps\n          }}\n          key={slideIndex}\n        />\n      </div>\n    );\n    stackedSlides.push(slideView);\n  }\n\n  return (\n    <div\n      key=\"stacked-slides-container-y-overflow\"\n      className={style.stackedSlidesYAxisOverflowContainer}\n    >\n      <div\n        key=\"stacked-slides-container\"\n        data-name=\"stacked-slides-container\"\n        className={style.stackedSlidesContainer}\n      >\n        {stackedSlides}\n      </div>\n    </div>\n  );\n};\n\nStackedSlides.propTypes = propTypes;\n\nexport default StackedSlides;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,SAAP,MAAsB,oBAAtB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,OAAO,MAAMC,kBAAkB,GAAG,CAA3B;AAEP,MAAMC,gBAAgB,GAAG;EACvB,GAAGF,KAAK,CAACG,SADc;EAEvB,GAAGH,KAAK,CAACI,SAFc;EAGvB,GAAGJ,KAAK,CAACK,SAHc;EAIvB,GAAGL,KAAK,CAACM,SAJc;EAKvB,GAAGN,KAAK,CAACO;AALc,CAAzB;;AAQA,MAAMC,iBAAiB,GAAG,CAACC,MAAD,EAASC,QAAT,KAAsB;EAC9C,QAAQD,MAAR;IACE,KAAK,SAAL;MACE,OAAOT,KAAK,CAACW,iBAAb;;IACF,KAAK,SAAL;MACE,OAAOX,KAAK,CAACY,aAAb;;IACF;MACE,OAAOF,QAAQ,GAAG,CAAX,GAAeV,KAAK,CAACa,WAArB,GAAmCX,gBAAgB,CAACQ,QAAD,CAA1D;EANJ;AAQD,CATD;;AAWA,MAAMI,aAAa,GAAG,CAAC;EAACC,MAAD;EAASC,SAAT;EAAoBC,cAApB;EAAoCC;AAApC,CAAD,KAA+D;EACnF,MAAMC,aAAa,GAAG,EAAtB,CADmF,CAEnF;;EACA,KAAK,IAAIC,UAAU,GAAG,CAAtB,EAAyBA,UAAU,GAAGnB,kBAAtC,EAA0DmB,UAAU,EAApE,EAAwE;IACtE,MAAMC,KAAK,GAAGN,MAAM,CAAClB,SAAS,CAACuB,UAAD,CAAV,CAApB;;IACA,MAAM;MAACE,aAAD;MAAgBZ;IAAhB,IAA4BW,KAAlC;IAEA,MAAME,SAAS,gBACb;MACE,GAAG,EAAG,SAAQH,UAAW,EAD3B;MAEE,aAAY,SAAQA,UAAW,EAFjC;MAGE,SAAS,EAAExB,UAAU,CACnBI,KAAK,CAACwB,SADa,EAEnBhB,iBAAiB,CAACc,aAAD,EAAgBZ,QAAhB,CAFE,EAGnBM,SAAS,GAAGhB,KAAK,CAACgB,SAAT,GAAqB,IAHX;IAHvB,gBASE,oBAAC,WAAD,WACM;MACFI,UAAU,EAAEvB,SAAS,CAACuB,UAAD,CADnB;MAEFC,KAFE;MAGFJ,cAHE;MAIFC;IAJE,CADN;MAOE,GAAG,EAAEE;IAPP,GATF,CADF;IAqBAD,aAAa,CAACM,IAAd,CAAmBF,SAAnB;EACD;;EAED,oBACE;IACE,GAAG,EAAC,qCADN;IAEE,SAAS,EAAEvB,KAAK,CAAC0B;EAFnB,gBAIE;IACE,GAAG,EAAC,0BADN;IAEE,aAAU,0BAFZ;IAGE,SAAS,EAAE1B,KAAK,CAAC2B;EAHnB,GAKGR,aALH,CAJF,CADF;AAcD,CA7CD;;AA+CAL,aAAa,CAACf,SAAd,2CAA0BA,SAA1B;AAEA,eAAee,aAAf"}

package/es/organism/review-stacked-slides/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 from 'react';
 import { StyleSheet, View } from 'react-native';
 import keys from 'lodash/fp/keys';
@@ -21,14 +23,15 @@ const StackedSlides = props => {
   const stackedSlides = indexes.map(slideIndex => {
     const slide = slides[slideIndex]; // const {animationType, hidden, position} = slide;
 
-    return /*#__PURE__*/React.createElement(Slide, {
+    return /*#__PURE__*/React.createElement(Slide, _extends({
       num: Number.parseInt(slideIndex),
       slideIndex,
       slide,
       validateButton,
-      correctionPopinProps,
+      correctionPopinProps
+    }, {
       key: slideIndex
-    });
+    }));
   });
   return /*#__PURE__*/React.createElement(View, {
     style: style.slides