@coorpacademy/components 10.23.2 → 10.23.4

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/cm-popin/index.js"],"names":["CMPopin","props","content","mode","firstButton","secondButton","onClose","header","icon","backgroundImageUrl","descriptionText","thirdButton","cookieTitle","descriptionBtnTxt","listBtnSwicth","logo","AlertDiamond","WindowUpload","LogoComponent","backgroundImageStyle","backgroundImage","backgroundSize","renderHeader","style","headerBackground","cookieHeader","cookieIconContainer","cookieIcon","getClassBtnSwitch","index","btnList","firstBtnSwitchContainer","length","lastBtnSwitchContainer","singleSwitchContainer","renderBtnSwitch","map","convert","cap","el","type","title","value","onChange","titlePosition","theme","details","requiredSelection","disabled","id","dataName","background","popinCookie","popin","popinHeader","titleContainer","contentSection","message","__html","descriptionBtn","buttonContainer","largeButton","button","label","handleOnclick","propTypes","PropTypes","string","oneOf","shape","func","bool","boolean","arrayOf","InputSwitch"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidInterfaceFeedbackInterfaceAlertDiamond as AlertDiamond,\n  NovaSolidApplicationsWindowUpload3 as WindowUpload,\n  NovaLineSettingsCookie as Cookie\n} from '@coorpacademy/nova-icons';\nimport map from 'lodash/fp/map';\nimport Cta from '../../atom/button-link';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst CMPopin = props => {\n  const {\n    content,\n    mode = 'alert',\n    firstButton,\n    secondButton,\n    onClose,\n    header,\n    icon,\n    backgroundImageUrl,\n    descriptionText,\n    thirdButton,\n    cookieTitle,\n    descriptionBtnTxt,\n    listBtnSwicth\n  } = props;\n\n  const logo = {\n    AlertDiamond,\n    WindowUpload\n  };\n  const LogoComponent = logo[icon];\n\n  const backgroundImageStyle = backgroundImageUrl\n    ? {\n        backgroundImage: `url(${backgroundImageUrl})`,\n        backgroundSize: 'cover'\n      }\n    : null;\n  const renderHeader = () => {\n    if (header) return <img className={style.headerBackground} src={header} />;\n    if (mode === 'cookie')\n      return (\n        <div className={style.cookieHeader}>\n          <div className={style.cookieIconContainer}>\n            <Cookie className={style.cookieIcon} />\n          </div>\n          <div className={style.cookieTitle}>{cookieTitle}</div>\n        </div>\n      );\n    return null;\n  };\n  const getClassBtnSwitch = (index, btnList) => {\n    switch (index) {\n      case 0:\n        return style.firstBtnSwitchContainer;\n      case btnList.length - 1:\n        return style.lastBtnSwitchContainer;\n      default:\n        return style.singleSwitchContainer;\n    }\n  };\n  const renderBtnSwitch = () => {\n    return map.convert({cap: false})((el, index) => {\n      const {\n        type,\n        title,\n        value,\n        onChange,\n        titlePosition,\n        theme,\n        details,\n        requiredSelection,\n        disabled,\n        id,\n        'data-name': dataName\n      } = el;\n      return (\n        <div key={index} className={getClassBtnSwitch(index, listBtnSwicth)}>\n          <InputSwitch\n            {...{\n              type,\n              title,\n              value,\n              onChange,\n              titlePosition,\n              theme,\n              details,\n              requiredSelection,\n              disabled,\n              id,\n              'data-name': dataName\n            }}\n          />\n        </div>\n      );\n    })(listBtnSwicth);\n  };\n  return (\n    <div\n      className={mode !== 'cookie' ? style.background : null}\n      style={backgroundImageStyle}\n      data-name={'cm-popin-container'}\n    >\n      <div className={mode === 'cookie' ? style.popinCookie : style.popin}>\n        <header className={style.popinHeader}>\n          {renderHeader()}\n          {onClose ? (\n            <ButtonLinkIconOnly\n              onClick={onClose}\n              data-name={'close-icon'}\n              aria-label={'close-icon'}\n              size=\"small\"\n              icon=\"close\"\n            />\n          ) : null}\n        </header>\n        <div className={style.titleContainer}>\n          <div className={style.contentSection}>\n            {LogoComponent ? <LogoComponent className={style.icon} /> : null}\n            {content ? (\n              <p\n                className={mode === 'alert' ? style.content : style.message}\n                data-name={'cm-popin-content'}\n                // eslint-disable-next-line react/no-danger\n                dangerouslySetInnerHTML={{__html: content}}\n              />\n            ) : null}\n          </div>\n          {descriptionText ? (\n            <p\n              className={style.descriptionText}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: descriptionText}}\n            />\n          ) : null}\n        </div>\n        {descriptionBtnTxt ? <div className={style.descriptionBtn}>{descriptionBtnTxt}</div> : null}\n        {renderBtnSwitch()}\n        <div className={style.buttonContainer}>\n          {firstButton ? (\n            <div className={firstButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={firstButton.label}\n                onClick={firstButton.handleOnclick}\n                data-name={'cm-popin-cta'}\n                aria-label={firstButton['aria-label']}\n                type={firstButton.type}\n              />\n            </div>\n          ) : null}\n          {secondButton ? (\n            <div className={secondButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={secondButton.label}\n                onClick={secondButton.handleOnclick}\n                data-name={`cm-popin-cta-${secondButton.type}`}\n                aria-label={secondButton['aria-label']}\n                type={secondButton.type}\n              />\n            </div>\n          ) : null}\n          {thirdButton ? (\n            <div className={thirdButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={thirdButton.label}\n                onClick={thirdButton.handleOnclick}\n                data-name={`cm-popin-cta-${thirdButton.type}`}\n                aria-label={thirdButton['aria-label']}\n                type={thirdButton.type}\n              />\n            </div>\n          ) : null}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nCMPopin.propTypes = {\n  content: PropTypes.string,\n  mode: PropTypes.oneOf(['alert', 'information', 'cookie']),\n  header: PropTypes.string,\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary'])\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.boolean\n  }),\n  thirdButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.boolean\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.string,\n  backgroundImageUrl: PropTypes.string,\n  descriptionText: PropTypes.string,\n  cookieTitle: PropTypes.string,\n  descriptionBtnTxt: PropTypes.string,\n  listBtnSwicth: PropTypes.arrayOf(PropTypes.shape(InputSwitch.propTypes))\n};\n\nexport default CMPopin;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/cm-popin/index.js"],"names":["CMPopin","props","content","mode","firstButton","secondButton","onClose","header","icon","backgroundImageUrl","descriptionText","thirdButton","cookieTitle","descriptionBtnTxt","listBtnSwicth","logo","AlertDiamond","WindowUpload","MoonRocket","LogoComponent","backgroundImageStyle","backgroundImage","backgroundSize","renderHeader","style","headerBackground","cookieHeader","cookieIconContainer","cookieIcon","getClassBtnSwitch","index","btnList","firstBtnSwitchContainer","length","lastBtnSwitchContainer","singleSwitchContainer","renderBtnSwitch","map","convert","cap","el","type","title","value","onChange","titlePosition","theme","details","requiredSelection","disabled","id","dataName","background","popinCookie","popin","popinHeader","titleContainer","contentSection","message","__html","descriptionBtn","buttonContainer","largeButton","button","label","handleOnclick","customStyle","propTypes","PropTypes","string","oneOf","shape","func","bool","object","boolean","arrayOf","InputSwitch"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidInterfaceFeedbackInterfaceAlertDiamond as AlertDiamond,\n  NovaSolidApplicationsWindowUpload3 as WindowUpload,\n  NovaLineSettingsCookie as Cookie,\n  NovaSolidSpaceMoonRocket as MoonRocket\n} from '@coorpacademy/nova-icons';\nimport map from 'lodash/fp/map';\nimport Cta from '../../atom/button-link';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst CMPopin = props => {\n  const {\n    content,\n    mode = 'alert',\n    firstButton,\n    secondButton,\n    onClose,\n    header,\n    icon,\n    backgroundImageUrl,\n    descriptionText,\n    thirdButton,\n    cookieTitle,\n    descriptionBtnTxt,\n    listBtnSwicth\n  } = props;\n\n  const logo = {\n    AlertDiamond,\n    WindowUpload,\n    MoonRocket\n  };\n  const LogoComponent = logo[icon];\n\n  const backgroundImageStyle = backgroundImageUrl\n    ? {\n        backgroundImage: `url(${backgroundImageUrl})`,\n        backgroundSize: 'cover'\n      }\n    : null;\n  const renderHeader = () => {\n    if (header) return <img className={style.headerBackground} src={header} />;\n    if (mode === 'cookie')\n      return (\n        <div className={style.cookieHeader}>\n          <div className={style.cookieIconContainer}>\n            <Cookie className={style.cookieIcon} />\n          </div>\n          <div className={style.cookieTitle}>{cookieTitle}</div>\n        </div>\n      );\n    return null;\n  };\n  const getClassBtnSwitch = (index, btnList) => {\n    switch (index) {\n      case 0:\n        return style.firstBtnSwitchContainer;\n      case btnList.length - 1:\n        return style.lastBtnSwitchContainer;\n      default:\n        return style.singleSwitchContainer;\n    }\n  };\n  const renderBtnSwitch = () => {\n    return map.convert({cap: false})((el, index) => {\n      const {\n        type,\n        title,\n        value,\n        onChange,\n        titlePosition,\n        theme,\n        details,\n        requiredSelection,\n        disabled,\n        id,\n        'data-name': dataName\n      } = el;\n      return (\n        <div key={index} className={getClassBtnSwitch(index, listBtnSwicth)}>\n          <InputSwitch\n            {...{\n              type,\n              title,\n              value,\n              onChange,\n              titlePosition,\n              theme,\n              details,\n              requiredSelection,\n              disabled,\n              id,\n              'data-name': dataName\n            }}\n          />\n        </div>\n      );\n    })(listBtnSwicth);\n  };\n  return (\n    <div\n      className={mode !== 'cookie' ? style.background : null}\n      style={backgroundImageStyle}\n      data-name={'cm-popin-container'}\n    >\n      <div className={mode === 'cookie' ? style.popinCookie : style.popin}>\n        <header className={style.popinHeader}>\n          {renderHeader()}\n          {onClose ? (\n            <ButtonLinkIconOnly\n              onClick={onClose}\n              data-name={'close-icon'}\n              aria-label={'close-icon'}\n              size=\"small\"\n              icon=\"close\"\n            />\n          ) : null}\n        </header>\n        <div className={style.titleContainer}>\n          <div className={style.contentSection}>\n            {LogoComponent ? <LogoComponent className={style.icon} /> : null}\n            {content ? (\n              <p\n                className={mode === 'alert' ? style.content : style.message}\n                data-name={'cm-popin-content'}\n                // eslint-disable-next-line react/no-danger\n                dangerouslySetInnerHTML={{__html: content}}\n              />\n            ) : null}\n          </div>\n          {descriptionText ? (\n            <p\n              className={style.descriptionText}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: descriptionText}}\n            />\n          ) : null}\n        </div>\n        {descriptionBtnTxt ? <div className={style.descriptionBtn}>{descriptionBtnTxt}</div> : null}\n        {renderBtnSwitch()}\n        <div className={style.buttonContainer}>\n          {firstButton ? (\n            <div className={firstButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={firstButton.label}\n                onClick={firstButton.handleOnclick}\n                data-name={'cm-popin-cta'}\n                aria-label={firstButton['aria-label']}\n                type={firstButton.type}\n                customStyle={firstButton.customStyle}\n              />\n            </div>\n          ) : null}\n          {secondButton ? (\n            <div className={secondButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={secondButton.label}\n                onClick={secondButton.handleOnclick}\n                data-name={`cm-popin-cta-${secondButton.type}`}\n                aria-label={secondButton['aria-label']}\n                type={secondButton.type}\n              />\n            </div>\n          ) : null}\n          {thirdButton ? (\n            <div className={thirdButton.largeButton ? style.largeButton : style.button}>\n              <Cta\n                label={thirdButton.label}\n                onClick={thirdButton.handleOnclick}\n                data-name={`cm-popin-cta-${thirdButton.type}`}\n                aria-label={thirdButton['aria-label']}\n                type={thirdButton.type}\n                customStyle={thirdButton.customStyle}\n              />\n            </div>\n          ) : null}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nCMPopin.propTypes = {\n  content: PropTypes.string,\n  mode: PropTypes.oneOf(['alert', 'information', 'cookie']),\n  header: PropTypes.string,\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary', 'tertiary']),\n    customStyle: PropTypes.object\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.boolean,\n    customStyle: PropTypes.object\n  }),\n  thirdButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.boolean,\n    customStyle: PropTypes.object\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.string,\n  backgroundImageUrl: PropTypes.string,\n  descriptionText: PropTypes.string,\n  cookieTitle: PropTypes.string,\n  descriptionBtnTxt: PropTypes.string,\n  listBtnSwicth: PropTypes.arrayOf(PropTypes.shape(InputSwitch.propTypes))\n};\n\nexport default CMPopin;\n"],"file":"index.js"}

package/lib/molecule/cm-popin/style.css

@@ -114,6 +114,7 @@
 }
 
 .button {
+  min-width: max-content;
   width: 160px;
   padding: 8px;
 }
@@ -267,7 +268,31 @@ a {
 .popinCookie .largeButton {
   padding: 0px 8px 0px 0px
 }
+
 @media tablet {
+  .popin {
+    position: fixed;
+  }
+
+  .popin {
+    width: 80%;
+  }
+
+  .buttonContainer {
+    display: flex;
+    flex-wrap: wrap-reverse;
+    margin: 48px 24px 32px 24px;
+    width: 85%;
+  }
+  
+  .button {
+    width: 100%;
+  }
+
+  .titleContainer {
+    width: 85%;
+  }
+
   .popinCookie {
     position: fixed;
     bottom: 10px;
@@ -281,15 +306,52 @@ a {
     width: 100%;
     padding: 0px 0px 8px 0px
   }
-  .buttonContainer {
-    flex-wrap: wrap;
-    margin-top: 40px;
-  }
+
   .popinCookie .largeButton {
     padding: 8px 0px 0px 0px
   }
   .popinCookie .message {
     padding: 24px 24px 0px 24px
   }
- 
+
+  @media mobile {
+    .popin {
+      position: fixed;
+    }
+
+    .popin {
+      width: 80%;
+    }
+
+    .buttonContainer {
+      display: flex;
+      margin: 48px 24px 32px 24px;
+      width: 85%;
+    }
+    
+    .button {
+      width: 100%;
+    }
+
+    .titleContainer {
+      width: 85%;
+    }
+  }
 }
+
+/* ie11 style */
+_:-ms-fullscreen,
+.popinHeader
+button {
+  position: relative;
+}
+
+_:-ms-fullscreen,
+.descriptionText {
+  width: 85%;
+}
+
+_:-ms-fullscreen,
+.button {
+  width: 40%;
+}

package/lib/molecule/feedback/style.css

@@ -30,7 +30,7 @@
   border: 1px solid cm_grey_75;
   border-top: 0px;
   z-index: 2;
-  margin-top: 60px;
+  margin: 0px auto;
   position: relative;
 }
 

package/lib/organism/header-v2/index.native.js

@@ -0,0 +1,124 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = exports.HEADER_HEIGHT = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _novaIcons = require("@coorpacademy/nova-icons");
+
+var _templateContext = require("../../template/app-review/template-context");
+
+var _index = _interopRequireDefault(require("../../molecule/brand-logo/index.native"));
+
+var _index2 = _interopRequireDefault(require("../../atom/gradient/index.native"));
+
+var _index3 = _interopRequireDefault(require("../../hoc/touchable/index.native"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const HEADER_HEIGHT = 67;
+exports.HEADER_HEIGHT = HEADER_HEIGHT;
+const ICON_WIDTH = 20;
+
+const createStyleSheet = theme => _reactNative.StyleSheet.create({
+  container: {
+    position: 'absolute',
+    backgroundColor: theme.colors.white,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    height: HEADER_HEIGHT,
+    top: 0,
+    width: '100%'
+  },
+  icons: {
+    flexDirection: 'row'
+  },
+  icon: {
+    marginRight: 16
+  },
+  logo: {
+    width: 80,
+    marginLeft: 16
+  },
+  gradient: {
+    position: 'absolute',
+    left: 0,
+    top: HEADER_HEIGHT,
+    right: 0,
+    opacity: 0.3
+  }
+});
+
+const Header = props => {
+  const templateContext = (0, _templateContext.useTemplateContext)();
+  const [styleSheet, setStylesheet] = (0, _react.useState)(null);
+  const {
+    theme
+  } = templateContext;
+  const {
+    onSearchPress,
+    onSettingsPress,
+    onLogoLongPress
+  } = props;
+  const logoHeight = HEADER_HEIGHT - theme.spacing.small * 2;
+  (0, _react.useEffect)(() => {
+    const _stylesheet = createStyleSheet(theme);
+
+    setStylesheet(_stylesheet);
+  }, [theme]); // ------------------------------------
+
+  if (!styleSheet) {
+    return null;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styleSheet.container],
+    testID: "header"
+  }, /*#__PURE__*/_react.default.createElement(_index2.default, {
+    height: theme.spacing.tiny,
+    colors: [theme.colors.gray.medium, theme.colors.gray.light],
+    transparencyPosition: "bottom",
+    style: styleSheet.gradient
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styleSheet.logo
+  }, /*#__PURE__*/_react.default.createElement(_index3.default, {
+    testID: "header-logo",
+    onLongPress: onLogoLongPress,
+    analyticsID: "sign-out",
+    isWithoutFeedback: true
+  }, /*#__PURE__*/_react.default.createElement(_index.default, {
+    height: logoHeight
+  }))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styleSheet.icons]
+  }, /*#__PURE__*/_react.default.createElement(_index3.default, {
+    testID: "search-icon",
+    onPress: onSearchPress,
+    analyticsID: "search-icon"
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademySearch, {
+    height: ICON_WIDTH,
+    width: ICON_WIDTH,
+    color: theme.colors.gray.dark,
+    style: styleSheet.icon
+  })), /*#__PURE__*/_react.default.createElement(_index3.default, {
+    testID: "settings-icon",
+    onPress: onSettingsPress,
+    analyticsID: "settings-icon"
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyCog, {
+    height: ICON_WIDTH,
+    width: ICON_WIDTH,
+    color: theme.colors.gray.dark,
+    style: styleSheet.icon
+  }))));
+};
+
+var _default = Header;
+exports.default = _default;
+//# sourceMappingURL=index.native.js.map

package/lib/organism/header-v2/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/organism/header-v2/index.native.tsx"],"names":["HEADER_HEIGHT","ICON_WIDTH","createStyleSheet","theme","StyleSheet","create","container","position","backgroundColor","colors","white","flexDirection","alignItems","justifyContent","height","top","width","icons","icon","marginRight","logo","marginLeft","gradient","left","right","opacity","Header","props","templateContext","styleSheet","setStylesheet","onSearchPress","onSettingsPress","onLogoLongPress","logoHeight","spacing","small","_stylesheet","tiny","gray","medium","light","dark"],"mappings":"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","sourcesContent":["import React, {useState, useEffect} from 'react';\nimport type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';\n\nimport {View, StyleSheet} from 'react-native';\nimport {\n  NovaCompositionCoorpacademySearch as SearchIcon,\n  NovaCompositionCoorpacademyCog as SettingsIcon\n} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport BrandLogo from '../../molecule/brand-logo/index.native';\nimport Gradient from '../../atom/gradient/index.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {FlexAlignType, FlexDirection, JustifyContent, Position} from '../../types/styles';\nimport {Theme} from '../../variables/theme.native';\n\nexport interface Props {\n  onSearchPress: (event: PressEvent) => any;\n  onSettingsPress: (event: PressEvent) => any;\n  onLogoLongPress: (event: PressEvent) => any;\n}\n\nexport const HEADER_HEIGHT = 67;\nconst ICON_WIDTH = 20;\n\ntype StyleSheetType = {\n  container: {\n    position: Position;\n    backgroundColor: string;\n    flexDirection: FlexDirection;\n    alignItems: FlexAlignType;\n    justifyContent: JustifyContent;\n    height: string | number;\n    top: number;\n    width: string | number;\n  };\n  icons: {\n    flexDirection: FlexDirection;\n  };\n  icon: {\n    marginRight: number;\n  };\n  logo: {\n    width: number;\n    marginLeft: number;\n  };\n  gradient: {\n    position: Position;\n    left: number;\n    top: number;\n    right: number;\n    opacity: number;\n  };\n};\n\nconst createStyleSheet = (theme: Theme) =>\n  StyleSheet.create({\n    container: {\n      position: 'absolute',\n      backgroundColor: theme.colors.white,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      height: HEADER_HEIGHT,\n      top: 0,\n      width: '100%'\n    },\n    icons: {\n      flexDirection: 'row'\n    },\n    icon: {\n      marginRight: 16\n    },\n    logo: {\n      width: 80,\n      marginLeft: 16\n    },\n    gradient: {\n      position: 'absolute',\n      left: 0,\n      top: HEADER_HEIGHT,\n      right: 0,\n      opacity: 0.3\n    }\n  });\n\nconst Header = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  const {onSearchPress, onSettingsPress, onLogoLongPress} = props;\n  const logoHeight = HEADER_HEIGHT - theme.spacing.small * 2;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  // ------------------------------------\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={[styleSheet.container]} testID=\"header\">\n      <Gradient\n        height={theme.spacing.tiny}\n        colors={[theme.colors.gray.medium, theme.colors.gray.light]}\n        transparencyPosition=\"bottom\"\n        style={styleSheet.gradient}\n      />\n      <View style={styleSheet.logo}>\n        <Touchable\n          testID=\"header-logo\"\n          onLongPress={onLogoLongPress}\n          analyticsID=\"sign-out\"\n          isWithoutFeedback\n        >\n          <BrandLogo height={logoHeight} />\n        </Touchable>\n      </View>\n      <View style={[styleSheet.icons]}>\n        <Touchable testID=\"search-icon\" onPress={onSearchPress} analyticsID=\"search-icon\">\n          <SearchIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n        <Touchable testID=\"settings-icon\" onPress={onSettingsPress} analyticsID=\"settings-icon\">\n          <SettingsIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n      </View>\n    </View>\n  );\n};\n\nexport default Header;\n"],"file":"index.native.js"}

package/lib/organism/review-slide/style.css

@@ -139,7 +139,17 @@ _:-ms-fullscreen, :root .correctionPopinWrapper {
 }
 
 .disabledSlideContent {
-  pointer-events: none;
+  position: inherit;
+}
+.disabledSlideContent::after {
+  content: '';
+  top: 0px;
+  left: 0px;
+  bottom: 0px;
+  right: 0px;
+  position:absolute;
+  opacity: 0;
+  pointer-events: fill;
 }
 
 @media tablet {

package/lib/template/app-player/player/slides/header/index.js

@@ -30,14 +30,16 @@ const SlidesHeader = (props = {}, context = undefined) => {
     type,
     content,
     subcontent,
-    lives
+    lives,
+    mode
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-name": "slidesHeader",
     className: _style.default.wrapper
   }, type === HEADER_TYPE.LEARNER ? /*#__PURE__*/_react.default.createElement(_learner.default, {
     content: content,
-    subcontent: subcontent
+    subcontent: subcontent,
+    mode: mode
   }) : null, type === HEADER_TYPE.MICROLEARNING ? /*#__PURE__*/_react.default.createElement(_microlearning.default, {
     content: content
   }) : null, lives ? /*#__PURE__*/_react.default.createElement(_lives.default, {
@@ -56,7 +58,8 @@ SlidesHeader.propTypes = process.env.NODE_ENV !== "production" ? {
     title: _propTypes.default.string,
     details: _propTypes.default.string
   }),
-  lives: _propTypes.default.shape(_lives.default.propTypes)
+  lives: _propTypes.default.shape(_lives.default.propTypes),
+  mode: _propTypes.default.string
 } : {};
 var _default = SlidesHeader;
 exports.default = _default;

package/lib/template/app-player/player/slides/header/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/index.js"],"names":["HEADER_TYPE","LEARNER","MICROLEARNING","SlidesHeader","props","context","undefined","type","content","subcontent","lives","style","wrapper","count","propTypes","PropTypes","oneOf","shape","href","Link","title","string","isRequired","details","Lives"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAAiC;AAEjC,MAAMA,WAAW,GAAG;AAClBC,EAAAA,OAAO,EAAE,SADS;AAElBC,EAAAA,aAAa,EAAE;AAFG,CAApB;;AAKA,MAAMC,YAAY,GAAG,CAACC,KAAK,GAAG,EAAT,EAAaC,OAAO,GAAGC,SAAvB,KAAqC;AACxD,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,OAAP;AAAgBC,IAAAA,UAAhB;AAA4BC,IAAAA;AAA5B,MAAqCN,KAA3C;AAEA,sBACE;AAAK,iBAAU,cAAf;AAA8B,IAAA,SAAS,EAAEO,eAAMC;AAA/C,KACGL,IAAI,KAAKP,WAAW,CAACC,OAArB,gBAA+B,6BAAC,gBAAD;AAAS,IAAA,OAAO,EAAEO,OAAlB;AAA2B,IAAA,UAAU,EAAEC;AAAvC,IAA/B,GAAuF,IAD1F,EAEGF,IAAI,KAAKP,WAAW,CAACE,aAArB,gBAAqC,6BAAC,sBAAD;AAAe,IAAA,OAAO,EAAEM;AAAxB,IAArC,GAA2E,IAF9E,EAGGE,KAAK,gBAAG,6BAAC,cAAD;AAAO,IAAA,KAAK,EAAEA,KAAK,CAACG;AAApB,IAAH,GAAmC,IAH3C,CADF;AAOD,CAVD;;AAYAV,YAAY,CAACW,SAAb,2CAAyB;AACvBP,EAAAA,IAAI,EAAEQ,mBAAUC,KAAV,CAAgB,CAAChB,WAAW,CAACC,OAAb,EAAsBD,WAAW,CAACE,aAAlC,CAAhB,CADiB;AAEvBM,EAAAA,OAAO,EAAEO,mBAAUE,KAAV,CAAgB;AACvBC,IAAAA,IAAI,EAAEC,cAAKL,SAAL,CAAeI,IADE;AAEvBE,IAAAA,KAAK,EAAEL,mBAAUM,MAAV,CAAiBC,UAFD;AAGvBC,IAAAA,OAAO,EAAER,mBAAUM;AAHI,GAAhB,CAFc;AAOvBZ,EAAAA,UAAU,EAAEM,mBAAUE,KAAV,CAAgB;AAC1BG,IAAAA,KAAK,EAAEL,mBAAUM,MADS;AAE1BE,IAAAA,OAAO,EAAER,mBAAUM;AAFO,GAAhB,CAPW;AAWvBX,EAAAA,KAAK,EAAEK,mBAAUE,KAAV,CAAgBO,eAAMV,SAAtB;AAXgB,CAAzB;eAceX,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Link from '../../../../../atom/link';\nimport Learner from './learner';\nimport Microlearning from './microlearning';\nimport Lives from './lives';\nimport style from './style.css'; // eslint-disable-line css-modules/no-unused-class\n\nconst HEADER_TYPE = {\n  LEARNER: 'learner',\n  MICROLEARNING: 'microlearning'\n};\n\nconst SlidesHeader = (props = {}, context = undefined) => {\n  const {type, content, subcontent, lives} = props;\n\n  return (\n    <div data-name=\"slidesHeader\" className={style.wrapper}>\n      {type === HEADER_TYPE.LEARNER ? <Learner content={content} subcontent={subcontent} /> : null}\n      {type === HEADER_TYPE.MICROLEARNING ? <Microlearning content={content} /> : null}\n      {lives ? <Lives count={lives.count} /> : null}\n    </div>\n  );\n};\n\nSlidesHeader.propTypes = {\n  type: PropTypes.oneOf([HEADER_TYPE.LEARNER, HEADER_TYPE.MICROLEARNING]),\n  content: PropTypes.shape({\n    href: Link.propTypes.href,\n    title: PropTypes.string.isRequired,\n    details: PropTypes.string\n  }),\n  subcontent: PropTypes.shape({\n    title: PropTypes.string,\n    details: PropTypes.string\n  }),\n  lives: PropTypes.shape(Lives.propTypes)\n};\n\nexport default SlidesHeader;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/index.js"],"names":["HEADER_TYPE","LEARNER","MICROLEARNING","SlidesHeader","props","context","undefined","type","content","subcontent","lives","mode","style","wrapper","count","propTypes","PropTypes","oneOf","shape","href","Link","title","string","isRequired","details","Lives"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAAiC;AAEjC,MAAMA,WAAW,GAAG;AAClBC,EAAAA,OAAO,EAAE,SADS;AAElBC,EAAAA,aAAa,EAAE;AAFG,CAApB;;AAKA,MAAMC,YAAY,GAAG,CAACC,KAAK,GAAG,EAAT,EAAaC,OAAO,GAAGC,SAAvB,KAAqC;AACxD,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,OAAP;AAAgBC,IAAAA,UAAhB;AAA4BC,IAAAA,KAA5B;AAAmCC,IAAAA;AAAnC,MAA2CP,KAAjD;AAEA,sBACE;AAAK,iBAAU,cAAf;AAA8B,IAAA,SAAS,EAAEQ,eAAMC;AAA/C,KACGN,IAAI,KAAKP,WAAW,CAACC,OAArB,gBACC,6BAAC,gBAAD;AAAS,IAAA,OAAO,EAAEO,OAAlB;AAA2B,IAAA,UAAU,EAAEC,UAAvC;AAAmD,IAAA,IAAI,EAAEE;AAAzD,IADD,GAEG,IAHN,EAIGJ,IAAI,KAAKP,WAAW,CAACE,aAArB,gBAAqC,6BAAC,sBAAD;AAAe,IAAA,OAAO,EAAEM;AAAxB,IAArC,GAA2E,IAJ9E,EAKGE,KAAK,gBAAG,6BAAC,cAAD;AAAO,IAAA,KAAK,EAAEA,KAAK,CAACI;AAApB,IAAH,GAAmC,IAL3C,CADF;AASD,CAZD;;AAcAX,YAAY,CAACY,SAAb,2CAAyB;AACvBR,EAAAA,IAAI,EAAES,mBAAUC,KAAV,CAAgB,CAACjB,WAAW,CAACC,OAAb,EAAsBD,WAAW,CAACE,aAAlC,CAAhB,CADiB;AAEvBM,EAAAA,OAAO,EAAEQ,mBAAUE,KAAV,CAAgB;AACvBC,IAAAA,IAAI,EAAEC,cAAKL,SAAL,CAAeI,IADE;AAEvBE,IAAAA,KAAK,EAAEL,mBAAUM,MAAV,CAAiBC,UAFD;AAGvBC,IAAAA,OAAO,EAAER,mBAAUM;AAHI,GAAhB,CAFc;AAOvBb,EAAAA,UAAU,EAAEO,mBAAUE,KAAV,CAAgB;AAC1BG,IAAAA,KAAK,EAAEL,mBAAUM,MADS;AAE1BE,IAAAA,OAAO,EAAER,mBAAUM;AAFO,GAAhB,CAPW;AAWvBZ,EAAAA,KAAK,EAAEM,mBAAUE,KAAV,CAAgBO,eAAMV,SAAtB,CAXgB;AAYvBJ,EAAAA,IAAI,EAAEK,mBAAUM;AAZO,CAAzB;eAeenB,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Link from '../../../../../atom/link';\nimport Learner from './learner';\nimport Microlearning from './microlearning';\nimport Lives from './lives';\nimport style from './style.css'; // eslint-disable-line css-modules/no-unused-class\n\nconst HEADER_TYPE = {\n  LEARNER: 'learner',\n  MICROLEARNING: 'microlearning'\n};\n\nconst SlidesHeader = (props = {}, context = undefined) => {\n  const {type, content, subcontent, lives, mode} = props;\n\n  return (\n    <div data-name=\"slidesHeader\" className={style.wrapper}>\n      {type === HEADER_TYPE.LEARNER ? (\n        <Learner content={content} subcontent={subcontent} mode={mode} />\n      ) : null}\n      {type === HEADER_TYPE.MICROLEARNING ? <Microlearning content={content} /> : null}\n      {lives ? <Lives count={lives.count} /> : null}\n    </div>\n  );\n};\n\nSlidesHeader.propTypes = {\n  type: PropTypes.oneOf([HEADER_TYPE.LEARNER, HEADER_TYPE.MICROLEARNING]),\n  content: PropTypes.shape({\n    href: Link.propTypes.href,\n    title: PropTypes.string.isRequired,\n    details: PropTypes.string\n  }),\n  subcontent: PropTypes.shape({\n    title: PropTypes.string,\n    details: PropTypes.string\n  }),\n  lives: PropTypes.shape(Lives.propTypes),\n  mode: PropTypes.string\n};\n\nexport default SlidesHeader;\n"],"file":"index.js"}

package/lib/template/app-player/player/slides/header/learner.css

@@ -92,6 +92,16 @@
   composes: innerHTML from '../../../../../atom/label/style.css';
 }
 
+.contentWrapperScorm {
+  composes: contentWrapper;
+  cursor: default;
+}
+
+.contentWrapperScorm:hover {
+  color: dark;
+  stroke: dark;
+}
+
 @media mobile {
   .contentWrapper {
     max-width: 90%;

package/lib/template/app-player/player/slides/header/learner.js

@@ -21,22 +21,48 @@ var _learner = _interopRequireDefault(require("./learner.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const LearnerHeaderWrapper = props => {
+  const {
+    children,
+    mode,
+    onClick
+  } = props;
+  if (mode === 'scorm') return /*#__PURE__*/_react.default.createElement("div", {
+    className: _learner.default.contentWrapperScorm
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _learner.default.backIcon
+  }), children);
+  return /*#__PURE__*/_react.default.createElement(_link.default, {
+    onClick: onClick,
+    className: _learner.default.contentWrapper
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowLeft, {
+    className: _learner.default.backIcon,
+    color: "inherit"
+  }), children);
+};
+
+LearnerHeaderWrapper.propTypes = process.env.NODE_ENV !== "production" ? {
+  onClick: _link.default.propTypes.onClick,
+  mode: _propTypes.default.string,
+  children: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.node), _propTypes.default.node]).isRequired
+} : {};
+
 const Content = ({
   onClick,
   title,
-  details
+  details,
+  mode
 }, context) => {
   const {
     skin
   } = context;
   const primarySkinColor = (0, _get2.default)('common.primary', skin);
-  return /*#__PURE__*/_react.default.createElement(_link.default, {
-    onClick: onClick,
-    className: _learner.default.contentWrapper
-  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowLeft, {
-    className: _learner.default.backIcon,
-    color: "inherit"
-  }), /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement(LearnerHeaderWrapper, {
+    mode: mode,
+    onClick: onClick
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: _learner.default.content
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _learner.default.contentDetails,
@@ -59,7 +85,8 @@ Content.contextTypes = {
 Content.propTypes = process.env.NODE_ENV !== "production" ? {
   onClick: _link.default.propTypes.onClick,
   title: _propTypes.default.string.isRequired,
-  details: _propTypes.default.string
+  details: _propTypes.default.string,
+  mode: _propTypes.default.string
 } : {};
 
 const Subcontent = ({
@@ -85,16 +112,20 @@ Subcontent.propTypes = process.env.NODE_ENV !== "production" ? {
 const LearnerHeader = (props, context) => {
   const {
     content,
-    subcontent
+    subcontent,
+    mode
   } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _learner.default.wrapper
-  }, /*#__PURE__*/_react.default.createElement(Content, content), /*#__PURE__*/_react.default.createElement(Subcontent, subcontent));
+  }, /*#__PURE__*/_react.default.createElement(Content, _extends({}, content, {
+    mode: mode
+  })), /*#__PURE__*/_react.default.createElement(Subcontent, subcontent));
 };
 
 LearnerHeader.propTypes = process.env.NODE_ENV !== "production" ? {
   content: _propTypes.default.shape(Content.propTypes).isRequired,
-  subcontent: _propTypes.default.shape(Subcontent.propTypes).isRequired
+  subcontent: _propTypes.default.shape(Subcontent.propTypes).isRequired,
+  mode: _propTypes.default.string
 } : {};
 var _default = LearnerHeader;
 exports.default = _default;

package/lib/template/app-player/player/slides/header/learner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/learner.js"],"names":["Content","onClick","title","details","context","skin","primarySkinColor","style","contentWrapper","backIcon","content","contentDetails","color","contentTitle","innerHTML","__html","contextTypes","Provider","childContextTypes","propTypes","Link","PropTypes","string","isRequired","Subcontent","subcontent","subcontentDetails","subcontentTitle","LearnerHeader","props","wrapper","shape"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAG,CAAC;AAACC,EAAAA,OAAD;AAAUC,EAAAA,KAAV;AAAiBC,EAAAA;AAAjB,CAAD,EAA4BC,OAA5B,KAAwC;AACtD,QAAM;AAACC,IAAAA;AAAD,MAASD,OAAf;AACA,QAAME,gBAAgB,GAAG,mBAAI,gBAAJ,EAAsBD,IAAtB,CAAzB;AAEA,sBACE,6BAAC,aAAD;AAAM,IAAA,OAAO,EAAEJ,OAAf;AAAwB,IAAA,SAAS,EAAEM,iBAAMC;AAAzC,kBACE,6BAAC,6CAAD;AAAU,IAAA,SAAS,EAAED,iBAAME,QAA3B;AAAqC,IAAA,KAAK,EAAC;AAA3C,IADF,eAEE;AAAK,IAAA,SAAS,EAAEF,iBAAMG;AAAtB,kBACE;AACE,IAAA,SAAS,EAAEH,iBAAMI,cADnB;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,KAAK,EAAEN;AADF;AAFT,KAMGH,OANH,CADF,eAUE;AACE,iBAAU,cADZ;AAEE,IAAA,SAAS,EAAE,yBAAWI,iBAAMM,YAAjB,EAA+BN,iBAAMO,SAArC,CAFb,CAGE;AAHF;AAIE,IAAA,uBAAuB,EAAE;AAACC,MAAAA,MAAM,EAAEb;AAAT;AAJ3B,IAVF,CAFF,CADF;AAsBD,CA1BD;;AA4BAF,OAAO,CAACgB,YAAR,GAAuB;AACrBX,EAAAA,IAAI,EAAEY,kBAASC,iBAAT,CAA2Bb;AADZ,CAAvB;AAIAL,OAAO,CAACmB,SAAR,2CAAoB;AAClBlB,EAAAA,OAAO,EAAEmB,cAAKD,SAAL,CAAelB,OADN;AAElBC,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UAFN;AAGlBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAHD,CAApB;;AAMA,MAAME,UAAU,GAAG,CAAC;AAACtB,EAAAA,KAAD;AAAQC,EAAAA;AAAR,CAAD,EAAmBC,OAAnB,kBACjB;AAAK,EAAA,SAAS,EAAEG,iBAAMkB;AAAtB,gBACE;AAAK,EAAA,SAAS,EAAElB,iBAAMmB;AAAtB,GAA0CvB,OAA1C,CADF,eAEE;AACE,EAAA,SAAS,EAAE,yBAAWI,iBAAMoB,eAAjB,EAAkCpB,iBAAMO,SAAxC,CADb,CAEE;AAFF;AAGE,EAAA,uBAAuB,EAAE;AAACC,IAAAA,MAAM,EAAEb;AAAT;AAH3B,EAFF,CADF;;AAWAsB,UAAU,CAACL,SAAX,2CAAuB;AACrBjB,EAAAA,KAAK,EAAEmB,mBAAUC,MAAV,CAAiBC,UADH;AAErBpB,EAAAA,OAAO,EAAEkB,mBAAUC;AAFE,CAAvB;;AAKA,MAAMM,aAAa,GAAG,CAACC,KAAD,EAAQzB,OAAR,KAAoB;AACxC,QAAM;AAACM,IAAAA,OAAD;AAAUe,IAAAA;AAAV,MAAwBI,KAA9B;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEtB,iBAAMuB;AAAtB,kBACE,6BAAC,OAAD,EAAapB,OAAb,CADF,eAEE,6BAAC,UAAD,EAAgBe,UAAhB,CAFF,CADF;AAMD,CATD;;AAWAG,aAAa,CAACT,SAAd,2CAA0B;AACxBT,EAAAA,OAAO,EAAEW,mBAAUU,KAAV,CAAgB/B,OAAO,CAACmB,SAAxB,EAAmCI,UADpB;AAExBE,EAAAA,UAAU,EAAEJ,mBAAUU,KAAV,CAAgBP,UAAU,CAACL,SAA3B,EAAsCI;AAF1B,CAA1B;eAKeK,a","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport Provider from '../../../../../atom/provider';\nimport style from './learner.css';\n\nconst Content = ({onClick, title, details}, context) => {\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <Link onClick={onClick} className={style.contentWrapper}>\n      <BackIcon className={style.backIcon} color=\"inherit\" />\n      <div className={style.content}>\n        <div\n          className={style.contentDetails}\n          style={{\n            color: primarySkinColor\n          }}\n        >\n          {details}\n        </div>\n\n        <span\n          data-name=\"contentTitle\"\n          className={classnames(style.contentTitle, style.innerHTML)}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      </div>\n    </Link>\n  );\n};\n\nContent.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst Subcontent = ({title, details}, context) => (\n  <div className={style.subcontent}>\n    <div className={style.subcontentDetails}>{details}</div>\n    <div\n      className={classnames(style.subcontentTitle, style.innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </div>\n);\n\nSubcontent.propTypes = {\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst LearnerHeader = (props, context) => {\n  const {content, subcontent} = props;\n\n  return (\n    <div className={style.wrapper}>\n      <Content {...content} />\n      <Subcontent {...subcontent} />\n    </div>\n  );\n};\n\nLearnerHeader.propTypes = {\n  content: PropTypes.shape(Content.propTypes).isRequired,\n  subcontent: PropTypes.shape(Subcontent.propTypes).isRequired\n};\n\nexport default LearnerHeader;\n"],"file":"learner.js"}
+{"version":3,"sources":["../../../../../../src/template/app-player/player/slides/header/learner.js"],"names":["LearnerHeaderWrapper","props","children","mode","onClick","style","contentWrapperScorm","backIcon","contentWrapper","propTypes","Link","PropTypes","string","oneOfType","arrayOf","node","isRequired","Content","title","details","context","skin","primarySkinColor","content","contentDetails","color","contentTitle","innerHTML","__html","contextTypes","Provider","childContextTypes","Subcontent","subcontent","subcontentDetails","subcontentTitle","LearnerHeader","wrapper","shape"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowLeft as BackIcon} from '@coorpacademy/nova-icons';\nimport Link from '../../../../../atom/link';\nimport Provider from '../../../../../atom/provider';\nimport style from './learner.css';\n\nconst LearnerHeaderWrapper = props => {\n  const {children, mode, onClick} = props;\n  if (mode === 'scorm')\n    return (\n      <div className={style.contentWrapperScorm}>\n        <div className={style.backIcon} />\n        {children}\n      </div>\n    );\n  return (\n    <Link onClick={onClick} className={style.contentWrapper}>\n      <BackIcon className={style.backIcon} color=\"inherit\" />\n      {children}\n    </Link>\n  );\n};\n\nLearnerHeaderWrapper.propTypes = {\n  onClick: Link.propTypes.onClick,\n  mode: PropTypes.string,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired\n};\n\nconst Content = ({onClick, title, details, mode}, context) => {\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <LearnerHeaderWrapper mode={mode} onClick={onClick}>\n      <div className={style.content}>\n        <div\n          className={style.contentDetails}\n          style={{\n            color: primarySkinColor\n          }}\n        >\n          {details}\n        </div>\n\n        <span\n          data-name=\"contentTitle\"\n          className={classnames(style.contentTitle, style.innerHTML)}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      </div>\n    </LearnerHeaderWrapper>\n  );\n};\n\nContent.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nContent.propTypes = {\n  onClick: Link.propTypes.onClick,\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string,\n  mode: PropTypes.string\n};\n\nconst Subcontent = ({title, details}, context) => (\n  <div className={style.subcontent}>\n    <div className={style.subcontentDetails}>{details}</div>\n    <div\n      className={classnames(style.subcontentTitle, style.innerHTML)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: title}}\n    />\n  </div>\n);\n\nSubcontent.propTypes = {\n  title: PropTypes.string.isRequired,\n  details: PropTypes.string\n};\n\nconst LearnerHeader = (props, context) => {\n  const {content, subcontent, mode} = props;\n\n  return (\n    <div className={style.wrapper}>\n      <Content {...content} mode={mode} />\n      <Subcontent {...subcontent} />\n    </div>\n  );\n};\n\nLearnerHeader.propTypes = {\n  content: PropTypes.shape(Content.propTypes).isRequired,\n  subcontent: PropTypes.shape(Subcontent.propTypes).isRequired,\n  mode: PropTypes.string\n};\n\nexport default LearnerHeader;\n"],"file":"learner.js"}

package/lib/template/app-player/popin-end/summary.css

@@ -4,6 +4,7 @@
 @value colors: '../../../variables/colors.css';
 @value xtraLightGrey from colors;
 @value grey from colors;
+@value cm_grey_75 from colors;
 @value medium from colors;
 @value white from colors;
 @value light from colors;
@@ -259,31 +260,55 @@
   display: flex;
   justify-content: center;
   align-items: center;
+  position: absolute;
 }
 
 .smallCircle {
+  top:  -68px;
+  left: calc(50vw - 50vh - 68px);
   height: calc(100vh + 136px);
   width: calc(100vh + 136px);
   composes: circle;
 }
 .mediumCircle {
+  top: -193px;
+  left: calc(50vw - 50vh - 193px);
   height: calc(100vh + 386px);
   width: calc(100vh + 386px);
   composes: circle;
 }
 .largeCircle {
+  top: -318px;
+  left: calc(50vw - 50vh - 318px);
   height: calc(100vh + 636px);
   width: calc(100vh + 636px);
   composes: circle;
 }
+.background {
+  position: absolute;
+  top: 0px;
+  bottom: 0px;
+  left: 0px;
+  right: 0px;
+}
 .organismPlayerResultContainerScorm {
-  height: calc(100vh - 60px);
+  height: 100%;
+  min-height: calc(100vh - 60px);
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
+  position: relative;
   overflow: hidden;
 }
+.content {
+  border: 1px solid cm_grey_75;
+  position: relative;
+  padding: 0px;
+  margin: 0px;
+  max-width: 885px;
+  margin: 50px 0px;
+}
 .lottie {
   display: flex;
   height: 135%;
@@ -296,6 +321,7 @@
   position: absolute;
   z-index: 1;
   width: 100%;
+  top: 0px;
 }
 .ie11Backup {
   position: relative;
@@ -320,14 +346,8 @@
   }
 }
 @media tablet {
-  .organismPlayerResultContainerScorm {
-    height: 100%;
-  }
   .largeCircle , .mediumCircle, .smallCircle {
-    border: 0px;
-    height: 100%;
-    width: 100%;
-    border-radius: 0;
+    display: none;
   }
 }