@coorpacademy/components 10.22.8 → 10.22.11

package/lib/organism/review-stacked-slides/style.css

@@ -0,0 +1,174 @@
+@value breakpoints: "../../variables/breakpoints.css";
+@value mobile from breakpoints;
+@value tablet from breakpoints;
+
+.stackedSlidesYAxisOverflowContainer {
+  width: 100%;
+  padding-top: 20px;
+  height: 100%;
+  min-height: 870px;
+  /* --- ie11 fallback --- */
+  overflow-y: hidden;
+  /* --------------------- */
+  overflow-y: clip;
+  overflow-x: visible;
+  display: flex;
+  justify-content: center;
+  flex-grow: 1;
+}
+
+.stackedSlidesContainer {
+  position: relative;
+  padding-top: 20px;
+  height: 788px;
+  max-width: 1240px;
+  width: 85%;
+  align-self: center;
+}
+
+.slideBase {
+  box-shadow: 0px 4px 58px rgba(0, 0, 0, 0.05);
+  background: white;
+  height: 706px;
+  border-radius: 24px;
+  overflow: hidden;
+  position: absolute;
+
+  transition: transform 0.5s ease-in;
+  pointer-events: none;
+}
+
+.slideBase.position0 {
+  pointer-events: auto;
+}
+
+.position0 {
+  z-index: 50;
+  width: 100%;
+  transform: translate(0, 0);
+  transition: transform 0.5s ease-in;
+}
+
+.position1 {
+  z-index: 45;
+  width: 98%;
+  transform: translate(0.8%, -8px);
+  transition: transform 0.5s ease-in;
+}
+
+.position2 {
+  z-index: 40;
+  width: 96%;
+  transform: translate(1.6%, -16px);
+  transition: transform 0.5s ease-in;
+}
+
+.position3 {
+  z-index: 35;
+  width: 94%;
+  transform: translate(2.4%, -24px);
+  transition: transform 0.5 ease-in;
+}
+
+.position4 {
+  z-index: 30;
+  width: 92%;
+  transform: translate(3.2%, -32px);
+  transition: transform 0.5 ease-in;
+}
+
+@keyframes slideOutHideAndSlideIn {
+  0% {
+    width: 100%;
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 100%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+    opacity: 1;
+  }
+  51% {
+    z-index: 30;
+    opacity: 0;
+  }
+  100% {
+    z-index: 30;
+    transform: translate(3.2%, -32px);
+    opacity: 0;
+  }
+}
+
+@keyframes slideOutAndIn {
+  0% {
+    z-index: 55;
+    transform: translate(0, 0);
+  }
+  50% {
+    width: 100%;
+    z-index: 50;
+    transform: translate(0, 1000px);
+  }
+  60% {
+    width: 92%;
+    z-index: 30;
+    transform: translate(3.2%, 900px);
+  }
+  100% {
+    z-index: 30;
+    width: 92%;
+    transform: translate(3.2%, -32px);
+  }
+}
+
+.slideOutHideAndIn {
+  pointer-events: none;
+  animation: slideOutHideAndSlideIn 3s ease forwards;
+}
+
+.slideOutAndIn {
+  pointer-events: none;
+  animation: slideOutAndIn 3s ease forwards;
+}
+
+.hiddenSlide {
+  display: none;
+}
+
+@keyframes slideOut {
+  0% {}
+  90% {
+    transform: translate(0, 1000px);
+  }
+  100% {
+    transform: scale(0);
+  }
+}
+
+.endReview {
+  pointer-events: none;
+  animation: slideOut 2.5s ease forwards;
+}
+
+@media tablet {
+  .stackedSlidesContainer {
+    height: 638px;
+    max-width: 960px;
+  }
+
+  .slideBase {
+    height: 606px;
+  }
+}
+
+@media mobile {
+  .stackedSlidesContainer {
+    height: 670px;
+    max-width: 335px;
+  }
+
+  .slideBase {
+    height: 654px;
+  }
+}

package/lib/template/app-review/index.js

@@ -11,7 +11,7 @@ var _onboarding = _interopRequireDefault(require("./onboarding"));
 
 var _skills = _interopRequireDefault(require("./skills"));
 
-var _slides = _interopRequireDefault(require("./slides"));
+var _player = _interopRequireDefault(require("./player"));
 
 var _propTypes = _interopRequireWildcard(require("./prop-types"));
 
@@ -25,7 +25,6 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-// -----------------------------------------------------------------------------
 const AppReview = (_ref) => {
   let {
     viewName,
@@ -33,25 +32,24 @@ const AppReview = (_ref) => {
     skills,
     slides
   } = _ref,
-      dispachers = _objectWithoutPropertiesLoose(_ref, ["viewName", "onboarding", "skills", "slides"]);
+      dispatchers = _objectWithoutPropertiesLoose(_ref, ["viewName", "onboarding", "skills", "slides"]);
 
   switch (viewName) {
     case _propTypes.ViewNames.skills:
-      return /*#__PURE__*/_react.default.createElement(_skills.default, _extends({}, skills, dispachers));
+      return /*#__PURE__*/_react.default.createElement(_skills.default, _extends({}, skills, dispatchers));
 
     case _propTypes.ViewNames.onboarding:
-      return /*#__PURE__*/_react.default.createElement(_onboarding.default, _extends({}, onboarding, dispachers));
+      return /*#__PURE__*/_react.default.createElement(_onboarding.default, _extends({}, onboarding, dispatchers));
 
     case _propTypes.ViewNames.slides:
-      return /*#__PURE__*/_react.default.createElement(_slides.default, _extends({}, slides, dispachers));
+      return /*#__PURE__*/_react.default.createElement(_player.default, _extends({}, slides, dispatchers));
 
     default:
       return /*#__PURE__*/_react.default.createElement(_loader.default, null);
   }
 };
 
-AppReview.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.default : {}; // -----------------------------------------------------------------------------
-
+AppReview.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.default : {};
 var _default = AppReview;
 exports.default = _default;
 //# sourceMappingURL=index.js.map

package/lib/template/app-review/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/template/app-review/index.js"],"names":["AppReview","viewName","onboarding","skills","slides","dispachers","ViewNames","propTypes"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA;AAEA,MAAMA,SAAS,GAAG,UAA2D;AAAA,MAA1D;AAACC,IAAAA,QAAD;AAAWC,IAAAA,UAAX;AAAuBC,IAAAA,MAAvB;AAA+BC,IAAAA;AAA/B,GAA0D;AAAA,MAAhBC,UAAgB;;AAC3E,UAAQJ,QAAR;AACE,SAAKK,qBAAUH,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBE,UAAxB,EAAP;;AACF,SAAKC,qBAAUJ,UAAf;AACE,0BAAO,6BAAC,mBAAD,eAAgBA,UAAhB,EAAgCG,UAAhC,EAAP;;AACF,SAAKC,qBAAUF,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBC,UAAxB,EAAP;;AACF;AACE,0BAAO,6BAAC,eAAD,OAAP;AARJ;AAUD,CAXD;;AAaAL,SAAS,CAACO,SAAV,2CAAsBA,kBAAtB,M,CAEA;;eAEeP,S","sourcesContent":["import React from 'react';\nimport Loader from '../../atom/loader';\nimport Onboarding from './onboarding';\nimport Skills from './skills';\nimport Slides from './slides';\nimport propTypes, {ViewNames} from './prop-types';\n\n// -----------------------------------------------------------------------------\n\nconst AppReview = ({viewName, onboarding, skills, slides, ...dispachers}) => {\n  switch (viewName) {\n    case ViewNames.skills:\n      return <Skills {...skills} {...dispachers} />;\n    case ViewNames.onboarding:\n      return <Onboarding {...onboarding} {...dispachers} />;\n    case ViewNames.slides:\n      return <Slides {...slides} {...dispachers} />;\n    default:\n      return <Loader />;\n  }\n};\n\nAppReview.propTypes = propTypes;\n\n// -----------------------------------------------------------------------------\n\nexport default AppReview;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/template/app-review/index.js"],"names":["AppReview","viewName","onboarding","skills","slides","dispatchers","ViewNames","propTypes"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,MAAMA,SAAS,GAAG,UAA4D;AAAA,MAA3D;AAACC,IAAAA,QAAD;AAAWC,IAAAA,UAAX;AAAuBC,IAAAA,MAAvB;AAA+BC,IAAAA;AAA/B,GAA2D;AAAA,MAAjBC,WAAiB;;AAC5E,UAAQJ,QAAR;AACE,SAAKK,qBAAUH,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBE,WAAxB,EAAP;;AACF,SAAKC,qBAAUJ,UAAf;AACE,0BAAO,6BAAC,mBAAD,eAAgBA,UAAhB,EAAgCG,WAAhC,EAAP;;AACF,SAAKC,qBAAUF,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBC,WAAxB,EAAP;;AACF;AACE,0BAAO,6BAAC,eAAD,OAAP;AARJ;AAUD,CAXD;;AAaAL,SAAS,CAACO,SAAV,2CAAsBA,kBAAtB;eAEeP,S","sourcesContent":["import React from 'react';\nimport Loader from '../../atom/loader';\nimport Onboarding from './onboarding';\nimport Skills from './skills';\nimport Player from './player';\nimport propTypes, {ViewNames} from './prop-types';\n\nconst AppReview = ({viewName, onboarding, skills, slides, ...dispatchers}) => {\n  switch (viewName) {\n    case ViewNames.skills:\n      return <Skills {...skills} {...dispatchers} />;\n    case ViewNames.onboarding:\n      return <Onboarding {...onboarding} {...dispatchers} />;\n    case ViewNames.slides:\n      return <Player {...slides} {...dispatchers} />;\n    default:\n      return <Loader />;\n  }\n};\n\nAppReview.propTypes = propTypes;\n\nexport default AppReview;\n"],"file":"index.js"}

package/lib/template/app-review/index.native.js

@@ -9,7 +9,7 @@ var _reactNative = require("react-native");
 
 var _propTypes = _interopRequireWildcard(require("./prop-types"));
 
-var _slides = _interopRequireDefault(require("./slides"));
+var _player = _interopRequireDefault(require("./player"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -21,15 +21,13 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-// -----------------------------------------------------------------------------
 const styles = _reactNative.StyleSheet.create({
   rootView: {
     flex: 1,
     alignItems: 'center',
     justifyContent: 'center'
   }
-}); // -----------------------------------------------------------------------------
-
+});
 
 const Switch = (_ref) => {
   let {
@@ -46,13 +44,12 @@ const Switch = (_ref) => {
       return /*#__PURE__*/_react.default.createElement(_reactNative.Text, null, "view onboarding");
 
     case _propTypes.ViewNames.slides:
-      return /*#__PURE__*/_react.default.createElement(_slides.default, _extends({}, slides, dispachers));
+      return /*#__PURE__*/_react.default.createElement(_player.default, _extends({}, slides, dispachers));
 
     default:
       return /*#__PURE__*/_react.default.createElement(_reactNative.Text, null, "view (none selected)");
   }
-}; // -----------------------------------------------------------------------------
-
+};
 
 const AppReview = props => {
   const {
@@ -72,12 +69,10 @@ const AppReview = props => {
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.rootView
   }, /*#__PURE__*/_react.default.createElement(Switch, props));
-}; // -----------------------------------------------------------------------------
-
+};
 
 AppReview.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.default : {};
-Switch.propTypes = process.env.NODE_ENV !== "production" ? AppReview.propTypes : {}; // -----------------------------------------------------------------------------
-
+Switch.propTypes = process.env.NODE_ENV !== "production" ? AppReview.propTypes : {};
 var _default = AppReview;
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map

package/lib/template/app-review/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/template/app-review/index.native.js"],"names":["styles","StyleSheet","create","rootView","flex","alignItems","justifyContent","Switch","viewName","slides","dispachers","ViewNames","home","onboarding","AppReview","props","navigateBack","backAction","backHandler","BackHandler","addEventListener","remove","propTypes"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA;AAEA,MAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,IAAI,EAAE,CADE;AAERC,IAAAA,UAAU,EAAE,QAFJ;AAGRC,IAAAA,cAAc,EAAE;AAHR;AADqB,CAAlB,CAAf,C,CAQA;;;AAEA,MAAMC,MAAM,GAAG,UAA2D;AAAA,MAA1D;AAACC,IAAAA,QAAD;AAA+BC,IAAAA;AAA/B,GAA0D;AAAA,MAAhBC,UAAgB;;AACxE,UAAQF,QAAR;AACE,SAAKG,qBAAUC,IAAf;AACE,0BAAO,6BAAC,iBAAD,oBAAP;;AACF,SAAKD,qBAAUE,UAAf;AACE,0BAAO,6BAAC,iBAAD,0BAAP;;AACF,SAAKF,qBAAUF,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBC,UAAxB,EAAP;;AACF;AACE,0BAAO,6BAAC,iBAAD,+BAAP;AARJ;AAUD,CAXD,C,CAaA;;;AAEA,MAAMI,SAAS,GAAGC,KAAK,IAAI;AACzB,QAAM;AAACC,IAAAA;AAAD,MAAiBD,KAAvB;AAEA,wBAAU,MAAM;AACd,UAAME,UAAU,GAAG,MAAM;AACvBD,MAAAA,YAAY;AACZ,aAAO,IAAP;AACD,KAHD,CADc,CAMd;;;AACA,UAAME,WAAW,GAAGC,yBAAYC,gBAAZ,CAA6B,mBAA7B,EAAkDH,UAAlD,CAApB;;AAEA,WAAO,MAAMC,WAAW,CAACG,MAAZ,EAAb;AACD,GAVD,EAUG,CAACL,YAAD,CAVH;AAYA,sBACE,6BAAC,iBAAD;AAAM,IAAA,KAAK,EAAEhB,MAAM,CAACG;AAApB,kBACE,6BAAC,MAAD,EAAYY,KAAZ,CADF,CADF;AAKD,CApBD,C,CAsBA;;;AAEAD,SAAS,CAACQ,SAAV,2CAAsBA,kBAAtB;AACAf,MAAM,CAACe,SAAP,2CAAmBR,SAAS,CAACQ,SAA7B,M,CAEA;;eAEeR,S","sourcesContent":["import React, {useEffect} from 'react';\nimport {Text, StyleSheet, View, BackHandler} from 'react-native';\nimport propTypes, {ViewNames} from './prop-types';\nimport Slides from './slides';\n\n// -----------------------------------------------------------------------------\n\nconst styles = StyleSheet.create({\n  rootView: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center'\n  }\n});\n\n// -----------------------------------------------------------------------------\n\nconst Switch = ({viewName, onboarding, skills, slides, ...dispachers}) => {\n  switch (viewName) {\n    case ViewNames.home:\n      return <Text>view home</Text>;\n    case ViewNames.onboarding:\n      return <Text>view onboarding</Text>;\n    case ViewNames.slides:\n      return <Slides {...slides} {...dispachers} />;\n    default:\n      return <Text>view (none selected)</Text>;\n  }\n};\n\n// -----------------------------------------------------------------------------\n\nconst AppReview = props => {\n  const {navigateBack} = props;\n\n  useEffect(() => {\n    const backAction = () => {\n      navigateBack();\n      return true;\n    };\n\n    // https://reactnative.dev/docs/backhandler\n    const backHandler = BackHandler.addEventListener('hardwareBackPress', backAction);\n\n    return () => backHandler.remove();\n  }, [navigateBack]);\n\n  return (\n    <View style={styles.rootView}>\n      <Switch {...props} />\n    </View>\n  );\n};\n\n// -----------------------------------------------------------------------------\n\nAppReview.propTypes = propTypes;\nSwitch.propTypes = AppReview.propTypes;\n\n// -----------------------------------------------------------------------------\n\nexport default AppReview;\n"],"file":"index.native.js"}
+{"version":3,"sources":["../../../src/template/app-review/index.native.js"],"names":["styles","StyleSheet","create","rootView","flex","alignItems","justifyContent","Switch","viewName","slides","dispachers","ViewNames","home","onboarding","AppReview","props","navigateBack","backAction","backHandler","BackHandler","addEventListener","remove","propTypes"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,MAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,IAAI,EAAE,CADE;AAERC,IAAAA,UAAU,EAAE,QAFJ;AAGRC,IAAAA,cAAc,EAAE;AAHR;AADqB,CAAlB,CAAf;;AAQA,MAAMC,MAAM,GAAG,UAA2D;AAAA,MAA1D;AAACC,IAAAA,QAAD;AAA+BC,IAAAA;AAA/B,GAA0D;AAAA,MAAhBC,UAAgB;;AACxE,UAAQF,QAAR;AACE,SAAKG,qBAAUC,IAAf;AACE,0BAAO,6BAAC,iBAAD,oBAAP;;AACF,SAAKD,qBAAUE,UAAf;AACE,0BAAO,6BAAC,iBAAD,0BAAP;;AACF,SAAKF,qBAAUF,MAAf;AACE,0BAAO,6BAAC,eAAD,eAAYA,MAAZ,EAAwBC,UAAxB,EAAP;;AACF;AACE,0BAAO,6BAAC,iBAAD,+BAAP;AARJ;AAUD,CAXD;;AAaA,MAAMI,SAAS,GAAGC,KAAK,IAAI;AACzB,QAAM;AAACC,IAAAA;AAAD,MAAiBD,KAAvB;AAEA,wBAAU,MAAM;AACd,UAAME,UAAU,GAAG,MAAM;AACvBD,MAAAA,YAAY;AACZ,aAAO,IAAP;AACD,KAHD,CADc,CAMd;;;AACA,UAAME,WAAW,GAAGC,yBAAYC,gBAAZ,CAA6B,mBAA7B,EAAkDH,UAAlD,CAApB;;AAEA,WAAO,MAAMC,WAAW,CAACG,MAAZ,EAAb;AACD,GAVD,EAUG,CAACL,YAAD,CAVH;AAYA,sBACE,6BAAC,iBAAD;AAAM,IAAA,KAAK,EAAEhB,MAAM,CAACG;AAApB,kBACE,6BAAC,MAAD,EAAYY,KAAZ,CADF,CADF;AAKD,CApBD;;AAsBAD,SAAS,CAACQ,SAAV,2CAAsBA,kBAAtB;AACAf,MAAM,CAACe,SAAP,2CAAmBR,SAAS,CAACQ,SAA7B;eAEeR,S","sourcesContent":["import React, {useEffect} from 'react';\nimport {Text, StyleSheet, View, BackHandler} from 'react-native';\nimport propTypes, {ViewNames} from './prop-types';\nimport Player from './player';\n\nconst styles = StyleSheet.create({\n  rootView: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center'\n  }\n});\n\nconst Switch = ({viewName, onboarding, skills, slides, ...dispachers}) => {\n  switch (viewName) {\n    case ViewNames.home:\n      return <Text>view home</Text>;\n    case ViewNames.onboarding:\n      return <Text>view onboarding</Text>;\n    case ViewNames.slides:\n      return <Player {...slides} {...dispachers} />;\n    default:\n      return <Text>view (none selected)</Text>;\n  }\n};\n\nconst AppReview = props => {\n  const {navigateBack} = props;\n\n  useEffect(() => {\n    const backAction = () => {\n      navigateBack();\n      return true;\n    };\n\n    // https://reactnative.dev/docs/backhandler\n    const backHandler = BackHandler.addEventListener('hardwareBackPress', backAction);\n\n    return () => backHandler.remove();\n  }, [navigateBack]);\n\n  return (\n    <View style={styles.rootView}>\n      <Switch {...props} />\n    </View>\n  );\n};\n\nAppReview.propTypes = propTypes;\nSwitch.propTypes = AppReview.propTypes;\n\nexport default AppReview;\n"],"file":"index.native.js"}

package/lib/template/app-review/player/index.js

@@ -0,0 +1,51 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _isNil = _interopRequireDefault(require("lodash/fp/isNil"));
+
+var _reviewBackground = _interopRequireDefault(require("../../../atom/review-background"));
+
+var _reviewCongrats = _interopRequireDefault(require("../../../organism/review-congrats"));
+
+var _reviewHeader = _interopRequireDefault(require("../../../organism/review-header"));
+
+var _reviewStackedSlides = _interopRequireDefault(require("../../../organism/review-stacked-slides"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _propTypes = require("./prop-types");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const PlayerReview = ({
+  header,
+  stack,
+  reviewBackgroundAriaLabel,
+  congratsProps
+}) => {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    key: "review-player-container",
+    "data-name": "review-player-container",
+    className: _style.default.playerReviewContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    key: "player-background-container",
+    className: _style.default.playerBackground
+  }, /*#__PURE__*/_react.default.createElement(_reviewBackground.default, {
+    "aria-label": reviewBackgroundAriaLabel
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    key: "review-header-wrapper",
+    className: _style.default.reviewHeaderContainer
+  }, /*#__PURE__*/_react.default.createElement(_reviewHeader.default, header)), /*#__PURE__*/_react.default.createElement(_reviewStackedSlides.default, stack), (0, _isNil.default)(congratsProps) ? null : /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.congrats,
+    "data-name": "congrats-container"
+  }, /*#__PURE__*/_react.default.createElement(_reviewCongrats.default, congratsProps)));
+};
+
+PlayerReview.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.PlayerReviewPropTypes : {};
+var _default = PlayerReview;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/template/app-review/player/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/player/index.js"],"names":["PlayerReview","header","stack","reviewBackgroundAriaLabel","congratsProps","style","playerReviewContainer","playerBackground","reviewHeaderContainer","congrats","propTypes","PlayerReviewPropTypes"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,YAAY,GAAG,CAAC;AAACC,EAAAA,MAAD;AAASC,EAAAA,KAAT;AAAgBC,EAAAA,yBAAhB;AAA2CC,EAAAA;AAA3C,CAAD,KAA+D;AAClF,sBACE;AACE,IAAA,GAAG,EAAC,yBADN;AAEE,iBAAU,yBAFZ;AAGE,IAAA,SAAS,EAAEC,eAAMC;AAHnB,kBAKE;AAAK,IAAA,GAAG,EAAC,6BAAT;AAAuC,IAAA,SAAS,EAAED,eAAME;AAAxD,kBACE,6BAAC,yBAAD;AAAkB,kBAAYJ;AAA9B,IADF,CALF,eASE;AAAK,IAAA,GAAG,EAAC,uBAAT;AAAiC,IAAA,SAAS,EAAEE,eAAMG;AAAlD,kBACE,6BAAC,qBAAD,EAAkBP,MAAlB,CADF,CATF,eAaE,6BAAC,4BAAD,EAAmBC,KAAnB,CAbF,EAeG,oBAAME,aAAN,IAAuB,IAAvB,gBACC;AAAK,IAAA,SAAS,EAAEC,eAAMI,QAAtB;AAAgC,iBAAU;AAA1C,kBACE,6BAAC,uBAAD,EAAoBL,aAApB,CADF,CAhBJ,CADF;AAuBD,CAxBD;;AA0BAJ,YAAY,CAACU,SAAb,2CAAyBC,gCAAzB;eAEeX,Y","sourcesContent":["import React from 'react';\nimport isNil from 'lodash/fp/isNil';\nimport ReviewBackground from '../../../atom/review-background';\nimport ReviewCongrats from '../../../organism/review-congrats';\nimport ReviewHeader from '../../../organism/review-header';\nimport StackedSlides from '../../../organism/review-stacked-slides';\nimport style from './style.css';\nimport {PlayerReviewPropTypes} from './prop-types';\n\nconst PlayerReview = ({header, stack, reviewBackgroundAriaLabel, congratsProps}) => {\n  return (\n    <div\n      key=\"review-player-container\"\n      data-name=\"review-player-container\"\n      className={style.playerReviewContainer}\n    >\n      <div key=\"player-background-container\" className={style.playerBackground}>\n        <ReviewBackground aria-label={reviewBackgroundAriaLabel} />\n      </div>\n\n      <div key=\"review-header-wrapper\" className={style.reviewHeaderContainer}>\n        <ReviewHeader {...header} />\n      </div>\n\n      <StackedSlides {...stack} />\n\n      {isNil(congratsProps) ? null : (\n        <div className={style.congrats} data-name=\"congrats-container\">\n          <ReviewCongrats {...congratsProps} />\n        </div>\n      )}\n    </div>\n  );\n};\n\nPlayerReview.propTypes = PlayerReviewPropTypes;\n\nexport default PlayerReview;\n"],"file":"index.js"}

package/lib/template/app-review/{slides → player}/index.native.js

@@ -141,8 +141,7 @@ const choicesStyle = _reactNative.StyleSheet.create({
     justifyContent: 'center',
     alignItems: 'center'
   }
-}); // -----------------------------------------------------------------------------
-
+});
 /* {choices.map(({text, selected = false}: _Choice_) => { */
 
 
@@ -168,7 +167,7 @@ Choices.propTypes = process.env.NODE_ENV !== "production" ? {
     text: _propTypes.default.text,
     selected: _propTypes.default.bool
   })
-} : {}; // -----------------------------------------------------------------------------
+} : {};
 
 const Slide = props => {
   const {
@@ -238,16 +237,20 @@ const Slide = props => {
     onPress: validateSlide,
     testID: `button-quizzer-validate`
   }, validateLabel));
-}; // -----------------------------------------------------------------------------
-// const Slides = ({slide}: Props) => {
+}; // const Slides = ({slide}: Props) => {
 
 
-const Slides = ({
-  slides,
-  validateSlide
-}) => {
+const Slides = props => {
+  const {
+    stack
+  } = props;
+  const {
+    slides,
+    validateButton: validateSlide
+  } = stack;
+
   if (!slides) {
-    return null;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, null);
   }
 
   return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
@@ -260,8 +263,7 @@ const Slides = ({
   }));
 };
 
-Slides.propTypes = process.env.NODE_ENV !== "production" ? _propTypes2.SlidesReviewPropTypes : {}; // -----------------------------------------------------------------------------
-
+Slides.propTypes = process.env.NODE_ENV !== "production" ? _propTypes2.PlayerReviewPropTypes : {};
 var _default = Slides;
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map

package/lib/template/app-review/player/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/player/index.native.tsx"],"names":["quizzerStyle","StyleSheet","create","container","flex","padding","justifyContent","alignItems","SLIDE_HEIGHT","height","creatSlideStyle","num","width","slide","position","top","backgroundColor","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","borderRadius","category","fontSize","lineHeight","textAlign","question","fontWeight","instruction","button","createOptionStyle","selected","box","marginTop","marginBottom","text","choicesStyle","Choices","choices","map","index","optionStyle","propTypes","PropTypes","arrayOf","bool","Slide","props","validateSlide","slideStyle","validateLabel","templateContext","analytics","answerUI","isDisabled","value","model","type","onChange","Slides","stack","slides","validateButton","PlayerReviewPropTypes"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {View, StyleSheet, Text, useWindowDimensions, Button} from 'react-native';\n\nimport FreeText from '../../../molecule/questions/free-text';\nimport {useTemplateContext} from '../template-context';\nimport {PlayerReviewPropTypes} from './prop-types';\n\n// import theme from '../../../modules/theme';\n// import translations from '../../../translations';\n// import {BrandThemeContext} from '../../../app-shared/components/brand-theme-provider';\n// import Button from '../../../app-shared/components/button';\n// import {HEADER_HEIGHT} from '../../../app-shared/components/header-v2';\n\n// export type _Choice_ = {\n//   text?: string,\n//   selected: boolean\n// };\n\n// export type _Slide_ = {\n//   category: string,\n//   question: string,\n//   instruction: string,\n//   type: 'multiSelection' | 'singleSelection' | 'trueOrFalse',\n//   choices?: _Choice_[]\n// };\n\n// interface Props {\n//   slide: _Slide_;\n//   num: number;\n// }\n\nconst quizzerStyle = StyleSheet.create({\n  container: {\n    flex: 1,\n    padding: 20,\n    // paddingTop: HEADER_HEIGHT + 20,      @todo with props\n    // backgroundColor: theme.colors.white, @todo with props\n    justifyContent: 'space-between',\n    alignItems: 'center'\n  }\n});\n\nconst SLIDE_HEIGHT = () => useWindowDimensions().height * 0.75;\n\n// const creatSlideStyle = (num: number) =>\nconst creatSlideStyle = (num, width, height) =>\n  StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      top: height / 2 - SLIDE_HEIGHT() / 2 - num * 4,\n      flex: 1,\n      backgroundColor: '#fff',\n      // backgroundColor: theme.colors.white, @todo with props and useEffect\n      height: SLIDE_HEIGHT(),\n      width: width - 40 - num * 8,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    },\n    category: {\n      fontSize: 12,\n      lineHeight: 16,\n      // color: theme.colors.text.primary, @todo with props\n      // marginBottom: theme.spacing.tiny, @todo with props\n      // marginTop: theme.spacing.small,   @todo with props\n      textAlign: 'center'\n    },\n    question: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      // color: theme.colors.text.primary, @todo with props\n      textAlign: 'center'\n    },\n    instruction: {\n      fontSize: 12,\n      lineHeight: 16,\n      // color: theme.colors.gray.medium,  @todo with props\n      // marginBottom: theme.spacing.base, @todo with props\n      // marginTop: theme.spacing.small,   @todo with props\n      textAlign: 'center'\n    },\n    button: {\n      width: 287,\n      height: 52,\n      borderRadius: 7\n      // marginTop: theme.spacing.base  @todo with props\n    }\n  });\n\nconst createOptionStyle = selected => {\n  // const brandTheme = React.useContext(BrandThemeContext); @todo with props\n\n  return StyleSheet.create({\n    box: {\n      width: '100%',\n      // https://stackoverflow.com/a/66561995/959219\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.2,\n      shadowRadius: 16,\n      elevation: 8,\n      // backgroundColor: selected ? brandTheme.colors.primary : theme.colors.white, @todo with props\n      padding: 12,\n      marginTop: 4,\n      marginBottom: 4,\n      borderRadius: 8\n    },\n    text: {\n      fontSize: 15,\n      fontWeight: 'bold',\n      lineHeight: 24,\n      // color: selected ? theme.colors.white : theme.colors.text.primary, @todo with props\n      textAlign: 'center'\n    }\n  });\n};\n\nconst choicesStyle = StyleSheet.create({\n  container: {\n    flex: 1,\n    width: '100%',\n    justifyContent: 'center',\n    alignItems: 'center'\n  }\n});\n\n/* {choices.map(({text, selected = false}: _Choice_) => { */\nconst Choices = ({choices = []}) => (\n  <View style={choicesStyle.container}>\n    {choices.map(({text, selected = false}, index) => {\n      const optionStyle = createOptionStyle(selected);\n      return (\n        <View style={optionStyle.box} key={`choice-${index}`}>\n          <Text style={optionStyle.text}>\n            {text} {selected}\n          </Text>\n        </View>\n      );\n    })}\n  </View>\n);\n\nChoices.propTypes = {\n  choices: PropTypes.arrayOf({\n    text: PropTypes.text,\n    selected: PropTypes.bool\n  })\n};\n\nconst Slide = props => {\n  const {validateSlide, slide, num} = props;\n  const {width, height} = useWindowDimensions();\n\n  const slideStyle = creatSlideStyle(num, width, height);\n  const validateLabel = '__validate'; // translations.validate\n\n  const templateContext = useTemplateContext();\n  const {analytics} = templateContext;\n\n  const {\n    answerUI: {isDisabled = false, value = '', model: {type, onChange}} = {\n      isDisabled: false,\n      value: '',\n      model: {type: 'freeText', onChange: () => null}\n    }\n  } = slide;\n\n  switch (type) {\n    case 'freeText': {\n      return (\n        <View style={slideStyle.slide}>\n          <FreeText\n            isDisabled={isDisabled}\n            onChange={onChange}\n            value={value}\n            testID=\"free-text\"\n            questionType=\"basic\"\n            analytics={analytics}\n          />\n        </View>\n      );\n    }\n    default:\n  }\n\n  return (\n    <View style={slideStyle.slide}>\n      <Text style={slideStyle.category}>{num}</Text>\n      <Text style={slideStyle.question}>{slide.question}</Text>\n      <Text style={slideStyle.instruction}>{slide.instruction}</Text>\n\n      <Choices choices={slide.choices} />\n\n      <Button style={slideStyle.button} onPress={validateSlide} testID={`button-quizzer-validate`}>\n        {validateLabel}\n      </Button>\n    </View>\n  );\n};\n\n// const Slides = ({slide}: Props) => {\nconst Slides = props => {\n  const {stack} = props;\n  const {slides, validateButton: validateSlide} = stack;\n  if (!slides) {\n    return <View />;\n  }\n\n  return (\n    <View style={quizzerStyle.container}>\n      <Slide validateSlide={validateSlide} slide={slides[0]} num={0} key={`slide-${0}`} />\n      {/* {slides.reverse().map((_slide, index) => (\n      <Slide\n        validateSlide={validateSlide}\n        slide={_slide}\n        num={slides.length - index}\n        key={`slide-${index}`}\n      />\n    ))} */}\n    </View>\n  );\n};\n\nSlides.propTypes = PlayerReviewPropTypes;\n\nexport default Slides;\n"],"file":"index.native.js"}

package/lib/template/app-review/player/prop-types.js

@@ -0,0 +1,25 @@
+"use strict";
+
+exports.__esModule = true;
+exports.PlayerReviewPropTypes = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _propTypes2 = _interopRequireDefault(require("../../../organism/review-congrats/prop-types"));
+
+var _propTypes3 = _interopRequireDefault(require("../../../atom/review-background/prop-types"));
+
+var _propTypes4 = _interopRequireDefault(require("../../../organism/review-header/prop-types"));
+
+var _propTypes5 = _interopRequireDefault(require("../../../organism/review-stacked-slides/prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const PlayerReviewPropTypes = {
+  header: _propTypes.default.shape(_propTypes4.default),
+  stack: _propTypes.default.shape(_propTypes5.default),
+  reviewBackgroundAriaLabel: _propTypes3.default['aria-label'],
+  congratsProps: _propTypes.default.shape(_propTypes2.default)
+};
+exports.PlayerReviewPropTypes = PlayerReviewPropTypes;
+//# sourceMappingURL=prop-types.js.map

package/lib/template/app-review/player/prop-types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/template/app-review/player/prop-types.js"],"names":["PlayerReviewPropTypes","header","PropTypes","shape","ReviewHeaderPropTypes","stack","StackedSlidesPropTypes","reviewBackgroundAriaLabel","ReviewBackgroundPropTypes","congratsProps","ReviewCongratsPropTypes"],"mappings":";;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;AAEO,MAAMA,qBAAqB,GAAG;AACnCC,EAAAA,MAAM,EAAEC,mBAAUC,KAAV,CAAgBC,mBAAhB,CAD2B;AAEnCC,EAAAA,KAAK,EAAEH,mBAAUC,KAAV,CAAgBG,mBAAhB,CAF4B;AAGnCC,EAAAA,yBAAyB,EAAEC,oBAA0B,YAA1B,CAHQ;AAInCC,EAAAA,aAAa,EAAEP,mBAAUC,KAAV,CAAgBO,mBAAhB;AAJoB,CAA9B","sourcesContent":["import PropTypes from 'prop-types';\n\nimport ReviewCongratsPropTypes from '../../../organism/review-congrats/prop-types';\nimport ReviewBackgroundPropTypes from '../../../atom/review-background/prop-types';\nimport ReviewHeaderPropTypes from '../../../organism/review-header/prop-types';\nimport StackedSlidesPropTypes from '../../../organism/review-stacked-slides/prop-types';\n\nexport const PlayerReviewPropTypes = {\n  header: PropTypes.shape(ReviewHeaderPropTypes),\n  stack: PropTypes.shape(StackedSlidesPropTypes),\n  reviewBackgroundAriaLabel: ReviewBackgroundPropTypes['aria-label'],\n  congratsProps: PropTypes.shape(ReviewCongratsPropTypes)\n};\n"],"file":"prop-types.js"}

package/lib/template/app-review/player/style.css

@@ -0,0 +1,41 @@
+.playerReviewContainer {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  /* --- ie11 fallback --- */
+  height: 100%;
+  /* --------------------- */
+  height: min-content;
+  min-height: 832px;
+}
+
+/* 
+  mozilla specific styling
+  - supports min-content but it calculates dynamic
+  flex child height differently than chromium browsers
+*/
+@supports (-moz-appearance:none) {
+  div.playerReviewContainer {
+    height: 100%;
+  } 
+}
+
+.reviewHeaderContainer {
+  width: 100%;
+}
+
+.congrats {
+  width: 100%;
+  height: 100%;
+  min-height: 832px;
+  position: absolute;
+}
+
+.playerBackground {
+  position: absolute;
+  display: block;
+  height: 100%;
+  min-height: 120vh;
+  top: 0;
+  left: 0;
+}

package/lib/template/app-review/prop-types.js

@@ -11,7 +11,7 @@ var _onboarding = _interopRequireDefault(require("./onboarding"));
 
 var _skills = _interopRequireDefault(require("./skills"));
 
-var _slides = _interopRequireDefault(require("./slides"));
+var _player = _interopRequireDefault(require("./player"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -21,14 +21,14 @@ const ViewNames = {
   skills: 'skills',
   onboarding: 'onboarding',
   slides: 'slides',
-  default: 'loader'
+  loader: 'loader'
 };
 exports.ViewNames = ViewNames;
 var _default = {
   viewName: _propTypes.default.oneOf((0, _keys.default)(ViewNames)),
   onboarding: _propTypes.default.shape(_extends({}, _onboarding.default.propTypes)),
   skills: _propTypes.default.shape(_extends({}, _skills.default.propTypes)),
-  slides: _propTypes.default.shape(_extends({}, _slides.default.propTypes))
+  slides: _propTypes.default.shape(_extends({}, _player.default.propTypes))
 };
 exports.default = _default;
 //# sourceMappingURL=prop-types.js.map

package/lib/template/app-review/prop-types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/template/app-review/prop-types.js"],"names":["ViewNames","skills","onboarding","slides","default","viewName","PropTypes","oneOf","shape","Onboarding","propTypes","Skills","Slides"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,MAAM,EAAE,QADe;AAEvBC,EAAAA,UAAU,EAAE,YAFW;AAGvBC,EAAAA,MAAM,EAAE,QAHe;AAIvBC,EAAAA,OAAO,EAAE;AAJc,CAAlB;;eAOQ;AACbC,EAAAA,QAAQ,EAAEC,mBAAUC,KAAV,CAAgB,mBAAKP,SAAL,CAAhB,CADG;AAEbE,EAAAA,UAAU,EAAEI,mBAAUE,KAAV,cAAoBC,oBAAWC,SAA/B,EAFC;AAGbT,EAAAA,MAAM,EAAEK,mBAAUE,KAAV,cAAoBG,gBAAOD,SAA3B,EAHK;AAIbP,EAAAA,MAAM,EAAEG,mBAAUE,KAAV,cAAoBI,gBAAOF,SAA3B;AAJK,C","sourcesContent":["import PropTypes from 'prop-types';\nimport keys from 'lodash/fp/keys';\nimport Onboarding from './onboarding';\nimport Skills from './skills';\nimport Slides from './slides';\n\nexport const ViewNames = {\n  skills: 'skills',\n  onboarding: 'onboarding',\n  slides: 'slides',\n  default: 'loader'\n};\n\nexport default {\n  viewName: PropTypes.oneOf(keys(ViewNames)),\n  onboarding: PropTypes.shape({...Onboarding.propTypes}),\n  skills: PropTypes.shape({...Skills.propTypes}),\n  slides: PropTypes.shape({...Slides.propTypes})\n};\n"],"file":"prop-types.js"}
+{"version":3,"sources":["../../../src/template/app-review/prop-types.js"],"names":["ViewNames","skills","onboarding","slides","loader","viewName","PropTypes","oneOf","shape","Onboarding","propTypes","Skills","Player"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,MAAM,EAAE,QADe;AAEvBC,EAAAA,UAAU,EAAE,YAFW;AAGvBC,EAAAA,MAAM,EAAE,QAHe;AAIvBC,EAAAA,MAAM,EAAE;AAJe,CAAlB;;eAOQ;AACbC,EAAAA,QAAQ,EAAEC,mBAAUC,KAAV,CAAgB,mBAAKP,SAAL,CAAhB,CADG;AAEbE,EAAAA,UAAU,EAAEI,mBAAUE,KAAV,cAAoBC,oBAAWC,SAA/B,EAFC;AAGbT,EAAAA,MAAM,EAAEK,mBAAUE,KAAV,cAAoBG,gBAAOD,SAA3B,EAHK;AAIbP,EAAAA,MAAM,EAAEG,mBAAUE,KAAV,cAAoBI,gBAAOF,SAA3B;AAJK,C","sourcesContent":["import PropTypes from 'prop-types';\nimport keys from 'lodash/fp/keys';\nimport Onboarding from './onboarding';\nimport Skills from './skills';\nimport Player from './player';\n\nexport const ViewNames = {\n  skills: 'skills',\n  onboarding: 'onboarding',\n  slides: 'slides',\n  loader: 'loader'\n};\n\nexport default {\n  viewName: PropTypes.oneOf(keys(ViewNames)),\n  onboarding: PropTypes.shape({...Onboarding.propTypes}),\n  skills: PropTypes.shape({...Skills.propTypes}),\n  slides: PropTypes.shape({...Player.propTypes})\n};\n"],"file":"prop-types.js"}

package/lib/types/styles.d.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=styles.d.js.map

package/lib/types/styles.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"styles.d.js"}

package/lib/variables/shadow.js

@@ -0,0 +1,18 @@
+"use strict";
+
+exports.__esModule = true;
+exports.BOX_STYLE = void 0;
+const BOX_STYLE = {
+  shadowColor: '#14171A',
+  shadowOpacity: 0.15,
+  shadowOffset: {
+    width: 0,
+    height: 0
+  },
+  shadowRadius: 8,
+  elevation: 4,
+  backgroundColor: 'rgba(0,0,0,0.015)' // fix shadow not visible bug on android
+
+};
+exports.BOX_STYLE = BOX_STYLE;
+//# sourceMappingURL=shadow.js.map

package/lib/variables/shadow.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/variables/shadow.ts"],"names":["BOX_STYLE","shadowColor","shadowOpacity","shadowOffset","width","height","shadowRadius","elevation","backgroundColor"],"mappings":";;;;AASO,MAAMA,SAAmB,GAAG;AACjCC,EAAAA,WAAW,EAAE,SADoB;AAEjCC,EAAAA,aAAa,EAAE,IAFkB;AAGjCC,EAAAA,YAAY,EAAE;AAACC,IAAAA,KAAK,EAAE,CAAR;AAAWC,IAAAA,MAAM,EAAE;AAAnB,GAHmB;AAIjCC,EAAAA,YAAY,EAAE,CAJmB;AAKjCC,EAAAA,SAAS,EAAE,CALsB;AAMjCC,EAAAA,eAAe,EAAE,mBANgB,CAMI;;AANJ,CAA5B","sourcesContent":["export type BoxStyle = {\n  shadowColor: string;\n  shadowOpacity: number;\n  shadowOffset: {width: number; height: number};\n  shadowRadius: number;\n  elevation: number;\n  backgroundColor: string;\n};\n\nexport const BOX_STYLE: BoxStyle = {\n  shadowColor: '#14171A',\n  shadowOpacity: 0.15,\n  shadowOffset: {width: 0, height: 0},\n  shadowRadius: 8,\n  elevation: 4,\n  backgroundColor: 'rgba(0,0,0,0.015)' // fix shadow not visible bug on android\n};\n"],"file":"shadow.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "10.22.8",
+  "version": "10.22.11",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -97,6 +97,7 @@
     "@coorpacademy/css-modules-require-hook": "2.1.5",
     "@coorpacademy/eslint-plugin-coorpacademy": "^10.0.0",
     "@coorpacademy/react-native-mock-render": "^0.2.4",
+    "@coorpacademy/react-native-slider": "^0.11.1",
     "@coorpacademy/translate": "6.1.5",
     "@coorpacademy/webpack-config": "10.0.4",
     "@storybook/addon-knobs": "^5.3.18",
@@ -138,5 +139,5 @@
     "webpack": "^4.43.0"
   },
   "author": "CoorpAcademy",
-  "gitHead": "3be3050e700db2d58de6759c1ec7de6869047209"
+  "gitHead": "7191ac405f4eebce61c459722595014ea973818c"
 }