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

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

@@ -1 +1 @@
-{"version":3,"file":"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"],"sources":["../../../src/molecule/cm-popin/index.js"],"sourcesContent":["import React from 'react';\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';\nimport propTypes from './types';\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 = propTypes;\n\nexport default CMPopin;\n"],"mappings":"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"}
+{"version":3,"file":"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","cookieTitleContainer","titleContainer","contentSection","message","__html","descriptionBtn","buttonContainer","largeButton","button","label","handleOnclick","customStyle","propTypes"],"sources":["../../../src/molecule/cm-popin/index.js"],"sourcesContent":["import React from 'react';\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';\nimport propTypes from './types';\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\n          className={\n            mode === 'cookie' || mode === 'information'\n              ? style.cookieTitleContainer\n              : style.titleContainer\n          }\n        >\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 = propTypes;\n\nexport default CMPopin;\n"],"mappings":";;;;;AAAA;;AACA;;AAMA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAGC,KAAK,IAAI;EACvB,MAAM;IACJC,OADI;IAEJC,IAAI,GAAG,OAFH;IAGJC,WAHI;IAIJC,YAJI;IAKJC,OALI;IAMJC,MANI;IAOJC,IAPI;IAQJC,kBARI;IASJC,eATI;IAUJC,WAVI;IAWJC,WAXI;IAYJC,iBAZI;IAaJC;EAbI,IAcFb,KAdJ;EAgBA,MAAMc,IAAI,GAAG;IACXC,YAAY,EAAZA,0DADW;IAEXC,YAAY,EAAZA,6CAFW;IAGXC,UAAU,EAAVA;EAHW,CAAb;EAKA,MAAMC,aAAa,GAAGJ,IAAI,CAACP,IAAD,CAA1B;EAEA,MAAMY,oBAAoB,GAAGX,kBAAkB,GAC3C;IACEY,eAAe,EAAG,OAAMZ,kBAAmB,GAD7C;IAEEa,cAAc,EAAE;EAFlB,CAD2C,GAK3C,IALJ;;EAMA,MAAMC,YAAY,GAAG,MAAM;IACzB,IAAIhB,MAAJ,EAAY,oBAAO;MAAK,SAAS,EAAEiB,cAAA,CAAMC,gBAAtB;MAAwC,GAAG,EAAElB;IAA7C,EAAP;IACZ,IAAIJ,IAAI,KAAK,QAAb,EACE,oBACE;MAAK,SAAS,EAAEqB,cAAA,CAAME;IAAtB,gBACE;MAAK,SAAS,EAAEF,cAAA,CAAMG;IAAtB,gBACE,6BAAC,iCAAD;MAAQ,SAAS,EAAEH,cAAA,CAAMI;IAAzB,EADF,CADF,eAIE;MAAK,SAAS,EAAEJ,cAAA,CAAMZ;IAAtB,GAAoCA,WAApC,CAJF,CADF;IAQF,OAAO,IAAP;EACD,CAZD;;EAaA,MAAMiB,iBAAiB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;IAC5C,QAAQD,KAAR;MACE,KAAK,CAAL;QACE,OAAON,cAAA,CAAMQ,uBAAb;;MACF,KAAKD,OAAO,CAACE,MAAR,GAAiB,CAAtB;QACE,OAAOT,cAAA,CAAMU,sBAAb;;MACF;QACE,OAAOV,cAAA,CAAMW,qBAAb;IANJ;EAQD,CATD;;EAUA,MAAMC,eAAe,GAAG,MAAM;IAC5B,OAAOC,YAAA,CAAIC,OAAJ,CAAY;MAACC,GAAG,EAAE;IAAN,CAAZ,EAA0B,CAACC,EAAD,EAAKV,KAAL,KAAe;MAC9C,MAAM;QACJW,IADI;QAEJC,KAFI;QAGJC,KAHI;QAIJC,QAJI;QAKJC,aALI;QAMJC,KANI;QAOJC,OAPI;QAQJC,iBARI;QASJC,QATI;QAUJC,EAVI;QAWJ,aAAaC;MAXT,IAYFX,EAZJ;MAaA,oBACE;QAAK,GAAG,EAAEV,KAAV;QAAiB,SAAS,EAAED,iBAAiB,CAACC,KAAD,EAAQhB,aAAR;MAA7C,gBACE,6BAAC,oBAAD;QAEI2B,IAFJ;QAGIC,KAHJ;QAIIC,KAJJ;QAKIC,QALJ;QAMIC,aANJ;QAOIC,KAPJ;QAQIC,OARJ;QASIC,iBATJ;QAUIC,QAVJ;QAWIC,EAXJ;QAYI,aAAaC;MAZjB,EADF,CADF;IAmBD,CAjCM,EAiCJrC,aAjCI,CAAP;EAkCD,CAnCD;;EAoCA,oBACE;IACE,SAAS,EAAEX,IAAI,KAAK,QAAT,GAAoBqB,cAAA,CAAM4B,UAA1B,GAAuC,IADpD;IAEE,KAAK,EAAEhC,oBAFT;IAGE,aAAW;EAHb,gBAKE;IAAK,SAAS,EAAEjB,IAAI,KAAK,QAAT,GAAoBqB,cAAA,CAAM6B,WAA1B,GAAwC7B,cAAA,CAAM8B;EAA9D,gBACE;IAAQ,SAAS,EAAE9B,cAAA,CAAM+B;EAAzB,GACGhC,YAAY,EADf,EAEGjB,OAAO,gBACN,6BAAC,2BAAD;IACE,OAAO,EAAEA,OADX;IAEE,aAAW,YAFb;IAGE,cAAY,YAHd;IAIE,IAAI,EAAC,OAJP;IAKE,IAAI,EAAC;EALP,EADM,GAQJ,IAVN,CADF,eAaE;IACE,SAAS,EACPH,IAAI,KAAK,QAAT,IAAqBA,IAAI,KAAK,aAA9B,GACIqB,cAAA,CAAMgC,oBADV,GAEIhC,cAAA,CAAMiC;EAJd,gBAOE;IAAK,SAAS,EAAEjC,cAAA,CAAMkC;EAAtB,GACGvC,aAAa,gBAAG,6BAAC,aAAD;IAAe,SAAS,EAAEK,cAAA,CAAMhB;EAAhC,EAAH,GAA8C,IAD9D,EAEGN,OAAO,gBACN;IACE,SAAS,EAAEC,IAAI,KAAK,OAAT,GAAmBqB,cAAA,CAAMtB,OAAzB,GAAmCsB,cAAA,CAAMmC,OADtD;IAEE,aAAW,kBAFb,CAGE;IAHF;IAIE,uBAAuB,EAAE;MAACC,MAAM,EAAE1D;IAAT;EAJ3B,EADM,GAOJ,IATN,CAPF,EAkBGQ,eAAe,gBACd;IACE,SAAS,EAAEc,cAAA,CAAMd,eADnB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACkD,MAAM,EAAElD;IAAT;EAH3B,EADc,GAMZ,IAxBN,CAbF,EAuCGG,iBAAiB,gBAAG;IAAK,SAAS,EAAEW,cAAA,CAAMqC;EAAtB,GAAuChD,iBAAvC,CAAH,GAAqE,IAvCzF,EAwCGuB,eAAe,EAxClB,eAyCE;IAAK,SAAS,EAAEZ,cAAA,CAAMsC;EAAtB,GACG1D,WAAW,gBACV;IAAK,SAAS,EAAEA,WAAW,CAAC2D,WAAZ,GAA0BvC,cAAA,CAAMuC,WAAhC,GAA8CvC,cAAA,CAAMwC;EAApE,gBACE,6BAAC,mBAAD;IACE,KAAK,EAAE5D,WAAW,CAAC6D,KADrB;IAEE,OAAO,EAAE7D,WAAW,CAAC8D,aAFvB;IAGE,aAAW,cAHb;IAIE,cAAY9D,WAAW,CAAC,YAAD,CAJzB;IAKE,IAAI,EAAEA,WAAW,CAACqC,IALpB;IAME,WAAW,EAAErC,WAAW,CAAC+D;EAN3B,EADF,CADU,GAWR,IAZN,EAaG9D,YAAY,gBACX;IAAK,SAAS,EAAEA,YAAY,CAAC0D,WAAb,GAA2BvC,cAAA,CAAMuC,WAAjC,GAA+CvC,cAAA,CAAMwC;EAArE,gBACE,6BAAC,mBAAD;IACE,KAAK,EAAE3D,YAAY,CAAC4D,KADtB;IAEE,OAAO,EAAE5D,YAAY,CAAC6D,aAFxB;IAGE,aAAY,gBAAe7D,YAAY,CAACoC,IAAK,EAH/C;IAIE,cAAYpC,YAAY,CAAC,YAAD,CAJ1B;IAKE,IAAI,EAAEA,YAAY,CAACoC;EALrB,EADF,CADW,GAUT,IAvBN,EAwBG9B,WAAW,gBACV;IAAK,SAAS,EAAEA,WAAW,CAACoD,WAAZ,GAA0BvC,cAAA,CAAMuC,WAAhC,GAA8CvC,cAAA,CAAMwC;EAApE,gBACE,6BAAC,mBAAD;IACE,KAAK,EAAErD,WAAW,CAACsD,KADrB;IAEE,OAAO,EAAEtD,WAAW,CAACuD,aAFvB;IAGE,aAAY,gBAAevD,WAAW,CAAC8B,IAAK,EAH9C;IAIE,cAAY9B,WAAW,CAAC,YAAD,CAJzB;IAKE,IAAI,EAAEA,WAAW,CAAC8B,IALpB;IAME,WAAW,EAAE9B,WAAW,CAACwD;EAN3B,EADF,CADU,GAWR,IAnCN,CAzCF,CALF,CADF;AAuFD,CAhLD;;AAkLAnE,OAAO,CAACoE,SAAR,2CAAoBA,cAApB;eAEepE,O"}

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

@@ -48,7 +48,6 @@
 .popin {
   overflow: auto;
   width: 500px;
-  height: 414px;
   flex-grow: 0;
   margin: 16px;
   padding: 16px 16px 20px 16px;
@@ -150,7 +149,16 @@
   white-space: pre-line;
   margin-top: 0px;
 }
+
+.cookieTitleContainer {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
 .titleContainer {
+  padding-top: 40px;
   align-items: center;
   display: flex;
   flex-direction: column;

package/lib/molecule/review-correction-popin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/index.js"],"names":[],"mappings":";AAgCA,gEAgDC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-correction-popin/index.js"],"names":[],"mappings":";AAoCA,gEAmDC"}

package/lib/molecule/review-correction-popin/index.js

@@ -36,9 +36,13 @@ const buildKlfButton = klf => {
     className: _style.default.klfButton
   }))), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.toolTip
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.tooltipText
-  }, klf.tooltip)));
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: _style.default.tooltipText // eslint-disable-next-line react/no-danger
+    ,
+    dangerouslySetInnerHTML: {
+      __html: klf.tooltip
+    }
+  })));
 };
 
 const ReviewCorrectionPopin = props => {
@@ -87,8 +91,12 @@ const ReviewCorrectionPopin = props => {
     "aria-label": information.label
   }, information.label)), /*#__PURE__*/_react.default.createElement("span", {
     className: _style.default.message,
-    "aria-label": information.message
-  }, information.message))), /*#__PURE__*/_react.default.createElement("div", {
+    "aria-label": information.message // eslint-disable-next-line react/no-danger
+    ,
+    dangerouslySetInnerHTML: {
+      __html: information.message
+    }
+  }))), /*#__PURE__*/_react.default.createElement("div", {
     className: type === 'right' ? _style.default.actions : _style.default.actionsWrong
   }, cta, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.nextQuestionContainer

package/lib/molecule/review-correction-popin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["buildKlfButton","klf","klfButtonProps","icon","position","type","style","klfContainer","klfButtonContainer","klfButton","toolTip","tooltipText","tooltip","ReviewCorrectionPopin","props","information","resultLabel","next","nextQuestionButtonProps","cta","ICONS","right","RightIcon","wrong","WrongIcon","Icon","wrapper","classnames","popin","correctionSection","iconCircle","iconRight","iconWrong","feedbackSection","labelContainer","label","message","actions","actionsWrong","nextQuestionContainer","nextQuestionButton","propTypes"],"sources":["../../../src/molecule/review-correction-popin/index.js"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst buildKlfButton = klf => {\n  const klfButtonProps = {\n    ...klf,\n    icon: {\n      position: 'left',\n      type: 'key'\n    },\n    type: 'primary'\n  };\n\n  return (\n    <div className={style.klfContainer}>\n      <div className={style.klfButtonContainer}>\n        <ButtonLink {...klfButtonProps} className={style.klfButton} />\n      </div>\n      <div className={style.toolTip}>\n        <div className={style.tooltipText}>{klf.tooltip}</div>\n      </div>\n    </div>\n  );\n};\n\nconst ReviewCorrectionPopin = props => {\n  const {information, resultLabel, type, klf, next} = props;\n\n  const nextQuestionButtonProps = {\n    ...next,\n    type: 'primary'\n  };\n\n  const cta = type === 'wrong' ? buildKlfButton(klf) : null;\n\n  const ICONS = {\n    right: RightIcon,\n    wrong: WrongIcon\n  };\n  const Icon = ICONS[type];\n\n  return (\n    <div className={style.wrapper}>\n      <div className={classnames(style.popin, type === 'right' ? style.right : style.wrong)}>\n        <div className={style.correctionSection}>\n          <div className={style.iconCircle}>\n            <Icon className={type === 'right' ? style.iconRight : style.iconWrong} />\n          </div>\n          <div className={style.resultLabel} aria-label=\"result\">\n            <span aria-label={resultLabel}>{resultLabel}</span>\n          </div>\n        </div>\n        <div className={style.feedbackSection}>\n          <div className={style.information} aria-label=\"answer-information\">\n            <div className={style.labelContainer}>\n              <span className={style.label} aria-label={information.label}>\n                {information.label}\n              </span>\n            </div>\n            <span className={style.message} aria-label={information.message}>\n              {information.message}\n            </span>\n          </div>\n        </div>\n        <div className={type === 'right' ? style.actions : style.actionsWrong}>\n          {cta}\n          <div className={style.nextQuestionContainer}>\n            <ButtonLink {...nextQuestionButtonProps} className={style.nextQuestionButton} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCorrectionPopin.propTypes = propTypes;\n\nexport default ReviewCorrectionPopin;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAIA;;AACA;;AACA;;;;;;AAEA,MAAMA,cAAc,GAAGC,GAAG,IAAI;EAC5B,MAAMC,cAAc,gBACfD,GADe;IAElBE,IAAI,EAAE;MACJC,QAAQ,EAAE,MADN;MAEJC,IAAI,EAAE;IAFF,CAFY;IAMlBA,IAAI,EAAE;EANY,EAApB;;EASA,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAMC;EAAtB,gBACE;IAAK,SAAS,EAAED,cAAA,CAAME;EAAtB,gBACE,6BAAC,mBAAD,eAAgBN,cAAhB;IAAgC,SAAS,EAAEI,cAAA,CAAMG;EAAjD,GADF,CADF,eAIE;IAAK,SAAS,EAAEH,cAAA,CAAMI;EAAtB,gBACE;IAAK,SAAS,EAAEJ,cAAA,CAAMK;EAAtB,GAAoCV,GAAG,CAACW,OAAxC,CADF,CAJF,CADF;AAUD,CApBD;;AAsBA,MAAMC,qBAAqB,GAAGC,KAAK,IAAI;EACrC,MAAM;IAACC,WAAD;IAAcC,WAAd;IAA2BX,IAA3B;IAAiCJ,GAAjC;IAAsCgB;EAAtC,IAA8CH,KAApD;;EAEA,MAAMI,uBAAuB,gBACxBD,IADwB;IAE3BZ,IAAI,EAAE;EAFqB,EAA7B;;EAKA,MAAMc,GAAG,GAAGd,IAAI,KAAK,OAAT,GAAmBL,cAAc,CAACC,GAAD,CAAjC,GAAyC,IAArD;EAEA,MAAMmB,KAAK,GAAG;IACZC,KAAK,EAAEC,2CADK;IAEZC,KAAK,EAAEC;EAFK,CAAd;EAIA,MAAMC,IAAI,GAAGL,KAAK,CAACf,IAAD,CAAlB;EAEA,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAMoB;EAAtB,gBACE;IAAK,SAAS,EAAE,IAAAC,mBAAA,EAAWrB,cAAA,CAAMsB,KAAjB,EAAwBvB,IAAI,KAAK,OAAT,GAAmBC,cAAA,CAAMe,KAAzB,GAAiCf,cAAA,CAAMiB,KAA/D;EAAhB,gBACE;IAAK,SAAS,EAAEjB,cAAA,CAAMuB;EAAtB,gBACE;IAAK,SAAS,EAAEvB,cAAA,CAAMwB;EAAtB,gBACE,6BAAC,IAAD;IAAM,SAAS,EAAEzB,IAAI,KAAK,OAAT,GAAmBC,cAAA,CAAMyB,SAAzB,GAAqCzB,cAAA,CAAM0B;EAA5D,EADF,CADF,eAIE;IAAK,SAAS,EAAE1B,cAAA,CAAMU,WAAtB;IAAmC,cAAW;EAA9C,gBACE;IAAM,cAAYA;EAAlB,GAAgCA,WAAhC,CADF,CAJF,CADF,eASE;IAAK,SAAS,EAAEV,cAAA,CAAM2B;EAAtB,gBACE;IAAK,SAAS,EAAE3B,cAAA,CAAMS,WAAtB;IAAmC,cAAW;EAA9C,gBACE;IAAK,SAAS,EAAET,cAAA,CAAM4B;EAAtB,gBACE;IAAM,SAAS,EAAE5B,cAAA,CAAM6B,KAAvB;IAA8B,cAAYpB,WAAW,CAACoB;EAAtD,GACGpB,WAAW,CAACoB,KADf,CADF,CADF,eAME;IAAM,SAAS,EAAE7B,cAAA,CAAM8B,OAAvB;IAAgC,cAAYrB,WAAW,CAACqB;EAAxD,GACGrB,WAAW,CAACqB,OADf,CANF,CADF,CATF,eAqBE;IAAK,SAAS,EAAE/B,IAAI,KAAK,OAAT,GAAmBC,cAAA,CAAM+B,OAAzB,GAAmC/B,cAAA,CAAMgC;EAAzD,GACGnB,GADH,eAEE;IAAK,SAAS,EAAEb,cAAA,CAAMiC;EAAtB,gBACE,6BAAC,mBAAD,eAAgBrB,uBAAhB;IAAyC,SAAS,EAAEZ,cAAA,CAAMkC;EAA1D,GADF,CAFF,CArBF,CADF,CADF;AAgCD,CAhDD;;AAkDA3B,qBAAqB,CAAC4B,SAAtB,2CAAkCA,kBAAlC;eAEe5B,qB"}
+{"version":3,"file":"index.js","names":["buildKlfButton","klf","klfButtonProps","icon","position","type","style","klfContainer","klfButtonContainer","klfButton","toolTip","tooltipText","__html","tooltip","ReviewCorrectionPopin","props","information","resultLabel","next","nextQuestionButtonProps","cta","ICONS","right","RightIcon","wrong","WrongIcon","Icon","wrapper","classnames","popin","correctionSection","iconCircle","iconRight","iconWrong","feedbackSection","labelContainer","label","message","actions","actionsWrong","nextQuestionContainer","nextQuestionButton","propTypes"],"sources":["../../../src/molecule/review-correction-popin/index.js"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport {\n  NovaCompositionCoorpacademyCheck as RightIcon,\n  NovaSolidStatusClose as WrongIcon\n} from '@coorpacademy/nova-icons';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst buildKlfButton = klf => {\n  const klfButtonProps = {\n    ...klf,\n    icon: {\n      position: 'left',\n      type: 'key'\n    },\n    type: 'primary'\n  };\n\n  return (\n    <div className={style.klfContainer}>\n      <div className={style.klfButtonContainer}>\n        <ButtonLink {...klfButtonProps} className={style.klfButton} />\n      </div>\n      <div className={style.toolTip}>\n        <span\n          className={style.tooltipText}\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: klf.tooltip}}\n        />\n      </div>\n    </div>\n  );\n};\n\nconst ReviewCorrectionPopin = props => {\n  const {information, resultLabel, type, klf, next} = props;\n\n  const nextQuestionButtonProps = {\n    ...next,\n    type: 'primary'\n  };\n\n  const cta = type === 'wrong' ? buildKlfButton(klf) : null;\n\n  const ICONS = {\n    right: RightIcon,\n    wrong: WrongIcon\n  };\n  const Icon = ICONS[type];\n\n  return (\n    <div className={style.wrapper}>\n      <div className={classnames(style.popin, type === 'right' ? style.right : style.wrong)}>\n        <div className={style.correctionSection}>\n          <div className={style.iconCircle}>\n            <Icon className={type === 'right' ? style.iconRight : style.iconWrong} />\n          </div>\n          <div className={style.resultLabel} aria-label=\"result\">\n            <span aria-label={resultLabel}>{resultLabel}</span>\n          </div>\n        </div>\n        <div className={style.feedbackSection}>\n          <div className={style.information} aria-label=\"answer-information\">\n            <div className={style.labelContainer}>\n              <span className={style.label} aria-label={information.label}>\n                {information.label}\n              </span>\n            </div>\n            <span\n              className={style.message}\n              aria-label={information.message}\n              // eslint-disable-next-line react/no-danger\n              dangerouslySetInnerHTML={{__html: information.message}}\n            />\n          </div>\n        </div>\n        <div className={type === 'right' ? style.actions : style.actionsWrong}>\n          {cta}\n          <div className={style.nextQuestionContainer}>\n            <ButtonLink {...nextQuestionButtonProps} className={style.nextQuestionButton} />\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nReviewCorrectionPopin.propTypes = propTypes;\n\nexport default ReviewCorrectionPopin;\n"],"mappings":"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"}

package/lib/molecule/review-correction-popin/style.css

@@ -139,7 +139,7 @@
 .toolTip {
   visibility: hidden;
   opacity: 0;
-  transition: opacity 0.8s;
+  transition: opacity 0.4s;
   position: absolute;
   width: 142%;
   border-radius: 15px;
@@ -157,7 +157,7 @@
   width: 15px;
   height: 15px;
   transform: rotate(-45deg);
-  transition: opacity 0.8s;
+  transition: opacity 0.4s;
   background-color: white;
   position: inherit;
   bottom: -7px;

package/lib/molecule/skill-card/index.native.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { SkillCardProps } from './prop-types';
+declare const SkillCard: (props: SkillCardProps) => JSX.Element | null;
+export default SkillCard;
+//# sourceMappingURL=index.native.d.ts.map

package/lib/molecule/skill-card/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/molecule/skill-card/index.native.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAC,cAAc,EAAC,MAAM,cAAc,CAAC;AAyC5C,QAAA,MAAM,SAAS,UAAW,cAAc,uBAkCvC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/molecule/skill-card/index.native.js

@@ -0,0 +1,95 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = 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");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 createStyleSheet = theme => _reactNative.StyleSheet.create({
+  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 SkillCard = props => {
+  const templateContext = (0, _templateContext.useTemplateContext)();
+  const [styleSheet, setStylesheet] = (0, _react.useState)(null);
+  const {
+    theme
+  } = templateContext;
+  const {
+    skillTitle,
+    skillAriaLabel,
+    reviseLabel,
+    reviseAriaLabel,
+    onClick,
+    buttonAriaLabel
+  } = props;
+  (0, _react.useEffect)(() => {
+    const _stylesheet = createStyleSheet(theme);
+
+    setStylesheet(_stylesheet);
+  }, [theme]);
+
+  if (!styleSheet) {
+    return null;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
+    style: styleSheet.skill,
+    onPress: onClick,
+    accessibilityRole: "button",
+    accessibilityLabel: buttonAriaLabel
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styleSheet.skillTexts
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styleSheet.skillTitle,
+    accessibilityLabel: skillAriaLabel || skillTitle
+  }, skillTitle), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styleSheet.skillInfo,
+    accessibilityLabel: reviseAriaLabel
+  }, reviseLabel)), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowRight, {
+    color: "#ededed",
+    height: 20,
+    width: 20
+  }));
+};
+
+var _default = SkillCard;
+exports.default = _default;
+//# sourceMappingURL=index.native.js.map

package/lib/molecule/skill-card/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","skill","display","flexDirection","overflow","alignItems","height","borderRadius","backgroundColor","colors","gray","lighter","marginTop","spacing","micro","marginBottom","padding","base","skillTexts","flex","skillTitle","fontSize","fontWeight","lineHeight","color","text","primary","tiny","skillInfo","medium","SkillCard","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","skillAriaLabel","reviseLabel","reviseAriaLabel","onClick","buttonAriaLabel","useEffect","_stylesheet"],"sources":["../../../src/molecule/skill-card/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {View, Pressable, StyleSheet, Text, ViewStyle, TextStyle} from 'react-native';\nimport {NovaCompositionNavigationArrowRight as ArrowRight} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport {SkillCardProps} from './prop-types';\n\ntype StyleSheetType = {\n  skill: ViewStyle;\n  skillTexts: TextStyle;\n  skillTitle: TextStyle;\n  skillInfo: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\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\nconst SkillCard = (props: SkillCardProps) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n  const {skillTitle, skillAriaLabel, reviseLabel, reviseAriaLabel, onClick, buttonAriaLabel} =\n    props;\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\n      style={styleSheet.skill}\n      onPress={onClick}\n      accessibilityRole=\"button\"\n      accessibilityLabel={buttonAriaLabel}\n    >\n      <View style={styleSheet.skillTexts}>\n        <Text style={styleSheet.skillTitle} accessibilityLabel={skillAriaLabel || skillTitle}>\n          {skillTitle}\n        </Text>\n        <Text style={styleSheet.skillInfo} accessibilityLabel={reviseAriaLabel}>\n          {reviseLabel}\n        </Text>\n      </View>\n      <ArrowRight color=\"#ededed\" height={20} width={20} />\n    </Pressable>\n  );\n};\n\nexport default SkillCard;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAWA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,KAAK,EAAE;IACLC,OAAO,EAAE,MADJ;IAELC,aAAa,EAAE,KAFV;IAGLC,QAAQ,EAAE,QAHL;IAILC,UAAU,EAAE,QAJP;IAKLC,MAAM,EAAE,GALH;IAMLC,YAAY,EAAE,CANT;IAOLC,eAAe,EAAEV,KAAK,CAACW,MAAN,CAAaC,IAAb,CAAkBC,OAP9B;IAQLC,SAAS,EAAEd,KAAK,CAACe,OAAN,CAAcC,KARpB;IASLC,YAAY,EAAEjB,KAAK,CAACe,OAAN,CAAcC,KATvB;IAULE,OAAO,EAAElB,KAAK,CAACe,OAAN,CAAcI;EAVlB,CADS;EAahBC,UAAU,EAAE;IACVC,IAAI,EAAE,CADI;IAEVhB,aAAa,EAAE;EAFL,CAbI;EAiBhBiB,UAAU,EAAE;IACVC,QAAQ,EAAE,EADA;IAEVC,UAAU,EAAE,KAFF;IAGVC,UAAU,EAAE,EAHF;IAIVC,KAAK,EAAE1B,KAAK,CAACW,MAAN,CAAagB,IAAb,CAAkBC,OAJf;IAKVX,YAAY,EAAEjB,KAAK,CAACe,OAAN,CAAcc;EALlB,CAjBI;EAwBhBC,SAAS,EAAE;IACTP,QAAQ,EAAE,EADD;IAETE,UAAU,EAAE,EAFH;IAGTC,KAAK,EAAE1B,KAAK,CAACW,MAAN,CAAaC,IAAb,CAAkBmB;EAHhB;AAxBK,CAAlB,CADF;;AAgCA,MAAMC,SAAS,GAAIC,KAAD,IAA2B;EAC3C,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAACtC;EAAD,IAAUkC,eAAhB;EACA,MAAM;IAACZ,UAAD;IAAaiB,cAAb;IAA6BC,WAA7B;IAA0CC,eAA1C;IAA2DC,OAA3D;IAAoEC;EAApE,IACJV,KADF;EAGA,IAAAW,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAG9C,gBAAgB,CAACC,KAAD,CAApC;;IACAqC,aAAa,CAACQ,WAAD,CAAb;EACD,CAHD,EAGG,CAAC7C,KAAD,CAHH;;EAKA,IAAI,CAACoC,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,sBAAD;IACE,KAAK,EAAEA,UAAU,CAACjC,KADpB;IAEE,OAAO,EAAEuC,OAFX;IAGE,iBAAiB,EAAC,QAHpB;IAIE,kBAAkB,EAAEC;EAJtB,gBAME,6BAAC,iBAAD;IAAM,KAAK,EAAEP,UAAU,CAAChB;EAAxB,gBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEgB,UAAU,CAACd,UAAxB;IAAoC,kBAAkB,EAAEiB,cAAc,IAAIjB;EAA1E,GACGA,UADH,CADF,eAIE,6BAAC,iBAAD;IAAM,KAAK,EAAEc,UAAU,CAACN,SAAxB;IAAmC,kBAAkB,EAAEW;EAAvD,GACGD,WADH,CAJF,CANF,eAcE,6BAAC,8CAAD;IAAY,KAAK,EAAC,SAAlB;IAA4B,MAAM,EAAE,EAApC;IAAwC,KAAK,EAAE;EAA/C,EAdF,CADF;AAkBD,CAlCD;;eAoCeR,S"}

package/lib/molecule/skill-card/prop-types.d.ts

@@ -1,4 +1,5 @@
-declare const _default: {
+import PropTypes from 'prop-types';
+declare const propTypes: {
     'aria-label': PropTypes.Requireable<string>;
     skillTitle: PropTypes.Requireable<string>;
     skillAriaLabel: PropTypes.Requireable<string>;
@@ -9,6 +10,16 @@ declare const _default: {
     isCustom: PropTypes.Requireable<boolean>;
     onClick: PropTypes.Requireable<(...args: any[]) => any>;
 };
-export default _default;
-import PropTypes from "prop-types";
+export default propTypes;
+export declare type SkillCardProps = {
+    'aria-label': string;
+    skillTitle: string;
+    skillAriaLabel: string;
+    buttonLabel: string;
+    buttonAriaLabel: string;
+    reviseLabel: string;
+    reviseAriaLabel: string;
+    isCustom: boolean;
+    onClick: () => void;
+};
 //# sourceMappingURL=prop-types.d.ts.map

package/lib/molecule/skill-card/prop-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/skill-card/prop-types.js"],"names":[],"mappings":""}
+{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/skill-card/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,QAAA,MAAM,SAAS;;;;;;;;;;CAUd,CAAC;AAEF,eAAe,SAAS,CAAC;AAEzB,oBAAY,cAAc,GAAG;IAC3B,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,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,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC"}

package/lib/molecule/skill-card/prop-types.js

@@ -7,7 +7,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _default = {
+const propTypes = {
   'aria-label': _propTypes.default.string,
   skillTitle: _propTypes.default.string,
   skillAriaLabel: _propTypes.default.string,
@@ -18,5 +18,6 @@ var _default = {
   isCustom: _propTypes.default.bool,
   onClick: _propTypes.default.func
 };
+var _default = propTypes;
 exports.default = _default;
 //# sourceMappingURL=prop-types.js.map

package/lib/molecule/skill-card/prop-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"prop-types.js","names":["PropTypes","string","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","isCustom","bool","onClick","func"],"sources":["../../../src/molecule/skill-card/prop-types.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nexport default {\n  'aria-label': PropTypes.string,\n  skillTitle: PropTypes.string,\n  skillAriaLabel: PropTypes.string,\n  buttonLabel: PropTypes.string,\n  buttonAriaLabel: PropTypes.string,\n  reviseLabel: PropTypes.string,\n  reviseAriaLabel: PropTypes.string,\n  isCustom: PropTypes.bool,\n  onClick: PropTypes.func\n};\n"],"mappings":";;;;;AAAA;;;;eAEe;EACb,cAAcA,kBAAA,CAAUC,MADX;EAEbC,UAAU,EAAEF,kBAAA,CAAUC,MAFT;EAGbE,cAAc,EAAEH,kBAAA,CAAUC,MAHb;EAIbG,WAAW,EAAEJ,kBAAA,CAAUC,MAJV;EAKbI,eAAe,EAAEL,kBAAA,CAAUC,MALd;EAMbK,WAAW,EAAEN,kBAAA,CAAUC,MANV;EAObM,eAAe,EAAEP,kBAAA,CAAUC,MAPd;EAQbO,QAAQ,EAAER,kBAAA,CAAUS,IARP;EASbC,OAAO,EAAEV,kBAAA,CAAUW;AATN,C"}
+{"version":3,"file":"prop-types.js","names":["propTypes","PropTypes","string","skillTitle","skillAriaLabel","buttonLabel","buttonAriaLabel","reviseLabel","reviseAriaLabel","isCustom","bool","onClick","func"],"sources":["../../../src/molecule/skill-card/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst propTypes = {\n  'aria-label': PropTypes.string,\n  skillTitle: PropTypes.string,\n  skillAriaLabel: PropTypes.string,\n  buttonLabel: PropTypes.string,\n  buttonAriaLabel: PropTypes.string,\n  reviseLabel: PropTypes.string,\n  reviseAriaLabel: PropTypes.string,\n  isCustom: PropTypes.bool,\n  onClick: PropTypes.func\n};\n\nexport default propTypes;\n\nexport type SkillCardProps = {\n  'aria-label': string;\n  skillTitle: string;\n  skillAriaLabel: string;\n  buttonLabel: string;\n  buttonAriaLabel: string;\n  reviseLabel: string;\n  reviseAriaLabel: string;\n  isCustom: boolean;\n  onClick: () => void;\n};\n"],"mappings":";;;;;AAAA;;;;AAEA,MAAMA,SAAS,GAAG;EAChB,cAAcC,kBAAA,CAAUC,MADR;EAEhBC,UAAU,EAAEF,kBAAA,CAAUC,MAFN;EAGhBE,cAAc,EAAEH,kBAAA,CAAUC,MAHV;EAIhBG,WAAW,EAAEJ,kBAAA,CAAUC,MAJP;EAKhBI,eAAe,EAAEL,kBAAA,CAAUC,MALX;EAMhBK,WAAW,EAAEN,kBAAA,CAAUC,MANP;EAOhBM,eAAe,EAAEP,kBAAA,CAAUC,MAPX;EAQhBO,QAAQ,EAAER,kBAAA,CAAUS,IARJ;EAShBC,OAAO,EAAEV,kBAAA,CAAUW;AATH,CAAlB;eAYeZ,S"}

package/lib/organism/podcast-popin-intro/index.native.js

@@ -50,11 +50,11 @@ const createStyleSheet = (theme, windowHeight) => {
       fill: theme.colors.podcast.primary
     },
     button: {
-      width: '40%',
       height: 44,
       backgroundColor: theme.colors.podcast.primary,
       borderRadius: 7,
-      justifyContent: 'center'
+      justifyContent: 'center',
+      paddingHorizontal: 12
     },
     buttonText: {
       alignSelf: 'center',
@@ -76,7 +76,7 @@ const createStyleSheet = (theme, windowHeight) => {
       lineHeight: 19,
       fontWeight: '300',
       fontSize: 16,
-      paddingHorizontal: 40
+      paddingHorizontal: 35
     }
   });
 };

package/lib/organism/podcast-popin-intro/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","windowHeight","popinHeight","StyleSheet","create","container","position","top","height","backgroundColor","justifyContent","alignSelf","alignItems","borderRadius","padding","headphonesWrapper","width","headphones","fill","colors","podcast","primary","button","buttonText","color","fontWeight","bold","fontFamily","fontSize","lineHeight","title","textAlign","paddingHorizontal","message","PodcastPopinIntro","props","useWindowDimensions","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","isVisible","onValidate","useEffect","_stylesheet","appPodcast","infoNewFeature","cta"],"sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {\n  useWindowDimensions,\n  StyleSheet,\n  ViewStyle,\n  Text,\n  TextStyle,\n  View,\n  GestureResponderEvent\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidAudioHeadphone as Headphone} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n  isVisible: boolean;\n  onValidate: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  headphones: ViewStyle;\n  headphonesWrapper: ViewStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  title: TextStyle;\n  message: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme, windowHeight: number) => {\n  const popinHeight = 368;\n  return StyleSheet.create({\n    container: {\n      position: 'absolute',\n      top: (windowHeight - popinHeight) / 2,\n      height: popinHeight,\n      backgroundColor: '#fff',\n      justifyContent: 'space-between',\n      alignSelf: 'center',\n      alignItems: 'center',\n      borderRadius: 8,\n      // width: '90%',\n      padding: 24\n    },\n    headphonesWrapper: {\n      width: 115,\n      height: 115,\n      backgroundColor: '#FFEFEB',\n      justifyContent: 'center',\n      borderRadius: 60\n    },\n    headphones: {\n      alignSelf: 'center',\n      width: 60,\n      height: 60,\n      fill: theme.colors.podcast.primary\n    },\n    button: {\n      width: '40%',\n      height: 44,\n      backgroundColor: theme.colors.podcast.primary,\n      borderRadius: 7,\n      justifyContent: 'center'\n    },\n    buttonText: {\n      alignSelf: 'center',\n      color: '#FFFFFF',\n      fontWeight: theme.fontWeight.bold,\n      fontFamily: 'System',\n      fontSize: 14,\n      lineHeight: 20\n    },\n    title: {\n      textAlign: 'center',\n      lineHeight: 24,\n      fontWeight: '700',\n      fontSize: 20,\n      paddingHorizontal: 40\n    },\n    message: {\n      textAlign: 'center',\n      lineHeight: 19,\n      fontWeight: '300',\n      fontSize: 16,\n      paddingHorizontal: 40\n    }\n  });\n};\n\nconst PodcastPopinIntro = (props: Props) => {\n  const {height: windowHeight} = useWindowDimensions();\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme, translations} = templateContext;\n  const {isVisible, onValidate} = props;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, windowHeight);\n    setStylesheet(_stylesheet);\n  }, [theme, windowHeight]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <Modal isVisible={isVisible} style={styleSheet.container} testID=\"podcast-popin-intro\">\n      <View style={styleSheet.headphonesWrapper}>\n        <Headphone style={styleSheet.headphones} />\n      </View>\n      <Text style={styleSheet.title}>{translations.appPodcast.infoNewFeature.title}</Text>\n      <Text style={styleSheet.message}>{translations.appPodcast.infoNewFeature.message}</Text>\n      <Touchable\n        style={styleSheet.button}\n        onPress={onValidate}\n        testID=\"podcast-popin-intro-validate-button\"\n      >\n        <Text style={styleSheet.buttonText}>{translations.appPodcast.infoNewFeature.cta}</Text>\n      </Touchable>\n    </Modal>\n  );\n};\n\nexport type PodcastPopinIntroProps = Props;\nexport default PodcastPopinIntro;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","windowHeight","popinHeight","StyleSheet","create","container","position","top","height","backgroundColor","justifyContent","alignSelf","alignItems","borderRadius","padding","headphonesWrapper","width","headphones","fill","colors","podcast","primary","button","paddingHorizontal","buttonText","color","fontWeight","bold","fontFamily","fontSize","lineHeight","title","textAlign","message","PodcastPopinIntro","props","useWindowDimensions","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","translations","isVisible","onValidate","useEffect","_stylesheet","appPodcast","infoNewFeature","cta"],"sources":["../../../src/organism/podcast-popin-intro/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {\n  useWindowDimensions,\n  StyleSheet,\n  ViewStyle,\n  Text,\n  TextStyle,\n  View,\n  GestureResponderEvent\n} from 'react-native';\nimport Modal from 'react-native-modal';\nimport {NovaSolidAudioHeadphone as Headphone} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport type Props = {\n  isVisible: boolean;\n  onValidate: (event: GestureResponderEvent) => void;\n};\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  headphones: ViewStyle;\n  headphonesWrapper: ViewStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  title: TextStyle;\n  message: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme, windowHeight: number) => {\n  const popinHeight = 368;\n  return StyleSheet.create({\n    container: {\n      position: 'absolute',\n      top: (windowHeight - popinHeight) / 2,\n      height: popinHeight,\n      backgroundColor: '#fff',\n      justifyContent: 'space-between',\n      alignSelf: 'center',\n      alignItems: 'center',\n      borderRadius: 8,\n      // width: '90%',\n      padding: 24\n    },\n    headphonesWrapper: {\n      width: 115,\n      height: 115,\n      backgroundColor: '#FFEFEB',\n      justifyContent: 'center',\n      borderRadius: 60\n    },\n    headphones: {\n      alignSelf: 'center',\n      width: 60,\n      height: 60,\n      fill: theme.colors.podcast.primary\n    },\n    button: {\n      height: 44,\n      backgroundColor: theme.colors.podcast.primary,\n      borderRadius: 7,\n      justifyContent: 'center',\n      paddingHorizontal: 12\n    },\n    buttonText: {\n      alignSelf: 'center',\n      color: '#FFFFFF',\n      fontWeight: theme.fontWeight.bold,\n      fontFamily: 'System',\n      fontSize: 14,\n      lineHeight: 20\n    },\n    title: {\n      textAlign: 'center',\n      lineHeight: 24,\n      fontWeight: '700',\n      fontSize: 20,\n      paddingHorizontal: 40\n    },\n    message: {\n      textAlign: 'center',\n      lineHeight: 19,\n      fontWeight: '300',\n      fontSize: 16,\n      paddingHorizontal: 35\n    }\n  });\n};\n\nconst PodcastPopinIntro = (props: Props) => {\n  const {height: windowHeight} = useWindowDimensions();\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme, translations} = templateContext;\n  const {isVisible, onValidate} = props;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme, windowHeight);\n    setStylesheet(_stylesheet);\n  }, [theme, windowHeight]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <Modal isVisible={isVisible} style={styleSheet.container} testID=\"podcast-popin-intro\">\n      <View style={styleSheet.headphonesWrapper}>\n        <Headphone style={styleSheet.headphones} />\n      </View>\n      <Text style={styleSheet.title}>{translations.appPodcast.infoNewFeature.title}</Text>\n      <Text style={styleSheet.message}>{translations.appPodcast.infoNewFeature.message}</Text>\n      <Touchable\n        style={styleSheet.button}\n        onPress={onValidate}\n        testID=\"podcast-popin-intro-validate-button\"\n      >\n        <Text style={styleSheet.buttonText}>{translations.appPodcast.infoNewFeature.cta}</Text>\n      </Touchable>\n    </Modal>\n  );\n};\n\nexport type PodcastPopinIntroProps = Props;\nexport default PodcastPopinIntro;\n"],"mappings":"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"}

package/lib/organism/review-no-skills/index.d.ts

@@ -0,0 +1,11 @@
+export default ReviewNoSkills;
+declare function ReviewNoSkills({ titleNoSkills, textNoSkills, iconSkillAriaLabel }: {
+    titleNoSkills: any;
+    textNoSkills: any;
+    iconSkillAriaLabel: any;
+}): JSX.Element;
+declare namespace ReviewNoSkills {
+    export { propTypes };
+}
+import propTypes from "./prop-types";
+//# sourceMappingURL=index.d.ts.map

package/lib/organism/review-no-skills/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/review-no-skills/index.js"],"names":[],"mappings":";AAKA;;;;gBAQC"}

package/lib/organism/review-no-skills/index.js

@@ -0,0 +1,36 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _novaIcons = require("@coorpacademy/nova-icons");
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _propTypes = _interopRequireDefault(require("./prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const ReviewNoSkills = ({
+  titleNoSkills,
+  textNoSkills,
+  iconSkillAriaLabel
+}) => {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.noSkillsContainer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.titleNoSkills
+  }, titleNoSkills), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.textNoSkills
+  }, " ", textNoSkills), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyEmptyStateHomeRevision, {
+    className: _style.default.imgNoSkills,
+    "aria-label": iconSkillAriaLabel
+  }));
+};
+
+ReviewNoSkills.propTypes = process.env.NODE_ENV !== "production" ? _propTypes.default : {};
+var _default = ReviewNoSkills;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/organism/review-no-skills/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ReviewNoSkills","titleNoSkills","textNoSkills","iconSkillAriaLabel","style","noSkillsContainer","imgNoSkills","propTypes"],"sources":["../../../src/organism/review-no-skills/index.js"],"sourcesContent":["import React from 'react';\nimport {NovaCompositionCoorpacademyEmptyStateHomeRevision as EmptyStateHomeRevision} from '@coorpacademy/nova-icons';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst ReviewNoSkills = ({titleNoSkills, textNoSkills, iconSkillAriaLabel}) => {\n  return (\n    <div className={style.noSkillsContainer}>\n      <div className={style.titleNoSkills}>{titleNoSkills}</div>\n      <div className={style.textNoSkills}> {textNoSkills}</div>\n      <EmptyStateHomeRevision className={style.imgNoSkills} aria-label={iconSkillAriaLabel} />\n    </div>\n  );\n};\n\nReviewNoSkills.propTypes = propTypes;\n\nexport default ReviewNoSkills;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,cAAc,GAAG,CAAC;EAACC,aAAD;EAAgBC,YAAhB;EAA8BC;AAA9B,CAAD,KAAuD;EAC5E,oBACE;IAAK,SAAS,EAAEC,cAAA,CAAMC;EAAtB,gBACE;IAAK,SAAS,EAAED,cAAA,CAAMH;EAAtB,GAAsCA,aAAtC,CADF,eAEE;IAAK,SAAS,EAAEG,cAAA,CAAMF;EAAtB,QAAsCA,YAAtC,CAFF,eAGE,6BAAC,4DAAD;IAAwB,SAAS,EAAEE,cAAA,CAAME,WAAzC;IAAsD,cAAYH;EAAlE,EAHF,CADF;AAOD,CARD;;AAUAH,cAAc,CAACO,SAAf,2CAA2BA,kBAA3B;eAEeP,c"}

package/lib/organism/review-no-skills/index.native.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { NoSkillsProps } from './prop-types';
+declare const ReviewNoSkills: (props: NoSkillsProps) => JSX.Element | null;
+export default ReviewNoSkills;
+//# sourceMappingURL=index.native.d.ts.map

package/lib/organism/review-no-skills/index.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-no-skills/index.native.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAC,aAAa,EAAC,MAAM,cAAc,CAAC;AA8B3C,QAAA,MAAM,cAAc,UAAW,aAAa,uBAyB3C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/organism/review-no-skills/index.native.js

@@ -0,0 +1,72 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = 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");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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 createStyleSheet = theme => _reactNative.StyleSheet.create({
+  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
+  }
+});
+
+const ReviewNoSkills = props => {
+  const {
+    titleNoSkills,
+    textNoSkills,
+    iconSkillAriaLabel
+  } = props;
+  const templateContext = (0, _templateContext.useTemplateContext)();
+  const [styleSheet, setStylesheet] = (0, _react.useState)(null);
+  const {
+    theme
+  } = templateContext;
+  (0, _react.useEffect)(() => {
+    const _stylesheet = createStyleSheet(theme);
+
+    setStylesheet(_stylesheet);
+  }, [theme]);
+
+  if (!styleSheet) {
+    return null;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styleSheet.subtitle
+  }, titleNoSkills), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: styleSheet.text
+  }, textNoSkills), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyEmptyStateHomeRevision, {
+    style: styleSheet.noSkillsImage,
+    iconSkillAriaLabel: iconSkillAriaLabel
+  }));
+};
+
+var _default = ReviewNoSkills;
+exports.default = _default;
+//# sourceMappingURL=index.native.js.map

package/lib/organism/review-no-skills/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","subtitle","fontSize","xlarge","color","colors","text","primary","marginBottom","spacing","tiny","lineHeight","opacity","base","noSkillsImage","flex","alignSelf","width","height","ReviewNoSkills","props","titleNoSkills","textNoSkills","iconSkillAriaLabel","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","useEffect","_stylesheet"],"sources":["../../../src/organism/review-no-skills/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {StyleSheet, Text, View, ViewStyle, TextStyle} from 'react-native';\nimport {NovaCompositionCoorpacademyEmptyStateHomeRevision as EmptyStateHomeRevision} from '@coorpacademy/nova-icons';\nimport {Theme} from '../../variables/theme.native';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {NoSkillsProps} from './prop-types';\n\ntype StyleSheetType = {\n  subtitle: TextStyle;\n  text: TextStyle;\n  noSkillsImage: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\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  });\n\nconst ReviewNoSkills = (props: NoSkillsProps) => {\n  const {titleNoSkills, textNoSkills, iconSkillAriaLabel} = 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>\n      <Text style={styleSheet.subtitle}>{titleNoSkills}</Text>\n      <Text style={styleSheet.text}>{textNoSkills}</Text>\n      <EmptyStateHomeRevision\n        style={styleSheet.noSkillsImage}\n        iconSkillAriaLabel={iconSkillAriaLabel}\n      />\n    </View>\n  );\n};\n\nexport default ReviewNoSkills;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAEA;;;;;;AASA,MAAMA,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,QAAQ,EAAE;IACRC,QAAQ,EAAEJ,KAAK,CAACI,QAAN,CAAeC,MADjB;IAERC,KAAK,EAAEN,KAAK,CAACO,MAAN,CAAaC,IAAb,CAAkBC,OAFjB;IAGRC,YAAY,EAAEV,KAAK,CAACW,OAAN,CAAcC;EAHpB,CADM;EAMhBJ,IAAI,EAAE;IACJJ,QAAQ,EAAE,EADN;IAEJS,UAAU,EAAE,EAFR;IAGJP,KAAK,EAAEN,KAAK,CAACO,MAAN,CAAaC,IAAb,CAAkBC,OAHrB;IAIJK,OAAO,EAAE,GAJL;IAKJJ,YAAY,EAAEV,KAAK,CAACW,OAAN,CAAcI;EALxB,CANU;EAahBC,aAAa,EAAE;IACbC,IAAI,EAAE,CADO;IAEbC,SAAS,EAAE,QAFE;IAGbC,KAAK,EAAE,GAHM;IAIbC,MAAM,EAAE;EAJK;AAbC,CAAlB,CADF;;AAsBA,MAAMC,cAAc,GAAIC,KAAD,IAA0B;EAC/C,MAAM;IAACC,aAAD;IAAgBC,YAAhB;IAA8BC;EAA9B,IAAoDH,KAA1D;EACA,MAAMI,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAAC9B;EAAD,IAAU0B,eAAhB;EAEA,IAAAK,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAGjC,gBAAgB,CAACC,KAAD,CAApC;;IACA6B,aAAa,CAACG,WAAD,CAAb;EACD,CAHD,EAGG,CAAChC,KAAD,CAHH;;EAKA,IAAI,CAAC4B,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,iBAAD,qBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEA,UAAU,CAACzB;EAAxB,GAAmCoB,aAAnC,CADF,eAEE,6BAAC,iBAAD;IAAM,KAAK,EAAEK,UAAU,CAACpB;EAAxB,GAA+BgB,YAA/B,CAFF,eAGE,6BAAC,4DAAD;IACE,KAAK,EAAEI,UAAU,CAACZ,aADpB;IAEE,kBAAkB,EAAES;EAFtB,EAHF,CADF;AAUD,CAzBD;;eA2BeJ,c"}

package/lib/organism/review-no-skills/prop-types.d.ts

@@ -0,0 +1,13 @@
+import PropTypes from 'prop-types';
+declare const propTypes: {
+    titleNoSkills: PropTypes.Validator<string>;
+    textNoSkills: PropTypes.Validator<string>;
+    iconSkillAriaLabel: PropTypes.Validator<string>;
+};
+export default propTypes;
+export declare type NoSkillsProps = {
+    titleNoSkills: string;
+    textNoSkills: string;
+    iconSkillAriaLabel: string;
+};
+//# sourceMappingURL=prop-types.d.ts.map

package/lib/organism/review-no-skills/prop-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/organism/review-no-skills/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,QAAA,MAAM,SAAS;;;;CAId,CAAC;AAEF,eAAe,SAAS,CAAC;AAEzB,oBAAY,aAAa,GAAG;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,EAAE,MAAM,CAAC;CAC5B,CAAC"}

package/lib/organism/review-no-skills/prop-types.js

@@ -0,0 +1,17 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const propTypes = {
+  titleNoSkills: _propTypes.default.string.isRequired,
+  textNoSkills: _propTypes.default.string.isRequired,
+  iconSkillAriaLabel: _propTypes.default.string.isRequired
+};
+var _default = propTypes;
+exports.default = _default;
+//# sourceMappingURL=prop-types.js.map

package/lib/organism/review-no-skills/prop-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prop-types.js","names":["propTypes","titleNoSkills","PropTypes","string","isRequired","textNoSkills","iconSkillAriaLabel"],"sources":["../../../src/organism/review-no-skills/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst propTypes = {\n  titleNoSkills: PropTypes.string.isRequired,\n  textNoSkills: PropTypes.string.isRequired,\n  iconSkillAriaLabel: PropTypes.string.isRequired\n};\n\nexport default propTypes;\n\nexport type NoSkillsProps = {\n  titleNoSkills: string;\n  textNoSkills: string;\n  iconSkillAriaLabel: string;\n};\n"],"mappings":";;;;;AAAA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,aAAa,EAAEC,kBAAA,CAAUC,MAAV,CAAiBC,UADhB;EAEhBC,YAAY,EAAEH,kBAAA,CAAUC,MAAV,CAAiBC,UAFf;EAGhBE,kBAAkB,EAAEJ,kBAAA,CAAUC,MAAV,CAAiBC;AAHrB,CAAlB;eAMeJ,S"}