@coorpacademy/components 10.2.0 → 10.3.1

package/es/atom/wizard-steps/index.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import style from './style.css';
 
-const WizardSteps = (props, context) => {
+const WizardSteps = props => {
   const {
     steps
   } = props;

package/es/atom/wizard-steps/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/atom/wizard-steps/index.js"],"names":["React","PropTypes","classnames","style","WizardSteps","props","context","steps","wizard","map","step","index","done","current","label","title","outerDot","dot","container","propTypes","arrayOf","shape","string","bool"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,WAAW,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;AACtC,QAAM;AAACC,IAAAA;AAAD,MAAUF,KAAhB;AAEA,QAAMG,MAAM,GAAGD,KAAK,CAACE,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,KAAiB;AACxC,wBACE;AACE,MAAA,SAAS,EAAET,UAAU,CAACC,KAAK,CAACO,IAAP,EAAaA,IAAI,CAACE,IAAL,IAAaT,KAAK,CAACS,IAAhC,EAAsCF,IAAI,CAACG,OAAL,IAAgBV,KAAK,CAACU,OAA5D,CADvB;AAEE,MAAA,GAAG,EAAG,QAAOF,KAAM,EAFrB;AAGE,mBAAWA;AAHb,oBAKE;AAAK,MAAA,SAAS,EAAER,KAAK,CAACW;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAEX,KAAK,CAACY;AAAtB,OAA8BL,IAAI,CAACK,KAAnC,CADF,CALF,eAQE;AAAK,MAAA,SAAS,EAAEZ,KAAK,CAACa;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAEb,KAAK,CAACc;AAAtB,WADF,CARF,CADF;AAcD,GAfc,CAAf;AAiBA,sBAAO;AAAK,IAAA,SAAS,EAAEd,KAAK,CAACe;AAAtB,KAAkCV,MAAlC,CAAP;AACD,CArBD;;AAuBAJ,WAAW,CAACe,SAAZ,2CAAwB;AACtBZ,EAAAA,KAAK,EAAEN,SAAS,CAACmB,OAAV,CACLnB,SAAS,CAACoB,KAAV,CAAgB;AACdN,IAAAA,KAAK,EAAEd,SAAS,CAACqB,MADH;AAEdV,IAAAA,IAAI,EAAEX,SAAS,CAACsB,IAFF;AAGdV,IAAAA,OAAO,EAAEZ,SAAS,CAACsB;AAHL,GAAhB,CADK;AADe,CAAxB;AAUA,eAAenB,WAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport style from './style.css';\n\nconst WizardSteps = (props, context) => {\n  const {steps} = props;\n\n  const wizard = steps.map((step, index) => {\n    return (\n      <div\n        className={classnames(style.step, step.done && style.done, step.current && style.current)}\n        key={`step-${index}`}\n        data-step={index}\n      >\n        <div className={style.label}>\n          <div className={style.title}>{step.title}</div>\n        </div>\n        <div className={style.outerDot}>\n          <div className={style.dot}> </div>\n        </div>\n      </div>\n    );\n  });\n\n  return <div className={style.container}>{wizard}</div>;\n};\n\nWizardSteps.propTypes = {\n  steps: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: PropTypes.string,\n      done: PropTypes.bool,\n      current: PropTypes.bool\n    })\n  )\n};\n\nexport default WizardSteps;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/atom/wizard-steps/index.js"],"names":["React","PropTypes","classnames","style","WizardSteps","props","steps","wizard","map","step","index","done","current","label","title","outerDot","dot","container","propTypes","arrayOf","shape","string","bool"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,WAAW,GAAGC,KAAK,IAAI;AAC3B,QAAM;AAACC,IAAAA;AAAD,MAAUD,KAAhB;AAEA,QAAME,MAAM,GAAGD,KAAK,CAACE,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,KAAiB;AACxC,wBACE;AACE,MAAA,SAAS,EAAER,UAAU,CAACC,KAAK,CAACM,IAAP,EAAaA,IAAI,CAACE,IAAL,IAAaR,KAAK,CAACQ,IAAhC,EAAsCF,IAAI,CAACG,OAAL,IAAgBT,KAAK,CAACS,OAA5D,CADvB;AAEE,MAAA,GAAG,EAAG,QAAOF,KAAM,EAFrB;AAGE,mBAAWA;AAHb,oBAKE;AAAK,MAAA,SAAS,EAAEP,KAAK,CAACU;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAEV,KAAK,CAACW;AAAtB,OAA8BL,IAAI,CAACK,KAAnC,CADF,CALF,eAQE;AAAK,MAAA,SAAS,EAAEX,KAAK,CAACY;AAAtB,oBACE;AAAK,MAAA,SAAS,EAAEZ,KAAK,CAACa;AAAtB,WADF,CARF,CADF;AAcD,GAfc,CAAf;AAiBA,sBAAO;AAAK,IAAA,SAAS,EAAEb,KAAK,CAACc;AAAtB,KAAkCV,MAAlC,CAAP;AACD,CArBD;;AAuBAH,WAAW,CAACc,SAAZ,2CAAwB;AACtBZ,EAAAA,KAAK,EAAEL,SAAS,CAACkB,OAAV,CACLlB,SAAS,CAACmB,KAAV,CAAgB;AACdN,IAAAA,KAAK,EAAEb,SAAS,CAACoB,MADH;AAEdV,IAAAA,IAAI,EAAEV,SAAS,CAACqB,IAFF;AAGdV,IAAAA,OAAO,EAAEX,SAAS,CAACqB;AAHL,GAAhB,CADK;AADe,CAAxB;AAUA,eAAelB,WAAf","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport style from './style.css';\n\nconst WizardSteps = props => {\n  const {steps} = props;\n\n  const wizard = steps.map((step, index) => {\n    return (\n      <div\n        className={classnames(style.step, step.done && style.done, step.current && style.current)}\n        key={`step-${index}`}\n        data-step={index}\n      >\n        <div className={style.label}>\n          <div className={style.title}>{step.title}</div>\n        </div>\n        <div className={style.outerDot}>\n          <div className={style.dot}> </div>\n        </div>\n      </div>\n    );\n  });\n\n  return <div className={style.container}>{wizard}</div>;\n};\n\nWizardSteps.propTypes = {\n  steps: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: PropTypes.string,\n      done: PropTypes.bool,\n      current: PropTypes.bool\n    })\n  )\n};\n\nexport default WizardSteps;\n"],"file":"index.js"}

package/es/atom/wizard-steps/style.css

@@ -31,7 +31,6 @@
   position: absolute;
   border: 1px solid cm_grey_500;
   display: block;
-  z-index: 2;
   left: -50%;
   bottom: 17px;
   content: '';
@@ -42,7 +41,6 @@
   position: absolute;
   border: 1px solid cm_grey_500;
   display: block;
-  z-index: 1;
   left: 50%;
   bottom: 17px;
   content: '';
@@ -63,7 +61,6 @@
   border: 1px solid cm_primary_blue;
   bottom: 17px;
   left: 50%;
-  z-index: 2;
   position: absolute;
 }
 .step.done:before, .step.current:before {
@@ -72,7 +69,6 @@
   border: 1px solid cm_primary_blue;
   bottom: 17px;
   left: 0px;
-  z-index: 2;
   position: absolute;
 }
 
@@ -84,7 +80,6 @@
   border-radius: 10px;
   display: inline-block;
   position: relative;
-  z-index: 2;
   margin-left: 3px;
   margin-top: 3px;
   border: 1px solid cm_grey_500;
@@ -118,10 +113,10 @@
   border-radius: 18px;
   display: inline-block;
   position: relative;
-  z-index: 12;
   margin: 0px auto;
   border: 8px solid white;
   transition: background-color 0.5s linear;
+  z-index: 1;
 }
 
 .step.done .outerDot, .step.current .outerDot {

package/es/molecule/brand-form-group/style.css

@@ -3,7 +3,6 @@
 
 .wrapper {
   width: 100%;
-  padding-bottom: 50px;
 }
 
 .titleWrapper {
@@ -48,7 +47,7 @@
 }
 
 .field {
-  margin-bottom: 20px;
+  margin-bottom: 10px;
 }
 
 .field:last-child {

package/es/molecule/select-multiple/index.js

@@ -162,8 +162,8 @@ const SelectMultiple = ({
   }), /*#__PURE__*/React.createElement("div", {
     className: style.descriptionLabel
   }, description)) : null) : null;
-  const hintView = isCMTheme && !isActive ? /*#__PURE__*/React.createElement("div", {
-    className: style.hint // eslint-disable-next-line react/no-danger
+  const hintView = isCMTheme ? /*#__PURE__*/React.createElement("div", {
+    className: classnames(style.hint, isActive && style.hideHint) // eslint-disable-next-line react/no-danger
     ,
     dangerouslySetInnerHTML: {
       __html: error || hint

package/es/molecule/select-multiple/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["React","useState","useEffect","useRef","useCallback","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDown","NovaSolidStatusClose","ErrorIcon","NovaCompositionCoorpacademyInformationIcon","InfoIcon","TitledCheckbox","Provider","Checkbox","getClassState","style","themeStyle","setup","cockpit","sidebar","coorpmanager","useChoices","options","choicesRef","getChoices","current","setChoices","choice","choices","i","selected","filter","c","CMMultipleView","multiple","onChange","handleChange","checked","item","name","SelectMultiple","title","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","contains","target","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","childContextTypes","propTypes","bool","func","string","arrayOf","oneOf"],"mappings":";;;;;;;;;;;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,SAAzB,EAAoCC,MAApC,EAA4CC,WAA5C,QAA8D,OAA9D;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,kCAAkC,IAAIC,SADxC,EAEEC,oBAAoB,IAAIC,SAF1B,EAGEC,0CAA0C,IAAIC,QAHhD,QAIO,0BAJP;AAKA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,QAAP,MAAqB,2BAArB;AACA,OAAOC,aAAP,MAA0B,4BAA1B;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,UAAU,GAAG;AACjBC,EAAAA,KAAK,EAAEF,KAAK,CAACE,KADI;AAEjBC,EAAAA,OAAO,EAAEH,KAAK,CAACG,OAFE;AAGjBC,EAAAA,OAAO,EAAEJ,KAAK,CAACI,OAHE;AAIjBC,EAAAA,YAAY,EAAEL,KAAK,CAACK;AAJH,CAAnB;AAOA,OAAO,MAAMC,UAAU,GAAGC,OAAO,IAAI;AACnC,QAAMC,UAAU,GAAGtB,MAAM,CAACqB,OAAD,CAAzB;;AAEA,QAAME,UAAU,GAAG,MAAM;AACvB,WAAOD,UAAU,CAACE,OAAlB;AACD,GAFD;;AAIA,QAAMC,UAAU,GAAGC,MAAM,IAAI;AAC3B,UAAMC,OAAO,GAAG,KAAK,IAAGD,MAAM,CAACE,CAAE,YAAjB,EAA8B,CAACF,MAAM,CAACG,QAAtC,EAAgDN,UAAU,EAA1D,CAAhB;;AAEAD,IAAAA,UAAU,CAACE,OAAX,GAAqBG,OAAO,CAACG,MAAR,CAAeC,CAAC,IAAIA,CAAC,CAACF,QAAtB,CAArB;AACD,GAJD;;AAMA,SAAO,CAACN,UAAD,EAAaE,UAAb,CAAP;AACD,CAdM;;AAgBP,MAAMO,cAAc,GAAG,CAAC;AAACC,EAAAA,QAAD;AAAWP,EAAAA,MAAX;AAAmBQ,EAAAA;AAAnB,CAAD,KAAkC;AACvD,QAAMC,YAAY,GAAGlC,WAAW,CAC9BmC,OAAO,IAAI;AACT,QAAI,CAACH,QAAL,EAAe;AACb,aAAOC,QAAQ,CAACR,MAAD,CAAf;AACD;;AACD,WAAOQ,QAAQ,uBAAKR,MAAL;AAAaG,MAAAA,QAAQ,EAAEO;AAAvB,OAAf;AACD,GAN6B,EAO9B,CAACF,QAAD,EAAWR,MAAX,EAAmBO,QAAnB,CAP8B,CAAhC;AAUA,SAAOA,QAAQ,gBACb;AAAK,IAAA,SAAS,EAAEnB,KAAK,CAACuB;AAAtB,kBACE,oBAAC,QAAD;AACE,IAAA,UAAU,EAAC,SADb;AAEE,IAAA,OAAO,EAAEX,MAAM,CAACG,QAFlB;AAGE,IAAA,QAAQ,EAAEM,YAHZ;AAIE,IAAA,cAAc,MAJhB;AAKE,IAAA,KAAK,EAAET,MAAM,CAACY;AALhB,IADF,CADa,gBAWb;AAAM,IAAA,SAAS,EAAExB,KAAK,CAACuB,IAAvB;AAA6B,IAAA,OAAO,EAAEF,YAAtC;AAAoD,IAAA,KAAK,EAAET,MAAM,CAACY;AAAlE,KACGZ,MAAM,CAACY,IADV,CAXF;AAeD,CA1BD;;AA4BA,MAAMC,cAAc,GAAG,CACrB;AACEC,EAAAA,KADF;AAEEnB,EAAAA,OAFF;AAGEoB,EAAAA,KAHF;AAIEC,EAAAA,WAJF;AAKEC,EAAAA,WALF;AAMEC,EAAAA,IANF;AAOEX,EAAAA,QAPF;AAQEC,EAAAA,QARF;AASEW,EAAAA,OATF;AAUEC,EAAAA,QAAQ,GAAG,KAVb;AAWEC,EAAAA,QAAQ,GAAG,KAXb;AAYEC,EAAAA,KAAK,GAAG,EAZV;AAaEC,EAAAA,QAAQ,GAAG;AAbb,CADqB,EAgBrB;AAACC,EAAAA;AAAD,CAhBqB,KAiBlB;AACH,QAAM,CAACC,QAAD,EAAWC,cAAX,IAA6BtD,QAAQ,CAAC,KAAD,CAA3C;AACA,QAAM,CAACyB,UAAD,EAAaE,UAAb,IAA2BL,UAAU,CAACC,OAAD,CAA3C;AACA,QAAMgC,OAAO,GAAGrD,MAAM,CAAC,IAAD,CAAtB;;AAEA,QAAMsD,YAAY,GAAG,KAAI,gBAAJ,EAAsBJ,IAAtB,CAArB;;AACA,QAAMK,KAAK,GAAG,KAAI,cAAJ,EAAoBL,IAApB,CAAd;;AAEA,QAAMM,aAAa,GAAGvD,WAAW,CAC/BwD,CAAC,IAAI;AACH,QAAIR,QAAJ,EAAc;AAEdQ,IAAAA,CAAC,CAACC,cAAF;AACAD,IAAAA,CAAC,CAACE,eAAF;AAEAP,IAAAA,cAAc,CAACQ,IAAI,IAAI,CAACA,IAAV,CAAd;AACD,GAR8B,EAS/B,CAACX,QAAD,CAT+B,CAAjC;AAYA,QAAMY,WAAW,GAAG5D,WAAW,CAACwD,CAAC,IAAI;AACnC,QAAIJ,OAAO,IAAIA,OAAO,CAAC7B,OAAnB,IAA8B,CAAC6B,OAAO,CAAC7B,OAAR,CAAgBsC,QAAhB,CAAyBL,CAAC,CAACM,MAA3B,CAAnC,EAAuE;AACrEX,MAAAA,cAAc,CAAC,KAAD,CAAd;AACD;AACF,GAJ8B,EAI5B,EAJ4B,CAA/B;AAMA,QAAMjB,YAAY,GAAGlC,WAAW,CAC9ByB,MAAM,IAAI;AACR;AACA;AACA,QAAIO,QAAJ,EAAc;AACZR,MAAAA,UAAU,CAACC,MAAD,CAAV;AAEA,aAAOQ,QAAQ,CAACX,UAAU,EAAX,CAAf;AACD;;AAED,WAAOW,QAAQ,CAACR,MAAD,CAAf;AACD,GAX6B,EAY9B,CAACO,QAAD,EAAWC,QAAX,EAAqBT,UAArB,EAAiCF,UAAjC,CAZ8B,CAAhC;AAeAxB,EAAAA,SAAS,CAAC,MAAM;AACdiE,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCJ,WAAnC;AACAG,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,YAA1B,EAAwCJ,WAAxC;AAEA,WAAO,MAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCL,WAAtC;AACAG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,YAA7B,EAA2CL,WAA3C;AACD,KAHD;AAID,GARQ,EAQN,CAACA,WAAD,CARM,CAAT;AAUA,QAAMM,SAAS,GAAG1B,KAAK,KAAK,cAA5B;;AAEA,QAAM2B,KAAK,GAAG,KAAIC,OAAJ,CAAY;AAACC,IAAAA,GAAG,EAAE;AAAN,GAAZ,EAA0B,CAAC5C,MAAD,EAASE,CAAT,KAAe;AACrD,wBACE;AAAI,MAAA,GAAG,EAAEA,CAAT;AAAY,MAAA,SAAS,EAAEd,KAAK,CAACY;AAA7B,OACGyC,SAAS,gBACR,oBAAC,cAAD;AAAgB,MAAA,QAAQ,EAAElC,QAA1B;AAAoC,MAAA,MAAM,wBAAMP,MAAN;AAAcE,QAAAA;AAAd,QAA1C;AAA4D,MAAA,QAAQ,EAAEO;AAAtE,MADQ,gBAGR,oBAAC,cAAD;AACE,MAAA,QAAQ,EAAEA,YADZ;AAEE,MAAA,MAAM,wBAAMT,MAAN;AAAcE,QAAAA;AAAd,QAFR;AAGE,MAAA,UAAU,EAAE0B;AAHd,MAJJ,CADF;AAaD,GAda,EAcXjC,OAdW,CAAd;;AAgBA,QAAMkD,SAAS,GAAG,MAAK,QAAO;AAAC1C,IAAAA,QAAQ,EAAE;AAAX,GAAP,CAAL,EAA+B,KAAI,MAAJ,CAA/B,EAA4C,MAAK,IAAL,CAA5C,EAAwDR,OAAxD,CAAlB;;AAEA,QAAMmD,MAAM,GAAGhC,KAAK,IAAK,GAAEA,KAAM,GAAEO,QAAQ,GAAG,IAAH,GAAU,EAAG,EAAxD;;AAEA,QAAM0B,QAAQ,GAAGtB,QAAQ,KAAK,IAA9B;AAEA,QAAMuB,SAAS,GAAGlC,KAAK,gBACrB;AACE,IAAA,SAAS,EAAErC,UAAU,CACnBW,KAAK,CAAC0B,KADa,EAEnB2B,SAAS,IAAII,SAAb,IAA0BzD,KAAK,CAAC6D,kBAFb,EAGnBR,SAAS,IAAI,SAAQI,SAAR,CAAb,IAAmCzD,KAAK,CAAC8D,OAHtB,EAInBH,QAAQ,IAAI3D,KAAK,CAAC+D,MAJC;AADvB,KAQGL,MARH,EASGL,SAAS,gBACR;AAAK,IAAA,SAAS,EAAErD,KAAK,CAACgE;AAAtB,kBACE,oBAAC,QAAD;AAAU,IAAA,SAAS,EAAEhE,KAAK,CAACiE;AAA3B,IADF,eAEE;AAAK,IAAA,SAAS,EAAEjE,KAAK,CAACkE;AAAtB,KAAyCrC,WAAzC,CAFF,CADQ,GAKN,IAdN,CADqB,GAiBnB,IAjBJ;AAmBA,QAAMsC,QAAQ,GACZd,SAAS,IAAI,CAACM,QAAd,gBACE;AACE,IAAA,SAAS,EAAE3D,KAAK,CAAC8B,IADnB,CAEE;AAFF;AAGE,IAAA,uBAAuB,EAAE;AAACsC,MAAAA,MAAM,EAAElC,KAAK,IAAIJ;AAAlB;AAH3B,IADF,GAMI,IAPN;AASA,QAAMuC,SAAS,GAAG1C,KAAK,GAAG1B,UAAU,CAAC0B,KAAD,CAAb,GAAuB3B,KAAK,CAACsE,OAApD;AACA,QAAMC,eAAe,GAAGlB,SAAS,IAAIM,QAArC;AACA,QAAMa,kBAAkB,GAAGzE,aAAa,CACtCC,KAAK,CAACsE,OADgC,EAEtCtE,KAAK,CAACgC,QAFgC,EAGtChC,KAAK,CAACkC,KAHgC,EAItCF,QAJsC,EAKtCE,KALsC,CAAxC;AAQA,QAAMuC,aAAa,GAAGvC,KAAK,gBAAG,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAEH,OAApB;AAA6B,IAAA,SAAS,EAAE/B,KAAK,CAAC0E;AAA9C,IAAH,GAAiE,IAA5F;AAEA,sBACE;AACE,IAAA,SAAS,EAAErF,UAAU,CAACgF,SAAD,EAAYG,kBAAZ,EAAgCrC,QAAQ,IAAInC,KAAK,CAACmC,QAAlD,CADvB;AAEE,IAAA,GAAG,EAAEI;AAFP,kBAIE,mCACG,CAACc,SAAD,IAAcO,SADjB,eAEE;AAAK,IAAA,SAAS,EAAE5D,KAAK,CAAC2E,MAAtB;AAA8B,IAAA,KAAK,EAAElB,SAAS,IAAI7B,WAAlD;AAA+D,IAAA,OAAO,EAAEc;AAAxE,KACGW,SAAS,IAAIO,SADhB,eAEE;AACE,IAAA,SAAS,EAAEvE,UAAU,CACnBW,KAAK,CAACyD,SADa,EAEnBJ,SAAS,IAAI,SAAQI,SAAR,CAAb,IAAmCzD,KAAK,CAAC4E,WAFtB;AADvB,KAMGnB,SAAS,IAAI,CAACJ,SAAd,IAA4BkB,eAAe,IAAI3C,WAA/C,IAA+D,IANlE,CAFF,EAUGyB,SAAS,gBACR;AAAK,IAAA,SAAS,EAAErD,KAAK,CAAC6E;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAE7E,KAAK,CAAC8E;AAAtB,KAA6BL,aAA7B,CADF,eAEE;AAAK,IAAA,SAAS,EAAEpF,UAAU,CAACW,KAAK,CAAC8E,IAAP,EAAanB,QAAQ,IAAI3D,KAAK,CAAC+E,OAA/B;AAA1B,kBACE,oBAAC,SAAD;AACE,IAAA,KAAK,EAAEtC,KADT;AAEE,IAAA,SAAS,EAAEpD,UAAU,CAACW,KAAK,CAACgF,KAAP,EAAc;AAAC,OAAChF,KAAK,CAACiF,IAAP,GAActB;AAAf,KAAd;AAFvB,IADF,CAFF,CADQ,gBAWR,oBAAC,SAAD;AACE,IAAA,KAAK,EAAElB,KADT;AAEE,IAAA,SAAS,EAAEpD,UAAU,CAACW,KAAK,CAACgF,KAAP,EAAc;AAAC,OAAChF,KAAK,CAACiF,IAAP,GAActB;AAAf,KAAd;AAFvB,IArBJ,CAFF,eA6BE;AAAK,IAAA,SAAS,EAAEtE,UAAU,CAACW,KAAK,CAACa,OAAP,EAAgB8C,QAAQ,IAAI3D,KAAK,CAACkF,aAAlC;AAA1B,kBACE;AAAI,IAAA,SAAS,EAAElF,KAAK,CAACmF;AAArB,KAA4B7B,KAA5B,CADF,CA7BF,CAJF,EAqCG,CAACD,SAAD,gBAAa;AAAK,IAAA,SAAS,EAAErD,KAAK,CAAC6B;AAAtB,KAAoCA,WAApC,CAAb,GAAsE,IArCzE,EAsCGsC,QAtCH,CADF;AA0CD,CA9KD;;AAgLA1C,cAAc,CAAC2D,YAAf,GAA8B;AAC5BhD,EAAAA,IAAI,EAAEvC,QAAQ,CAACwF,iBAAT,CAA2BjD;AADL,CAA9B;AAIAlB,cAAc,CAACoE,SAAf,2CAA2B;AACzBnE,EAAAA,QAAQ,EAAE/B,SAAS,CAACmG,IADK;AAEzB3E,EAAAA,MAAM,EAAEhB,cAAc,CAAC0F,SAAf,CAAyB1E,MAFR;AAGzBQ,EAAAA,QAAQ,EAAEhC,SAAS,CAACoG;AAHK,CAA3B;AAMA/D,cAAc,CAAC6D,SAAf,2CAA2B;AACzB5D,EAAAA,KAAK,EAAEtC,SAAS,CAACqG,MADQ;AAEzB7D,EAAAA,WAAW,EAAExC,SAAS,CAACqG,MAFE;AAGzB5D,EAAAA,WAAW,EAAEzC,SAAS,CAACqG,MAHE;AAIzB3D,EAAAA,IAAI,EAAE1C,SAAS,CAACqG,MAJS;AAKzBlF,EAAAA,OAAO,EAAEnB,SAAS,CAACsG,OAAV,CAAkB9F,cAAc,CAAC0F,SAAf,CAAyB1E,MAA3C,CALgB;AAMzBQ,EAAAA,QAAQ,EAAEhC,SAAS,CAACoG,IANK;AAOzBzD,EAAAA,OAAO,EAAE3C,SAAS,CAACoG,IAPM;AAQzBrE,EAAAA,QAAQ,EAAE/B,SAAS,CAACmG,IARK;AASzBvD,EAAAA,QAAQ,EAAE5C,SAAS,CAACmG,IATK;AAUzBpD,EAAAA,QAAQ,EAAE/C,SAAS,CAACmG,IAVK;AAWzBtD,EAAAA,QAAQ,EAAE7C,SAAS,CAACmG,IAXK;AAYzBrD,EAAAA,KAAK,EAAE9C,SAAS,CAACqG,MAZQ;AAazB9D,EAAAA,KAAK,EAAEvC,SAAS,CAACuG,KAAV,CAAgB,MAAK1F,UAAL,CAAhB;AAbkB,CAA3B;AAgBA,eAAewB,cAAf","sourcesContent":["import React, {useState, useEffect, useRef, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {map, pipe, join, filter, get, set, keys, isEmpty} from 'lodash/fp';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaSolidStatusClose as ErrorIcon,\n  NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  setup: style.setup,\n  cockpit: style.cockpit,\n  sidebar: style.sidebar,\n  coorpmanager: style.coorpmanager\n};\n\nexport const useChoices = options => {\n  const choicesRef = useRef(options);\n\n  const getChoices = () => {\n    return choicesRef.current;\n  };\n\n  const setChoices = choice => {\n    const choices = set(`[${choice.i}].selected`, !choice.selected, getChoices());\n\n    choicesRef.current = choices.filter(c => c.selected);\n  };\n\n  return [getChoices, setChoices];\n};\n\nconst CMMultipleView = ({multiple, choice, onChange}) => {\n  const handleChange = useCallback(\n    checked => {\n      if (!multiple) {\n        return onChange(choice);\n      }\n      return onChange({...choice, selected: checked});\n    },\n    [onChange, choice, multiple]\n  );\n\n  return multiple ? (\n    <div className={style.item}>\n      <Checkbox\n        titleStyle=\"inherit\"\n        checked={choice.selected}\n        onChange={handleChange}\n        noLabelMargins\n        title={choice.name}\n      />\n    </div>\n  ) : (\n    <span className={style.item} onClick={handleChange} title={choice.name}>\n      {choice.name}\n    </span>\n  );\n};\n\nconst SelectMultiple = (\n  {\n    title,\n    options,\n    theme,\n    placeholder,\n    description,\n    hint,\n    multiple,\n    onChange,\n    onError,\n    modified = false,\n    required = false,\n    error = '',\n    disabled = false\n  },\n  {skin}\n) => {\n  const [isOpened, updateIsOpened] = useState(false);\n  const [getChoices, setChoices] = useChoices(options);\n  const nodeRef = useRef(null);\n\n  const defaultColor = get('common.primary', skin);\n  const black = get('common.black', skin);\n\n  const handleOnClick = useCallback(\n    e => {\n      if (disabled) return;\n\n      e.preventDefault();\n      e.stopPropagation();\n\n      updateIsOpened(prev => !prev);\n    },\n    [disabled]\n  );\n\n  const closeHandle = useCallback(e => {\n    if (nodeRef && nodeRef.current && !nodeRef.current.contains(e.target)) {\n      updateIsOpened(false);\n    }\n  }, []);\n\n  const handleChange = useCallback(\n    choice => {\n      // if multiple prop is turned on\n      // we return all selected choices\n      if (multiple) {\n        setChoices(choice);\n\n        return onChange(getChoices());\n      }\n\n      return onChange(choice);\n    },\n    [multiple, onChange, setChoices, getChoices]\n  );\n\n  useEffect(() => {\n    document.addEventListener('click', closeHandle);\n    document.addEventListener('touchstart', closeHandle);\n\n    return () => {\n      document.removeEventListener('click', closeHandle);\n      document.removeEventListener('touchstart', closeHandle);\n    };\n  }, [closeHandle]);\n\n  const isCMTheme = theme === 'coorpmanager';\n\n  const lines = map.convert({cap: false})((choice, i) => {\n    return (\n      <li key={i} className={style.choice}>\n        {isCMTheme ? (\n          <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n        ) : (\n          <TitledCheckbox\n            onToggle={handleChange}\n            choice={{...choice, i}}\n            background={defaultColor}\n          />\n        )}\n      </li>\n    );\n  }, options);\n\n  const selection = pipe(filter({selected: true}), map('name'), join(', '))(options);\n\n  const _title = title && `${title}${required ? ' *' : ''}`;\n\n  const isActive = isOpened === true;\n\n  const titleView = title ? (\n    <span\n      className={classnames(\n        style.title,\n        isCMTheme && selection && style.titleWithSelection,\n        isCMTheme && isEmpty(selection) && style.noValue,\n        isActive && style.active\n      )}\n    >\n      {_title}\n      {isCMTheme ? (\n        <div className={style.infoIconWrapper}>\n          <InfoIcon className={style.infoIcon} />\n          <div className={style.descriptionLabel}>{description}</div>\n        </div>\n      ) : null}\n    </span>\n  ) : null;\n\n  const hintView =\n    isCMTheme && !isActive ? (\n      <div\n        className={style.hint}\n        // eslint-disable-next-line react/no-danger\n        dangerouslySetInnerHTML={{__html: error || hint}}\n      />\n    ) : null;\n\n  const mainClass = theme ? themeStyle[theme] : style.default;\n  const showPlaceholder = isCMTheme && isActive;\n  const behaviourClassName = getClassState(\n    style.default,\n    style.modified,\n    style.error,\n    modified,\n    error\n  );\n\n  const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n  return (\n    <div\n      className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n      ref={nodeRef}\n    >\n      <label>\n        {!isCMTheme && titleView}\n        <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n          {isCMTheme && titleView}\n          <span\n            className={classnames(\n              style.selection,\n              isCMTheme && isEmpty(selection) && style.noselection\n            )}\n          >\n            {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n          </span>\n          {isCMTheme ? (\n            <div className={style.iconsWrapper}>\n              <div className={style.flex}>{errorIconView}</div>\n              <div className={classnames(style.flex, isActive && style.clicked)}>\n                <ArrowDown\n                  color={black}\n                  className={classnames(style.arrow, {[style.down]: isActive})}\n                />\n              </div>\n            </div>\n          ) : (\n            <ArrowDown\n              color={black}\n              className={classnames(style.arrow, {[style.down]: isActive})}\n            />\n          )}\n        </div>\n        <div className={classnames(style.choices, isActive && style.activeChoices)}>\n          <ul className={style.list}>{lines}</ul>\n        </div>\n      </label>\n      {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n      {hintView}\n    </div>\n  );\n};\n\nSelectMultiple.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n  multiple: PropTypes.bool,\n  choice: TitledCheckbox.propTypes.choice,\n  onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  description: PropTypes.string,\n  hint: PropTypes.string,\n  options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n  onChange: PropTypes.func,\n  onError: PropTypes.func,\n  multiple: PropTypes.bool,\n  modified: PropTypes.bool,\n  disabled: PropTypes.bool,\n  required: PropTypes.bool,\n  error: PropTypes.string,\n  theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/select-multiple/index.js"],"names":["React","useState","useEffect","useRef","useCallback","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDown","NovaSolidStatusClose","ErrorIcon","NovaCompositionCoorpacademyInformationIcon","InfoIcon","TitledCheckbox","Provider","Checkbox","getClassState","style","themeStyle","setup","cockpit","sidebar","coorpmanager","useChoices","options","choicesRef","getChoices","current","setChoices","choice","choices","i","selected","filter","c","CMMultipleView","multiple","onChange","handleChange","checked","item","name","SelectMultiple","title","theme","placeholder","description","hint","onError","modified","required","error","disabled","skin","isOpened","updateIsOpened","nodeRef","defaultColor","black","handleOnClick","e","preventDefault","stopPropagation","prev","closeHandle","contains","target","document","addEventListener","removeEventListener","isCMTheme","lines","convert","cap","selection","_title","isActive","titleView","titleWithSelection","noValue","active","infoIconWrapper","infoIcon","descriptionLabel","hintView","hideHint","__html","mainClass","default","showPlaceholder","behaviourClassName","errorIconView","errorIcon","select","noselection","iconsWrapper","flex","clicked","arrow","down","activeChoices","list","contextTypes","childContextTypes","propTypes","bool","func","string","arrayOf","oneOf"],"mappings":"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","sourcesContent":["import React, {useState, useEffect, useRef, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {map, pipe, join, filter, get, set, keys, isEmpty} from 'lodash/fp';\nimport {\n  NovaCompositionNavigationArrowDown as ArrowDown,\n  NovaSolidStatusClose as ErrorIcon,\n  NovaCompositionCoorpacademyInformationIcon as InfoIcon\n} from '@coorpacademy/nova-icons';\nimport TitledCheckbox from '../titled-checkbox';\nimport Provider from '../../atom/provider';\nimport Checkbox from '../../atom/input-checkbox';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst themeStyle = {\n  setup: style.setup,\n  cockpit: style.cockpit,\n  sidebar: style.sidebar,\n  coorpmanager: style.coorpmanager\n};\n\nexport const useChoices = options => {\n  const choicesRef = useRef(options);\n\n  const getChoices = () => {\n    return choicesRef.current;\n  };\n\n  const setChoices = choice => {\n    const choices = set(`[${choice.i}].selected`, !choice.selected, getChoices());\n\n    choicesRef.current = choices.filter(c => c.selected);\n  };\n\n  return [getChoices, setChoices];\n};\n\nconst CMMultipleView = ({multiple, choice, onChange}) => {\n  const handleChange = useCallback(\n    checked => {\n      if (!multiple) {\n        return onChange(choice);\n      }\n      return onChange({...choice, selected: checked});\n    },\n    [onChange, choice, multiple]\n  );\n\n  return multiple ? (\n    <div className={style.item}>\n      <Checkbox\n        titleStyle=\"inherit\"\n        checked={choice.selected}\n        onChange={handleChange}\n        noLabelMargins\n        title={choice.name}\n      />\n    </div>\n  ) : (\n    <span className={style.item} onClick={handleChange} title={choice.name}>\n      {choice.name}\n    </span>\n  );\n};\n\nconst SelectMultiple = (\n  {\n    title,\n    options,\n    theme,\n    placeholder,\n    description,\n    hint,\n    multiple,\n    onChange,\n    onError,\n    modified = false,\n    required = false,\n    error = '',\n    disabled = false\n  },\n  {skin}\n) => {\n  const [isOpened, updateIsOpened] = useState(false);\n  const [getChoices, setChoices] = useChoices(options);\n  const nodeRef = useRef(null);\n\n  const defaultColor = get('common.primary', skin);\n  const black = get('common.black', skin);\n\n  const handleOnClick = useCallback(\n    e => {\n      if (disabled) return;\n\n      e.preventDefault();\n      e.stopPropagation();\n\n      updateIsOpened(prev => !prev);\n    },\n    [disabled]\n  );\n\n  const closeHandle = useCallback(e => {\n    if (nodeRef && nodeRef.current && !nodeRef.current.contains(e.target)) {\n      updateIsOpened(false);\n    }\n  }, []);\n\n  const handleChange = useCallback(\n    choice => {\n      // if multiple prop is turned on\n      // we return all selected choices\n      if (multiple) {\n        setChoices(choice);\n\n        return onChange(getChoices());\n      }\n\n      return onChange(choice);\n    },\n    [multiple, onChange, setChoices, getChoices]\n  );\n\n  useEffect(() => {\n    document.addEventListener('click', closeHandle);\n    document.addEventListener('touchstart', closeHandle);\n\n    return () => {\n      document.removeEventListener('click', closeHandle);\n      document.removeEventListener('touchstart', closeHandle);\n    };\n  }, [closeHandle]);\n\n  const isCMTheme = theme === 'coorpmanager';\n\n  const lines = map.convert({cap: false})((choice, i) => {\n    return (\n      <li key={i} className={style.choice}>\n        {isCMTheme ? (\n          <CMMultipleView multiple={multiple} choice={{...choice, i}} onChange={handleChange} />\n        ) : (\n          <TitledCheckbox\n            onToggle={handleChange}\n            choice={{...choice, i}}\n            background={defaultColor}\n          />\n        )}\n      </li>\n    );\n  }, options);\n\n  const selection = pipe(filter({selected: true}), map('name'), join(', '))(options);\n\n  const _title = title && `${title}${required ? ' *' : ''}`;\n\n  const isActive = isOpened === true;\n\n  const titleView = title ? (\n    <span\n      className={classnames(\n        style.title,\n        isCMTheme && selection && style.titleWithSelection,\n        isCMTheme && isEmpty(selection) && style.noValue,\n        isActive && style.active\n      )}\n    >\n      {_title}\n      {isCMTheme ? (\n        <div className={style.infoIconWrapper}>\n          <InfoIcon className={style.infoIcon} />\n          <div className={style.descriptionLabel}>{description}</div>\n        </div>\n      ) : null}\n    </span>\n  ) : null;\n\n  const hintView = isCMTheme ? (\n    <div\n      className={classnames(style.hint, isActive && style.hideHint)}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{__html: error || hint}}\n    />\n  ) : null;\n\n  const mainClass = theme ? themeStyle[theme] : style.default;\n  const showPlaceholder = isCMTheme && isActive;\n  const behaviourClassName = getClassState(\n    style.default,\n    style.modified,\n    style.error,\n    modified,\n    error\n  );\n\n  const errorIconView = error ? <ErrorIcon onClick={onError} className={style.errorIcon} /> : null;\n\n  return (\n    <div\n      className={classnames(mainClass, behaviourClassName, disabled && style.disabled)}\n      ref={nodeRef}\n    >\n      <label>\n        {!isCMTheme && titleView}\n        <div className={style.select} title={selection || placeholder} onClick={handleOnClick}>\n          {isCMTheme && titleView}\n          <span\n            className={classnames(\n              style.selection,\n              isCMTheme && isEmpty(selection) && style.noselection\n            )}\n          >\n            {selection || !isCMTheme || (showPlaceholder && placeholder) || null}\n          </span>\n          {isCMTheme ? (\n            <div className={style.iconsWrapper}>\n              <div className={style.flex}>{errorIconView}</div>\n              <div className={classnames(style.flex, isActive && style.clicked)}>\n                <ArrowDown\n                  color={black}\n                  className={classnames(style.arrow, {[style.down]: isActive})}\n                />\n              </div>\n            </div>\n          ) : (\n            <ArrowDown\n              color={black}\n              className={classnames(style.arrow, {[style.down]: isActive})}\n            />\n          )}\n        </div>\n        <div className={classnames(style.choices, isActive && style.activeChoices)}>\n          <ul className={style.list}>{lines}</ul>\n        </div>\n      </label>\n      {!isCMTheme ? <div className={style.description}>{description}</div> : null}\n      {hintView}\n    </div>\n  );\n};\n\nSelectMultiple.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nCMMultipleView.propTypes = {\n  multiple: PropTypes.bool,\n  choice: TitledCheckbox.propTypes.choice,\n  onChange: PropTypes.func\n};\n\nSelectMultiple.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  description: PropTypes.string,\n  hint: PropTypes.string,\n  options: PropTypes.arrayOf(TitledCheckbox.propTypes.choice),\n  onChange: PropTypes.func,\n  onError: PropTypes.func,\n  multiple: PropTypes.bool,\n  modified: PropTypes.bool,\n  disabled: PropTypes.bool,\n  required: PropTypes.bool,\n  error: PropTypes.string,\n  theme: PropTypes.oneOf(keys(themeStyle))\n};\n\nexport default SelectMultiple;\n"],"file":"index.js"}

package/es/molecule/select-multiple/style.css

@@ -6,12 +6,13 @@
 @value lightGrey from colors;
 @value negative from colors;
 @value xtraLightGrey from colors;
+@value cm_negative_100 from colors;
+@value cm_grey_100 from colors;
+@value cm_grey_150 from colors;
+@value cm_grey_200 from colors;
 @value cm_grey_400 from colors;
+@value cm_grey_500 from colors;
 @value cm_grey_700 from colors;
-@value cm_grey_200 from colors;
-@value cm_grey_150 from colors;
-@value cm_grey_100 from colors;
-@value cm_negative_100 from colors;
 @value medium from colors;
 @value defaultText from "../../variables/fonts.css";
 
@@ -227,12 +228,14 @@
   flex-direction: column;
   justify-content: center;
   border-radius: 8px;
+  line-height: 31px;
   width: 100%;
   font-size: 14px;
   color: black;
   height: 44px;
   padding: 11px 85px 11px 16px;
   background-color: cm_grey_100;
+  overflow: visible;
 }
 
 .coorpmanager .select .title {
@@ -265,7 +268,7 @@
   font-weight: 500;
   transition: all 0.25s ease;
   line-height: 20px;
-  margin: 10px 0 -10px 0;
+  margin: 0 0 -10px 0;
   text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
@@ -277,6 +280,10 @@
   font-weight: 500;
 }
 
+.coorpmanager .select .title.noValue {
+  font-weight: 500;
+}
+
 .coorpmanager .select .title.noValue.active,
 .coorpmanager .select .title.titleWithSelection {
   font-size: 10px;
@@ -310,8 +317,6 @@
 
 .coorpmanager .infoIconWrapper {
   overflow: visible;
-  height: 12px;
-  margin: 0 4px;
   cursor: pointer;
   pointer-events: fill;
   position: relative;
@@ -319,16 +324,16 @@
 
 .coorpmanager .infoIcon {
   cursor: pointer;
-  width: 8px;
+  width: 10px;
+  height: 10px;
   margin: 4px 4px 0 4px;
-  height: 8px;
   line-height: 16px;
   color: cm_grey_400;
   transition: all 0.25s linear;
 }
 
 .coorpmanager .select .title.noValue .infoIcon {
-  color: cm_grey_700;
+  color: cm_grey_500;
 }
 
 .coorpmanager .select .title.noValue.active .infoIcon,
@@ -344,7 +349,6 @@
 
 .coorpmanager .descriptionLabel {
   margin: 0 1px 18px 0;
-  padding: 8px 16px;
   border-radius: 7px;
   background-color: cm_grey_700;
   flex-grow: 0;
@@ -357,14 +361,21 @@
   letter-spacing: normal;
   text-align: center;
   color: white;
+  padding: 8px 16px;
   max-width: 200px;
   position: absolute;
-  left: -19px;
-  z-index: 3;
-  bottom: 5px;
+  left: -20px;
+  z-index: 999;
+  bottom: 18px;
   width: max-content;
   visibility: hidden;
-  opacity: 0s;
+  opacity: 0;
+}
+
+.coorpmanager .title.titleWithSelection .descriptionLabel,
+.coorpmanager .title.noValue.active .descriptionLabel {
+  left: -19px;
+  bottom: 1px;
 }
 
 .coorpmanager .descriptionLabel::after {
@@ -378,7 +389,7 @@
 }
 
 .coorpmanager .title.noValue .descriptionLabel::after {
-  left: 21px;
+  left: 22px;
 }
 
 .coorpmanager:focus-within .title.noValue .descriptionLabel::after {
@@ -399,6 +410,8 @@
   width: 44px;
   height: 44px;
   display: flex;
+  border-top-right-radius: 8px;
+  border-bottom-right-radius: 8px;
   justify-content: center;
   align-items: center;
 }
@@ -484,3 +497,7 @@
 .coorpmanager.disabled .arrow {
   opacity: 0.5;
 }
+
+.coorpmanager .hideHint {
+  visibility: hidden;
+}

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

@@ -1,3 +1,4 @@
+import _uniqueId from "lodash/fp/uniqueId";
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
@@ -137,7 +138,9 @@ const WizardSummary = props => {
     action
   } = props;
   const sectionsView = buildSections(sections);
-  const idSwitch = 'open-summary-wizard';
+
+  const idSwitch = _uniqueId('open-summary-wizard');
+
   return /*#__PURE__*/React.createElement("div", {
     className: style.container
   }, /*#__PURE__*/React.createElement("span", {

package/es/molecule/wizard-summary/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/wizard-summary/index.js"],"names":["React","useMemo","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDownIcon","ContentBadge","ButtonLink","style","buildItemsOfSection","items","map","item","index","type","title","value","category","label","author","unsaved","contentWrapper","contentCounter","contentItem","content","contentTitle","__html","text","valueSimpleText","buildSectionHeader","section","counterText","sectionHeader","buildSections","sections","itemsView","sectionWrapper","BuildAction","action","onClick","icon","ariaLabel","handleClick","buttonProps","position","button","WizardSummary","props","sectionsView","idSwitch","container","desktopSummaryTitle","checkbox","summary","tabletSummaryHeader","tabletSummaryTitle","tabletSummaryIcon","summarySections","actionZone","propTypes","shape","string","func","arrayOf","oneOfType","bool","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaCompositionNavigationArrowDown as ArrowDownIcon} from '@coorpacademy/nova-icons';\nimport ContentBadge from '../../atom/content-badge';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildItemsOfSection = items => {\n  return items.map((item, index) => {\n    const {type} = item;\n    switch (type) {\n      case 'mainElement':\n        return (\n          <li key={`${item.title}-${index}`}>\n            <span className={style.title}>{item.title}</span>\n            <span className={style.value}>{item.value}</span>\n          </li>\n        );\n      case 'content': {\n        const {category, label, title, author, unsaved = false} = item;\n        return (\n          <li className={style.contentWrapper} key={`${title}-${index}`}>\n            <span className={style.contentCounter}>{index + 1}</span>\n            <div className={style.contentItem}>\n              <div className={style.content}>\n                <ContentBadge category={category} label={label} />\n                <span\n                  className={classnames(style.contentTitle, unsaved && style.unsaved)}\n                  title={title}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: title}}\n                />\n              </div>\n              {author ? <span className={style.author}>{author}</span> : null}\n            </div>\n          </li>\n        );\n      }\n      case 'text':\n      default: {\n        const {text, unsaved = false} = item;\n        return (\n          <li key={`${item.text}-${index}`}>\n            <span className={classnames(style.valueSimpleText, unsaved && style.unsaved)}>\n              {text}\n            </span>\n          </li>\n        );\n      }\n    }\n  });\n};\n\nconst buildSectionHeader = section => {\n  const {title, counterText} = section;\n  if (!title) {\n    return null;\n  }\n  return (\n    <div className={style.sectionHeader}>\n      <span className={style.title}>{title}</span>\n      {counterText ? <span className={style.counterText}>{counterText}</span> : null}\n    </div>\n  );\n};\n\nconst buildSections = sections => {\n  return sections.map((section, index) => {\n    const sectionHeader = buildSectionHeader(section);\n    const itemsView = buildItemsOfSection(section.items);\n    return (\n      <div key={`summary-section-${index}`} data-step={index} className={style.sectionWrapper}>\n        {sectionHeader}\n        <ul>{itemsView}</ul>\n      </div>\n    );\n  });\n};\n\nconst BuildAction = ({action}) => {\n  const {onClick, text, icon, 'aria-label': ariaLabel} = action;\n  const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n  if (!action) return null;\n\n  const buttonProps = {\n    type: 'text',\n    label: text,\n    'aria-label': ariaLabel,\n    'data-name': `${icon}-button`,\n    onClick: handleClick,\n    icon: {\n      position: 'left',\n      type: icon\n    }\n  };\n\n  return (\n    <div className={style.button}>\n      <ButtonLink {...buttonProps} />\n    </div>\n  );\n};\n\nconst WizardSummary = props => {\n  const {title, sections, action} = props;\n  const sectionsView = buildSections(sections);\n  const idSwitch = 'open-summary-wizard';\n\n  return (\n    <div className={style.container}>\n      <span className={style.desktopSummaryTitle}>{title}</span>\n      <input\n        type=\"checkbox\"\n        id={idSwitch}\n        name=\"toogle\"\n        title={idSwitch}\n        className={style.checkbox}\n      />\n      <div className={style.summary}>\n        <div className={style.tabletSummaryHeader}>\n          <label htmlFor={idSwitch}>\n            <span className={style.tabletSummaryTitle}>{title}</span>\n            <ArrowDownIcon className={style.tabletSummaryIcon} />\n          </label>\n        </div>\n        <div className={style.summarySections}>{sectionsView}</div>\n      </div>\n      <div className={style.actionZone}>\n        <BuildAction action={action} />\n      </div>\n    </div>\n  );\n};\n\nBuildAction.propTypes = {\n  action: PropTypes.shape({\n    icon: PropTypes.string,\n    text: PropTypes.string,\n    onClick: PropTypes.func,\n    'aria-label': PropTypes.string\n  })\n};\n\nWizardSummary.propTypes = {\n  title: PropTypes.string,\n  sections: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: PropTypes.string,\n      items: PropTypes.arrayOf(\n        PropTypes.oneOfType([\n          PropTypes.shape({\n            type: PropTypes.string,\n            title: PropTypes.string,\n            value: PropTypes.string\n          }),\n          PropTypes.shape({\n            type: PropTypes.string,\n            text: PropTypes.string,\n            unsaved: PropTypes.bool\n          }),\n          PropTypes.shape({\n            type: PropTypes.string,\n            category: PropTypes.oneOf([\n              'base',\n              'advanced',\n              'coach',\n              'chapter',\n              'scorm',\n              'video',\n              'article',\n              'podcast'\n            ]),\n            title: PropTypes.string,\n            label: PropTypes.string,\n            author: PropTypes.string,\n            unsaved: PropTypes.bool\n          })\n        ])\n      ),\n      counterText: PropTypes.string\n    })\n  ),\n  action: BuildAction.propTypes.action\n};\n\nexport default WizardSummary;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/wizard-summary/index.js"],"names":["React","useMemo","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowDownIcon","ContentBadge","ButtonLink","style","buildItemsOfSection","items","map","item","index","type","title","value","category","label","author","unsaved","contentWrapper","contentCounter","contentItem","content","contentTitle","__html","text","valueSimpleText","buildSectionHeader","section","counterText","sectionHeader","buildSections","sections","itemsView","sectionWrapper","BuildAction","action","onClick","icon","ariaLabel","handleClick","buttonProps","position","button","WizardSummary","props","sectionsView","idSwitch","container","desktopSummaryTitle","checkbox","summary","tabletSummaryHeader","tabletSummaryTitle","tabletSummaryIcon","summarySections","actionZone","propTypes","shape","string","func","arrayOf","oneOfType","bool","oneOf"],"mappings":"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","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {uniqueId} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowDownIcon} from '@coorpacademy/nova-icons';\nimport ContentBadge from '../../atom/content-badge';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildItemsOfSection = items => {\n  return items.map((item, index) => {\n    const {type} = item;\n    switch (type) {\n      case 'mainElement':\n        return (\n          <li key={`${item.title}-${index}`}>\n            <span className={style.title}>{item.title}</span>\n            <span className={style.value}>{item.value}</span>\n          </li>\n        );\n      case 'content': {\n        const {category, label, title, author, unsaved = false} = item;\n        return (\n          <li className={style.contentWrapper} key={`${title}-${index}`}>\n            <span className={style.contentCounter}>{index + 1}</span>\n            <div className={style.contentItem}>\n              <div className={style.content}>\n                <ContentBadge category={category} label={label} />\n                <span\n                  className={classnames(style.contentTitle, unsaved && style.unsaved)}\n                  title={title}\n                  // eslint-disable-next-line react/no-danger\n                  dangerouslySetInnerHTML={{__html: title}}\n                />\n              </div>\n              {author ? <span className={style.author}>{author}</span> : null}\n            </div>\n          </li>\n        );\n      }\n      case 'text':\n      default: {\n        const {text, unsaved = false} = item;\n        return (\n          <li key={`${item.text}-${index}`}>\n            <span className={classnames(style.valueSimpleText, unsaved && style.unsaved)}>\n              {text}\n            </span>\n          </li>\n        );\n      }\n    }\n  });\n};\n\nconst buildSectionHeader = section => {\n  const {title, counterText} = section;\n  if (!title) {\n    return null;\n  }\n  return (\n    <div className={style.sectionHeader}>\n      <span className={style.title}>{title}</span>\n      {counterText ? <span className={style.counterText}>{counterText}</span> : null}\n    </div>\n  );\n};\n\nconst buildSections = sections => {\n  return sections.map((section, index) => {\n    const sectionHeader = buildSectionHeader(section);\n    const itemsView = buildItemsOfSection(section.items);\n    return (\n      <div key={`summary-section-${index}`} data-step={index} className={style.sectionWrapper}>\n        {sectionHeader}\n        <ul>{itemsView}</ul>\n      </div>\n    );\n  });\n};\n\nconst BuildAction = ({action}) => {\n  const {onClick, text, icon, 'aria-label': ariaLabel} = action;\n  const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n  if (!action) return null;\n\n  const buttonProps = {\n    type: 'text',\n    label: text,\n    'aria-label': ariaLabel,\n    'data-name': `${icon}-button`,\n    onClick: handleClick,\n    icon: {\n      position: 'left',\n      type: icon\n    }\n  };\n\n  return (\n    <div className={style.button}>\n      <ButtonLink {...buttonProps} />\n    </div>\n  );\n};\n\nconst WizardSummary = props => {\n  const {title, sections, action} = props;\n  const sectionsView = buildSections(sections);\n  const idSwitch = uniqueId('open-summary-wizard');\n\n  return (\n    <div className={style.container}>\n      <span className={style.desktopSummaryTitle}>{title}</span>\n      <input\n        type=\"checkbox\"\n        id={idSwitch}\n        name=\"toogle\"\n        title={idSwitch}\n        className={style.checkbox}\n      />\n      <div className={style.summary}>\n        <div className={style.tabletSummaryHeader}>\n          <label htmlFor={idSwitch}>\n            <span className={style.tabletSummaryTitle}>{title}</span>\n            <ArrowDownIcon className={style.tabletSummaryIcon} />\n          </label>\n        </div>\n        <div className={style.summarySections}>{sectionsView}</div>\n      </div>\n      <div className={style.actionZone}>\n        <BuildAction action={action} />\n      </div>\n    </div>\n  );\n};\n\nBuildAction.propTypes = {\n  action: PropTypes.shape({\n    icon: PropTypes.string,\n    text: PropTypes.string,\n    onClick: PropTypes.func,\n    'aria-label': PropTypes.string\n  })\n};\n\nWizardSummary.propTypes = {\n  title: PropTypes.string,\n  sections: PropTypes.arrayOf(\n    PropTypes.shape({\n      title: PropTypes.string,\n      items: PropTypes.arrayOf(\n        PropTypes.oneOfType([\n          PropTypes.shape({\n            type: PropTypes.string,\n            title: PropTypes.string,\n            value: PropTypes.string\n          }),\n          PropTypes.shape({\n            type: PropTypes.string,\n            text: PropTypes.string,\n            unsaved: PropTypes.bool\n          }),\n          PropTypes.shape({\n            type: PropTypes.string,\n            category: PropTypes.oneOf([\n              'base',\n              'advanced',\n              'coach',\n              'chapter',\n              'scorm',\n              'video',\n              'article',\n              'podcast'\n            ]),\n            title: PropTypes.string,\n            label: PropTypes.string,\n            author: PropTypes.string,\n            unsaved: PropTypes.bool\n          })\n        ])\n      ),\n      counterText: PropTypes.string\n    })\n  ),\n  action: BuildAction.propTypes.action\n};\n\nexport default WizardSummary;\n"],"file":"index.js"}

package/es/molecule/wizard-summary/style.css

@@ -12,10 +12,11 @@
 @value lightBlack from colors;
 @value cm_yellow_200 from colors;
 @value cm_tablet from breakpoints;
+@value desktop from breakpoints;
 
 .container {
   font-family: Gilroy;
-  width: 245px;
+  width: calc(100% - 74px);
   border-radius: 7px;
   background-color: cm_grey_50;
   padding: 40px 37px 32px 37px;
@@ -165,16 +166,19 @@ ul {
   color: cm_primary_blue;
 } 
 
-@media cm_tablet {
+@media desktop, cm_tablet {
   .container {
     background-color: transparent;
-    width: calc(100% - 64px);
-    left: 0px;
-    right: 0px;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    right: 0;
+    bottom: 0;
     flex-direction: row;
     align-items: flex-end;
-    padding: 0px 32px 0px 32px;
-    margin: 0px;
+    padding: 0;
+    margin: 0;
+    position: relative;
   }
 
   .desktopSummaryTitle {
@@ -194,7 +198,9 @@ ul {
     background-color: cm_grey_50;
     border-radius: 7px;
     height: 20px;
+    max-height: 20px;
     padding: 12px 24px 12px 24px;
+    box-shadow: 0 -6px 42px -14px rgba(0, 0, 0, 0);
     transition: all 0.5s ease;
   }
 
@@ -228,11 +234,15 @@ ul {
 
   .checkbox:checked + .summary  {
     height: 65%;
-    padding: 24px;
+    max-height: 1000px;
+    padding: 12px 24px 12px 24px;
     box-shadow: 0 -6px 42px -14px rgba(0, 0, 0, 0.25);
     transition: all 0.5s ease;
   }
   .checkbox:checked + .summary .tabletSummaryIcon  {
     transform: rotateZ(180deg);
   }
+  .summarySections {
+    max-height: 250px;
+  }
 }

package/es/molecule/wizard-summary/test/fixtures/three-sections.js

@@ -33,8 +33,8 @@ export default {
     }],
     action: {
       icon: 'save',
-      text: 'Save in drafts',
-      'aria-label': 'Save in drafts',
+      text: 'Save & quit',
+      'aria-label': 'Save',
       onClick: () => console.log('save')
     }
   }

package/es/molecule/wizard-summary/test/fixtures/three-sections.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/molecule/wizard-summary/test/fixtures/three-sections.js"],"names":["props","title","sections","items","type","value","text","counterText","action","icon","onClick","console","log"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,uBADF;AAELC,IAAAA,QAAQ,EAAE,CACR;AACEC,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,aADR;AAEEH,QAAAA,KAAK,EAAE,UAFT;AAGEI,QAAAA,KAAK,EAAE;AAHT,OADK,EAML;AACED,QAAAA,IAAI,EAAE,aADR;AAEEH,QAAAA,KAAK,EAAE,MAFT;AAGEI,QAAAA,KAAK,EAAE;AAHT,OANK;AADT,KADQ,EAeR;AACEJ,MAAAA,KAAK,EAAE,aADT;AAEEE,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OADK,EAKL;AACEF,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OALK,EASL;AACEF,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OATK;AAFT,KAfQ,EAgCR;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEE,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OADK,CAFT;AAQEC,MAAAA,WAAW,EAAE;AARf,KAhCQ,CAFL;AA6CLC,IAAAA,MAAM,EAAE;AACNC,MAAAA,IAAI,EAAE,MADA;AAENH,MAAAA,IAAI,EAAE,gBAFA;AAGN,oBAAc,gBAHR;AAINI,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,MAAZ;AAJT;AA7CH;AADM,CAAf","sourcesContent":["export default {\n  props: {\n    title: 'Certification summary',\n    sections: [\n      {\n        items: [\n          {\n            type: 'mainElement',\n            title: 'Language',\n            value: '🇬🇧 English'\n          },\n          {\n            type: 'mainElement',\n            title: 'Name',\n            value: 'Marketing expert'\n          }\n        ]\n      },\n      {\n        title: 'Translation',\n        items: [\n          {\n            type: 'text',\n            text: '🇫🇷 French'\n          },\n          {\n            type: 'text',\n            text: '🇪🇸 Spanish'\n          },\n          {\n            type: 'text',\n            text: '🇮🇹 Italian'\n          }\n        ]\n      },\n      {\n        title: 'Populations',\n        items: [\n          {\n            type: 'text',\n            text: 'Population 2'\n          }\n        ],\n        counterText: '1 population'\n      }\n    ],\n    action: {\n      icon: 'save',\n      text: 'Save in drafts',\n      'aria-label': 'Save in drafts',\n      onClick: () => console.log('save')\n    }\n  }\n};\n"],"file":"three-sections.js"}
+{"version":3,"sources":["../../../../../src/molecule/wizard-summary/test/fixtures/three-sections.js"],"names":["props","title","sections","items","type","value","text","counterText","action","icon","onClick","console","log"],"mappings":"AAAA,eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,uBADF;AAELC,IAAAA,QAAQ,EAAE,CACR;AACEC,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,aADR;AAEEH,QAAAA,KAAK,EAAE,UAFT;AAGEI,QAAAA,KAAK,EAAE;AAHT,OADK,EAML;AACED,QAAAA,IAAI,EAAE,aADR;AAEEH,QAAAA,KAAK,EAAE,MAFT;AAGEI,QAAAA,KAAK,EAAE;AAHT,OANK;AADT,KADQ,EAeR;AACEJ,MAAAA,KAAK,EAAE,aADT;AAEEE,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OADK,EAKL;AACEF,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OALK,EASL;AACEF,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OATK;AAFT,KAfQ,EAgCR;AACEL,MAAAA,KAAK,EAAE,aADT;AAEEE,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,MADR;AAEEE,QAAAA,IAAI,EAAE;AAFR,OADK,CAFT;AAQEC,MAAAA,WAAW,EAAE;AARf,KAhCQ,CAFL;AA6CLC,IAAAA,MAAM,EAAE;AACNC,MAAAA,IAAI,EAAE,MADA;AAENH,MAAAA,IAAI,EAAE,aAFA;AAGN,oBAAc,MAHR;AAINI,MAAAA,OAAO,EAAE,MAAMC,OAAO,CAACC,GAAR,CAAY,MAAZ;AAJT;AA7CH;AADM,CAAf","sourcesContent":["export default {\n  props: {\n    title: 'Certification summary',\n    sections: [\n      {\n        items: [\n          {\n            type: 'mainElement',\n            title: 'Language',\n            value: '🇬🇧 English'\n          },\n          {\n            type: 'mainElement',\n            title: 'Name',\n            value: 'Marketing expert'\n          }\n        ]\n      },\n      {\n        title: 'Translation',\n        items: [\n          {\n            type: 'text',\n            text: '🇫🇷 French'\n          },\n          {\n            type: 'text',\n            text: '🇪🇸 Spanish'\n          },\n          {\n            type: 'text',\n            text: '🇮🇹 Italian'\n          }\n        ]\n      },\n      {\n        title: 'Populations',\n        items: [\n          {\n            type: 'text',\n            text: 'Population 2'\n          }\n        ],\n        counterText: '1 population'\n      }\n    ],\n    action: {\n      icon: 'save',\n      text: 'Save & quit',\n      'aria-label': 'Save',\n      onClick: () => console.log('save')\n    }\n  }\n};\n"],"file":"three-sections.js"}

package/es/organism/brand-form/index.js

@@ -9,6 +9,42 @@ import Button from '../../atom/button';
 import Link from '../../atom/link';
 import style from './style.css';
 
+const buildButtonSection = (onSubmit, submitValue, onReset, resetValue, tooltip, disabled, isModified, isPending, darkColor) => {
+  if (!onSubmit && !onReset) {
+    return null;
+  }
+
+  const disabledSubmit = disabled || isPending || !isModified;
+  const submitButton = onSubmit ? /*#__PURE__*/React.createElement("div", {
+    "data-tip": tooltip.title,
+    "data-for": "submitButton",
+    className: style.saveButton
+  }, /*#__PURE__*/React.createElement(ReactTooltip, {
+    type: "light",
+    effect: "solid",
+    className: style.toolTipContent,
+    place: tooltip.place,
+    id: "submitButton"
+  }), /*#__PURE__*/React.createElement(Button, {
+    type: "submit",
+    disabled: disabledSubmit,
+    submitValue: submitValue
+  })) : null;
+  const cancelBackground = {
+    backgroundColor: darkColor
+  };
+  const resetButton = onReset ? /*#__PURE__*/React.createElement("div", {
+    className: style.resetButton
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "reset",
+    submitValue: resetValue,
+    style: cancelBackground
+  })) : null;
+  return /*#__PURE__*/React.createElement("div", {
+    className: style.buttons
+  }, submitButton, resetButton);
+};
+
 function BrandForm(props, context) {
   const {
     groups,
@@ -39,39 +75,15 @@ function BrandForm(props, context) {
   }, back.desc)) : null;
   const brandGroups = groups.map((group, index) => {
     return /*#__PURE__*/React.createElement("div", {
+      className: style.group,
       key: index
     }, /*#__PURE__*/React.createElement(BrandFormGroup, group));
   });
-  const disabledSubmit = disabled || isPending || !isModified;
-  const submitButton = onSubmit ? /*#__PURE__*/React.createElement("div", {
-    "data-tip": tooltip.title,
-    "data-for": "submitButton",
-    className: style.saveButton
-  }, /*#__PURE__*/React.createElement(ReactTooltip, {
-    type: "light",
-    effect: "solid",
-    className: style.toolTipContent,
-    place: tooltip.place,
-    id: "submitButton"
-  }), /*#__PURE__*/React.createElement(Button, {
-    type: "submit",
-    disabled: disabledSubmit,
-    submitValue: submitValue
-  })) : null;
+  const buttonSection = buildButtonSection(onSubmit, submitValue, onReset, resetValue, tooltip, disabled, isModified, isPending, darkColor);
   const handleSubmit = useMemo(() => e => {
     e.preventDefault();
     return onSubmit(e);
   }, [onSubmit]);
-  const cancelBackground = {
-    backgroundColor: darkColor
-  };
-  const resetButton = onReset ? /*#__PURE__*/React.createElement("div", {
-    className: style.resetButton
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "reset",
-    submitValue: resetValue,
-    style: cancelBackground
-  })) : null;
   const handleReset = useMemo(() => e => {
     e.preventDefault();
     return onReset(e);
@@ -79,9 +91,7 @@ function BrandForm(props, context) {
   return /*#__PURE__*/React.createElement("div", null, backView, /*#__PURE__*/React.createElement("form", {
     onSubmit: handleSubmit,
     onReset: handleReset
-  }, brandGroups, /*#__PURE__*/React.createElement("div", {
-    className: style.buttons
-  }, submitButton, resetButton)));
+  }, brandGroups, buttonSection));
 }
 
 BrandForm.contextTypes = {