@wireapp/react-ui-kit 8.17.10 → 9.0.1

package/lib/Menu/MenuModal.js

@@ -0,0 +1,94 @@
+"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 });
+exports.MenuItem = exports.MenuModal = void 0;
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const Identity_1 = require("../Identity/");
+const motions_1 = require("../Identity/motions");
+const mediaQueries_1 = require("../mediaQueries");
+const Overlay_1 = require("../Modal/Overlay");
+const util_1 = require("../util");
+const menuModalWrapperStyle = props => (Object.assign(Object.assign({}, (0, Overlay_1.overlayBackgroundStyle)(props)), { alignItems: 'flex-end', alignSelf: 'flex-end', display: 'flex', overflowY: 'hidden', padding: 0 }));
+const MenuModalWrapper = (props) => (0, react_1.jsx)("div", Object.assign({ css: menuModalWrapperStyle }, props));
+const MenuModalBody = (props) => ((0, react_1.jsx)("div", Object.assign({ css: (theme) => ({
+        animation: `${motions_1.ANIMATION.bottomUpMovement} ${motions_1.DURATION.DEFAULT}ms ${motions_1.EASE.EXPONENTIAL}`,
+        backgroundColor: Identity_1.COLOR.tint(theme.general.backgroundColor, 0.16),
+        boxShadow: '0 16px 64px 0 rgba(0, 0, 0, 0.16)',
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'space-between',
+        marginLeft: 'auto',
+        marginRight: 'auto',
+        padding: '8px 16px',
+        position: 'relative',
+        width: '767px',
+        zIndex: 9999,
+        [mediaQueries_1.media[mediaQueries_1.QueryKeys.TABLET_DOWN]]: {
+            width: '100%',
+        },
+    }) }, props)));
+const MenuModalContent = (props) => ((0, react_1.jsx)("ul", Object.assign({ css: {
+        li: {
+            borderBottom: `1px solid ${Identity_1.COLOR.GRAY_LIGHTEN_72}`,
+        },
+        'li:last-child': {
+            borderBottom: 0,
+        },
+        margin: 0,
+        maxWidth: '100%',
+        minWidth: '100%',
+        padding: 0,
+    } }, props)));
+const modalBackgroundStyle = props => (Object.assign(Object.assign({}, (0, Overlay_1.overlayBackgroundStyle)(props)), { background: 'rgba(50, 54, 57, 0.4)' }));
+const MenuModalBackground = (props) => (0, react_1.jsx)("div", Object.assign({ css: modalBackgroundStyle }, props));
+const MenuModal = (_a) => {
+    var { children = null, onBackgroundClick = util_1.noop } = _a, props = __rest(_a, ["children", "onBackgroundClick"]);
+    return ((0, react_1.jsx)(MenuModalWrapper, Object.assign({}, props),
+        (0, react_1.jsx)(MenuModalBody, null,
+            (0, react_1.jsx)(MenuModalContent, null, children)),
+        (0, react_1.jsx)(MenuModalBackground, { onClick: onBackgroundClick, "data-uie-name": "menu-background" })));
+};
+exports.MenuModal = MenuModal;
+const MenuItem = (_a) => {
+    var { children = null } = _a, props = __rest(_a, ["children"]);
+    return ((0, react_1.jsx)("li", Object.assign({ css: (theme) => ({
+            alignItems: 'center',
+            color: theme.general.color,
+            cursor: 'pointer',
+            display: 'flex',
+            height: '56px',
+            listStyleType: 'none',
+            maxWidth: '100%',
+        }) }, props), children));
+};
+exports.MenuItem = MenuItem;
+//# sourceMappingURL=MenuModal.js.map

package/lib/Menu/MenuModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuModal.js","sourceRoot":"","sources":["../../src/Menu/MenuModal.tsx"],"names":[],"mappings":"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"}

package/lib/Menu/TabBar.js

@@ -0,0 +1,59 @@
+"use strict";
+/*
+ * 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.TabBarItem = exports.TabBar = void 0;
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const Identity_1 = require("../Identity");
+const Text_1 = require("../Text");
+const util_1 = require("../util");
+const tabBarStyle = ({}) => {
+    return {
+        display: 'flex',
+        width: '100%',
+    };
+};
+const filteredTabBarProps = (props) => (0, util_1.filterProps)(props, []);
+const TabBar = (_a) => {
+    var { children = null } = _a, props = __rest(_a, ["children"]);
+    return ((0, react_1.jsx)("div", Object.assign({ css: tabBarStyle(props) }, filteredTabBarProps(props)), children));
+};
+exports.TabBar = TabBar;
+const tabBarItemStyle = (theme, _a) => {
+    var { block = true, center = true, color = theme.general.color, bold = true, active = false, fontSize = '11px', textTransform = 'uppercase' } = _a, props = __rest(_a, ["block", "center", "color", "bold", "active", "fontSize", "textTransform"]);
+    return Object.assign(Object.assign({}, (0, Text_1.textStyle)(theme, Object.assign({ block, bold, center, color, fontSize, textTransform }, props))), { borderBottom: active ? `1px solid ${Identity_1.COLOR.GRAY_DARKEN_48}` : `1px solid ${Identity_1.COLOR.GRAY_LIGHTEN_40}`, cursor: 'pointer', display: 'flex', flexGrow: 1, justifyContent: 'center', opacity: active ? 1 : 0.56, padding: '8px 0' });
+};
+const TabBarItem = (_a) => {
+    var { children = null } = _a, props = __rest(_a, ["children"]);
+    return ((0, react_1.jsx)("span", Object.assign({ css: (theme) => tabBarItemStyle(theme, props) }, props), children));
+};
+exports.TabBarItem = TabBarItem;
+//# sourceMappingURL=TabBar.js.map

package/lib/Menu/TabBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabBar.js","sourceRoot":"","sources":["../../src/Menu/TabBar.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;AAEH,eAAe;AACf,0CAA8C;AAG9C,0CAAkC;AAElC,kCAA6C;AAC7C,kCAAoC;AAIpC,MAAM,WAAW,GAA4C,CAAC,EAAE,EAAE,EAAE;IAClE,OAAO;QACL,OAAO,EAAE,MAAM;QACf,KAAK,EAAE,MAAM;KACd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,IAAA,kBAAW,EAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AAEpE,MAAM,MAAM,GAAG,CAAC,EAAwC,EAAE,EAAE;QAA5C,EAAC,QAAQ,GAAG,IAAI,OAAwB,EAAnB,KAAK,cAA1B,YAA2B,CAAD;IAAmB,OAAA,CAClE,wCAAK,GAAG,EAAE,WAAW,CAAC,KAAK,CAAC,IAAM,mBAAmB,CAAC,KAAK,CAAC,GACzD,QAAQ,CACL,CACP,CAAA;CAAA,CAAC;AAJW,QAAA,MAAM,UAIjB;AAMF,MAAM,eAAe,GAA8D,CACjF,KAAK,EACL,EASC,EACD,EAAE;QAVF,EACE,KAAK,GAAG,IAAI,EACZ,MAAM,GAAG,IAAI,EACb,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,EAC3B,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,KAAK,EACd,QAAQ,GAAG,MAAM,EACjB,aAAa,GAAG,WAAW,OAE5B,EADI,KAAK,cARV,2EASC,CADS;IAGV,uCACK,IAAA,gBAAS,EAAC,KAAK,kBAAG,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,IAAK,KAAK,EAAE,KACpF,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,aAAa,gBAAK,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,aAAa,gBAAK,CAAC,eAAe,EAAE,EACjG,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,CAAC,EACX,cAAc,EAAE,QAAQ,EACxB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAC1B,OAAO,EAAE,OAAO,IAChB;AACJ,CAAC,CAAC;AAEK,MAAM,UAAU,GAAG,CAAC,EAA4C,EAAE,EAAE;QAAhD,EAAC,QAAQ,GAAG,IAAI,OAA4B,EAAvB,KAAK,cAA1B,YAA2B,CAAD;IAAuB,OAAA,CAC1E,yCAAM,GAAG,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,IAAM,KAAK,GAClE,QAAQ,CACJ,CACR,CAAA;CAAA,CAAC;AAJW,QAAA,UAAU,cAIrB"}

package/lib/Menu/index.js

@@ -0,0 +1,37 @@
+"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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./MenuModal"), exports);
+__exportStar(require("./TabBar"), exports);
+//# sourceMappingURL=index.js.map

package/lib/Menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Menu/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;;;;;;;;;;;;;;;AAEH,8CAA4B;AAC5B,2CAAyB"}

package/lib/Misc/ButtonGroup.js

@@ -0,0 +1,83 @@
+"use strict";
+/*
+ * 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.ButtonGroup = void 0;
+/** @jsx jsx */
+const react_1 = require("@emotion/react");
+const Identity_1 = require("../Identity");
+const buttonGroupStyle = () => ({
+    display: 'flex',
+    alignItems: 'center',
+});
+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_1.COLOR_V2.GRAY_20,
+    },
+    '&:hover': {
+        borderColor: Identity_1.COLOR_V2.GRAY_50,
+    },
+    '&:focus': {
+        borderColor: Identity_1.COLOR_V2.GRAY_60,
+    },
+    '&:active': {
+        backgroundColor: Identity_1.COLOR_V2.BLUE_LIGHT_50,
+        borderColor: Identity_1.COLOR_V2.BLUE_LIGHT_300,
+        svg: {
+            fill: Identity_1.COLOR_V2.BLUE,
+        },
+    },
+})));
+const ButtonGroup = ({ children }) => ((0, react_1.jsx)("div", { css: (theme) => buttonGroupStyle(theme), role: "group", "aria-label": "Button Group" }, children));
+exports.ButtonGroup = ButtonGroup;
+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/lib/Misc/ButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.js","sourceRoot":"","sources":["../../src/Misc/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/lib/Misc/IconButton.js

@@ -0,0 +1,93 @@
+"use strict";
+/*
+ * 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;
+/** @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;
+(function (IconButtonVariant) {
+    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,
+    },
+    '&:hover': {
+        borderColor: theme.IconButton.primaryHoverBorderColor,
+    },
+    '&:focus': {
+        borderColor: theme.IconButton.focusBorderColor,
+    },
+    '&:active': {
+        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,
+        },
+    },
+    '&:focus': {
+        border: `1px solid ${theme.IconButton.focusBorderColor}`,
+    },
+    '&:active': {
+        border: `1px solid ${theme.IconButton.secondaryActiveBorderColor}`,
+        backgroundColor: theme.Input.backgroundColor,
+    },
+})))));
+exports.iconButtonStyle = iconButtonStyle;
+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;
+const filterButtonProps = (props) => {
+    return (0, util_1.filterProps)((0, Text_1.filterTextProps)(props), ['backgroundColor']);
+};
+//# sourceMappingURL=IconButton.js.map

package/lib/Misc/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../src/Misc/IconButton.tsx"],"names":[],"mappings":"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"}

package/lib/Misc/IsInViewport.js

@@ -0,0 +1,63 @@
+"use strict";
+/*
+ * 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;
+/** @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);
+        }
+        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/lib/Misc/IsInViewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IsInViewport.js","sourceRoot":"","sources":["../../src/Misc/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/lib/Misc/Loading.js

@@ -0,0 +1,64 @@
+"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 });
+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}` })));
+};
+exports.Loading = Loading;
+exports.Loading.defaultProps = {
+    progress: undefined,
+    size: 43,
+};
+//# sourceMappingURL=Loading.js.map

package/lib/Misc/Loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.js","sourceRoot":"","sources":["../../src/Misc/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"}

package/lib/Misc/Pagination.js

@@ -0,0 +1,70 @@
+"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 });
+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;
+    };
+    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))))));
+};
+exports.Pagination = Pagination;
+//# sourceMappingURL=Pagination.js.map

package/lib/Misc/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../src/Misc/Pagination.tsx"],"names":[],"mappings":"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"}