@coorpacademy/components 11.14.19 → 11.14.20

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

@@ -33,10 +33,10 @@
     font-family: Gilroy;
     font-size: 16px;
     font-weight: bold;
-    overflow:hidden;
-    white-space:nowrap;
-    display:inline-block;
-    text-overflow:ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    display: inline-block;
+    text-overflow: ellipsis;
     width: 100%;
 }
 
@@ -59,5 +59,3 @@
     min-height: 56px;
     min-width: 56px;
 }
-
-

package/es/molecule/draggable/style.css

@@ -13,15 +13,18 @@
   background: transparent;
   margin: 8px 0;
   border-radius: 7px;
-  transform:translate(0,0);
+  transform: translate(0, 0);
   z-index: 0;
 }
-.draggable:hover{
+
+.draggable:hover {
   background: rgba(0, 0, 0, 0.3);
 }
-.draggable:active{
+
+.draggable:active {
   background: transparent;
 }
+
 .draggable:before {
   content: '.';
   position: absolute;
@@ -32,9 +35,10 @@
   font-size: 25px;
   color: medium;
   pointer-events: none;
-  text-shadow: 0 0 medium,    0 5px medium,    0 10px medium,    0 15px medium,
-            5px 0 medium ,   5px 5px medium,  5px 10px medium,  5px 15px medium;
+  text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium,
+    5px 0 medium, 5px 5px medium, 5px 10px medium, 5px 15px medium;
 }
+
 .dragging {
   background: rgba(0, 0, 0, 0.1);
 }

package/es/molecule/draggable-list/index.d.ts

@@ -6,7 +6,7 @@ declare function DraggableList({ items, onDrop, itemType }: {
 }): JSX.Element;
 declare namespace DraggableList {
     namespace propTypes {
-        const items: PropTypes.Requireable<(PropTypes.InferProps<{
+        const items: PropTypes.Requireable<(NonNullable<PropTypes.InferProps<{
             title: PropTypes.Validator<string>;
             onUp: PropTypes.Requireable<(...args: any[]) => any>;
             onDown: PropTypes.Requireable<(...args: any[]) => any>;
@@ -43,7 +43,55 @@ declare namespace DraggableList {
                 }> | null | undefined)[]>;
                 onChange: PropTypes.Requireable<(...args: any[]) => any>;
             }>>;
-        }> | null | undefined)[]>;
+        }> | PropTypes.InferProps<{
+            'aria-label': PropTypes.Requireable<PropTypes.InferProps<{
+                title: PropTypes.Requireable<string>;
+                author: PropTypes.Requireable<string>;
+                modules: PropTypes.Requireable<string>;
+                position: PropTypes.Requireable<string>;
+            }>>;
+            image: PropTypes.Requireable<string>;
+            badgeList: PropTypes.Requireable<(PropTypes.InferProps<{
+                category: PropTypes.Requireable<string>;
+                label: PropTypes.Requireable<string>;
+            }> | null | undefined)[]>;
+            title: PropTypes.Requireable<string>;
+            author: PropTypes.Requireable<string>;
+            position: PropTypes.Requireable<number>;
+            id: PropTypes.Requireable<string>;
+        }> | PropTypes.InferProps<{
+            bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
+                buttonAriaLabel: PropTypes.Requireable<string>;
+                menuAriaLabel: PropTypes.Requireable<string>;
+                buttons: PropTypes.Requireable<(PropTypes.InferProps<{
+                    'data-name': PropTypes.Requireable<string>;
+                    label: PropTypes.Requireable<string>;
+                    type: PropTypes.Requireable<string>;
+                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
+                }> | null | undefined)[]>;
+                onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            }>>;
+            buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
+                type: PropTypes.Requireable<string>;
+                label: PropTypes.Requireable<string>;
+                ariaLabel: PropTypes.Requireable<string>;
+                dataName: PropTypes.Requireable<string>;
+                icon: PropTypes.Requireable<PropTypes.InferProps<{
+                    position: PropTypes.Requireable<string>;
+                    type: PropTypes.Requireable<string>;
+                }>>;
+                onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            }>>;
+            tags: PropTypes.Requireable<(PropTypes.InferProps<{
+                label: PropTypes.Requireable<string>;
+                type: PropTypes.Requireable<string>;
+            }> | null | undefined)[]>;
+            title: PropTypes.Validator<string>;
+            order: PropTypes.Requireable<number>;
+            'aria-label': PropTypes.Requireable<string>;
+            contentType: PropTypes.Requireable<string>;
+            id: PropTypes.Requireable<string>;
+        }> | null | undefined> | null | undefined)[]>;
         const onDrop: PropTypes.Requireable<(...args: any[]) => any>;
         const itemType: PropTypes.Requireable<string>;
     }

package/es/molecule/draggable-list/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAQA;;;;gBAmDC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAaA;;;;gBAmDC"}

package/es/molecule/draggable-list/index.js

@@ -5,9 +5,11 @@ import PropTypes from 'prop-types';
 import Draggable from '../draggable';
 import SetupSection from '../setup-section';
 import CourseSection from '../course-section';
+import ListItem from '../../organism/list-item';
 const ITEMS = {
   'setup-section': SetupSection,
-  'course-section': CourseSection
+  'course-section': CourseSection,
+  'list-item': ListItem
 };
 
 const DraggableList = ({
@@ -33,7 +35,7 @@ const DraggableList = ({
     setDragFrom(null);
   }, [onDrop, setDragTo, setDragFrom, dragFrom]);
   const Item = ITEMS[itemType];
-  const itemsView = items.map(item => /*#__PURE__*/React.createElement(Draggable, {
+  const itemsView = items.map((item, index) => /*#__PURE__*/React.createElement(Draggable, {
     key: item.id,
     id: item.id,
     dragging: dragTo === item.id,
@@ -42,13 +44,14 @@ const DraggableList = ({
     onDragLeave: dragLeaveHandler,
     onDrop: dropHandler
   }, /*#__PURE__*/React.createElement(Item, _extends({}, item, {
-    key: item.id
+    key: item.id,
+    order: index
   }))));
   return /*#__PURE__*/React.createElement("div", null, itemsView);
 };
 
 DraggableList.propTypes = process.env.NODE_ENV !== "production" ? {
-  items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),
+  items: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape(SetupSection.propTypes), PropTypes.shape(CourseSection.propTypes), PropTypes.shape(ListItem.propTypes)])),
   onDrop: PropTypes.func,
   itemType: PropTypes.string
 } : {};

package/es/molecule/draggable-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","CourseSection","ITEMS","DraggableList","items","onDrop","itemType","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","propTypes","arrayOf","shape","func","string"],"sources":["../../../src/molecule/draggable-list/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\nimport CourseSection from '../course-section';\n\nconst ITEMS = {'setup-section': SetupSection, 'course-section': CourseSection};\n\nconst DraggableList = ({items, onDrop, itemType}) => {\n  const [dragTo, setDragTo] = useState(null);\n  const [dragFrom, setDragFrom] = useState(null);\n\n  const dragStartHandler = useCallback(\n    id => {\n      setDragFrom(id);\n    },\n    [setDragFrom]\n  );\n\n  const dragOverHandler = useCallback(\n    id => {\n      if (dragTo === id) return;\n      setDragTo(id);\n    },\n    [dragTo, setDragTo]\n  );\n\n  const dragLeaveHandler = useCallback(\n    id => {\n      setDragTo(null);\n    },\n    [setDragTo]\n  );\n\n  const dropHandler = useCallback(\n    id => {\n      if (onDrop && dragFrom) onDrop(dragFrom, id);\n\n      setDragTo(null);\n      setDragFrom(null);\n    },\n    [onDrop, setDragTo, setDragFrom, dragFrom]\n  );\n\n  const Item = ITEMS[itemType];\n  const itemsView = items.map(item => (\n    <Draggable\n      key={item.id}\n      id={item.id}\n      dragging={dragTo === item.id}\n      onDragStart={dragStartHandler}\n      onDragOver={dragOverHandler}\n      onDragLeave={dragLeaveHandler}\n      onDrop={dropHandler}\n    >\n      <Item {...item} key={item.id} />\n    </Draggable>\n  ));\n  return <div>{itemsView}</div>;\n};\n\nDraggableList.propTypes = {\n  items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),\n  onDrop: PropTypes.func,\n  itemType: PropTypes.string\n};\n\nexport default DraggableList;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AAEA,MAAMC,KAAK,GAAG;EAAC,iBAAiBF,YAAlB;EAAgC,kBAAkBC;AAAlD,CAAd;;AAEA,MAAME,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBZ,QAAQ,CAAC,IAAD,CAApC;EACA,MAAM,CAACa,QAAD,EAAWC,WAAX,IAA0Bd,QAAQ,CAAC,IAAD,CAAxC;EAEA,MAAMe,gBAAgB,GAAGd,WAAW,CAClCe,EAAE,IAAI;IACJF,WAAW,CAACE,EAAD,CAAX;EACD,CAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;EAOA,MAAMG,eAAe,GAAGhB,WAAW,CACjCe,EAAE,IAAI;IACJ,IAAIL,MAAM,KAAKK,EAAf,EAAmB;IACnBJ,SAAS,CAACI,EAAD,CAAT;EACD,CAJgC,EAKjC,CAACL,MAAD,EAASC,SAAT,CALiC,CAAnC;EAQA,MAAMM,gBAAgB,GAAGjB,WAAW,CAClCe,EAAE,IAAI;IACJJ,SAAS,CAAC,IAAD,CAAT;EACD,CAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;EAOA,MAAMO,WAAW,GAAGlB,WAAW,CAC7Be,EAAE,IAAI;IACJ,IAAIP,MAAM,IAAII,QAAd,EAAwBJ,MAAM,CAACI,QAAD,EAAWG,EAAX,CAAN;IAExBJ,SAAS,CAAC,IAAD,CAAT;IACAE,WAAW,CAAC,IAAD,CAAX;EACD,CAN4B,EAO7B,CAACL,MAAD,EAASG,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;EAUA,MAAMO,IAAI,GAAGd,KAAK,CAACI,QAAD,CAAlB;EACA,MAAMW,SAAS,GAAGb,KAAK,CAACc,GAAN,CAAUC,IAAI,iBAC9B,oBAAC,SAAD;IACE,GAAG,EAAEA,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEL,MAAM,KAAKY,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAED,gBAJf;IAKE,UAAU,EAAEE,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,oBAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP;EAA1B,GATF,CADgB,CAAlB;EAaA,oBAAO,iCAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAd,aAAa,CAACiB,SAAd,2CAA0B;EACxBhB,KAAK,EAAEN,SAAS,CAACuB,OAAV,CAAkBvB,SAAS,CAACwB,KAAV,CAAgBtB,YAAY,CAACoB,SAA7B,CAAlB,CADiB;EAExBf,MAAM,EAAEP,SAAS,CAACyB,IAFM;EAGxBjB,QAAQ,EAAER,SAAS,CAAC0B;AAHI,CAA1B;AAMA,eAAerB,aAAf"}
+{"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","CourseSection","ListItem","ITEMS","DraggableList","items","onDrop","itemType","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","index","propTypes","arrayOf","oneOfType","shape","func","string"],"sources":["../../../src/molecule/draggable-list/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\nimport CourseSection from '../course-section';\nimport ListItem from '../../organism/list-item';\n\nconst ITEMS = {\n  'setup-section': SetupSection,\n  'course-section': CourseSection,\n  'list-item': ListItem\n};\n\nconst DraggableList = ({items, onDrop, itemType}) => {\n  const [dragTo, setDragTo] = useState(null);\n  const [dragFrom, setDragFrom] = useState(null);\n\n  const dragStartHandler = useCallback(\n    id => {\n      setDragFrom(id);\n    },\n    [setDragFrom]\n  );\n\n  const dragOverHandler = useCallback(\n    id => {\n      if (dragTo === id) return;\n      setDragTo(id);\n    },\n    [dragTo, setDragTo]\n  );\n\n  const dragLeaveHandler = useCallback(\n    id => {\n      setDragTo(null);\n    },\n    [setDragTo]\n  );\n\n  const dropHandler = useCallback(\n    id => {\n      if (onDrop && dragFrom) onDrop(dragFrom, id);\n\n      setDragTo(null);\n      setDragFrom(null);\n    },\n    [onDrop, setDragTo, setDragFrom, dragFrom]\n  );\n\n  const Item = ITEMS[itemType];\n  const itemsView = items.map((item, index) => (\n    <Draggable\n      key={item.id}\n      id={item.id}\n      dragging={dragTo === item.id}\n      onDragStart={dragStartHandler}\n      onDragOver={dragOverHandler}\n      onDragLeave={dragLeaveHandler}\n      onDrop={dropHandler}\n    >\n      <Item {...item} key={item.id} order={index} />\n    </Draggable>\n  ));\n  return <div>{itemsView}</div>;\n};\n\nDraggableList.propTypes = {\n  items: PropTypes.arrayOf(\n    PropTypes.oneOfType([\n      PropTypes.shape(SetupSection.propTypes),\n      PropTypes.shape(CourseSection.propTypes),\n      PropTypes.shape(ListItem.propTypes)\n    ])\n  ),\n  onDrop: PropTypes.func,\n  itemType: PropTypes.string\n};\n\nexport default DraggableList;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,QAAP,MAAqB,0BAArB;AAEA,MAAMC,KAAK,GAAG;EACZ,iBAAiBH,YADL;EAEZ,kBAAkBC,aAFN;EAGZ,aAAaC;AAHD,CAAd;;AAMA,MAAME,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBb,QAAQ,CAAC,IAAD,CAApC;EACA,MAAM,CAACc,QAAD,EAAWC,WAAX,IAA0Bf,QAAQ,CAAC,IAAD,CAAxC;EAEA,MAAMgB,gBAAgB,GAAGf,WAAW,CAClCgB,EAAE,IAAI;IACJF,WAAW,CAACE,EAAD,CAAX;EACD,CAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;EAOA,MAAMG,eAAe,GAAGjB,WAAW,CACjCgB,EAAE,IAAI;IACJ,IAAIL,MAAM,KAAKK,EAAf,EAAmB;IACnBJ,SAAS,CAACI,EAAD,CAAT;EACD,CAJgC,EAKjC,CAACL,MAAD,EAASC,SAAT,CALiC,CAAnC;EAQA,MAAMM,gBAAgB,GAAGlB,WAAW,CAClCgB,EAAE,IAAI;IACJJ,SAAS,CAAC,IAAD,CAAT;EACD,CAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;EAOA,MAAMO,WAAW,GAAGnB,WAAW,CAC7BgB,EAAE,IAAI;IACJ,IAAIP,MAAM,IAAII,QAAd,EAAwBJ,MAAM,CAACI,QAAD,EAAWG,EAAX,CAAN;IAExBJ,SAAS,CAAC,IAAD,CAAT;IACAE,WAAW,CAAC,IAAD,CAAX;EACD,CAN4B,EAO7B,CAACL,MAAD,EAASG,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;EAUA,MAAMO,IAAI,GAAGd,KAAK,CAACI,QAAD,CAAlB;EACA,MAAMW,SAAS,GAAGb,KAAK,CAACc,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,kBAC1B,oBAAC,SAAD;IACE,GAAG,EAAED,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEL,MAAM,KAAKY,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAED,gBAJf;IAKE,UAAU,EAAEE,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,oBAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP,EAA1B;IAA8B,KAAK,EAAEQ;EAArC,GATF,CADgB,CAAlB;EAaA,oBAAO,iCAAMH,SAAN,CAAP;AACD,CAnDD;;AAqDAd,aAAa,CAACkB,SAAd,2CAA0B;EACxBjB,KAAK,EAAEP,SAAS,CAACyB,OAAV,CACLzB,SAAS,CAAC0B,SAAV,CAAoB,CAClB1B,SAAS,CAAC2B,KAAV,CAAgBzB,YAAY,CAACsB,SAA7B,CADkB,EAElBxB,SAAS,CAAC2B,KAAV,CAAgBxB,aAAa,CAACqB,SAA9B,CAFkB,EAGlBxB,SAAS,CAAC2B,KAAV,CAAgBvB,QAAQ,CAACoB,SAAzB,CAHkB,CAApB,CADK,CADiB;EAQxBhB,MAAM,EAAER,SAAS,CAAC4B,IARM;EASxBnB,QAAQ,EAAET,SAAS,CAAC6B;AATI,CAA1B;AAYA,eAAevB,aAAf"}

package/es/organism/list-item/index.d.ts

@@ -32,6 +32,7 @@ declare namespace ListItem {
         order: PropTypes.Requireable<number>;
         'aria-label': PropTypes.Requireable<string>;
         contentType: PropTypes.Requireable<string>;
+        id: PropTypes.Requireable<string>;
     };
 }
 import PropTypes from "prop-types";

package/es/organism/list-item/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";AAQA,mDA4CC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";AAQA,mDA8CC"}

package/es/organism/list-item/index.js

@@ -32,10 +32,10 @@ const ListItem = props => {
     className: style.wrapper
   }, isPublished && contentType === 'certification' ? /*#__PURE__*/React.createElement("div", {
     className: style.orderWrapper
-  }, /*#__PURE__*/React.createElement("div", {
+  }, order !== null && order !== undefined ? /*#__PURE__*/React.createElement("div", {
     className: style.order,
     "aria-label": ariaLabel
-  }, order + 1), /*#__PURE__*/React.createElement("div", {
+  }, order + 1) : null, /*#__PURE__*/React.createElement("div", {
     className: style.title,
     title: title
   }, title)) : /*#__PURE__*/React.createElement("div", {
@@ -78,7 +78,8 @@ ListItem.propTypes = process.env.NODE_ENV !== "production" ? {
   title: PropTypes.string.isRequired,
   order: PropTypes.number,
   'aria-label': PropTypes.string,
-  contentType: PropTypes.string
+  contentType: PropTypes.string,
+  id: PropTypes.string
 } : {};
 export default ListItem;
 //# sourceMappingURL=index.js.map

package/es/organism/list-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","Tag","ButtonLink","BulletPointMenuButton","style","ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","wrapper","orderWrapper","settings","edit","propTypes","shape","buttonAriaLabel","string","menuAriaLabel","buttons","arrayOf","label","onClick","func","dataName","icon","position","oneOf","isRequired","number"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\nimport style from './style.css';\n\nconst ListItem = props => {\n  let isPublished = false;\n  const {\n    bulletPointMenuButton,\n    buttonLink,\n    tags,\n    title,\n    order,\n    'aria-label': ariaLabel,\n    contentType\n  } = props;\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'published';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n  return (\n    <div className={style.wrapper}>\n      {isPublished && contentType === 'certification' ? (\n        <div className={style.orderWrapper}>\n          <div className={style.order} aria-label={ariaLabel}>\n            {order + 1}\n          </div>\n          <div className={style.title} title={title}>\n            {title}\n          </div>\n        </div>\n      ) : (\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n      )}\n      <div className={style.settings}>\n        {tagsView}\n        <div className={style.edit}>\n          <ButtonLink {...buttonLink} />\n        </div>\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['published', 'draft', 'archived', 'revised', 'default'])\n    })\n  ),\n  title: PropTypes.string.isRequired,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,GAAP,MAAgB,gBAAhB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,qBAAP,MAAkC,yCAAlC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,IAAIC,WAAW,GAAG,KAAlB;EACA,MAAM;IACJC,qBADI;IAEJC,UAFI;IAGJC,IAHI;IAIJC,KAJI;IAKJC,KALI;IAMJ,cAAcC,SANV;IAOJC;EAPI,IAQFR,KARJ;;EASA,MAAMS,QAAQ,GAAG,KAAIC,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EAA0B,CAACC,GAAD,EAAMC,KAAN,KAAgB;IACzDZ,WAAW,GAAGW,GAAG,CAACE,IAAJ,KAAa,WAA3B;IACA,oBACE;MAAK,GAAG,EAAED,KAAV;MAAiB,SAAS,EAAEf,KAAK,CAACc;IAAlC,gBACE,oBAAC,GAAD,EAASA,GAAT,CADF,CADF;EAKD,CAPgB,EAOdR,IAPc,CAAjB;;EAQA,oBACE;IAAK,SAAS,EAAEN,KAAK,CAACiB;EAAtB,GACGd,WAAW,IAAIO,WAAW,KAAK,eAA/B,gBACC;IAAK,SAAS,EAAEV,KAAK,CAACkB;EAAtB,gBACE;IAAK,SAAS,EAAElB,KAAK,CAACQ,KAAtB;IAA6B,cAAYC;EAAzC,GACGD,KAAK,GAAG,CADX,CADF,eAIE;IAAK,SAAS,EAAER,KAAK,CAACO,KAAtB;IAA6B,KAAK,EAAEA;EAApC,GACGA,KADH,CAJF,CADD,gBAUC;IAAK,SAAS,EAAEP,KAAK,CAACO,KAAtB;IAA6B,KAAK,EAAEA;EAApC,GACGA,KADH,CAXJ,eAeE;IAAK,SAAS,EAAEP,KAAK,CAACmB;EAAtB,GACGR,QADH,eAEE;IAAK,SAAS,EAAEX,KAAK,CAACoB;EAAtB,gBACE,oBAAC,UAAD,EAAgBf,UAAhB,CADF,CAFF,eAKE,oBAAC,qBAAD,EAA2BD,qBAA3B,CALF,CAfF,CADF;AAyBD,CA5CD;;AA8CAH,QAAQ,CAACoB,SAAT,2CAAqB;EACnBjB,qBAAqB,EAAER,SAAS,CAAC0B,KAAV,CAAgB;IACrCC,eAAe,EAAE3B,SAAS,CAAC4B,MADU;IAErCC,aAAa,EAAE7B,SAAS,CAAC4B,MAFY;IAGrCE,OAAO,EAAE9B,SAAS,CAAC+B,OAAV,CACP/B,SAAS,CAAC0B,KAAV,CAAgB;MACd,aAAa1B,SAAS,CAAC4B,MADT;MAEdI,KAAK,EAAEhC,SAAS,CAAC4B,MAFH;MAGdR,IAAI,EAAEpB,SAAS,CAAC4B,MAHF;MAIdK,OAAO,EAAEjC,SAAS,CAACkC;IAJL,CAAhB,CADO,CAH4B;IAWrCD,OAAO,EAAEjC,SAAS,CAACkC;EAXkB,CAAhB,CADJ;EAcnBzB,UAAU,EAAET,SAAS,CAAC0B,KAAV,CAAgB;IAC1BN,IAAI,EAAEpB,SAAS,CAAC4B,MADU;IAE1BI,KAAK,EAAEhC,SAAS,CAAC4B,MAFS;IAG1Bf,SAAS,EAAEb,SAAS,CAAC4B,MAHK;IAI1BO,QAAQ,EAAEnC,SAAS,CAAC4B,MAJM;IAK1BQ,IAAI,EAAEpC,SAAS,CAAC0B,KAAV,CAAgB;MACpBW,QAAQ,EAAErC,SAAS,CAAC4B,MADA;MAEpBR,IAAI,EAAEpB,SAAS,CAAC4B;IAFI,CAAhB,CALoB;IAS1BK,OAAO,EAAEjC,SAAS,CAACkC;EATO,CAAhB,CAdO;EAyBnBxB,IAAI,EAAEV,SAAS,CAAC+B,OAAV,CACJ/B,SAAS,CAAC0B,KAAV,CAAgB;IACdM,KAAK,EAAEhC,SAAS,CAAC4B,MADH;IAEdR,IAAI,EAAEpB,SAAS,CAACsC,KAAV,CAAgB,CAAC,WAAD,EAAc,OAAd,EAAuB,UAAvB,EAAmC,SAAnC,EAA8C,SAA9C,CAAhB;EAFQ,CAAhB,CADI,CAzBa;EA+BnB3B,KAAK,EAAEX,SAAS,CAAC4B,MAAV,CAAiBW,UA/BL;EAgCnB3B,KAAK,EAAEZ,SAAS,CAACwC,MAhCE;EAiCnB,cAAcxC,SAAS,CAAC4B,MAjCL;EAkCnBd,WAAW,EAAEd,SAAS,CAAC4B;AAlCJ,CAArB;AAqCA,eAAevB,QAAf"}
+{"version":3,"file":"index.js","names":["React","PropTypes","Tag","ButtonLink","BulletPointMenuButton","style","ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","wrapper","orderWrapper","undefined","settings","edit","propTypes","shape","buttonAriaLabel","string","menuAriaLabel","buttons","arrayOf","label","onClick","func","dataName","icon","position","oneOf","isRequired","number","id"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\nimport style from './style.css';\n\nconst ListItem = props => {\n  let isPublished = false;\n  const {\n    bulletPointMenuButton,\n    buttonLink,\n    tags,\n    title,\n    order,\n    'aria-label': ariaLabel,\n    contentType\n  } = props;\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'published';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n  return (\n    <div className={style.wrapper}>\n      {isPublished && contentType === 'certification' ? (\n        <div className={style.orderWrapper}>\n          {order !== null && order !== undefined ? (\n            <div className={style.order} aria-label={ariaLabel}>\n              {order + 1}\n            </div>\n          ) : null}\n          <div className={style.title} title={title}>\n            {title}\n          </div>\n        </div>\n      ) : (\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n      )}\n      <div className={style.settings}>\n        {tagsView}\n        <div className={style.edit}>\n          <ButtonLink {...buttonLink} />\n        </div>\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['published', 'draft', 'archived', 'revised', 'default'])\n    })\n  ),\n  title: PropTypes.string.isRequired,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string,\n  id: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,OAAOC,GAAP,MAAgB,gBAAhB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,qBAAP,MAAkC,yCAAlC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAI;EACxB,IAAIC,WAAW,GAAG,KAAlB;EACA,MAAM;IACJC,qBADI;IAEJC,UAFI;IAGJC,IAHI;IAIJC,KAJI;IAKJC,KALI;IAMJ,cAAcC,SANV;IAOJC;EAPI,IAQFR,KARJ;;EASA,MAAMS,QAAQ,GAAG,KAAIC,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EAA0B,CAACC,GAAD,EAAMC,KAAN,KAAgB;IACzDZ,WAAW,GAAGW,GAAG,CAACE,IAAJ,KAAa,WAA3B;IACA,oBACE;MAAK,GAAG,EAAED,KAAV;MAAiB,SAAS,EAAEf,KAAK,CAACc;IAAlC,gBACE,oBAAC,GAAD,EAASA,GAAT,CADF,CADF;EAKD,CAPgB,EAOdR,IAPc,CAAjB;;EAQA,oBACE;IAAK,SAAS,EAAEN,KAAK,CAACiB;EAAtB,GACGd,WAAW,IAAIO,WAAW,KAAK,eAA/B,gBACC;IAAK,SAAS,EAAEV,KAAK,CAACkB;EAAtB,GACGV,KAAK,KAAK,IAAV,IAAkBA,KAAK,KAAKW,SAA5B,gBACC;IAAK,SAAS,EAAEnB,KAAK,CAACQ,KAAtB;IAA6B,cAAYC;EAAzC,GACGD,KAAK,GAAG,CADX,CADD,GAIG,IALN,eAME;IAAK,SAAS,EAAER,KAAK,CAACO,KAAtB;IAA6B,KAAK,EAAEA;EAApC,GACGA,KADH,CANF,CADD,gBAYC;IAAK,SAAS,EAAEP,KAAK,CAACO,KAAtB;IAA6B,KAAK,EAAEA;EAApC,GACGA,KADH,CAbJ,eAiBE;IAAK,SAAS,EAAEP,KAAK,CAACoB;EAAtB,GACGT,QADH,eAEE;IAAK,SAAS,EAAEX,KAAK,CAACqB;EAAtB,gBACE,oBAAC,UAAD,EAAgBhB,UAAhB,CADF,CAFF,eAKE,oBAAC,qBAAD,EAA2BD,qBAA3B,CALF,CAjBF,CADF;AA2BD,CA9CD;;AAgDAH,QAAQ,CAACqB,SAAT,2CAAqB;EACnBlB,qBAAqB,EAAER,SAAS,CAAC2B,KAAV,CAAgB;IACrCC,eAAe,EAAE5B,SAAS,CAAC6B,MADU;IAErCC,aAAa,EAAE9B,SAAS,CAAC6B,MAFY;IAGrCE,OAAO,EAAE/B,SAAS,CAACgC,OAAV,CACPhC,SAAS,CAAC2B,KAAV,CAAgB;MACd,aAAa3B,SAAS,CAAC6B,MADT;MAEdI,KAAK,EAAEjC,SAAS,CAAC6B,MAFH;MAGdT,IAAI,EAAEpB,SAAS,CAAC6B,MAHF;MAIdK,OAAO,EAAElC,SAAS,CAACmC;IAJL,CAAhB,CADO,CAH4B;IAWrCD,OAAO,EAAElC,SAAS,CAACmC;EAXkB,CAAhB,CADJ;EAcnB1B,UAAU,EAAET,SAAS,CAAC2B,KAAV,CAAgB;IAC1BP,IAAI,EAAEpB,SAAS,CAAC6B,MADU;IAE1BI,KAAK,EAAEjC,SAAS,CAAC6B,MAFS;IAG1BhB,SAAS,EAAEb,SAAS,CAAC6B,MAHK;IAI1BO,QAAQ,EAAEpC,SAAS,CAAC6B,MAJM;IAK1BQ,IAAI,EAAErC,SAAS,CAAC2B,KAAV,CAAgB;MACpBW,QAAQ,EAAEtC,SAAS,CAAC6B,MADA;MAEpBT,IAAI,EAAEpB,SAAS,CAAC6B;IAFI,CAAhB,CALoB;IAS1BK,OAAO,EAAElC,SAAS,CAACmC;EATO,CAAhB,CAdO;EAyBnBzB,IAAI,EAAEV,SAAS,CAACgC,OAAV,CACJhC,SAAS,CAAC2B,KAAV,CAAgB;IACdM,KAAK,EAAEjC,SAAS,CAAC6B,MADH;IAEdT,IAAI,EAAEpB,SAAS,CAACuC,KAAV,CAAgB,CAAC,WAAD,EAAc,OAAd,EAAuB,UAAvB,EAAmC,SAAnC,EAA8C,SAA9C,CAAhB;EAFQ,CAAhB,CADI,CAzBa;EA+BnB5B,KAAK,EAAEX,SAAS,CAAC6B,MAAV,CAAiBW,UA/BL;EAgCnB5B,KAAK,EAAEZ,SAAS,CAACyC,MAhCE;EAiCnB,cAAczC,SAAS,CAAC6B,MAjCL;EAkCnBf,WAAW,EAAEd,SAAS,CAAC6B,MAlCJ;EAmCnBa,EAAE,EAAE1C,SAAS,CAAC6B;AAnCK,CAArB;AAsCA,eAAexB,QAAf"}

package/es/organism/list-item/style.css

@@ -33,17 +33,17 @@
   text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
- 
+
 }
 
 .settings {
   align-items: center;
   display: flex;
-  height: 100%; 
+  height: 100%;
 }
 
 .tag {
-  margin: 0 16px 0 0; 
+  margin: 0 16px 0 0;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -64,8 +64,10 @@
   color: cm_grey_400;
   margin: 0 16px 0 0;
 }
+
 .orderWrapper {
   align-items: center;
   display: flex;
   width: 100%;
-}
+  margin-left: 24px;
+}

package/es/organism/list-items/index.d.ts

@@ -47,38 +47,6 @@ declare namespace ListItems {
             error: PropTypes.Requireable<string>;
             theme: PropTypes.Requireable<string>;
         }>>;
-        items: PropTypes.Requireable<(PropTypes.InferProps<{
-            bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
-                buttonAriaLabel: PropTypes.Requireable<string>;
-                menuAriaLabel: PropTypes.Requireable<string>;
-                buttons: PropTypes.Requireable<(PropTypes.InferProps<{
-                    'data-name': PropTypes.Requireable<string>;
-                    label: PropTypes.Requireable<string>;
-                    type: PropTypes.Requireable<string>;
-                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                }> | null | undefined)[]>;
-                onClick: PropTypes.Requireable<(...args: any[]) => any>;
-            }>>;
-            buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
-                type: PropTypes.Requireable<string>;
-                label: PropTypes.Requireable<string>;
-                ariaLabel: PropTypes.Requireable<string>;
-                dataName: PropTypes.Requireable<string>;
-                icon: PropTypes.Requireable<PropTypes.InferProps<{
-                    position: PropTypes.Requireable<string>;
-                    type: PropTypes.Requireable<string>;
-                }>>;
-                onClick: PropTypes.Requireable<(...args: any[]) => any>;
-            }>>;
-            tags: PropTypes.Requireable<(PropTypes.InferProps<{
-                label: PropTypes.Requireable<string>;
-                type: PropTypes.Requireable<string>;
-            }> | null | undefined)[]>;
-            title: PropTypes.Validator<string>;
-            order: PropTypes.Requireable<number>;
-            'aria-label': PropTypes.Requireable<string>;
-            contentType: PropTypes.Requireable<string>;
-        }> | null | undefined)[]>;
         content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
             items: PropTypes.Requireable<(PropTypes.InferProps<{
                 bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
@@ -111,9 +79,12 @@ declare namespace ListItems {
                 order: PropTypes.Requireable<number>;
                 'aria-label': PropTypes.Requireable<string>;
                 contentType: PropTypes.Requireable<string>;
+                id: PropTypes.Requireable<string>;
             }> | null | undefined)[]>;
             type: PropTypes.Requireable<string>;
             itemType: PropTypes.Requireable<string>;
+            onDrop: PropTypes.Requireable<(...args: any[]) => any>;
+            isDraggable: PropTypes.Requireable<boolean>;
         }> | PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             columns: PropTypes.Requireable<(PropTypes.InferProps<{

package/es/organism/list-items/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAoCA;;;;;;gBAwBC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AA8CA;;;;;;gBAwBC"}

package/es/organism/list-items/index.js

@@ -3,6 +3,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 import React from 'react';
 import PropTypes from 'prop-types';
 import ListItem from '../list-item';
+import DraggableList from '../../molecule/draggable-list';
 import Title from '../../atom/title';
 import ButtonLink from '../../atom/button-link';
 import SelectMultiple from '../../molecule/select-multiple';
@@ -12,14 +13,22 @@ import style from './style.css';
 const buildListItemsView = (content, ariaLabel, selectMultiple) => {
   const {
     items,
-    itemType
+    itemType,
+    onDrop,
+    isDraggable = false
   } = content;
-  const itemsView = items.map((item, index) => /*#__PURE__*/React.createElement("li", {
+  const itemsView = isDraggable && items.length > 1 ? /*#__PURE__*/React.createElement(DraggableList, {
+    items: items.map(item => _extends({}, item, {
+      contentType: itemType
+    })),
+    itemType: "list-item",
+    onDrop: onDrop
+  }) : items.map((item, index) => /*#__PURE__*/React.createElement("li", {
     key: item.id,
     className: style.item,
     "data-name": `content-${index}`
   }, /*#__PURE__*/React.createElement(ListItem, _extends({}, item, {
-    order: index,
+    order: null,
     contentType: itemType
   }))));
   return /*#__PURE__*/React.createElement("ul", {
@@ -72,11 +81,12 @@ ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
   'aria-label': PropTypes.string,
   buttonLink: PropTypes.shape(ButtonLink.propTypes),
   selectMultiple: PropTypes.shape(SelectMultiple.propTypes),
-  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),
   content: PropTypes.oneOfType([PropTypes.shape({
     items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),
     type: PropTypes.oneOf(['list']),
-    itemType: PropTypes.string
+    itemType: PropTypes.string,
+    onDrop: PropTypes.func,
+    isDraggable: PropTypes.bool
   }), PropTypes.shape(_extends({}, ExpandibleActionableTable.propTypes, {
     type: PropTypes.oneOf(['expandible-actionable-table'])
   }))]),

package/es/organism/list-items/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","ListItem","Title","ButtonLink","SelectMultiple","ExpandibleActionableTable","style","buildListItemsView","content","ariaLabel","selectMultiple","items","itemType","itemsView","map","item","index","id","list","listWithSelectMultiple","buildContentView","type","ListItems","title","buttonLink","contentView","header","actionsWrapper","buttonCreate","propTypes","string","shape","arrayOf","oneOfType","oneOf"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport SelectMultiple from '../../molecule/select-multiple';\nimport ExpandibleActionableTable from '../../molecule/expandible-actionable-table';\nimport style from './style.css';\n\nconst buildListItemsView = (content, ariaLabel, selectMultiple) => {\n  const {items, itemType} = content;\n  const itemsView = items.map((item, index) => (\n    <li key={item.id} className={style.item} data-name={`content-${index}`}>\n      <ListItem {...item} order={index} contentType={itemType} />\n    </li>\n  ));\n  return (\n    <ul\n      className={!selectMultiple ? style.list : style.listWithSelectMultiple}\n      aria-label={ariaLabel}\n      data-name={'content-list'}\n    >\n      {itemsView}\n    </ul>\n  );\n};\nconst buildContentView = (content, ariaLabel, selectMultiple) => {\n  const {type} = content;\n  switch (type) {\n    case 'list':\n      return buildListItemsView(content, ariaLabel, selectMultiple);\n    case 'expandible-actionable-table':\n      return <ExpandibleActionableTable {...content} />;\n  }\n};\n\nconst ListItems = ({title, buttonLink, selectMultiple, content, 'aria-label': ariaLabel}) => {\n  const contentView = buildContentView(content, ariaLabel, selectMultiple);\n\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.actionsWrapper}>\n          {selectMultiple ? (\n            <div className={style.selectMultiple}>\n              <SelectMultiple {...selectMultiple} />\n            </div>\n          ) : null}\n\n          <div className={style.buttonCreate}>\n            <ButtonLink {...buttonLink} />\n          </div>\n        </div>\n      </div>\n      {contentView}\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  selectMultiple: PropTypes.shape(SelectMultiple.propTypes),\n  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n      type: PropTypes.oneOf(['list']),\n      itemType: PropTypes.string\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      type: PropTypes.oneOf(['expandible-actionable-table'])\n    })\n  ]),\n  title: PropTypes.string\n};\n\nexport default ListItems;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","ListItem","DraggableList","Title","ButtonLink","SelectMultiple","ExpandibleActionableTable","style","buildListItemsView","content","ariaLabel","selectMultiple","items","itemType","onDrop","isDraggable","itemsView","length","map","item","contentType","index","id","list","listWithSelectMultiple","buildContentView","type","ListItems","title","buttonLink","contentView","header","actionsWrapper","buttonCreate","propTypes","string","shape","oneOfType","arrayOf","oneOf","func","bool"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport DraggableList from '../../molecule/draggable-list';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport SelectMultiple from '../../molecule/select-multiple';\nimport ExpandibleActionableTable from '../../molecule/expandible-actionable-table';\nimport style from './style.css';\n\nconst buildListItemsView = (content, ariaLabel, selectMultiple) => {\n  const {items, itemType, onDrop, isDraggable = false} = content;\n  const itemsView =\n    isDraggable && items.length > 1 ? (\n      <DraggableList\n        items={items.map(item => ({...item, contentType: itemType}))}\n        itemType=\"list-item\"\n        onDrop={onDrop}\n      />\n    ) : (\n      items.map((item, index) => (\n        <li key={item.id} className={style.item} data-name={`content-${index}`}>\n          <ListItem {...item} order={null} contentType={itemType} />\n        </li>\n      ))\n    );\n  return (\n    <ul\n      className={!selectMultiple ? style.list : style.listWithSelectMultiple}\n      aria-label={ariaLabel}\n      data-name={'content-list'}\n    >\n      {itemsView}\n    </ul>\n  );\n};\nconst buildContentView = (content, ariaLabel, selectMultiple) => {\n  const {type} = content;\n  switch (type) {\n    case 'list':\n      return buildListItemsView(content, ariaLabel, selectMultiple);\n    case 'expandible-actionable-table':\n      return <ExpandibleActionableTable {...content} />;\n  }\n};\n\nconst ListItems = ({title, buttonLink, selectMultiple, content, 'aria-label': ariaLabel}) => {\n  const contentView = buildContentView(content, ariaLabel, selectMultiple);\n\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.actionsWrapper}>\n          {selectMultiple ? (\n            <div className={style.selectMultiple}>\n              <SelectMultiple {...selectMultiple} />\n            </div>\n          ) : null}\n\n          <div className={style.buttonCreate}>\n            <ButtonLink {...buttonLink} />\n          </div>\n        </div>\n      </div>\n      {contentView}\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  selectMultiple: PropTypes.shape(SelectMultiple.propTypes),\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n      type: PropTypes.oneOf(['list']),\n      itemType: PropTypes.string,\n      onDrop: PropTypes.func,\n      isDraggable: PropTypes.bool\n    }),\n    PropTypes.shape({\n      ...ExpandibleActionableTable.propTypes,\n      type: PropTypes.oneOf(['expandible-actionable-table'])\n    })\n  ]),\n  title: PropTypes.string\n};\n\nexport default ListItems;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,QAAP,MAAqB,cAArB;AACA,OAAOC,aAAP,MAA0B,+BAA1B;AACA,OAAOC,KAAP,MAAkB,kBAAlB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,OAAOC,cAAP,MAA2B,gCAA3B;AACA,OAAOC,yBAAP,MAAsC,4CAAtC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,kBAAkB,GAAG,CAACC,OAAD,EAAUC,SAAV,EAAqBC,cAArB,KAAwC;EACjE,MAAM;IAACC,KAAD;IAAQC,QAAR;IAAkBC,MAAlB;IAA0BC,WAAW,GAAG;EAAxC,IAAiDN,OAAvD;EACA,MAAMO,SAAS,GACbD,WAAW,IAAIH,KAAK,CAACK,MAAN,GAAe,CAA9B,gBACE,oBAAC,aAAD;IACE,KAAK,EAAEL,KAAK,CAACM,GAAN,CAAUC,IAAI,iBAASA,IAAT;MAAeC,WAAW,EAAEP;IAA5B,EAAd,CADT;IAEE,QAAQ,EAAC,WAFX;IAGE,MAAM,EAAEC;EAHV,EADF,GAOEF,KAAK,CAACM,GAAN,CAAU,CAACC,IAAD,EAAOE,KAAP,kBACR;IAAI,GAAG,EAAEF,IAAI,CAACG,EAAd;IAAkB,SAAS,EAAEf,KAAK,CAACY,IAAnC;IAAyC,aAAY,WAAUE,KAAM;EAArE,gBACE,oBAAC,QAAD,eAAcF,IAAd;IAAoB,KAAK,EAAE,IAA3B;IAAiC,WAAW,EAAEN;EAA9C,GADF,CADF,CARJ;EAcA,oBACE;IACE,SAAS,EAAE,CAACF,cAAD,GAAkBJ,KAAK,CAACgB,IAAxB,GAA+BhB,KAAK,CAACiB,sBADlD;IAEE,cAAYd,SAFd;IAGE,aAAW;EAHb,GAKGM,SALH,CADF;AASD,CAzBD;;AA0BA,MAAMS,gBAAgB,GAAG,CAAChB,OAAD,EAAUC,SAAV,EAAqBC,cAArB,KAAwC;EAC/D,MAAM;IAACe;EAAD,IAASjB,OAAf;;EACA,QAAQiB,IAAR;IACE,KAAK,MAAL;MACE,OAAOlB,kBAAkB,CAACC,OAAD,EAAUC,SAAV,EAAqBC,cAArB,CAAzB;;IACF,KAAK,6BAAL;MACE,oBAAO,oBAAC,yBAAD,EAA+BF,OAA/B,CAAP;EAJJ;AAMD,CARD;;AAUA,MAAMkB,SAAS,GAAG,CAAC;EAACC,KAAD;EAAQC,UAAR;EAAoBlB,cAApB;EAAoCF,OAApC;EAA6C,cAAcC;AAA3D,CAAD,KAA2E;EAC3F,MAAMoB,WAAW,GAAGL,gBAAgB,CAAChB,OAAD,EAAUC,SAAV,EAAqBC,cAArB,CAApC;EAEA,oBACE,8CACE;IAAK,SAAS,EAAEJ,KAAK,CAACwB;EAAtB,gBACE;IAAK,SAAS,EAAExB,KAAK,CAACqB;EAAtB,gBACE,oBAAC,KAAD;IAAO,KAAK,EAAEA,KAAd;IAAqB,IAAI,EAAE,YAA3B;IAAyC,aAAW;EAApD,EADF,CADF,eAIE;IAAK,SAAS,EAAErB,KAAK,CAACyB;EAAtB,GACGrB,cAAc,gBACb;IAAK,SAAS,EAAEJ,KAAK,CAACI;EAAtB,gBACE,oBAAC,cAAD,EAAoBA,cAApB,CADF,CADa,GAIX,IALN,eAOE;IAAK,SAAS,EAAEJ,KAAK,CAAC0B;EAAtB,gBACE,oBAAC,UAAD,EAAgBJ,UAAhB,CADF,CAPF,CAJF,CADF,EAiBGC,WAjBH,CADF;AAqBD,CAxBD;;AA0BAH,SAAS,CAACO,SAAV,2CAAsB;EACpB,cAAclC,SAAS,CAACmC,MADJ;EAEpBN,UAAU,EAAE7B,SAAS,CAACoC,KAAV,CAAgBhC,UAAU,CAAC8B,SAA3B,CAFQ;EAGpBvB,cAAc,EAAEX,SAAS,CAACoC,KAAV,CAAgB/B,cAAc,CAAC6B,SAA/B,CAHI;EAIpBzB,OAAO,EAAET,SAAS,CAACqC,SAAV,CAAoB,CAC3BrC,SAAS,CAACoC,KAAV,CAAgB;IACdxB,KAAK,EAAEZ,SAAS,CAACsC,OAAV,CAAkBtC,SAAS,CAACoC,KAAV,CAAgBnC,QAAQ,CAACiC,SAAzB,CAAlB,CADO;IAEdR,IAAI,EAAE1B,SAAS,CAACuC,KAAV,CAAgB,CAAC,MAAD,CAAhB,CAFQ;IAGd1B,QAAQ,EAAEb,SAAS,CAACmC,MAHN;IAIdrB,MAAM,EAAEd,SAAS,CAACwC,IAJJ;IAKdzB,WAAW,EAAEf,SAAS,CAACyC;EALT,CAAhB,CAD2B,EAQ3BzC,SAAS,CAACoC,KAAV,cACK9B,yBAAyB,CAAC4B,SAD/B;IAEER,IAAI,EAAE1B,SAAS,CAACuC,KAAV,CAAgB,CAAC,6BAAD,CAAhB;EAFR,GAR2B,CAApB,CAJW;EAiBpBX,KAAK,EAAE5B,SAAS,CAACmC;AAjBG,CAAtB;AAoBA,eAAeR,SAAf"}

package/es/template/back-office/brand-update/index.d.ts

@@ -795,38 +795,6 @@ declare namespace BrandUpdate {
                 error: PropTypes.Requireable<string>;
                 theme: PropTypes.Requireable<string>;
             }>>;
-            items: PropTypes.Requireable<(PropTypes.InferProps<{
-                bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
-                    buttonAriaLabel: PropTypes.Requireable<string>;
-                    menuAriaLabel: PropTypes.Requireable<string>;
-                    buttons: PropTypes.Requireable<(PropTypes.InferProps<{
-                        'data-name': PropTypes.Requireable<string>;
-                        label: PropTypes.Requireable<string>;
-                        type: PropTypes.Requireable<string>;
-                        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                    }> | null | undefined)[]>;
-                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                }>>;
-                buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
-                    type: PropTypes.Requireable<string>;
-                    label: PropTypes.Requireable<string>;
-                    ariaLabel: PropTypes.Requireable<string>;
-                    dataName: PropTypes.Requireable<string>;
-                    icon: PropTypes.Requireable<PropTypes.InferProps<{
-                        position: PropTypes.Requireable<string>;
-                        type: PropTypes.Requireable<string>;
-                    }>>;
-                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                }>>;
-                tags: PropTypes.Requireable<(PropTypes.InferProps<{
-                    label: PropTypes.Requireable<string>;
-                    type: PropTypes.Requireable<string>;
-                }> | null | undefined)[]>;
-                title: PropTypes.Validator<string>;
-                order: PropTypes.Requireable<number>;
-                'aria-label': PropTypes.Requireable<string>;
-                contentType: PropTypes.Requireable<string>;
-            }> | null | undefined)[]>;
             content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
                 items: PropTypes.Requireable<(PropTypes.InferProps<{
                     bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
@@ -859,9 +827,12 @@ declare namespace BrandUpdate {
                     order: PropTypes.Requireable<number>;
                     'aria-label': PropTypes.Requireable<string>;
                     contentType: PropTypes.Requireable<string>;
+                    id: PropTypes.Requireable<string>;
                 }> | null | undefined)[]>;
                 type: PropTypes.Requireable<string>;
                 itemType: PropTypes.Requireable<string>;
+                onDrop: PropTypes.Requireable<(...args: any[]) => any>;
+                isDraggable: PropTypes.Requireable<boolean>;
             }> | PropTypes.InferProps<{
                 type: PropTypes.Requireable<string>;
                 columns: PropTypes.Requireable<(PropTypes.InferProps<{

package/es/template/mobile-login/receive-email/index.native.d.ts

@@ -7,7 +7,7 @@ export declare type Props = {
         cta: string;
     };
     onClose: () => void;
-    onSend: () => void;
+    onSend: (email: string) => void;
 };
 declare const ReceiveEmail: (props: Props) => JSX.Element;
 export default ReceiveEmail;

package/es/template/mobile-login/receive-email/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"names":[],"mappings":";AAoIA,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,YAAY,UAAW,KAAK,gBA8EjC,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"names":[],"mappings":";AAoIA,oBAAY,KAAK,GAAG;IAClB,OAAO,EAAE;QACP,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,YAAY,UAAW,KAAK,gBAoFjC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/es/template/mobile-login/receive-email/index.native.js

@@ -120,11 +120,16 @@ const ReceiveEmail = props => {
     onClose,
     onSend
   } = props;
+  const [email, setEmail] = useState('');
   const [isValid, setValid] = useState(false);
   const [isTextInputFocused, setTextInputFocused] = useState(false);
   const isKeyboardVisible = useMobileKeyboardVisibility();
+  const handleSend = useCallback(() => {
+    onSend(email);
+  }, [email, onSend]);
   const handleChangeText = useCallback(value => {
     setValid(emailRegex.test(value));
+    setEmail(value);
   }, []);
   const handleTextInputFocus = useCallback(() => {
     setTextInputFocused(true);
@@ -186,7 +191,7 @@ const ReceiveEmail = props => {
   }, /*#__PURE__*/React.createElement(Touchable, {
     disabled: !isValid,
     style: [styles.ctaButton],
-    onPress: onSend,
+    onPress: handleSend,
     testID: "send-button"
   }, /*#__PURE__*/React.createElement(SendIcon, {
     style: styles.sendIcon

package/es/template/mobile-login/receive-email/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["React","useCallback","useEffect","useRef","useState","Animated","Easing","KeyboardAvoidingView","Platform","StyleSheet","Text","TextInput","View","NovaCompositionNavigationLeftArrow","ArrowIcon","NovaCompositionCoorpacademyEmail","MailIcon","NovaCompositionCoorpacademySendEmail","SendIcon","Touchable","useMobileKeyboardVisibility","enabledColor","disabledColor","emailRegex","styles","create","container","width","height","flex","justifyContent","alignItems","paddingVertical","paddingHorizontal","contentWrapper","backButton","arrowIcon","fill","mailIconWrapper","backgroundColor","padding","marginVertical","borderRadius","mailIcon","innerMailIcon","marginTop","marginLeft","title","color","fontSize","fontWeight","lineHeight","textAlign","marginBottom","explanation","letterSpacing","subtitle","textInput","borderColor","borderWidth","alignContent","ctaWrapper","overflow","ctaButton","flexDirection","sendIcon","marginRight","ctaText","ReceiveEmail","props","locales","onClose","onSend","isValid","setValid","isTextInputFocused","setTextInputFocused","isKeyboardVisible","handleChangeText","value","test","handleTextInputFocus","handleTextInputBlur","animationRef","Value","current","animatedColor","interpolate","inputRange","outputRange","animation","timing","toValue","duration","easing","out","sin","useNativeDriver","start","OS","cta"],"sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {\n  Animated,\n  Easing,\n  KeyboardAvoidingView,\n  Platform,\n  StyleSheet,\n  Text,\n  TextInput,\n  View\n} from 'react-native';\nimport {\n  NovaCompositionNavigationLeftArrow as ArrowIcon,\n  NovaCompositionCoorpacademyEmail as MailIcon,\n  NovaCompositionCoorpacademySendEmail as SendIcon\n} from '@coorpacademy/nova-icons';\n\nimport Touchable from '../../../hoc/touchable/index.native';\nimport useMobileKeyboardVisibility from '../../../util/use-mobile-keyboard-visibility';\n\nconst enabledColor = '#0061ff';\nconst disabledColor = '#9999A8';\nconst emailRegex = /^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$/;\n\nconst styles = StyleSheet.create({\n  container: {\n    width: '100%',\n    height: '100%',\n    flex: 1,\n    justifyContent: 'space-between',\n    alignItems: 'flex-start',\n    paddingVertical: 50,\n    paddingHorizontal: 24\n  },\n  contentWrapper: {\n    width: '100%'\n  },\n  backButton: {\n    paddingVertical: 20\n  },\n  arrowIcon: {\n    fill: '#515161',\n    width: 24,\n    height: 15\n  },\n  mailIconWrapper: {\n    backgroundColor: '#f1f6fe',\n    width: 64,\n    height: 64,\n    padding: 23,\n    marginVertical: 24,\n    borderRadius: 16,\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  mailIcon: {\n    fill: '#0061ff',\n    width: 24,\n    height: 18\n  },\n  innerMailIcon: {\n    fill: '#515161',\n    width: 16,\n    height: 12,\n    marginTop: -30,\n    marginLeft: 16\n  },\n  title: {\n    color: '#1D1D2B',\n    fontSize: 24,\n    fontWeight: '600',\n    lineHeight: 32,\n    textAlign: 'left',\n    marginBottom: 12\n  },\n  explanation: {\n    color: '#515161',\n    fontSize: 17,\n    letterSpacing: 0.4,\n    fontWeight: '500',\n    lineHeight: 22,\n    textAlign: 'left',\n    marginBottom: 24\n  },\n  subtitle: {\n    color: '#1D1D2B',\n    fontSize: 15,\n    fontWeight: '600',\n    lineHeight: 20,\n    textAlign: 'left',\n    marginBottom: 8\n  },\n  textInput: {\n    height: 48,\n    width: '100%',\n    backgroundColor: '#F4F4F5',\n    borderColor: enabledColor,\n    borderWidth: 2,\n    fontSize: 15,\n    lineHeight: 16,\n    alignContent: 'center',\n    color: '#515161',\n    borderRadius: 7,\n    paddingHorizontal: 40\n  },\n  ctaWrapper: {\n    width: '100%',\n    overflow: 'hidden',\n    borderRadius: 12,\n    marginTop: 30,\n    marginBottom: 50\n  },\n  ctaButton: {\n    flexDirection: 'row',\n    justifyContent: 'center',\n    alignItems: 'center',\n    paddingVertical: 16\n  },\n  sendIcon: {\n    fill: '#fff',\n    width: 16,\n    height: 16,\n    marginRight: 8\n  },\n  ctaText: {\n    color: '#fff',\n    fontWeight: '700',\n    fontSize: 15,\n    lineHeight: 24\n  }\n});\n\nexport type Props = {\n  locales: {\n    title: string;\n    explanation: string;\n    subtitle: string;\n    cta: string;\n  };\n  onClose: () => void;\n  onSend: () => void;\n};\n\nconst ReceiveEmail = (props: Props) => {\n  const {locales, onClose, onSend} = props;\n\n  const [isValid, setValid] = useState<boolean>(false);\n  const [isTextInputFocused, setTextInputFocused] = useState<boolean>(false);\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleChangeText = useCallback(value => {\n    setValid(emailRegex.test(value));\n  }, []);\n\n  const handleTextInputFocus = useCallback(() => {\n    setTextInputFocused(true);\n  }, []);\n\n  const handleTextInputBlur = useCallback(() => {\n    setTextInputFocused(false);\n  }, []);\n\n  const animationRef = useRef<Animated.Value>(new Animated.Value(0)).current;\n  const animatedColor = animationRef.interpolate({\n    inputRange: [0, 1],\n    outputRange: [disabledColor, enabledColor]\n  });\n\n  useEffect(() => {\n    const animation = Animated.timing(animationRef, {\n      toValue: isValid ? 1 : 0,\n      duration: 250,\n      easing: Easing.out(Easing.sin),\n      useNativeDriver: false\n    });\n\n    animation.start();\n  }, [animationRef, isValid]);\n\n  return (\n    <KeyboardAvoidingView\n      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}\n      style={[styles.container]}\n      testID=\"receive-email\"\n    >\n      <View style={styles.contentWrapper}>\n        <Touchable style={styles.backButton} onPress={onClose} testID=\"close-button\">\n          <ArrowIcon style={styles.arrowIcon} />\n        </Touchable>\n        {isKeyboardVisible ? null : (\n          <View style={styles.mailIconWrapper}>\n            <MailIcon style={styles.mailIcon} />\n          </View>\n        )}\n        <Text style={styles.title}>{locales.title}</Text>\n        <Text style={styles.explanation}>{locales.explanation}</Text>\n        <Text style={styles.subtitle}>{locales.subtitle}</Text>\n        <TextInput\n          style={[styles.textInput, {borderWidth: isTextInputFocused ? 2 : 0}]}\n          placeholder=\"john.doe@company.com\"\n          placeholderTextColor={disabledColor}\n          onChangeText={handleChangeText}\n          onFocus={handleTextInputFocus}\n          onBlur={handleTextInputBlur}\n        />\n        <MailIcon style={styles.innerMailIcon} />\n      </View>\n\n      <Animated.View style={[styles.ctaWrapper, {backgroundColor: animatedColor}]}>\n        <Touchable\n          disabled={!isValid}\n          style={[styles.ctaButton]}\n          onPress={onSend}\n          testID=\"send-button\"\n        >\n          <SendIcon style={styles.sendIcon} />\n          <Text style={styles.ctaText}>{locales.cta}</Text>\n        </Touchable>\n      </Animated.View>\n    </KeyboardAvoidingView>\n  );\n};\n\nexport default ReceiveEmail;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["React","useCallback","useEffect","useRef","useState","Animated","Easing","KeyboardAvoidingView","Platform","StyleSheet","Text","TextInput","View","NovaCompositionNavigationLeftArrow","ArrowIcon","NovaCompositionCoorpacademyEmail","MailIcon","NovaCompositionCoorpacademySendEmail","SendIcon","Touchable","useMobileKeyboardVisibility","enabledColor","disabledColor","emailRegex","styles","create","container","width","height","flex","justifyContent","alignItems","paddingVertical","paddingHorizontal","contentWrapper","backButton","arrowIcon","fill","mailIconWrapper","backgroundColor","padding","marginVertical","borderRadius","mailIcon","innerMailIcon","marginTop","marginLeft","title","color","fontSize","fontWeight","lineHeight","textAlign","marginBottom","explanation","letterSpacing","subtitle","textInput","borderColor","borderWidth","alignContent","ctaWrapper","overflow","ctaButton","flexDirection","sendIcon","marginRight","ctaText","ReceiveEmail","props","locales","onClose","onSend","email","setEmail","isValid","setValid","isTextInputFocused","setTextInputFocused","isKeyboardVisible","handleSend","handleChangeText","value","test","handleTextInputFocus","handleTextInputBlur","animationRef","Value","current","animatedColor","interpolate","inputRange","outputRange","animation","timing","toValue","duration","easing","out","sin","useNativeDriver","start","OS","cta"],"sources":["../../../../src/template/mobile-login/receive-email/index.native.tsx"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport {\n  Animated,\n  Easing,\n  KeyboardAvoidingView,\n  Platform,\n  StyleSheet,\n  Text,\n  TextInput,\n  View\n} from 'react-native';\nimport {\n  NovaCompositionNavigationLeftArrow as ArrowIcon,\n  NovaCompositionCoorpacademyEmail as MailIcon,\n  NovaCompositionCoorpacademySendEmail as SendIcon\n} from '@coorpacademy/nova-icons';\n\nimport Touchable from '../../../hoc/touchable/index.native';\nimport useMobileKeyboardVisibility from '../../../util/use-mobile-keyboard-visibility';\n\nconst enabledColor = '#0061ff';\nconst disabledColor = '#9999A8';\nconst emailRegex = /^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$/;\n\nconst styles = StyleSheet.create({\n  container: {\n    width: '100%',\n    height: '100%',\n    flex: 1,\n    justifyContent: 'space-between',\n    alignItems: 'flex-start',\n    paddingVertical: 50,\n    paddingHorizontal: 24\n  },\n  contentWrapper: {\n    width: '100%'\n  },\n  backButton: {\n    paddingVertical: 20\n  },\n  arrowIcon: {\n    fill: '#515161',\n    width: 24,\n    height: 15\n  },\n  mailIconWrapper: {\n    backgroundColor: '#f1f6fe',\n    width: 64,\n    height: 64,\n    padding: 23,\n    marginVertical: 24,\n    borderRadius: 16,\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  mailIcon: {\n    fill: '#0061ff',\n    width: 24,\n    height: 18\n  },\n  innerMailIcon: {\n    fill: '#515161',\n    width: 16,\n    height: 12,\n    marginTop: -30,\n    marginLeft: 16\n  },\n  title: {\n    color: '#1D1D2B',\n    fontSize: 24,\n    fontWeight: '600',\n    lineHeight: 32,\n    textAlign: 'left',\n    marginBottom: 12\n  },\n  explanation: {\n    color: '#515161',\n    fontSize: 17,\n    letterSpacing: 0.4,\n    fontWeight: '500',\n    lineHeight: 22,\n    textAlign: 'left',\n    marginBottom: 24\n  },\n  subtitle: {\n    color: '#1D1D2B',\n    fontSize: 15,\n    fontWeight: '600',\n    lineHeight: 20,\n    textAlign: 'left',\n    marginBottom: 8\n  },\n  textInput: {\n    height: 48,\n    width: '100%',\n    backgroundColor: '#F4F4F5',\n    borderColor: enabledColor,\n    borderWidth: 2,\n    fontSize: 15,\n    lineHeight: 16,\n    alignContent: 'center',\n    color: '#515161',\n    borderRadius: 7,\n    paddingHorizontal: 40\n  },\n  ctaWrapper: {\n    width: '100%',\n    overflow: 'hidden',\n    borderRadius: 12,\n    marginTop: 30,\n    marginBottom: 50\n  },\n  ctaButton: {\n    flexDirection: 'row',\n    justifyContent: 'center',\n    alignItems: 'center',\n    paddingVertical: 16\n  },\n  sendIcon: {\n    fill: '#fff',\n    width: 16,\n    height: 16,\n    marginRight: 8\n  },\n  ctaText: {\n    color: '#fff',\n    fontWeight: '700',\n    fontSize: 15,\n    lineHeight: 24\n  }\n});\n\nexport type Props = {\n  locales: {\n    title: string;\n    explanation: string;\n    subtitle: string;\n    cta: string;\n  };\n  onClose: () => void;\n  onSend: (email: string) => void;\n};\n\nconst ReceiveEmail = (props: Props) => {\n  const {locales, onClose, onSend} = props;\n\n  const [email, setEmail] = useState<string>('');\n  const [isValid, setValid] = useState<boolean>(false);\n  const [isTextInputFocused, setTextInputFocused] = useState<boolean>(false);\n  const isKeyboardVisible = useMobileKeyboardVisibility();\n\n  const handleSend = useCallback(() => {\n    onSend(email);\n  }, [email, onSend]);\n\n  const handleChangeText = useCallback(value => {\n    setValid(emailRegex.test(value));\n    setEmail(value);\n  }, []);\n\n  const handleTextInputFocus = useCallback(() => {\n    setTextInputFocused(true);\n  }, []);\n\n  const handleTextInputBlur = useCallback(() => {\n    setTextInputFocused(false);\n  }, []);\n\n  const animationRef = useRef<Animated.Value>(new Animated.Value(0)).current;\n  const animatedColor = animationRef.interpolate({\n    inputRange: [0, 1],\n    outputRange: [disabledColor, enabledColor]\n  });\n\n  useEffect(() => {\n    const animation = Animated.timing(animationRef, {\n      toValue: isValid ? 1 : 0,\n      duration: 250,\n      easing: Easing.out(Easing.sin),\n      useNativeDriver: false\n    });\n\n    animation.start();\n  }, [animationRef, isValid]);\n\n  return (\n    <KeyboardAvoidingView\n      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}\n      style={[styles.container]}\n      testID=\"receive-email\"\n    >\n      <View style={styles.contentWrapper}>\n        <Touchable style={styles.backButton} onPress={onClose} testID=\"close-button\">\n          <ArrowIcon style={styles.arrowIcon} />\n        </Touchable>\n        {isKeyboardVisible ? null : (\n          <View style={styles.mailIconWrapper}>\n            <MailIcon style={styles.mailIcon} />\n          </View>\n        )}\n        <Text style={styles.title}>{locales.title}</Text>\n        <Text style={styles.explanation}>{locales.explanation}</Text>\n        <Text style={styles.subtitle}>{locales.subtitle}</Text>\n        <TextInput\n          style={[styles.textInput, {borderWidth: isTextInputFocused ? 2 : 0}]}\n          placeholder=\"john.doe@company.com\"\n          placeholderTextColor={disabledColor}\n          onChangeText={handleChangeText}\n          onFocus={handleTextInputFocus}\n          onBlur={handleTextInputBlur}\n        />\n        <MailIcon style={styles.innerMailIcon} />\n      </View>\n\n      <Animated.View style={[styles.ctaWrapper, {backgroundColor: animatedColor}]}>\n        <Touchable\n          disabled={!isValid}\n          style={[styles.ctaButton]}\n          onPress={handleSend}\n          testID=\"send-button\"\n        >\n          <SendIcon style={styles.sendIcon} />\n          <Text style={styles.ctaText}>{locales.cta}</Text>\n        </Touchable>\n      </Animated.View>\n    </KeyboardAvoidingView>\n  );\n};\n\nexport default ReceiveEmail;\n"],"mappings":"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"}

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

@@ -33,10 +33,10 @@
     font-family: Gilroy;
     font-size: 16px;
     font-weight: bold;
-    overflow:hidden;
-    white-space:nowrap;
-    display:inline-block;
-    text-overflow:ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    display: inline-block;
+    text-overflow: ellipsis;
     width: 100%;
 }
 
@@ -59,5 +59,3 @@
     min-height: 56px;
     min-width: 56px;
 }
-
-