@desynova-digital/components 9.0.27 → 9.1.0

package/_helpers/globals.js

@@ -1,14 +1,13 @@
-'use strict';
+"use strict";
 
 var insertAtTheStart = function insertAtTheStart(styles) {
-    var tag = document.createElement('style');
-    tag.type = 'text/css';
-    tag.id = 'contido-globals';
-    tag.innerHTML = styles;
+  var tag = document.createElement('style');
+  tag.type = 'text/css';
+  tag.id = 'contido-globals';
+  tag.innerHTML = styles;
 
-    // Register the resets before anything else
-    var head = document.getElementsByTagName('head')[0];
-    head.prepend(tag);
+  // Register the resets before anything else
+  var head = document.getElementsByTagName('head')[0];
+  head.prepend(tag);
 };
-
-insertAtTheStart('\n    html, body, div, span, applet, object, iframe,\n    h1, h2, h3, h4, h5, h6, p, blockquote, pre,\n    a, abbr, acronym, address, big, cite, code,\n    del, dfn, em, img, ins, kbd, q, s, samp,\n    small, strike, strong, sub, sup, tt, var,\n    b, u, i, center,\n    dl, dt, dd, ol, ul, li,\n    fieldset, form, label, legend,\n    table, caption, tbody, tfoot, thead, tr, th, td,\n    article, aside, canvas, details, embed,\n    figure, figcaption, footer, header, hgroup,\n    menu, nav, output, ruby, section, summary,\n    time, mark, audio, video {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        font-size: 100%;\n        outline: none;\n        font: inherit;\n        vertical-align: baseline;\n    }\n    html, body, #root {\n        height: 100%;\n    }\n\n  /* HTML5 display-role reset for older browsers */\n    article, aside, details, figcaption, figure,\n    footer, header, hgroup, menu, nav, section {\n        display: block;\n    }\n    body {\n        line-height: 1;\n    }\n    ol, ul {\n        list-style: none;\n    }\n    blockquote, q {\n        quotes: none;\n    }\n    blockquote:before, blockquote:after,\n    q:before, q:after {\n        content: \'\';\n        content: none;\n    }\n    table {\n        border-collapse: collapse;\n        border-spacing: 0;\n    }\n    input:-webkit-autofill {\n        -webkit-box-shadow: 0 0 0 30px white inset;\n    }\n\n    /* Our resets */\n    * {\n        box-sizing: border-box;\n    }\n\n    body, input, textarea, button, select {\n        font-size: 14px;\n        -webkit-font-smoothing: antialiased;\n        -moz-osx-font-smoothing: grayscale;\n    }\n    @font-face {\n        font-family: \'SFNSDisplay\';\n        src: url(https://tassets.desynova.com/fonts/SFNSDisplay-thin.ttf) format(\'truetype\');\n    }\n\n    @font-face {\n        font-family: \'SFUIText-Light\';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Light.ttf) format(\'truetype\');\n    }\n\n    @font-face {\n        font-family: \'SFUIText-Medium\';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Medium.ttf) format(\'truetype\');\n    }\n\n    @font-face {\n        font-family: \'SFUIText-Regular\';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Regular.ttf) format(\'truetype\');\n    }\n\n    @font-face {\n        font-family: \'DINCondensed-Bold\';\n        src: url(https://tassets.desynova.com/fonts/DINCondensedBold.ttf) format(\'truetype\');\n    }\n');
+insertAtTheStart("\n    html, body, div, span, applet, object, iframe,\n    h1, h2, h3, h4, h5, h6, p, blockquote, pre,\n    a, abbr, acronym, address, big, cite, code,\n    del, dfn, em, img, ins, kbd, q, s, samp,\n    small, strike, strong, sub, sup, tt, var,\n    b, u, i, center,\n    dl, dt, dd, ol, ul, li,\n    fieldset, form, label, legend,\n    table, caption, tbody, tfoot, thead, tr, th, td,\n    article, aside, canvas, details, embed,\n    figure, figcaption, footer, header, hgroup,\n    menu, nav, output, ruby, section, summary,\n    time, mark, audio, video {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        font-size: 100%;\n        outline: none;\n        font: inherit;\n        vertical-align: baseline;\n    }\n    html, body, #root {\n        height: 100%;\n    }\n\n  /* HTML5 display-role reset for older browsers */\n    article, aside, details, figcaption, figure,\n    footer, header, hgroup, menu, nav, section {\n        display: block;\n    }\n    body {\n        line-height: 1;\n    }\n    ol, ul {\n        list-style: none;\n    }\n    blockquote, q {\n        quotes: none;\n    }\n    blockquote:before, blockquote:after,\n    q:before, q:after {\n        content: '';\n        content: none;\n    }\n    table {\n        border-collapse: collapse;\n        border-spacing: 0;\n    }\n    input:-webkit-autofill {\n        -webkit-box-shadow: 0 0 0 30px white inset;\n    }\n\n    /* Our resets */\n    * {\n        box-sizing: border-box;\n    }\n\n    body, input, textarea, button, select {\n        font-size: 14px;\n        -webkit-font-smoothing: antialiased;\n        -moz-osx-font-smoothing: grayscale;\n    }\n    @font-face {\n        font-family: 'SFNSDisplay';\n        src: url(https://tassets.desynova.com/fonts/SFNSDisplay-thin.ttf) format('truetype');\n    }\n\n    @font-face {\n        font-family: 'SFUIText-Light';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Light.ttf) format('truetype');\n    }\n\n    @font-face {\n        font-family: 'SFUIText-Medium';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Medium.ttf) format('truetype');\n    }\n\n    @font-face {\n        font-family: 'SFUIText-Regular';\n        src: url(https://tassets.desynova.com/fonts/SFUIText-Regular.ttf) format('truetype');\n    }\n\n    @font-face {\n        font-family: 'DINCondensed-Bold';\n        src: url(https://tassets.desynova.com/fonts/DINCondensedBold.ttf) format('truetype');\n    }\n");

package/_helpers/pagination.js

@@ -1,16 +1,15 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.changePageIfAppropiate = changePageIfAppropiate;
+exports.getPaginationSlice = getPaginationSlice;
 exports.pageInputWidth = pageInputWidth;
 exports.pagesFromItems = pagesFromItems;
-exports.changePageIfAppropiate = changePageIfAppropiate;
 exports.totals = totals;
-exports.getPaginationSlice = getPaginationSlice;
-
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 /**
  * Calculates the page input width based on the characters
  * it contains.
@@ -19,10 +18,8 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
 function pageInputWidth(page) {
   var charWidth = 8;
   var baseWidth = 50;
-
   var pageAsString = page.toString();
   var pageCharLength = pageAsString.length;
-
   return pageCharLength * charWidth + baseWidth;
 }
 
@@ -49,7 +46,6 @@ function changePageIfAppropiate(rawNextPage, total, perPage, handlerFn) {
   var nextPage = parseInt(rawNextPage);
   var pageCount = pagesFromItems(total, perPage);
   var nextPageExists = nextPage > 0 && nextPage <= pageCount;
-
   if (nextPageExists) handlerFn(nextPage);
 }
 
@@ -62,8 +58,7 @@ function changePageIfAppropiate(rawNextPage, total, perPage, handlerFn) {
 function totals(page, perPage, items) {
   var toRecord = page * perPage;
   var fromRecord = toRecord - perPage + 1;
-
-  return "Showing " + fromRecord + " - " + toRecord + " of " + items;
+  return "Showing ".concat(fromRecord, " - ").concat(toRecord, " of ").concat(items);
 }
 
 /**
@@ -85,18 +80,18 @@ function totals(page, perPage, items) {
  */
 function getPaginationSlice(page, items, itemsPerPage) {
   var pagesPerSlice = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 10;
-
   var actualPage = page - 1;
   var minPage = actualPage - actualPage % pagesPerSlice;
   var maxPage = pagesFromItems(items, itemsPerPage);
-
-  var range = [].concat(_toConsumableArray(Array(pagesPerSlice).keys())).map(function (i) {
+  var range = (0, _toConsumableArray2["default"])(Array(pagesPerSlice).keys()).map(function (i) {
     var pageNumber = i + minPage + 1; // Avoid starting at 0
     var selected = page === pageNumber;
-    return { label: pageNumber, selected: selected };
+    return {
+      label: pageNumber,
+      selected: selected
+    };
   }).filter(function (i) {
     return i.label <= maxPage;
   });
-
   return range;
 }

package/_helpers/story-example.js

@@ -1,51 +1,28 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-var _templateObject = _taggedTemplateLiteral(['\n  position: absolute;\n  font-family: \'Roboto Mono\';\n  font-size: 12px;\n  color: rgb(168, 168, 168);\n  top: 1.5em;\n  left: 2em;\n'], ['\n  position: absolute;\n  font-family: \'Roboto Mono\';\n  font-size: 12px;\n  color: rgb(168, 168, 168);\n  top: 1.5em;\n  left: 2em;\n']),
-    _templateObject2 = _taggedTemplateLiteral(['\n  padding: 4.5rem 3rem 3rem 3rem;\n  position: relative;\n  border: 1px solid rgb(236, 236, 236);\n  margin-bottom: 1rem;\n  border-radius: 3px;\n\n  &.align-center {\n    display: flex;\n    flex-wrap: nowrap;\n    align-content: center;\n    justify-content: center;\n  }\n\n  background: ', ';\n  color: ', ';\n'], ['\n  padding: 4.5rem 3rem 3rem 3rem;\n  position: relative;\n  border: 1px solid rgb(236, 236, 236);\n  margin-bottom: 1rem;\n  border-radius: 3px;\n\n  &.align-center {\n    display: flex;\n    flex-wrap: nowrap;\n    align-content: center;\n    justify-content: center;\n  }\n\n  background: ', ';\n  color: ', ';\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _tokens = require('@desynova-digital/tokens');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var Title = _styledComponents2.default.div(_templateObject);
-
-var Wrapper = _styledComponents2.default.div(_templateObject2, function (props) {
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _tokens = require("@desynova-digital/tokens");
+var _templateObject, _templateObject2;
+var Title = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  position: absolute;\n  font-family: 'Roboto Mono';\n  font-size: 12px;\n  color: rgb(168, 168, 168);\n  top: 1.5em;\n  left: 2em;\n"])));
+var Wrapper = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  padding: 4.5rem 3rem 3rem 3rem;\n  position: relative;\n  border: 1px solid rgb(236, 236, 236);\n  margin-bottom: 1rem;\n  border-radius: 3px;\n\n  &.align-center {\n    display: flex;\n    flex-wrap: nowrap;\n    align-content: center;\n    justify-content: center;\n  }\n\n  background: ", ";\n  color: ", ";\n"])), function (props) {
   return _tokens.colors.common.base[props.background];
 }, function (props) {
-  return props.background === 'dark' ? _tokens.colors.common.base.white : _tokens.colors.common.text.default;
+  return props.background === 'dark' ? _tokens.colors.common.base.white : _tokens.colors.common.text["default"];
 });
-
 var Example = function Example(props) {
-  return _react2.default.createElement(
-    Wrapper,
-    _extends({ className: props.align === 'center' ? 'align-center' : null }, props),
-    _react2.default.createElement(
-      Title,
-      null,
-      props.title
-    ),
-    props.children
-  );
+  return /*#__PURE__*/_react["default"].createElement(Wrapper, (0, _extends2["default"])({
+    className: props.align === 'center' ? 'align-center' : null
+  }, props), /*#__PURE__*/_react["default"].createElement(Title, null, props.title), props.children);
 };
-
 Example.defaultProps = {
   background: 'default'
 };
-
-exports.default = Example;
+var _default = exports["default"] = Example;

package/_helpers/story-helpers.js

@@ -1,19 +1,20 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Stack = exports.Example = undefined;
-
-var _storyExample = require("./story-example");
-
-var _storyExample2 = _interopRequireDefault(_storyExample);
-
-var _storyStack = require("./story-stack");
-
-var _storyStack2 = _interopRequireDefault(_storyStack);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.Example = _storyExample2.default;
-exports.Stack = _storyStack2.default;
+Object.defineProperty(exports, "Example", {
+  enumerable: true,
+  get: function get() {
+    return _storyExample["default"];
+  }
+});
+Object.defineProperty(exports, "Stack", {
+  enumerable: true,
+  get: function get() {
+    return _storyStack["default"];
+  }
+});
+var _storyExample = _interopRequireDefault(require("./story-example"));
+var _storyStack = _interopRequireDefault(require("./story-stack"));

package/_helpers/story-stack.js

@@ -1,43 +1,29 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-var _templateObject = _taggedTemplateLiteral(['\n  display: flex;\n  width: 100%;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  align-items: bottom;\n  justify-content: ', ';\n  overflow: auto;\n  margin-bottom: 20px;\n\n  > * {\n    flex: ', ';\n    align-self: center;\n    margin-right: ', ';\n  }\n  > *:last-child {\n    margin-right: 0;\n  }\n'], ['\n  display: flex;\n  width: 100%;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  align-items: bottom;\n  justify-content: ', ';\n  overflow: auto;\n  margin-bottom: 20px;\n\n  > * {\n    flex: ', ';\n    align-self: center;\n    margin-right: ', ';\n  }\n  > *:last-child {\n    margin-right: 0;\n  }\n']),
-    _templateObject2 = _taggedTemplateLiteral(['\n  flex-basis: ', '%;\n  display: flex;\n  justify-content: center;\n  width: 100%;\n'], ['\n  flex-basis: ', '%;\n  display: flex;\n  justify-content: center;\n  width: 100%;\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _tokens = require('@desynova-digital/tokens');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _tokens = require("@desynova-digital/tokens");
+var _templateObject, _templateObject2;
 var justifyContent = {
   fill: 'space-between',
   left: 'flex-start',
   right: 'flex-end'
 };
-
-var StyledStack = _styledComponents2.default.div(_templateObject, function (props) {
+var StyledStack = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  width: 100%;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  align-items: bottom;\n  justify-content: ", ";\n  overflow: auto;\n  margin-bottom: 20px;\n\n  > * {\n    flex: ", ";\n    align-self: center;\n    margin-right: ", ";\n  }\n  > *:last-child {\n    margin-right: 0;\n  }\n"])), function (props) {
   return justifyContent[props.align];
 }, function (props) {
   return props.align === 'fill' ? 1 : 'none';
 }, function (props) {
   return props.align === 'fill' ? _tokens.spacing.xsmall : 0;
 });
-
-var StackedItem = _styledComponents2.default.div(_templateObject2, function (props) {
+var StackedItem = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  flex-basis: ", "%;\n  display: flex;\n  justify-content: center;\n  width: 100%;\n"])), function (props) {
   return props.width;
 });
 
@@ -48,31 +34,24 @@ var StackedItem = _styledComponents2.default.div(_templateObject2, function (pro
 */
 
 var Stack = function Stack(props) {
-  var children = void 0;
+  var children;
   if (props.align === 'fill') {
-    children = _react2.default.Children.map(props.children, function (child, index) {
+    children = _react["default"].Children.map(props.children, function (child, index) {
       var width = 100;
-      if (props.widths) width = '' + props.widths[index] || 100;
-
-      return _react2.default.createElement(
-        StackedItem,
-        { key: index, width: width },
-        child
-      );
+      if (props.widths) width = "".concat(props.widths[index]) || 100;
+      return /*#__PURE__*/_react["default"].createElement(StackedItem, {
+        key: index,
+        width: width
+      }, child);
     });
   } else {
     children = props.children;
   }
-
-  return _react2.default.createElement(
-    StyledStack,
-    _extends({}, props, { align: props.align }),
-    children
-  );
+  return /*#__PURE__*/_react["default"].createElement(StyledStack, (0, _extends2["default"])({}, props, {
+    align: props.align
+  }), children);
 };
-
 Stack.defaultProps = {
   align: 'fill'
 };
-
-exports.default = Stack;
+var _default = exports["default"] = Stack;

package/_helpers/uniqueId.js

@@ -3,14 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports["default"] = void 0;
 var id = function id() {
   var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-
   prefix = prefix.toLowerCase().replace(/ /g, "_");
-
   var hash = Math.random().toString(36).substring(5);
-
   return prefix + "-" + hash;
 };
-
-exports.default = id;
+var _default = exports["default"] = id;

package/_helpers/utils.js

@@ -1,13 +1,14 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.htmlToText = exports.cleanHtml = void 0;
 exports.timeToSeconds = timeToSeconds;
 function timeToSeconds() {
-  var time = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '00:00:00:00';
+  var time = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "00:00:00:00";
   var frameRate = arguments.length > 1 ? arguments[1] : undefined;
-  var timeObj = time.split(':'); // split it at the colons
+  var timeObj = time.split(":"); // split it at the colons
 
   // minutes are worth 60 seconds. Hours are worth 60 minutes.
   var seconds = +timeObj[0] * 60 * 60 + +timeObj[1] * 60 + +timeObj[2];
@@ -16,4 +17,27 @@ function timeToSeconds() {
     seconds += frames;
   }
   return seconds;
-}
+}
+var cleanHtml = exports.cleanHtml = function cleanHtml(htmlStr) {
+  return htmlStr.replace(/"/g, '"') // Replace " with "
+  .replace(/ /g, " ") // Replace   with a space
+  .replace(/'|'/g, "'") // Replace ' and ' with '
+  .replace(/&|&;/g, "&") // Replace & and &; with &
+  .replace(/&lt;/g, "<") // Replace &lt; with <
+  .replace(/&gt;/g, ">") // Replace &gt; with >
+  .replace(/[\u2018\u2019]/g, "'") // Replace special single quotes
+  .replace(/[\u201C\u201D]/g, '"') // Replace special double quotes
+  .replace(/<br\s*\/?>/gi, "") // Remove <br> tags
+  .replace(/\s{2,}/g, " ") // Replace multiple spaces with a single space
+  .replace(/\s\s+/g, "").replace(/\t/g, "").replace(/\n/g, " ");
+};
+
+/**
+ *
+ * @param {*} htmlStr
+ * @returns
+ */
+var htmlToText = exports.htmlToText = function htmlToText(htmlStr) {
+  var res = htmlStr === null || htmlStr === void 0 ? void 0 : htmlStr.replace(/<\/?[^>]+>/gi, "");
+  return res;
+};

package/atoms/avatar/avatar.js

@@ -1,52 +1,29 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-exports.StyledAvatar = undefined;
-
-var _templateObject = _taggedTemplateLiteral(['\n    width: 30px;\n    height: 30px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 600;\n    font-size: 10px;\n    text-transform: uppercase;\n    color: ', ';\n    background: ', ';\n'], ['\n    width: 30px;\n    height: 30px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 600;\n    font-size: 10px;\n    text-transform: uppercase;\n    color: ', ';\n    background: ', ';\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _tokens = require('@desynova-digital/tokens');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledAvatar = _styledComponents2.default.span(_templateObject, _tokens.colors.common.base.white, function (props) {
-    return _tokens.colors[props.theme].status.primary.background;
+exports["default"] = exports.StyledAvatar = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _tokens = require("@desynova-digital/tokens");
+var _templateObject;
+var StyledAvatar = exports.StyledAvatar = _styledComponents["default"].span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    width: 30px;\n    height: 30px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 600;\n    font-size: 10px;\n    text-transform: uppercase;\n    color: ", ";\n    background: ", ";\n"])), _tokens.colors.common.base.white, function (props) {
+  return _tokens.colors[props.theme].status.primary.background;
 });
-
 var Avatar = function Avatar(props) {
-    return _react2.default.createElement(
-        StyledAvatar,
-        props,
-        props.children
-    );
+  return /*#__PURE__*/_react["default"].createElement(StyledAvatar, props, props.children);
 };
-
 Avatar.propTypes = {
-    /** The visual style used to convey the label's purpose */
-    appearance: _propTypes2.default.oneOf(['default', 'primary']),
-    theme: _propTypes2.default.oneOf(['light', 'dark', 'nexc'])
+  /** The visual style used to convey the label's purpose */
+  appearance: _propTypes["default"].oneOf(['default', 'primary']),
+  theme: _propTypes["default"].oneOf(['light', 'dark', 'nexc'])
 };
-
 Avatar.defaultProps = {
-    appearance: 'default',
-    theme: 'light'
+  appearance: 'default',
+  theme: 'light'
 };
-
-exports.default = Avatar;
-exports.StyledAvatar = StyledAvatar;
+var _default = exports["default"] = Avatar;

package/atoms/avatar/avatar.story.js

@@ -1,61 +1,28 @@
-'use strict';
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _react3 = require('@storybook/react');
-
-var _storyHelpers = require('../../_helpers/story-helpers');
-
-var _components = require('../../components');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-(0, _react3.storiesOf)('Avatar').add('dark theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances Dark', background: 'black' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(
-        _components.Avatar,
-        { theme: 'dark' },
-        'AB'
-      )
-    )
-  );
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@storybook/react");
+var _storyHelpers = require("../../_helpers/story-helpers");
+var _components = require("../../components");
+(0, _react2.storiesOf)('Avatar').add('dark theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances Dark",
+    background: "black"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.Avatar, {
+    theme: "dark"
+  }, "AB")));
 });
-
-(0, _react3.storiesOf)('Avatar').add('light theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(
-        _components.Avatar,
-        null,
-        'AB'
-      )
-    )
-  );
+(0, _react2.storiesOf)('Avatar').add('light theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.Avatar, null, "AB")));
 });
-
-(0, _react3.storiesOf)('Avatar').add('nexc theme', function () {
-  return _react2.default.createElement(
-    _storyHelpers.Example,
-    { title: 'Appearances dark ', background: 'dark' },
-    _react2.default.createElement(
-      _storyHelpers.Stack,
-      null,
-      _react2.default.createElement(
-        _components.Avatar,
-        { theme: 'nexc' },
-        'AB'
-      )
-    )
-  );
+(0, _react2.storiesOf)('Avatar').add('nexc theme', function () {
+  return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
+    title: "Appearances dark ",
+    background: "dark"
+  }, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_components.Avatar, {
+    theme: "nexc"
+  }, "AB")));
 });

package/atoms/avatar/index.js

@@ -1,15 +1,17 @@
-'use strict';
+"use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledAvatar = undefined;
-
-var _avatar = require('./avatar');
-
-var _avatar2 = _interopRequireDefault(_avatar);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-exports.default = _avatar2.default;
-exports.StyledAvatar = _avatar.StyledAvatar;
+Object.defineProperty(exports, "StyledAvatar", {
+  enumerable: true,
+  get: function get() {
+    return _avatar.StyledAvatar;
+  }
+});
+exports["default"] = void 0;
+var _avatar = _interopRequireWildcard(require("./avatar"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var _default = exports["default"] = _avatar["default"];

package/atoms/badge/badge.js

@@ -1,54 +1,31 @@
-'use strict';
+"use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledBadge = undefined;
-
-var _templateObject = _taggedTemplateLiteral(['\n    display: inline-block;\n    vertical-align: middle;\n    font-size: 10px;\n    line-height: 1;\n    font-family: \'SFUIText-Medium\';\n    color: ', ';\n    padding: 5px 8px;\n    background: ', ';\n    border-radius: 21px;\n'], ['\n    display: inline-block;\n    vertical-align: middle;\n    font-size: 10px;\n    line-height: 1;\n    font-family: \'SFUIText-Medium\';\n    color: ', ';\n    padding: 5px 8px;\n    background: ', ';\n    border-radius: 21px;\n']);
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _styledComponents = require('styled-components');
-
-var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-var _tokens = require('@desynova-digital/tokens');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
-var StyledBadge = _styledComponents2.default.span(_templateObject, function (props) {
+exports["default"] = exports.StyledBadge = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _tokens = require("@desynova-digital/tokens");
+var _templateObject;
+var StyledBadge = exports.StyledBadge = _styledComponents["default"].span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: inline-block;\n    vertical-align: middle;\n    font-size: 10px;\n    line-height: 1;\n    font-family: 'SFUIText-Medium';\n    color: ", ";\n    padding: 5px 8px;\n    background: ", ";\n    border-radius: 21px;\n"])), function (props) {
   return _tokens.colors[props.theme].status[props.appearance].text;
 }, function (props) {
   return _tokens.colors[props.theme].status[props.appearance].background;
 });
-
 var Badge = function Badge(props) {
-  return _react2.default.createElement(
-    StyledBadge,
-    props,
-    props.children
-  );
+  return /*#__PURE__*/_react["default"].createElement(StyledBadge, props, props.children);
 };
-
 Badge.propTypes = {
   /** The visual style used to convey the label's purpose */
-  appearance: _propTypes2.default.oneOf(['default', 'primary']),
-  theme: _propTypes2.default.oneOf(['light', 'dark'])
+  appearance: _propTypes["default"].oneOf(['default', 'primary']),
+  theme: _propTypes["default"].oneOf(['light', 'dark'])
 };
-
 Badge.defaultProps = {
   appearance: 'default',
   theme: 'light'
 };
-
-exports.default = Badge;
-exports.StyledBadge = StyledBadge;
+var _default = exports["default"] = Badge;