@wireapp/react-ui-kit 8.14.0 → 8.14.1

package/src/Misc/ButtonGroup.js

@@ -1,113 +1,83 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ButtonGroup = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = require("@emotion/react");
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _Identity = require("../Identity");
-
-var _excluded = ["children", "icon"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-var buttonGroupStyle = function buttonGroupStyle() {
-  return {
-    display: 'flex',
-    alignItems: 'center'
-  };
+/*
+ * Wire
+ * Copyright (C) 2022 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;
 };
-
-var buttonStyle = function buttonStyle(theme, _ref) {
-  var _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled;
-  return _objectSpread({
-    height: '32px',
-    borderRadius: '12px',
-    padding: '0 12px',
-    background: _Identity.COLOR_V2.WHITE,
-    border: "1px solid ".concat(_Identity.COLOR_V2.GRAY_40),
-    cursor: 'pointer',
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonGroup = void 0;
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const Identity_1 = require("../Identity");
+const buttonGroupStyle = () => ({
     display: 'flex',
     alignItems: 'center',
-    backgroundColor: disabled ? _Identity.COLOR_V2.GRAY_20 : _Identity.COLOR_V2.WHITE,
-    svg: {
-      fill: disabled ? _Identity.COLOR_V2.GRAY_70 : _Identity.COLOR_V2.BLACK
-    },
-    '&:not(:last-child)': {
-      borderTopRightRadius: '0',
-      borderBottomRightRadius: '0'
-    },
-    '&:not(:first-child)': {
-      borderTopLeftRadius: '0',
-      borderBottomLeftRadius: '0'
-    },
-    '&:first-child:last-child': {
-      borderRadius: '0'
-    }
-  }, !disabled && {
+});
+const buttonStyle = (theme, { disabled = false }) => (Object.assign({ height: '32px', borderRadius: '12px', padding: '0 12px', background: Identity_1.COLOR_V2.WHITE, border: `1px solid ${Identity_1.COLOR_V2.GRAY_40}`, cursor: 'pointer', display: 'flex', alignItems: 'center', backgroundColor: disabled ? Identity_1.COLOR_V2.GRAY_20 : Identity_1.COLOR_V2.WHITE, svg: {
+        fill: disabled ? Identity_1.COLOR_V2.GRAY_70 : Identity_1.COLOR_V2.BLACK,
+    }, '&:not(:last-child)': {
+        borderTopRightRadius: '0',
+        borderBottomRightRadius: '0',
+    }, '&:not(:first-child)': {
+        borderTopLeftRadius: '0',
+        borderBottomLeftRadius: '0',
+    }, '&:first-child:last-child': {
+        borderRadius: '0',
+    } }, (!disabled && {
     '&:hover, &:focus': {
-      backgroundColor: _Identity.COLOR_V2.GRAY_20
+        backgroundColor: Identity_1.COLOR_V2.GRAY_20,
     },
     '&:hover': {
-      borderColor: _Identity.COLOR_V2.GRAY_50
+        borderColor: Identity_1.COLOR_V2.GRAY_50,
     },
     '&:focus': {
-      borderColor: _Identity.COLOR_V2.GRAY_60
+        borderColor: Identity_1.COLOR_V2.GRAY_60,
     },
     '&:active': {
-      backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_50,
-      borderColor: _Identity.COLOR_V2.BLUE_LIGHT_300,
-      svg: {
-        fill: _Identity.COLOR_V2.BLUE
-      }
-    }
-  });
-};
-
-var ButtonGroup = function ButtonGroup(_ref2) {
-  var children = _ref2.children;
-  return (0, _react.jsx)("div", {
-    css: function css(theme) {
-      return buttonGroupStyle(theme);
+        backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_50,
+        borderColor: Identity_1.COLOR_V2.BLUE_LIGHT_300,
+        svg: {
+            fill: Identity_1.COLOR_V2.BLUE,
+        },
     },
-    role: "group",
-    "aria-label": "Button Group"
-  }, children);
-};
-
+})));
+const ButtonGroup = ({ children }) => ((0, react_1.jsx)("div", { css: (theme) => buttonGroupStyle(theme), role: "group", "aria-label": "Button Group" }, children));
 exports.ButtonGroup = ButtonGroup;
-
-var Button = function Button(_ref3) {
-  var children = _ref3.children,
-      icon = _ref3.icon,
-      props = (0, _objectWithoutProperties2["default"])(_ref3, _excluded);
-  return (0, _react.jsx)("button", (0, _extends2["default"])({
-    css: function css(theme) {
-      return buttonStyle(theme, props);
-    }
-  }, props), icon, children && (0, _react.jsx)("span", {
-    css: /*#__PURE__*/(0, _react.css)({
-      marginLeft: !!icon && '6px',
-      fontSize: '12px',
-      fontWeight: 'bold',
-      lineHeight: '14px',
-      letterSpacing: '0.25px'
-    }, process.env.NODE_ENV === "production" ? "" : ";label:Button;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbkdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RlUiLCJmaWxlIjoiQnV0dG9uR3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIFdpcmVcbiAqIENvcHlyaWdodCAoQykgMjAyMiBXaXJlIFN3aXNzIEdtYkhcbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZnJlZSBzb2Z0d2FyZTogeW91IGNhbiByZWRpc3RyaWJ1dGUgaXQgYW5kL29yIG1vZGlmeVxuICogaXQgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBhcyBwdWJsaXNoZWQgYnlcbiAqIHRoZSBGcmVlIFNvZnR3YXJlIEZvdW5kYXRpb24sIGVpdGhlciB2ZXJzaW9uIDMgb2YgdGhlIExpY2Vuc2UsIG9yXG4gKiAoYXQgeW91ciBvcHRpb24pIGFueSBsYXRlciB2ZXJzaW9uLlxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBkaXN0cmlidXRlZCBpbiB0aGUgaG9wZSB0aGF0IGl0IHdpbGwgYmUgdXNlZnVsLFxuICogYnV0IFdJVEhPVVQgQU5ZIFdBUlJBTlRZOyB3aXRob3V0IGV2ZW4gdGhlIGltcGxpZWQgd2FycmFudHkgb2ZcbiAqIE1FUkNIQU5UQUJJTElUWSBvciBGSVRORVNTIEZPUiBBIFBBUlRJQ1VMQVIgUFVSUE9TRS4gU2VlIHRoZVxuICogR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgZm9yIG1vcmUgZGV0YWlscy5cbiAqXG4gKiBZb3Ugc2hvdWxkIGhhdmUgcmVjZWl2ZWQgYSBjb3B5IG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZVxuICogYWxvbmcgd2l0aCB0aGlzIHByb2dyYW0uIElmIG5vdCwgc2VlIGh0dHA6Ly93d3cuZ251Lm9yZy9saWNlbnNlcy8uXG4gKlxuICovXG5cbi8qKiBAanN4IGpzeCAqL1xuaW1wb3J0IHtDU1NPYmplY3QsIGpzeH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHtSZWFjdEVsZW1lbnR9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtDT0xPUl9WMn0gZnJvbSAnLi4vSWRlbnRpdHknO1xuaW1wb3J0IHtUaGVtZX0gZnJvbSAnLi4vTGF5b3V0JztcbmltcG9ydCB7SWNvbkJ1dHRvblByb3BzfSBmcm9tICcuL0ljb25CdXR0b24nO1xuXG5jb25zdCBidXR0b25Hcm91cFN0eWxlOiA8VD4odGhlbWU6IFRoZW1lKSA9PiBDU1NPYmplY3QgPSAoKSA9PiAoe1xuICBkaXNwbGF5OiAnZmxleCcsXG4gIGFsaWduSXRlbXM6ICdjZW50ZXInLFxufSk7XG5cbmNvbnN0IGJ1dHRvblN0eWxlOiA8VD4odGhlbWU6IFRoZW1lLCBwcm9wczogSWNvbkJ1dHRvblByb3BzPFQ+KSA9PiBDU1NPYmplY3QgPSAodGhlbWUsIHtkaXNhYmxlZCA9IGZhbHNlfSkgPT4gKHtcbiAgaGVpZ2h0OiAnMzJweCcsXG4gIGJvcmRlclJhZGl1czogJzEycHgnLFxuICBwYWRkaW5nOiAnMCAxMnB4JyxcbiAgYmFja2dyb3VuZDogQ09MT1JfVjIuV0hJVEUsXG4gIGJvcmRlcjogYDFweCBzb2xpZCAke0NPTE9SX1YyLkdSQVlfNDB9YCxcbiAgY3Vyc29yOiAncG9pbnRlcicsXG4gIGRpc3BsYXk6ICdmbGV4JyxcbiAgYWxpZ25JdGVtczogJ2NlbnRlcicsXG4gIGJhY2tncm91bmRDb2xvcjogZGlzYWJsZWQgPyBDT0xPUl9WMi5HUkFZXzIwIDogQ09MT1JfVjIuV0hJVEUsXG4gIHN2Zzoge1xuICAgIGZpbGw6IGRpc2FibGVkID8gQ09MT1JfVjIuR1JBWV83MCA6IENPTE9SX1YyLkJMQUNLLFxuICB9LFxuICAnJjpub3QoOmxhc3QtY2hpbGQpJzoge1xuICAgIGJvcmRlclRvcFJpZ2h0UmFkaXVzOiAnMCcsXG4gICAgYm9yZGVyQm90dG9tUmlnaHRSYWRpdXM6ICcwJyxcbiAgfSxcbiAgJyY6bm90KDpmaXJzdC1jaGlsZCknOiB7XG4gICAgYm9yZGVyVG9wTGVmdFJhZGl1czogJzAnLFxuICAgIGJvcmRlckJvdHRvbUxlZnRSYWRpdXM6ICcwJyxcbiAgfSxcbiAgJyY6Zmlyc3QtY2hpbGQ6bGFzdC1jaGlsZCc6IHtcbiAgICBib3JkZXJSYWRpdXM6ICcwJyxcbiAgfSxcbiAgLi4uKCFkaXNhYmxlZCAmJiB7XG4gICAgJyY6aG92ZXIsICY6Zm9jdXMnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IENPTE9SX1YyLkdSQVlfMjAsXG4gICAgfSxcbiAgICAnJjpob3Zlcic6IHtcbiAgICAgIGJvcmRlckNvbG9yOiBDT0xPUl9WMi5HUkFZXzUwLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMnOiB7XG4gICAgICBib3JkZXJDb2xvcjogQ09MT1JfVjIuR1JBWV82MCxcbiAgICB9LFxuICAgICcmOmFjdGl2ZSc6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogQ09MT1JfVjIuQkxVRV9MSUdIVF81MCxcbiAgICAgIGJvcmRlckNvbG9yOiBDT0xPUl9WMi5CTFVFX0xJR0hUXzMwMCxcbiAgICAgIHN2Zzoge1xuICAgICAgICBmaWxsOiBDT0xPUl9WMi5CTFVFLFxuICAgICAgfSxcbiAgICB9LFxuICB9KSxcbn0pO1xuXG5pbnRlcmZhY2UgR3JvdXBCdXR0b25Qcm9wczxUID0gSFRNTEJ1dHRvbkVsZW1lbnQ+IHtcbiAgY2hpbGRyZW4/OiBSZWFjdEVsZW1lbnQgfCBzdHJpbmc7XG4gIGljb24/OiBSZWFjdEVsZW1lbnQ7XG59XG5cbmNvbnN0IEJ1dHRvbkdyb3VwID0gKHtjaGlsZHJlbn0pID0+IChcbiAgPGRpdiBjc3M9eyh0aGVtZTogVGhlbWUpID0+IGJ1dHRvbkdyb3VwU3R5bGUodGhlbWUpfSByb2xlPVwiZ3JvdXBcIiBhcmlhLWxhYmVsPVwiQnV0dG9uIEdyb3VwXCI+XG4gICAge2NoaWxkcmVufVxuICA8L2Rpdj5cbik7XG5cbmNvbnN0IEJ1dHRvbiA9ICh7Y2hpbGRyZW4sIGljb24sIC4uLnByb3BzfTogR3JvdXBCdXR0b25Qcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxidXR0b24gY3NzPXsodGhlbWU6IFRoZW1lKSA9PiBidXR0b25TdHlsZSh0aGVtZSwgcHJvcHMpfSB7Li4ucHJvcHN9PlxuICAgICAge2ljb259XG4gICAgICB7Y2hpbGRyZW4gJiYgKFxuICAgICAgICA8c3BhblxuICAgICAgICAgIGNzcz17e1xuICAgICAgICAgICAgbWFyZ2luTGVmdDogISFpY29uICYmICc2cHgnLFxuICAgICAgICAgICAgZm9udFNpemU6ICcxMnB4JyxcbiAgICAgICAgICAgIGZvbnRXZWlnaHQ6ICdib2xkJyxcbiAgICAgICAgICAgIGxpbmVIZWlnaHQ6ICcxNHB4JyxcbiAgICAgICAgICAgIGxldHRlclNwYWNpbmc6ICcwLjI1cHgnLFxuICAgICAgICAgIH19XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgICl9XG4gICAgPC9idXR0b24+XG4gICk7XG59O1xuXG5CdXR0b25Hcm91cC5CdXR0b24gPSBCdXR0b247XG5cbmV4cG9ydCB7QnV0dG9uR3JvdXB9O1xuIl19 */")
-  }, children));
+const Button = (_a) => {
+    var { children, icon } = _a, props = __rest(_a, ["children", "icon"]);
+    return ((0, react_1.jsx)("button", Object.assign({ css: (theme) => buttonStyle(theme, props) }, props),
+        icon,
+        children && ((0, react_1.jsx)("span", { css: {
+                marginLeft: !!icon && '6px',
+                fontSize: '12px',
+                fontWeight: 'bold',
+                lineHeight: '14px',
+                letterSpacing: '0.25px',
+            } }, children))));
 };
-
 ButtonGroup.Button = Button;
 //# sourceMappingURL=ButtonGroup.js.map

package/src/Misc/ButtonGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ButtonGroup.tsx"],"names":["buttonGroupStyle","display","alignItems","buttonStyle","theme","disabled","height","borderRadius","padding","background","COLOR_V2","WHITE","border","GRAY_40","cursor","backgroundColor","GRAY_20","svg","fill","GRAY_70","BLACK","borderTopRightRadius","borderBottomRightRadius","borderTopLeftRadius","borderBottomLeftRadius","borderColor","GRAY_50","GRAY_60","BLUE_LIGHT_50","BLUE_LIGHT_300","BLUE","ButtonGroup","children","Button","icon","props","marginLeft","fontSize","fontWeight","lineHeight","letterSpacing"],"mappings":";;;;;;;;;;;AAoBA;;;;;;AAGA;;;;;;;;AAIA,IAAMA,gBAAgD,GAAG,SAAnDA,gBAAmD;AAAA,SAAO;AAC9DC,IAAAA,OAAO,EAAE,MADqD;AAE9DC,IAAAA,UAAU,EAAE;AAFkD,GAAP;AAAA,CAAzD;;AAKA,IAAMC,WAAsE,GAAG,SAAzEA,WAAyE,CAACC,KAAD;AAAA,2BAASC,QAAT;AAAA,MAASA,QAAT,8BAAoB,KAApB;AAAA;AAC7EC,IAAAA,MAAM,EAAE,MADqE;AAE7EC,IAAAA,YAAY,EAAE,MAF+D;AAG7EC,IAAAA,OAAO,EAAE,QAHoE;AAI7EC,IAAAA,UAAU,EAAEC,mBAASC,KAJwD;AAK7EC,IAAAA,MAAM,sBAAeF,mBAASG,OAAxB,CALuE;AAM7EC,IAAAA,MAAM,EAAE,SANqE;AAO7Eb,IAAAA,OAAO,EAAE,MAPoE;AAQ7EC,IAAAA,UAAU,EAAE,QARiE;AAS7Ea,IAAAA,eAAe,EAAEV,QAAQ,GAAGK,mBAASM,OAAZ,GAAsBN,mBAASC,KATqB;AAU7EM,IAAAA,GAAG,EAAE;AACHC,MAAAA,IAAI,EAAEb,QAAQ,GAAGK,mBAASS,OAAZ,GAAsBT,mBAASU;AAD1C,KAVwE;AAa7E,0BAAsB;AACpBC,MAAAA,oBAAoB,EAAE,GADF;AAEpBC,MAAAA,uBAAuB,EAAE;AAFL,KAbuD;AAiB7E,2BAAuB;AACrBC,MAAAA,mBAAmB,EAAE,GADA;AAErBC,MAAAA,sBAAsB,EAAE;AAFH,KAjBsD;AAqB7E,gCAA4B;AAC1BjB,MAAAA,YAAY,EAAE;AADY;AArBiD,KAwBzE,CAACF,QAAD,IAAa;AACf,wBAAoB;AAClBU,MAAAA,eAAe,EAAEL,mBAASM;AADR,KADL;AAIf,eAAW;AACTS,MAAAA,WAAW,EAAEf,mBAASgB;AADb,KAJI;AAOf,eAAW;AACTD,MAAAA,WAAW,EAAEf,mBAASiB;AADb,KAPI;AAUf,gBAAY;AACVZ,MAAAA,eAAe,EAAEL,mBAASkB,aADhB;AAEVH,MAAAA,WAAW,EAAEf,mBAASmB,cAFZ;AAGVZ,MAAAA,GAAG,EAAE;AACHC,QAAAA,IAAI,EAAER,mBAASoB;AADZ;AAHK;AAVG,GAxB4D;AAAA,CAA/E;;AAiDA,IAAMC,WAAW,GAAG,SAAdA,WAAc;AAAA,MAAEC,QAAF,SAAEA,QAAF;AAAA,SAClB;AAAK,IAAA,GAAG,EAAE,aAAC5B,KAAD;AAAA,aAAkBJ,gBAAgB,CAACI,KAAD,CAAlC;AAAA,KAAV;AAAqD,IAAA,IAAI,EAAC,OAA1D;AAAkE,kBAAW;AAA7E,KACG4B,QADH,CADkB;AAAA,CAApB;;;;AAMA,IAAMC,MAAM,GAAG,SAATA,MAAS,QAAkD;AAAA,MAAhDD,QAAgD,SAAhDA,QAAgD;AAAA,MAAtCE,IAAsC,SAAtCA,IAAsC;AAAA,MAA7BC,KAA6B;AAC/D,SACE;AAAQ,IAAA,GAAG,EAAE,aAAC/B,KAAD;AAAA,aAAkBD,WAAW,CAACC,KAAD,EAAQ+B,KAAR,CAA7B;AAAA;AAAb,KAA8DA,KAA9D,GACGD,IADH,EAEGF,QAAQ,IACP;AACE,IAAA,GAAG,+BAAE;AACHI,MAAAA,UAAU,EAAE,CAAC,CAACF,IAAF,IAAU,KADnB;AAEHG,MAAAA,QAAQ,EAAE,MAFP;AAGHC,MAAAA,UAAU,EAAE,MAHT;AAIHC,MAAAA,UAAU,EAAE,MAJT;AAKHC,MAAAA,aAAa,EAAE;AALZ,KAAF;AADL,KASGR,QATH,CAHJ,CADF;AAkBD,CAnBD;;AAqBAD,WAAW,CAACE,MAAZ,GAAqBA,MAArB","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 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 {CSSObject, jsx} from '@emotion/react';\nimport {ReactElement} from 'react';\n\nimport {COLOR_V2} from '../Identity';\nimport {Theme} from '../Layout';\nimport {IconButtonProps} from './IconButton';\n\nconst buttonGroupStyle: <T>(theme: Theme) => CSSObject = () => ({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nconst buttonStyle: <T>(theme: Theme, props: IconButtonProps<T>) => CSSObject = (theme, {disabled = false}) => ({\n  height: '32px',\n  borderRadius: '12px',\n  padding: '0 12px',\n  background: COLOR_V2.WHITE,\n  border: `1px solid ${COLOR_V2.GRAY_40}`,\n  cursor: 'pointer',\n  display: 'flex',\n  alignItems: 'center',\n  backgroundColor: disabled ? COLOR_V2.GRAY_20 : COLOR_V2.WHITE,\n  svg: {\n    fill: disabled ? COLOR_V2.GRAY_70 : COLOR_V2.BLACK,\n  },\n  '&:not(:last-child)': {\n    borderTopRightRadius: '0',\n    borderBottomRightRadius: '0',\n  },\n  '&:not(:first-child)': {\n    borderTopLeftRadius: '0',\n    borderBottomLeftRadius: '0',\n  },\n  '&:first-child:last-child': {\n    borderRadius: '0',\n  },\n  ...(!disabled && {\n    '&:hover, &:focus': {\n      backgroundColor: COLOR_V2.GRAY_20,\n    },\n    '&:hover': {\n      borderColor: COLOR_V2.GRAY_50,\n    },\n    '&:focus': {\n      borderColor: COLOR_V2.GRAY_60,\n    },\n    '&:active': {\n      backgroundColor: COLOR_V2.BLUE_LIGHT_50,\n      borderColor: COLOR_V2.BLUE_LIGHT_300,\n      svg: {\n        fill: COLOR_V2.BLUE,\n      },\n    },\n  }),\n});\n\ninterface GroupButtonProps<T = HTMLButtonElement> {\n  children?: ReactElement | string;\n  icon?: ReactElement;\n}\n\nconst ButtonGroup = ({children}) => (\n  <div css={(theme: Theme) => buttonGroupStyle(theme)} role=\"group\" aria-label=\"Button Group\">\n    {children}\n  </div>\n);\n\nconst Button = ({children, icon, ...props}: GroupButtonProps) => {\n  return (\n    <button css={(theme: Theme) => buttonStyle(theme, props)} {...props}>\n      {icon}\n      {children && (\n        <span\n          css={{\n            marginLeft: !!icon && '6px',\n            fontSize: '12px',\n            fontWeight: 'bold',\n            lineHeight: '14px',\n            letterSpacing: '0.25px',\n          }}\n        >\n          {children}\n        </span>\n      )}\n    </button>\n  );\n};\n\nButtonGroup.Button = Button;\n\nexport {ButtonGroup};\n"],"file":"ButtonGroup.js"}
+{"version":3,"file":"ButtonGroup.js","sourceRoot":"","sources":["ButtonGroup.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;AAEH,eAAe;AACf,0CAA8C;AAG9C,0CAAqC;AAIrC,MAAM,gBAAgB,GAAmC,GAAG,EAAE,CAAC,CAAC;IAC9D,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;CACrB,CAAC,CAAC;AAEH,MAAM,WAAW,GAA8D,CAAC,KAAK,EAAE,EAAC,QAAQ,GAAG,KAAK,EAAC,EAAE,EAAE,CAAC,iBAC5G,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,QAAQ,EACjB,UAAU,EAAE,mBAAQ,CAAC,KAAK,EAC1B,MAAM,EAAE,aAAa,mBAAQ,CAAC,OAAO,EAAE,EACvC,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,QAAQ,EACpB,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC,mBAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAQ,CAAC,KAAK,EAC7D,GAAG,EAAE;QACH,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,mBAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAQ,CAAC,KAAK;KACnD,EACD,oBAAoB,EAAE;QACpB,oBAAoB,EAAE,GAAG;QACzB,uBAAuB,EAAE,GAAG;KAC7B,EACD,qBAAqB,EAAE;QACrB,mBAAmB,EAAE,GAAG;QACxB,sBAAsB,EAAE,GAAG;KAC5B,EACD,0BAA0B,EAAE;QAC1B,YAAY,EAAE,GAAG;KAClB,IACE,CAAC,CAAC,QAAQ,IAAI;IACf,kBAAkB,EAAE;QAClB,eAAe,EAAE,mBAAQ,CAAC,OAAO;KAClC;IACD,SAAS,EAAE;QACT,WAAW,EAAE,mBAAQ,CAAC,OAAO;KAC9B;IACD,SAAS,EAAE;QACT,WAAW,EAAE,mBAAQ,CAAC,OAAO;KAC9B;IACD,UAAU,EAAE;QACV,eAAe,EAAE,mBAAQ,CAAC,aAAa;QACvC,WAAW,EAAE,mBAAQ,CAAC,cAAc;QACpC,GAAG,EAAE;YACH,IAAI,EAAE,mBAAQ,CAAC,IAAI;SACpB;KACF;CACF,CAAC,EACF,CAAC;AAOH,MAAM,WAAW,GAAG,CAAC,EAAC,QAAQ,EAAC,EAAE,EAAE,CAAC,CAClC,0BAAK,GAAG,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,IAAI,EAAC,OAAO,gBAAY,cAAc,IACxF,QAAQ,CACL,CACP,CAAC;AAyBM,kCAAW;AAvBnB,MAAM,MAAM,GAAG,CAAC,EAA4C,EAAE,EAAE;QAAhD,EAAC,QAAQ,EAAE,IAAI,OAA6B,EAAxB,KAAK,cAAzB,oBAA0B,CAAD;IACvC,OAAO,CACL,2CAAQ,GAAG,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,IAAM,KAAK;QAChE,IAAI;QACJ,QAAQ,IAAI,CACX,2BACE,GAAG,EAAE;gBACH,UAAU,EAAE,CAAC,CAAC,IAAI,IAAI,KAAK;gBAC3B,QAAQ,EAAE,MAAM;gBAChB,UAAU,EAAE,MAAM;gBAClB,UAAU,EAAE,MAAM;gBAClB,aAAa,EAAE,QAAQ;aACxB,IAEA,QAAQ,CACJ,CACR,CACM,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,WAAW,CAAC,MAAM,GAAG,MAAM,CAAC"}

package/src/Misc/IconButton.js

@@ -1,123 +1,93 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+/*
+ * Wire
+ * Copyright (C) 2022 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 });
 exports.IconButton = exports.iconButtonStyle = exports.IconButtonVariant = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = require("@emotion/react");
-
-var _motions = require("../Identity/motions");
-
-var _Text = require("../Text");
-
-var _util = require("../util");
-
-var _excluded = ["children"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const motions_1 = require("../Identity/motions");
+const Text_1 = require("../Text");
+const util_1 = require("../util");
 var IconButtonVariant;
-exports.IconButtonVariant = IconButtonVariant;
-
 (function (IconButtonVariant) {
-  IconButtonVariant["PRIMARY"] = "primary";
-  IconButtonVariant["SECONDARY"] = "secondary";
-})(IconButtonVariant || (exports.IconButtonVariant = IconButtonVariant = {}));
-
-var iconButtonStyle = function iconButtonStyle(theme, _ref) {
-  var _ref$variant = _ref.variant,
-      variant = _ref$variant === void 0 ? IconButtonVariant.PRIMARY : _ref$variant,
-      backgroundColor = _ref.backgroundColor,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled;
-  return _objectSpread(_objectSpread({
-    border: 0,
-    borderRadius: '12px',
-    cursor: disabled ? 'default' : 'pointer',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginBottom: '16px',
-    padding: 0,
-    outline: 'none',
-    textDecoration: 'none',
-    touchAction: 'manipulation',
-    transition: _motions.defaultTransition,
-    width: '40px',
-    height: '32px',
-    '&:hover, &:focus': {
-      textDecoration: 'none'
-    }
-  }, variant === IconButtonVariant.PRIMARY && _objectSpread({
-    backgroundColor: disabled ? theme.IconButton.primaryDisabledBgColor : backgroundColor || theme.IconButton.primaryBgColor,
-    border: disabled ? "1px solid ".concat(theme.IconButton.primaryDisabledBorderColor) : "1px solid ".concat(theme.IconButton.primaryBorderColor),
-    svg: {
-      fill: disabled ? theme.Input.placeholderColor : theme.general.color
-    }
-  }, !disabled && {
+    IconButtonVariant["PRIMARY"] = "primary";
+    IconButtonVariant["SECONDARY"] = "secondary";
+})(IconButtonVariant = exports.IconButtonVariant || (exports.IconButtonVariant = {}));
+const iconButtonStyle = (theme, { variant = IconButtonVariant.PRIMARY, backgroundColor, disabled = false }) => (Object.assign(Object.assign({ border: 0, borderRadius: '12px', cursor: disabled ? 'default' : 'pointer', display: 'flex', alignItems: 'center', justifyContent: 'center', marginBottom: '16px', padding: 0, outline: 'none', textDecoration: 'none', touchAction: 'manipulation', transition: motions_1.defaultTransition, width: '40px', height: '32px', '&:hover, &:focus': {
+        textDecoration: 'none',
+    } }, (variant === IconButtonVariant.PRIMARY && Object.assign({ backgroundColor: disabled
+        ? theme.IconButton.primaryDisabledBgColor
+        : backgroundColor || theme.IconButton.primaryBgColor, border: disabled
+        ? `1px solid ${theme.IconButton.primaryDisabledBorderColor}`
+        : `1px solid ${theme.IconButton.primaryBorderColor}`, svg: {
+        fill: disabled ? theme.Input.placeholderColor : theme.general.color,
+    } }, (!disabled && {
     '&:hover, &:focus': {
-      backgroundColor: theme.IconButton.hoverPrimaryBgColor
+        backgroundColor: theme.IconButton.hoverPrimaryBgColor,
     },
     '&:hover': {
-      borderColor: theme.IconButton.primaryHoverBorderColor
+        borderColor: theme.IconButton.primaryHoverBorderColor,
     },
     '&:focus': {
-      borderColor: theme.IconButton.focusBorderColor
+        borderColor: theme.IconButton.focusBorderColor,
     },
     '&:active': {
-      backgroundColor: theme.IconButton.activePrimaryBgColor,
-      borderColor: theme.IconButton.focusBorderColor,
-      svg: {
-        fill: theme.general.primaryColor
-      }
-    }
-  })), variant === IconButtonVariant.SECONDARY && _objectSpread({
-    backgroundColor: 'inherit',
-    svg: {
-      fill: disabled ? theme.Input.placeholderColor : theme.general.color
-    }
-  }, !disabled && {
+        backgroundColor: theme.IconButton.activePrimaryBgColor,
+        borderColor: theme.IconButton.focusBorderColor,
+        svg: {
+            fill: theme.general.primaryColor,
+        },
+    },
+})))), (variant === IconButtonVariant.SECONDARY && Object.assign({ backgroundColor: 'inherit', svg: {
+        fill: disabled ? theme.Input.placeholderColor : theme.general.color,
+    } }, (!disabled && {
     '&:hover, &:focus, &:active': {
-      svg: {
-        fill: theme.general.primaryColor
-      }
+        svg: {
+            fill: theme.general.primaryColor,
+        },
     },
     '&:focus': {
-      border: "1px solid ".concat(theme.IconButton.focusBorderColor)
+        border: `1px solid ${theme.IconButton.focusBorderColor}`,
     },
     '&:active': {
-      border: "1px solid ".concat(theme.IconButton.secondaryActiveBorderColor),
-      backgroundColor: theme.Input.backgroundColor
-    }
-  }));
-};
-
+        border: `1px solid ${theme.IconButton.secondaryActiveBorderColor}`,
+        backgroundColor: theme.Input.backgroundColor,
+    },
+})))));
 exports.iconButtonStyle = iconButtonStyle;
-
-var IconButton = function IconButton(_ref2) {
-  var children = _ref2.children,
-      props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
-  return (0, _react.jsx)("button", (0, _extends2["default"])({
-    css: function css(theme) {
-      return iconButtonStyle(theme, props);
-    }
-  }, filterButtonProps(props)), children);
+const IconButton = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    return ((0, react_1.jsx)("button", Object.assign({ css: (theme) => (0, exports.iconButtonStyle)(theme, props) }, filterButtonProps(props)), children));
 };
-
 exports.IconButton = IconButton;
-
-var filterButtonProps = function filterButtonProps(props) {
-  return (0, _util.filterProps)((0, _Text.filterTextProps)(props), ['backgroundColor']);
+const filterButtonProps = (props) => {
+    return (0, util_1.filterProps)((0, Text_1.filterTextProps)(props), ['backgroundColor']);
 };
 //# sourceMappingURL=IconButton.js.map

package/src/Misc/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["IconButton.tsx"],"names":["IconButtonVariant","iconButtonStyle","theme","variant","PRIMARY","backgroundColor","disabled","border","borderRadius","cursor","display","alignItems","justifyContent","marginBottom","padding","outline","textDecoration","touchAction","transition","defaultTransition","width","height","IconButton","primaryDisabledBgColor","primaryBgColor","primaryDisabledBorderColor","primaryBorderColor","svg","fill","Input","placeholderColor","general","color","hoverPrimaryBgColor","borderColor","primaryHoverBorderColor","focusBorderColor","activePrimaryBgColor","primaryColor","SECONDARY","secondaryActiveBorderColor","children","props","filterButtonProps"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 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 {CSSObject, jsx} from '@emotion/react';\n\nimport {defaultTransition} from '../Identity/motions';\nimport {Theme} from '../Layout';\nimport {TextProps, filterTextProps} from '../Text';\nimport {filterProps} from '../util';\n\nexport enum IconButtonVariant {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n}\n\nexport interface IconButtonProps<T = HTMLButtonElement> extends TextProps<T> {\n  variant?: IconButtonVariant;\n  backgroundColor?: string;\n}\n\nexport const iconButtonStyle: <T>(theme: Theme, props: IconButtonProps<T>) => CSSObject = (\n  theme,\n  {variant = IconButtonVariant.PRIMARY, backgroundColor, disabled = false},\n) => ({\n  border: 0,\n  borderRadius: '12px',\n  cursor: disabled ? 'default' : 'pointer',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  marginBottom: '16px',\n  padding: 0,\n  outline: 'none',\n  textDecoration: 'none',\n  touchAction: 'manipulation',\n  transition: defaultTransition,\n  width: '40px',\n  height: '32px',\n  '&:hover, &:focus': {\n    textDecoration: 'none',\n  },\n  ...(variant === IconButtonVariant.PRIMARY && {\n    backgroundColor: disabled\n      ? theme.IconButton.primaryDisabledBgColor\n      : backgroundColor || theme.IconButton.primaryBgColor,\n    border: disabled\n      ? `1px solid ${theme.IconButton.primaryDisabledBorderColor}`\n      : `1px solid ${theme.IconButton.primaryBorderColor}`,\n    svg: {\n      fill: disabled ? theme.Input.placeholderColor : theme.general.color,\n    },\n    ...(!disabled && {\n      '&:hover, &:focus': {\n        backgroundColor: theme.IconButton.hoverPrimaryBgColor,\n      },\n      '&:hover': {\n        borderColor: theme.IconButton.primaryHoverBorderColor,\n      },\n      '&:focus': {\n        borderColor: theme.IconButton.focusBorderColor,\n      },\n      '&:active': {\n        backgroundColor: theme.IconButton.activePrimaryBgColor,\n        borderColor: theme.IconButton.focusBorderColor,\n        svg: {\n          fill: theme.general.primaryColor,\n        },\n      },\n    }),\n  }),\n  ...(variant === IconButtonVariant.SECONDARY && {\n    backgroundColor: 'inherit',\n    svg: {\n      fill: disabled ? theme.Input.placeholderColor : theme.general.color,\n    },\n    ...(!disabled && {\n      '&:hover, &:focus, &:active': {\n        svg: {\n          fill: theme.general.primaryColor,\n        },\n      },\n      '&:focus': {\n        border: `1px solid ${theme.IconButton.focusBorderColor}`,\n      },\n      '&:active': {\n        border: `1px solid ${theme.IconButton.secondaryActiveBorderColor}`,\n        backgroundColor: theme.Input.backgroundColor,\n      },\n    }),\n  }),\n});\n\nexport const IconButton = ({children, ...props}: IconButtonProps) => (\n  <button css={(theme: Theme) => iconButtonStyle(theme, props)} {...filterButtonProps(props)}>\n    {children}\n  </button>\n);\n\nconst filterButtonProps = (props: IconButtonProps) => {\n  return filterProps(filterTextProps(props) as IconButtonProps, ['backgroundColor']);\n};\n"],"file":"IconButton.js"}
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["IconButton.tsx"],"names":[],"mappings":"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"}

package/src/Misc/IsInViewport.js

@@ -1,69 +1,63 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+/*
+ * Wire
+ * Copyright (C) 2019 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 });
 exports.IsInViewport = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
-var _react = require("@emotion/react");
-
-var _react2 = _interopRequireWildcard(require("react"));
-
-var _excluded = ["onEnterViewport", "disabled", "checkViewportOnce"];
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var IsInViewport = function IsInViewport(_ref) {
-  var onEnterViewport = _ref.onEnterViewport,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$checkViewportOnc = _ref.checkViewportOnce,
-      checkViewportOnce = _ref$checkViewportOnc === void 0 ? false : _ref$checkViewportOnc,
-      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var element = (0, _react2.useRef)();
-  (0, _react2.useEffect)(function () {
-    var observer = undefined;
-
-    if (onEnterViewport && !disabled) {
-      observer = new IntersectionObserver(function (_ref2) {
-        var _ref3 = (0, _slicedToArray2["default"])(_ref2, 1),
-            isIntersecting = _ref3[0].isIntersecting;
-
-        if (isIntersecting) {
-          if (checkViewportOnce) {
-            observer.disconnect();
-          }
-
-          if (onEnterViewport && !disabled) {
-            onEnterViewport();
-          }
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const react_2 = require("react");
+const IsInViewport = (_a) => {
+    var { onEnterViewport, disabled = false, checkViewportOnce = false } = _a, props = __rest(_a, ["onEnterViewport", "disabled", "checkViewportOnce"]);
+    const element = (0, react_2.useRef)();
+    (0, react_2.useEffect)(() => {
+        let observer = undefined;
+        if (onEnterViewport && !disabled) {
+            observer = new IntersectionObserver(([{ isIntersecting }]) => {
+                if (isIntersecting) {
+                    if (checkViewportOnce) {
+                        observer.disconnect();
+                    }
+                    if (onEnterViewport && !disabled) {
+                        onEnterViewport();
+                    }
+                }
+            });
+            observer.observe(element.current);
         }
-      });
-      observer.observe(element.current);
-    }
-
-    return function () {
-      if (observer) {
-        observer.disconnect();
-      }
-    };
-  }, [onEnterViewport]);
-  return (0, _react.jsx)("div", (0, _extends2["default"])({
-    ref: element
-  }, props));
+        return () => {
+            if (observer) {
+                observer.disconnect();
+            }
+        };
+    }, [onEnterViewport]);
+    return (0, react_1.jsx)("div", Object.assign({ ref: element }, props));
 };
-
 exports.IsInViewport = IsInViewport;
 //# sourceMappingURL=IsInViewport.js.map

package/src/Misc/IsInViewport.js.map

@@ -1 +1 @@
-{"version":3,"sources":["IsInViewport.tsx"],"names":["IsInViewport","onEnterViewport","disabled","checkViewportOnce","props","element","observer","undefined","IntersectionObserver","isIntersecting","disconnect","observe","current"],"mappings":";;;;;;;;;;;;;;;;;AAoBA;;AACA;;;;;;;;AAQO,IAAMA,YAAY,GAAG,SAAfA,YAAe,OAKH;AAAA,MAJvBC,eAIuB,QAJvBA,eAIuB;AAAA,2BAHvBC,QAGuB;AAAA,MAHvBA,QAGuB,8BAHZ,KAGY;AAAA,mCAFvBC,iBAEuB;AAAA,MAFvBA,iBAEuB,sCAFH,KAEG;AAAA,MADpBC,KACoB;AACvB,MAAMC,OAAO,GAAG,qBAAhB;AACA,yBAAU,YAAM;AACd,QAAIC,QAAQ,GAAGC,SAAf;;AACA,QAAIN,eAAe,IAAI,CAACC,QAAxB,EAAkC;AAChCI,MAAAA,QAAQ,GAAG,IAAIE,oBAAJ,CAAyB,iBAAwB;AAAA;AAAA,YAArBC,cAAqB,YAArBA,cAAqB;;AAC1D,YAAIA,cAAJ,EAAoB;AAClB,cAAIN,iBAAJ,EAAuB;AACrBG,YAAAA,QAAQ,CAACI,UAAT;AACD;;AACD,cAAIT,eAAe,IAAI,CAACC,QAAxB,EAAkC;AAChCD,YAAAA,eAAe;AAChB;AACF;AACF,OATU,CAAX;AAUAK,MAAAA,QAAQ,CAACK,OAAT,CAAiBN,OAAO,CAACO,OAAzB;AACD;;AAED,WAAO,YAAM;AACX,UAAIN,QAAJ,EAAc;AACZA,QAAAA,QAAQ,CAACI,UAAT;AACD;AACF,KAJD;AAKD,GArBD,EAqBG,CAACT,eAAD,CArBH;AAsBA,SAAO;AAAK,IAAA,GAAG,EAAEI;AAAV,KAAuBD,KAAvB,EAAP;AACD,CA9BM","sourcesContent":["/*\n * Wire\n * Copyright (C) 2019 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, {useEffect, useRef} from 'react';\n\nexport interface IsInViewportProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  checkViewportOnce?: boolean;\n  disabled?: boolean;\n  onEnterViewport?: () => void;\n}\n\nexport const IsInViewport = ({\n  onEnterViewport,\n  disabled = false,\n  checkViewportOnce = false,\n  ...props\n}: IsInViewportProps) => {\n  const element = useRef<HTMLDivElement>();\n  useEffect(() => {\n    let observer = undefined;\n    if (onEnterViewport && !disabled) {\n      observer = new IntersectionObserver(([{isIntersecting}]) => {\n        if (isIntersecting) {\n          if (checkViewportOnce) {\n            observer.disconnect();\n          }\n          if (onEnterViewport && !disabled) {\n            onEnterViewport();\n          }\n        }\n      });\n      observer.observe(element.current);\n    }\n\n    return () => {\n      if (observer) {\n        observer.disconnect();\n      }\n    };\n  }, [onEnterViewport]);\n  return <div ref={element} {...props} />;\n};\n"],"file":"IsInViewport.js"}
+{"version":3,"file":"IsInViewport.js","sourceRoot":"","sources":["IsInViewport.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;AAEH,eAAe;AACf,0CAAmC;AACnC,iCAA+C;AAQxC,MAAM,YAAY,GAAG,CAAC,EAKT,EAAE,EAAE;QALK,EAC3B,eAAe,EACf,QAAQ,GAAG,KAAK,EAChB,iBAAiB,GAAG,KAAK,OAEP,EADf,KAAK,cAJmB,oDAK5B,CADS;IAER,MAAM,OAAO,GAAG,IAAA,cAAM,GAAkB,CAAC;IACzC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,QAAQ,GAAG,SAAS,CAAC;QACzB,IAAI,eAAe,IAAI,CAAC,QAAQ,EAAE;YAChC,QAAQ,GAAG,IAAI,oBAAoB,CAAC,CAAC,CAAC,EAAC,cAAc,EAAC,CAAC,EAAE,EAAE;gBACzD,IAAI,cAAc,EAAE;oBAClB,IAAI,iBAAiB,EAAE;wBACrB,QAAQ,CAAC,UAAU,EAAE,CAAC;qBACvB;oBACD,IAAI,eAAe,IAAI,CAAC,QAAQ,EAAE;wBAChC,eAAe,EAAE,CAAC;qBACnB;iBACF;YACH,CAAC,CAAC,CAAC;YACH,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;SACnC;QAED,OAAO,GAAG,EAAE;YACV,IAAI,QAAQ,EAAE;gBACZ,QAAQ,CAAC,UAAU,EAAE,CAAC;aACvB;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IACtB,OAAO,wCAAK,GAAG,EAAE,OAAO,IAAM,KAAK,EAAI,CAAC;AAC1C,CAAC,CAAC;AA9BW,QAAA,YAAY,gBA8BvB"}

package/src/Misc/Loading.d.ts

@@ -9,7 +9,7 @@ export interface LoadingProps<T = SVGSVGElement> extends React.SVGProps<T> {
 export declare const Loading: {
     ({ progress, size, color, ...props }: LoadingProps): jsx.JSX.Element;
     defaultProps: {
-        progress: any;
+        progress: undefined;
         size: number;
     };
 };