@coorpacademy/components 11.11.9-alpha.6 → 11.11.10-alpha.10

package/es/atom/input-switch/style.css

@@ -4,6 +4,7 @@
 @value white from colors;
 @value light from colors;
 @value dark from colors;
+@value positive from colors;
 @value cm_grey_200 from colors;
 @value black from colors;
 @value cm_primary_blue from colors;
@@ -78,7 +79,7 @@
 }
 
 .checkbox:checked ~ label {
-  background: cm_primary_blue;
+  background: positive;
 }
 
 .default input:checked ~ label::after {

package/es/atom/select/style.css

@@ -410,6 +410,7 @@ div.player:hover span.selectSpan {
   height: 35px;
   border: 0;
   width: inherit;
+  background-color: light;
 }
 
 .mooc select {
@@ -547,7 +548,6 @@ div.player:hover span.selectSpan {
 }
 
 .default .selectWrapper select.selectBox {
-  max-width: 280px;
   width: inherit;
   border-radius: 8px;
   padding: 0;

package/es/molecule/errors-table/index.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { Props } from './types';
+declare const ErrorsTable: {
+    (props: Props): JSX.Element;
+    propTypes: {
+        columns: import("prop-types").Requireable<(import("prop-types").InferProps<{
+            title: import("prop-types").Validator<string>;
+        }> | null | undefined)[]>;
+        rows: import("prop-types").Requireable<(import("prop-types").InferProps<{
+            fields: import("prop-types").Requireable<(string | null | undefined)[]>;
+        }> | null | undefined)[]>;
+        ariaDescribedby: import("prop-types").Requireable<string>;
+    };
+};
+export default ErrorsTable;
+//# sourceMappingURL=index.d.ts.map

package/es/molecule/errors-table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/errors-table/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,KAAK,EAAY,MAAM,SAAS,CAAC;AAEzC,QAAA,MAAM,WAAW;YAAW,KAAK;;;;;;;;;;CAuDhC,CAAC;AAIF,eAAe,WAAW,CAAC"}

package/es/molecule/errors-table/index.js

@@ -0,0 +1,58 @@
+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); }
+
+/* eslint-disable css-modules/no-unused-class */
+import React from 'react';
+import classnames from 'classnames';
+import style from './style.css';
+import { propTypes } from './types';
+
+const ErrorsTable = props => {
+  const {
+    columns = [],
+    rows = [],
+    ariaDescribedby
+  } = props;
+  const headerRow = columns.map((column, cIndex) => {
+    const {
+      title
+    } = column;
+    return /*#__PURE__*/React.createElement("th", {
+      className: classnames(style[`header-${cIndex + 1}`]),
+      key: `${title}-${cIndex + 1}`,
+      role: "columnheader"
+    }, /*#__PURE__*/React.createElement("div", null, title));
+  });
+  const headerView = [/*#__PURE__*/React.createElement("th", {
+    className: classnames(style[`header-0`]),
+    key: "header"
+  }, /*#__PURE__*/React.createElement("div", null, " ", ''))].concat(headerRow);
+  const bodyView = rows.map((row, index) => {
+    const {
+      fields = []
+    } = row;
+    const bodyRow = fields.map((field, fIndex) => {
+      return /*#__PURE__*/React.createElement("td", {
+        className: classnames(style.col, style[`col-${fIndex + 1}`]),
+        key: `${field}-${fIndex}`
+      }, field || '');
+    });
+    bodyRow.unshift( /*#__PURE__*/React.createElement("td", {
+      className: classnames(style.col, style[`col-0`]),
+      key: "header"
+    }, index + 1));
+    return /*#__PURE__*/React.createElement("tr", {
+      key: `line-${index}`
+    }, bodyRow);
+  });
+  return /*#__PURE__*/React.createElement("table", _extends({}, ariaDescribedby ? {
+    'aria-describedby': ariaDescribedby
+  } : {}, {
+    className: style.table
+  }), /*#__PURE__*/React.createElement("thead", {
+    className: style.thead
+  }, /*#__PURE__*/React.createElement("tr", null, headerView)), /*#__PURE__*/React.createElement("tbody", null, bodyView));
+};
+
+ErrorsTable.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
+export default ErrorsTable;
+//# sourceMappingURL=index.js.map

package/es/molecule/errors-table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","classnames","style","propTypes","ErrorsTable","props","columns","rows","ariaDescribedby","headerRow","map","column","cIndex","title","headerView","concat","bodyView","row","index","fields","bodyRow","field","fIndex","col","unshift","table","thead"],"sources":["../../../src/molecule/errors-table/index.tsx"],"sourcesContent":["/* eslint-disable css-modules/no-unused-class */\nimport React from 'react';\nimport classnames from 'classnames';\nimport style from './style.css';\nimport {Props, propTypes} from './types';\n\nconst ErrorsTable = (props: Props) => {\n  const {columns = [], rows = [], ariaDescribedby} = props;\n\n  const headerRow = columns.map((column, cIndex) => {\n    const {title} = column;\n    return (\n      <th\n        className={classnames(style[`header-${cIndex + 1}`])}\n        key={`${title}-${cIndex + 1}`}\n        role=\"columnheader\"\n      >\n        <div>{title}</div>\n      </th>\n    );\n  });\n\n  const headerView = [\n    <th className={classnames(style[`header-0`])} key=\"header\">\n      <div> {''}</div>\n    </th>\n  ].concat(headerRow);\n\n  const bodyView = rows.map((row, index) => {\n    const {fields = []} = row;\n\n    const bodyRow = fields.map((field: string, fIndex: number) => {\n      return (\n        <td\n          className={classnames(style.col, style[`col-${fIndex + 1}`])}\n          key={`${field}-${fIndex}`}\n        >\n          {field || ''}\n        </td>\n      );\n    });\n    bodyRow.unshift(\n      <td className={classnames(style.col, style[`col-0`])} key=\"header\">\n        {index + 1}\n      </td>\n    );\n\n    return <tr key={`line-${index}`}>{bodyRow}</tr>;\n  });\n\n  return (\n    <table\n      {...(ariaDescribedby ? {'aria-describedby': ariaDescribedby} : {})}\n      className={style.table}\n    >\n      <thead className={style.thead}>\n        <tr>{headerView}</tr>\n      </thead>\n      <tbody>{bodyView}</tbody>\n    </table>\n  );\n};\n\nErrorsTable.propTypes = propTypes;\n\nexport default ErrorsTable;\n"],"mappings":";;AAAA;AACA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AACA,SAAeC,SAAf,QAA+B,SAA/B;;AAEA,MAAMC,WAAW,GAAIC,KAAD,IAAkB;EACpC,MAAM;IAACC,OAAO,GAAG,EAAX;IAAeC,IAAI,GAAG,EAAtB;IAA0BC;EAA1B,IAA6CH,KAAnD;EAEA,MAAMI,SAAS,GAAGH,OAAO,CAACI,GAAR,CAAY,CAACC,MAAD,EAASC,MAAT,KAAoB;IAChD,MAAM;MAACC;IAAD,IAAUF,MAAhB;IACA,oBACE;MACE,SAAS,EAAEV,UAAU,CAACC,KAAK,CAAE,UAASU,MAAM,GAAG,CAAE,EAAtB,CAAN,CADvB;MAEE,GAAG,EAAG,GAAEC,KAAM,IAAGD,MAAM,GAAG,CAAE,EAF9B;MAGE,IAAI,EAAC;IAHP,gBAKE,iCAAMC,KAAN,CALF,CADF;EASD,CAXiB,CAAlB;EAaA,MAAMC,UAAU,GAAG,cACjB;IAAI,SAAS,EAAEb,UAAU,CAACC,KAAK,CAAE,UAAF,CAAN,CAAzB;IAA8C,GAAG,EAAC;EAAlD,gBACE,sCAAO,EAAP,CADF,CADiB,EAIjBa,MAJiB,CAIVN,SAJU,CAAnB;EAMA,MAAMO,QAAQ,GAAGT,IAAI,CAACG,GAAL,CAAS,CAACO,GAAD,EAAMC,KAAN,KAAgB;IACxC,MAAM;MAACC,MAAM,GAAG;IAAV,IAAgBF,GAAtB;IAEA,MAAMG,OAAO,GAAGD,MAAM,CAACT,GAAP,CAAW,CAACW,KAAD,EAAgBC,MAAhB,KAAmC;MAC5D,oBACE;QACE,SAAS,EAAErB,UAAU,CAACC,KAAK,CAACqB,GAAP,EAAYrB,KAAK,CAAE,OAAMoB,MAAM,GAAG,CAAE,EAAnB,CAAjB,CADvB;QAEE,GAAG,EAAG,GAAED,KAAM,IAAGC,MAAO;MAF1B,GAIGD,KAAK,IAAI,EAJZ,CADF;IAQD,CATe,CAAhB;IAUAD,OAAO,CAACI,OAAR,eACE;MAAI,SAAS,EAAEvB,UAAU,CAACC,KAAK,CAACqB,GAAP,EAAYrB,KAAK,CAAE,OAAF,CAAjB,CAAzB;MAAsD,GAAG,EAAC;IAA1D,GACGgB,KAAK,GAAG,CADX,CADF;IAMA,oBAAO;MAAI,GAAG,EAAG,QAAOA,KAAM;IAAvB,GAA2BE,OAA3B,CAAP;EACD,CApBgB,CAAjB;EAsBA,oBACE,0CACOZ,eAAe,GAAG;IAAC,oBAAoBA;EAArB,CAAH,GAA2C,EADjE;IAEE,SAAS,EAAEN,KAAK,CAACuB;EAFnB,iBAIE;IAAO,SAAS,EAAEvB,KAAK,CAACwB;EAAxB,gBACE,gCAAKZ,UAAL,CADF,CAJF,eAOE,mCAAQE,QAAR,CAPF,CADF;AAWD,CAvDD;;AAyDAZ,WAAW,CAACD,SAAZ,2CAAwBA,SAAxB;AAEA,eAAeC,WAAf"}

package/es/molecule/errors-table/style.css

@@ -0,0 +1,64 @@
+@value colors: "../../variables/colors.css";
+@value xtraLightGrey from colors;
+@value cm_grey_400 from colors;
+@value cm_grey_700 from colors;
+@value cm_negative_red_200 from colors;
+@value light from colors;
+
+.table {
+  border: 1px solid light;
+  font-family: 'Gilroy';
+  font-style: normal;
+  border-spacing: 0;
+  border-radius: 8px;
+  overflow: hidden;
+  width: 100%;
+}
+
+.table .thead {
+  background-color: xtraLightGrey;
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 24px;
+  color: cm_grey_400;
+  height: 40px;
+  overflow: hidden;
+  text-align: left; 
+}
+
+.table .col {
+  text-align: left; 
+  padding-top: 8px;
+  padding-bottom: 8px;
+  position: relative;
+  font-weight: 500;
+  font-size: 12px;
+  line-height: 16px;
+  color: cm_grey_700;
+  border-top: 1px solid light;
+}
+
+.table .header-0 {
+  width: 57px;
+}
+
+.table .header-1 {
+  width: 182px;
+}
+
+.table .col-2 {
+  color: cm_negative_red_200;
+}
+
+.table .col-1 {
+  width: 182px;
+}
+
+.table .col-0 {
+  text-align: center;
+  font-weight: 600;
+  font-size: 12px;
+  line-height: 16px;
+  width: 57px;
+  color: cm_grey_400;
+}

package/es/molecule/errors-table/types.d.ts

@@ -0,0 +1,24 @@
+import PropTypes from 'prop-types';
+export declare const propTypes: {
+    columns: PropTypes.Requireable<(PropTypes.InferProps<{
+        title: PropTypes.Validator<string>;
+    }> | null | undefined)[]>;
+    rows: PropTypes.Requireable<(PropTypes.InferProps<{
+        fields: PropTypes.Requireable<(string | null | undefined)[]>;
+    }> | null | undefined)[]>;
+    ariaDescribedby: PropTypes.Requireable<string>;
+};
+export declare type Column = {
+    title: string;
+};
+export declare type Row = {
+    fields: string[];
+};
+export declare type Columns = [Column, Column];
+export declare type Rows = Row[];
+export declare type Props = {
+    columns: Columns;
+    rows: Rows;
+    ariaDescribedby?: string;
+};
+//# sourceMappingURL=types.d.ts.map

package/es/molecule/errors-table/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/errors-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,eAAO,MAAM,SAAS;;;;;;;;CAIrB,CAAC;AAEF,oBAAY,MAAM,GAAG;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC;AACrC,oBAAY,GAAG,GAAG;IAAC,MAAM,EAAE,MAAM,EAAE,CAAA;CAAC,CAAC;AACrC,oBAAY,OAAO,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AACvC,oBAAY,IAAI,GAAG,GAAG,EAAE,CAAC;AAEzB,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,IAAI,CAAC;IACX,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC"}

package/es/molecule/errors-table/types.js

@@ -0,0 +1,13 @@
+import PropTypes from 'prop-types';
+const columnProptypes = PropTypes.shape({
+  title: PropTypes.string.isRequired
+});
+const rowProptypes = PropTypes.shape({
+  fields: PropTypes.arrayOf(PropTypes.string)
+});
+export const propTypes = {
+  columns: PropTypes.arrayOf(columnProptypes),
+  rows: PropTypes.arrayOf(rowProptypes),
+  ariaDescribedby: PropTypes.string
+};
+//# sourceMappingURL=types.js.map

package/es/molecule/errors-table/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":["PropTypes","columnProptypes","shape","title","string","isRequired","rowProptypes","fields","arrayOf","propTypes","columns","rows","ariaDescribedby"],"sources":["../../../src/molecule/errors-table/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst columnProptypes = PropTypes.shape({\n  title: PropTypes.string.isRequired\n});\n\nconst rowProptypes = PropTypes.shape({\n  fields: PropTypes.arrayOf(PropTypes.string)\n});\n\nexport const propTypes = {\n  columns: PropTypes.arrayOf(columnProptypes),\n  rows: PropTypes.arrayOf(rowProptypes),\n  ariaDescribedby: PropTypes.string\n};\n\nexport type Column = {title: string};\nexport type Row = {fields: string[]};\nexport type Columns = [Column, Column];\nexport type Rows = Row[];\n\nexport type Props = {\n  columns: Columns;\n  rows: Rows;\n  ariaDescribedby?: string;\n};\n"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AAEA,MAAMC,eAAe,GAAGD,SAAS,CAACE,KAAV,CAAgB;EACtCC,KAAK,EAAEH,SAAS,CAACI,MAAV,CAAiBC;AADc,CAAhB,CAAxB;AAIA,MAAMC,YAAY,GAAGN,SAAS,CAACE,KAAV,CAAgB;EACnCK,MAAM,EAAEP,SAAS,CAACQ,OAAV,CAAkBR,SAAS,CAACI,MAA5B;AAD2B,CAAhB,CAArB;AAIA,OAAO,MAAMK,SAAS,GAAG;EACvBC,OAAO,EAAEV,SAAS,CAACQ,OAAV,CAAkBP,eAAlB,CADc;EAEvBU,IAAI,EAAEX,SAAS,CAACQ,OAAV,CAAkBF,YAAlB,CAFiB;EAGvBM,eAAe,EAAEZ,SAAS,CAACI;AAHJ,CAAlB"}

package/es/molecule/filters/filters-wapper.css

@@ -39,7 +39,6 @@
 .title {
   color: dark;
   margin: 0;
-  margin-bottom: 10px;
   display: block;
   font-family: "Gilroy";
   font-size: 15px;

package/es/molecule/questions/mobile/template/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAC,qBAAqB,EAAE,kBAAkB,EAAC,MAAM,aAAa,CAAC;AAE3E,OAAO,EACL,eAAe,EACf,UAAU,EACV,WAAW,EAEZ,MAAM,kDAAkD,CAAC;AAkJ1D,oBAAY,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC,kBAAkB,GAAG,qBAAqB,CAAC,CAAC;IAC3D,aAAa,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,qBAAqB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzF,eAAe,EAAE,eAAe,CAAC;IACjC,UAAU,EAAE,UAAU,CAAC;IACvB,WAAW,EAAE,WAAW,CAAC;CAC1B,CAAC;AAEF,QAAA,MAAM,gBAAgB,UAAW,KAAK,uBA8CrC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAC,qBAAqB,EAAE,kBAAkB,EAAC,MAAM,aAAa,CAAC;AAE3E,OAAO,EACL,eAAe,EACf,UAAU,EACV,WAAW,EAEZ,MAAM,kDAAkD,CAAC;AAoJ1D,oBAAY,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC,kBAAkB,GAAG,qBAAqB,CAAC,CAAC;IAC3D,aAAa,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,qBAAqB,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzF,eAAe,EAAE,eAAe,CAAC;IACjC,UAAU,EAAE,UAAU,CAAC;IACvB,WAAW,EAAE,WAAW,CAAC;CAC1B,CAAC;AAEF,QAAA,MAAM,gBAAgB,UAAW,KAAK,uBA+CrC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

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

@@ -48,6 +48,7 @@ const createStyleSheet = theme => ({
 const Item = props => {
   const {
     part,
+    index,
     isDisabled = false,
     focusedSelectId,
     choices,
@@ -62,7 +63,7 @@ const Item = props => {
     translations
   } = templateContext;
   const inputNames = choices.map(choice => choice.name);
-  const id = `question-part-${part.value}`;
+  const id = `question-part-${index + 1}`;
   const isFocused = focusedSelectId === id;
 
   if (part.type === 'answerField' && inputNames.includes(part.value)) {
@@ -125,7 +126,7 @@ const Item = props => {
     fontSize: theme.fontSize.regular,
     testID: id,
     style: styles.htmlText
-  }, part.value === ' ' ? part.value : trim(part.value || ''));
+  }, trim(part.value || ''));
 };
 
 const QuestionTemplate = props => {
@@ -157,14 +158,15 @@ const QuestionTemplate = props => {
   return /*#__PURE__*/React.createElement(View, {
     style: styleSheet.container,
     testID: "question-template"
-  }, parts.map(part => /*#__PURE__*/React.createElement(View, {
-    key: `question-part-${part.value}`,
+  }, parts.map((part, id) => /*#__PURE__*/React.createElement(View, {
+    key: `question-part-${id}`,
     style: {
       flexDirection: 'row'
     }
   }, /*#__PURE__*/React.createElement(Item, {
     part: part,
     choices: choices,
+    index: id,
     focusedSelectId: focusedSelectId,
     isDisabled: isDisabled,
     handleBlur: handleBlur,

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","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","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","translations","inputNames","map","choice","name","id","value","isFocused","type","includes","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","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  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    isDisabled = false,\n    focusedSelectId,\n    choices,\n    onInputChange,\n    handleBlur,\n    handleFocus,\n    styles\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme, translations} = templateContext;\n\n  const inputNames = choices.map(choice => choice.name);\n  const id = `question-part-${part.value}`;\n  const isFocused = focusedSelectId === id;\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 =\n      (_item: TemplateTextChoice | TemplateListOfChoices) => (_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: TextStyle[] = [styles.selectInput];\n    const selectTextStyle: TextStyle[] = [styles.selectText];\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      {part.value === ' ' ? part.value : 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 => (\n        <View key={`question-part-${part.value}`} style={{flexDirection: 'row'}}>\n          <Item\n            part={part}\n            choices={choices}\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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"}
+{"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","translations","inputNames","map","choice","name","id","isFocused","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","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, 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  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 =\n      (_item: TemplateTextChoice | TemplateListOfChoices) => (_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: TextStyle[] = [styles.selectInput];\n    const selectTextStyle: TextStyle[] = [styles.selectText];\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/organism/mooc-header/index.d.ts

@@ -86,7 +86,6 @@ declare class MoocHeader extends React.Component<any, any, any> {
             }>>;
         }>>;
         'settings-aria-label': PropTypes.Requireable<string>;
-        'close-settings-aria-label': PropTypes.Requireable<string>;
         'active-page-aria-label': PropTypes.Requireable<string>;
         settings: PropTypes.Requireable<(PropTypes.InferProps<{
             title: PropTypes.Requireable<string>;

package/es/organism/mooc-header/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAyBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6FE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAwBC;IAtBC;;;;;;MAMC;IAgDH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED,yBAQC;IAED,0BAQC;IAED,0BAIC;IAED,2BAIC;IAED,iCAUC;IA7GD,2EASC;IAGC,kBAAsB;IAmGxB,6BAIE;IAEF,6BAIE;IAEF,6BAscC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/mooc-header/index.js"],"names":[],"mappings":";AAyBA;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6FE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAwBC;IAtBC;;;;;;MAMC;IAgDH,6BAIC;IAED,yBAGC;IAxBD,qCAQC;IAED,wBAGC;IAjBD,+BAEC;IA4BD,2BAKC;IAED,0BAKC;IAED,sBAIC;IAED,qBAIC;IAED,yBAQC;IAED,0BAQC;IAED,0BAIC;IAED,2BAIC;IAED,iCAUC;IA7GD,2EASC;IAGC,kBAAsB;IAmGxB,6BAIE;IAEF,6BAIE;IAEF,6BAmcC;CACF"}

package/es/organism/mooc-header/index.js

@@ -204,7 +204,7 @@ class MoocHeader extends React.Component {
       search,
       'search-reset-aria-label': searchResetAriaLabel,
       'settings-aria-label': settingsAriaLabel,
-      'close-settings-aria-label': closeSettingsAriaLabel,
+      // 'close-settings-aria-label': closeSettingsAriaLabel,
       'active-page-aria-label': activePageAriaLabel
     } = this.props;
     const {
@@ -235,8 +235,7 @@ class MoocHeader extends React.Component {
     let settingsView = null;
     let notificationsView = null;
     let searchFormView = null;
-    const moreAriaLabel = translate('More');
-    const closeLabel = translate('Close');
+    const moreAriaLabel = translate('More'); // const closeLabel = translate('Close');
 
     const primaryColor = _get('common.primary', skin);
 
@@ -491,7 +490,7 @@ class MoocHeader extends React.Component {
               selectProps.className = style.languageSelect;
               settingView = /*#__PURE__*/React.createElement("div", {
                 "data-name": `setting-${settingName}`,
-                className: style.setting,
+                className: classnames(style.setting, style.selectBoxes),
                 key: settingName
               }, /*#__PURE__*/React.createElement("span", {
                 className: style.label
@@ -541,11 +540,7 @@ class MoocHeader extends React.Component {
       }, /*#__PURE__*/React.createElement("div", {
         "data-name": "settings",
         className: style.settingsGroup
-      }, settingsElements), /*#__PURE__*/React.createElement("div", {
-        className: style.closeSettings,
-        onClick: this.handleSettingsToggle,
-        "aria-label": closeSettingsAriaLabel
-      }, closeLabel)));
+      }, settingsElements)));
     }
 
     if (search) {
@@ -707,7 +702,7 @@ MoocHeader.propTypes = process.env.NODE_ENV !== "production" ? {
     })
   }),
   'settings-aria-label': PropTypes.string,
-  'close-settings-aria-label': PropTypes.string,
+  // 'close-settings-aria-label': PropTypes.string,
   'active-page-aria-label': PropTypes.string,
   settings: PropTypes.arrayOf(PropTypes.shape({
     title: PropTypes.string,