@wireapp/react-ui-kit 8.14.1 → 8.14.4

package/src/Misc/Loading.js

@@ -1,64 +1,72 @@
 "use strict";
-/*
- * Wire
- * Copyright (C) 2018 Wire Swiss GmbH
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see http://www.gnu.org/licenses/.
- *
- */
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.Loading = void 0;
-/** @jsx jsx */
-const react_1 = require("@emotion/react");
-const Identity_1 = require("../Identity");
-const motions_1 = require("../Identity/motions");
-const Loading = (_a) => {
-    var { progress = undefined, size = 43, color = '#218fd1' } = _a, props = __rest(_a, ["progress", "size", "color"]);
-    const pathLength = 125.68;
-    const rotationOffset = -0.75;
-    const rotationDelay = motions_1.DURATION.EXTRA_LONG * rotationOffset;
-    const fillAnimation = (0, react_1.keyframes) `
-    0% {
-      stroke-dashoffset: ${pathLength + pathLength};
-    }
-    100% {
-      stroke-dashoffset: 0;
-    }
-  `;
-    return ((0, react_1.jsx)("svg", Object.assign({ width: size, height: size, viewBox: "0 0 43 43", strokeWidth: "3", fill: "none" }, props),
-        (0, react_1.jsx)("circle", { cx: "21.5", cy: "21.5", r: "20", stroke: Identity_1.COLOR.opaque(color, 0.08) }),
-        (0, react_1.jsx)("circle", { css: !progress && {
-                animation: `${fillAnimation} ${motions_1.DURATION.EXTRA_LONG}ms ease-in-out infinite,
-              ${motions_1.ANIMATION.rotate} ${motions_1.DURATION.EXTRA_LONG}ms linear ${rotationDelay}ms infinite`,
-                strokeDasharray: pathLength,
-                transformOrigin: '50% 50%',
-            }, cx: "21.5", cy: "21.5", r: "20", stroke: color, strokeLinecap: "round", strokeDasharray: pathLength, strokeDashoffset: progress && `${pathLength - pathLength * progress}` })));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _Identity = require("../Identity");
+
+var _motions = require("../Identity/motions");
+
+var _templateObject;
+
+var _excluded = ["progress", "size", "color"];
+
+var Loading = function Loading(_ref) {
+  var _ref$progress = _ref.progress,
+      progress = _ref$progress === void 0 ? undefined : _ref$progress,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 43 : _ref$size,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? '#218fd1' : _ref$color,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var pathLength = 125.68;
+  var rotationOffset = -0.75;
+  var rotationDelay = _motions.DURATION.EXTRA_LONG * rotationOffset;
+  var fillAnimation = (0, _react.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    0% {\n      stroke-dashoffset: ", ";\n    }\n    100% {\n      stroke-dashoffset: 0;\n    }\n  "])), pathLength + pathLength);
+  return (0, _react.jsx)("svg", (0, _extends2["default"])({
+    width: size,
+    height: size,
+    viewBox: "0 0 43 43",
+    strokeWidth: "3",
+    fill: "none"
+  }, props), (0, _react.jsx)("circle", {
+    cx: "21.5",
+    cy: "21.5",
+    r: "20",
+    stroke: _Identity.COLOR.opaque(color, 0.08)
+  }), (0, _react.jsx)("circle", {
+    css: !progress && {
+      animation: "".concat(fillAnimation, " ").concat(_motions.DURATION.EXTRA_LONG, "ms ease-in-out infinite,\n              ").concat(_motions.ANIMATION.rotate, " ").concat(_motions.DURATION.EXTRA_LONG, "ms linear ").concat(rotationDelay, "ms infinite"),
+      strokeDasharray: pathLength,
+      transformOrigin: '50% 50%'
+    },
+    cx: "21.5",
+    cy: "21.5",
+    r: "20",
+    stroke: color,
+    strokeLinecap: "round",
+    strokeDasharray: pathLength,
+    strokeDashoffset: progress && "".concat(pathLength - pathLength * progress)
+  }));
 };
+
 exports.Loading = Loading;
-exports.Loading.defaultProps = {
-    progress: undefined,
-    size: 43,
+Loading.defaultProps = {
+  progress: undefined,
+  size: 43
 };
 //# sourceMappingURL=Loading.js.map

package/src/Misc/Loading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loading.js","sourceRoot":"","sources":["Loading.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;AAEH,eAAe;AACf,0CAA8C;AAG9C,0CAAkC;AAClC,iDAAwD;AAQjD,MAAM,OAAO,GAAG,CAAC,EAA4E,EAAE,EAAE;QAAhF,EAAC,QAAQ,GAAG,SAAS,EAAE,IAAI,GAAG,EAAE,EAAE,KAAK,GAAG,SAAS,OAAyB,EAApB,KAAK,cAA7D,6BAA8D,CAAD;IACnF,MAAM,UAAU,GAAG,MAAM,CAAC;IAC1B,MAAM,cAAc,GAAG,CAAC,IAAI,CAAC;IAC7B,MAAM,aAAa,GAAG,kBAAQ,CAAC,UAAU,GAAG,cAAc,CAAC;IAC3D,MAAM,aAAa,GAAG,IAAA,iBAAS,EAAA;;2BAEN,UAAU,GAAG,UAAU;;;;;GAK/C,CAAC;IAEF,OAAO,CACL,wCAAK,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAC,WAAW,EAAC,WAAW,EAAC,GAAG,EAAC,IAAI,EAAC,MAAM,IAAK,KAAK;QACvF,6BAAQ,EAAE,EAAC,MAAM,EAAC,EAAE,EAAC,MAAM,EAAC,CAAC,EAAC,IAAI,EAAC,MAAM,EAAE,gBAAK,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAI;QACxE,6BACE,GAAG,EACD,CAAC,QAAQ,IAAI;gBACX,SAAS,EAAE,GAAG,aAAa,IAAI,kBAAQ,CAAC,UAAU;gBAC9C,mBAAS,CAAC,MAAM,IAAI,kBAAQ,CAAC,UAAU,aAAa,aAAa,aAAa;gBAClF,eAAe,EAAE,UAAU;gBAC3B,eAAe,EAAE,SAAS;aAC3B,EAEH,EAAE,EAAC,MAAM,EACT,EAAE,EAAC,MAAM,EACT,CAAC,EAAC,IAAI,EACN,MAAM,EAAE,KAAK,EACb,aAAa,EAAC,OAAO,EACrB,eAAe,EAAE,UAAU,EAC3B,gBAAgB,EAAE,QAAQ,IAAI,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,EAAE,GACrE,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAnCW,QAAA,OAAO,WAmClB;AAEF,eAAO,CAAC,YAAY,GAAG;IACrB,QAAQ,EAAE,SAAS;IACnB,IAAI,EAAE,EAAE;CACT,CAAC"}
+{"version":3,"sources":["Loading.tsx"],"names":["Loading","progress","undefined","size","color","props","pathLength","rotationOffset","rotationDelay","DURATION","EXTRA_LONG","fillAnimation","keyframes","COLOR","opaque","animation","ANIMATION","rotate","strokeDasharray","transformOrigin","defaultProps"],"mappings":";;;;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;;;;;AAQO,IAAMA,OAAO,GAAG,SAAVA,OAAU,OAAkF;AAAA,2BAAhFC,QAAgF;AAAA,MAAhFA,QAAgF,8BAArEC,SAAqE;AAAA,uBAA1DC,IAA0D;AAAA,MAA1DA,IAA0D,0BAAnD,EAAmD;AAAA,wBAA/CC,KAA+C;AAAA,MAA/CA,KAA+C,2BAAvC,SAAuC;AAAA,MAAzBC,KAAyB;AACvG,MAAMC,UAAU,GAAG,MAAnB;AACA,MAAMC,cAAc,GAAG,CAAC,IAAxB;AACA,MAAMC,aAAa,GAAGC,kBAASC,UAAT,GAAsBH,cAA5C;AACA,MAAMI,aAAa,OAAGC,gBAAH,6LAEMN,UAAU,GAAGA,UAFnB,CAAnB;AASA,SACE;AAAK,IAAA,KAAK,EAAEH,IAAZ;AAAkB,IAAA,MAAM,EAAEA,IAA1B;AAAgC,IAAA,OAAO,EAAC,WAAxC;AAAoD,IAAA,WAAW,EAAC,GAAhE;AAAoE,IAAA,IAAI,EAAC;AAAzE,KAAoFE,KAApF,GACE;AAAQ,IAAA,EAAE,EAAC,MAAX;AAAkB,IAAA,EAAE,EAAC,MAArB;AAA4B,IAAA,CAAC,EAAC,IAA9B;AAAmC,IAAA,MAAM,EAAEQ,gBAAMC,MAAN,CAAaV,KAAb,EAAoB,IAApB;AAA3C,IADF,EAEE;AACE,IAAA,GAAG,EACD,CAACH,QAAD,IAAa;AACXc,MAAAA,SAAS,YAAKJ,aAAL,cAAsBF,kBAASC,UAA/B,qDACLM,mBAAUC,MADL,cACeR,kBAASC,UADxB,uBAC+CF,aAD/C,gBADE;AAGXU,MAAAA,eAAe,EAAEZ,UAHN;AAIXa,MAAAA,eAAe,EAAE;AAJN,KAFjB;AASE,IAAA,EAAE,EAAC,MATL;AAUE,IAAA,EAAE,EAAC,MAVL;AAWE,IAAA,CAAC,EAAC,IAXJ;AAYE,IAAA,MAAM,EAAEf,KAZV;AAaE,IAAA,aAAa,EAAC,OAbhB;AAcE,IAAA,eAAe,EAAEE,UAdnB;AAeE,IAAA,gBAAgB,EAAEL,QAAQ,cAAOK,UAAU,GAAGA,UAAU,GAAGL,QAAjC;AAf5B,IAFF,CADF;AAsBD,CAnCM;;;AAqCPD,OAAO,CAACoB,YAAR,GAAuB;AACrBnB,EAAAA,QAAQ,EAAEC,SADW;AAErBC,EAAAA,IAAI,EAAE;AAFe,CAAvB","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx, keyframes} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity';\nimport {ANIMATION, DURATION} from '../Identity/motions';\n\nexport interface LoadingProps<T = SVGSVGElement> extends React.SVGProps<T> {\n  color?: string;\n  progress?: number;\n  size?: number;\n}\n\nexport const Loading = ({progress = undefined, size = 43, color = '#218fd1', ...props}: LoadingProps) => {\n  const pathLength = 125.68;\n  const rotationOffset = -0.75;\n  const rotationDelay = DURATION.EXTRA_LONG * rotationOffset;\n  const fillAnimation = keyframes`\n    0% {\n      stroke-dashoffset: ${pathLength + pathLength};\n    }\n    100% {\n      stroke-dashoffset: 0;\n    }\n  `;\n\n  return (\n    <svg width={size} height={size} viewBox=\"0 0 43 43\" strokeWidth=\"3\" fill=\"none\" {...props}>\n      <circle cx=\"21.5\" cy=\"21.5\" r=\"20\" stroke={COLOR.opaque(color, 0.08)} />\n      <circle\n        css={\n          !progress && {\n            animation: `${fillAnimation} ${DURATION.EXTRA_LONG}ms ease-in-out infinite,\n              ${ANIMATION.rotate} ${DURATION.EXTRA_LONG}ms linear ${rotationDelay}ms infinite`,\n            strokeDasharray: pathLength,\n            transformOrigin: '50% 50%',\n          }\n        }\n        cx=\"21.5\"\n        cy=\"21.5\"\n        r=\"20\"\n        stroke={color}\n        strokeLinecap=\"round\"\n        strokeDasharray={pathLength}\n        strokeDashoffset={progress && `${pathLength - pathLength * progress}`}\n      />\n    </svg>\n  );\n};\n\nLoading.defaultProps = {\n  progress: undefined,\n  size: 43,\n};\n"],"file":"Loading.js"}

package/src/Misc/Pagination.js

@@ -1,70 +1,155 @@
 "use strict";
-/*
- * Wire
- * Copyright (C) 2018 Wire Swiss GmbH
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see http://www.gnu.org/licenses/.
- *
- */
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.Pagination = void 0;
-/** @jsx jsx */
-const react_1 = require("@emotion/react");
-const Identity_1 = require("../Identity");
-const Layout_1 = require("../Layout");
-const Text_1 = require("../Text");
-const Pagination = (_a) => {
-    var { currentPage = 0, numberOfPages = 1, goPage, previousPageComponent: PreviousPageComponent = () => '<', nextPageComponent: NextPageComponent = () => '>' } = _a, props = __rest(_a, ["currentPage", "numberOfPages", "goPage", "previousPageComponent", "nextPageComponent"]);
-    const isLastPage = currentPage === numberOfPages - 1;
-    const isFirstPage = currentPage === 0;
-    const renderPageList = () => {
-        const lastPageIndex = numberOfPages - 1;
-        const spanLength = 1;
-        const endLength = 1;
-        const skipLength = 1;
-        const normalizeCount = endLength + skipLength + spanLength;
-        const dots = (key) => ((0, react_1.jsx)(Text_1.Bold, { key: key, fontSize: '11px' }, '…'));
-        const renderPageNumber = pageIndex => currentPage === pageIndex ? ((0, react_1.jsx)(Text_1.Bold, { fontSize: '11px', key: pageIndex, style: { color: Identity_1.COLOR.BLUE, margin: '0 8px' }, "data-uie-name": "status-active-page" }, pageIndex + 1)) : ((0, react_1.jsx)(Text_1.Link, { key: pageIndex, style: { margin: '0 8px' }, onClick: () => goPage(pageIndex), "data-uie-name": "go-page" }, pageIndex + 1));
-        const normalizedCurrent = Math.min(Math.max(currentPage, normalizeCount), lastPageIndex - normalizeCount);
-        const beforeCount = normalizedCurrent - spanLength - endLength;
-        const afterCount = lastPageIndex - endLength - normalizedCurrent - spanLength;
-        const pages = Array.from(Array(numberOfPages), (nothing, index) => renderPageNumber(index));
-        if (afterCount > skipLength) {
-            pages.splice(normalizedCurrent + spanLength + 1, afterCount, dots('dots-end'));
-        }
-        if (beforeCount > skipLength) {
-            pages.splice(endLength, beforeCount, dots('dots-start'));
-        }
-        return pages;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _Identity = require("../Identity");
+
+var _Layout = require("../Layout");
+
+var _Text = require("../Text");
+
+var _excluded = ["currentPage", "numberOfPages", "goPage", "previousPageComponent", "nextPageComponent"];
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "1uohtp9",
+  styles: "flex-basis:100px"
+} : {
+  name: "6wexnb-Pagination",
+  styles: "flex-basis:100px;label:Pagination;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlBhZ2luYXRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBGVyIsImZpbGUiOiJQYWdpbmF0aW9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBXaXJlXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTggV2lyZSBTd2lzcyBHbWJIXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGZyZWUgc29mdHdhcmU6IHlvdSBjYW4gcmVkaXN0cmlidXRlIGl0IGFuZC9vciBtb2RpZnlcbiAqIGl0IHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgYXMgcHVibGlzaGVkIGJ5XG4gKiB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uLCBlaXRoZXIgdmVyc2lvbiAzIG9mIHRoZSBMaWNlbnNlLCBvclxuICogKGF0IHlvdXIgb3B0aW9uKSBhbnkgbGF0ZXIgdmVyc2lvbi5cbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCxcbiAqIGJ1dCBXSVRIT1VUIEFOWSBXQVJSQU5UWTsgd2l0aG91dCBldmVuIHRoZSBpbXBsaWVkIHdhcnJhbnR5IG9mXG4gKiBNRVJDSEFOVEFCSUxJVFkgb3IgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UuIFNlZSB0aGVcbiAqIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGZvciBtb3JlIGRldGFpbHMuXG4gKlxuICogWW91IHNob3VsZCBoYXZlIHJlY2VpdmVkIGEgY29weSBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2VcbiAqIGFsb25nIHdpdGggdGhpcyBwcm9ncmFtLiBJZiBub3QsIHNlZSBodHRwOi8vd3d3LmdudS5vcmcvbGljZW5zZXMvLlxuICpcbiAqL1xuXG4vKiogQGpzeCBqc3ggKi9cbmltcG9ydCB7anN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQge0NPTE9SfSBmcm9tICcuLi9JZGVudGl0eSc7XG5pbXBvcnQge0ZsZXhCb3h9IGZyb20gJy4uL0xheW91dCc7XG5pbXBvcnQge0JvbGQsIExpbmt9IGZyb20gJy4uL1RleHQnO1xuXG5pbnRlcmZhY2UgUGFnaW5hdGlvblByb3BzPFQgPSBIVE1MRGl2RWxlbWVudD4gZXh0ZW5kcyBSZWFjdC5Qcm9wc1dpdGhSZWY8UmVhY3QuSFRNTFByb3BzPFQ+PiB7XG4gIGN1cnJlbnRQYWdlPzogbnVtYmVyO1xuICBnb1BhZ2U/OiAocGFnZTogbnVtYmVyKSA9PiB2b2lkO1xuICBuZXh0UGFnZUNvbXBvbmVudD86IGFueTtcbiAgbnVtYmVyT2ZQYWdlcz86IG51bWJlcjtcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50PzogYW55O1xufVxuXG5leHBvcnQgY29uc3QgUGFnaW5hdGlvbjogUmVhY3QuRkM8UGFnaW5hdGlvblByb3BzPiA9ICh7XG4gIGN1cnJlbnRQYWdlID0gMCxcbiAgbnVtYmVyT2ZQYWdlcyA9IDEsXG4gIGdvUGFnZSxcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50OiBQcmV2aW91c1BhZ2VDb21wb25lbnQgPSAoKSA9PiAnPCcsXG4gIG5leHRQYWdlQ29tcG9uZW50OiBOZXh0UGFnZUNvbXBvbmVudCA9ICgpID0+ICc+JyxcbiAgLi4ucHJvcHNcbn0pID0+IHtcbiAgY29uc3QgaXNMYXN0UGFnZSA9IGN1cnJlbnRQYWdlID09PSBudW1iZXJPZlBhZ2VzIC0gMTtcbiAgY29uc3QgaXNGaXJzdFBhZ2UgPSBjdXJyZW50UGFnZSA9PT0gMDtcblxuICBjb25zdCByZW5kZXJQYWdlTGlzdCA9ICgpID0+IHtcbiAgICBjb25zdCBsYXN0UGFnZUluZGV4ID0gbnVtYmVyT2ZQYWdlcyAtIDE7XG4gICAgY29uc3Qgc3Bhbkxlbmd0aCA9IDE7XG4gICAgY29uc3QgZW5kTGVuZ3RoID0gMTtcbiAgICBjb25zdCBza2lwTGVuZ3RoID0gMTtcbiAgICBjb25zdCBub3JtYWxpemVDb3VudCA9IGVuZExlbmd0aCArIHNraXBMZW5ndGggKyBzcGFuTGVuZ3RoO1xuICAgIGNvbnN0IGRvdHMgPSAoa2V5OiBzdHJpbmcpID0+IChcbiAgICAgIDxCb2xkIGtleT17a2V5fSBmb250U2l6ZT17JzExcHgnfT5cbiAgICAgICAgeyfigKYnfVxuICAgICAgPC9Cb2xkPlxuICAgICk7XG4gICAgY29uc3QgcmVuZGVyUGFnZU51bWJlciA9IHBhZ2VJbmRleCA9PlxuICAgICAgY3VycmVudFBhZ2UgPT09IHBhZ2VJbmRleCA/IChcbiAgICAgICAgPEJvbGRcbiAgICAgICAgICBmb250U2l6ZT17JzExcHgnfVxuICAgICAgICAgIGtleT17cGFnZUluZGV4fVxuICAgICAgICAgIHN0eWxlPXt7Y29sb3I6IENPTE9SLkJMVUUsIG1hcmdpbjogJzAgOHB4J319XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT1cInN0YXR1cy1hY3RpdmUtcGFnZVwiXG4gICAgICAgID5cbiAgICAgICAgICB7cGFnZUluZGV4ICsgMX1cbiAgICAgICAgPC9Cb2xkPlxuICAgICAgKSA6IChcbiAgICAgICAgPExpbmsga2V5PXtwYWdlSW5kZXh9IHN0eWxlPXt7bWFyZ2luOiAnMCA4cHgnfX0gb25DbGljaz17KCkgPT4gZ29QYWdlKHBhZ2VJbmRleCl9IGRhdGEtdWllLW5hbWU9XCJnby1wYWdlXCI+XG4gICAgICAgICAge3BhZ2VJbmRleCArIDF9XG4gICAgICAgIDwvTGluaz5cbiAgICAgICk7XG5cbiAgICBjb25zdCBub3JtYWxpemVkQ3VycmVudCA9IE1hdGgubWluKE1hdGgubWF4KGN1cnJlbnRQYWdlLCBub3JtYWxpemVDb3VudCksIGxhc3RQYWdlSW5kZXggLSBub3JtYWxpemVDb3VudCk7XG4gICAgY29uc3QgYmVmb3JlQ291bnQgPSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGggLSBlbmRMZW5ndGg7XG4gICAgY29uc3QgYWZ0ZXJDb3VudCA9IGxhc3RQYWdlSW5kZXggLSBlbmRMZW5ndGggLSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGg7XG5cbiAgICBjb25zdCBwYWdlcyA9IEFycmF5LmZyb20oQXJyYXkobnVtYmVyT2ZQYWdlcyksIChub3RoaW5nLCBpbmRleCkgPT4gcmVuZGVyUGFnZU51bWJlcihpbmRleCkpO1xuICAgIGlmIChhZnRlckNvdW50ID4gc2tpcExlbmd0aCkge1xuICAgICAgcGFnZXMuc3BsaWNlKG5vcm1hbGl6ZWRDdXJyZW50ICsgc3Bhbkxlbmd0aCArIDEsIGFmdGVyQ291bnQsIGRvdHMoJ2RvdHMtZW5kJykpO1xuICAgIH1cbiAgICBpZiAoYmVmb3JlQ291bnQgPiBza2lwTGVuZ3RoKSB7XG4gICAgICBwYWdlcy5zcGxpY2UoZW5kTGVuZ3RoLCBiZWZvcmVDb3VudCwgZG90cygnZG90cy1zdGFydCcpKTtcbiAgICB9XG5cbiAgICByZXR1cm4gcGFnZXM7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8RmxleEJveCBhbGlnbj1cImZsZXgtZW5kXCIgZGF0YS11aWUtbmFtZT1cImVsZW1lbnQtcGFnaW5hdGlvblwiIHsuLi5wcm9wc30+XG4gICAgICA8ZGl2IGNzcz17e2ZsZXhCYXNpczogMTAwfX0+XG4gICAgICAgIHshaXNGaXJzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSAtIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tcHJldmlvdXMtcGFnZVwiPlxuICAgICAgICAgICAgPFByZXZpb3VzUGFnZUNvbXBvbmVudCAvPlxuICAgICAgICAgIDwvTGluaz5cbiAgICAgICAgKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e3thbGlnbkl0ZW1zOiAnZmxleC1lbmQnLCBkaXNwbGF5OiAnZmxleCcsIGZsZXhEaXJlY3Rpb246ICdyb3cnLCBtYXJnaW46ICcwIGF1dG8nfX1cbiAgICAgICAgZGF0YS11aWUtbmFtZT1cImxpc3QtcGFnZXNcIlxuICAgICAgPlxuICAgICAgICB7cmVuZGVyUGFnZUxpc3QoKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjc3M9e3tkaXNwbGF5OiAnZmxleCcsIGZsZXhCYXNpczogMTAwLCBqdXN0aWZ5Q29udGVudDogJ2ZsZXgtZW5kJ319PlxuICAgICAgICB7IWlzTGFzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSArIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tbmV4dC1wYWdlXCI+XG4gICAgICAgICAgICA8TmV4dFBhZ2VDb21wb25lbnQgLz5cbiAgICAgICAgICA8L0xpbms+XG4gICAgICAgICl9XG4gICAgICA8L2Rpdj5cbiAgICA8L0ZsZXhCb3g+XG4gICk7XG59O1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var _ref3 = process.env.NODE_ENV === "production" ? {
+  name: "jli9tm",
+  styles: "align-items:flex-end;display:flex;flex-direction:row;margin:0 auto"
+} : {
+  name: "93bcni-Pagination",
+  styles: "align-items:flex-end;display:flex;flex-direction:row;margin:0 auto;label:Pagination;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlBhZ2luYXRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtHUSIsImZpbGUiOiJQYWdpbmF0aW9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBXaXJlXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTggV2lyZSBTd2lzcyBHbWJIXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGZyZWUgc29mdHdhcmU6IHlvdSBjYW4gcmVkaXN0cmlidXRlIGl0IGFuZC9vciBtb2RpZnlcbiAqIGl0IHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgYXMgcHVibGlzaGVkIGJ5XG4gKiB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uLCBlaXRoZXIgdmVyc2lvbiAzIG9mIHRoZSBMaWNlbnNlLCBvclxuICogKGF0IHlvdXIgb3B0aW9uKSBhbnkgbGF0ZXIgdmVyc2lvbi5cbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCxcbiAqIGJ1dCBXSVRIT1VUIEFOWSBXQVJSQU5UWTsgd2l0aG91dCBldmVuIHRoZSBpbXBsaWVkIHdhcnJhbnR5IG9mXG4gKiBNRVJDSEFOVEFCSUxJVFkgb3IgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UuIFNlZSB0aGVcbiAqIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGZvciBtb3JlIGRldGFpbHMuXG4gKlxuICogWW91IHNob3VsZCBoYXZlIHJlY2VpdmVkIGEgY29weSBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2VcbiAqIGFsb25nIHdpdGggdGhpcyBwcm9ncmFtLiBJZiBub3QsIHNlZSBodHRwOi8vd3d3LmdudS5vcmcvbGljZW5zZXMvLlxuICpcbiAqL1xuXG4vKiogQGpzeCBqc3ggKi9cbmltcG9ydCB7anN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQge0NPTE9SfSBmcm9tICcuLi9JZGVudGl0eSc7XG5pbXBvcnQge0ZsZXhCb3h9IGZyb20gJy4uL0xheW91dCc7XG5pbXBvcnQge0JvbGQsIExpbmt9IGZyb20gJy4uL1RleHQnO1xuXG5pbnRlcmZhY2UgUGFnaW5hdGlvblByb3BzPFQgPSBIVE1MRGl2RWxlbWVudD4gZXh0ZW5kcyBSZWFjdC5Qcm9wc1dpdGhSZWY8UmVhY3QuSFRNTFByb3BzPFQ+PiB7XG4gIGN1cnJlbnRQYWdlPzogbnVtYmVyO1xuICBnb1BhZ2U/OiAocGFnZTogbnVtYmVyKSA9PiB2b2lkO1xuICBuZXh0UGFnZUNvbXBvbmVudD86IGFueTtcbiAgbnVtYmVyT2ZQYWdlcz86IG51bWJlcjtcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50PzogYW55O1xufVxuXG5leHBvcnQgY29uc3QgUGFnaW5hdGlvbjogUmVhY3QuRkM8UGFnaW5hdGlvblByb3BzPiA9ICh7XG4gIGN1cnJlbnRQYWdlID0gMCxcbiAgbnVtYmVyT2ZQYWdlcyA9IDEsXG4gIGdvUGFnZSxcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50OiBQcmV2aW91c1BhZ2VDb21wb25lbnQgPSAoKSA9PiAnPCcsXG4gIG5leHRQYWdlQ29tcG9uZW50OiBOZXh0UGFnZUNvbXBvbmVudCA9ICgpID0+ICc+JyxcbiAgLi4ucHJvcHNcbn0pID0+IHtcbiAgY29uc3QgaXNMYXN0UGFnZSA9IGN1cnJlbnRQYWdlID09PSBudW1iZXJPZlBhZ2VzIC0gMTtcbiAgY29uc3QgaXNGaXJzdFBhZ2UgPSBjdXJyZW50UGFnZSA9PT0gMDtcblxuICBjb25zdCByZW5kZXJQYWdlTGlzdCA9ICgpID0+IHtcbiAgICBjb25zdCBsYXN0UGFnZUluZGV4ID0gbnVtYmVyT2ZQYWdlcyAtIDE7XG4gICAgY29uc3Qgc3Bhbkxlbmd0aCA9IDE7XG4gICAgY29uc3QgZW5kTGVuZ3RoID0gMTtcbiAgICBjb25zdCBza2lwTGVuZ3RoID0gMTtcbiAgICBjb25zdCBub3JtYWxpemVDb3VudCA9IGVuZExlbmd0aCArIHNraXBMZW5ndGggKyBzcGFuTGVuZ3RoO1xuICAgIGNvbnN0IGRvdHMgPSAoa2V5OiBzdHJpbmcpID0+IChcbiAgICAgIDxCb2xkIGtleT17a2V5fSBmb250U2l6ZT17JzExcHgnfT5cbiAgICAgICAgeyfigKYnfVxuICAgICAgPC9Cb2xkPlxuICAgICk7XG4gICAgY29uc3QgcmVuZGVyUGFnZU51bWJlciA9IHBhZ2VJbmRleCA9PlxuICAgICAgY3VycmVudFBhZ2UgPT09IHBhZ2VJbmRleCA/IChcbiAgICAgICAgPEJvbGRcbiAgICAgICAgICBmb250U2l6ZT17JzExcHgnfVxuICAgICAgICAgIGtleT17cGFnZUluZGV4fVxuICAgICAgICAgIHN0eWxlPXt7Y29sb3I6IENPTE9SLkJMVUUsIG1hcmdpbjogJzAgOHB4J319XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT1cInN0YXR1cy1hY3RpdmUtcGFnZVwiXG4gICAgICAgID5cbiAgICAgICAgICB7cGFnZUluZGV4ICsgMX1cbiAgICAgICAgPC9Cb2xkPlxuICAgICAgKSA6IChcbiAgICAgICAgPExpbmsga2V5PXtwYWdlSW5kZXh9IHN0eWxlPXt7bWFyZ2luOiAnMCA4cHgnfX0gb25DbGljaz17KCkgPT4gZ29QYWdlKHBhZ2VJbmRleCl9IGRhdGEtdWllLW5hbWU9XCJnby1wYWdlXCI+XG4gICAgICAgICAge3BhZ2VJbmRleCArIDF9XG4gICAgICAgIDwvTGluaz5cbiAgICAgICk7XG5cbiAgICBjb25zdCBub3JtYWxpemVkQ3VycmVudCA9IE1hdGgubWluKE1hdGgubWF4KGN1cnJlbnRQYWdlLCBub3JtYWxpemVDb3VudCksIGxhc3RQYWdlSW5kZXggLSBub3JtYWxpemVDb3VudCk7XG4gICAgY29uc3QgYmVmb3JlQ291bnQgPSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGggLSBlbmRMZW5ndGg7XG4gICAgY29uc3QgYWZ0ZXJDb3VudCA9IGxhc3RQYWdlSW5kZXggLSBlbmRMZW5ndGggLSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGg7XG5cbiAgICBjb25zdCBwYWdlcyA9IEFycmF5LmZyb20oQXJyYXkobnVtYmVyT2ZQYWdlcyksIChub3RoaW5nLCBpbmRleCkgPT4gcmVuZGVyUGFnZU51bWJlcihpbmRleCkpO1xuICAgIGlmIChhZnRlckNvdW50ID4gc2tpcExlbmd0aCkge1xuICAgICAgcGFnZXMuc3BsaWNlKG5vcm1hbGl6ZWRDdXJyZW50ICsgc3Bhbkxlbmd0aCArIDEsIGFmdGVyQ291bnQsIGRvdHMoJ2RvdHMtZW5kJykpO1xuICAgIH1cbiAgICBpZiAoYmVmb3JlQ291bnQgPiBza2lwTGVuZ3RoKSB7XG4gICAgICBwYWdlcy5zcGxpY2UoZW5kTGVuZ3RoLCBiZWZvcmVDb3VudCwgZG90cygnZG90cy1zdGFydCcpKTtcbiAgICB9XG5cbiAgICByZXR1cm4gcGFnZXM7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8RmxleEJveCBhbGlnbj1cImZsZXgtZW5kXCIgZGF0YS11aWUtbmFtZT1cImVsZW1lbnQtcGFnaW5hdGlvblwiIHsuLi5wcm9wc30+XG4gICAgICA8ZGl2IGNzcz17e2ZsZXhCYXNpczogMTAwfX0+XG4gICAgICAgIHshaXNGaXJzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSAtIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tcHJldmlvdXMtcGFnZVwiPlxuICAgICAgICAgICAgPFByZXZpb3VzUGFnZUNvbXBvbmVudCAvPlxuICAgICAgICAgIDwvTGluaz5cbiAgICAgICAgKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e3thbGlnbkl0ZW1zOiAnZmxleC1lbmQnLCBkaXNwbGF5OiAnZmxleCcsIGZsZXhEaXJlY3Rpb246ICdyb3cnLCBtYXJnaW46ICcwIGF1dG8nfX1cbiAgICAgICAgZGF0YS11aWUtbmFtZT1cImxpc3QtcGFnZXNcIlxuICAgICAgPlxuICAgICAgICB7cmVuZGVyUGFnZUxpc3QoKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjc3M9e3tkaXNwbGF5OiAnZmxleCcsIGZsZXhCYXNpczogMTAwLCBqdXN0aWZ5Q29udGVudDogJ2ZsZXgtZW5kJ319PlxuICAgICAgICB7IWlzTGFzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSArIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tbmV4dC1wYWdlXCI+XG4gICAgICAgICAgICA8TmV4dFBhZ2VDb21wb25lbnQgLz5cbiAgICAgICAgICA8L0xpbms+XG4gICAgICAgICl9XG4gICAgICA8L2Rpdj5cbiAgICA8L0ZsZXhCb3g+XG4gICk7XG59O1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var _ref4 = process.env.NODE_ENV === "production" ? {
+  name: "ffod5d",
+  styles: "display:flex;flex-basis:100px;justify-content:flex-end"
+} : {
+  name: "338rgm-Pagination",
+  styles: "display:flex;flex-basis:100px;justify-content:flex-end;label:Pagination;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlBhZ2luYXRpb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVHVyIsImZpbGUiOiJQYWdpbmF0aW9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBXaXJlXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTggV2lyZSBTd2lzcyBHbWJIXG4gKlxuICogVGhpcyBwcm9ncmFtIGlzIGZyZWUgc29mdHdhcmU6IHlvdSBjYW4gcmVkaXN0cmlidXRlIGl0IGFuZC9vciBtb2RpZnlcbiAqIGl0IHVuZGVyIHRoZSB0ZXJtcyBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgYXMgcHVibGlzaGVkIGJ5XG4gKiB0aGUgRnJlZSBTb2Z0d2FyZSBGb3VuZGF0aW9uLCBlaXRoZXIgdmVyc2lvbiAzIG9mIHRoZSBMaWNlbnNlLCBvclxuICogKGF0IHlvdXIgb3B0aW9uKSBhbnkgbGF0ZXIgdmVyc2lvbi5cbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZGlzdHJpYnV0ZWQgaW4gdGhlIGhvcGUgdGhhdCBpdCB3aWxsIGJlIHVzZWZ1bCxcbiAqIGJ1dCBXSVRIT1VUIEFOWSBXQVJSQU5UWTsgd2l0aG91dCBldmVuIHRoZSBpbXBsaWVkIHdhcnJhbnR5IG9mXG4gKiBNRVJDSEFOVEFCSUxJVFkgb3IgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UuIFNlZSB0aGVcbiAqIEdOVSBHZW5lcmFsIFB1YmxpYyBMaWNlbnNlIGZvciBtb3JlIGRldGFpbHMuXG4gKlxuICogWW91IHNob3VsZCBoYXZlIHJlY2VpdmVkIGEgY29weSBvZiB0aGUgR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2VcbiAqIGFsb25nIHdpdGggdGhpcyBwcm9ncmFtLiBJZiBub3QsIHNlZSBodHRwOi8vd3d3LmdudS5vcmcvbGljZW5zZXMvLlxuICpcbiAqL1xuXG4vKiogQGpzeCBqc3ggKi9cbmltcG9ydCB7anN4fSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQge0NPTE9SfSBmcm9tICcuLi9JZGVudGl0eSc7XG5pbXBvcnQge0ZsZXhCb3h9IGZyb20gJy4uL0xheW91dCc7XG5pbXBvcnQge0JvbGQsIExpbmt9IGZyb20gJy4uL1RleHQnO1xuXG5pbnRlcmZhY2UgUGFnaW5hdGlvblByb3BzPFQgPSBIVE1MRGl2RWxlbWVudD4gZXh0ZW5kcyBSZWFjdC5Qcm9wc1dpdGhSZWY8UmVhY3QuSFRNTFByb3BzPFQ+PiB7XG4gIGN1cnJlbnRQYWdlPzogbnVtYmVyO1xuICBnb1BhZ2U/OiAocGFnZTogbnVtYmVyKSA9PiB2b2lkO1xuICBuZXh0UGFnZUNvbXBvbmVudD86IGFueTtcbiAgbnVtYmVyT2ZQYWdlcz86IG51bWJlcjtcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50PzogYW55O1xufVxuXG5leHBvcnQgY29uc3QgUGFnaW5hdGlvbjogUmVhY3QuRkM8UGFnaW5hdGlvblByb3BzPiA9ICh7XG4gIGN1cnJlbnRQYWdlID0gMCxcbiAgbnVtYmVyT2ZQYWdlcyA9IDEsXG4gIGdvUGFnZSxcbiAgcHJldmlvdXNQYWdlQ29tcG9uZW50OiBQcmV2aW91c1BhZ2VDb21wb25lbnQgPSAoKSA9PiAnPCcsXG4gIG5leHRQYWdlQ29tcG9uZW50OiBOZXh0UGFnZUNvbXBvbmVudCA9ICgpID0+ICc+JyxcbiAgLi4ucHJvcHNcbn0pID0+IHtcbiAgY29uc3QgaXNMYXN0UGFnZSA9IGN1cnJlbnRQYWdlID09PSBudW1iZXJPZlBhZ2VzIC0gMTtcbiAgY29uc3QgaXNGaXJzdFBhZ2UgPSBjdXJyZW50UGFnZSA9PT0gMDtcblxuICBjb25zdCByZW5kZXJQYWdlTGlzdCA9ICgpID0+IHtcbiAgICBjb25zdCBsYXN0UGFnZUluZGV4ID0gbnVtYmVyT2ZQYWdlcyAtIDE7XG4gICAgY29uc3Qgc3Bhbkxlbmd0aCA9IDE7XG4gICAgY29uc3QgZW5kTGVuZ3RoID0gMTtcbiAgICBjb25zdCBza2lwTGVuZ3RoID0gMTtcbiAgICBjb25zdCBub3JtYWxpemVDb3VudCA9IGVuZExlbmd0aCArIHNraXBMZW5ndGggKyBzcGFuTGVuZ3RoO1xuICAgIGNvbnN0IGRvdHMgPSAoa2V5OiBzdHJpbmcpID0+IChcbiAgICAgIDxCb2xkIGtleT17a2V5fSBmb250U2l6ZT17JzExcHgnfT5cbiAgICAgICAgeyfigKYnfVxuICAgICAgPC9Cb2xkPlxuICAgICk7XG4gICAgY29uc3QgcmVuZGVyUGFnZU51bWJlciA9IHBhZ2VJbmRleCA9PlxuICAgICAgY3VycmVudFBhZ2UgPT09IHBhZ2VJbmRleCA/IChcbiAgICAgICAgPEJvbGRcbiAgICAgICAgICBmb250U2l6ZT17JzExcHgnfVxuICAgICAgICAgIGtleT17cGFnZUluZGV4fVxuICAgICAgICAgIHN0eWxlPXt7Y29sb3I6IENPTE9SLkJMVUUsIG1hcmdpbjogJzAgOHB4J319XG4gICAgICAgICAgZGF0YS11aWUtbmFtZT1cInN0YXR1cy1hY3RpdmUtcGFnZVwiXG4gICAgICAgID5cbiAgICAgICAgICB7cGFnZUluZGV4ICsgMX1cbiAgICAgICAgPC9Cb2xkPlxuICAgICAgKSA6IChcbiAgICAgICAgPExpbmsga2V5PXtwYWdlSW5kZXh9IHN0eWxlPXt7bWFyZ2luOiAnMCA4cHgnfX0gb25DbGljaz17KCkgPT4gZ29QYWdlKHBhZ2VJbmRleCl9IGRhdGEtdWllLW5hbWU9XCJnby1wYWdlXCI+XG4gICAgICAgICAge3BhZ2VJbmRleCArIDF9XG4gICAgICAgIDwvTGluaz5cbiAgICAgICk7XG5cbiAgICBjb25zdCBub3JtYWxpemVkQ3VycmVudCA9IE1hdGgubWluKE1hdGgubWF4KGN1cnJlbnRQYWdlLCBub3JtYWxpemVDb3VudCksIGxhc3RQYWdlSW5kZXggLSBub3JtYWxpemVDb3VudCk7XG4gICAgY29uc3QgYmVmb3JlQ291bnQgPSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGggLSBlbmRMZW5ndGg7XG4gICAgY29uc3QgYWZ0ZXJDb3VudCA9IGxhc3RQYWdlSW5kZXggLSBlbmRMZW5ndGggLSBub3JtYWxpemVkQ3VycmVudCAtIHNwYW5MZW5ndGg7XG5cbiAgICBjb25zdCBwYWdlcyA9IEFycmF5LmZyb20oQXJyYXkobnVtYmVyT2ZQYWdlcyksIChub3RoaW5nLCBpbmRleCkgPT4gcmVuZGVyUGFnZU51bWJlcihpbmRleCkpO1xuICAgIGlmIChhZnRlckNvdW50ID4gc2tpcExlbmd0aCkge1xuICAgICAgcGFnZXMuc3BsaWNlKG5vcm1hbGl6ZWRDdXJyZW50ICsgc3Bhbkxlbmd0aCArIDEsIGFmdGVyQ291bnQsIGRvdHMoJ2RvdHMtZW5kJykpO1xuICAgIH1cbiAgICBpZiAoYmVmb3JlQ291bnQgPiBza2lwTGVuZ3RoKSB7XG4gICAgICBwYWdlcy5zcGxpY2UoZW5kTGVuZ3RoLCBiZWZvcmVDb3VudCwgZG90cygnZG90cy1zdGFydCcpKTtcbiAgICB9XG5cbiAgICByZXR1cm4gcGFnZXM7XG4gIH07XG5cbiAgcmV0dXJuIChcbiAgICA8RmxleEJveCBhbGlnbj1cImZsZXgtZW5kXCIgZGF0YS11aWUtbmFtZT1cImVsZW1lbnQtcGFnaW5hdGlvblwiIHsuLi5wcm9wc30+XG4gICAgICA8ZGl2IGNzcz17e2ZsZXhCYXNpczogMTAwfX0+XG4gICAgICAgIHshaXNGaXJzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSAtIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tcHJldmlvdXMtcGFnZVwiPlxuICAgICAgICAgICAgPFByZXZpb3VzUGFnZUNvbXBvbmVudCAvPlxuICAgICAgICAgIDwvTGluaz5cbiAgICAgICAgKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdlxuICAgICAgICBjc3M9e3thbGlnbkl0ZW1zOiAnZmxleC1lbmQnLCBkaXNwbGF5OiAnZmxleCcsIGZsZXhEaXJlY3Rpb246ICdyb3cnLCBtYXJnaW46ICcwIGF1dG8nfX1cbiAgICAgICAgZGF0YS11aWUtbmFtZT1cImxpc3QtcGFnZXNcIlxuICAgICAgPlxuICAgICAgICB7cmVuZGVyUGFnZUxpc3QoKX1cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjc3M9e3tkaXNwbGF5OiAnZmxleCcsIGZsZXhCYXNpczogMTAwLCBqdXN0aWZ5Q29udGVudDogJ2ZsZXgtZW5kJ319PlxuICAgICAgICB7IWlzTGFzdFBhZ2UgJiYgKFxuICAgICAgICAgIDxMaW5rIGJsb2NrIG9uQ2xpY2s9eygpID0+IGdvUGFnZShjdXJyZW50UGFnZSArIDEpfSBkYXRhLXVpZS1uYW1lPVwiZ28tbmV4dC1wYWdlXCI+XG4gICAgICAgICAgICA8TmV4dFBhZ2VDb21wb25lbnQgLz5cbiAgICAgICAgICA8L0xpbms+XG4gICAgICAgICl9XG4gICAgICA8L2Rpdj5cbiAgICA8L0ZsZXhCb3g+XG4gICk7XG59O1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var Pagination = function Pagination(_ref) {
+  var _ref$currentPage = _ref.currentPage,
+      currentPage = _ref$currentPage === void 0 ? 0 : _ref$currentPage,
+      _ref$numberOfPages = _ref.numberOfPages,
+      numberOfPages = _ref$numberOfPages === void 0 ? 1 : _ref$numberOfPages,
+      goPage = _ref.goPage,
+      _ref$previousPageComp = _ref.previousPageComponent,
+      PreviousPageComponent = _ref$previousPageComp === void 0 ? function () {
+    return '<';
+  } : _ref$previousPageComp,
+      _ref$nextPageComponen = _ref.nextPageComponent,
+      NextPageComponent = _ref$nextPageComponen === void 0 ? function () {
+    return '>';
+  } : _ref$nextPageComponen,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var isLastPage = currentPage === numberOfPages - 1;
+  var isFirstPage = currentPage === 0;
+
+  var renderPageList = function renderPageList() {
+    var lastPageIndex = numberOfPages - 1;
+    var spanLength = 1;
+    var endLength = 1;
+    var skipLength = 1;
+    var normalizeCount = endLength + skipLength + spanLength;
+
+    var dots = function dots(key) {
+      return (0, _react.jsx)(_Text.Bold, {
+        key: key,
+        fontSize: '11px'
+      }, '…');
+    };
+
+    var renderPageNumber = function renderPageNumber(pageIndex) {
+      return currentPage === pageIndex ? (0, _react.jsx)(_Text.Bold, {
+        fontSize: '11px',
+        key: pageIndex,
+        style: {
+          color: _Identity.COLOR.BLUE,
+          margin: '0 8px'
+        },
+        "data-uie-name": "status-active-page"
+      }, pageIndex + 1) : (0, _react.jsx)(_Text.Link, {
+        key: pageIndex,
+        style: {
+          margin: '0 8px'
+        },
+        onClick: function onClick() {
+          return goPage(pageIndex);
+        },
+        "data-uie-name": "go-page"
+      }, pageIndex + 1);
     };
-    return ((0, react_1.jsx)(Layout_1.FlexBox, Object.assign({ align: "flex-end", "data-uie-name": "element-pagination" }, props),
-        (0, react_1.jsx)("div", { css: { flexBasis: 100 } }, !isFirstPage && ((0, react_1.jsx)(Text_1.Link, { block: true, onClick: () => goPage(currentPage - 1), "data-uie-name": "go-previous-page" },
-            (0, react_1.jsx)(PreviousPageComponent, null)))),
-        (0, react_1.jsx)("div", { css: { alignItems: 'flex-end', display: 'flex', flexDirection: 'row', margin: '0 auto' }, "data-uie-name": "list-pages" }, renderPageList()),
-        (0, react_1.jsx)("div", { css: { display: 'flex', flexBasis: 100, justifyContent: 'flex-end' } }, !isLastPage && ((0, react_1.jsx)(Text_1.Link, { block: true, onClick: () => goPage(currentPage + 1), "data-uie-name": "go-next-page" },
-            (0, react_1.jsx)(NextPageComponent, null))))));
+
+    var normalizedCurrent = Math.min(Math.max(currentPage, normalizeCount), lastPageIndex - normalizeCount);
+    var beforeCount = normalizedCurrent - spanLength - endLength;
+    var afterCount = lastPageIndex - endLength - normalizedCurrent - spanLength;
+    var pages = Array.from(Array(numberOfPages), function (nothing, index) {
+      return renderPageNumber(index);
+    });
+
+    if (afterCount > skipLength) {
+      pages.splice(normalizedCurrent + spanLength + 1, afterCount, dots('dots-end'));
+    }
+
+    if (beforeCount > skipLength) {
+      pages.splice(endLength, beforeCount, dots('dots-start'));
+    }
+
+    return pages;
+  };
+
+  return (0, _react.jsx)(_Layout.FlexBox, (0, _extends2["default"])({
+    align: "flex-end",
+    "data-uie-name": "element-pagination"
+  }, props), (0, _react.jsx)("div", {
+    css: _ref2
+  }, !isFirstPage && (0, _react.jsx)(_Text.Link, {
+    block: true,
+    onClick: function onClick() {
+      return goPage(currentPage - 1);
+    },
+    "data-uie-name": "go-previous-page"
+  }, (0, _react.jsx)(PreviousPageComponent, null))), (0, _react.jsx)("div", {
+    css: _ref3,
+    "data-uie-name": "list-pages"
+  }, renderPageList()), (0, _react.jsx)("div", {
+    css: _ref4
+  }, !isLastPage && (0, _react.jsx)(_Text.Link, {
+    block: true,
+    onClick: function onClick() {
+      return goPage(currentPage + 1);
+    },
+    "data-uie-name": "go-next-page"
+  }, (0, _react.jsx)(NextPageComponent, null))));
 };
+
 exports.Pagination = Pagination;
 //# sourceMappingURL=Pagination.js.map

package/src/Misc/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["Pagination.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["Pagination.tsx"],"names":["Pagination","currentPage","numberOfPages","goPage","previousPageComponent","PreviousPageComponent","nextPageComponent","NextPageComponent","props","isLastPage","isFirstPage","renderPageList","lastPageIndex","spanLength","endLength","skipLength","normalizeCount","dots","key","renderPageNumber","pageIndex","color","COLOR","BLUE","margin","normalizedCurrent","Math","min","max","beforeCount","afterCount","pages","Array","from","nothing","index","splice"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,IAAMA,UAAqC,GAAG,SAAxCA,UAAwC,OAO/C;AAAA,8BANJC,WAMI;AAAA,MANJA,WAMI,iCANU,CAMV;AAAA,gCALJC,aAKI;AAAA,MALJA,aAKI,mCALY,CAKZ;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,mCAHJC,qBAGI;AAAA,MAHmBC,qBAGnB,sCAH2C;AAAA,WAAM,GAAN;AAAA,GAG3C;AAAA,mCAFJC,iBAEI;AAAA,MAFeC,iBAEf,sCAFmC;AAAA,WAAM,GAAN;AAAA,GAEnC;AAAA,MADDC,KACC;AACJ,MAAMC,UAAU,GAAGR,WAAW,KAAKC,aAAa,GAAG,CAAnD;AACA,MAAMQ,WAAW,GAAGT,WAAW,KAAK,CAApC;;AAEA,MAAMU,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,QAAMC,aAAa,GAAGV,aAAa,GAAG,CAAtC;AACA,QAAMW,UAAU,GAAG,CAAnB;AACA,QAAMC,SAAS,GAAG,CAAlB;AACA,QAAMC,UAAU,GAAG,CAAnB;AACA,QAAMC,cAAc,GAAGF,SAAS,GAAGC,UAAZ,GAAyBF,UAAhD;;AACA,QAAMI,IAAI,GAAG,SAAPA,IAAO,CAACC,GAAD;AAAA,aACX,gBAAC,UAAD;AAAM,QAAA,GAAG,EAAEA,GAAX;AAAgB,QAAA,QAAQ,EAAE;AAA1B,SACG,GADH,CADW;AAAA,KAAb;;AAKA,QAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAAAC,SAAS;AAAA,aAChCnB,WAAW,KAAKmB,SAAhB,GACE,gBAAC,UAAD;AACE,QAAA,QAAQ,EAAE,MADZ;AAEE,QAAA,GAAG,EAAEA,SAFP;AAGE,QAAA,KAAK,EAAE;AAACC,UAAAA,KAAK,EAAEC,gBAAMC,IAAd;AAAoBC,UAAAA,MAAM,EAAE;AAA5B,SAHT;AAIE,yBAAc;AAJhB,SAMGJ,SAAS,GAAG,CANf,CADF,GAUE,gBAAC,UAAD;AAAM,QAAA,GAAG,EAAEA,SAAX;AAAsB,QAAA,KAAK,EAAE;AAACI,UAAAA,MAAM,EAAE;AAAT,SAA7B;AAAgD,QAAA,OAAO,EAAE;AAAA,iBAAMrB,MAAM,CAACiB,SAAD,CAAZ;AAAA,SAAzD;AAAkF,yBAAc;AAAhG,SACGA,SAAS,GAAG,CADf,CAX8B;AAAA,KAAlC;;AAgBA,QAAMK,iBAAiB,GAAGC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,GAAL,CAAS3B,WAAT,EAAsBe,cAAtB,CAAT,EAAgDJ,aAAa,GAAGI,cAAhE,CAA1B;AACA,QAAMa,WAAW,GAAGJ,iBAAiB,GAAGZ,UAApB,GAAiCC,SAArD;AACA,QAAMgB,UAAU,GAAGlB,aAAa,GAAGE,SAAhB,GAA4BW,iBAA5B,GAAgDZ,UAAnE;AAEA,QAAMkB,KAAK,GAAGC,KAAK,CAACC,IAAN,CAAWD,KAAK,CAAC9B,aAAD,CAAhB,EAAiC,UAACgC,OAAD,EAAUC,KAAV;AAAA,aAAoBhB,gBAAgB,CAACgB,KAAD,CAApC;AAAA,KAAjC,CAAd;;AACA,QAAIL,UAAU,GAAGf,UAAjB,EAA6B;AAC3BgB,MAAAA,KAAK,CAACK,MAAN,CAAaX,iBAAiB,GAAGZ,UAApB,GAAiC,CAA9C,EAAiDiB,UAAjD,EAA6Db,IAAI,CAAC,UAAD,CAAjE;AACD;;AACD,QAAIY,WAAW,GAAGd,UAAlB,EAA8B;AAC5BgB,MAAAA,KAAK,CAACK,MAAN,CAAatB,SAAb,EAAwBe,WAAxB,EAAqCZ,IAAI,CAAC,YAAD,CAAzC;AACD;;AAED,WAAOc,KAAP;AACD,GAxCD;;AA0CA,SACE,gBAAC,eAAD;AAAS,IAAA,KAAK,EAAC,UAAf;AAA0B,qBAAc;AAAxC,KAAiEvB,KAAjE,GACE;AAAK,IAAA,GAAG;AAAR,KACG,CAACE,WAAD,IACC,gBAAC,UAAD;AAAM,IAAA,KAAK,MAAX;AAAY,IAAA,OAAO,EAAE;AAAA,aAAMP,MAAM,CAACF,WAAW,GAAG,CAAf,CAAZ;AAAA,KAArB;AAAoD,qBAAc;AAAlE,KACE,gBAAC,qBAAD,OADF,CAFJ,CADF,EAQE;AACE,IAAA,GAAG,OADL;AAEE,qBAAc;AAFhB,KAIGU,cAAc,EAJjB,CARF,EAcE;AAAK,IAAA,GAAG;AAAR,KACG,CAACF,UAAD,IACC,gBAAC,UAAD;AAAM,IAAA,KAAK,MAAX;AAAY,IAAA,OAAO,EAAE;AAAA,aAAMN,MAAM,CAACF,WAAW,GAAG,CAAf,CAAZ;AAAA,KAArB;AAAoD,qBAAc;AAAlE,KACE,gBAAC,iBAAD,OADF,CAFJ,CAdF,CADF;AAwBD,CA7EM","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity';\nimport {FlexBox} from '../Layout';\nimport {Bold, Link} from '../Text';\n\ninterface PaginationProps<T = HTMLDivElement> extends React.PropsWithRef<React.HTMLProps<T>> {\n  currentPage?: number;\n  goPage?: (page: number) => void;\n  nextPageComponent?: any;\n  numberOfPages?: number;\n  previousPageComponent?: any;\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({\n  currentPage = 0,\n  numberOfPages = 1,\n  goPage,\n  previousPageComponent: PreviousPageComponent = () => '<',\n  nextPageComponent: NextPageComponent = () => '>',\n  ...props\n}) => {\n  const isLastPage = currentPage === numberOfPages - 1;\n  const isFirstPage = currentPage === 0;\n\n  const renderPageList = () => {\n    const lastPageIndex = numberOfPages - 1;\n    const spanLength = 1;\n    const endLength = 1;\n    const skipLength = 1;\n    const normalizeCount = endLength + skipLength + spanLength;\n    const dots = (key: string) => (\n      <Bold key={key} fontSize={'11px'}>\n        {'…'}\n      </Bold>\n    );\n    const renderPageNumber = pageIndex =>\n      currentPage === pageIndex ? (\n        <Bold\n          fontSize={'11px'}\n          key={pageIndex}\n          style={{color: COLOR.BLUE, margin: '0 8px'}}\n          data-uie-name=\"status-active-page\"\n        >\n          {pageIndex + 1}\n        </Bold>\n      ) : (\n        <Link key={pageIndex} style={{margin: '0 8px'}} onClick={() => goPage(pageIndex)} data-uie-name=\"go-page\">\n          {pageIndex + 1}\n        </Link>\n      );\n\n    const normalizedCurrent = Math.min(Math.max(currentPage, normalizeCount), lastPageIndex - normalizeCount);\n    const beforeCount = normalizedCurrent - spanLength - endLength;\n    const afterCount = lastPageIndex - endLength - normalizedCurrent - spanLength;\n\n    const pages = Array.from(Array(numberOfPages), (nothing, index) => renderPageNumber(index));\n    if (afterCount > skipLength) {\n      pages.splice(normalizedCurrent + spanLength + 1, afterCount, dots('dots-end'));\n    }\n    if (beforeCount > skipLength) {\n      pages.splice(endLength, beforeCount, dots('dots-start'));\n    }\n\n    return pages;\n  };\n\n  return (\n    <FlexBox align=\"flex-end\" data-uie-name=\"element-pagination\" {...props}>\n      <div css={{flexBasis: 100}}>\n        {!isFirstPage && (\n          <Link block onClick={() => goPage(currentPage - 1)} data-uie-name=\"go-previous-page\">\n            <PreviousPageComponent />\n          </Link>\n        )}\n      </div>\n      <div\n        css={{alignItems: 'flex-end', display: 'flex', flexDirection: 'row', margin: '0 auto'}}\n        data-uie-name=\"list-pages\"\n      >\n        {renderPageList()}\n      </div>\n      <div css={{display: 'flex', flexBasis: 100, justifyContent: 'flex-end'}}>\n        {!isLastPage && (\n          <Link block onClick={() => goPage(currentPage + 1)} data-uie-name=\"go-next-page\">\n            <NextPageComponent />\n          </Link>\n        )}\n      </div>\n    </FlexBox>\n  );\n};\n"],"file":"Pagination.js"}

package/src/Misc/Pill.js

@@ -1,75 +1,89 @@
 "use strict";
-/*
- * Wire
- * Copyright (C) 2018 Wire Swiss GmbH
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU General Public License for more details.
- *
- * You should have received a copy of the GNU General Public License
- * along with this program. If not, see http://www.gnu.org/licenses/.
- *
- */
-Object.defineProperty(exports, "__esModule", { value: true });
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.Pill = exports.filterPillProps = exports.pillStyle = exports.PILL_TYPE = void 0;
-/** @jsx jsx */
-const react_1 = require("@emotion/react");
-const Identity_1 = require("../Identity");
-const motions_1 = require("../Identity/motions");
-const util_1 = require("../util");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _Identity = require("../Identity");
+
+var _motions = require("../Identity/motions");
+
+var _util = require("../util");
+
+var _templateObject;
+
 var PILL_TYPE;
+exports.PILL_TYPE = PILL_TYPE;
+
 (function (PILL_TYPE) {
-    PILL_TYPE["error"] = "ERROR";
-    PILL_TYPE["success"] = "SUCCESS";
-    PILL_TYPE["warning"] = "WARNING";
-})(PILL_TYPE = exports.PILL_TYPE || (exports.PILL_TYPE = {}));
-const pillStyle = (theme, { active = false, type = null }) => {
-    const backgroundColors = {
-        [PILL_TYPE.error]: Identity_1.COLOR.RED_OPAQUE_32,
-        [PILL_TYPE.success]: Identity_1.COLOR.GREEN_OPAQUE_32,
-        [PILL_TYPE.warning]: Identity_1.COLOR.YELLOW_OPAQUE_32,
-    };
-    const backgroundColor = active ? '#eee' : type ? backgroundColors[type] : 'transparent';
-    const pillAnimation = (0, react_1.keyframes) `
-    0% {
-      background-color: transparent;
-    }
-    100% {
-      background-color: ${backgroundColor};
-    }
-`;
-    return {
-        '&:first-of-type': {
-            marginLeft: 0,
-        },
-        '&:last-of-type': {
-            marginRight: 0,
-        },
-        animation: `${pillAnimation} ${motions_1.DURATION.DEFAULT}ms ${motions_1.EASE.QUART}`,
-        backgroundColor,
-        borderRadius: '160px',
-        color: active ? Identity_1.COLOR.TEXT : theme.general.color,
-        cursor: active ? 'default' : undefined,
-        display: 'inline-block',
-        fontSize: '12px',
-        lineHeight: '16px',
-        margin: type ? '12px 0 0 0' : '0 8px',
-        minHeight: '32px',
-        padding: '8px 24px',
-        textAlign: 'center',
-        textDecoration: 'none',
-    };
+  PILL_TYPE["error"] = "ERROR";
+  PILL_TYPE["success"] = "SUCCESS";
+  PILL_TYPE["warning"] = "WARNING";
+})(PILL_TYPE || (exports.PILL_TYPE = PILL_TYPE = {}));
+
+var pillStyle = function pillStyle(theme, _ref) {
+  var _backgroundColors;
+
+  var _ref$active = _ref.active,
+      active = _ref$active === void 0 ? false : _ref$active,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? null : _ref$type;
+  var backgroundColors = (_backgroundColors = {}, (0, _defineProperty2["default"])(_backgroundColors, PILL_TYPE.error, _Identity.COLOR.RED_OPAQUE_32), (0, _defineProperty2["default"])(_backgroundColors, PILL_TYPE.success, _Identity.COLOR.GREEN_OPAQUE_32), (0, _defineProperty2["default"])(_backgroundColors, PILL_TYPE.warning, _Identity.COLOR.YELLOW_OPAQUE_32), _backgroundColors);
+  var backgroundColor = active ? '#eee' : type ? backgroundColors[type] : 'transparent';
+  var pillAnimation = (0, _react.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    0% {\n      background-color: transparent;\n    }\n    100% {\n      background-color: ", ";\n    }\n"])), backgroundColor);
+  return {
+    '&:first-of-type': {
+      marginLeft: 0
+    },
+    '&:last-of-type': {
+      marginRight: 0
+    },
+    animation: "".concat(pillAnimation, " ").concat(_motions.DURATION.DEFAULT, "ms ").concat(_motions.EASE.QUART),
+    backgroundColor: backgroundColor,
+    borderRadius: '160px',
+    color: active ? _Identity.COLOR.TEXT : theme.general.color,
+    cursor: active ? 'default' : undefined,
+    display: 'inline-block',
+    fontSize: '12px',
+    lineHeight: '16px',
+    margin: type ? '12px 0 0 0' : '0 8px',
+    minHeight: '32px',
+    padding: '8px 24px',
+    textAlign: 'center',
+    textDecoration: 'none'
+  };
 };
+
 exports.pillStyle = pillStyle;
-const filterPillProps = (props) => (0, util_1.filterProps)(props, ['active']);
+
+var filterPillProps = function filterPillProps(props) {
+  return (0, _util.filterProps)(props, ['active']);
+};
+
 exports.filterPillProps = filterPillProps;
-const Pill = (props) => ((0, react_1.jsx)("span", Object.assign({ css: (theme) => (0, exports.pillStyle)(theme, props), "data-uie-name": "element-pill", "data-uie-status": props.type }, (0, exports.filterPillProps)(props))));
+
+var Pill = function Pill(props) {
+  return (0, _react.jsx)("span", (0, _extends2["default"])({
+    css: function css(theme) {
+      return pillStyle(theme, props);
+    },
+    "data-uie-name": "element-pill",
+    "data-uie-status": props.type
+  }, filterPillProps(props)));
+};
+
 exports.Pill = Pill;
 //# sourceMappingURL=Pill.js.map