@hexure/ui 1.8.7 → 1.8.8

package/dist/cjs/index.js

@@ -1961,6 +1961,13 @@ var qe = function (e) {
 ["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "head", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "u", "ul", "var", "video", "wbr", "circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "marker", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "textPath", "tspan"].forEach(function (e) {
   qe[e] = qe(e);
 });
+function We(e) {
+  "production" !== process.env.NODE_ENV && "undefined" != typeof navigator && "ReactNative" === navigator.product && console.warn("`keyframes` cannot be used on ReactNative, only on the web. To do animation in ReactNative please use Animated.");
+  for (var t = arguments.length, n = new Array(t > 1 ? t - 1 : 0), r = 1; r < t; r++) n[r - 1] = arguments[r];
+  var o = Ae.apply(void 0, [e].concat(n)).join(""),
+    s = Te(o);
+  return new ye(s, o);
+}
 "production" !== process.env.NODE_ENV && "undefined" != typeof navigator && "ReactNative" === navigator.product && console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native"), "production" !== process.env.NODE_ENV && "test" !== process.env.NODE_ENV && "undefined" != typeof window && (window["__styled-components-init__"] = window["__styled-components-init__"] || 0, 1 === window["__styled-components-init__"] && console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info."), window["__styled-components-init__"] += 1);
 var styled = qe;
 
@@ -2437,8 +2444,8 @@ const Title = styled.span `
 `;
 const MoreMenu = (_a) => {
     var { maxHeight, menuItems = [] } = _a, accessibleProps = __rest(_a, ["maxHeight", "menuItems"]);
-    return (React.createElement(Wrapper$e, Object.assign({ "$maxHeight": maxHeight }, accessibleProps), menuItems.map((item) => {
-        return (React.createElement(MenuItem, { onClick: item.onClick },
+    return (React.createElement(Wrapper$e, Object.assign({ "$maxHeight": maxHeight }, accessibleProps), menuItems.map((item, i) => {
+        return (React.createElement(MenuItem, { key: i, onClick: item.onClick },
             item.icon ? (React.createElement(Icon, { color: Colors.MEDIUM_GRAY.Hex, path: item.icon, size: '20px' })) : null,
             React.createElement(Title, null, item.label)));
     })));
@@ -3524,6 +3531,40 @@ const Link = (_a) => {
     return (React.createElement(Wrapper$8, Object.assign({ "$small": small, onClick: onClick }, accessibleProps), children));
 };
 
+const dash = We `
+  0% {
+    stroke-dasharray: 1, 160;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    stroke-dasharray: 80, 160;
+    stroke-dashoffset: -32;
+  }
+  100% {
+    stroke-dasharray: 80, 160;
+    stroke-dashoffset: -124;
+  }
+`;
+const Spinner = styled.svg `
+  z-index: 2;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: 0 auto;
+  width: 40px;
+  height: 40px;
+`;
+const Path = styled.path `
+  stroke: #0193d7;
+  stroke-linecap: round;
+  -webkit-animation: ${dash} 1.1s ease-in-out infinite;
+  animation: ${dash} 1.1s ease-in-out infinite;
+`;
+const Loader = () => {
+    return (React.createElement(Spinner, { viewBox: '0 0 16 18' },
+        React.createElement(Path, { d: 'M7.21487 1.2868C7.88431 0.9044 8.73031 0.9044 9.39974 1.2868L9.40283 1.28856L14.4613 4.20761C15.1684 4.598 15.5746 5.33558 15.5746 6.11465V8.99996V11.8853C15.5746 12.6507 15.1632 13.3848 14.4617 13.7721L9.37973 16.7132C8.71029 17.0956 7.86428 17.0956 7.19485 16.7132L7.19088 16.7109L2.11279 13.772C1.40602 13.3816 1 12.6441 1 11.8653V8.98995V6.11465C1 5.31458 1.44381 4.59039 2.10827 4.21051L7.21487 1.2868Z', fill: 'none', strokeWidth: '2' })));
+};
+
 const colorMapping = {
     black: {
         fill_1: '#000000',
@@ -4146,6 +4187,7 @@ exports.FileUpload = FileUpload;
 exports.Heading = Heading;
 exports.Input = Input$1;
 exports.Link = Link;
+exports.Loader = Loader;
 exports.Logo = Logo;
 exports.Modal = Modal;
 exports.MoreMenu = MoreMenu;