@coorpacademy/components 10.27.5-alpha.24 → 10.27.5-alpha.89

package/es/template/app-review/skills/index.native.js

@@ -1,8 +1,9 @@
 import React, { useState, useEffect } from 'react';
-import { View, FlatList, Pressable, StyleSheet, Text } from 'react-native';
-import { NovaCompositionNavigationArrowRight as ArrowRight, NovaCompositionCoorpacademyEmptyStateHomeRevision as EmptyStateHomeRevision } from '@coorpacademy/nova-icons';
-import { useTemplateContext } from '../template-context';
+import { Text, View, StyleSheet } from 'react-native';
 import { HEADER_HEIGHT } from '../../../organism/header-v2/index.native';
+import ReviewNoSkills from '../../../organism/review-no-skills/index.native';
+import ReviewListSkills from '../../../organism/review-skills/index.native';
+import { useTemplateContext } from '../template-context';
 
 const createStyleSheet = theme => StyleSheet.create({
   container: {
@@ -18,176 +19,19 @@ const createStyleSheet = theme => StyleSheet.create({
     color: theme.colors.text.primary,
     marginBottom: theme.spacing.base,
     marginTop: theme.spacing.small
-  },
-  subtitle: {
-    fontSize: theme.fontSize.xlarge,
-    color: theme.colors.text.primary,
-    marginBottom: theme.spacing.tiny
-  },
-  text: {
-    fontSize: 16,
-    lineHeight: 22,
-    color: theme.colors.text.primary,
-    opacity: 0.7,
-    marginBottom: theme.spacing.base
-  },
-  noSkillsImage: {
-    flex: 1,
-    alignSelf: 'center',
-    width: 320,
-    height: 300
-  },
-  skills: {
-    paddingBottom: 100
-  },
-  skill: {
-    display: 'flex',
-    flexDirection: 'row',
-    overflow: 'hidden',
-    alignItems: 'center',
-    height: 118,
-    borderRadius: 8,
-    backgroundColor: theme.colors.gray.lighter,
-    marginTop: theme.spacing.micro,
-    marginBottom: theme.spacing.micro,
-    padding: theme.spacing.base
-  },
-  skillTexts: {
-    flex: 1,
-    flexDirection: 'column'
-  },
-  skillTitle: {
-    fontSize: 18,
-    fontWeight: '600',
-    lineHeight: 22,
-    color: theme.colors.text.primary,
-    marginBottom: theme.spacing.tiny
-  },
-  skillInfo: {
-    fontSize: 12,
-    lineHeight: 16,
-    color: theme.colors.gray.medium
-  }
-}); // -----------------------------------------------------------------------------
-
-
-const onSelectSkill = title => () => {
-  // eslint-disable-next-line no-console
-  console.log('pressed on', {
-    title
-  });
-};
-
-const Skill = ({
-  title,
-  info
-}) => {
-  const templateContext = useTemplateContext();
-  const [styleSheet, setStylesheet] = useState(null);
-  const {
-    theme
-  } = templateContext;
-  useEffect(() => {
-    const _stylesheet = createStyleSheet(theme);
-
-    setStylesheet(_stylesheet);
-  }, [theme]);
-
-  if (!styleSheet) {
-    return null;
-  }
-
-  return /*#__PURE__*/React.createElement(Pressable, {
-    style: styleSheet.skill,
-    onPress: onSelectSkill(title)
-  }, /*#__PURE__*/React.createElement(View, {
-    style: styleSheet.skillTexts
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: styleSheet.skillTitle
-  }, title), /*#__PURE__*/React.createElement(Text, {
-    style: styleSheet.skillInfo
-  }, info)), /*#__PURE__*/React.createElement(ArrowRight, {
-    color: "#ededed",
-    height: 20,
-    width: 20
-  }));
-}; // -----------------------------------------------------------------------------
-
-
-const Item = ({
-  item: {
-    title,
-    info
   }
-}) => /*#__PURE__*/React.createElement(Skill, {
-  title: title,
-  info: info
 });
 
-const List = props => {
-  const templateContext = useTemplateContext();
-  const [styleSheet, setStylesheet] = useState(null);
-  const {
-    theme
-  } = templateContext;
-  const {
-    skills
-  } = props;
-  useEffect(() => {
-    const _stylesheet = createStyleSheet(theme);
-
-    setStylesheet(_stylesheet);
-  }, [theme]);
-
-  if (!styleSheet) {
-    return null;
-  }
-
-  const formattedDataList = [];
-  skills.map(skill => formattedDataList.push({
-    title: skill.skillTitle,
-    info: skill.skillAriaLabel
-  }));
-  return /*#__PURE__*/React.createElement(FlatList, {
-    contentContainerStyle: styleSheet.skills,
-    data: formattedDataList,
-    renderItem: Item
-  });
-}; // -----------------------------------------------------------------------------
-
-
-const NoSkills = () => {
-  const templateContext = useTemplateContext();
-  const [styleSheet, setStylesheet] = useState(null);
-  const {
-    theme,
-    translations
-  } = templateContext;
-  useEffect(() => {
-    const _stylesheet = createStyleSheet(theme);
-
-    setStylesheet(_stylesheet);
-  }, [theme]);
-
-  if (!styleSheet) {
-    return null;
-  }
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-    style: styleSheet.subtitle
-  }, translations.appReview?.noSkills?.title), /*#__PURE__*/React.createElement(Text, {
-    style: styleSheet.text
-  }, translations.appReview?.noSkills?.text), /*#__PURE__*/React.createElement(EmptyStateHomeRevision, {
-    style: styleSheet.noSkillsImage
-  }));
-}; // -----------------------------------------------------------------------------
-//  title --> translations.revision.home.title
-
-
-const Skills = props => {
+const ReviewSkills = props => {
   const {
+    'aria-label': ariaLabel,
     title,
-    listSkills
+    isLoading,
+    isLoadingAriaLabel,
+    listSkills,
+    titleNoSkills,
+    textNoSkills,
+    iconSkillAriaLabel
   } = props;
   const templateContext = useTemplateContext();
   const [styleSheet, setStylesheet] = useState(null);
@@ -198,21 +42,27 @@ const Skills = props => {
     const _stylesheet = createStyleSheet(theme);
 
     setStylesheet(_stylesheet);
-  }, [theme]); // ------------------------------------
+  }, [theme]);
 
   if (!styleSheet) {
     return null;
   }
 
   return /*#__PURE__*/React.createElement(View, {
-    style: styleSheet.container
+    style: styleSheet.container,
+    accessibilityLabel: ariaLabel
   }, /*#__PURE__*/React.createElement(Text, {
     style: styleSheet.title
-  }, title), !listSkills || listSkills.length === 0 ? /*#__PURE__*/React.createElement(NoSkills, null) : /*#__PURE__*/React.createElement(List, {
-    skills: listSkills
-  }));
-}; // -----------------------------------------------------------------------------
-
+  }, title), isLoading ? /*#__PURE__*/React.createElement(Text, {
+    accessibilityLabel: isLoadingAriaLabel
+  }, "Loading") : /*#__PURE__*/React.createElement(View, null, !listSkills || listSkills.length === 0 ? /*#__PURE__*/React.createElement(ReviewNoSkills, {
+    titleNoSkills: titleNoSkills,
+    textNoSkills: textNoSkills,
+    iconSkillAriaLabel: iconSkillAriaLabel
+  }) : /*#__PURE__*/React.createElement(ReviewListSkills, {
+    listSkills: listSkills
+  })));
+};
 
-export default Skills;
+export default ReviewSkills;
 //# sourceMappingURL=index.native.js.map

package/es/template/app-review/skills/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useState","useEffect","View","FlatList","Pressable","StyleSheet","Text","NovaCompositionNavigationArrowRight","ArrowRight","NovaCompositionCoorpacademyEmptyStateHomeRevision","EmptyStateHomeRevision","useTemplateContext","HEADER_HEIGHT","createStyleSheet","theme","create","container","flex","padding","paddingTop","backgroundColor","colors","white","title","fontSize","xlarge","fontWeight","bold","lineHeight","color","text","primary","marginBottom","spacing","base","marginTop","small","subtitle","tiny","opacity","noSkillsImage","alignSelf","width","height","skills","paddingBottom","skill","display","flexDirection","overflow","alignItems","borderRadius","gray","lighter","micro","skillTexts","skillTitle","skillInfo","medium","onSelectSkill","console","log","Skill","info","templateContext","styleSheet","setStylesheet","_stylesheet","Item","item","List","props","formattedDataList","map","push","skillAriaLabel","NoSkills","translations","appReview","noSkills","Skills","listSkills","length"],"sources":["../../../../src/template/app-review/skills/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {View, FlatList, Pressable, StyleSheet, Text, ViewStyle, TextStyle} from 'react-native';\nimport {\n  NovaCompositionNavigationArrowRight as ArrowRight,\n  NovaCompositionCoorpacademyEmptyStateHomeRevision as EmptyStateHomeRevision\n} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../template-context';\nimport {Theme} from '../../../variables/theme.native';\n\nimport {HEADER_HEIGHT} from '../../../organism/header-v2/index.native';\nimport {ItemProps, ListSkillsProps, SkillProps, SkillsProps} from './prop-types';\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  title: TextStyle;\n  subtitle: TextStyle;\n  text: TextStyle;\n  noSkillsImage: ViewStyle;\n  skills: ViewStyle;\n  skill: ViewStyle;\n  skillTexts: TextStyle;\n  skillTitle: TextStyle;\n  skillInfo: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    container: {\n      flex: 1,\n      padding: 20,\n      paddingTop: HEADER_HEIGHT + 20,\n      backgroundColor: theme.colors.white\n    },\n    title: {\n      fontSize: theme.fontSize.xlarge,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 28,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.base,\n      marginTop: theme.spacing.small\n    },\n    subtitle: {\n      fontSize: theme.fontSize.xlarge,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny\n    },\n    text: {\n      fontSize: 16,\n      lineHeight: 22,\n      color: theme.colors.text.primary,\n      opacity: 0.7,\n      marginBottom: theme.spacing.base\n    },\n    noSkillsImage: {\n      flex: 1,\n      alignSelf: 'center',\n      width: 320,\n      height: 300\n    },\n    skills: {paddingBottom: 100},\n    skill: {\n      display: 'flex',\n      flexDirection: 'row',\n      overflow: 'hidden',\n      alignItems: 'center',\n      height: 118,\n      borderRadius: 8,\n      backgroundColor: theme.colors.gray.lighter,\n      marginTop: theme.spacing.micro,\n      marginBottom: theme.spacing.micro,\n      padding: theme.spacing.base\n    },\n    skillTexts: {\n      flex: 1,\n      flexDirection: 'column'\n    },\n    skillTitle: {\n      fontSize: 18,\n      fontWeight: '600',\n      lineHeight: 22,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny\n    },\n    skillInfo: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium\n    }\n  });\n\n// -----------------------------------------------------------------------------\n\nconst onSelectSkill = (title: string) => () => {\n  // eslint-disable-next-line no-console\n  console.log('pressed on', {title});\n};\n\nconst Skill = ({title, info}: SkillProps) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <Pressable style={styleSheet.skill} onPress={onSelectSkill(title)}>\n      <View style={styleSheet.skillTexts}>\n        <Text style={styleSheet.skillTitle}>{title}</Text>\n        <Text style={styleSheet.skillInfo}>{info}</Text>\n      </View>\n      <ArrowRight color=\"#ededed\" height={20} width={20} />\n    </Pressable>\n  );\n};\n\n// -----------------------------------------------------------------------------\n\nconst Item = ({item: {title, info}}: ItemProps) => <Skill title={title} info={info} />;\n\ntype ItemDataType = {\n  title: string;\n  info: string;\n};\n\nconst List = (props: {skills: Array<ListSkillsProps>}) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n  const {skills} = props;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  const formattedDataList: Array<ItemDataType> = [];\n  skills.map(skill =>\n    formattedDataList.push({\n      title: skill.skillTitle,\n      info: skill.skillAriaLabel\n    })\n  );\n\n  return (\n    <FlatList\n      contentContainerStyle={styleSheet.skills}\n      data={formattedDataList}\n      renderItem={Item}\n    />\n  );\n};\n\n// -----------------------------------------------------------------------------\n\nconst NoSkills = () => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme, translations} = templateContext;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <>\n      <Text style={styleSheet.subtitle}>{translations.appReview?.noSkills?.title}</Text>\n      <Text style={styleSheet.text}>{translations.appReview?.noSkills?.text}</Text>\n      <EmptyStateHomeRevision style={styleSheet.noSkillsImage} />\n    </>\n  );\n};\n\n// -----------------------------------------------------------------------------\n\n//  title --> translations.revision.home.title\nconst Skills = (props: SkillsProps) => {\n  const {title, listSkills} = props;\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\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}>\n      <Text style={styleSheet.title}>{title}</Text>\n      {!listSkills || listSkills.length === 0 ? <NoSkills /> : <List skills={listSkills} />}\n    </View>\n  );\n};\n\n// -----------------------------------------------------------------------------\n\nexport default Skills;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useState","useEffect","Text","View","StyleSheet","HEADER_HEIGHT","ReviewNoSkills","ReviewListSkills","useTemplateContext","createStyleSheet","theme","create","container","flex","padding","paddingTop","backgroundColor","colors","white","title","fontSize","xlarge","fontWeight","bold","lineHeight","color","text","primary","marginBottom","spacing","base","marginTop","small","ReviewSkills","props","ariaLabel","isLoading","isLoadingAriaLabel","listSkills","titleNoSkills","textNoSkills","iconSkillAriaLabel","templateContext","styleSheet","setStylesheet","_stylesheet","length"],"sources":["../../../../src/template/app-review/skills/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {Text, View, StyleSheet, ViewStyle, TextStyle} from 'react-native';\nimport {HEADER_HEIGHT} from '../../../organism/header-v2/index.native';\nimport ReviewNoSkills from '../../../organism/review-no-skills/index.native';\nimport ReviewListSkills from '../../../organism/review-skills/index.native';\nimport {Theme} from '../../../variables/theme.native';\nimport {useTemplateContext} from '../template-context';\nimport {ReviewSkillsProps} from './prop-types';\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  title: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    container: {\n      flex: 1,\n      padding: 20,\n      paddingTop: HEADER_HEIGHT + 20,\n      backgroundColor: theme.colors.white\n    },\n    title: {\n      fontSize: theme.fontSize.xlarge,\n      fontWeight: theme.fontWeight.bold,\n      lineHeight: 28,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.base,\n      marginTop: theme.spacing.small\n    }\n  });\n\nconst ReviewSkills = (props: ReviewSkillsProps) => {\n  const {\n    'aria-label': ariaLabel,\n    title,\n    isLoading,\n    isLoadingAriaLabel,\n    listSkills,\n    titleNoSkills,\n    textNoSkills,\n    iconSkillAriaLabel\n  } = props;\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={styleSheet.container} accessibilityLabel={ariaLabel}>\n      <Text style={styleSheet.title}>{title}</Text>\n      {isLoading ? (\n        <Text accessibilityLabel={isLoadingAriaLabel}>Loading</Text>\n      ) : (\n        <View>\n          {!listSkills || listSkills.length === 0 ? (\n            <ReviewNoSkills\n              titleNoSkills={titleNoSkills}\n              textNoSkills={textNoSkills}\n              iconSkillAriaLabel={iconSkillAriaLabel}\n            />\n          ) : (\n            <ReviewListSkills listSkills={listSkills} />\n          )}\n        </View>\n      )}\n    </View>\n  );\n};\n\nexport default ReviewSkills;\n"],"mappings":"AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,SAAzB,QAAyC,OAAzC;AACA,SAAQC,IAAR,EAAcC,IAAd,EAAoBC,UAApB,QAA2D,cAA3D;AACA,SAAQC,aAAR,QAA4B,0CAA5B;AACA,OAAOC,cAAP,MAA2B,iDAA3B;AACA,OAAOC,gBAAP,MAA6B,8CAA7B;AAEA,SAAQC,kBAAR,QAAiC,qBAAjC;;AAQA,MAAMC,gBAAgB,GAAIC,KAAD,IACvBN,UAAU,CAACO,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,IAAI,EAAE,CADG;IAETC,OAAO,EAAE,EAFA;IAGTC,UAAU,EAAEV,aAAa,GAAG,EAHnB;IAITW,eAAe,EAAEN,KAAK,CAACO,MAAN,CAAaC;EAJrB,CADK;EAOhBC,KAAK,EAAE;IACLC,QAAQ,EAAEV,KAAK,CAACU,QAAN,CAAeC,MADpB;IAELC,UAAU,EAAEZ,KAAK,CAACY,UAAN,CAAiBC,IAFxB;IAGLC,UAAU,EAAE,EAHP;IAILC,KAAK,EAAEf,KAAK,CAACO,MAAN,CAAaS,IAAb,CAAkBC,OAJpB;IAKLC,YAAY,EAAElB,KAAK,CAACmB,OAAN,CAAcC,IALvB;IAMLC,SAAS,EAAErB,KAAK,CAACmB,OAAN,CAAcG;EANpB;AAPS,CAAlB,CADF;;AAkBA,MAAMC,YAAY,GAAIC,KAAD,IAA8B;EACjD,MAAM;IACJ,cAAcC,SADV;IAEJhB,KAFI;IAGJiB,SAHI;IAIJC,kBAJI;IAKJC,UALI;IAMJC,aANI;IAOJC,YAPI;IAQJC;EARI,IASFP,KATJ;EAUA,MAAMQ,eAAe,GAAGlC,kBAAkB,EAA1C;EACA,MAAM,CAACmC,UAAD,EAAaC,aAAb,IAA8B5C,QAAQ,CAAwB,IAAxB,CAA5C;EACA,MAAM;IAACU;EAAD,IAAUgC,eAAhB;EAEAzC,SAAS,CAAC,MAAM;IACd,MAAM4C,WAAW,GAAGpC,gBAAgB,CAACC,KAAD,CAApC;;IACAkC,aAAa,CAACC,WAAD,CAAb;EACD,CAHQ,EAGN,CAACnC,KAAD,CAHM,CAAT;;EAKA,IAAI,CAACiC,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAEA,UAAU,CAAC/B,SAAxB;IAAmC,kBAAkB,EAAEuB;EAAvD,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEQ,UAAU,CAACxB;EAAxB,GAAgCA,KAAhC,CADF,EAEGiB,SAAS,gBACR,oBAAC,IAAD;IAAM,kBAAkB,EAAEC;EAA1B,aADQ,gBAGR,oBAAC,IAAD,QACG,CAACC,UAAD,IAAeA,UAAU,CAACQ,MAAX,KAAsB,CAArC,gBACC,oBAAC,cAAD;IACE,aAAa,EAAEP,aADjB;IAEE,YAAY,EAAEC,YAFhB;IAGE,kBAAkB,EAAEC;EAHtB,EADD,gBAOC,oBAAC,gBAAD;IAAkB,UAAU,EAAEH;EAA9B,EARJ,CALJ,CADF;AAoBD,CA5CD;;AA8CA,eAAeL,YAAf"}

package/es/template/app-review/skills/prop-types.d.ts

@@ -1,17 +1,12 @@
 import PropTypes from 'prop-types';
-export declare const SkillPropsTypes: {
+import { NoSkillsProps } from '../../../organism/review-no-skills/prop-types';
+import { ReviewSkills } from '../../../organism/review-skills/prop-types';
+declare const propTypes: {
+    'aria-label': PropTypes.Requireable<string>;
     title: PropTypes.Requireable<string>;
-    info: PropTypes.Requireable<string>;
-};
-export declare const ItemPropsTypes: {
-    item: PropTypes.Requireable<PropTypes.InferProps<{
-        title: PropTypes.Requireable<string>;
-        info: PropTypes.Requireable<string>;
-        isExtraSpace: PropTypes.Requireable<boolean>;
-    }>>;
-};
-export declare const ListPropTypes: {
-    skills: PropTypes.Requireable<(PropTypes.InferProps<{
+    isLoading: PropTypes.Requireable<boolean>;
+    isLoadingAriaLabel: PropTypes.Requireable<string>;
+    listSkills: PropTypes.Requireable<(PropTypes.InferProps<{
         'aria-label': PropTypes.Requireable<string>;
         skillTitle: PropTypes.Requireable<string>;
         skillAriaLabel: PropTypes.Requireable<string>;
@@ -22,34 +17,15 @@ export declare const ListPropTypes: {
         isCustom: PropTypes.Requireable<boolean>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
     }> | null | undefined)[]>;
+    titleNoSkills: PropTypes.Requireable<string>;
+    textNoSkills: PropTypes.Requireable<string>;
+    iconSkillAriaLabel: PropTypes.Requireable<string>;
 };
-export declare type SkillProps = {
-    title: string;
-    info: string;
-};
-export declare type ItemProps = {
-    item: {
-        title: string;
-        info: string;
-    };
-};
-export declare type NoSkillsProps = {
-    titleNoSkills: string;
-    textNoSkills: string;
-};
-export declare type ListSkillsProps = {
-    skillTitle: string;
-    isCustom: boolean;
+export default propTypes;
+export declare type ReviewSkillsProps = NoSkillsProps & ReviewSkills & {
     'aria-label': string;
-    skillAriaLabel: string;
-    buttonLabel: string;
-    buttonAriaLabel: string;
-    reviseLabel: string;
-    reviseAriaLabel: string;
-    onClick: () => void;
-};
-export declare type SkillsProps = {
     title: string;
-    listSkills: Array<ListSkillsProps>;
+    isLoading: boolean;
+    isLoadingAriaLabel: string;
 };
 //# sourceMappingURL=prop-types.d.ts.map

package/es/template/app-review/skills/prop-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../../src/template/app-review/skills/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAGnC,eAAO,MAAM,eAAe;;;CAG3B,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;CAM1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;;;;;;;CAEzB,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,oBAAY,SAAS,GAAG;IACtB,IAAI,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,CAAC;CACrC,CAAC;AAEF,oBAAY,aAAa,GAAG;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,oBAAY,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC;CACpC,CAAC"}
+{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../../src/template/app-review/skills/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,aAAa,EAAC,MAAM,+CAA+C,CAAC;AAC5E,OAAO,EAAC,YAAY,EAAC,MAAM,4CAA4C,CAAC;AAExE,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CASd,CAAC;AAEF,eAAe,SAAS,CAAC;AAEzB,oBAAY,iBAAiB,GAAG,aAAa,GAC3C,YAAY,GAAG;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,MAAM,CAAC;CAC5B,CAAC"}

package/es/template/app-review/skills/prop-types.js

@@ -1,17 +1,14 @@
 import PropTypes from 'prop-types';
-import { ListSkillsPropTypes } from '../../../organism/review-skills/prop-types';
-export const SkillPropsTypes = {
+import SkillCardPropsType from '../../../molecule/skill-card/prop-types';
+const propTypes = {
+  'aria-label': PropTypes.string,
   title: PropTypes.string,
-  info: PropTypes.string
-};
-export const ItemPropsTypes = {
-  item: PropTypes.shape({
-    title: PropTypes.string,
-    info: PropTypes.string,
-    isExtraSpace: PropTypes.bool
-  })
-};
-export const ListPropTypes = {
-  skills: ListSkillsPropTypes.listSkills
+  isLoading: PropTypes.bool,
+  isLoadingAriaLabel: PropTypes.string,
+  listSkills: PropTypes.arrayOf(PropTypes.shape(SkillCardPropsType)),
+  titleNoSkills: PropTypes.string,
+  textNoSkills: PropTypes.string,
+  iconSkillAriaLabel: PropTypes.string
 };
+export default propTypes;
 //# sourceMappingURL=prop-types.js.map

package/es/template/app-review/skills/prop-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"prop-types.js","names":["PropTypes","ListSkillsPropTypes","SkillPropsTypes","title","string","info","ItemPropsTypes","item","shape","isExtraSpace","bool","ListPropTypes","skills","listSkills"],"sources":["../../../../src/template/app-review/skills/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {ListSkillsPropTypes} from '../../../organism/review-skills/prop-types';\n\nexport const SkillPropsTypes = {\n  title: PropTypes.string,\n  info: PropTypes.string\n};\n\nexport const ItemPropsTypes = {\n  item: PropTypes.shape({\n    title: PropTypes.string,\n    info: PropTypes.string,\n    isExtraSpace: PropTypes.bool\n  })\n};\n\nexport const ListPropTypes = {\n  skills: ListSkillsPropTypes.listSkills\n};\n\nexport type SkillProps = {\n  title: string;\n  info: string;\n};\n\nexport type ItemProps = {\n  item: {title: string; info: string};\n};\n\nexport type NoSkillsProps = {\n  titleNoSkills: string;\n  textNoSkills: string;\n};\n\nexport type ListSkillsProps = {\n  skillTitle: string;\n  isCustom: boolean;\n  'aria-label': string;\n  skillAriaLabel: string;\n  buttonLabel: string;\n  buttonAriaLabel: string;\n  reviseLabel: string;\n  reviseAriaLabel: string;\n  onClick: () => void;\n};\n\nexport type SkillsProps = {\n  title: string;\n  listSkills: Array<ListSkillsProps>;\n};\n"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AACA,SAAQC,mBAAR,QAAkC,4CAAlC;AAEA,OAAO,MAAMC,eAAe,GAAG;EAC7BC,KAAK,EAAEH,SAAS,CAACI,MADY;EAE7BC,IAAI,EAAEL,SAAS,CAACI;AAFa,CAAxB;AAKP,OAAO,MAAME,cAAc,GAAG;EAC5BC,IAAI,EAAEP,SAAS,CAACQ,KAAV,CAAgB;IACpBL,KAAK,EAAEH,SAAS,CAACI,MADG;IAEpBC,IAAI,EAAEL,SAAS,CAACI,MAFI;IAGpBK,YAAY,EAAET,SAAS,CAACU;EAHJ,CAAhB;AADsB,CAAvB;AAQP,OAAO,MAAMC,aAAa,GAAG;EAC3BC,MAAM,EAAEX,mBAAmB,CAACY;AADD,CAAtB"}
+{"version":3,"file":"prop-types.js","names":["PropTypes","SkillCardPropsType","propTypes","string","title","isLoading","bool","isLoadingAriaLabel","listSkills","arrayOf","shape","titleNoSkills","textNoSkills","iconSkillAriaLabel"],"sources":["../../../../src/template/app-review/skills/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport SkillCardPropsType from '../../../molecule/skill-card/prop-types';\nimport {NoSkillsProps} from '../../../organism/review-no-skills/prop-types';\nimport {ReviewSkills} from '../../../organism/review-skills/prop-types';\n\nconst propTypes = {\n  'aria-label': PropTypes.string,\n  title: PropTypes.string,\n  isLoading: PropTypes.bool,\n  isLoadingAriaLabel: PropTypes.string,\n  listSkills: PropTypes.arrayOf(PropTypes.shape(SkillCardPropsType)),\n  titleNoSkills: PropTypes.string,\n  textNoSkills: PropTypes.string,\n  iconSkillAriaLabel: PropTypes.string\n};\n\nexport default propTypes;\n\nexport type ReviewSkillsProps = NoSkillsProps &\n  ReviewSkills & {\n    'aria-label': string;\n    title: string;\n    isLoading: boolean;\n    isLoadingAriaLabel: string;\n  };\n"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,YAAtB;AACA,OAAOC,kBAAP,MAA+B,yCAA/B;AAIA,MAAMC,SAAS,GAAG;EAChB,cAAcF,SAAS,CAACG,MADR;EAEhBC,KAAK,EAAEJ,SAAS,CAACG,MAFD;EAGhBE,SAAS,EAAEL,SAAS,CAACM,IAHL;EAIhBC,kBAAkB,EAAEP,SAAS,CAACG,MAJd;EAKhBK,UAAU,EAAER,SAAS,CAACS,OAAV,CAAkBT,SAAS,CAACU,KAAV,CAAgBT,kBAAhB,CAAlB,CALI;EAMhBU,aAAa,EAAEX,SAAS,CAACG,MANT;EAOhBS,YAAY,EAAEZ,SAAS,CAACG,MAPR;EAQhBU,kBAAkB,EAAEb,SAAS,CAACG;AARd,CAAlB;AAWA,eAAeD,SAAf"}

package/es/template/app-review/skills/style.css

@@ -0,0 +1,49 @@
+@value breakpoints: "../../../variables/breakpoints.css";
+@value mobile from breakpoints;
+@value colors: "../../../variables/colors.css";
+@value cm_blue_900 from colors;
+@value cm_grey_500 from colors;
+
+.textBase {
+  color: cm_blue_900;
+  font-family: "Gilroy";
+  font-style: normal;
+  user-select: none;
+}
+
+.containerReviewSkill {
+  width: 100%;
+  position: relative;
+}
+
+.title {
+  composes: textBase;
+  font-size: 20px;
+  font-weight: 600;
+  line-height: 28px;
+  margin-left: 40px;
+}
+
+.informationIcon {
+  color: cm_grey_500;
+  padding-left: 8px;
+}
+
+.loaderContainer {
+  width: 100%;
+  height: 50vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.loader {
+  height: 60px;
+  width: 60px;
+}
+
+@media mobile {  
+  .title {
+  margin-left: 0;
+  }
+}

package/es/template/review-dashboard-skills/index.d.ts

@@ -27,9 +27,10 @@ declare namespace ReviewDashboardSkills {
             }>>;
         }>>;
         reviewSkills: PropTypes.Requireable<PropTypes.InferProps<{
-            titleNoSkills: PropTypes.Requireable<string>;
-            textNoSkills: PropTypes.Requireable<string>;
-            iconSkillAriaLabel: PropTypes.Requireable<string>;
+            'aria-label': PropTypes.Requireable<string>;
+            title: PropTypes.Requireable<string>;
+            isLoading: PropTypes.Requireable<boolean>;
+            isLoadingAriaLabel: PropTypes.Requireable<string>;
             listSkills: PropTypes.Requireable<(PropTypes.InferProps<{
                 'aria-label': PropTypes.Requireable<string>;
                 skillTitle: PropTypes.Requireable<string>;
@@ -41,10 +42,9 @@ declare namespace ReviewDashboardSkills {
                 isCustom: PropTypes.Requireable<boolean>;
                 onClick: PropTypes.Requireable<(...args: any[]) => any>;
             }> | null | undefined)[]>;
-            'aria-label': PropTypes.Requireable<string>;
-            title: PropTypes.Validator<string>;
-            isLoading: PropTypes.Requireable<boolean>;
-            isLoadingAriaLabel: PropTypes.Requireable<string>;
+            titleNoSkills: PropTypes.Requireable<string>;
+            textNoSkills: PropTypes.Requireable<string>;
+            iconSkillAriaLabel: PropTypes.Requireable<string>;
         }>>;
     };
 }

package/es/template/review-dashboard-skills/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import ReviewPresentation from '../../atom/review-presentation';
-import ReviewSkills from '../../organism/review-skills';
+import ReviewSkills from '../app-review/skills';
 import style from './style.css';
 
 const ReviewDashboardSkills = props => {

package/es/template/review-dashboard-skills/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","ReviewPresentation","ReviewSkills","style","ReviewDashboardSkills","props","ariaLabel","reviewPresentation","reviewSkills","reviewDashboardContainer","reviewPresentationContainer","reviewSkillsContainer","propTypes","string","shape"],"sources":["../../../src/template/review-dashboard-skills/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ReviewPresentation from '../../atom/review-presentation';\nimport ReviewSkills from '../../organism/review-skills';\nimport style from './style.css';\n\nconst ReviewDashboardSkills = props => {\n  const {'aria-label': ariaLabel, reviewPresentation, reviewSkills} = props;\n\n  return (\n    <div className={style.reviewDashboardContainer} aria-label={ariaLabel}>\n      <div className={style.reviewPresentationContainer}>\n        <ReviewPresentation {...reviewPresentation} />\n      </div>\n      <div className={style.reviewSkillsContainer}>\n        <ReviewSkills {...reviewSkills} />\n      </div>\n    </div>\n  );\n};\n\nReviewDashboardSkills.propTypes = {\n  'aria-label': PropTypes.string,\n  reviewPresentation: PropTypes.shape(ReviewPresentation.propTypes),\n  reviewSkills: PropTypes.shape(ReviewSkills.propTypes)\n};\nexport default ReviewDashboardSkills;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,kBAAP,MAA+B,gCAA/B;AACA,OAAOC,YAAP,MAAyB,8BAAzB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,qBAAqB,GAAGC,KAAK,IAAI;EACrC,MAAM;IAAC,cAAcC,SAAf;IAA0BC,kBAA1B;IAA8CC;EAA9C,IAA8DH,KAApE;EAEA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACM,wBAAtB;IAAgD,cAAYH;EAA5D,gBACE;IAAK,SAAS,EAAEH,KAAK,CAACO;EAAtB,gBACE,oBAAC,kBAAD,EAAwBH,kBAAxB,CADF,CADF,eAIE;IAAK,SAAS,EAAEJ,KAAK,CAACQ;EAAtB,gBACE,oBAAC,YAAD,EAAkBH,YAAlB,CADF,CAJF,CADF;AAUD,CAbD;;AAeAJ,qBAAqB,CAACQ,SAAtB,2CAAkC;EAChC,cAAcZ,SAAS,CAACa,MADQ;EAEhCN,kBAAkB,EAAEP,SAAS,CAACc,KAAV,CAAgBb,kBAAkB,CAACW,SAAnC,CAFY;EAGhCJ,YAAY,EAAER,SAAS,CAACc,KAAV,CAAgBZ,YAAY,CAACU,SAA7B;AAHkB,CAAlC;AAKA,eAAeR,qBAAf"}
+{"version":3,"file":"index.js","names":["React","PropTypes","ReviewPresentation","ReviewSkills","style","ReviewDashboardSkills","props","ariaLabel","reviewPresentation","reviewSkills","reviewDashboardContainer","reviewPresentationContainer","reviewSkillsContainer","propTypes","string","shape"],"sources":["../../../src/template/review-dashboard-skills/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ReviewPresentation from '../../atom/review-presentation';\nimport ReviewSkills from '../app-review/skills';\nimport style from './style.css';\n\nconst ReviewDashboardSkills = props => {\n  const {'aria-label': ariaLabel, reviewPresentation, reviewSkills} = props;\n\n  return (\n    <div className={style.reviewDashboardContainer} aria-label={ariaLabel}>\n      <div className={style.reviewPresentationContainer}>\n        <ReviewPresentation {...reviewPresentation} />\n      </div>\n      <div className={style.reviewSkillsContainer}>\n        <ReviewSkills {...reviewSkills} />\n      </div>\n    </div>\n  );\n};\n\nReviewDashboardSkills.propTypes = {\n  'aria-label': PropTypes.string,\n  reviewPresentation: PropTypes.shape(ReviewPresentation.propTypes),\n  reviewSkills: PropTypes.shape(ReviewSkills.propTypes)\n};\nexport default ReviewDashboardSkills;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,kBAAP,MAA+B,gCAA/B;AACA,OAAOC,YAAP,MAAyB,sBAAzB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,qBAAqB,GAAGC,KAAK,IAAI;EACrC,MAAM;IAAC,cAAcC,SAAf;IAA0BC,kBAA1B;IAA8CC;EAA9C,IAA8DH,KAApE;EAEA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACM,wBAAtB;IAAgD,cAAYH;EAA5D,gBACE;IAAK,SAAS,EAAEH,KAAK,CAACO;EAAtB,gBACE,oBAAC,kBAAD,EAAwBH,kBAAxB,CADF,CADF,eAIE;IAAK,SAAS,EAAEJ,KAAK,CAACQ;EAAtB,gBACE,oBAAC,YAAD,EAAkBH,YAAlB,CADF,CAJF,CADF;AAUD,CAbD;;AAeAJ,qBAAqB,CAACQ,SAAtB,2CAAkC;EAChC,cAAcZ,SAAS,CAACa,MADQ;EAEhCN,kBAAkB,EAAEP,SAAS,CAACc,KAAV,CAAgBb,kBAAkB,CAACW,SAAnC,CAFY;EAGhCJ,YAAY,EAAER,SAAS,CAACc,KAAV,CAAgBZ,YAAY,CAACU,SAA7B;AAHkB,CAAlC;AAKA,eAAeR,qBAAf"}

package/es/template/review-dashboard-skills/style.css

@@ -7,7 +7,6 @@
   margin: 48px 24px 48px 64px;
   position: relative;
   box-sizing: border-box;
-  overflow: auto;
   height: 100%;
 }
 
@@ -17,7 +16,7 @@
   max-width: 348px;
   min-width: 348px;
   position: sticky;
-  top: 0;
+  top: 80px;
 }
 
 .reviewSkillsContainer {

package/lib/atom/provider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/provider/index.js"],"names":[],"mappings":";;;AAqGA,4DAOC;AApDD;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAQE;IAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAKE;IAEF;;;;MAQC;IAED,sCAKC;IADC;;;;;MAA+D;IAGjE;;;;;MAEC;CAMF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/provider/index.js"],"names":[],"mappings":";;;AAqGA,4DAMC;AAnDD;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAQE;IAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAKE;IAEF;;;;MAQC;IAED,sCAKC;IADC;;;;;MAA+D;IAGjE;;;;;MAEC;CAMF"}

package/lib/atom/provider/index.js

@@ -139,10 +139,6 @@ Provider.propTypes = process.env.NODE_ENV !== "production" ? {
 const GetSkinFromContext = legacyContext => {
   const context = (0, _webContext.useWebContext)();
   const legacySkin = (0, _get2.default)('skin', legacyContext);
-  console.log('GetSkinFromContext', {
-    context,
-    skin: (0, _get2.default)('skin', context)
-  });
   const skin = (0, _getOr2.default)(legacySkin, 'skin', context);
   return skin;
 };

package/lib/atom/provider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["DEFAULT_SKIN","common","good","bad","primary","life","brand","primaryAdd1","primaryAdd2","primaryAdd3","primaryAdd4","xtraLightGrey","light","medium","dark","grey","orangeAdd","orange","positive","lightGreen","negative","battle","white","black","mergeSkin","skin","historyShape","PropTypes","shape","createHref","func","push","skinShape","objectOf","ColorPropType","images","SrcPropType","logo","login","icons","HexPropType","mod","courses","arrayOf","texts","translateShape","Provider","React","Component","getDerivedStateFromProps","props","history","translate","constructor","context","Vimeo","state","getChildContext","render","children","Children","only","childContextTypes","isRequired","object","propTypes","node","GetSkinFromContext","legacyContext","useWebContext","legacySkin","console","log"],"sources":["../../../src/atom/provider/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {defaultsDeep, get, getOr} from 'lodash/fp';\nimport {SrcPropType, ColorPropType, HexPropType} from '../../util/proptypes';\nimport WebContext, {useWebContext} from './web-context';\n\nconst DEFAULT_SKIN = {\n  common: {\n    good: '#24b694',\n    bad: '#ed1c24',\n    primary: '#00B0FF',\n    life: '#ed1c24',\n    brand: '#00B0FF',\n    primaryAdd1: '#B3E5FC',\n    primaryAdd2: '#0091EA',\n    primaryAdd3: '#0277BD',\n    primaryAdd4: '#015798',\n    xtraLightGrey: '#FAFAFA',\n    light: '#ECEFF1',\n    medium: '#90A4AE',\n    dark: '#546E7A',\n    grey: '#607D8B',\n    orangeAdd: '#FF7043',\n    orange: '#FFA000',\n    positive: '#3EC483',\n    lightGreen: '#66BB6A',\n    negative: '#F73F52',\n    battle: '#FFE100',\n    white: '#FFFFFF',\n    black: '#14171A'\n  }\n};\n\nconst mergeSkin = (skin = {}) => defaultsDeep(DEFAULT_SKIN, skin);\n\nconst historyShape = PropTypes.shape({\n  createHref: PropTypes.func,\n  push: PropTypes.func\n});\n\nconst skinShape = PropTypes.shape({\n  common: PropTypes.objectOf(ColorPropType),\n  images: PropTypes.shape({\n    'logo-mobile': SrcPropType,\n    logo: SrcPropType,\n    'logo-email': SrcPropType,\n    login: SrcPropType\n  }),\n  icons: PropTypes.objectOf(HexPropType),\n  mod: PropTypes.objectOf(ColorPropType),\n  courses: PropTypes.arrayOf(ColorPropType),\n  texts: PropTypes.objectOf(ColorPropType)\n});\n\nconst translateShape = PropTypes.func;\n\nclass Provider extends React.Component {\n  static propTypes = {\n    history: historyShape,\n    skin: skinShape,\n    translate: translateShape,\n    children: PropTypes.node.isRequired,\n    Vimeo: PropTypes.shape({\n      common: PropTypes.func\n    })\n  };\n\n  static childContextTypes = {\n    history: historyShape,\n    skin: skinShape,\n    translate: translateShape.isRequired,\n    Vimeo: PropTypes.object\n  };\n\n  static getDerivedStateFromProps(props) {\n    const {history, skin, translate} = props;\n\n    return {\n      history,\n      skin: mergeSkin(skin),\n      translate\n    };\n  }\n\n  constructor(props, context) {\n    super(props, context);\n    const {history, skin, translate, Vimeo} = props;\n    // eslint-disable-next-line react/no-unused-state\n    this.state = {history, skin: mergeSkin(skin), translate, Vimeo};\n  }\n\n  getChildContext() {\n    return this.state;\n  }\n\n  render() {\n    const {children} = this.props;\n    return React.Children.only(children);\n  }\n}\n\nconst GetSkinFromContext = legacyContext => {\n  const context = useWebContext();\n  const legacySkin = get('skin', legacyContext);\n  console.log('GetSkinFromContext', {context, skin: get('skin', context)});\n  const skin = getOr(legacySkin, 'skin', context);\n\n  return skin;\n};\n\nexport {WebContext, useWebContext, GetSkinFromContext};\nexport default Provider;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["DEFAULT_SKIN","common","good","bad","primary","life","brand","primaryAdd1","primaryAdd2","primaryAdd3","primaryAdd4","xtraLightGrey","light","medium","dark","grey","orangeAdd","orange","positive","lightGreen","negative","battle","white","black","mergeSkin","skin","historyShape","PropTypes","shape","createHref","func","push","skinShape","objectOf","ColorPropType","images","SrcPropType","logo","login","icons","HexPropType","mod","courses","arrayOf","texts","translateShape","Provider","React","Component","getDerivedStateFromProps","props","history","translate","constructor","context","Vimeo","state","getChildContext","render","children","Children","only","childContextTypes","isRequired","object","propTypes","node","GetSkinFromContext","legacyContext","useWebContext","legacySkin"],"sources":["../../../src/atom/provider/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {defaultsDeep, get, getOr} from 'lodash/fp';\nimport {SrcPropType, ColorPropType, HexPropType} from '../../util/proptypes';\nimport WebContext, {useWebContext} from './web-context';\n\nconst DEFAULT_SKIN = {\n  common: {\n    good: '#24b694',\n    bad: '#ed1c24',\n    primary: '#00B0FF',\n    life: '#ed1c24',\n    brand: '#00B0FF',\n    primaryAdd1: '#B3E5FC',\n    primaryAdd2: '#0091EA',\n    primaryAdd3: '#0277BD',\n    primaryAdd4: '#015798',\n    xtraLightGrey: '#FAFAFA',\n    light: '#ECEFF1',\n    medium: '#90A4AE',\n    dark: '#546E7A',\n    grey: '#607D8B',\n    orangeAdd: '#FF7043',\n    orange: '#FFA000',\n    positive: '#3EC483',\n    lightGreen: '#66BB6A',\n    negative: '#F73F52',\n    battle: '#FFE100',\n    white: '#FFFFFF',\n    black: '#14171A'\n  }\n};\n\nconst mergeSkin = (skin = {}) => defaultsDeep(DEFAULT_SKIN, skin);\n\nconst historyShape = PropTypes.shape({\n  createHref: PropTypes.func,\n  push: PropTypes.func\n});\n\nconst skinShape = PropTypes.shape({\n  common: PropTypes.objectOf(ColorPropType),\n  images: PropTypes.shape({\n    'logo-mobile': SrcPropType,\n    logo: SrcPropType,\n    'logo-email': SrcPropType,\n    login: SrcPropType\n  }),\n  icons: PropTypes.objectOf(HexPropType),\n  mod: PropTypes.objectOf(ColorPropType),\n  courses: PropTypes.arrayOf(ColorPropType),\n  texts: PropTypes.objectOf(ColorPropType)\n});\n\nconst translateShape = PropTypes.func;\n\nclass Provider extends React.Component {\n  static propTypes = {\n    history: historyShape,\n    skin: skinShape,\n    translate: translateShape,\n    children: PropTypes.node.isRequired,\n    Vimeo: PropTypes.shape({\n      common: PropTypes.func\n    })\n  };\n\n  static childContextTypes = {\n    history: historyShape,\n    skin: skinShape,\n    translate: translateShape.isRequired,\n    Vimeo: PropTypes.object\n  };\n\n  static getDerivedStateFromProps(props) {\n    const {history, skin, translate} = props;\n\n    return {\n      history,\n      skin: mergeSkin(skin),\n      translate\n    };\n  }\n\n  constructor(props, context) {\n    super(props, context);\n    const {history, skin, translate, Vimeo} = props;\n    // eslint-disable-next-line react/no-unused-state\n    this.state = {history, skin: mergeSkin(skin), translate, Vimeo};\n  }\n\n  getChildContext() {\n    return this.state;\n  }\n\n  render() {\n    const {children} = this.props;\n    return React.Children.only(children);\n  }\n}\n\nconst GetSkinFromContext = legacyContext => {\n  const context = useWebContext();\n  const legacySkin = get('skin', legacyContext);\n  const skin = getOr(legacySkin, 'skin', context);\n\n  return skin;\n};\n\nexport {WebContext, useWebContext, GetSkinFromContext};\nexport default Provider;\n"],"mappings":"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"}

package/lib/atom/review-presentation/style.css

@@ -86,11 +86,11 @@
   opacity: 0;
   transition: opacity 0.8s;
   position: absolute;
-  width: 103px;
   height: auto;
+  width: 200px;
   border-radius: 7px;
   background-color: cm_grey_700;
-  right: -42px;
+  right: -81px;
   bottom: 32px;
 }
 
@@ -113,7 +113,6 @@
   composes: textBase;
   font-weight: 500;
   font-size: 14px;
-  line-height: 20px;
   display: inline-block;
   border-radius: 3px;
   word-wrap: break-word;

package/lib/molecule/cm-popin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/index.js"],"names":[],"mappings":";AAcA,kDA0KC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/index.js"],"names":[],"mappings":";AAcA,kDAgLC"}

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

@@ -129,7 +129,7 @@ const CMPopin = props => {
     size: "small",
     icon: "close"
   }) : null), /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.titleContainer
+    className: mode === 'cookie' || mode === 'information' ? _style.default.cookieTitleContainer : _style.default.titleContainer
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.contentSection
   }, LogoComponent ? /*#__PURE__*/_react.default.createElement(LogoComponent, {