@coorpacademy/components 10.1.2 → 10.1.3

package/lib/atom/input-search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/atom/input-search/index.js"],"names":["Search","props","value","placeholder","onChange","onClear","onFocus","onBlur","theme","handleChange","e","target","cmStyle","style","coorpmanager","isDefaultTheme","wrapperSearch","searchIcon","title","noValue","search","clearIcon","contextTypes","skin","Provider","childContextTypes","propTypes","PropTypes","string","isRequired","func","oneOf"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAMA;;AACA;;;;;;;;AAEA,MAAMA,MAAM,GAAGC,KAAK,IAAI;AACtB,QAAM;AACJC,IAAAA,KADI;AAEJC,IAAAA,WAFI;AAGJC,IAAAA,QAAQ,iBAHJ;AAIJC,IAAAA,OAAO,iBAJH;AAKJC,IAAAA,OALI;AAMJC,IAAAA,MANI;AAOJC,IAAAA,KAAK,GAAG;AAPJ,MAQFP,KARJ;AASA,QAAMQ,YAAY,GAAG,oBAAQ,MAAMC,CAAC,IAAIN,QAAQ,CAACM,CAAC,CAACC,MAAF,CAAST,KAAV,CAA3B,EAA6C,CAACE,QAAD,CAA7C,CAArB;AACA,QAAMQ,OAAO,GAAG,yBAAWC,eAAMC,YAAjB,CAAhB;AACA,QAAMC,cAAc,GAAGP,KAAK,KAAK,SAAjC;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEO,cAAc,GAAGF,eAAMG,aAAT,GAAyBJ;AAAvD,kBACE;AAAO,IAAA,OAAO,EAAC,QAAf;AAAwB,IAAA,KAAK,EAAET;AAA/B,KACG,CAACY,cAAD,gBACC,6BAAC,6CAAD;AAAc,IAAA,SAAS,EAAEF,eAAMI;AAA/B,IADD,gBAGC,6BAAC,4CAAD;AAAY,IAAA,SAAS,EAAEJ,eAAMI;AAA7B,IAJJ,EAMG,CAACF,cAAD,gBACC;AAAM,IAAA,SAAS,EAAE,yBAAWF,eAAMK,KAAjB,EAAwB,uBAAQhB,KAAR,KAAkBW,eAAMM,OAAhD;AAAjB,KACGhB,WADH,CADD,GAIG,IAVN,CADF,eAaE;AACE,iBAAU,cADZ;AAEE,IAAA,SAAS,EAAEU,eAAMO,MAFnB;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,IAAI,EAAC,QAJP;AAKE,IAAA,EAAE,EAAC,QALL;AAME,IAAA,WAAW,EAAEjB,WANf;AAOE,IAAA,KAAK,EAAED,KAPT;AAQE,IAAA,OAAO,EAAEO,YARX;AASE,IAAA,OAAO,EAAEH,OATX;AAUE,IAAA,QAAQ,gBAVV;AAWE,IAAA,MAAM,EAAEC;AAXV,IAbF,EA0BGL,KAAK,IAAI,CAACa,cAAV,gBACC,6BAAC,+BAAD;AAAW,IAAA,OAAO,EAAEV,OAApB;AAA6B,IAAA,SAAS,EAAEQ,eAAMQ;AAA9C,IADD,GAEG,IA5BN,CADF;AAgCD,CA9CD;;AAgDArB,MAAM,CAACsB,YAAP,GAAsB;AACpBC,EAAAA,IAAI,EAAEC,kBAASC,iBAAT,CAA2BF;AADb,CAAtB;AAIAvB,MAAM,CAAC0B,SAAP,2CAAmB;AACjBxB,EAAAA,KAAK,EAAEyB,mBAAUC,MADA;AAEjBzB,EAAAA,WAAW,EAAEwB,mBAAUC,MAAV,CAAiBC,UAFb;AAGjBzB,EAAAA,QAAQ,EAAEuB,mBAAUG,IAHH;AAIjBzB,EAAAA,OAAO,EAAEsB,mBAAUG,IAJF;AAKjBxB,EAAAA,OAAO,EAAEqB,mBAAUG,IALF;AAMjBvB,EAAAA,MAAM,EAAEoB,mBAAUG,IAND;AAOjBtB,EAAAA,KAAK,EAAEmB,mBAAUI,KAAV,CAAgB,CAAC,SAAD,EAAY,cAAZ,CAAhB;AAPU,CAAnB;eAUe/B,M","sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n  NovaCompositionCoorpacademySearch1 as CMSearchIcon,\n  NovaCompositionCoorpacademySearch as SearchIcon,\n  NovaSolidStatusClose as CloseIcon\n} from '@coorpacademy/nova-icons';\nimport {noop, isEmpty} from 'lodash/fp';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst Search = props => {\n  const {\n    value,\n    placeholder,\n    onChange = noop,\n    onClear = noop,\n    onFocus,\n    onBlur,\n    theme = 'default'\n  } = props;\n  const handleChange = useMemo(() => e => onChange(e.target.value), [onChange]);\n  const cmStyle = classnames(style.coorpmanager);\n  const isDefaultTheme = theme === 'default';\n\n  return (\n    <div className={isDefaultTheme ? style.wrapperSearch : cmStyle}>\n      <label htmlFor=\"search\" title={placeholder}>\n        {!isDefaultTheme ? (\n          <CMSearchIcon className={style.searchIcon} />\n        ) : (\n          <SearchIcon className={style.searchIcon} />\n        )}\n        {!isDefaultTheme ? (\n          <span className={classnames(style.title, isEmpty(value) && style.noValue)}>\n            {placeholder}\n          </span>\n        ) : null}\n      </label>\n      <input\n        data-name=\"search-input\"\n        className={style.search}\n        type=\"text\"\n        name=\"search\"\n        id=\"search\"\n        placeholder={placeholder}\n        value={value}\n        onInput={handleChange}\n        onFocus={onFocus}\n        onChange={noop}\n        onBlur={onBlur}\n      />\n      {value && !isDefaultTheme ? (\n        <CloseIcon onClick={onClear} className={style.clearIcon} />\n      ) : null}\n    </div>\n  );\n};\n\nSearch.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nSearch.propTypes = {\n  value: PropTypes.string,\n  placeholder: PropTypes.string.isRequired,\n  onChange: PropTypes.func,\n  onClear: PropTypes.func,\n  onFocus: PropTypes.func,\n  onBlur: PropTypes.func,\n  theme: PropTypes.oneOf(['default', 'coorpmanager'])\n};\n\nexport default Search;\n"],"file":"index.js"}

package/lib/atom/input-search/style.css

@@ -0,0 +1,201 @@
+@value breakpoints: "../../variables/breakpoints.css";
+@value tablet from breakpoints;
+@value mobile from breakpoints;
+@value colors: "../../variables/colors.css";
+@value medium from colors;
+@value light from colors;
+@value white from colors;
+@value dark from colors;
+@value black from colors;
+@value cm_grey_100 from colors;
+@value cm_grey_150 from colors;
+@value cm_grey_400 from colors;
+@value cm_grey_500 from colors;
+@value cm_grey_700 from colors;
+
+.wrapperSearch {
+  display: flex;
+  width: 100%;
+  flex-flow: nowrap;
+  flex-direction: row;
+  align-items: center;
+  overflow: hidden;
+}
+
+.searchIcon {
+  color: dark;
+  position: relative;
+  margin: 0 0 -3px -20px;
+  width: 19px;
+  height: 19px;
+  left: 35px;
+}
+
+.search {
+  font-family: "Open Sans";
+  text-transform: none;
+  margin: 0 3px;
+  padding: 0 15px 0 45px;
+  border: 0;
+  height: 50px;
+  border-radius: 0;
+  font-size: 14px;
+  color: dark;
+  width: 100%;
+  outline: none;
+  font-weight: bold;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.search::placeholder {
+  color: medium;
+  font-size: 14px;
+}
+
+.search:focus {
+  outline: none;
+}
+
+.search:-webkit-autofill {
+  background-color: white;
+  background-image: none;
+  color: medium;
+}
+
+.search::placeholder {
+  color: medium;
+  font-size: 14px;
+}
+
+.coorpmanager {
+  position: relative;
+}
+
+.coorpmanager label {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  position: absolute;
+  height: 64px;
+}
+
+.coorpmanager .title {
+  flex-grow: 0;
+  font-family: Gilroy;
+  font-size: 10px;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  letter-spacing: normal;
+  text-align: left;
+  z-index: 1;
+  color: cm_grey_400;
+  width: max-content;
+  transition: all 0.25s ease;
+  pointer-events: none;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  position: absolute;
+  top: 7px;
+  left: 30px;
+}
+
+.coorpmanager .search {
+  height: 44px;
+  margin: 0;
+  flex-grow: 0;
+  display: flex;
+  box-sizing: border-box;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  padding: 19px 30px 5px 30px;
+  border-radius: 7px;
+  background-color: cm_grey_100;
+  font-family: Gilroy;
+  font-size: 14px;
+  font-weight: 500;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 44px;
+  letter-spacing: normal;
+  text-align: left;
+  color: cm_grey_700;
+  border: none;
+  transition: all 0.25s ease;
+  outline: none;
+}
+
+.coorpmanager .title.noValue {
+  font-size: 14px;
+  font-weight: 500;
+  color: cm_grey_400;
+  top: 14px;
+}
+
+.coorpmanager:focus-within .title.noValue {
+  font-size: 10px;
+  font-weight: bold;
+  color: cm_grey_400;
+  top: 7px;
+}
+
+.coorpmanager:focus-within .title.noValue {
+  width: max-content;
+  height: 8px;
+  line-height: 12px;
+  color: cm_grey_400;
+}
+
+.coorpmanager .search:hover {
+  background-color: cm_grey_150;
+}
+
+.coorpmanager .search::placeholder {
+  color: transparent;
+}
+
+.coorpmanager .clearIcon {
+  color: cm_grey_400;
+  width: 14px;
+  height: 14px;
+  position: absolute;
+  right: 15px;
+  top: 16px;
+  line-height: 16px;
+  cursor: pointer;
+}
+
+.coorpmanager .searchIcon {
+  color: #000;
+  width: 14px;
+  height: 14px;
+  position: absolute;
+  left: 30px;
+  top: 16px;
+  line-height: 16px;
+}
+
+@media tablet {
+  .search,
+  input {
+    font-size: 12px;
+  }
+
+  .search::placeholder {
+    font-size: 12px;
+  }
+}
+
+@media mobile {
+  .search {
+    font-size: 12px;
+  }
+
+  .search::placeholder {
+    font-size: 12px;
+  }
+}

package/lib/atom/input-search/test/change.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/atom/input-search/test/change.js"],"names":["adapter","Adapter","t","plan","onChange","value","is","wrapper","find","simulate","target"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA;AACA,uBAAU;AAACA,EAAAA,OAAO,EAAE,IAAIC,2BAAJ;AAAV,CAAV;AAEA,kBAAK,6EAAL,EAAoFC,CAAC,IAAI;AACvFA,EAAAA,CAAC,CAACC,IAAF,CAAO,CAAP;;AAEA,QAAMC,QAAQ,GAAGC,KAAK,IAAI;AACxBH,IAAAA,CAAC,CAACI,EAAF,CAAKD,KAAL,EAAY,mBAAZ;AACD,GAFD;;AAIA,QAAME,OAAO,GAAG,mCACd,6BAAC,SAAD;AAAQ,IAAA,WAAW,EAAC,eAApB;AAAoC,IAAA,KAAK,EAAC,kBAA1C;AAA6D,IAAA,QAAQ,EAAEH;AAAvE,IADc,CAAhB;AAIAG,EAAAA,OAAO,CAACC,IAAR,CAAa,OAAb,EAAsBC,QAAtB,CAA+B,OAA/B,EAAwC;AAACC,IAAAA,MAAM,EAAE;AAACL,MAAAA,KAAK,EAAE;AAAR;AAAT,GAAxC;AACD,CAZD","sourcesContent":["import browserEnv from 'browser-env';\nimport test from 'ava';\nimport React from 'react';\nimport {shallow, configure} from 'enzyme';\nimport Adapter from 'enzyme-adapter-react-16';\nimport Search from '..';\n\nbrowserEnv();\nconfigure({adapter: new Adapter()});\n\ntest('should call onChange with new value when user try to change the input value', t => {\n  t.plan(1);\n\n  const onChange = value => {\n    t.is(value, 'my name is murphy');\n  };\n\n  const wrapper = shallow(\n    <Search placeholder=\"say your name\" value=\"my name is murph\" onChange={onChange} />\n  );\n\n  wrapper.find('input').simulate('input', {target: {value: 'my name is murphy'}});\n});\n"],"file":"change.js"}

package/lib/atom/input-search/test/fixtures/coorpmanager-with-value.js

@@ -0,0 +1,19 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    value: 'big data - le retour',
+    placeholder: 'Search for a course',
+    onChange: value => {
+      console.log(value);
+    },
+    onEnter: () => console.log('pressed enter'),
+    onFocus: () => console.log('onFocus'),
+    onClear: () => console.log('clear pressed'),
+    theme: 'coorpmanager'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=coorpmanager-with-value.js.map

package/lib/atom/input-search/test/fixtures/coorpmanager-with-value.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/input-search/test/fixtures/coorpmanager-with-value.js"],"names":["props","value","placeholder","onChange","console","log","onEnter","onFocus","onClear","theme"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,sBADF;AAELC,IAAAA,WAAW,EAAE,qBAFR;AAGLC,IAAAA,QAAQ,EAAEF,KAAK,IAAI;AACjBG,MAAAA,OAAO,CAACC,GAAR,CAAYJ,KAAZ;AACD,KALI;AAMLK,IAAAA,OAAO,EAAE,MAAMF,OAAO,CAACC,GAAR,CAAY,eAAZ,CANV;AAOLE,IAAAA,OAAO,EAAE,MAAMH,OAAO,CAACC,GAAR,CAAY,SAAZ,CAPV;AAQLG,IAAAA,OAAO,EAAE,MAAMJ,OAAO,CAACC,GAAR,CAAY,eAAZ,CARV;AASLI,IAAAA,KAAK,EAAE;AATF;AADM,C","sourcesContent":["export default {\n  props: {\n    value: 'big data - le retour',\n    placeholder: 'Search for a course',\n    onChange: value => {\n      console.log(value);\n    },\n    onEnter: () => console.log('pressed enter'),\n    onFocus: () => console.log('onFocus'),\n    onClear: () => console.log('clear pressed'),\n    theme: 'coorpmanager'\n  }\n};\n"],"file":"coorpmanager-with-value.js"}

package/lib/atom/input-search/test/fixtures/coorpmanager.js

@@ -0,0 +1,18 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    value: '',
+    placeholder: 'Search for a course',
+    onChange: value => {
+      console.log(value);
+    },
+    onFocus: () => console.log('onFocus'),
+    onBlur: () => console.log('blur'),
+    theme: 'coorpmanager'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=coorpmanager.js.map

package/lib/atom/input-search/test/fixtures/coorpmanager.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/input-search/test/fixtures/coorpmanager.js"],"names":["props","value","placeholder","onChange","console","log","onFocus","onBlur","theme"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,EADF;AAELC,IAAAA,WAAW,EAAE,qBAFR;AAGLC,IAAAA,QAAQ,EAAEF,KAAK,IAAI;AACjBG,MAAAA,OAAO,CAACC,GAAR,CAAYJ,KAAZ;AACD,KALI;AAMLK,IAAAA,OAAO,EAAE,MAAMF,OAAO,CAACC,GAAR,CAAY,SAAZ,CANV;AAOLE,IAAAA,MAAM,EAAE,MAAMH,OAAO,CAACC,GAAR,CAAY,MAAZ,CAPT;AAQLG,IAAAA,KAAK,EAAE;AARF;AADM,C","sourcesContent":["export default {\n  props: {\n    value: '',\n    placeholder: 'Search for a course',\n    onChange: value => {\n      console.log(value);\n    },\n    onFocus: () => console.log('onFocus'),\n    onBlur: () => console.log('blur'),\n    theme: 'coorpmanager'\n  }\n};\n"],"file":"coorpmanager.js"}

package/lib/atom/input-search/test/fixtures/default.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/input-search/test/fixtures/default.js"],"names":["props","value","placeholder","onChange","console","log","onFocus","onBlur"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,EADF;AAELC,IAAAA,WAAW,EAAE,qBAFR;AAGLC,IAAAA,QAAQ,EAAEF,KAAK,IAAI;AACjBG,MAAAA,OAAO,CAACC,GAAR,CAAYJ,KAAZ;AACD,KALI;AAMLK,IAAAA,OAAO,EAAE,MAAMF,OAAO,CAACC,GAAR,CAAY,SAAZ,CANV;AAOLE,IAAAA,MAAM,EAAE,MAAMH,OAAO,CAACC,GAAR,CAAY,MAAZ;AAPT;AADM,C","sourcesContent":["export default {\n  props: {\n    value: '',\n    placeholder: 'Search for a course',\n    onChange: value => {\n      console.log(value);\n    },\n    onFocus: () => console.log('onFocus'),\n    onBlur: () => console.log('blur')\n  }\n};\n"],"file":"default.js"}

package/lib/atom/input-search/test/fixtures/with-value.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/input-search/test/fixtures/with-value.js"],"names":["props","value","placeholder","onChange","console","log","onEnter","onFocus"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,sBADF;AAELC,IAAAA,WAAW,EAAE,qBAFR;AAGLC,IAAAA,QAAQ,EAAEF,KAAK,IAAI;AACjBG,MAAAA,OAAO,CAACC,GAAR,CAAYJ,KAAZ;AACD,KALI;AAMLK,IAAAA,OAAO,EAAE,MAAMF,OAAO,CAACC,GAAR,CAAY,eAAZ,CANV;AAOLE,IAAAA,OAAO,EAAE,MAAMH,OAAO,CAACC,GAAR,CAAY,SAAZ;AAPV;AADM,C","sourcesContent":["export default {\n  props: {\n    value: 'big data - le retour',\n    placeholder: 'Search for a course',\n    onChange: value => {\n      console.log(value);\n    },\n    onEnter: () => console.log('pressed enter'),\n    onFocus: () => console.log('onFocus')\n  }\n};\n"],"file":"with-value.js"}

package/lib/atom/tag/index.js

@@ -0,0 +1,39 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _keys2 = _interopRequireDefault(require("lodash/fp/keys"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const TAG_STYLES = {
+  default: _style.default.default,
+  published: _style.default.published,
+  revision: _style.default.revision,
+  archived: _style.default.archived
+};
+
+const Tag = props => {
+  const {
+    label,
+    type = 'default'
+  } = props;
+  return /*#__PURE__*/_react.default.createElement("span", {
+    className: TAG_STYLES[type]
+  }, label);
+};
+
+Tag.propTypes = process.env.NODE_ENV !== "production" ? {
+  label: _propTypes.default.string,
+  type: _propTypes.default.oneOf((0, _keys2.default)(TAG_STYLES))
+} : {};
+var _default = Tag;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/atom/tag/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/atom/tag/index.js"],"names":["TAG_STYLES","default","style","published","revision","archived","Tag","props","label","type","propTypes","PropTypes","string","oneOf"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;AAEA,MAAMA,UAAU,GAAG;AACjBC,EAAAA,OAAO,EAAEC,eAAMD,OADE;AAEjBE,EAAAA,SAAS,EAAED,eAAMC,SAFA;AAGjBC,EAAAA,QAAQ,EAAEF,eAAME,QAHC;AAIjBC,EAAAA,QAAQ,EAAEH,eAAMG;AAJC,CAAnB;;AAOA,MAAMC,GAAG,GAAGC,KAAK,IAAI;AACnB,QAAM;AAACC,IAAAA,KAAD;AAAQC,IAAAA,IAAI,GAAG;AAAf,MAA4BF,KAAlC;AAEA,sBAAO;AAAM,IAAA,SAAS,EAAEP,UAAU,CAACS,IAAD;AAA3B,KAAoCD,KAApC,CAAP;AACD,CAJD;;AAMAF,GAAG,CAACI,SAAJ,2CAAgB;AACdF,EAAAA,KAAK,EAAEG,mBAAUC,MADH;AAEdH,EAAAA,IAAI,EAAEE,mBAAUE,KAAV,CAAgB,oBAAKb,UAAL,CAAhB;AAFQ,CAAhB;eAKeM,G","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport style from './style.css';\n\nconst TAG_STYLES = {\n  default: style.default,\n  published: style.published,\n  revision: style.revision,\n  archived: style.archived\n};\n\nconst Tag = props => {\n  const {label, type = 'default'} = props;\n\n  return <span className={TAG_STYLES[type]}>{label}</span>;\n};\n\nTag.propTypes = {\n  label: PropTypes.string,\n  type: PropTypes.oneOf(keys(TAG_STYLES))\n};\n\nexport default Tag;\n"],"file":"index.js"}

package/lib/atom/tag/style.css

@@ -0,0 +1,38 @@
+@value colors: "../../variables/colors.css";
+@value white from colors;
+@value cm_yellow_200 from colors;
+@value cm_positive_100 from colors;
+@value cm_orange_700 from colors;
+@value black from colors;
+
+.tag {
+  border-radius: 24px;
+  font-family: 'Gilroy';
+  font-size: 14px;
+  font-weight: bold;
+  min-width: 90px;
+  padding: 12px 16px;
+}
+
+.default {
+    composes: tag;
+    color: black;
+}
+
+.revision {
+    composes: tag;
+    background-color: color(cm_yellow_200 a(15%));
+    color: cm_yellow_200;
+}
+
+.published {
+    composes: tag;
+    background-color: color(cm_positive_100 a(15%));
+    color: cm_positive_100;
+}
+
+.archived {
+    composes: tag;
+    background-color: color(cm_orange_700 a(15%));
+    color: cm_orange_700;
+}

package/lib/atom/tag/test/fixtures/archived.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    label: 'Archived',
+    type: 'archived'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=archived.js.map

package/lib/atom/tag/test/fixtures/archived.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/tag/test/fixtures/archived.js"],"names":["props","label","type"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,UADF;AAELC,IAAAA,IAAI,EAAE;AAFD;AADM,C","sourcesContent":["export default {\n  props: {\n    label: 'Archived',\n    type: 'archived'\n  }\n};\n"],"file":"archived.js"}

package/lib/atom/tag/test/fixtures/default.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    label: 'Default',
+    type: undefined
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=default.js.map

package/lib/atom/tag/test/fixtures/default.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/tag/test/fixtures/default.js"],"names":["props","label","type","undefined"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,SADF;AAELC,IAAAA,IAAI,EAAEC;AAFD;AADM,C","sourcesContent":["export default {\n  props: {\n    label: 'Default',\n    type: undefined\n  }\n};\n"],"file":"default.js"}

package/lib/atom/tag/test/fixtures/published.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    label: 'Published',
+    type: 'published'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=published.js.map

package/lib/atom/tag/test/fixtures/published.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/tag/test/fixtures/published.js"],"names":["props","label","type"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,WADF;AAELC,IAAAA,IAAI,EAAE;AAFD;AADM,C","sourcesContent":["export default {\n  props: {\n    label: 'Published',\n    type: 'published'\n  }\n};\n"],"file":"published.js"}

package/lib/atom/tag/test/fixtures/revision.js

@@ -0,0 +1,12 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _default = {
+  props: {
+    label: 'Ongoing changes',
+    type: 'revision'
+  }
+};
+exports.default = _default;
+//# sourceMappingURL=revision.js.map

package/lib/atom/tag/test/fixtures/revision.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/atom/tag/test/fixtures/revision.js"],"names":["props","label","type"],"mappings":";;;;eAAe;AACbA,EAAAA,KAAK,EAAE;AACLC,IAAAA,KAAK,EAAE,iBADF;AAELC,IAAAA,IAAI,EAAE;AAFD;AADM,C","sourcesContent":["export default {\n  props: {\n    label: 'Ongoing changes',\n    type: 'revision'\n  }\n};\n"],"file":"revision.js"}

package/lib/atom/title/test/fixtures.js

@@ -8,7 +8,11 @@ var _renderComponent = _interopRequireDefault(require("../../../test/helpers/ren
 
 var _ = _interopRequireDefault(require(".."));
 
-var _fixture = _interopRequireDefault(require("./fixtures/fixture"));
+var _formGroupTitleWithoutSubtitle = _interopRequireDefault(require("./fixtures/form-group-title-without-subtitle"));
+
+var _formGroupTitle = _interopRequireDefault(require("./fixtures/form-group-title"));
+
+var _pageTitle = _interopRequireDefault(require("./fixtures/page-title"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -18,5 +22,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     t.not(value, undefined, `PropType for "Atom.AtomTitle.propTypes.${key}" may not be undefined. Did you mistype the propTypes definition?`);
   });
 });
-(0, _ava.default)('Atom › AtomTitle › Fixture › should be rendered', _renderComponent.default, _.default, _fixture.default);
+(0, _ava.default)('Atom › AtomTitle › FormGroupTitleWithoutSubtitle › should be rendered', _renderComponent.default, _.default, _formGroupTitleWithoutSubtitle.default);
+(0, _ava.default)('Atom › AtomTitle › FormGroupTitle › should be rendered', _renderComponent.default, _.default, _formGroupTitle.default);
+(0, _ava.default)('Atom › AtomTitle › PageTitle › should be rendered', _renderComponent.default, _.default, _pageTitle.default);
 //# sourceMappingURL=fixtures.js.map

package/lib/atom/title/test/fixtures.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/atom/title/test/fixtures.js"],"names":["t","pass","AtomTitle","propTypes","value","key","not","undefined","renderComponentMacro","fixtureFixture"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,gDAAL,EAAuDA,CAAC,IAAI;AAC1DA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAUC,SAAlB,EAA6B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AAC3CL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,0CAAyCF,GAAI,mEAAtE;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,iDAAL,EAAwDG,wBAAxD,EAA8EN,SAA9E,EAAyFO,gBAAzF","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomTitle from '..';\nimport fixtureFixture from './fixtures/fixture';\n\ntest('Atom › AtomTitle > should have valid propTypes', t => {\n  t.pass();\n  forEach(AtomTitle.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Atom.AtomTitle.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Atom › AtomTitle › Fixture › should be rendered', renderComponentMacro, AtomTitle, fixtureFixture);\n"],"file":"fixtures.js"}
+{"version":3,"sources":["../../../../src/atom/title/test/fixtures.js"],"names":["t","pass","AtomTitle","propTypes","value","key","not","undefined","renderComponentMacro","fixtureFormGroupTitleWithoutSubtitle","fixtureFormGroupTitle","fixturePageTitle"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,kBAAK,gDAAL,EAAuDA,CAAC,IAAI;AAC1DA,EAAAA,CAAC,CAACC,IAAF;AACA,wBAAQC,UAAUC,SAAlB,EAA6B,CAACC,KAAD,EAAQC,GAAR,KAAgB;AAC3CL,IAAAA,CAAC,CAACM,GAAF,CAAMF,KAAN,EAAaG,SAAb,EAAyB,0CAAyCF,GAAI,mEAAtE;AACD,GAFD;AAGD,CALD;AAOA,kBAAK,uEAAL,EAA8EG,wBAA9E,EAAoGN,SAApG,EAA+GO,sCAA/G;AACA,kBAAK,wDAAL,EAA+DD,wBAA/D,EAAqFN,SAArF,EAAgGQ,uBAAhG;AACA,kBAAK,mDAAL,EAA0DF,wBAA1D,EAAgFN,SAAhF,EAA2FS,kBAA3F","sourcesContent":["import test from 'ava';\nimport forEach from 'lodash/forEach';\nimport renderComponentMacro from '../../../test/helpers/render-component';\nimport AtomTitle from '..';\nimport fixtureFormGroupTitleWithoutSubtitle from './fixtures/form-group-title-without-subtitle';\nimport fixtureFormGroupTitle from './fixtures/form-group-title';\nimport fixturePageTitle from './fixtures/page-title';\n\ntest('Atom › AtomTitle > should have valid propTypes', t => {\n  t.pass();\n  forEach(AtomTitle.propTypes, (value, key) => {\n    t.not(value, undefined, `PropType for \"Atom.AtomTitle.propTypes.${key}\" may not be undefined. Did you mistype the propTypes definition?`);\n  });\n});\n\ntest('Atom › AtomTitle › FormGroupTitleWithoutSubtitle › should be rendered', renderComponentMacro, AtomTitle, fixtureFormGroupTitleWithoutSubtitle);\ntest('Atom › AtomTitle › FormGroupTitle › should be rendered', renderComponentMacro, AtomTitle, fixtureFormGroupTitle);\ntest('Atom › AtomTitle › PageTitle › should be rendered', renderComponentMacro, AtomTitle, fixturePageTitle);\n"],"file":"fixtures.js"}

package/lib/molecule/banner/style.css

@@ -6,7 +6,7 @@
 @value cm_negative_50 from colors;
 @value cm_negative_200 from colors;
 @value cm_warning_50 from colors;
-@value cm_warning_200 from colors;
+@value cm_yellow_200 from colors;
 
 .banner {
     display: flex;
@@ -17,7 +17,7 @@
     padding: 16px 24px; 
     border-radius: 5px;
     background-color: cm_warning_50;
-    color: cm_warning_200;
+    color: cm_yellow_200;
     border-radius: 5px;
 }
 
@@ -40,7 +40,7 @@
     align-self: stretch;
     flex-grow: 0;
     opacity: 0.1;
-    background-color: cm_warning_200;
+    background-color: cm_yellow_200;
 }
 
 .icon {

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

@@ -9,9 +9,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _novaIcons = require("@coorpacademy/nova-icons");
 
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _button = _interopRequireDefault(require("../../atom/button"));
+var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
 var _style = _interopRequireDefault(require("./style.css"));
 
@@ -55,31 +53,38 @@ const CMPopin = props => {
     }
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.buttonContainer
-  }, firstButton ? /*#__PURE__*/_react.default.createElement(_button.default, {
-    submitValue: firstButton.label,
+  }, firstButton ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.button
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
+    label: firstButton.label,
     onClick: firstButton.handleOnclick,
-    name: `cm-popin-cta`,
-    className: _style.default.button,
-    buttonContentClassName: _style.default.buttonContent
-  }) : null, secondButton ? /*#__PURE__*/_react.default.createElement(_button.default, {
-    submitValue: secondButton.label,
+    "data-name": `cm-popin-cta`,
+    "aria-lable": firstButton.ariaLabel,
+    type: firstButton.type
+  })) : null, secondButton ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.button
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
+    label: secondButton.label,
     onClick: secondButton.handleOnclick,
-    name: `cm-popin-cta-${secondButton.type}`,
-    className: _style.default.button,
-    buttonContentClassName: (0, _classnames.default)([_style.default.buttonContent, secondButton.type === 'dangerous' ? _style.default.dangerousButton : _style.default.coloredButton])
-  }) : null)), ")");
+    "data-name": `cm-popin-cta-${secondButton.type}`,
+    "aria-lable": firstButton.ariaLabel,
+    type: secondButton.type
+  })) : null)), ")");
 };
 
 CMPopin.propTypes = process.env.NODE_ENV !== "production" ? {
   content: _propTypes.default.string,
   firstButton: _propTypes.default.shape({
     label: _propTypes.default.string,
-    handleOnclick: _propTypes.default.func
+    handleOnclick: _propTypes.default.func,
+    ariaLabel: _propTypes.default.string,
+    type: _propTypes.default.string
   }),
   secondButton: _propTypes.default.shape({
     label: _propTypes.default.string,
     handleOnclick: _propTypes.default.func,
-    type: _propTypes.default.oneOf(['warning', 'warningWithClose', 'dangerous', 'default'])
+    type: _propTypes.default.oneOf(['dangerous', 'primary']),
+    ariaLabel: _propTypes.default.string
   }),
   onClose: _propTypes.default.func,
   icon: _propTypes.default.string

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/molecule/cm-popin/index.js"],"names":["CMPopin","props","content","firstButton","secondButton","onClose","icon","logo","AlertDiamond","WindowUpload","LogoComponent","style","background","popin","popinHeader","headerCloseIconContainer","headerCloseIcon","contentSection","__html","buttonContainer","label","handleOnclick","button","buttonContent","type","dangerousButton","coloredButton","propTypes","PropTypes","string","shape","func","oneOf"],"mappings":";;;;;AAAA;;AACA;;AACA;;AAKA;;AACA;;AACA;;;;AAEA,MAAMA,OAAO,GAAGC,KAAK,IAAI;AACvB,QAAM;AAACC,IAAAA,OAAD;AAAUC,IAAAA,WAAV;AAAuBC,IAAAA,YAAvB;AAAqCC,IAAAA,OAArC;AAA8CC,IAAAA;AAA9C,MAAsDL,KAA5D;AAEA,QAAMM,IAAI,GAAG;AACXC,IAAAA,YAAY,EAAZA,0DADW;AAEXC,IAAAA,YAAY,EAAZA;AAFW,GAAb;AAIA,QAAMC,aAAa,GAAGH,IAAI,CAACD,IAAD,CAA1B;AAEA,sBACE;AAAK,IAAA,SAAS,EAAEK,eAAMC;AAAtB,kBACE;AAAK,IAAA,SAAS,EAAED,eAAME;AAAtB,kBACE;AAAQ,IAAA,SAAS,EAAEF,eAAMG;AAAzB,KACGT,OAAO,gBACN;AACE,IAAA,SAAS,EAAEM,eAAMI,wBADnB;AAEE,IAAA,OAAO,EAAEV,OAFX;AAGE,iBAAW;AAHb,kBAKE,6BAAC,+BAAD;AAAO,IAAA,SAAS,EAAEM,eAAMK;AAAxB,IALF,CADM,GAQJ,IATN,CADF,eAYE;AAAK,IAAA,SAAS,EAAEL,eAAMM;AAAtB,KACGP,aAAa,gBAAG,6BAAC,aAAD;AAAe,IAAA,SAAS,EAAEC,eAAML;AAAhC,IAAH,GAA8C,IAD9D,eAEE;AACE,IAAA,SAAS,EAAEK,eAAMT,OADnB;AAEE,iBAAY,kBAFd,CAGE;AAHF;AAIE,IAAA,uBAAuB,EAAE;AAACgB,MAAAA,MAAM,EAAEhB;AAAT;AAJ3B,IAFF,CAZF,eAsBE;AAAK,IAAA,SAAS,EAAES,eAAMQ;AAAtB,KACGhB,WAAW,gBACV,6BAAC,eAAD;AACE,IAAA,WAAW,EAAEA,WAAW,CAACiB,KAD3B;AAEE,IAAA,OAAO,EAAEjB,WAAW,CAACkB,aAFvB;AAGE,IAAA,IAAI,EAAG,cAHT;AAIE,IAAA,SAAS,EAAEV,eAAMW,MAJnB;AAKE,IAAA,sBAAsB,EAAEX,eAAMY;AALhC,IADU,GAQR,IATN,EAUGnB,YAAY,gBACX,6BAAC,eAAD;AACE,IAAA,WAAW,EAAEA,YAAY,CAACgB,KAD5B;AAEE,IAAA,OAAO,EAAEhB,YAAY,CAACiB,aAFxB;AAGE,IAAA,IAAI,EAAG,gBAAejB,YAAY,CAACoB,IAAK,EAH1C;AAIE,IAAA,SAAS,EAAEb,eAAMW,MAJnB;AAKE,IAAA,sBAAsB,EAAE,yBAAW,CACjCX,eAAMY,aAD2B,EAEjCnB,YAAY,CAACoB,IAAb,KAAsB,WAAtB,GAAoCb,eAAMc,eAA1C,GAA4Dd,eAAMe,aAFjC,CAAX;AAL1B,IADW,GAWT,IArBN,CAtBF,CADF,MADF;AAmDD,CA5DD;;AA8DA1B,OAAO,CAAC2B,SAAR,2CAAoB;AAClBzB,EAAAA,OAAO,EAAE0B,mBAAUC,MADD;AAElB1B,EAAAA,WAAW,EAAEyB,mBAAUE,KAAV,CAAgB;AAC3BV,IAAAA,KAAK,EAAEQ,mBAAUC,MADU;AAE3BR,IAAAA,aAAa,EAAEO,mBAAUG;AAFE,GAAhB,CAFK;AAMlB3B,EAAAA,YAAY,EAAEwB,mBAAUE,KAAV,CAAgB;AAC5BV,IAAAA,KAAK,EAAEQ,mBAAUC,MADW;AAE5BR,IAAAA,aAAa,EAAEO,mBAAUG,IAFG;AAG5BP,IAAAA,IAAI,EAAEI,mBAAUI,KAAV,CAAgB,CAAC,SAAD,EAAY,kBAAZ,EAAgC,WAAhC,EAA6C,SAA7C,CAAhB;AAHsB,GAAhB,CANI;AAWlB3B,EAAAA,OAAO,EAAEuB,mBAAUG,IAXD;AAYlBzB,EAAAA,IAAI,EAAEsB,mBAAUC;AAZE,CAApB;eAee7B,O","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidInterfaceFeedbackInterfaceAlertDiamond as AlertDiamond,\n  NovaSolidApplicationsWindowUpload3 as WindowUpload,\n  NovaSolidStatusClose as Close\n} from '@coorpacademy/nova-icons';\nimport classNames from 'classnames';\nimport Cta from '../../atom/button';\nimport style from './style.css';\n\nconst CMPopin = props => {\n  const {content, firstButton, secondButton, onClose, icon} = props;\n\n  const logo = {\n    AlertDiamond,\n    WindowUpload\n  };\n  const LogoComponent = logo[icon];\n\n  return (\n    <div className={style.background}>\n      <div className={style.popin}>\n        <header className={style.popinHeader}>\n          {onClose ? (\n            <div\n              className={style.headerCloseIconContainer}\n              onClick={onClose}\n              data-name={'close-icon'}\n            >\n              <Close className={style.headerCloseIcon} />\n            </div>\n          ) : null}\n        </header>\n        <div className={style.contentSection}>\n          {LogoComponent ? <LogoComponent className={style.icon} /> : null}\n          <p\n            className={style.content}\n            data-name={`cm-popin-content`}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: content}}\n          />\n        </div>\n\n        <div className={style.buttonContainer}>\n          {firstButton ? (\n            <Cta\n              submitValue={firstButton.label}\n              onClick={firstButton.handleOnclick}\n              name={`cm-popin-cta`}\n              className={style.button}\n              buttonContentClassName={style.buttonContent}\n            />\n          ) : null}\n          {secondButton ? (\n            <Cta\n              submitValue={secondButton.label}\n              onClick={secondButton.handleOnclick}\n              name={`cm-popin-cta-${secondButton.type}`}\n              className={style.button}\n              buttonContentClassName={classNames([\n                style.buttonContent,\n                secondButton.type === 'dangerous' ? style.dangerousButton : style.coloredButton\n              ])}\n            />\n          ) : null}\n        </div>\n      </div>\n      )\n    </div>\n  );\n};\n\nCMPopin.propTypes = {\n  content: PropTypes.string,\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['warning', 'warningWithClose', 'dangerous', 'default'])\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.string\n};\n\nexport default CMPopin;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/molecule/cm-popin/index.js"],"names":["CMPopin","props","content","firstButton","secondButton","onClose","icon","logo","AlertDiamond","WindowUpload","LogoComponent","style","background","popin","popinHeader","headerCloseIconContainer","headerCloseIcon","contentSection","__html","buttonContainer","button","label","handleOnclick","ariaLabel","type","propTypes","PropTypes","string","shape","func","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidInterfaceFeedbackInterfaceAlertDiamond as AlertDiamond,\n  NovaSolidApplicationsWindowUpload3 as WindowUpload,\n  NovaSolidStatusClose as Close\n} from '@coorpacademy/nova-icons';\nimport Cta from '../../atom/button-link';\nimport style from './style.css';\n\nconst CMPopin = props => {\n  const {content, firstButton, secondButton, onClose, icon} = props;\n\n  const logo = {\n    AlertDiamond,\n    WindowUpload\n  };\n  const LogoComponent = logo[icon];\n\n  return (\n    <div className={style.background}>\n      <div className={style.popin}>\n        <header className={style.popinHeader}>\n          {onClose ? (\n            <div\n              className={style.headerCloseIconContainer}\n              onClick={onClose}\n              data-name={'close-icon'}\n            >\n              <Close className={style.headerCloseIcon} />\n            </div>\n          ) : null}\n        </header>\n        <div className={style.contentSection}>\n          {LogoComponent ? <LogoComponent className={style.icon} /> : null}\n          <p\n            className={style.content}\n            data-name={`cm-popin-content`}\n            // eslint-disable-next-line react/no-danger\n            dangerouslySetInnerHTML={{__html: content}}\n          />\n        </div>\n\n        <div className={style.buttonContainer}>\n          {firstButton ? (\n            <div className={style.button}>\n              <Cta\n                label={firstButton.label}\n                onClick={firstButton.handleOnclick}\n                data-name={`cm-popin-cta`}\n                aria-lable={firstButton.ariaLabel}\n                type={firstButton.type}\n              />\n            </div>\n          ) : null}\n          {secondButton ? (\n            <div className={style.button}>\n              <Cta\n                label={secondButton.label}\n                onClick={secondButton.handleOnclick}\n                data-name={`cm-popin-cta-${secondButton.type}`}\n                aria-lable={firstButton.ariaLabel}\n                type={secondButton.type}\n              />\n            </div>\n          ) : null}\n        </div>\n      </div>\n      )\n    </div>\n  );\n};\n\nCMPopin.propTypes = {\n  content: PropTypes.string,\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    ariaLabel: PropTypes.string,\n    type: PropTypes.string\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary']),\n    ariaLabel: PropTypes.string\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.string\n};\n\nexport default CMPopin;\n"],"file":"index.js"}

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

@@ -74,52 +74,10 @@
 }
 
 .button {
-  min-width: auto;
-  margin: 0px 8px;
-  border-radius: 7px;
-  transform: none;
-}
-
-.dangerousButton {
-  background-color: cm_negative_100;
-  color: white;
-}
-
-.coloredButton {
-  background-color: cm_primary_blue;
-  color: white;
-}
-
-.dangerousButton:hover {
-  background-color: cm_negative_200;
-}
-
-.coloredButton:hover {
-  background-color: cm_blue_600;
+  width: 160px;
+  padding: 8px;
 }
 
-.button::after,
-.button:hover::after,
-.button:focus::after,
-.button:active::after {
-  transform: none;
-}
-
-
-.buttonContent {
-  width: 180px;
-  padding: 12px 24px;
-  line-height: 1.43;
-  font-size: 14px;
-  font-weight: bold;
-  display: block;
-  text-transform: inherit;
-  font-family: Gilroy;
-  text-align: center;
-  box-sizing: border-box;
-  border: none;
-  cursor: pointer;
-}
 .icon {
   width: 60px;
   height: 60px;