@coorpacademy/components 10.4.6-alpha.1 → 10.5.0

package/es/molecule/course-section/index.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import CardImagePreview from '../../atom/card-image-preview';
+import ContentBadge from '../../atom/content-badge';
+import style from './style.css';
+
+const CourseSection = props => {
+  const {
+    image,
+    contentBadge: {
+      category,
+      label
+    },
+    title,
+    author,
+    position,
+    'aria-label': {
+      title: ariaLabelTitle,
+      author: ariaLabelAuthor
+    }
+  } = props;
+  return /*#__PURE__*/React.createElement("div", {
+    className: style.container,
+    "aria-label": ariaLabelTitle,
+    "data-name": `course-section-${position}`
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.position
+  }, position), /*#__PURE__*/React.createElement("div", {
+    className: style.containerImage
+  }, /*#__PURE__*/React.createElement(CardImagePreview, {
+    image: image
+  })), /*#__PURE__*/React.createElement("div", {
+    className: style.containerInfos
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.containerMainInfos
+  }, /*#__PURE__*/React.createElement(ContentBadge, {
+    className: style.contentBadge,
+    category: category,
+    label: label
+  }), /*#__PURE__*/React.createElement("div", {
+    className: style.title
+  }, title)), /*#__PURE__*/React.createElement("span", {
+    className: style.author,
+    "aria-label": ariaLabelAuthor
+  }, author)));
+};
+
+CourseSection.propTypes = process.env.NODE_ENV !== "production" ? {
+  'aria-label': PropTypes.shape({
+    title: PropTypes.string,
+    author: PropTypes.string
+  }),
+  image: PropTypes.string,
+  contentBadge: PropTypes.shape(ContentBadge.propTypes),
+  title: PropTypes.string,
+  author: PropTypes.string,
+  position: PropTypes.number
+} : {};
+export default CourseSection;
+//# sourceMappingURL=index.js.map

package/es/molecule/course-section/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/molecule/course-section/index.js"],"names":["React","PropTypes","CardImagePreview","ContentBadge","style","CourseSection","props","image","contentBadge","category","label","title","author","position","ariaLabelTitle","ariaLabelAuthor","container","containerImage","containerInfos","containerMainInfos","propTypes","shape","string","number"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,YAAP,MAAyB,0BAAzB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,aAAa,GAAGC,KAAK,IAAI;AAC7B,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,YAAY,EAAE;AAACC,MAAAA,QAAD;AAAWC,MAAAA;AAAX,KAFV;AAGJC,IAAAA,KAHI;AAIJC,IAAAA,MAJI;AAKJC,IAAAA,QALI;AAMJ,kBAAc;AAACF,MAAAA,KAAK,EAAEG,cAAR;AAAwBF,MAAAA,MAAM,EAAEG;AAAhC;AANV,MAOFT,KAPJ;AAQA,sBACE;AACE,IAAA,SAAS,EAAEF,KAAK,CAACY,SADnB;AAEE,kBAAYF,cAFd;AAGE,iBAAY,kBAAiBD,QAAS;AAHxC,kBAKE;AAAM,IAAA,SAAS,EAAET,KAAK,CAACS;AAAvB,KAAkCA,QAAlC,CALF,eAME;AAAK,IAAA,SAAS,EAAET,KAAK,CAACa;AAAtB,kBACE,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAEV;AAAzB,IADF,CANF,eASE;AAAK,IAAA,SAAS,EAAEH,KAAK,CAACc;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAEd,KAAK,CAACe;AAAtB,kBACE,oBAAC,YAAD;AAAc,IAAA,SAAS,EAAEf,KAAK,CAACI,YAA/B;AAA6C,IAAA,QAAQ,EAAEC,QAAvD;AAAiE,IAAA,KAAK,EAAEC;AAAxE,IADF,eAEE;AAAK,IAAA,SAAS,EAAEN,KAAK,CAACO;AAAtB,KAA8BA,KAA9B,CAFF,CADF,eAKE;AAAM,IAAA,SAAS,EAAEP,KAAK,CAACQ,MAAvB;AAA+B,kBAAYG;AAA3C,KACGH,MADH,CALF,CATF,CADF;AAqBD,CA9BD;;AAgCAP,aAAa,CAACe,SAAd,2CAA0B;AACxB,gBAAcnB,SAAS,CAACoB,KAAV,CAAgB;AAC5BV,IAAAA,KAAK,EAAEV,SAAS,CAACqB,MADW;AAE5BV,IAAAA,MAAM,EAAEX,SAAS,CAACqB;AAFU,GAAhB,CADU;AAKxBf,EAAAA,KAAK,EAAEN,SAAS,CAACqB,MALO;AAMxBd,EAAAA,YAAY,EAAEP,SAAS,CAACoB,KAAV,CAAgBlB,YAAY,CAACiB,SAA7B,CANU;AAOxBT,EAAAA,KAAK,EAAEV,SAAS,CAACqB,MAPO;AAQxBV,EAAAA,MAAM,EAAEX,SAAS,CAACqB,MARM;AASxBT,EAAAA,QAAQ,EAAEZ,SAAS,CAACsB;AATI,CAA1B;AAYA,eAAelB,aAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CardImagePreview from '../../atom/card-image-preview';\nimport ContentBadge from '../../atom/content-badge';\nimport style from './style.css';\n\nconst CourseSection = props => {\n  const {\n    image,\n    contentBadge: {category, label},\n    title,\n    author,\n    position,\n    'aria-label': {title: ariaLabelTitle, author: ariaLabelAuthor}\n  } = props;\n  return (\n    <div\n      className={style.container}\n      aria-label={ariaLabelTitle}\n      data-name={`course-section-${position}`}\n    >\n      <span className={style.position}>{position}</span>\n      <div className={style.containerImage}>\n        <CardImagePreview image={image} />\n      </div>\n      <div className={style.containerInfos}>\n        <div className={style.containerMainInfos}>\n          <ContentBadge className={style.contentBadge} category={category} label={label} />\n          <div className={style.title}>{title}</div>\n        </div>\n        <span className={style.author} aria-label={ariaLabelAuthor}>\n          {author}\n        </span>\n      </div>\n    </div>\n  );\n};\n\nCourseSection.propTypes = {\n  'aria-label': PropTypes.shape({\n    title: PropTypes.string,\n    author: PropTypes.string\n  }),\n  image: PropTypes.string,\n  contentBadge: PropTypes.shape(ContentBadge.propTypes),\n  title: PropTypes.string,\n  author: PropTypes.string,\n  position: PropTypes.number\n};\n\nexport default CourseSection;\n"],"file":"index.js"}

package/es/molecule/course-section/style.css

@@ -0,0 +1,65 @@
+@value colors: "../../variables/colors.css";
+@value cm_grey_50 from colors;
+@value cm_grey_900 from colors;
+@value cm_grey_500 from colors;
+@value cm_grey_400 from colors;
+
+.container {
+    align-items: center;
+    background-color: cm_grey_50;
+    border-radius: 7px;
+    display: flex;
+    font-size: 14px;
+    justify-content: start;
+    margin-top: 8px;
+    padding: 8px 16px;
+}
+
+.containerInfos {
+    margin-left: 16px;
+    overflow: hidden;
+}
+
+.containerMainInfos {
+    display: flex;
+    align-items: center;
+}
+
+.title {
+    color: cm_grey_900;
+    line-height: 22px;
+    font-family: Gilroy;
+    font-size: 16px;
+    font-weight: bold;
+    margin-left: 4px;
+    overflow:hidden;
+    white-space:nowrap;
+    display:inline-block;
+    text-overflow:ellipsis;
+}
+
+.author {
+    color: cm_grey_500;
+    display: block;
+    font-family: Gilroy;
+    line-height: 20px;
+}
+
+.position {
+    color: cm_grey_400;
+    font-family: Gilroy;
+    font-weight: 600;
+    line-height: 20px;
+    margin: 0 12px 0 14px;
+}
+
+.contentBadge {
+    font-size: 8px;
+    font-weight: bold;
+    line-height: 10px;;
+}
+
+.containerImage {
+    min-height: 56px;
+    min-width: 56px;
+}

package/es/molecule/course-section/test/fixtures/chapter.js

@@ -0,0 +1,17 @@
+export default {
+  props: {
+    'aria-label': {
+      title: 'aria label title',
+      author: 'aria label author'
+    },
+    title: 'Social networks',
+    author: 'Author',
+    image: 'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',
+    contentBadge: {
+      label: 'chapter',
+      category: 'chapter'
+    },
+    position: 2
+  }
+};
+//# sourceMappingURL=chapter.js.map

package/es/molecule/course-section/test/fixtures/chapter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/molecule/course-section/test/fixtures/chapter.js"],"names":["props","title","author","image","contentBadge","label","category","position"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc;AACZC,MAAAA,KAAK,EAAE,kBADK;AAEZC,MAAAA,MAAM,EAAE;AAFI,KADT;AAKLD,IAAAA,KAAK,EAAE,iBALF;AAMLC,IAAAA,MAAM,EAAE,QANH;AAOLC,IAAAA,KAAK,EACH,4LARG;AASLC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE,SADK;AAEZC,MAAAA,QAAQ,EAAE;AAFE,KATT;AAaLC,IAAAA,QAAQ,EAAE;AAbL;AADM,CAAf","sourcesContent":["export default {\n  props: {\n    'aria-label': {\n      title: 'aria label title',\n      author: 'aria label author'\n    },\n    title: 'Social networks',\n    author: 'Author',\n    image:\n      'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',\n    contentBadge: {\n      label: 'chapter',\n      category: 'chapter'\n    },\n    position: 2\n  }\n};\n"],"file":"chapter.js"}

package/es/molecule/course-section/test/fixtures/course.js

@@ -0,0 +1,17 @@
+export default {
+  props: {
+    'aria-label': {
+      title: 'aria label title',
+      author: 'aria label author'
+    },
+    title: 'Marketing and online advertising Marketing and online advertising Marketing and online advertising Marketing and online advertising',
+    author: 'Author',
+    image: 'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',
+    contentBadge: {
+      label: 'course',
+      category: 'course'
+    },
+    position: 1
+  }
+};
+//# sourceMappingURL=course.js.map

package/es/molecule/course-section/test/fixtures/course.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/molecule/course-section/test/fixtures/course.js"],"names":["props","title","author","image","contentBadge","label","category","position"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc;AACZC,MAAAA,KAAK,EAAE,kBADK;AAEZC,MAAAA,MAAM,EAAE;AAFI,KADT;AAKLD,IAAAA,KAAK,EACH,qIANG;AAOLC,IAAAA,MAAM,EAAE,QAPH;AAQLC,IAAAA,KAAK,EACH,4LATG;AAULC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE,QADK;AAEZC,MAAAA,QAAQ,EAAE;AAFE,KAVT;AAcLC,IAAAA,QAAQ,EAAE;AAdL;AADM,CAAf","sourcesContent":["export default {\n  props: {\n    'aria-label': {\n      title: 'aria label title',\n      author: 'aria label author'\n    },\n    title:\n      'Marketing and online advertising Marketing and online advertising Marketing and online advertising Marketing and online advertising',\n    author: 'Author',\n    image:\n      'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',\n    contentBadge: {\n      label: 'course',\n      category: 'course'\n    },\n    position: 1\n  }\n};\n"],"file":"course.js"}

package/es/molecule/feedback/style.css

@@ -40,7 +40,6 @@
   margin-right: 32px;
   font-family: 'Gilroy';
   font-size: 13px;
-  font-weight: bold;
   letter-spacing: -0.1px;
   text-align: left;
   color: dark;

package/es/molecule/payment-form/index.js

@@ -24,11 +24,11 @@ class PaymentForm extends React.Component {
             iconStyle: 'solid',
             color: '#546E7A',
             fontSize: '16px',
-            fontFamily: '"Gilroy"',
+            fontFamily: 'Gilroy',
             '::placeholder': {
               color: '#546E7A',
               fontSize: '16px',
-              fontFamily: '"Gilroy"'
+              fontFamily: 'Gilroy'
             }
           }
         }

package/es/molecule/payment-form/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/payment-form/index.js"],"names":["React","PropTypes","Provider","style","PaymentForm","Component","constructor","props","stripe","stripeInstance","stripeKeyPublic","handleCardNumberChange","bind","handleCardExpiryChange","handleCardCvcChange","handleSubmit","componentDidMount","elements","elementOptions","base","iconStyle","color","fontSize","fontFamily","cardNumber","create","cardExpiry","cardCvc","mount","on","componentWillUnmount","cardNumer","unmount","off","onSubscription","createToken","then","response","error","onCardNumberChange","onCardExpiryChange","onCardCvcChange","render","checkImage","cardsImage","cardOwnerEmail","securedPaymentImage","errors","warning","submitButtonEnabled","cardNumberHasError","cardExpiryHasError","cardCvcHasError","translate","context","paymentForm","acceptedCards","acceptedCardsCheck","acceptedCardsText","acceptedCardsImage","creditCardOwnerEmail","creditCardOwnerEmailSeparator","creditCardOwnerEmailText","paymentErrors","paymentWarning","securedPayment","securedPaymentText","cardBlock","invalidElement","subscriptionDisclaimer","subscribeButtonContainer","subscribeButton","childContextTypes","propTypes","string","isRequired","func","bool"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,WAAN,SAA0BJ,KAAK,CAACK,SAAhC,CAA0C;AAwBxCC,EAAAA,WAAW,CAACC,KAAD,EAAQ;AACjB,UAAMA,KAAN;AACA,SAAKC,MAAL,GAAcD,KAAK,CAACE,cAAN,GAAuBF,KAAK,CAACE,cAAN,CAAqBF,KAAK,CAACG,eAA3B,CAAvB,GAAqE,IAAnF;AACA,SAAKC,sBAAL,GAA8B,KAAKA,sBAAL,CAA4BC,IAA5B,CAAiC,IAAjC,CAA9B;AACA,SAAKC,sBAAL,GAA8B,KAAKA,sBAAL,CAA4BD,IAA5B,CAAiC,IAAjC,CAA9B;AACA,SAAKE,mBAAL,GAA2B,KAAKA,mBAAL,CAAyBF,IAAzB,CAA8B,IAA9B,CAA3B;AACA,SAAKG,YAAL,GAAoB,KAAKA,YAAL,CAAkBH,IAAlB,CAAuB,IAAvB,CAApB;AACD;;AAEDI,EAAAA,iBAAiB,GAAG;AAClB,QAAI,KAAKR,MAAT,EAAiB;AACf,YAAMS,QAAQ,GAAG,KAAKT,MAAL,CAAYS,QAAZ,EAAjB;AAEA,YAAMC,cAAc,GAAG;AACrBf,QAAAA,KAAK,EAAE;AACLgB,UAAAA,IAAI,EAAE;AACJC,YAAAA,SAAS,EAAE,OADP;AAEJC,YAAAA,KAAK,EAAE,SAFH;AAGJC,YAAAA,QAAQ,EAAE,MAHN;AAIJC,YAAAA,UAAU,EAAE,UAJR;AAKJ,6BAAiB;AACfF,cAAAA,KAAK,EAAE,SADQ;AAEfC,cAAAA,QAAQ,EAAE,MAFK;AAGfC,cAAAA,UAAU,EAAE;AAHG;AALb;AADD;AADc,OAAvB;AAgBA,WAAKC,UAAL,GAAkBP,QAAQ,CAACQ,MAAT,CAAgB,YAAhB,EAA8BP,cAA9B,CAAlB;AACA,WAAKQ,UAAL,GAAkBT,QAAQ,CAACQ,MAAT,CAAgB,YAAhB,EAA8BP,cAA9B,CAAlB;AACA,WAAKS,OAAL,GAAeV,QAAQ,CAACQ,MAAT,CAAgB,SAAhB,EAA2BP,cAA3B,CAAf;AAEA,WAAKM,UAAL,CAAgBI,KAAhB,CAAsB,cAAtB;AACA,WAAKF,UAAL,CAAgBE,KAAhB,CAAsB,cAAtB;AACA,WAAKD,OAAL,CAAaC,KAAb,CAAmB,WAAnB;AAEA,WAAKJ,UAAL,CAAgBK,EAAhB,CAAmB,QAAnB,EAA6B,KAAKlB,sBAAlC;AACA,WAAKe,UAAL,CAAgBG,EAAhB,CAAmB,QAAnB,EAA6B,KAAKhB,sBAAlC;AACA,WAAKc,OAAL,CAAaE,EAAb,CAAgB,QAAhB,EAA0B,KAAKf,mBAA/B;AACD;AACF;;AAEDgB,EAAAA,oBAAoB,GAAG;AACrB,QAAI,KAAKC,SAAT,EAAoB;AAClB,WAAKP,UAAL,CAAgBQ,OAAhB;AACA,WAAKR,UAAL,CAAgBS,GAAhB,CAAoB,QAApB,EAA8B,KAAKtB,sBAAnC;AACD;;AACD,QAAI,KAAKe,UAAT,EAAqB;AACnB,WAAKA,UAAL,CAAgBM,OAAhB;AACA,WAAKN,UAAL,CAAgBO,GAAhB,CAAoB,QAApB,EAA8B,KAAKpB,sBAAnC;AACD;;AACD,QAAI,KAAKc,OAAT,EAAkB;AAChB,WAAKA,OAAL,CAAaK,OAAb;AACA,WAAKL,OAAL,CAAaM,GAAb,CAAiB,QAAjB,EAA2B,KAAKnB,mBAAhC;AACD;AACF;;AAEDC,EAAAA,YAAY,GAAG;AACb,UAAM;AAACmB,MAAAA;AAAD,QAAmB,KAAK3B,KAA9B;;AACA,QAAI,KAAKC,MAAT,EAAiB;AACf,aAAO,KAAKA,MAAL,CAAY2B,WAAZ,CAAwB,KAAKX,UAA7B,EAAyCY,IAAzC,CAA8CC,QAAQ,IAAI;AAC/D,eAAOH,cAAc,CAACG,QAAD,CAArB;AACD,OAFM,CAAP;AAGD;AACF;;AAED1B,EAAAA,sBAAsB,CAAC;AAAC2B,IAAAA;AAAD,GAAD,EAAU;AAC9B,UAAM;AAACC,MAAAA,kBAAkB,GAAG,MAAM,CAAE;AAA9B,QAAkC,KAAKhC,KAA7C;AACAgC,IAAAA,kBAAkB,CAACD,KAAD,CAAlB;AACD;;AAEDzB,EAAAA,sBAAsB,CAAC;AAACyB,IAAAA;AAAD,GAAD,EAAU;AAC9B,UAAM;AAACE,MAAAA,kBAAkB,GAAG,MAAM,CAAE;AAA9B,QAAkC,KAAKjC,KAA7C;AACAiC,IAAAA,kBAAkB,CAACF,KAAD,CAAlB;AACD;;AAEDxB,EAAAA,mBAAmB,CAAC;AAACwB,IAAAA;AAAD,GAAD,EAAU;AAC3B,UAAM;AAACG,MAAAA,eAAe,GAAG,MAAM,CAAE;AAA3B,QAA+B,KAAKlC,KAA1C;AACAkC,IAAAA,eAAe,CAACH,KAAD,CAAf;AACD;;AAEDI,EAAAA,MAAM,GAAG;AACP,UAAM;AACJC,MAAAA,UADI;AAEJC,MAAAA,UAFI;AAGJC,MAAAA,cAHI;AAIJC,MAAAA,mBAJI;AAKJC,MAAAA,MALI;AAMJC,MAAAA,OANI;AAOJC,MAAAA,mBAPI;AAQJC,MAAAA,kBARI;AASJC,MAAAA,kBATI;AAUJC,MAAAA;AAVI,QAWF,KAAK7C,KAXT;AAaA,UAAM;AAAC8C,MAAAA;AAAD,QAAc,KAAKC,OAAzB;AAEA,wBACE;AAAK,MAAA,SAAS,EAAEnD,KAAK,CAACoD;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAEpD,KAAK,CAACqD;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAErD,KAAK,CAACsD,kBAAtB;AAA0C,MAAA,GAAG,EAAEd;AAA/C,MADF,eAEE;AAAK,MAAA,SAAS,EAAExC,KAAK,CAACuD;AAAtB,OAA0CL,SAAS,CAAC,gBAAD,CAAnD,CAFF,eAGE;AAAK,MAAA,SAAS,EAAElD,KAAK,CAACwD,kBAAtB;AAA0C,MAAA,GAAG,EAAEf;AAA/C,MAHF,CADF,eAME;AAAK,MAAA,SAAS,EAAEzC,KAAK,CAACyD;AAAtB,oBACE;AAAI,MAAA,SAAS,EAAEzD,KAAK,CAAC0D;AAArB,MADF,eAEE;AAAK,MAAA,SAAS,EAAE1D,KAAK,CAAC2D;AAAtB,OAAiDjB,cAAjD,CAFF,eAGE;AAAI,MAAA,SAAS,EAAE1C,KAAK,CAAC0D;AAArB,MAHF,CANF,EAWGd,MAAM,gBAAG;AAAK,MAAA,SAAS,EAAE5C,KAAK,CAAC4D;AAAtB,YAAuChB,MAAvC,CAAH,GAA0D,IAXnE,EAYGC,OAAO,gBAAG;AAAK,MAAA,SAAS,EAAE7C,KAAK,CAAC6D;AAAtB,YAAwChB,OAAxC,CAAH,GAA4D,IAZtE,eAaE;AAAK,MAAA,SAAS,EAAE7C,KAAK,CAAC8D;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAE9D,KAAK,CAAC2C,mBAAtB;AAA2C,MAAA,GAAG,EAAEA;AAAhD,MADF,eAEE;AAAK,MAAA,SAAS,EAAE3C,KAAK,CAAC+D;AAAtB,OAA2Cb,SAAS,CAAC,iBAAD,CAApD,CAFF,CAbF,eAiBE;AAAK,MAAA,SAAS,EAAElD,KAAK,CAACgE;AAAtB,oBACE;AACE,MAAA,SAAS,EAAG,GAAEhE,KAAK,CAACqB,UAAW,IAAG0B,kBAAkB,IAAI/C,KAAK,CAACiE,cAAe,EAD/E;AAEE,MAAA,EAAE,EAAC;AAFL,MADF,CAjBF,eAuBE;AAAK,MAAA,SAAS,EAAEjE,KAAK,CAACgE;AAAtB,oBACE;AACE,MAAA,SAAS,EAAG,GAAEhE,KAAK,CAACuB,UAAW,IAAGyB,kBAAkB,IAAIhD,KAAK,CAACiE,cAAe,EAD/E;AAEE,MAAA,EAAE,EAAC;AAFL,MADF,eAKE;AACE,MAAA,SAAS,EAAG,GAAEjE,KAAK,CAACwB,OAAQ,IAAGyB,eAAe,IAAIjD,KAAK,CAACiE,cAAe,EADzE;AAEE,MAAA,EAAE,EAAC;AAFL,MALF,CAvBF,eAiCE;AAAK,MAAA,SAAS,EAAEjE,KAAK,CAACkE;AAAtB,OAA+ChB,SAAS,CAAC,yBAAD,CAAxD,CAjCF,eAkCE;AAAK,MAAA,SAAS,EAAElD,KAAK,CAACmE;AAAtB,oBACE;AACE,MAAA,SAAS,EAAEnE,KAAK,CAACoE,eADnB;AAEE,MAAA,IAAI,EAAC,QAFP;AAGE,MAAA,OAAO,EAAE,KAAKxD,YAHhB;AAIE,MAAA,QAAQ,EAAE,CAACkC;AAJb,OAMGI,SAAS,CAAC,qBAAD,CANZ,CADF,CAlCF,CADF;AA+CD;;AAzKuC;;gBAApCjD,W,kBAoBkB;AACpBiD,EAAAA,SAAS,EAAEnD,QAAQ,CAACsE,iBAAT,CAA2BnB;AADlB,C;;AApBlBjD,W,CACGqE,S,2CAAY;AACjB/D,EAAAA,eAAe,EAAET,SAAS,CAACyE,MAAV,CAAiBC,UADjB;AAEjBlE,EAAAA,cAAc,EAAER,SAAS,CAAC2E,IAAV,CAAeD,UAFd;AAGjBzC,EAAAA,cAAc,EAAEjC,SAAS,CAAC2E,IAAV,CAAeD,UAHd;AAIjBhC,EAAAA,UAAU,EAAE1C,SAAS,CAACyE,MAAV,CAAiBC,UAJZ;AAKjB/B,EAAAA,UAAU,EAAE3C,SAAS,CAACyE,MAAV,CAAiBC,UALZ;AAMjB9B,EAAAA,cAAc,EAAE5C,SAAS,CAACyE,MANT;AAOjB5B,EAAAA,mBAAmB,EAAE7C,SAAS,CAACyE,MAPd;AAQjB3B,EAAAA,MAAM,EAAE9C,SAAS,CAACyE,MARD;AASjB1B,EAAAA,OAAO,EAAE/C,SAAS,CAACyE,MATF;AAUjBnC,EAAAA,kBAAkB,EAAEtC,SAAS,CAAC2E,IAVb;AAWjB1B,EAAAA,kBAAkB,EAAEjD,SAAS,CAAC4E,IAXb;AAYjBrC,EAAAA,kBAAkB,EAAEvC,SAAS,CAAC2E,IAZb;AAajBzB,EAAAA,kBAAkB,EAAElD,SAAS,CAAC4E,IAbb;AAcjBpC,EAAAA,eAAe,EAAExC,SAAS,CAAC2E,IAdV;AAejBxB,EAAAA,eAAe,EAAEnD,SAAS,CAAC4E,IAfV;AAgBjB5B,EAAAA,mBAAmB,EAAEhD,SAAS,CAAC4E;AAhBd,C;AA2KrB,eAAezE,WAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass PaymentForm extends React.Component {\n  static propTypes = {\n    stripeKeyPublic: PropTypes.string.isRequired,\n    stripeInstance: PropTypes.func.isRequired,\n    onSubscription: PropTypes.func.isRequired,\n    checkImage: PropTypes.string.isRequired,\n    cardsImage: PropTypes.string.isRequired,\n    cardOwnerEmail: PropTypes.string,\n    securedPaymentImage: PropTypes.string,\n    errors: PropTypes.string,\n    warning: PropTypes.string,\n    onCardNumberChange: PropTypes.func,\n    cardNumberHasError: PropTypes.bool,\n    onCardExpiryChange: PropTypes.func,\n    cardExpiryHasError: PropTypes.bool,\n    onCardCvcChange: PropTypes.func,\n    cardCvcHasError: PropTypes.bool,\n    submitButtonEnabled: PropTypes.bool\n  };\n\n  static contextTypes = {\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n    this.stripe = props.stripeInstance ? props.stripeInstance(props.stripeKeyPublic) : null;\n    this.handleCardNumberChange = this.handleCardNumberChange.bind(this);\n    this.handleCardExpiryChange = this.handleCardExpiryChange.bind(this);\n    this.handleCardCvcChange = this.handleCardCvcChange.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n  }\n\n  componentDidMount() {\n    if (this.stripe) {\n      const elements = this.stripe.elements();\n\n      const elementOptions = {\n        style: {\n          base: {\n            iconStyle: 'solid',\n            color: '#546E7A',\n            fontSize: '16px',\n            fontFamily: '\"Gilroy\"',\n            '::placeholder': {\n              color: '#546E7A',\n              fontSize: '16px',\n              fontFamily: '\"Gilroy\"'\n            }\n          }\n        }\n      };\n\n      this.cardNumber = elements.create('cardNumber', elementOptions);\n      this.cardExpiry = elements.create('cardExpiry', elementOptions);\n      this.cardCvc = elements.create('cardCvc', elementOptions);\n\n      this.cardNumber.mount('#card-number');\n      this.cardExpiry.mount('#card-expiry');\n      this.cardCvc.mount('#card-cvc');\n\n      this.cardNumber.on('change', this.handleCardNumberChange);\n      this.cardExpiry.on('change', this.handleCardExpiryChange);\n      this.cardCvc.on('change', this.handleCardCvcChange);\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.cardNumer) {\n      this.cardNumber.unmount();\n      this.cardNumber.off('change', this.handleCardNumberChange);\n    }\n    if (this.cardExpiry) {\n      this.cardExpiry.unmount();\n      this.cardExpiry.off('change', this.handleCardExpiryChange);\n    }\n    if (this.cardCvc) {\n      this.cardCvc.unmount();\n      this.cardCvc.off('change', this.handleCardCvcChange);\n    }\n  }\n\n  handleSubmit() {\n    const {onSubscription} = this.props;\n    if (this.stripe) {\n      return this.stripe.createToken(this.cardNumber).then(response => {\n        return onSubscription(response);\n      });\n    }\n  }\n\n  handleCardNumberChange({error}) {\n    const {onCardNumberChange = () => {}} = this.props;\n    onCardNumberChange(error);\n  }\n\n  handleCardExpiryChange({error}) {\n    const {onCardExpiryChange = () => {}} = this.props;\n    onCardExpiryChange(error);\n  }\n\n  handleCardCvcChange({error}) {\n    const {onCardCvcChange = () => {}} = this.props;\n    onCardCvcChange(error);\n  }\n\n  render() {\n    const {\n      checkImage,\n      cardsImage,\n      cardOwnerEmail,\n      securedPaymentImage,\n      errors,\n      warning,\n      submitButtonEnabled,\n      cardNumberHasError,\n      cardExpiryHasError,\n      cardCvcHasError\n    } = this.props;\n\n    const {translate} = this.context;\n\n    return (\n      <div className={style.paymentForm}>\n        <div className={style.acceptedCards}>\n          <img className={style.acceptedCardsCheck} src={checkImage} />\n          <div className={style.acceptedCardsText}>{translate('accepted_cards')}</div>\n          <img className={style.acceptedCardsImage} src={cardsImage} />\n        </div>\n        <div className={style.creditCardOwnerEmail}>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n          <div className={style.creditCardOwnerEmailText}>{cardOwnerEmail}</div>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n        </div>\n        {errors ? <div className={style.paymentErrors}>-{errors}</div> : null}\n        {warning ? <div className={style.paymentWarning}>-{warning}</div> : null}\n        <div className={style.securedPayment}>\n          <img className={style.securedPaymentImage} src={securedPaymentImage} />\n          <div className={style.securedPaymentText}>{translate('secured_payment')}</div>\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardNumber} ${cardNumberHasError && style.invalidElement}`}\n            id=\"card-number\"\n          />\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardExpiry} ${cardExpiryHasError && style.invalidElement}`}\n            id=\"card-expiry\"\n          />\n          <div\n            className={`${style.cardCvc} ${cardCvcHasError && style.invalidElement}`}\n            id=\"card-cvc\"\n          />\n        </div>\n        <div className={style.subscriptionDisclaimer}>{translate('subscription_disclaimer')}</div>\n        <div className={style.subscribeButtonContainer}>\n          <button\n            className={style.subscribeButton}\n            type=\"button\"\n            onClick={this.handleSubmit}\n            disabled={!submitButtonEnabled}\n          >\n            {translate('payment_form_submit')}\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default PaymentForm;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/payment-form/index.js"],"names":["React","PropTypes","Provider","style","PaymentForm","Component","constructor","props","stripe","stripeInstance","stripeKeyPublic","handleCardNumberChange","bind","handleCardExpiryChange","handleCardCvcChange","handleSubmit","componentDidMount","elements","elementOptions","base","iconStyle","color","fontSize","fontFamily","cardNumber","create","cardExpiry","cardCvc","mount","on","componentWillUnmount","cardNumer","unmount","off","onSubscription","createToken","then","response","error","onCardNumberChange","onCardExpiryChange","onCardCvcChange","render","checkImage","cardsImage","cardOwnerEmail","securedPaymentImage","errors","warning","submitButtonEnabled","cardNumberHasError","cardExpiryHasError","cardCvcHasError","translate","context","paymentForm","acceptedCards","acceptedCardsCheck","acceptedCardsText","acceptedCardsImage","creditCardOwnerEmail","creditCardOwnerEmailSeparator","creditCardOwnerEmailText","paymentErrors","paymentWarning","securedPayment","securedPaymentText","cardBlock","invalidElement","subscriptionDisclaimer","subscribeButtonContainer","subscribeButton","childContextTypes","propTypes","string","isRequired","func","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass PaymentForm extends React.Component {\n  static propTypes = {\n    stripeKeyPublic: PropTypes.string.isRequired,\n    stripeInstance: PropTypes.func.isRequired,\n    onSubscription: PropTypes.func.isRequired,\n    checkImage: PropTypes.string.isRequired,\n    cardsImage: PropTypes.string.isRequired,\n    cardOwnerEmail: PropTypes.string,\n    securedPaymentImage: PropTypes.string,\n    errors: PropTypes.string,\n    warning: PropTypes.string,\n    onCardNumberChange: PropTypes.func,\n    cardNumberHasError: PropTypes.bool,\n    onCardExpiryChange: PropTypes.func,\n    cardExpiryHasError: PropTypes.bool,\n    onCardCvcChange: PropTypes.func,\n    cardCvcHasError: PropTypes.bool,\n    submitButtonEnabled: PropTypes.bool\n  };\n\n  static contextTypes = {\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n    this.stripe = props.stripeInstance ? props.stripeInstance(props.stripeKeyPublic) : null;\n    this.handleCardNumberChange = this.handleCardNumberChange.bind(this);\n    this.handleCardExpiryChange = this.handleCardExpiryChange.bind(this);\n    this.handleCardCvcChange = this.handleCardCvcChange.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n  }\n\n  componentDidMount() {\n    if (this.stripe) {\n      const elements = this.stripe.elements();\n\n      const elementOptions = {\n        style: {\n          base: {\n            iconStyle: 'solid',\n            color: '#546E7A',\n            fontSize: '16px',\n            fontFamily: 'Gilroy',\n            '::placeholder': {\n              color: '#546E7A',\n              fontSize: '16px',\n              fontFamily: 'Gilroy'\n            }\n          }\n        }\n      };\n\n      this.cardNumber = elements.create('cardNumber', elementOptions);\n      this.cardExpiry = elements.create('cardExpiry', elementOptions);\n      this.cardCvc = elements.create('cardCvc', elementOptions);\n\n      this.cardNumber.mount('#card-number');\n      this.cardExpiry.mount('#card-expiry');\n      this.cardCvc.mount('#card-cvc');\n\n      this.cardNumber.on('change', this.handleCardNumberChange);\n      this.cardExpiry.on('change', this.handleCardExpiryChange);\n      this.cardCvc.on('change', this.handleCardCvcChange);\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.cardNumer) {\n      this.cardNumber.unmount();\n      this.cardNumber.off('change', this.handleCardNumberChange);\n    }\n    if (this.cardExpiry) {\n      this.cardExpiry.unmount();\n      this.cardExpiry.off('change', this.handleCardExpiryChange);\n    }\n    if (this.cardCvc) {\n      this.cardCvc.unmount();\n      this.cardCvc.off('change', this.handleCardCvcChange);\n    }\n  }\n\n  handleSubmit() {\n    const {onSubscription} = this.props;\n    if (this.stripe) {\n      return this.stripe.createToken(this.cardNumber).then(response => {\n        return onSubscription(response);\n      });\n    }\n  }\n\n  handleCardNumberChange({error}) {\n    const {onCardNumberChange = () => {}} = this.props;\n    onCardNumberChange(error);\n  }\n\n  handleCardExpiryChange({error}) {\n    const {onCardExpiryChange = () => {}} = this.props;\n    onCardExpiryChange(error);\n  }\n\n  handleCardCvcChange({error}) {\n    const {onCardCvcChange = () => {}} = this.props;\n    onCardCvcChange(error);\n  }\n\n  render() {\n    const {\n      checkImage,\n      cardsImage,\n      cardOwnerEmail,\n      securedPaymentImage,\n      errors,\n      warning,\n      submitButtonEnabled,\n      cardNumberHasError,\n      cardExpiryHasError,\n      cardCvcHasError\n    } = this.props;\n\n    const {translate} = this.context;\n\n    return (\n      <div className={style.paymentForm}>\n        <div className={style.acceptedCards}>\n          <img className={style.acceptedCardsCheck} src={checkImage} />\n          <div className={style.acceptedCardsText}>{translate('accepted_cards')}</div>\n          <img className={style.acceptedCardsImage} src={cardsImage} />\n        </div>\n        <div className={style.creditCardOwnerEmail}>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n          <div className={style.creditCardOwnerEmailText}>{cardOwnerEmail}</div>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n        </div>\n        {errors ? <div className={style.paymentErrors}>-{errors}</div> : null}\n        {warning ? <div className={style.paymentWarning}>-{warning}</div> : null}\n        <div className={style.securedPayment}>\n          <img className={style.securedPaymentImage} src={securedPaymentImage} />\n          <div className={style.securedPaymentText}>{translate('secured_payment')}</div>\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardNumber} ${cardNumberHasError && style.invalidElement}`}\n            id=\"card-number\"\n          />\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardExpiry} ${cardExpiryHasError && style.invalidElement}`}\n            id=\"card-expiry\"\n          />\n          <div\n            className={`${style.cardCvc} ${cardCvcHasError && style.invalidElement}`}\n            id=\"card-cvc\"\n          />\n        </div>\n        <div className={style.subscriptionDisclaimer}>{translate('subscription_disclaimer')}</div>\n        <div className={style.subscribeButtonContainer}>\n          <button\n            className={style.subscribeButton}\n            type=\"button\"\n            onClick={this.handleSubmit}\n            disabled={!submitButtonEnabled}\n          >\n            {translate('payment_form_submit')}\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default PaymentForm;\n"],"file":"index.js"}

package/lib/molecule/course-section/index.js

@@ -0,0 +1,72 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _cardImagePreview = _interopRequireDefault(require("../../atom/card-image-preview"));
+
+var _contentBadge = _interopRequireDefault(require("../../atom/content-badge"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const CourseSection = props => {
+  const {
+    image,
+    contentBadge: {
+      category,
+      label
+    },
+    title,
+    author,
+    position,
+    'aria-label': {
+      title: ariaLabelTitle,
+      author: ariaLabelAuthor
+    }
+  } = props;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.container,
+    "aria-label": ariaLabelTitle,
+    "data-name": `course-section-${position}`
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: _style.default.position
+  }, position), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.containerImage
+  }, /*#__PURE__*/_react.default.createElement(_cardImagePreview.default, {
+    image: image
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.containerInfos
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.containerMainInfos
+  }, /*#__PURE__*/_react.default.createElement(_contentBadge.default, {
+    className: _style.default.contentBadge,
+    category: category,
+    label: label
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.title
+  }, title)), /*#__PURE__*/_react.default.createElement("span", {
+    className: _style.default.author,
+    "aria-label": ariaLabelAuthor
+  }, author)));
+};
+
+CourseSection.propTypes = process.env.NODE_ENV !== "production" ? {
+  'aria-label': _propTypes.default.shape({
+    title: _propTypes.default.string,
+    author: _propTypes.default.string
+  }),
+  image: _propTypes.default.string,
+  contentBadge: _propTypes.default.shape(_contentBadge.default.propTypes),
+  title: _propTypes.default.string,
+  author: _propTypes.default.string,
+  position: _propTypes.default.number
+} : {};
+var _default = CourseSection;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/molecule/course-section/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/molecule/course-section/index.js"],"names":["CourseSection","props","image","contentBadge","category","label","title","author","position","ariaLabelTitle","ariaLabelAuthor","style","container","containerImage","containerInfos","containerMainInfos","propTypes","PropTypes","shape","string","ContentBadge","number"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,aAAa,GAAGC,KAAK,IAAI;AAC7B,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,YAAY,EAAE;AAACC,MAAAA,QAAD;AAAWC,MAAAA;AAAX,KAFV;AAGJC,IAAAA,KAHI;AAIJC,IAAAA,MAJI;AAKJC,IAAAA,QALI;AAMJ,kBAAc;AAACF,MAAAA,KAAK,EAAEG,cAAR;AAAwBF,MAAAA,MAAM,EAAEG;AAAhC;AANV,MAOFT,KAPJ;AAQA,sBACE;AACE,IAAA,SAAS,EAAEU,eAAMC,SADnB;AAEE,kBAAYH,cAFd;AAGE,iBAAY,kBAAiBD,QAAS;AAHxC,kBAKE;AAAM,IAAA,SAAS,EAAEG,eAAMH;AAAvB,KAAkCA,QAAlC,CALF,eAME;AAAK,IAAA,SAAS,EAAEG,eAAME;AAAtB,kBACE,6BAAC,yBAAD;AAAkB,IAAA,KAAK,EAAEX;AAAzB,IADF,CANF,eASE;AAAK,IAAA,SAAS,EAAES,eAAMG;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAEH,eAAMI;AAAtB,kBACE,6BAAC,qBAAD;AAAc,IAAA,SAAS,EAAEJ,eAAMR,YAA/B;AAA6C,IAAA,QAAQ,EAAEC,QAAvD;AAAiE,IAAA,KAAK,EAAEC;AAAxE,IADF,eAEE;AAAK,IAAA,SAAS,EAAEM,eAAML;AAAtB,KAA8BA,KAA9B,CAFF,CADF,eAKE;AAAM,IAAA,SAAS,EAAEK,eAAMJ,MAAvB;AAA+B,kBAAYG;AAA3C,KACGH,MADH,CALF,CATF,CADF;AAqBD,CA9BD;;AAgCAP,aAAa,CAACgB,SAAd,2CAA0B;AACxB,gBAAcC,mBAAUC,KAAV,CAAgB;AAC5BZ,IAAAA,KAAK,EAAEW,mBAAUE,MADW;AAE5BZ,IAAAA,MAAM,EAAEU,mBAAUE;AAFU,GAAhB,CADU;AAKxBjB,EAAAA,KAAK,EAAEe,mBAAUE,MALO;AAMxBhB,EAAAA,YAAY,EAAEc,mBAAUC,KAAV,CAAgBE,sBAAaJ,SAA7B,CANU;AAOxBV,EAAAA,KAAK,EAAEW,mBAAUE,MAPO;AAQxBZ,EAAAA,MAAM,EAAEU,mBAAUE,MARM;AASxBX,EAAAA,QAAQ,EAAES,mBAAUI;AATI,CAA1B;eAYerB,a","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport CardImagePreview from '../../atom/card-image-preview';\nimport ContentBadge from '../../atom/content-badge';\nimport style from './style.css';\n\nconst CourseSection = props => {\n  const {\n    image,\n    contentBadge: {category, label},\n    title,\n    author,\n    position,\n    'aria-label': {title: ariaLabelTitle, author: ariaLabelAuthor}\n  } = props;\n  return (\n    <div\n      className={style.container}\n      aria-label={ariaLabelTitle}\n      data-name={`course-section-${position}`}\n    >\n      <span className={style.position}>{position}</span>\n      <div className={style.containerImage}>\n        <CardImagePreview image={image} />\n      </div>\n      <div className={style.containerInfos}>\n        <div className={style.containerMainInfos}>\n          <ContentBadge className={style.contentBadge} category={category} label={label} />\n          <div className={style.title}>{title}</div>\n        </div>\n        <span className={style.author} aria-label={ariaLabelAuthor}>\n          {author}\n        </span>\n      </div>\n    </div>\n  );\n};\n\nCourseSection.propTypes = {\n  'aria-label': PropTypes.shape({\n    title: PropTypes.string,\n    author: PropTypes.string\n  }),\n  image: PropTypes.string,\n  contentBadge: PropTypes.shape(ContentBadge.propTypes),\n  title: PropTypes.string,\n  author: PropTypes.string,\n  position: PropTypes.number\n};\n\nexport default CourseSection;\n"],"file":"index.js"}

package/lib/molecule/course-section/style.css

@@ -0,0 +1,65 @@
+@value colors: "../../variables/colors.css";
+@value cm_grey_50 from colors;
+@value cm_grey_900 from colors;
+@value cm_grey_500 from colors;
+@value cm_grey_400 from colors;
+
+.container {
+    align-items: center;
+    background-color: cm_grey_50;
+    border-radius: 7px;
+    display: flex;
+    font-size: 14px;
+    justify-content: start;
+    margin-top: 8px;
+    padding: 8px 16px;
+}
+
+.containerInfos {
+    margin-left: 16px;
+    overflow: hidden;
+}
+
+.containerMainInfos {
+    display: flex;
+    align-items: center;
+}
+
+.title {
+    color: cm_grey_900;
+    line-height: 22px;
+    font-family: Gilroy;
+    font-size: 16px;
+    font-weight: bold;
+    margin-left: 4px;
+    overflow:hidden;
+    white-space:nowrap;
+    display:inline-block;
+    text-overflow:ellipsis;
+}
+
+.author {
+    color: cm_grey_500;
+    display: block;
+    font-family: Gilroy;
+    line-height: 20px;
+}
+
+.position {
+    color: cm_grey_400;
+    font-family: Gilroy;
+    font-weight: 600;
+    line-height: 20px;
+    margin: 0 12px 0 14px;
+}
+
+.contentBadge {
+    font-size: 8px;
+    font-weight: bold;
+    line-height: 10px;;
+}
+
+.containerImage {
+    min-height: 56px;
+    min-width: 56px;
+}

package/lib/molecule/course-section/test/fixtures/chapter.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    'aria-label': {
+      title: 'aria label title',
+      author: 'aria label author'
+    },
+    title: 'Social networks',
+    author: 'Author',
+    image: 'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',
+    contentBadge: {
+      label: 'chapter',
+      category: 'chapter'
+    },
+    position: 2
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=chapter.js.map

package/lib/molecule/course-section/test/fixtures/chapter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/molecule/course-section/test/fixtures/chapter.js"],"names":["props","title","author","image","contentBadge","label","category","position"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc;AACZC,MAAAA,KAAK,EAAE,kBADK;AAEZC,MAAAA,MAAM,EAAE;AAFI,KADT;AAKLD,IAAAA,KAAK,EAAE,iBALF;AAMLC,IAAAA,MAAM,EAAE,QANH;AAOLC,IAAAA,KAAK,EACH,4LARG;AASLC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE,SADK;AAEZC,MAAAA,QAAQ,EAAE;AAFE,KATT;AAaLC,IAAAA,QAAQ,EAAE;AAbL;AADM,C","sourcesContent":["export default {\n  props: {\n    'aria-label': {\n      title: 'aria label title',\n      author: 'aria label author'\n    },\n    title: 'Social networks',\n    author: 'Author',\n    image:\n      'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',\n    contentBadge: {\n      label: 'chapter',\n      category: 'chapter'\n    },\n    position: 2\n  }\n};\n"],"file":"chapter.js"}

package/lib/molecule/course-section/test/fixtures/course.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    'aria-label': {
+      title: 'aria label title',
+      author: 'aria label author'
+    },
+    title: 'Marketing and online advertising Marketing and online advertising Marketing and online advertising Marketing and online advertising',
+    author: 'Author',
+    image: 'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',
+    contentBadge: {
+      label: 'course',
+      category: 'course'
+    },
+    position: 1
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=course.js.map

package/lib/molecule/course-section/test/fixtures/course.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/molecule/course-section/test/fixtures/course.js"],"names":["props","title","author","image","contentBadge","label","category","position"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACL,kBAAc;AACZC,MAAAA,KAAK,EAAE,kBADK;AAEZC,MAAAA,MAAM,EAAE;AAFI,KADT;AAKLD,IAAAA,KAAK,EACH,qIANG;AAOLC,IAAAA,MAAM,EAAE,QAPH;AAQLC,IAAAA,KAAK,EACH,4LATG;AAULC,IAAAA,YAAY,EAAE;AACZC,MAAAA,KAAK,EAAE,QADK;AAEZC,MAAAA,QAAQ,EAAE;AAFE,KAVT;AAcLC,IAAAA,QAAQ,EAAE;AAdL;AADM,C","sourcesContent":["export default {\n  props: {\n    'aria-label': {\n      title: 'aria label title',\n      author: 'aria label author'\n    },\n    title:\n      'Marketing and online advertising Marketing and online advertising Marketing and online advertising Marketing and online advertising',\n    author: 'Author',\n    image:\n      'https://api.coorpacademy.com/api-service/medias?url=https://static.coorpacademy.com/content/partner-wedemain/fr/medias/img/cover/shutterstock_248741149-1470302136299.jpg&h=500&w=500&q=90',\n    contentBadge: {\n      label: 'course',\n      category: 'course'\n    },\n    position: 1\n  }\n};\n"],"file":"course.js"}

package/lib/molecule/feedback/style.css

@@ -40,7 +40,6 @@
   margin-right: 32px;
   font-family: 'Gilroy';
   font-size: 13px;
-  font-weight: bold;
   letter-spacing: -0.1px;
   text-align: left;
   color: dark;

package/lib/molecule/payment-form/index.js

@@ -34,11 +34,11 @@ class PaymentForm extends _react.default.Component {
             iconStyle: 'solid',
             color: '#546E7A',
             fontSize: '16px',
-            fontFamily: '"Gilroy"',
+            fontFamily: 'Gilroy',
             '::placeholder': {
               color: '#546E7A',
               fontSize: '16px',
-              fontFamily: '"Gilroy"'
+              fontFamily: 'Gilroy'
             }
           }
         }

package/lib/molecule/payment-form/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/payment-form/index.js"],"names":["PaymentForm","React","Component","constructor","props","stripe","stripeInstance","stripeKeyPublic","handleCardNumberChange","bind","handleCardExpiryChange","handleCardCvcChange","handleSubmit","componentDidMount","elements","elementOptions","style","base","iconStyle","color","fontSize","fontFamily","cardNumber","create","cardExpiry","cardCvc","mount","on","componentWillUnmount","cardNumer","unmount","off","onSubscription","createToken","then","response","error","onCardNumberChange","onCardExpiryChange","onCardCvcChange","render","checkImage","cardsImage","cardOwnerEmail","securedPaymentImage","errors","warning","submitButtonEnabled","cardNumberHasError","cardExpiryHasError","cardCvcHasError","translate","context","paymentForm","acceptedCards","acceptedCardsCheck","acceptedCardsText","acceptedCardsImage","creditCardOwnerEmail","creditCardOwnerEmailSeparator","creditCardOwnerEmailText","paymentErrors","paymentWarning","securedPayment","securedPaymentText","cardBlock","invalidElement","subscriptionDisclaimer","subscribeButtonContainer","subscribeButton","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","func","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass PaymentForm extends React.Component {\n  static propTypes = {\n    stripeKeyPublic: PropTypes.string.isRequired,\n    stripeInstance: PropTypes.func.isRequired,\n    onSubscription: PropTypes.func.isRequired,\n    checkImage: PropTypes.string.isRequired,\n    cardsImage: PropTypes.string.isRequired,\n    cardOwnerEmail: PropTypes.string,\n    securedPaymentImage: PropTypes.string,\n    errors: PropTypes.string,\n    warning: PropTypes.string,\n    onCardNumberChange: PropTypes.func,\n    cardNumberHasError: PropTypes.bool,\n    onCardExpiryChange: PropTypes.func,\n    cardExpiryHasError: PropTypes.bool,\n    onCardCvcChange: PropTypes.func,\n    cardCvcHasError: PropTypes.bool,\n    submitButtonEnabled: PropTypes.bool\n  };\n\n  static contextTypes = {\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n    this.stripe = props.stripeInstance ? props.stripeInstance(props.stripeKeyPublic) : null;\n    this.handleCardNumberChange = this.handleCardNumberChange.bind(this);\n    this.handleCardExpiryChange = this.handleCardExpiryChange.bind(this);\n    this.handleCardCvcChange = this.handleCardCvcChange.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n  }\n\n  componentDidMount() {\n    if (this.stripe) {\n      const elements = this.stripe.elements();\n\n      const elementOptions = {\n        style: {\n          base: {\n            iconStyle: 'solid',\n            color: '#546E7A',\n            fontSize: '16px',\n            fontFamily: '\"Gilroy\"',\n            '::placeholder': {\n              color: '#546E7A',\n              fontSize: '16px',\n              fontFamily: '\"Gilroy\"'\n            }\n          }\n        }\n      };\n\n      this.cardNumber = elements.create('cardNumber', elementOptions);\n      this.cardExpiry = elements.create('cardExpiry', elementOptions);\n      this.cardCvc = elements.create('cardCvc', elementOptions);\n\n      this.cardNumber.mount('#card-number');\n      this.cardExpiry.mount('#card-expiry');\n      this.cardCvc.mount('#card-cvc');\n\n      this.cardNumber.on('change', this.handleCardNumberChange);\n      this.cardExpiry.on('change', this.handleCardExpiryChange);\n      this.cardCvc.on('change', this.handleCardCvcChange);\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.cardNumer) {\n      this.cardNumber.unmount();\n      this.cardNumber.off('change', this.handleCardNumberChange);\n    }\n    if (this.cardExpiry) {\n      this.cardExpiry.unmount();\n      this.cardExpiry.off('change', this.handleCardExpiryChange);\n    }\n    if (this.cardCvc) {\n      this.cardCvc.unmount();\n      this.cardCvc.off('change', this.handleCardCvcChange);\n    }\n  }\n\n  handleSubmit() {\n    const {onSubscription} = this.props;\n    if (this.stripe) {\n      return this.stripe.createToken(this.cardNumber).then(response => {\n        return onSubscription(response);\n      });\n    }\n  }\n\n  handleCardNumberChange({error}) {\n    const {onCardNumberChange = () => {}} = this.props;\n    onCardNumberChange(error);\n  }\n\n  handleCardExpiryChange({error}) {\n    const {onCardExpiryChange = () => {}} = this.props;\n    onCardExpiryChange(error);\n  }\n\n  handleCardCvcChange({error}) {\n    const {onCardCvcChange = () => {}} = this.props;\n    onCardCvcChange(error);\n  }\n\n  render() {\n    const {\n      checkImage,\n      cardsImage,\n      cardOwnerEmail,\n      securedPaymentImage,\n      errors,\n      warning,\n      submitButtonEnabled,\n      cardNumberHasError,\n      cardExpiryHasError,\n      cardCvcHasError\n    } = this.props;\n\n    const {translate} = this.context;\n\n    return (\n      <div className={style.paymentForm}>\n        <div className={style.acceptedCards}>\n          <img className={style.acceptedCardsCheck} src={checkImage} />\n          <div className={style.acceptedCardsText}>{translate('accepted_cards')}</div>\n          <img className={style.acceptedCardsImage} src={cardsImage} />\n        </div>\n        <div className={style.creditCardOwnerEmail}>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n          <div className={style.creditCardOwnerEmailText}>{cardOwnerEmail}</div>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n        </div>\n        {errors ? <div className={style.paymentErrors}>-{errors}</div> : null}\n        {warning ? <div className={style.paymentWarning}>-{warning}</div> : null}\n        <div className={style.securedPayment}>\n          <img className={style.securedPaymentImage} src={securedPaymentImage} />\n          <div className={style.securedPaymentText}>{translate('secured_payment')}</div>\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardNumber} ${cardNumberHasError && style.invalidElement}`}\n            id=\"card-number\"\n          />\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardExpiry} ${cardExpiryHasError && style.invalidElement}`}\n            id=\"card-expiry\"\n          />\n          <div\n            className={`${style.cardCvc} ${cardCvcHasError && style.invalidElement}`}\n            id=\"card-cvc\"\n          />\n        </div>\n        <div className={style.subscriptionDisclaimer}>{translate('subscription_disclaimer')}</div>\n        <div className={style.subscribeButtonContainer}>\n          <button\n            className={style.subscribeButton}\n            type=\"button\"\n            onClick={this.handleSubmit}\n            disabled={!submitButtonEnabled}\n          >\n            {translate('payment_form_submit')}\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default PaymentForm;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/payment-form/index.js"],"names":["PaymentForm","React","Component","constructor","props","stripe","stripeInstance","stripeKeyPublic","handleCardNumberChange","bind","handleCardExpiryChange","handleCardCvcChange","handleSubmit","componentDidMount","elements","elementOptions","style","base","iconStyle","color","fontSize","fontFamily","cardNumber","create","cardExpiry","cardCvc","mount","on","componentWillUnmount","cardNumer","unmount","off","onSubscription","createToken","then","response","error","onCardNumberChange","onCardExpiryChange","onCardCvcChange","render","checkImage","cardsImage","cardOwnerEmail","securedPaymentImage","errors","warning","submitButtonEnabled","cardNumberHasError","cardExpiryHasError","cardCvcHasError","translate","context","paymentForm","acceptedCards","acceptedCardsCheck","acceptedCardsText","acceptedCardsImage","creditCardOwnerEmail","creditCardOwnerEmailSeparator","creditCardOwnerEmailText","paymentErrors","paymentWarning","securedPayment","securedPaymentText","cardBlock","invalidElement","subscriptionDisclaimer","subscribeButtonContainer","subscribeButton","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","func","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass PaymentForm extends React.Component {\n  static propTypes = {\n    stripeKeyPublic: PropTypes.string.isRequired,\n    stripeInstance: PropTypes.func.isRequired,\n    onSubscription: PropTypes.func.isRequired,\n    checkImage: PropTypes.string.isRequired,\n    cardsImage: PropTypes.string.isRequired,\n    cardOwnerEmail: PropTypes.string,\n    securedPaymentImage: PropTypes.string,\n    errors: PropTypes.string,\n    warning: PropTypes.string,\n    onCardNumberChange: PropTypes.func,\n    cardNumberHasError: PropTypes.bool,\n    onCardExpiryChange: PropTypes.func,\n    cardExpiryHasError: PropTypes.bool,\n    onCardCvcChange: PropTypes.func,\n    cardCvcHasError: PropTypes.bool,\n    submitButtonEnabled: PropTypes.bool\n  };\n\n  static contextTypes = {\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n    this.stripe = props.stripeInstance ? props.stripeInstance(props.stripeKeyPublic) : null;\n    this.handleCardNumberChange = this.handleCardNumberChange.bind(this);\n    this.handleCardExpiryChange = this.handleCardExpiryChange.bind(this);\n    this.handleCardCvcChange = this.handleCardCvcChange.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n  }\n\n  componentDidMount() {\n    if (this.stripe) {\n      const elements = this.stripe.elements();\n\n      const elementOptions = {\n        style: {\n          base: {\n            iconStyle: 'solid',\n            color: '#546E7A',\n            fontSize: '16px',\n            fontFamily: 'Gilroy',\n            '::placeholder': {\n              color: '#546E7A',\n              fontSize: '16px',\n              fontFamily: 'Gilroy'\n            }\n          }\n        }\n      };\n\n      this.cardNumber = elements.create('cardNumber', elementOptions);\n      this.cardExpiry = elements.create('cardExpiry', elementOptions);\n      this.cardCvc = elements.create('cardCvc', elementOptions);\n\n      this.cardNumber.mount('#card-number');\n      this.cardExpiry.mount('#card-expiry');\n      this.cardCvc.mount('#card-cvc');\n\n      this.cardNumber.on('change', this.handleCardNumberChange);\n      this.cardExpiry.on('change', this.handleCardExpiryChange);\n      this.cardCvc.on('change', this.handleCardCvcChange);\n    }\n  }\n\n  componentWillUnmount() {\n    if (this.cardNumer) {\n      this.cardNumber.unmount();\n      this.cardNumber.off('change', this.handleCardNumberChange);\n    }\n    if (this.cardExpiry) {\n      this.cardExpiry.unmount();\n      this.cardExpiry.off('change', this.handleCardExpiryChange);\n    }\n    if (this.cardCvc) {\n      this.cardCvc.unmount();\n      this.cardCvc.off('change', this.handleCardCvcChange);\n    }\n  }\n\n  handleSubmit() {\n    const {onSubscription} = this.props;\n    if (this.stripe) {\n      return this.stripe.createToken(this.cardNumber).then(response => {\n        return onSubscription(response);\n      });\n    }\n  }\n\n  handleCardNumberChange({error}) {\n    const {onCardNumberChange = () => {}} = this.props;\n    onCardNumberChange(error);\n  }\n\n  handleCardExpiryChange({error}) {\n    const {onCardExpiryChange = () => {}} = this.props;\n    onCardExpiryChange(error);\n  }\n\n  handleCardCvcChange({error}) {\n    const {onCardCvcChange = () => {}} = this.props;\n    onCardCvcChange(error);\n  }\n\n  render() {\n    const {\n      checkImage,\n      cardsImage,\n      cardOwnerEmail,\n      securedPaymentImage,\n      errors,\n      warning,\n      submitButtonEnabled,\n      cardNumberHasError,\n      cardExpiryHasError,\n      cardCvcHasError\n    } = this.props;\n\n    const {translate} = this.context;\n\n    return (\n      <div className={style.paymentForm}>\n        <div className={style.acceptedCards}>\n          <img className={style.acceptedCardsCheck} src={checkImage} />\n          <div className={style.acceptedCardsText}>{translate('accepted_cards')}</div>\n          <img className={style.acceptedCardsImage} src={cardsImage} />\n        </div>\n        <div className={style.creditCardOwnerEmail}>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n          <div className={style.creditCardOwnerEmailText}>{cardOwnerEmail}</div>\n          <hr className={style.creditCardOwnerEmailSeparator} />\n        </div>\n        {errors ? <div className={style.paymentErrors}>-{errors}</div> : null}\n        {warning ? <div className={style.paymentWarning}>-{warning}</div> : null}\n        <div className={style.securedPayment}>\n          <img className={style.securedPaymentImage} src={securedPaymentImage} />\n          <div className={style.securedPaymentText}>{translate('secured_payment')}</div>\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardNumber} ${cardNumberHasError && style.invalidElement}`}\n            id=\"card-number\"\n          />\n        </div>\n        <div className={style.cardBlock}>\n          <div\n            className={`${style.cardExpiry} ${cardExpiryHasError && style.invalidElement}`}\n            id=\"card-expiry\"\n          />\n          <div\n            className={`${style.cardCvc} ${cardCvcHasError && style.invalidElement}`}\n            id=\"card-cvc\"\n          />\n        </div>\n        <div className={style.subscriptionDisclaimer}>{translate('subscription_disclaimer')}</div>\n        <div className={style.subscribeButtonContainer}>\n          <button\n            className={style.subscribeButton}\n            type=\"button\"\n            onClick={this.handleSubmit}\n            disabled={!submitButtonEnabled}\n          >\n            {translate('payment_form_submit')}\n          </button>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default PaymentForm;\n"],"file":"index.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "10.4.6-alpha.1+fff4dc5c2",
+  "version": "10.5.0",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -119,5 +119,5 @@
     "webpack-hot-middleware": "^2.25.0"
   },
   "author": "CoorpAcademy",
-  "gitHead": "fff4dc5c21579939a230b5fa17a9afb1ce6a6619"
+  "gitHead": "c0f3db57cfe696e68a169ac013b8c71d209a00d6"
 }