@nulogy/components 8.14.5 → 8.15.1

package/dist/main.js

@@ -8543,79 +8543,87 @@
       }
     };
 
-    var prefix = "random-id-";
-    var randomId = 0;
-
-    var generateId = function generateId() {
-      randomId += 1;
-      return prefix + randomId;
-    };
-
-    var LoadingIcon = function LoadingIcon(_a) {
-      var _a$color = _a.color,
-          color = _a$color === void 0 ? "currentColor" : _a$color,
-          _a$size = _a.size,
-          size = _a$size === void 0 ? "24px" : _a$size;
-          _a.title;
-          var props = __rest(_a, ["color", "size", "title"]);
-
-      var id = generateId();
-      return (
-        /*#__PURE__*/
-        // Modified svg By Sam Herbert (@sherb), for everyone. More @ http://goo.gl/7AJzbL
-        React__default["default"].createElement("svg", Object.assign({
-          width: size,
-          height: size,
-          viewBox: "0 0 38 38",
-          xmlns: "http://www.w3.org/2000/svg"
-        }, props), /*#__PURE__*/React__default["default"].createElement("defs", null, /*#__PURE__*/React__default["default"].createElement("linearGradient", {
-          x1: "8.042%",
-          y1: "0%",
-          x2: "65.682%",
-          y2: "23.865%",
-          id: id
-        }, /*#__PURE__*/React__default["default"].createElement("stop", {
-          stopColor: color,
-          stopOpacity: "0",
-          offset: "0%"
-        }), /*#__PURE__*/React__default["default"].createElement("stop", {
-          stopColor: color,
-          stopOpacity: ".631",
-          offset: "63.146%"
-        }), /*#__PURE__*/React__default["default"].createElement("stop", {
-          stopColor: color,
-          offset: "100%"
-        }))), /*#__PURE__*/React__default["default"].createElement("g", {
-          fill: "none",
-          fillRule: "evenodd"
-        }, /*#__PURE__*/React__default["default"].createElement("g", {
-          transform: "translate(1 1)"
-        }, /*#__PURE__*/React__default["default"].createElement("path", {
-          d: "M36 18c0-9.94-8.06-18-18-18",
-          id: "Oval-2",
-          stroke: "url(#" + id + ")",
-          strokeWidth: "2"
-        }, /*#__PURE__*/React__default["default"].createElement("animateTransform", {
-          attributeName: "transform",
-          type: "rotate",
-          from: "0 18 18",
-          to: "360 18 18",
-          dur: "0.9s",
-          repeatCount: "indefinite"
-        })), /*#__PURE__*/React__default["default"].createElement("circle", {
-          fill: color,
-          cx: "36",
-          cy: "18",
-          r: "1"
-        }, /*#__PURE__*/React__default["default"].createElement("animateTransform", {
-          attributeName: "transform",
-          type: "rotate",
-          from: "0 18 18",
-          to: "360 18 18",
-          dur: "0.9s",
-          repeatCount: "indefinite"
-        })))))
-      );
+    var LoadingIcon = function LoadingIcon(props) {
+      return /*#__PURE__*/React__default["default"].createElement("svg", Object.assign({
+        viewBox: "0 0 24px 24px",
+        width: "24px",
+        height: "24px",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        preserveAspectRatio: "xMidYMid"
+      }, props), /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("circle", {
+        cx: "3.5",
+        cy: "12",
+        fill: "#C0C8D1",
+        "transform-origin": "3.5 3.5"
+      }, /*#__PURE__*/React__default["default"].createElement("animate", {
+        attributeName: "r",
+        values: "3;3;3.5;3",
+        keySplines: "\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      }), /*#__PURE__*/React__default["default"].createElement("animate", {
+        id: "first",
+        attributeName: "fill",
+        values: "#C0C8D1;#C0C8D1;#434D59;#C0C8D1",
+        keySplines: "\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      })), /*#__PURE__*/React__default["default"].createElement("circle", {
+        cx: "12",
+        cy: "12",
+        r: "3",
+        fill: "#C0C8D1",
+        "transform-origin": "12 3.5"
+      }, /*#__PURE__*/React__default["default"].createElement("animate", {
+        attributeName: "r",
+        begin: "0.2s; first.begin",
+        values: "3;3;3.5;3",
+        keySplines: "\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      }), /*#__PURE__*/React__default["default"].createElement("animate", {
+        id: "second",
+        attributeName: "fill",
+        begin: "0.2s; first.begin",
+        values: "#C0C8D1;#C0C8D1;#434D59;#C0C8D1",
+        keySplines: "\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      })), /*#__PURE__*/React__default["default"].createElement("circle", {
+        cx: "20.5",
+        cy: "12",
+        r: "3",
+        fill: "#C0C8D1",
+        "transform-origin": "20.5 3.5"
+      }, /*#__PURE__*/React__default["default"].createElement("animate", {
+        attributeName: "r",
+        begin: "0.3s; first.begin",
+        values: "3;3;3.5;3",
+        keySplines: "\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;\n                0.1 0.8 0.2 1;",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      }), /*#__PURE__*/React__default["default"].createElement("animate", {
+        id: "third",
+        attributeName: "fill",
+        begin: "0.3s; first.begin",
+        values: "#C0C8D1;#C0C8D1;#434D59;#C0C8D1",
+        keySplines: "\n                .24 .1 .35 .8;\n                .24 .1 .35 .8;\n                0.1 0.8 0.2 1",
+        keyTimes: "0; 0.25;0.4; 1",
+        calcMode: "spline",
+        dur: "0.8s",
+        repeatCount: "indefinite"
+      }))));
     };
 
     /* eslint-disable react/no-array-index-key */
@@ -8646,7 +8654,6 @@
       if (icon === "loading") {
         return /*#__PURE__*/React__default["default"].createElement(LoadingIcon, Object.assign({
           color: Theme.colors[fillColor] ? Theme.colors[fillColor] : fillColor,
-          size: space[size] || size,
           className: className
         }, props));
       }
@@ -8765,38 +8772,74 @@
       disabled: false
     };
 
-    var Heading1 = Text.withComponent("h1");
-    Heading1.defaultProps = {
-      fontSize: "heading1",
-      lineHeight: "heading1",
-      fontWeight: "light",
-      mt: 0,
-      mb: "x6"
-    };
-    var Heading2 = Text.withComponent("h2");
-    Heading2.defaultProps = {
-      fontSize: "heading2",
-      lineHeight: "heading2",
-      fontWeight: "normal",
-      mt: 0,
-      mb: "x2"
-    };
-    var Heading3 = Text.withComponent("h3");
-    Heading3.defaultProps = {
-      fontSize: "heading3",
-      lineHeight: "heading3",
-      fontWeight: "medium",
-      mt: 0,
-      mb: "x1"
-    };
-    var Heading4 = Text.withComponent("h4");
-    Heading4.defaultProps = {
-      fontSize: "heading4",
-      lineHeight: "heading4",
-      fontWeight: "bold",
-      mt: 0,
-      mb: "x1"
-    };
+    var Heading1 = styled__default["default"](Text).attrs(function (props) {
+      return Object.assign({
+        as: "h1"
+      }, props);
+    }).withConfig({
+      displayName: "Headings__Heading1",
+      componentId: "sc-7kwh7g-0"
+    })(function (_ref) {
+      var theme = _ref.theme;
+      return {
+        fontSize: theme.fontSizes.heading1,
+        lineHeight: theme.lineHeights.heading1,
+        fontWeight: theme.fontWeights.light,
+        marginTop: 0,
+        marginBottom: theme.space.x6
+      };
+    }, addStyledProps);
+    var Heading2 = styled__default["default"](Text).attrs(function (props) {
+      return Object.assign({
+        as: "h2"
+      }, props);
+    }).withConfig({
+      displayName: "Headings__Heading2",
+      componentId: "sc-7kwh7g-1"
+    })(function (_ref2) {
+      var theme = _ref2.theme;
+      return {
+        fontSize: theme.fontSizes.heading2,
+        lineHeight: theme.lineHeights.heading2,
+        fontWeight: theme.fontWeights.normal,
+        marginTop: 0,
+        marginBottom: theme.space.x2
+      };
+    }, addStyledProps);
+    var Heading3 = styled__default["default"](Text).attrs(function (props) {
+      return Object.assign({
+        as: "h3"
+      }, props);
+    }).withConfig({
+      displayName: "Headings__Heading3",
+      componentId: "sc-7kwh7g-2"
+    })(function (_ref3) {
+      var theme = _ref3.theme;
+      return {
+        fontSize: theme.fontSizes.heading3,
+        lineHeight: theme.lineHeights.heading3,
+        fontWeight: theme.fontWeights.medium,
+        marginTop: 0,
+        marginBottom: theme.space.x1
+      };
+    }, addStyledProps);
+    var Heading4 = styled__default["default"](Text).attrs(function (props) {
+      return Object.assign({
+        as: "h4"
+      }, props);
+    }).withConfig({
+      displayName: "Headings__Heading4",
+      componentId: "sc-7kwh7g-3"
+    })(function (_ref4) {
+      var theme = _ref4.theme;
+      return {
+        fontSize: theme.fontSizes.heading4,
+        lineHeight: theme.lineHeights.heading4,
+        fontWeight: theme.fontWeights.bold,
+        marginTop: 0,
+        marginBottom: theme.space.x1
+      };
+    }, addStyledProps);
 
     var defaultOptions = {
       bindI18n: 'languageChanged',
@@ -17633,6 +17676,14 @@
       return parseInt(val1.replace("px", ""), 10) - parseInt(val2Str.replace("px", ""), 10) + "px";
     };
 
+    var prefix = "random-id-";
+    var randomId = 0;
+
+    var generateId = function generateId() {
+      randomId += 1;
+      return prefix + randomId;
+    };
+
     var WindowDimensions = /*#__PURE__*/function (_React$Component) {
       _inheritsLoose__default["default"](WindowDimensions, _React$Component);
 
@@ -50031,7 +50082,7 @@
       quiet: "quiet"
     };
 
-    var StatusIndicatorColours = function StatusIndicatorColours(theme) {
+    var statusIndicatorStyles = function statusIndicatorStyles(theme) {
       var _ref;
 
       return _ref = {}, _ref[StatusIndicatorValues.neutral] = {
@@ -50043,7 +50094,8 @@
         backgroundColor: theme.colors.blackBlue,
         color: theme.colors.white
       }, _ref[StatusIndicatorValues.quiet] = {
-        borderColor: theme.colors.white,
+        border: "1px solid",
+        borderColor: theme.colors.grey,
         backgroundColor: theme.colors.white,
         color: theme.colors.darkGrey
       }, _ref[StatusIndicatorValues.danger] = {
@@ -50065,10 +50117,6 @@
       }, _ref;
     };
 
-    var getStatusIndicatorColours = function getStatusIndicatorColours(type, theme) {
-      return StatusIndicatorColours(theme)[type];
-    };
-
     var StatusIndicator = styled__default["default"].span.withConfig({
       displayName: "StatusIndicator",
       componentId: "sc-17eyafq-0"
@@ -50081,7 +50129,7 @@
         textTransform: "uppercase",
         letterSpacing: ".05em",
         borderRadius: theme.space.x1
-      }, getStatusIndicatorColours(type, theme));
+      }, statusIndicatorStyles(theme)[type]);
     });
     StatusIndicator.defaultProps = {
       type: StatusIndicatorValues.neutral,