@coorpacademy/components 10.3.17-alpha.0 → 10.3.20

package/es/organism/wizard-contents/index.js

@@ -55,7 +55,7 @@ const buildForm = content => {
   }
 };
 
-const buildButton = (type, step) => {
+const buildButton = (type, step, side) => {
   const ICONS = {
     previous: {
       position: 'left',
@@ -77,7 +77,7 @@ const buildButton = (type, step) => {
   const buttonProps = {
     type: type === 'previous' ? 'secondary' : 'primary',
     'aria-label': `${type} step button`,
-    'data-name': `${type}-step-button`,
+    'data-name': `${type}-step-button-${side}`,
     icon: ICONS[type],
     label,
     onClick
@@ -85,10 +85,10 @@ const buildButton = (type, step) => {
   return /*#__PURE__*/React.createElement(ButtonLink, buttonProps);
 };
 
-const buildActionZone = (previousStep, nextStep) => {
-  const previousButton = previousStep ? buildButton('previous', previousStep) : null;
+const buildActionZone = (previousStep, nextStep, side) => {
+  const previousButton = previousStep ? buildButton('previous', previousStep, side) : null;
   const nextStepType = getOr('next', 'type', nextStep);
-  const nextButton = nextStep ? buildButton(nextStepType, nextStep) : null;
+  const nextButton = nextStep ? buildButton(nextStepType, nextStep, side) : null;
   return /*#__PURE__*/React.createElement("div", {
     className: style.actionZone
   }, /*#__PURE__*/React.createElement("div", {
@@ -109,26 +109,35 @@ const WizardContents = props => {
   } = props;
   const headerView = buildHeader(wizardHeader, steps);
   const formView = buildForm(content);
-  const actionView = buildActionZone(previousStep, nextStep);
+  const rightActionView = buildActionZone(previousStep, nextStep, 'right');
+  const footerActionView = buildActionZone(previousStep, nextStep, 'footer');
   return /*#__PURE__*/React.createElement("div", {
-    className: style.container
+    className: style.container,
+    "data-name": "custom-playlist-summary"
   }, /*#__PURE__*/React.createElement("div", {
     className: style.leftSection
   }, headerView, /*#__PURE__*/React.createElement("div", {
     className: style.form
   }, formView)), /*#__PURE__*/React.createElement("div", {
-    className: style.rightSection
+    className: style.rightSection,
+    "data-name": "summary-right-section"
   }, /*#__PURE__*/React.createElement("div", {
     className: style.stickySection
   }, /*#__PURE__*/React.createElement("div", {
-    className: style.summaryZone
-  }, /*#__PURE__*/React.createElement(WizardSummary, summary)), actionView)), /*#__PURE__*/React.createElement("div", {
-    className: style.footer
+    className: style.summaryZone,
+    "data-name": "summary-zone"
+  }, /*#__PURE__*/React.createElement(WizardSummary, _extends({}, summary, {
+    side: 'right'
+  }))), rightActionView)), /*#__PURE__*/React.createElement("div", {
+    className: style.footer,
+    "data-name": "summary-footer-section"
   }, /*#__PURE__*/React.createElement("div", {
     className: style.summaryFooter
-  }, /*#__PURE__*/React.createElement(WizardSummary, summary)), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(WizardSummary, _extends({}, summary, {
+    side: 'footer'
+  }))), /*#__PURE__*/React.createElement("div", {
     className: style.actionFooter
-  }, actionView)));
+  }, footerActionView)));
 };
 
 WizardContents.propTypes = process.env.NODE_ENV !== "production" ? {

package/es/organism/wizard-contents/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/organism/wizard-contents/index.js"],"names":["React","getOr","PropTypes","ButtonLink","ButtonLinkIconOnly","WizardSteps","WizardSummary","BrandForm","ContentTranslate","OrganismSearchAndChipsResults","CourseSelection","style","buildHeader","wizardHeader","steps","title","onClick","buttonCloseIcon","size","icon","header","headerTitle","buildForm","content","type","buildButton","step","ICONS","previous","position","next","publish","label","buttonProps","buildActionZone","previousStep","nextStep","previousButton","nextStepType","nextButton","actionZone","button","WizardContents","props","summary","headerView","formView","actionView","container","leftSection","form","rightSection","stickySection","summaryZone","footer","summaryFooter","actionFooter","propTypes","shape","string","func","isRequired","oneOfType","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport getOr from 'lodash/fp/getOr';\nimport PropTypes from 'prop-types';\nimport ButtonLink from '../../atom/button-link';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport WizardSteps from '../../atom/wizard-steps';\nimport WizardSummary from '../../molecule/wizard-summary';\nimport BrandForm from '../brand-form';\nimport ContentTranslate from '../content-translation';\nimport OrganismSearchAndChipsResults from '../search-and-chips-results';\nimport CourseSelection from '../course-selection';\nimport style from './style.css';\n\nconst buildHeader = (wizardHeader, steps) => {\n  const {title, onClick} = wizardHeader;\n\n  const buttonCloseIcon = {\n    size: 'small',\n    'data-name': 'close-button',\n    'aria-label': 'close button',\n    icon: 'close',\n    onClick\n  };\n\n  return (\n    <div>\n      <div className={style.header}>\n        <ButtonLinkIconOnly {...buttonCloseIcon} />\n        <div className={style.headerTitle} data-name={'custom-playlist-title'}>\n          {title}\n        </div>\n      </div>\n      <WizardSteps steps={steps} />\n    </div>\n  );\n};\n\nconst buildForm = content => {\n  const {type} = content;\n  switch (type) {\n    case 'form':\n      return <BrandForm {...content} />;\n    case 'translate':\n      return <ContentTranslate {...content} />;\n    case 'populations':\n      return <OrganismSearchAndChipsResults {...content} />;\n    case 'courses':\n      return <CourseSelection {...content} />;\n  }\n};\n\nconst buildButton = (type, step) => {\n  const ICONS = {\n    previous: {\n      position: 'left',\n      type: 'chevron-left'\n    },\n    next: {\n      position: 'right',\n      type: 'chevron-right'\n    },\n    publish: {\n      position: 'left',\n      type: 'publish'\n    }\n  };\n\n  const {label, onClick} = step;\n  const buttonProps = {\n    type: type === 'previous' ? 'secondary' : 'primary',\n    'aria-label': `${type} step button`,\n    'data-name': `${type}-step-button`,\n    icon: ICONS[type],\n    label,\n    onClick\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nconst buildActionZone = (previousStep, nextStep) => {\n  const previousButton = previousStep ? buildButton('previous', previousStep) : null;\n  const nextStepType = getOr('next', 'type', nextStep);\n  const nextButton = nextStep ? buildButton(nextStepType, nextStep) : null;\n  return (\n    <div className={style.actionZone}>\n      <div className={style.button}>{previousButton}</div>\n      <div className={style.button}>{nextButton}</div>\n    </div>\n  );\n};\n\nconst WizardContents = props => {\n  const {wizardHeader, steps, summary, content, nextStep, previousStep} = props;\n  const headerView = buildHeader(wizardHeader, steps);\n  const formView = buildForm(content);\n  const actionView = buildActionZone(previousStep, nextStep);\n\n  return (\n    <div className={style.container}>\n      <div className={style.leftSection}>\n        {headerView}\n        <div className={style.form}>{formView}</div>\n      </div>\n      <div className={style.rightSection}>\n        <div className={style.stickySection}>\n          <div className={style.summaryZone}>\n            <WizardSummary {...summary} />\n          </div>\n          {actionView}\n        </div>\n      </div>\n      <div className={style.footer}>\n        <div className={style.summaryFooter}>\n          <WizardSummary {...summary} />\n        </div>\n        <div className={style.actionFooter}>{actionView}</div>\n      </div>\n    </div>\n  );\n};\n\nWizardContents.propTypes = {\n  wizardHeader: PropTypes.shape({\n    title: PropTypes.string,\n    onClick: PropTypes.func\n  }).isRequired,\n  steps: WizardSteps.propTypes.steps,\n  summary: PropTypes.shape({\n    ...WizardSummary.propTypes\n  }).isRequired,\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...BrandForm.propTypes,\n      type: PropTypes.oneOf(['form'])\n    }),\n    PropTypes.shape({\n      ...ContentTranslate.propTypes,\n      type: PropTypes.oneOf(['translate'])\n    }),\n    PropTypes.shape({\n      ...OrganismSearchAndChipsResults.propTypes,\n      type: PropTypes.oneOf(['populations'])\n    }),\n    PropTypes.shape({\n      ...CourseSelection.propTypes,\n      type: PropTypes.oneOf(['courses'])\n    })\n  ]),\n  previousStep: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  }),\n  nextStep: PropTypes.shape({\n    type: PropTypes.oneOf(['next', 'publish']),\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  })\n};\n\nexport default WizardContents;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/organism/wizard-contents/index.js"],"names":["React","getOr","PropTypes","ButtonLink","ButtonLinkIconOnly","WizardSteps","WizardSummary","BrandForm","ContentTranslate","OrganismSearchAndChipsResults","CourseSelection","style","buildHeader","wizardHeader","steps","title","onClick","buttonCloseIcon","size","icon","header","headerTitle","buildForm","content","type","buildButton","step","side","ICONS","previous","position","next","publish","label","buttonProps","buildActionZone","previousStep","nextStep","previousButton","nextStepType","nextButton","actionZone","button","WizardContents","props","summary","headerView","formView","rightActionView","footerActionView","container","leftSection","form","rightSection","stickySection","summaryZone","footer","summaryFooter","actionFooter","propTypes","shape","string","func","isRequired","oneOfType","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport getOr from 'lodash/fp/getOr';\nimport PropTypes from 'prop-types';\nimport ButtonLink from '../../atom/button-link';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport WizardSteps from '../../atom/wizard-steps';\nimport WizardSummary from '../../molecule/wizard-summary';\nimport BrandForm from '../brand-form';\nimport ContentTranslate from '../content-translation';\nimport OrganismSearchAndChipsResults from '../search-and-chips-results';\nimport CourseSelection from '../course-selection';\nimport style from './style.css';\n\nconst buildHeader = (wizardHeader, steps) => {\n  const {title, onClick} = wizardHeader;\n\n  const buttonCloseIcon = {\n    size: 'small',\n    'data-name': 'close-button',\n    'aria-label': 'close button',\n    icon: 'close',\n    onClick\n  };\n\n  return (\n    <div>\n      <div className={style.header}>\n        <ButtonLinkIconOnly {...buttonCloseIcon} />\n        <div className={style.headerTitle} data-name={'custom-playlist-title'}>\n          {title}\n        </div>\n      </div>\n      <WizardSteps steps={steps} />\n    </div>\n  );\n};\n\nconst buildForm = content => {\n  const {type} = content;\n  switch (type) {\n    case 'form':\n      return <BrandForm {...content} />;\n    case 'translate':\n      return <ContentTranslate {...content} />;\n    case 'populations':\n      return <OrganismSearchAndChipsResults {...content} />;\n    case 'courses':\n      return <CourseSelection {...content} />;\n  }\n};\n\nconst buildButton = (type, step, side) => {\n  const ICONS = {\n    previous: {\n      position: 'left',\n      type: 'chevron-left'\n    },\n    next: {\n      position: 'right',\n      type: 'chevron-right'\n    },\n    publish: {\n      position: 'left',\n      type: 'publish'\n    }\n  };\n\n  const {label, onClick} = step;\n  const buttonProps = {\n    type: type === 'previous' ? 'secondary' : 'primary',\n    'aria-label': `${type} step button`,\n    'data-name': `${type}-step-button-${side}`,\n    icon: ICONS[type],\n    label,\n    onClick\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nconst buildActionZone = (previousStep, nextStep, side) => {\n  const previousButton = previousStep ? buildButton('previous', previousStep, side) : null;\n  const nextStepType = getOr('next', 'type', nextStep);\n  const nextButton = nextStep ? buildButton(nextStepType, nextStep, side) : null;\n  return (\n    <div className={style.actionZone}>\n      <div className={style.button}>{previousButton}</div>\n      <div className={style.button}>{nextButton}</div>\n    </div>\n  );\n};\n\nconst WizardContents = props => {\n  const {wizardHeader, steps, summary, content, nextStep, previousStep} = props;\n  const headerView = buildHeader(wizardHeader, steps);\n  const formView = buildForm(content);\n  const rightActionView = buildActionZone(previousStep, nextStep, 'right');\n  const footerActionView = buildActionZone(previousStep, nextStep, 'footer');\n\n  return (\n    <div className={style.container} data-name=\"custom-playlist-summary\">\n      <div className={style.leftSection}>\n        {headerView}\n        <div className={style.form}>{formView}</div>\n      </div>\n      <div className={style.rightSection} data-name=\"summary-right-section\">\n        <div className={style.stickySection}>\n          <div className={style.summaryZone} data-name=\"summary-zone\">\n            <WizardSummary {...summary} side={'right'} />\n          </div>\n          {rightActionView}\n        </div>\n      </div>\n      <div className={style.footer} data-name=\"summary-footer-section\">\n        <div className={style.summaryFooter}>\n          <WizardSummary {...summary} side={'footer'} />\n        </div>\n        <div className={style.actionFooter}>{footerActionView}</div>\n      </div>\n    </div>\n  );\n};\n\nWizardContents.propTypes = {\n  wizardHeader: PropTypes.shape({\n    title: PropTypes.string,\n    onClick: PropTypes.func\n  }).isRequired,\n  steps: WizardSteps.propTypes.steps,\n  summary: PropTypes.shape({\n    ...WizardSummary.propTypes\n  }).isRequired,\n  content: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...BrandForm.propTypes,\n      type: PropTypes.oneOf(['form'])\n    }),\n    PropTypes.shape({\n      ...ContentTranslate.propTypes,\n      type: PropTypes.oneOf(['translate'])\n    }),\n    PropTypes.shape({\n      ...OrganismSearchAndChipsResults.propTypes,\n      type: PropTypes.oneOf(['populations'])\n    }),\n    PropTypes.shape({\n      ...CourseSelection.propTypes,\n      type: PropTypes.oneOf(['courses'])\n    })\n  ]),\n  previousStep: PropTypes.shape({\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  }),\n  nextStep: PropTypes.shape({\n    type: PropTypes.oneOf(['next', 'publish']),\n    label: PropTypes.string,\n    onClick: PropTypes.func\n  })\n};\n\nexport default WizardContents;\n"],"file":"index.js"}

package/lib/molecule/card/selectable.css

@@ -1,6 +1,5 @@
 @value colors: "../../variables/colors.css";
 @value positive from colors;
-@value negative from colors;
 @value cm_grey_400 from colors;
 
 .selectable {
@@ -40,11 +39,6 @@
   composes: icons;
 }
 
-.removeIcon {
-  color: negative;
-  composes: icons;
-}
-
 .addIcon {
   color: cm_grey_400;
   composes: icons;
@@ -57,7 +51,7 @@
 
 .selectable.selected .checkIcon,
 .selectable.selected .circle,
-.selectable.selected:hover .removeIcon {
+.selectable.selected:hover .checkIcon {
   display: block;
 }
 
@@ -65,7 +59,6 @@
   display: block;
 }
 
-.selectable.selected:hover .checkIcon,
 .selectable.selected:hover .addIcon {
   display: none;
 }

package/lib/molecule/card/selectable.js

@@ -28,9 +28,7 @@ const Selectable = props => {
     className: _selectable.default.circle
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: _selectable.default.iconWrapper
-  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidRemoveAddRemoveCircle1, {
-    className: _selectable.default.removeIcon
-  }), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidRemoveAddAddCircle1, {
+  }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidRemoveAddAddCircle1, {
     className: _selectable.default.addIcon
   }), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidStatusCheckCircle2, {
     className: _selectable.default.checkIcon

package/lib/molecule/card/selectable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/card/selectable.js"],"names":["Selectable","props","isSelected","style","selectable","selected","circle","iconWrapper","removeIcon","addIcon","checkIcon","propTypes","PropTypes","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAKA;;;;AAEA,MAAMA,UAAU,GAAGC,KAAK,IAAI;AAC1B,QAAM;AAACC,IAAAA;AAAD,MAAeD,KAArB;AAEA,MAAI,2BAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;AAE7B,sBACE;AAAK,IAAA,SAAS,EAAE,yBAAWC,oBAAMC,UAAjB,EAA6BF,UAAU,IAAIC,oBAAME,QAAjD;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAEF,oBAAMG;AAAtB,IADF,eAEE;AAAK,IAAA,SAAS,EAAEH,oBAAMI;AAAtB,kBACE,6BAAC,0CAAD;AAAY,IAAA,SAAS,EAAEJ,oBAAMK;AAA7B,IADF,eAEE,6BAAC,uCAAD;AAAS,IAAA,SAAS,EAAEL,oBAAMM;AAA1B,IAFF,eAGE,6BAAC,sCAAD;AAAW,IAAA,SAAS,EAAEN,oBAAMO;AAA5B,IAHF,CAFF,CADF;AAUD,CAfD;;AAiBAV,UAAU,CAACW,SAAX,2CAAuB;AACrBT,EAAAA,UAAU,EAAEU,mBAAUC;AADD,CAAvB;eAIeb,U","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isUndefined} from 'lodash/fp';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidRemoveAddRemoveCircle1 as RemoveIcon,\n  NovaSolidRemoveAddAddCircle1 as AddIcon\n} from '@coorpacademy/nova-icons';\nimport style from './selectable.css';\n\nconst Selectable = props => {\n  const {isSelected} = props;\n\n  if (isUndefined(isSelected)) return null;\n\n  return (\n    <div className={classnames(style.selectable, isSelected && style.selected)}>\n      <div className={style.circle} />\n      <div className={style.iconWrapper}>\n        <RemoveIcon className={style.removeIcon} />\n        <AddIcon className={style.addIcon} />\n        <CheckIcon className={style.checkIcon} />\n      </div>\n    </div>\n  );\n};\n\nSelectable.propTypes = {\n  isSelected: PropTypes.bool\n};\n\nexport default Selectable;\n"],"file":"selectable.js"}
+{"version":3,"sources":["../../../src/molecule/card/selectable.js"],"names":["Selectable","props","isSelected","style","selectable","selected","circle","iconWrapper","addIcon","checkIcon","propTypes","PropTypes","bool"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAIA;;;;AAEA,MAAMA,UAAU,GAAGC,KAAK,IAAI;AAC1B,QAAM;AAACC,IAAAA;AAAD,MAAeD,KAArB;AAEA,MAAI,2BAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;AAE7B,sBACE;AAAK,IAAA,SAAS,EAAE,yBAAWC,oBAAMC,UAAjB,EAA6BF,UAAU,IAAIC,oBAAME,QAAjD;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAEF,oBAAMG;AAAtB,IADF,eAEE;AAAK,IAAA,SAAS,EAAEH,oBAAMI;AAAtB,kBACE,6BAAC,uCAAD;AAAS,IAAA,SAAS,EAAEJ,oBAAMK;AAA1B,IADF,eAEE,6BAAC,sCAAD;AAAW,IAAA,SAAS,EAAEL,oBAAMM;AAA5B,IAFF,CAFF,CADF;AASD,CAdD;;AAgBAT,UAAU,CAACU,SAAX,2CAAuB;AACrBR,EAAAA,UAAU,EAAES,mBAAUC;AADD,CAAvB;eAIeZ,U","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isUndefined} from 'lodash/fp';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidRemoveAddAddCircle1 as AddIcon\n} from '@coorpacademy/nova-icons';\nimport style from './selectable.css';\n\nconst Selectable = props => {\n  const {isSelected} = props;\n\n  if (isUndefined(isSelected)) return null;\n\n  return (\n    <div className={classnames(style.selectable, isSelected && style.selected)}>\n      <div className={style.circle} />\n      <div className={style.iconWrapper}>\n        <AddIcon className={style.addIcon} />\n        <CheckIcon className={style.checkIcon} />\n      </div>\n    </div>\n  );\n};\n\nSelectable.propTypes = {\n  isSelected: PropTypes.bool\n};\n\nexport default Selectable;\n"],"file":"selectable.js"}

package/lib/molecule/vertical-tabs/index.js

@@ -3,8 +3,6 @@
 exports.__esModule = true;
 exports.default = void 0;
 
-var _snakeCase2 = _interopRequireDefault(require("lodash/fp/snakeCase"));
-
 var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -13,6 +11,10 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _novaIcons = require("@coorpacademy/nova-icons");
 
+var _keys = _interopRequireDefault(require("lodash/fp/keys"));
+
+var _snakeCase = _interopRequireDefault(require("lodash/fp/snakeCase"));
+
 var _link = _interopRequireDefault(require("../../atom/link"));
 
 var _style = _interopRequireDefault(require("./style.css"));
@@ -20,26 +22,32 @@ var _style = _interopRequireDefault(require("./style.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const LeftIcons = {
-  BlueValidatedCircle: _novaIcons.NovaSolidStatusCheckCircle2
+  BlueValidatedCircle: _novaIcons.NovaSolidStatusCheckCircle2,
+  LocaleInError: _novaIcons.NovaSolidStatusClose
 };
 
+const getIconDataName = iconType => iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';
+
 const buildTab = (tab, index) => {
   const {
     title,
     selected,
     onClick,
-    leftIcon
+    leftIcon,
+    iconAriaLabel
   } = tab;
   const LeftIcon = LeftIcons[leftIcon];
   return /*#__PURE__*/_react.default.createElement("li", {
-    "data-name": `vertical_tab_${(0, _snakeCase2.default)(title)}`,
+    "data-name": `vertical_tab_${(0, _snakeCase.default)(title)}`,
     className: (0, _classnames.default)(_style.default.tab, selected && _style.default.selected),
     key: index,
     onClick: onClick
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: _style.default.title
   }, title), LeftIcon ? /*#__PURE__*/_react.default.createElement(LeftIcon, {
-    className: _style.default.leftIcon
+    "data-name": getIconDataName(leftIcon),
+    "aria-label": iconAriaLabel,
+    className: leftIcon === 'LocaleInError' ? _style.default.leftIconError : _style.default.leftIcon
   }) : null);
 };
 
@@ -56,12 +64,14 @@ const VerticalTabs = props => {
   }, tabsList);
 };
 
+const LeftIconValues = process.env.NODE_ENV !== "production" ? [...(0, _keys.default)(LeftIcons), ''] : {};
 VerticalTabs.propTypes = process.env.NODE_ENV !== "production" ? {
   tabs: _propTypes.default.arrayOf(_propTypes.default.shape({
     title: _link.default.propTypes.children,
     selected: _propTypes.default.bool,
-    leftIcon: _propTypes.default.string,
-    onClick: _propTypes.default.func
+    leftIcon: _propTypes.default.oneOf(LeftIconValues),
+    onClick: _propTypes.default.func,
+    iconAriaLabel: _propTypes.default.string
   })),
   className: _propTypes.default.string,
   'aria-label': _propTypes.default.string

package/lib/molecule/vertical-tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["LeftIcons","BlueValidatedCircle","CheckIcon","buildTab","tab","index","title","selected","onClick","leftIcon","LeftIcon","style","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","propTypes","PropTypes","arrayOf","shape","Link","children","bool","string","func"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;AAEA,MAAMA,SAAS,GAAG;AAChBC,EAAAA,mBAAmB,EAAEC;AADL,CAAlB;;AAIA,MAAMC,QAAQ,GAAG,CAACC,GAAD,EAAMC,KAAN,KAAgB;AAC/B,QAAM;AAACC,IAAAA,KAAD;AAAQC,IAAAA,QAAR;AAAkBC,IAAAA,OAAlB;AAA2BC,IAAAA;AAA3B,MAAuCL,GAA7C;AAEA,QAAMM,QAAQ,GAAGV,SAAS,CAACS,QAAD,CAA1B;AACA,sBACE;AACE,iBAAY,gBAAe,yBAAUH,KAAV,CAAiB,EAD9C;AAEE,IAAA,SAAS,EAAE,yBAAWK,eAAMP,GAAjB,EAAsBG,QAAQ,IAAII,eAAMJ,QAAxC,CAFb;AAGE,IAAA,GAAG,EAAEF,KAHP;AAIE,IAAA,OAAO,EAAEG;AAJX,kBAME;AAAM,IAAA,SAAS,EAAEG,eAAML;AAAvB,KAA+BA,KAA/B,CANF,EAOGI,QAAQ,gBAAG,6BAAC,QAAD;AAAU,IAAA,SAAS,EAAEC,eAAMF;AAA3B,IAAH,GAA6C,IAPxD,CADF;AAWD,CAfD;;AAiBA,MAAMG,YAAY,GAAGC,KAAK,IAAI;AAC5B,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,SAAP;AAAkB,kBAAcC;AAAhC,MAA6CH,KAAnD;AACA,QAAMI,QAAQ,GAAGH,IAAI,CAACI,GAAL,CAASf,QAAT,CAAjB;AAEA,sBACE;AAAI,IAAA,SAAS,EAAE,yBAAW,CAACQ,eAAMQ,OAAP,EAAgBJ,SAAhB,CAAX,CAAf;AAAuD,IAAA,KAAK,EAAEC;AAA9D,KACGC,QADH,CADF;AAKD,CATD;;AAWAL,YAAY,CAACQ,SAAb,2CAAyB;AACvBN,EAAAA,IAAI,EAAEO,mBAAUC,OAAV,CACJD,mBAAUE,KAAV,CAAgB;AACdjB,IAAAA,KAAK,EAAEkB,cAAKJ,SAAL,CAAeK,QADR;AAEdlB,IAAAA,QAAQ,EAAEc,mBAAUK,IAFN;AAGdjB,IAAAA,QAAQ,EAAEY,mBAAUM,MAHN;AAIdnB,IAAAA,OAAO,EAAEa,mBAAUO;AAJL,GAAhB,CADI,CADiB;AASvBb,EAAAA,SAAS,EAAEM,mBAAUM,MATE;AAUvB,gBAAcN,mBAAUM;AAVD,CAAzB;eAYef,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaSolidStatusCheckCircle2 as CheckIcon} from '@coorpacademy/nova-icons';\nimport {snakeCase} from 'lodash/fp';\nimport Link from '../../atom/link';\nimport style from './style.css';\n\nconst LeftIcons = {\n  BlueValidatedCircle: CheckIcon\n};\n\nconst buildTab = (tab, index) => {\n  const {title, selected, onClick, leftIcon} = tab;\n\n  const LeftIcon = LeftIcons[leftIcon];\n  return (\n    <li\n      data-name={`vertical_tab_${snakeCase(title)}`}\n      className={classnames(style.tab, selected && style.selected)}\n      key={index}\n      onClick={onClick}\n    >\n      <span className={style.title}>{title}</span>\n      {LeftIcon ? <LeftIcon className={style.leftIcon} /> : null}\n    </li>\n  );\n};\n\nconst VerticalTabs = props => {\n  const {tabs, className, 'aria-label': ariaLabel} = props;\n  const tabsList = tabs.map(buildTab);\n\n  return (\n    <ul className={classnames([style.wrapper, className])} title={ariaLabel}>\n      {tabsList}\n    </ul>\n  );\n};\n\nVerticalTabs.propTypes = {\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: Link.propTypes.children,\n      selected: PropTypes.bool,\n      leftIcon: PropTypes.string,\n      onClick: PropTypes.func\n    })\n  ),\n  className: PropTypes.string,\n  'aria-label': PropTypes.string\n};\nexport default VerticalTabs;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/vertical-tabs/index.js"],"names":["LeftIcons","BlueValidatedCircle","CheckIcon","LocaleInError","ErrorIcon","getIconDataName","iconType","buildTab","tab","index","title","selected","onClick","leftIcon","iconAriaLabel","LeftIcon","style","leftIconError","VerticalTabs","props","tabs","className","ariaLabel","tabsList","map","wrapper","LeftIconValues","propTypes","PropTypes","arrayOf","shape","Link","children","bool","oneOf","func","string"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,SAAS,GAAG;AAChBC,EAAAA,mBAAmB,EAAEC,sCADL;AAEhBC,EAAAA,aAAa,EAAEC;AAFC,CAAlB;;AAKA,MAAMC,eAAe,GAAGC,QAAQ,IAC9BA,QAAQ,KAAK,eAAb,GAA+B,uBAA/B,GAAyD,sBAD3D;;AAGA,MAAMC,QAAQ,GAAG,CAACC,GAAD,EAAMC,KAAN,KAAgB;AAC/B,QAAM;AAACC,IAAAA,KAAD;AAAQC,IAAAA,QAAR;AAAkBC,IAAAA,OAAlB;AAA2BC,IAAAA,QAA3B;AAAqCC,IAAAA;AAArC,MAAsDN,GAA5D;AAEA,QAAMO,QAAQ,GAAGf,SAAS,CAACa,QAAD,CAA1B;AACA,sBACE;AACE,iBAAY,gBAAe,wBAAUH,KAAV,CAAiB,EAD9C;AAEE,IAAA,SAAS,EAAE,yBAAWM,eAAMR,GAAjB,EAAsBG,QAAQ,IAAIK,eAAML,QAAxC,CAFb;AAGE,IAAA,GAAG,EAAEF,KAHP;AAIE,IAAA,OAAO,EAAEG;AAJX,kBAME;AAAM,IAAA,SAAS,EAAEI,eAAMN;AAAvB,KAA+BA,KAA/B,CANF,EAOGK,QAAQ,gBACP,6BAAC,QAAD;AACE,iBAAWV,eAAe,CAACQ,QAAD,CAD5B;AAEE,kBAAYC,aAFd;AAGE,IAAA,SAAS,EAAED,QAAQ,KAAK,eAAb,GAA+BG,eAAMC,aAArC,GAAqDD,eAAMH;AAHxE,IADO,GAML,IAbN,CADF;AAiBD,CArBD;;AAuBA,MAAMK,YAAY,GAAGC,KAAK,IAAI;AAC5B,QAAM;AAACC,IAAAA,IAAD;AAAOC,IAAAA,SAAP;AAAkB,kBAAcC;AAAhC,MAA6CH,KAAnD;AACA,QAAMI,QAAQ,GAAGH,IAAI,CAACI,GAAL,CAASjB,QAAT,CAAjB;AAEA,sBACE;AAAI,IAAA,SAAS,EAAE,yBAAW,CAACS,eAAMS,OAAP,EAAgBJ,SAAhB,CAAX,CAAf;AAAuD,IAAA,KAAK,EAAEC;AAA9D,KACGC,QADH,CADF;AAKD,CATD;;AAWA,MAAMG,cAAN,2CAAuB,CAAC,GAAG,mBAAK1B,SAAL,CAAJ,EAAqB,EAArB,CAAvB;AAEAkB,YAAY,CAACS,SAAb,2CAAyB;AACvBP,EAAAA,IAAI,EAAEQ,mBAAUC,OAAV,CACJD,mBAAUE,KAAV,CAAgB;AACdpB,IAAAA,KAAK,EAAEqB,cAAKJ,SAAL,CAAeK,QADR;AAEdrB,IAAAA,QAAQ,EAAEiB,mBAAUK,IAFN;AAGdpB,IAAAA,QAAQ,EAAEe,mBAAUM,KAAV,CAAgBR,cAAhB,CAHI;AAIdd,IAAAA,OAAO,EAAEgB,mBAAUO,IAJL;AAKdrB,IAAAA,aAAa,EAAEc,mBAAUQ;AALX,GAAhB,CADI,CADiB;AAUvBf,EAAAA,SAAS,EAAEO,mBAAUQ,MAVE;AAWvB,gBAAcR,mBAAUQ;AAXD,CAAzB;eAaelB,Y","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidStatusClose as ErrorIcon\n} from '@coorpacademy/nova-icons';\nimport keys from 'lodash/fp/keys';\nimport snakeCase from 'lodash/fp/snakeCase';\nimport Link from '../../atom/link';\nimport style from './style.css';\n\nconst LeftIcons = {\n  BlueValidatedCircle: CheckIcon,\n  LocaleInError: ErrorIcon\n};\n\nconst getIconDataName = iconType =>\n  iconType === 'LocaleInError' ? 'validated-locale-icon' : 'locale-in-error-icon';\n\nconst buildTab = (tab, index) => {\n  const {title, selected, onClick, leftIcon, iconAriaLabel} = tab;\n\n  const LeftIcon = LeftIcons[leftIcon];\n  return (\n    <li\n      data-name={`vertical_tab_${snakeCase(title)}`}\n      className={classnames(style.tab, selected && style.selected)}\n      key={index}\n      onClick={onClick}\n    >\n      <span className={style.title}>{title}</span>\n      {LeftIcon ? (\n        <LeftIcon\n          data-name={getIconDataName(leftIcon)}\n          aria-label={iconAriaLabel}\n          className={leftIcon === 'LocaleInError' ? style.leftIconError : style.leftIcon}\n        />\n      ) : null}\n    </li>\n  );\n};\n\nconst VerticalTabs = props => {\n  const {tabs, className, 'aria-label': ariaLabel} = props;\n  const tabsList = tabs.map(buildTab);\n\n  return (\n    <ul className={classnames([style.wrapper, className])} title={ariaLabel}>\n      {tabsList}\n    </ul>\n  );\n};\n\nconst LeftIconValues = [...keys(LeftIcons), ''];\n\nVerticalTabs.propTypes = {\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: Link.propTypes.children,\n      selected: PropTypes.bool,\n      leftIcon: PropTypes.oneOf(LeftIconValues),\n      onClick: PropTypes.func,\n      iconAriaLabel: PropTypes.string\n    })\n  ),\n  className: PropTypes.string,\n  'aria-label': PropTypes.string\n};\nexport default VerticalTabs;\n"],"file":"index.js"}

package/lib/molecule/vertical-tabs/style.css

@@ -5,6 +5,7 @@
 @value medium from colors;
 @value cm_blue_50 from colors;
 @value cm_primary_blue from colors;
+@value cm_negative_100 from colors;
 
 .wrapper {
   background-color: white;
@@ -52,6 +53,16 @@
   color: cm_primary_blue
 }
 
+.leftIconError {
+  background-color: cm_negative_100;
+  color: white;
+  border-radius: 50%;
+  padding: 2px;
+  width: 9px;
+  height: 9px;
+  margin-right: 3px;
+}
+
 .tab:hover {
   color: cm_blue_50;
 }

package/lib/molecule/vertical-tabs/test/fixtures/default.js

@@ -1,24 +1,31 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.default = exports.iconAriaLabelSuccess = exports.iconAriaLabelError = void 0;
+const iconAriaLabelError = 'Locale with errors icon';
+exports.iconAriaLabelError = iconAriaLabelError;
+const iconAriaLabelSuccess = 'Validated locale icon';
+exports.iconAriaLabelSuccess = iconAriaLabelSuccess;
 var _default = {
   props: {
     tabs: [{
       title: '🇫🇷 French',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: iconAriaLabelSuccess
     }, {
       title: '🇪🇸 Spanish',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: iconAriaLabelSuccess
     }, {
       title: '🇮🇹 Italian',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: iconAriaLabelSuccess
     }, {
       title: '🇩🇪 German',
       leftIcon: '',

package/lib/molecule/vertical-tabs/test/fixtures/default.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KADI,EAOJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAPI,EAaJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAbI,EAmBJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAnBI,EAyBJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAzBI,EA+BJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA/BI,EAqCJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KArCI,CADD;AA6CL,kBAAc;AA7CT;AADM,C","sourcesContent":["export default {\n  props: {\n    tabs: [\n      {\n        title: '🇫🇷 French',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇪🇸 Spanish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇮🇹 Italian',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      }\n    ],\n    'aria-label': 'Languages list'\n  }\n};\n"],"file":"default.js"}
+{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/default.js"],"names":["iconAriaLabelError","iconAriaLabelSuccess","props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel"],"mappings":";;;;AAAO,MAAMA,kBAAkB,GAAG,yBAA3B;;AACA,MAAMC,oBAAoB,GAAG,uBAA7B;;eAEQ;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KADI,EAQJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KARI,EAeJ;AACEG,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAET;AALjB,KAfI,EAsBJ;AACEG,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAlCI,EAwCJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAxCI,CADD;AAgDL,kBAAc;AAhDT;AADM,C","sourcesContent":["export const iconAriaLabelError = 'Locale with errors icon';\nexport const iconAriaLabelSuccess = 'Validated locale icon';\n\nexport default {\n  props: {\n    tabs: [\n      {\n        title: '🇫🇷 French',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇪🇸 Spanish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇮🇹 Italian',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      }\n    ],\n    'aria-label': 'Languages list'\n  }\n};\n"],"file":"default.js"}

package/lib/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js

@@ -0,0 +1,54 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _default2 = require("./default");
+
+var _default = {
+  props: {
+    tabs: [{
+      title: '🇫🇷 French',
+      leftIcon: 'LocaleInError',
+      onClick: () => console.log('click'),
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelError
+    }, {
+      title: '🇪🇸 Spanish',
+      leftIcon: 'BlueValidatedCircle',
+      onClick: () => console.log('click'),
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelSuccess
+    }, {
+      title: '🇮🇹 Italian',
+      leftIcon: 'LocaleInError',
+      onClick: () => console.log('click'),
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelError
+    }, {
+      title: '🇩🇪 German',
+      leftIcon: '',
+      onClick: () => console.log('click'),
+      selected: false
+    }, {
+      title: '🇷🇺 Russian',
+      leftIcon: '',
+      onClick: () => console.log('click'),
+      selected: false
+    }, {
+      title: '🇵🇱 Polish',
+      leftIcon: 'BlueValidatedCircle',
+      onClick: () => console.log('click'),
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelSuccess
+    }, {
+      title: '🇹🇷 Turkish',
+      leftIcon: '',
+      onClick: () => console.log('click'),
+      selected: false
+    }],
+    'aria-label': 'Languages list'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=with-multiple-errors.js.map

package/lib/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-multiple-errors.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel","iconAriaLabelError","iconAriaLabelSuccess"],"mappings":";;;;;AAAA;;eAEe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,IAAI,EAAE,CACJ;AACEC,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEC;AALjB,KADI,EAQJ;AACEP,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEE;AALjB,KARI,EAeJ;AACER,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,eAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEC;AALjB,KAfI,EAsBJ;AACEP,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAtBI,EA4BJ;AACEL,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KA5BI,EAkCJ;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEC,MAAAA,QAAQ,EAAE,qBAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE,KAJZ;AAKEC,MAAAA,aAAa,EAAEE;AALjB,KAlCI,EAyCJ;AACER,MAAAA,KAAK,EAAE,cADT;AAEEC,MAAAA,QAAQ,EAAE,EAFZ;AAGEC,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,OAAZ,CAHjB;AAIEC,MAAAA,QAAQ,EAAE;AAJZ,KAzCI,CADD;AAiDL,kBAAc;AAjDT;AADM,C","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n  props: {\n    tabs: [\n      {\n        title: '🇫🇷 French',\n        leftIcon: 'LocaleInError',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelError\n      },\n      {\n        title: '🇪🇸 Spanish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇮🇹 Italian',\n        leftIcon: 'LocaleInError',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelError\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      }\n    ],\n    'aria-label': 'Languages list'\n  }\n};\n"],"file":"with-multiple-errors.js"}

package/lib/molecule/vertical-tabs/test/fixtures/with-selected-item.js

@@ -2,23 +2,29 @@
 
 exports.__esModule = true;
 exports.default = void 0;
+
+var _default2 = require("./default");
+
 var _default = {
   props: {
     tabs: [{
       title: '🇫🇷 French',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: true
+      selected: true,
+      iconAriaLabel: _default2.iconAriaLabelSuccess
     }, {
       title: '🇪🇸 Spanish',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelSuccess
     }, {
       title: '🇮🇹 Italian',
       leftIcon: 'BlueValidatedCircle',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelSuccess
     }, {
       title: '🇩🇪 German',
       leftIcon: '',
@@ -76,9 +82,10 @@ var _default = {
       selected: false
     }, {
       title: '🇹🇷 Turkish',
-      leftIcon: '',
+      leftIcon: 'LocaleInError',
       onClick: () => console.log('click'),
-      selected: false
+      selected: false,
+      iconAriaLabel: _default2.iconAriaLabelError
     }],
     'aria-label': 'Languages list'
   }

package/lib/molecule/vertical-tabs/test/fixtures/with-selected-item.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected"],"mappings":"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","sourcesContent":["export default {\n  props: {\n    tabs: [\n      {\n        title: '🇫🇷 French',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: true\n      },\n      {\n        title: '🇪🇸 Spanish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇮🇹 Italian',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      }\n    ],\n    'aria-label': 'Languages list'\n  }\n};\n"],"file":"with-selected-item.js"}
+{"version":3,"sources":["../../../../../src/molecule/vertical-tabs/test/fixtures/with-selected-item.js"],"names":["props","tabs","title","leftIcon","onClick","console","log","selected","iconAriaLabel","iconAriaLabelSuccess","iconAriaLabelError"],"mappings":"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","sourcesContent":["import {iconAriaLabelError, iconAriaLabelSuccess} from './default';\n\nexport default {\n  props: {\n    tabs: [\n      {\n        title: '🇫🇷 French',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: true,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇪🇸 Spanish',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇮🇹 Italian',\n        leftIcon: 'BlueValidatedCircle',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelSuccess\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇩🇪 German',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇷🇺 Russian',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇵🇱 Polish',\n        leftIcon: '',\n        onClick: () => console.log('click'),\n        selected: false\n      },\n      {\n        title: '🇹🇷 Turkish',\n        leftIcon: 'LocaleInError',\n        onClick: () => console.log('click'),\n        selected: false,\n        iconAriaLabel: iconAriaLabelError\n      }\n    ],\n    'aria-label': 'Languages list'\n  }\n};\n"],"file":"with-selected-item.js"}

package/lib/molecule/vertical-tabs/test/fixtures.js

@@ -10,6 +10,8 @@ var _ = _interopRequireDefault(require(".."));
 
 var _default = _interopRequireDefault(require("./fixtures/default"));
 
+var _withMultipleErrors = _interopRequireDefault(require("./fixtures/with-multiple-errors"));
+
 var _withSelectedItem = _interopRequireDefault(require("./fixtures/with-selected-item"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -21,5 +23,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
   });
 });
 (0, _ava.default)('Molecule › MoleculeVerticalTabs › Default › should be rendered', _renderComponent.default, _.default, _default.default);
+(0, _ava.default)('Molecule › MoleculeVerticalTabs › WithMultipleErrors › should be rendered', _renderComponent.default, _.default, _withMultipleErrors.default);
 (0, _ava.default)('Molecule › MoleculeVerticalTabs › WithSelectedItem › should be rendered', _renderComponent.default, _.default, _withSelectedItem.default);
 //# sourceMappingURL=fixtures.js.map

package/lib/molecule/vertical-tabs/test/fixtures.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/molecule/vertical-tabs/test/fixtures.js"],"names":["t","pass","MoleculeVerticalTabs","propTypes","value","key","not","undefined","renderComponentMacro","fixtureDefault","fixtureWithSelectedItem"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,+DAAL,EAAsEA,CAAC,IAAI;AACzEA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAqBC,SAA7B,EAAwC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACtDL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,yDAAwDF,GAAI,mEAArF;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,gEAAL,EAAuEG,wBAAvE,EAA6FN,SAA7F,EAAmHO,gBAAnH;AACA,kBAAK,yEAAL,EAAgFD,wBAAhF,EAAsGN,SAAtG,EAA4HQ,yBAA5H","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeVerticalTabs from '..';\nimport fixtureDefault from './fixtures/default';\nimport fixtureWithSelectedItem from './fixtures/with-selected-item';\n\ntest('Molecule › MoleculeVerticalTabs > should have valid propTypes', t => {\n  t.pass();\n  forEach(MoleculeVerticalTabs.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Molecule.MoleculeVerticalTabs.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Molecule › MoleculeVerticalTabs › Default › should be rendered', renderComponentMacro, MoleculeVerticalTabs, fixtureDefault);\ntest('Molecule › MoleculeVerticalTabs › WithSelectedItem › should be rendered', renderComponentMacro, MoleculeVerticalTabs, fixtureWithSelectedItem);\n"],"file":"fixtures.js"}
+{"version":3,"sources":["../../../../src/molecule/vertical-tabs/test/fixtures.js"],"names":["t","pass","MoleculeVerticalTabs","propTypes","value","key","not","undefined","renderComponentMacro","fixtureDefault","fixtureWithMultipleErrors","fixtureWithSelectedItem"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,+DAAL,EAAsEA,CAAC,IAAI;AACzEA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAqBC,SAA7B,EAAwC,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACtDL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,yDAAwDF,GAAI,mEAArF;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,gEAAL,EAAuEG,wBAAvE,EAA6FN,SAA7F,EAAmHO,gBAAnH;AACA,kBAAK,2EAAL,EAAkFD,wBAAlF,EAAwGN,SAAxG,EAA8HQ,2BAA9H;AACA,kBAAK,yEAAL,EAAgFF,wBAAhF,EAAsGN,SAAtG,EAA4HS,yBAA5H","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport MoleculeVerticalTabs from '..';\nimport fixtureDefault from './fixtures/default';\nimport fixtureWithMultipleErrors from './fixtures/with-multiple-errors';\nimport fixtureWithSelectedItem from './fixtures/with-selected-item';\n\ntest('Molecule › MoleculeVerticalTabs > should have valid propTypes', t => {\n  t.pass();\n  forEach(MoleculeVerticalTabs.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Molecule.MoleculeVerticalTabs.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Molecule › MoleculeVerticalTabs › Default › should be rendered', renderComponentMacro, MoleculeVerticalTabs, fixtureDefault);\ntest('Molecule › MoleculeVerticalTabs › WithMultipleErrors › should be rendered', renderComponentMacro, MoleculeVerticalTabs, fixtureWithMultipleErrors);\ntest('Molecule › MoleculeVerticalTabs › WithSelectedItem › should be rendered', renderComponentMacro, MoleculeVerticalTabs, fixtureWithSelectedItem);\n"],"file":"fixtures.js"}

package/lib/molecule/wizard-summary/index.js

@@ -133,7 +133,8 @@ const BuildAction = ({
     text,
     disabled = false,
     icon,
-    'aria-label': ariaLabel
+    'aria-label': ariaLabel,
+    side
   } = action;
   const handleClick = (0, _react.useMemo)(() => () => onClick(), [onClick]);
   if (!action) return null;
@@ -142,7 +143,7 @@ const BuildAction = ({
     label: text,
     disabled,
     'aria-label': ariaLabel,
-    'data-name': `${icon}-button`,
+    'data-name': `${icon}-button-${side}`,
     onClick: handleClick,
     icon: {
       position: 'left',
@@ -158,21 +159,23 @@ const WizardSummary = props => {
   const {
     title,
     sections,
-    action
+    action,
+    side
   } = props;
   const sectionsView = buildSections(sections);
   const idSwitch = (0, _uniqueId2.default)('open-summary-wizard');
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.container
   }, /*#__PURE__*/_react.default.createElement("span", {
-    className: _style.default.desktopSummaryTitle
+    className: _style.default.desktopSummaryTitle,
+    "data-name": `summary-title-${side}`
   }, title), /*#__PURE__*/_react.default.createElement("input", {
     type: "checkbox",
     id: idSwitch,
     name: "toogle",
     title: idSwitch,
     className: _style.default.checkbox,
-    "data-name": 'summary-checkbox'
+    "data-name": `summary-checkbox-${side}`
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.summary
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -184,11 +187,14 @@ const WizardSummary = props => {
   }, title), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationArrowDown, {
     className: _style.default.tabletSummaryIcon
   }))), /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.summarySections
+    className: _style.default.summarySections,
+    "data-name": `summary-section-${side}`
   }, sectionsView)), /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.actionZone
+    className: _style.default.actionZone,
+    "data-name": `summary-actions-${side}`
   }, /*#__PURE__*/_react.default.createElement(BuildAction, {
-    action: action
+    action: action,
+    side: side
   })));
 };
 
@@ -197,12 +203,14 @@ BuildAction.propTypes = process.env.NODE_ENV !== "production" ? {
     icon: _propTypes.default.string,
     disabled: _propTypes.default.bool,
     text: _propTypes.default.string,
+    side: _propTypes.default.string,
     onClick: _propTypes.default.func,
     'aria-label': _propTypes.default.string
   })
 } : {};
 WizardSummary.propTypes = process.env.NODE_ENV !== "production" ? {
   title: _propTypes.default.string,
+  side: _propTypes.default.string,
   sections: _propTypes.default.arrayOf(_propTypes.default.shape({
     title: _propTypes.default.string,
     items: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.shape({