@wireapp/react-ui-kit 7.55.2 → 8.0.0

package/src/Layout/Container.js

@@ -11,9 +11,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
 var _mediaQueries = require("../mediaQueries");
 
@@ -72,8 +72,8 @@ var filterContainerProps = function filterContainerProps(props) {
   return (0, _util.filterProps)(props, ['centerText', 'level', 'verticalCenter']);
 };
 
-var Container = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)("div", (0, _extends2["default"])({
+var Container = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)("div", (0, _extends2["default"])({
     ref: ref,
     css: containerStyle(props)
   }, filterContainerProps(props)));
@@ -81,8 +81,8 @@ var Container = /*#__PURE__*/_react["default"].forwardRef(function (props, ref)
 
 exports.Container = Container;
 
-var ContainerLG = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)(Container, (0, _extends2["default"])({
+var ContainerLG = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
     ref: ref,
     level: 'lg'
   }, props));
@@ -90,8 +90,8 @@ var ContainerLG = /*#__PURE__*/_react["default"].forwardRef(function (props, ref
 
 exports.ContainerLG = ContainerLG;
 
-var ContainerMD = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)(Container, (0, _extends2["default"])({
+var ContainerMD = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
     ref: ref,
     level: 'md'
   }, props));
@@ -99,8 +99,8 @@ var ContainerMD = /*#__PURE__*/_react["default"].forwardRef(function (props, ref
 
 exports.ContainerMD = ContainerMD;
 
-var ContainerSM = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)(Container, (0, _extends2["default"])({
+var ContainerSM = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
     ref: ref,
     level: 'sm'
   }, props));
@@ -108,8 +108,8 @@ var ContainerSM = /*#__PURE__*/_react["default"].forwardRef(function (props, ref
 
 exports.ContainerSM = ContainerSM;
 
-var ContainerXS = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)(Container, (0, _extends2["default"])({
+var ContainerXS = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
     ref: ref,
     level: 'xs'
   }, props));
@@ -117,8 +117,8 @@ var ContainerXS = /*#__PURE__*/_react["default"].forwardRef(function (props, ref
 
 exports.ContainerXS = ContainerXS;
 
-var ContainerXXS = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)(Container, (0, _extends2["default"])({
+var ContainerXXS = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
     ref: ref,
     level: 'xxs'
   }, props));

package/src/Layout/Container.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Container.tsx"],"names":["LEVEL","lg","WIDTH","DESKTOP_MAX","md","TABLET_MAX","sm","TABLET_MIN","xs","MOBILE","xxs","TINY","containerStyle","centerText","level","undefined","verticalCenter","margin","maxWidth","position","textAlign","width","media","QueryKeys","DESKTOP","padding","DESKTOP_MIN","GUTTER","filterContainerProps","props","Container","React","forwardRef","ref","ContainerLG","ContainerMD","ContainerSM","ContainerXS","ContainerXXS"],"mappings":"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","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 {CSSObject, jsx} from '@emotion/core';\nimport React from 'react';\n\nimport {QueryKeys, media} from '../mediaQueries';\nimport {filterProps} from '../util';\nimport {GUTTER, WIDTH} from './sizes';\n\nexport interface ContainerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  centerText?: boolean;\n  level?: keyof Level;\n  verticalCenter?: boolean;\n}\n\nexport interface Level {\n  lg: number;\n  md: number;\n  sm: number;\n  xs: number;\n  xxs: number;\n}\n\nconst LEVEL: Level = {\n  lg: WIDTH.DESKTOP_MAX,\n  md: WIDTH.TABLET_MAX,\n  sm: WIDTH.TABLET_MIN,\n  xs: WIDTH.MOBILE,\n  xxs: WIDTH.TINY,\n};\n\nconst containerStyle: <T>(props: ContainerProps<T>) => CSSObject = ({\n  centerText = false,\n  level = undefined,\n  verticalCenter = false,\n}) => ({\n  margin: verticalCenter ? 'auto' : '0 auto',\n  maxWidth: level ? `${LEVEL[level]}px` : undefined,\n  position: 'relative',\n  textAlign: centerText ? 'center' : 'left',\n  width: '100%',\n  [media[QueryKeys.DESKTOP]]: level\n    ? undefined\n    : {\n        padding: 0,\n        width: `${WIDTH.DESKTOP_MIN - GUTTER * 2}px`,\n      },\n});\n\nconst filterContainerProps = (props: ContainerProps) => filterProps(props, ['centerText', 'level', 'verticalCenter']);\n\nexport const Container: React.FC<ContainerProps> = React.forwardRef<HTMLDivElement, ContainerProps>((props, ref) => (\n  <div ref={ref} css={containerStyle(props)} {...filterContainerProps(props)} />\n));\n\nexport type LevelContainerProps = Omit<ContainerProps, 'level'>;\n\nexport const ContainerLG = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'lg'} {...props} />\n));\nexport const ContainerMD = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'md'} {...props} />\n));\nexport const ContainerSM = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'sm'} {...props} />\n));\nexport const ContainerXS = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'xs'} {...props} />\n));\nexport const ContainerXXS = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'xxs'} {...props} />\n));\n"],"file":"Container.js"}
+{"version":3,"sources":["Container.tsx"],"names":["LEVEL","lg","WIDTH","DESKTOP_MAX","md","TABLET_MAX","sm","TABLET_MIN","xs","MOBILE","xxs","TINY","containerStyle","centerText","level","undefined","verticalCenter","margin","maxWidth","position","textAlign","width","media","QueryKeys","DESKTOP","padding","DESKTOP_MIN","GUTTER","filterContainerProps","props","Container","React","forwardRef","ref","ContainerLG","ContainerMD","ContainerSM","ContainerXS","ContainerXXS"],"mappings":"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","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 {CSSObject, jsx} from '@emotion/react';\nimport React from 'react';\n\nimport {QueryKeys, media} from '../mediaQueries';\nimport {filterProps} from '../util';\nimport {GUTTER, WIDTH} from './sizes';\n\nexport interface ContainerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  centerText?: boolean;\n  level?: keyof Level;\n  verticalCenter?: boolean;\n}\n\nexport interface Level {\n  lg: number;\n  md: number;\n  sm: number;\n  xs: number;\n  xxs: number;\n}\n\nconst LEVEL: Level = {\n  lg: WIDTH.DESKTOP_MAX,\n  md: WIDTH.TABLET_MAX,\n  sm: WIDTH.TABLET_MIN,\n  xs: WIDTH.MOBILE,\n  xxs: WIDTH.TINY,\n};\n\nconst containerStyle: <T>(props: ContainerProps<T>) => CSSObject = ({\n  centerText = false,\n  level = undefined,\n  verticalCenter = false,\n}) => ({\n  margin: verticalCenter ? 'auto' : '0 auto',\n  maxWidth: level ? `${LEVEL[level]}px` : undefined,\n  position: 'relative',\n  textAlign: centerText ? 'center' : 'left',\n  width: '100%',\n  [media[QueryKeys.DESKTOP]]: level\n    ? undefined\n    : {\n        padding: 0,\n        width: `${WIDTH.DESKTOP_MIN - GUTTER * 2}px`,\n      },\n});\n\nconst filterContainerProps = (props: ContainerProps) => filterProps(props, ['centerText', 'level', 'verticalCenter']);\n\nexport const Container: React.FC<ContainerProps> = React.forwardRef<HTMLDivElement, ContainerProps>((props, ref) => (\n  <div ref={ref} css={containerStyle(props)} {...filterContainerProps(props)} />\n));\n\nexport type LevelContainerProps = Omit<ContainerProps, 'level'>;\n\nexport const ContainerLG = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'lg'} {...props} />\n));\nexport const ContainerMD = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'md'} {...props} />\n));\nexport const ContainerSM = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'sm'} {...props} />\n));\nexport const ContainerXS = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'xs'} {...props} />\n));\nexport const ContainerXXS = React.forwardRef<HTMLDivElement, LevelContainerProps>((props, ref) => (\n  <Container ref={ref} level={'xxs'} {...props} />\n));\n"],"file":"Container.js"}

package/src/Layout/Content.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import React from 'react';
-import { CSSObject } from '@emotion/core';
+import { CSSObject, jsx } from '@emotion/react';
 export declare type ContentProps<T = HTMLDivElement> = React.HTMLProps<T>;
 export declare const contentStyle: <T>(props: ContentProps<T>) => CSSObject;
-export declare const Content: (props: ContentProps<HTMLDivElement>) => JSX.Element;
+export declare const Content: (props: ContentProps<HTMLDivElement>) => jsx.JSX.Element;

package/src/Layout/Content.js

@@ -11,7 +11,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _react = _interopRequireDefault(require("react"));
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _sizes = require("./sizes");
 
@@ -47,7 +47,7 @@ var contentStyle = function contentStyle(props) {
 exports.contentStyle = contentStyle;
 
 var Content = function Content(props) {
-  return (0, _core.jsx)("div", (0, _extends2["default"])({
+  return (0, _react2.jsx)("div", (0, _extends2["default"])({
     css: contentStyle(props)
   }, props));
 };

package/src/Layout/Content.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Content.tsx"],"names":["contentStyle","props","display","flexDirection","flexGrow","padding","GUTTER","Content"],"mappings":";;;;;;;;;;;AAoBA;;AACA;;AAEA;;AAvBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAQO,IAAMA,YAAsD,GAAG,SAAzDA,YAAyD,CAAAC,KAAK;AAAA,SAAK;AAC9EC,IAAAA,OAAO,EAAE,MADqE;AAE9EC,IAAAA,aAAa,EAAE,QAF+D;AAG9EC,IAAAA,QAAQ,EAAE,CAHoE;AAI9EC,IAAAA,OAAO,cAAOC,aAAP;AAJuE,GAAL;AAAA,CAApE;;;;AAOA,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAACN,KAAD;AAAA,SAAyB;AAAK,IAAA,GAAG,EAAED,YAAY,CAACC,KAAD;AAAtB,KAAmCA,KAAnC,EAAzB;AAAA,CAAhB","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 React from 'react';\nimport {CSSObject, jsx} from '@emotion/core';\n\nimport {GUTTER} from './sizes';\n\nexport type ContentProps<T = HTMLDivElement> = React.HTMLProps<T>;\n\nexport const contentStyle: <T>(props: ContentProps<T>) => CSSObject = props => ({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  padding: `0 ${GUTTER}px`,\n});\n\nexport const Content = (props: ContentProps) => <div css={contentStyle(props)} {...props} />;\n"],"file":"Content.js"}
+{"version":3,"sources":["Content.tsx"],"names":["contentStyle","props","display","flexDirection","flexGrow","padding","GUTTER","Content"],"mappings":";;;;;;;;;;;AAoBA;;AACA;;AAEA;;AAvBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAQO,IAAMA,YAAsD,GAAG,SAAzDA,YAAyD,CAAAC,KAAK;AAAA,SAAK;AAC9EC,IAAAA,OAAO,EAAE,MADqE;AAE9EC,IAAAA,aAAa,EAAE,QAF+D;AAG9EC,IAAAA,QAAQ,EAAE,CAHoE;AAI9EC,IAAAA,OAAO,cAAOC,aAAP;AAJuE,GAAL;AAAA,CAApE;;;;AAOA,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAACN,KAAD;AAAA,SAAyB;AAAK,IAAA,GAAG,EAAED,YAAY,CAACC,KAAD;AAAtB,KAAmCA,KAAnC,EAAzB;AAAA,CAAhB","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 React from 'react';\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {GUTTER} from './sizes';\n\nexport type ContentProps<T = HTMLDivElement> = React.HTMLProps<T>;\n\nexport const contentStyle: <T>(props: ContentProps<T>) => CSSObject = props => ({\n  display: 'flex',\n  flexDirection: 'column',\n  flexGrow: 1,\n  padding: `0 ${GUTTER}px`,\n});\n\nexport const Content = (props: ContentProps) => <div css={contentStyle(props)} {...props} />;\n"],"file":"Content.js"}

package/src/Layout/FlexBox.d.ts

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { CSSObject } from '@emotion/core';
+import { CSSObject } from '@emotion/react';
 import type { Property } from 'csstype';
 import React from 'react';
 export interface FlexBoxProps<T = HTMLDivElement> extends React.PropsWithRef<React.HTMLProps<T>> {

package/src/Layout/FlexBox.js

@@ -9,9 +9,9 @@ exports.FlexBox = exports.filterFlexBoxProps = exports.flexBoxStyle = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
 var _util = require("../util");
 
@@ -61,8 +61,8 @@ var filterFlexBoxProps = function filterFlexBoxProps(props) {
 
 exports.filterFlexBoxProps = filterFlexBoxProps;
 
-var FlexBox = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
-  return (0, _core.jsx)("div", (0, _extends2["default"])({
+var FlexBox = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)("div", (0, _extends2["default"])({
     ref: ref,
     css: flexBoxStyle(props)
   }, filterFlexBoxProps(props)));

package/src/Layout/FlexBox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["FlexBox.tsx"],"names":["flexBoxStyle","align","column","justify","flexWrap","alignItems","display","flexDirection","justifyContent","filterFlexBoxProps","props","FlexBox","React","forwardRef","ref"],"mappings":";;;;;;;;;;;AAoBA;;AAEA;;AAEA;;AAxBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAcO,IAAMA,YAAsD,GAAG,SAAzDA,YAAyD;AAAA,wBACpEC,KADoE;AAAA,MACpEA,KADoE,2BAC5D,YAD4D;AAAA,yBAEpEC,MAFoE;AAAA,MAEpEA,MAFoE,4BAE3D,KAF2D;AAAA,0BAGpEC,OAHoE;AAAA,MAGpEA,OAHoE,6BAG1D,YAH0D;AAAA,2BAIpEC,QAJoE;AAAA,MAIpEA,QAJoE,8BAIzD,QAJyD;AAAA,SAK/D;AACLC,IAAAA,UAAU,EAAEJ,KADP;AAELK,IAAAA,OAAO,EAAE,MAFJ;AAGLC,IAAAA,aAAa,EAAEL,MAAM,GAAG,QAAH,GAAc,KAH9B;AAILE,IAAAA,QAAQ,EAAEA,QAJL;AAKLI,IAAAA,cAAc,EAAEL;AALX,GAL+D;AAAA,CAA/D;;;;AAaA,IAAMM,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD;AAAA,SAChC,uBAAYA,KAAZ,EAAmB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,UAA/B,CAAnB,CADgC;AAAA,CAA3B;;;;AAGA,IAAMC,OAA+B,gBAAGC,kBAAMC,UAAN,CAA+C,UAACH,KAAD,EAAQI,GAAR;AAAA,SAC5F;AAAK,IAAA,GAAG,EAAEA,GAAV;AAAe,IAAA,GAAG,EAAEd,YAAY,CAACU,KAAD;AAAhC,KAA6CD,kBAAkB,CAACC,KAAD,CAA/D,EAD4F;AAAA,CAA/C,CAAxC","sourcesContent":["/*\n * Wire\n * Copyright (C) 2017 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/core';\nimport type {Property} from 'csstype';\nimport React from 'react';\n\nimport {filterProps} from '../util';\n\nexport interface FlexBoxProps<T = HTMLDivElement> extends React.PropsWithRef<React.HTMLProps<T>> {\n  align?: string;\n  column?: boolean;\n  flexWrap?: Property.FlexWrap;\n  justify?: string;\n}\n\nexport const flexBoxStyle: <T>(props: FlexBoxProps<T>) => CSSObject = ({\n  align = 'flex-start',\n  column = false,\n  justify = 'flex-start',\n  flexWrap = 'nowrap',\n}) => ({\n  alignItems: align,\n  display: 'flex',\n  flexDirection: column ? 'column' : 'row',\n  flexWrap: flexWrap,\n  justifyContent: justify,\n});\n\nexport const filterFlexBoxProps = (props: FlexBoxProps) =>\n  filterProps(props, ['align', 'column', 'justify', 'flexWrap']);\n\nexport const FlexBox: React.FC<FlexBoxProps> = React.forwardRef<HTMLDivElement, FlexBoxProps>((props, ref) => (\n  <div ref={ref} css={flexBoxStyle(props)} {...filterFlexBoxProps(props)} />\n));\n"],"file":"FlexBox.js"}
+{"version":3,"sources":["FlexBox.tsx"],"names":["flexBoxStyle","align","column","justify","flexWrap","alignItems","display","flexDirection","justifyContent","filterFlexBoxProps","props","FlexBox","React","forwardRef","ref"],"mappings":";;;;;;;;;;;AAoBA;;AAEA;;AAEA;;AAxBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAcO,IAAMA,YAAsD,GAAG,SAAzDA,YAAyD;AAAA,wBACpEC,KADoE;AAAA,MACpEA,KADoE,2BAC5D,YAD4D;AAAA,yBAEpEC,MAFoE;AAAA,MAEpEA,MAFoE,4BAE3D,KAF2D;AAAA,0BAGpEC,OAHoE;AAAA,MAGpEA,OAHoE,6BAG1D,YAH0D;AAAA,2BAIpEC,QAJoE;AAAA,MAIpEA,QAJoE,8BAIzD,QAJyD;AAAA,SAK/D;AACLC,IAAAA,UAAU,EAAEJ,KADP;AAELK,IAAAA,OAAO,EAAE,MAFJ;AAGLC,IAAAA,aAAa,EAAEL,MAAM,GAAG,QAAH,GAAc,KAH9B;AAILE,IAAAA,QAAQ,EAAEA,QAJL;AAKLI,IAAAA,cAAc,EAAEL;AALX,GAL+D;AAAA,CAA/D;;;;AAaA,IAAMM,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD;AAAA,SAChC,uBAAYA,KAAZ,EAAmB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,UAA/B,CAAnB,CADgC;AAAA,CAA3B;;;;AAGA,IAAMC,OAA+B,gBAAGC,mBAAMC,UAAN,CAA+C,UAACH,KAAD,EAAQI,GAAR;AAAA,SAC5F;AAAK,IAAA,GAAG,EAAEA,GAAV;AAAe,IAAA,GAAG,EAAEd,YAAY,CAACU,KAAD;AAAhC,KAA6CD,kBAAkB,CAACC,KAAD,CAA/D,EAD4F;AAAA,CAA/C,CAAxC","sourcesContent":["/*\n * Wire\n * Copyright (C) 2017 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 type {Property} from 'csstype';\nimport React from 'react';\n\nimport {filterProps} from '../util';\n\nexport interface FlexBoxProps<T = HTMLDivElement> extends React.PropsWithRef<React.HTMLProps<T>> {\n  align?: string;\n  column?: boolean;\n  flexWrap?: Property.FlexWrap;\n  justify?: string;\n}\n\nexport const flexBoxStyle: <T>(props: FlexBoxProps<T>) => CSSObject = ({\n  align = 'flex-start',\n  column = false,\n  justify = 'flex-start',\n  flexWrap = 'nowrap',\n}) => ({\n  alignItems: align,\n  display: 'flex',\n  flexDirection: column ? 'column' : 'row',\n  flexWrap: flexWrap,\n  justifyContent: justify,\n});\n\nexport const filterFlexBoxProps = (props: FlexBoxProps) =>\n  filterProps(props, ['align', 'column', 'justify', 'flexWrap']);\n\nexport const FlexBox: React.FC<FlexBoxProps> = React.forwardRef<HTMLDivElement, FlexBoxProps>((props, ref) => (\n  <div ref={ref} css={flexBoxStyle(props)} {...filterFlexBoxProps(props)} />\n));\n"],"file":"FlexBox.js"}

package/src/Layout/Footer.d.ts

@@ -1,4 +1,6 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import React from 'react';
 declare type FooterProps = React.HTMLProps<HTMLElement>;
-export declare const Footer: (props: FooterProps) => JSX.Element;
+export declare const Footer: (props: FooterProps) => jsx.JSX.Element;
 export {};

package/src/Layout/Footer.js

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Footer = void 0;
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
 /*
  * Wire
@@ -32,7 +32,7 @@ var _react = _interopRequireDefault(require("react"));
 
 /** @jsx jsx */
 var Footer = function Footer(props) {
-  return (0, _core.jsx)("footer", props);
+  return (0, _react.jsx)("footer", props);
 };
 
 exports.Footer = Footer;

package/src/Layout/Footer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Footer.tsx"],"names":["Footer","props"],"mappings":";;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAMO,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAwB,yBAAYA,KAAZ,CAAxB;AAAA,CAAf","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/core';\nimport React from 'react';\n\ntype FooterProps = React.HTMLProps<HTMLElement>;\n\nexport const Footer = (props: FooterProps) => <footer {...props} />;\n"],"file":"Footer.js"}
+{"version":3,"sources":["Footer.tsx"],"names":["Footer","props"],"mappings":";;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAMO,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAwB,0BAAYA,KAAZ,CAAxB;AAAA,CAAf","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\ntype FooterProps = React.HTMLProps<HTMLElement>;\n\nexport const Footer = (props: FooterProps) => <footer {...props} />;\n"],"file":"Footer.js"}

package/src/Layout/Header.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
-import { CSSObject } from '@emotion/core';
+import { CSSObject, jsx } from '@emotion/react';
 import React from 'react';
 export declare type HeaderProps<T = HTMLHeadingElement> = React.HTMLProps<T>;
 export declare const headerStyle: <T>(props: HeaderProps<T>) => CSSObject;
-export declare const Header: (props: HeaderProps<HTMLHeadingElement>) => JSX.Element;
+export declare const Header: (props: HeaderProps<HTMLHeadingElement>) => jsx.JSX.Element;

package/src/Layout/Header.js

@@ -9,9 +9,9 @@ exports.Header = exports.headerStyle = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
 /*
  * Wire
@@ -45,7 +45,7 @@ var headerStyle = function headerStyle(props) {
 exports.headerStyle = headerStyle;
 
 var Header = function Header(props) {
-  return (0, _core.jsx)("header", (0, _extends2["default"])({
+  return (0, _react.jsx)("header", (0, _extends2["default"])({
     css: headerStyle(props)
   }, props));
 };

package/src/Layout/Header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Header.tsx"],"names":["headerStyle","props","alignItems","display","height","justifyContent","Header"],"mappings":";;;;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAMO,IAAMA,WAAoD,GAAG,SAAvDA,WAAuD,CAAAC,KAAK;AAAA,SAAK;AAC5EC,IAAAA,UAAU,EAAE,QADgE;AAE5EC,IAAAA,OAAO,EAAE,MAFmE;AAG5EC,IAAAA,MAAM,EAAE,MAHoE;AAI5EC,IAAAA,cAAc,EAAE;AAJ4D,GAAL;AAAA,CAAlE;;;;AAOA,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACL,KAAD;AAAA,SAAwB;AAAQ,IAAA,GAAG,EAAED,WAAW,CAACC,KAAD;AAAxB,KAAqCA,KAArC,EAAxB;AAAA,CAAf","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 {CSSObject, jsx} from '@emotion/core';\nimport React from 'react';\n\nexport type HeaderProps<T = HTMLHeadingElement> = React.HTMLProps<T>;\n\nexport const headerStyle: <T>(props: HeaderProps<T>) => CSSObject = props => ({\n  alignItems: 'center',\n  display: 'flex',\n  height: '64px',\n  justifyContent: 'space-between',\n});\n\nexport const Header = (props: HeaderProps) => <header css={headerStyle(props)} {...props} />;\n"],"file":"Header.js"}
+{"version":3,"sources":["Header.tsx"],"names":["headerStyle","props","alignItems","display","height","justifyContent","Header"],"mappings":";;;;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAMO,IAAMA,WAAoD,GAAG,SAAvDA,WAAuD,CAAAC,KAAK;AAAA,SAAK;AAC5EC,IAAAA,UAAU,EAAE,QADgE;AAE5EC,IAAAA,OAAO,EAAE,MAFmE;AAG5EC,IAAAA,MAAM,EAAE,MAHoE;AAI5EC,IAAAA,cAAc,EAAE;AAJ4D,GAAL;AAAA,CAAlE;;;;AAOA,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACL,KAAD;AAAA,SAAwB;AAAQ,IAAA,GAAG,EAAED,WAAW,CAACC,KAAD;AAAxB,KAAqCA,KAArC,EAAxB;AAAA,CAAf","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 {CSSObject, jsx} from '@emotion/react';\nimport React from 'react';\n\nexport type HeaderProps<T = HTMLHeadingElement> = React.HTMLProps<T>;\n\nexport const headerStyle: <T>(props: HeaderProps<T>) => CSSObject = props => ({\n  alignItems: 'center',\n  display: 'flex',\n  height: '64px',\n  justifyContent: 'space-between',\n});\n\nexport const Header = (props: HeaderProps) => <header css={headerStyle(props)} {...props} />;\n"],"file":"Header.js"}

package/src/Layout/MatchMedia.d.ts

@@ -1,3 +1,5 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import React, { ReactFragment } from 'react';
 import { QueryKeys } from '../mediaQueries';
 declare type Query = string | QueryKeys;
@@ -8,12 +10,12 @@ export interface MatchMediaProps extends React.HTMLProps<ReactFragment> {
 export declare const useMatchMedia: (query: Query) => boolean;
 export declare const MatchMedia: React.FC<MatchMediaProps>;
 export declare type NamedMatchMediaProps = Omit<MatchMediaProps, 'query'>;
-export declare const IsDesktop: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsDesktopXL: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsMobile: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsMobileDown: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsMobileUp: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsTablet: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsTabletDown: (props: NamedMatchMediaProps) => JSX.Element;
-export declare const IsTabletUp: (props: NamedMatchMediaProps) => JSX.Element;
+export declare const IsDesktop: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsDesktopXL: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsMobile: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsMobileDown: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsMobileUp: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsTablet: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsTabletDown: (props: NamedMatchMediaProps) => jsx.JSX.Element;
+export declare const IsTabletUp: (props: NamedMatchMediaProps) => jsx.JSX.Element;
 export {};

package/src/Layout/MatchMedia.js

@@ -13,9 +13,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireWildcard(require("react"));
+var _react2 = _interopRequireWildcard(require("react"));
 
 var _mediaQueries = require("../mediaQueries");
 
@@ -46,7 +46,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var useMatchMedia = function useMatchMedia(query) {
   var matchMedia = window.matchMedia("(".concat(query, ")"));
 
-  var _useState = (0, _react.useState)(matchMedia.matches),
+  var _useState = (0, _react2.useState)(matchMedia.matches),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
       isMatching = _useState2[0],
       setIsMatching = _useState2[1];
@@ -55,7 +55,7 @@ var useMatchMedia = function useMatchMedia(query) {
     return setIsMatching(matchMedia.matches);
   };
 
-  (0, _react.useEffect)(function () {
+  (0, _react2.useEffect)(function () {
     matchMedia.addListener(updateMatching);
     return function () {
       return matchMedia.removeListener(updateMatching);
@@ -72,13 +72,13 @@ var MatchMedia = function MatchMedia(_ref) {
       not = _ref.not;
   var matchQuery = useMatchMedia(_mediaQueries.QUERY[query] || query);
   var isMatching = not ? !matchQuery : matchQuery;
-  return (0, _core.jsx)(_react["default"].Fragment, null, isMatching ? children : null);
+  return (0, _react.jsx)(_react2["default"].Fragment, null, isMatching ? children : null);
 };
 
 exports.MatchMedia = MatchMedia;
 
 var IsDesktop = function IsDesktop(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.DESKTOP
   }, props));
 };
@@ -86,7 +86,7 @@ var IsDesktop = function IsDesktop(props) {
 exports.IsDesktop = IsDesktop;
 
 var IsDesktopXL = function IsDesktopXL(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.DESKTOP_XL
   }, props));
 };
@@ -94,7 +94,7 @@ var IsDesktopXL = function IsDesktopXL(props) {
 exports.IsDesktopXL = IsDesktopXL;
 
 var IsMobile = function IsMobile(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.MOBILE
   }, props));
 };
@@ -102,7 +102,7 @@ var IsMobile = function IsMobile(props) {
 exports.IsMobile = IsMobile;
 
 var IsMobileDown = function IsMobileDown(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.MOBILE_DOWN
   }, props));
 };
@@ -110,7 +110,7 @@ var IsMobileDown = function IsMobileDown(props) {
 exports.IsMobileDown = IsMobileDown;
 
 var IsMobileUp = function IsMobileUp(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.MOBILE_UP
   }, props));
 };
@@ -118,7 +118,7 @@ var IsMobileUp = function IsMobileUp(props) {
 exports.IsMobileUp = IsMobileUp;
 
 var IsTablet = function IsTablet(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.TABLET
   }, props));
 };
@@ -126,7 +126,7 @@ var IsTablet = function IsTablet(props) {
 exports.IsTablet = IsTablet;
 
 var IsTabletDown = function IsTabletDown(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.TABLET_DOWN
   }, props));
 };
@@ -134,7 +134,7 @@ var IsTabletDown = function IsTabletDown(props) {
 exports.IsTabletDown = IsTabletDown;
 
 var IsTabletUp = function IsTabletUp(props) {
-  return (0, _core.jsx)(MatchMedia, (0, _extends2["default"])({
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
     query: _mediaQueries.QueryKeys.TABLET_UP
   }, props));
 };

package/src/Layout/MatchMedia.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MatchMedia.tsx"],"names":["useMatchMedia","query","matchMedia","window","matches","isMatching","setIsMatching","updateMatching","addListener","removeListener","MatchMedia","children","not","matchQuery","QUERY","IsDesktop","props","QueryKeys","DESKTOP","IsDesktopXL","DESKTOP_XL","IsMobile","MOBILE","IsMobileDown","MOBILE_DOWN","IsMobileUp","MOBILE_UP","IsTablet","TABLET","IsTabletDown","TABLET_DOWN","IsTabletUp","TABLET_UP"],"mappings":";;;;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;;;;;AAvBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAaO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAkB;AAC7C,MAAMC,UAAU,GAAGC,MAAM,CAACD,UAAP,YAAsBD,KAAtB,OAAnB;;AAEA,kBAAoC,qBAASC,UAAU,CAACE,OAApB,CAApC;AAAA;AAAA,MAAOC,UAAP;AAAA,MAAmBC,aAAnB;;AAEA,MAAMC,cAAc,GAAG,SAAjBA,cAAiB;AAAA,WAAMD,aAAa,CAACJ,UAAU,CAACE,OAAZ,CAAnB;AAAA,GAAvB;;AAEA,wBAAU,YAAM;AACdF,IAAAA,UAAU,CAACM,WAAX,CAAuBD,cAAvB;AACA,WAAO;AAAA,aAAML,UAAU,CAACO,cAAX,CAA0BF,cAA1B,CAAN;AAAA,KAAP;AACD,GAHD;AAKA,SAAOF,UAAP;AACD,CAbM;;;;AAeA,IAAMK,UAAqC,GAAG,SAAxCA,UAAwC,OAA4B;AAAA,MAA1BT,KAA0B,QAA1BA,KAA0B;AAAA,MAAnBU,QAAmB,QAAnBA,QAAmB;AAAA,MAATC,GAAS,QAATA,GAAS;AAC/E,MAAMC,UAAU,GAAGb,aAAa,CAACc,oBAAMb,KAAN,KAAgBA,KAAjB,CAAhC;AACA,MAAMI,UAAU,GAAGO,GAAG,GAAG,CAACC,UAAJ,GAAiBA,UAAvC;AACA,SAAO,eAAC,iBAAD,CAAO,QAAP,QAAiBR,UAAU,GAAGM,QAAH,GAAc,IAAzC,CAAP;AACD,CAJM;;;;AAQA,IAAMI,SAAS,GAAG,SAAZA,SAAY,CAACC,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUC;AAA7B,KAA0CF,KAA1C,EAAjC;AAAA,CAAlB;;;;AACA,IAAMG,WAAW,GAAG,SAAdA,WAAc,CAACH,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUG;AAA7B,KAA6CJ,KAA7C,EAAjC;AAAA,CAApB;;;;AACA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CAACL,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUK;AAA7B,KAAyCN,KAAzC,EAAjC;AAAA,CAAjB;;;;AACA,IAAMO,YAAY,GAAG,SAAfA,YAAe,CAACP,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUO;AAA7B,KAA8CR,KAA9C,EAAjC;AAAA,CAArB;;;;AACA,IAAMS,UAAU,GAAG,SAAbA,UAAa,CAACT,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUS;AAA7B,KAA4CV,KAA5C,EAAjC;AAAA,CAAnB;;;;AACA,IAAMW,QAAQ,GAAG,SAAXA,QAAW,CAACX,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUW;AAA7B,KAAyCZ,KAAzC,EAAjC;AAAA,CAAjB;;;;AACA,IAAMa,YAAY,GAAG,SAAfA,YAAe,CAACb,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUa;AAA7B,KAA8Cd,KAA9C,EAAjC;AAAA,CAArB;;;;AACA,IAAMe,UAAU,GAAG,SAAbA,UAAa,CAACf,KAAD;AAAA,SAAiC,eAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUe;AAA7B,KAA4ChB,KAA5C,EAAjC;AAAA,CAAnB","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/core';\nimport React, {ReactFragment, useEffect, useState} from 'react';\n\nimport {QUERY, QueryKeys} from '../mediaQueries';\n\ntype Query = string | QueryKeys;\n\nexport interface MatchMediaProps extends React.HTMLProps<ReactFragment> {\n  not?: boolean;\n  query: Query;\n}\n\nexport const useMatchMedia = (query: Query) => {\n  const matchMedia = window.matchMedia(`(${query})`);\n\n  const [isMatching, setIsMatching] = useState(matchMedia.matches);\n\n  const updateMatching = () => setIsMatching(matchMedia.matches);\n\n  useEffect(() => {\n    matchMedia.addListener(updateMatching);\n    return () => matchMedia.removeListener(updateMatching);\n  });\n\n  return isMatching;\n};\n\nexport const MatchMedia: React.FC<MatchMediaProps> = ({query, children, not}) => {\n  const matchQuery = useMatchMedia(QUERY[query] || query);\n  const isMatching = not ? !matchQuery : matchQuery;\n  return <React.Fragment>{isMatching ? children : null}</React.Fragment>;\n};\n\nexport type NamedMatchMediaProps = Omit<MatchMediaProps, 'query'>;\n\nexport const IsDesktop = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.DESKTOP} {...props} />;\nexport const IsDesktopXL = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.DESKTOP_XL} {...props} />;\nexport const IsMobile = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE} {...props} />;\nexport const IsMobileDown = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE_DOWN} {...props} />;\nexport const IsMobileUp = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE_UP} {...props} />;\nexport const IsTablet = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET} {...props} />;\nexport const IsTabletDown = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET_DOWN} {...props} />;\nexport const IsTabletUp = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET_UP} {...props} />;\n"],"file":"MatchMedia.js"}
+{"version":3,"sources":["MatchMedia.tsx"],"names":["useMatchMedia","query","matchMedia","window","matches","isMatching","setIsMatching","updateMatching","addListener","removeListener","MatchMedia","children","not","matchQuery","QUERY","IsDesktop","props","QueryKeys","DESKTOP","IsDesktopXL","DESKTOP_XL","IsMobile","MOBILE","IsMobileDown","MOBILE_DOWN","IsMobileUp","MOBILE_UP","IsTablet","TABLET","IsTabletDown","TABLET_DOWN","IsTabletUp","TABLET_UP"],"mappings":";;;;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;;;;;AAvBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAaO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAkB;AAC7C,MAAMC,UAAU,GAAGC,MAAM,CAACD,UAAP,YAAsBD,KAAtB,OAAnB;;AAEA,kBAAoC,sBAASC,UAAU,CAACE,OAApB,CAApC;AAAA;AAAA,MAAOC,UAAP;AAAA,MAAmBC,aAAnB;;AAEA,MAAMC,cAAc,GAAG,SAAjBA,cAAiB;AAAA,WAAMD,aAAa,CAACJ,UAAU,CAACE,OAAZ,CAAnB;AAAA,GAAvB;;AAEA,yBAAU,YAAM;AACdF,IAAAA,UAAU,CAACM,WAAX,CAAuBD,cAAvB;AACA,WAAO;AAAA,aAAML,UAAU,CAACO,cAAX,CAA0BF,cAA1B,CAAN;AAAA,KAAP;AACD,GAHD;AAKA,SAAOF,UAAP;AACD,CAbM;;;;AAeA,IAAMK,UAAqC,GAAG,SAAxCA,UAAwC,OAA4B;AAAA,MAA1BT,KAA0B,QAA1BA,KAA0B;AAAA,MAAnBU,QAAmB,QAAnBA,QAAmB;AAAA,MAATC,GAAS,QAATA,GAAS;AAC/E,MAAMC,UAAU,GAAGb,aAAa,CAACc,oBAAMb,KAAN,KAAgBA,KAAjB,CAAhC;AACA,MAAMI,UAAU,GAAGO,GAAG,GAAG,CAACC,UAAJ,GAAiBA,UAAvC;AACA,SAAO,gBAAC,kBAAD,CAAO,QAAP,QAAiBR,UAAU,GAAGM,QAAH,GAAc,IAAzC,CAAP;AACD,CAJM;;;;AAQA,IAAMI,SAAS,GAAG,SAAZA,SAAY,CAACC,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUC;AAA7B,KAA0CF,KAA1C,EAAjC;AAAA,CAAlB;;;;AACA,IAAMG,WAAW,GAAG,SAAdA,WAAc,CAACH,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUG;AAA7B,KAA6CJ,KAA7C,EAAjC;AAAA,CAApB;;;;AACA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CAACL,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUK;AAA7B,KAAyCN,KAAzC,EAAjC;AAAA,CAAjB;;;;AACA,IAAMO,YAAY,GAAG,SAAfA,YAAe,CAACP,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUO;AAA7B,KAA8CR,KAA9C,EAAjC;AAAA,CAArB;;;;AACA,IAAMS,UAAU,GAAG,SAAbA,UAAa,CAACT,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUS;AAA7B,KAA4CV,KAA5C,EAAjC;AAAA,CAAnB;;;;AACA,IAAMW,QAAQ,GAAG,SAAXA,QAAW,CAACX,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUW;AAA7B,KAAyCZ,KAAzC,EAAjC;AAAA,CAAjB;;;;AACA,IAAMa,YAAY,GAAG,SAAfA,YAAe,CAACb,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUa;AAA7B,KAA8Cd,KAA9C,EAAjC;AAAA,CAArB;;;;AACA,IAAMe,UAAU,GAAG,SAAbA,UAAa,CAACf,KAAD;AAAA,SAAiC,gBAAC,UAAD;AAAY,IAAA,KAAK,EAAEC,wBAAUe;AAA7B,KAA4ChB,KAA5C,EAAjC;AAAA,CAAnB","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, {ReactFragment, useEffect, useState} from 'react';\n\nimport {QUERY, QueryKeys} from '../mediaQueries';\n\ntype Query = string | QueryKeys;\n\nexport interface MatchMediaProps extends React.HTMLProps<ReactFragment> {\n  not?: boolean;\n  query: Query;\n}\n\nexport const useMatchMedia = (query: Query) => {\n  const matchMedia = window.matchMedia(`(${query})`);\n\n  const [isMatching, setIsMatching] = useState(matchMedia.matches);\n\n  const updateMatching = () => setIsMatching(matchMedia.matches);\n\n  useEffect(() => {\n    matchMedia.addListener(updateMatching);\n    return () => matchMedia.removeListener(updateMatching);\n  });\n\n  return isMatching;\n};\n\nexport const MatchMedia: React.FC<MatchMediaProps> = ({query, children, not}) => {\n  const matchQuery = useMatchMedia(QUERY[query] || query);\n  const isMatching = not ? !matchQuery : matchQuery;\n  return <React.Fragment>{isMatching ? children : null}</React.Fragment>;\n};\n\nexport type NamedMatchMediaProps = Omit<MatchMediaProps, 'query'>;\n\nexport const IsDesktop = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.DESKTOP} {...props} />;\nexport const IsDesktopXL = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.DESKTOP_XL} {...props} />;\nexport const IsMobile = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE} {...props} />;\nexport const IsMobileDown = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE_DOWN} {...props} />;\nexport const IsMobileUp = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.MOBILE_UP} {...props} />;\nexport const IsTablet = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET} {...props} />;\nexport const IsTabletDown = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET_DOWN} {...props} />;\nexport const IsTabletUp = (props: NamedMatchMediaProps) => <MatchMedia query={QueryKeys.TABLET_UP} {...props} />;\n"],"file":"MatchMedia.js"}

package/src/Layout/Spacer.d.ts

@@ -3,4 +3,4 @@ export interface SpacerProps<T = HTMLDivElement> extends React.HTMLProps<T> {
     size?: number;
     vertical?: boolean;
 }
-export declare function Spacer({ size, vertical }: SpacerProps): JSX.Element;
+export declare function Spacer({ size, vertical }: SpacerProps): React.ReactNode;

package/src/Layout/Spacer.js

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Spacer = Spacer;
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
+var _react2 = _interopRequireDefault(require("react"));
 
 /*
  * Wire
@@ -36,7 +36,7 @@ function Spacer(_ref) {
       size = _ref$size === void 0 ? 8 : _ref$size,
       _ref$vertical = _ref.vertical,
       vertical = _ref$vertical === void 0 ? false : _ref$vertical;
-  return (0, _core.jsx)("div", {
+  return (0, _react.jsx)("div", {
     style: vertical ? {
       display: 'inline-block',
       width: size

package/src/Layout/Spacer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Spacer.tsx"],"names":["Spacer","size","vertical","display","width","height"],"mappings":";;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AASO,SAASA,MAAT,OAAwE;AAAA,uBAAvDC,IAAuD;AAAA,MAAvDA,IAAuD,0BAAhD,CAAgD;AAAA,2BAA7CC,QAA6C;AAAA,MAA7CA,QAA6C,8BAAlC,KAAkC;AAC7E,SAAO;AAAK,IAAA,KAAK,EAAEA,QAAQ,GAAG;AAACC,MAAAA,OAAO,EAAE,cAAV;AAA0BC,MAAAA,KAAK,EAAEH;AAAjC,KAAH,GAA4C;AAACI,MAAAA,MAAM,EAAEJ;AAAT;AAAhE,IAAP;AACD","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, jsx as JSX} from '@emotion/core';\nimport React from 'react';\n\nexport interface SpacerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  size?: number;\n  vertical?: boolean;\n}\n\nexport function Spacer({size = 8, vertical = false}: SpacerProps): JSX.Element {\n  return <div style={vertical ? {display: 'inline-block', width: size} : {height: size}} />;\n}\n"],"file":"Spacer.js"}
+{"version":3,"sources":["Spacer.tsx"],"names":["Spacer","size","vertical","display","width","height"],"mappings":";;;;;;;;;AAoBA;;AACA;;AArBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AASO,SAASA,MAAT,OAA4E;AAAA,uBAA3DC,IAA2D;AAAA,MAA3DA,IAA2D,0BAApD,CAAoD;AAAA,2BAAjDC,QAAiD;AAAA,MAAjDA,QAAiD,8BAAtC,KAAsC;AACjF,SAAO;AAAK,IAAA,KAAK,EAAEA,QAAQ,GAAG;AAACC,MAAAA,OAAO,EAAE,cAAV;AAA0BC,MAAAA,KAAK,EAAEH;AAAjC,KAAH,GAA4C;AAACI,MAAAA,MAAM,EAAEJ;AAAT;AAAhE,IAAP;AACD","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\nexport interface SpacerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  size?: number;\n  vertical?: boolean;\n}\n\nexport function Spacer({size = 8, vertical = false}: SpacerProps): React.ReactNode {\n  return <div style={vertical ? {display: 'inline-block', width: size} : {height: size}} />;\n}\n"],"file":"Spacer.js"}

package/src/Layout/StyledApp.d.ts

@@ -1,5 +1,6 @@
 /** @jsx jsx */
 import React from 'react';
+import { jsx } from '@emotion/react';
 import { THEME_ID } from './Theme';
 export interface StyledAppContainerProps<T = HTMLDivElement> extends React.HTMLProps<T> {
     backgroundColor?: string;
@@ -9,4 +10,4 @@ export declare const StyledApp: ({ themeId, children, ...props }: {
     [x: string]: any;
     themeId?: THEME_ID;
     children: any;
-}) => JSX.Element;
+}) => jsx.JSX.Element;

package/src/Layout/StyledApp.js

@@ -13,7 +13,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _react = _interopRequireDefault(require("react"));
 
-var _core = require("@emotion/core");
+var _react2 = require("@emotion/react");
 
 var _GlobalStyle = require("../GlobalStyle");
 
@@ -37,7 +37,7 @@ var filterStyledAppContainerProps = function filterStyledAppContainerProps(props
 };
 
 var StyledAppContainer = function StyledAppContainer(props) {
-  return (0, _core.jsx)("div", (0, _extends2["default"])({
+  return (0, _react2.jsx)("div", (0, _extends2["default"])({
     css: function css(theme) {
       return styledAppContainerStyle(theme, props);
     }
@@ -49,9 +49,9 @@ var StyledApp = function StyledApp(_ref2) {
       themeId = _ref2$themeId === void 0 ? _Theme.THEME_ID.LIGHT : _ref2$themeId,
       children = _ref2.children,
       props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
-  return (0, _core.jsx)(_Theme.ThemeProvider, {
+  return (0, _react2.jsx)(_Theme.ThemeProvider, {
     themeId: themeId
-  }, (0, _core.jsx)(StyledAppContainer, props, (0, _core.jsx)(_GlobalStyle.GlobalStyle, null), children));
+  }, (0, _react2.jsx)(StyledAppContainer, props, (0, _react2.jsx)(_GlobalStyle.GlobalStyle, null), children));
 };
 
 exports.StyledApp = StyledApp;

package/src/Layout/StyledApp.js.map

@@ -1 +1 @@
-{"version":3,"sources":["StyledApp.tsx"],"names":["styledAppContainerStyle","theme","backgroundColor","general","background","transition","filterStyledAppContainerProps","props","StyledAppContainer","StyledApp","themeId","THEME_ID","LIGHT","children"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;AACA;;;;AAOA,IAAMA,uBAA0F,GAAG,SAA7FA,uBAA6F,CACjGC,KADiG;AAAA,kCAEhGC,eAFgG;AAAA,MAEhGA,eAFgG,qCAE9ED,KAAK,CAACE,OAAN,CAAcD,eAFgE;AAAA,SAG7F;AACJE,IAAAA,UAAU,EAAEF,eADR;AAEJG,IAAAA,UAAU,EAAE;AAFR,GAH6F;AAAA,CAAnG;;AAQA,IAAMC,6BAA6B,GAAG,SAAhCA,6BAAgC,CAACC,KAAD;AAAA,SACpC,uBAAYA,KAAZ,EAAmB,CAAC,iBAAD,EAAoB,SAApB,CAAnB,CADoC;AAAA,CAAtC;;AAGA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACD,KAAD;AAAA,SACzB;AAAK,IAAA,GAAG,EAAE,aAAAN,KAAK;AAAA,aAAID,uBAAuB,CAACC,KAAD,EAAQM,KAAR,CAA3B;AAAA;AAAf,KAA8DD,6BAA6B,CAACC,KAAD,CAA3F,EADyB;AAAA,CAA3B;;AAIO,IAAME,SAAS,GAAG,SAAZA,SAAY;AAAA,4BAAEC,OAAF;AAAA,MAAEA,OAAF,8BAAYC,gBAASC,KAArB;AAAA,MAA4BC,QAA5B,SAA4BA,QAA5B;AAAA,MAAyCN,KAAzC;AAAA,SACvB,eAAC,oBAAD;AAAe,IAAA,OAAO,EAAEG;AAAxB,KACE,eAAC,kBAAD,EAAwBH,KAAxB,EACE,eAAC,wBAAD,OADF,EAEGM,QAFH,CADF,CADuB;AAAA,CAAlB","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 React from 'react';\nimport {CSSObject, jsx} from '@emotion/core';\n\nimport {GlobalStyle} from '../GlobalStyle';\nimport {filterProps} from '../util';\nimport {THEME_ID, Theme, ThemeProvider} from './Theme';\n\nexport interface StyledAppContainerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  backgroundColor?: string;\n  themeId?: THEME_ID;\n}\n\nconst styledAppContainerStyle: <T>(theme: Theme, props: StyledAppContainerProps<T>) => CSSObject = (\n  theme,\n  {backgroundColor = theme.general.backgroundColor},\n) => ({\n  background: backgroundColor,\n  transition: 'background 0.15s',\n});\n\nconst filterStyledAppContainerProps = (props: StyledAppContainerProps) =>\n  filterProps(props, ['backgroundColor', 'themeId']);\n\nconst StyledAppContainer = (props: StyledAppContainerProps) => (\n  <div css={theme => styledAppContainerStyle(theme, props)} {...filterStyledAppContainerProps(props)} />\n);\n\nexport const StyledApp = ({themeId = THEME_ID.LIGHT, children, ...props}) => (\n  <ThemeProvider themeId={themeId}>\n    <StyledAppContainer {...props}>\n      <GlobalStyle />\n      {children}\n    </StyledAppContainer>\n  </ThemeProvider>\n);\n"],"file":"StyledApp.js"}
+{"version":3,"sources":["StyledApp.tsx"],"names":["styledAppContainerStyle","theme","backgroundColor","general","background","transition","filterStyledAppContainerProps","props","StyledAppContainer","StyledApp","themeId","THEME_ID","LIGHT","children"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;AACA;;;;AAOA,IAAMA,uBAA0F,GAAG,SAA7FA,uBAA6F,CACjGC,KADiG;AAAA,kCAEhGC,eAFgG;AAAA,MAEhGA,eAFgG,qCAE9ED,KAAK,CAACE,OAAN,CAAcD,eAFgE;AAAA,SAG7F;AACJE,IAAAA,UAAU,EAAEF,eADR;AAEJG,IAAAA,UAAU,EAAE;AAFR,GAH6F;AAAA,CAAnG;;AAQA,IAAMC,6BAA6B,GAAG,SAAhCA,6BAAgC,CAACC,KAAD;AAAA,SACpC,uBAAYA,KAAZ,EAAmB,CAAC,iBAAD,EAAoB,SAApB,CAAnB,CADoC;AAAA,CAAtC;;AAGA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACD,KAAD;AAAA,SACzB;AAAK,IAAA,GAAG,EAAE,aAACN,KAAD;AAAA,aAAkBD,uBAAuB,CAACC,KAAD,EAAQM,KAAR,CAAzC;AAAA;AAAV,KAAuED,6BAA6B,CAACC,KAAD,CAApG,EADyB;AAAA,CAA3B;;AAIO,IAAME,SAAS,GAAG,SAAZA,SAAY;AAAA,4BAAEC,OAAF;AAAA,MAAEA,OAAF,8BAAYC,gBAASC,KAArB;AAAA,MAA4BC,QAA5B,SAA4BA,QAA5B;AAAA,MAAyCN,KAAzC;AAAA,SACvB,iBAAC,oBAAD;AAAe,IAAA,OAAO,EAAEG;AAAxB,KACE,iBAAC,kBAAD,EAAwBH,KAAxB,EACE,iBAAC,wBAAD,OADF,EAEGM,QAFH,CADF,CADuB;AAAA,CAAlB","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 React from 'react';\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {GlobalStyle} from '../GlobalStyle';\nimport {filterProps} from '../util';\nimport {THEME_ID, Theme, ThemeProvider} from './Theme';\n\nexport interface StyledAppContainerProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  backgroundColor?: string;\n  themeId?: THEME_ID;\n}\n\nconst styledAppContainerStyle: <T>(theme: Theme, props: StyledAppContainerProps<T>) => CSSObject = (\n  theme,\n  {backgroundColor = theme.general.backgroundColor},\n) => ({\n  background: backgroundColor,\n  transition: 'background 0.15s',\n});\n\nconst filterStyledAppContainerProps = (props: StyledAppContainerProps) =>\n  filterProps(props, ['backgroundColor', 'themeId']);\n\nconst StyledAppContainer = (props: StyledAppContainerProps) => (\n  <div css={(theme: Theme) => styledAppContainerStyle(theme, props)} {...filterStyledAppContainerProps(props)} />\n);\n\nexport const StyledApp = ({themeId = THEME_ID.LIGHT, children, ...props}) => (\n  <ThemeProvider themeId={themeId}>\n    <StyledAppContainer {...props}>\n      <GlobalStyle />\n      {children}\n    </StyledAppContainer>\n  </ThemeProvider>\n);\n"],"file":"StyledApp.js"}

package/src/Layout/Theme.d.ts

@@ -1,3 +1,5 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import React from 'react';
 export declare enum THEME_ID {
     DARK = "THEME_DARK",
@@ -20,4 +22,4 @@ export declare const themes: {
 export interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {
     themeId: THEME_ID;
 }
-export declare const ThemeProvider: (props: ThemeProps) => JSX.Element;
+export declare const ThemeProvider: (props: ThemeProps) => jsx.JSX.Element;

package/src/Layout/Theme.js

@@ -11,11 +11,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _core = require("@emotion/core");
+var _react = require("@emotion/react");
 
-var _react = _interopRequireDefault(require("react"));
-
-var _emotionTheming = require("emotion-theming");
+var _react2 = _interopRequireDefault(require("react"));
 
 var _colors = require("../Identity/colors");
 
@@ -59,7 +57,7 @@ var filterThemeProps = function filterThemeProps(props) {
 };
 
 var ThemeProvider = function ThemeProvider(props) {
-  return (0, _core.jsx)(_emotionTheming.ThemeProvider, (0, _extends2["default"])({
+  return (0, _react.jsx)(_react.ThemeProvider, (0, _extends2["default"])({
     theme: themes[props.themeId]
   }, filterThemeProps(props)));
 };

package/src/Layout/Theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","DISABLED","placeholderColor","GRAY_DARKEN_24","general","GRAY_LIGHTEN_88","color","TEXT","DARK","BLACK_LIGHTEN_24","BLACK","filterThemeProps","props","ThemeProvider","themeId"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AACA;;AAEA;;AACA;;;;IAEYA,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;AAiBL,IAAMC,MAAsC,4DAChDD,QAAQ,CAACE,KADuC,EAC/B;AAChBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMC,KADlB;AAELC,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMK;AAHnB,GADS;AAMhBC,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMO,eADhB;AAEPC,IAAAA,KAAK,EAAER,cAAMS;AAFN;AANO,CAD+B,6CAYhDd,QAAQ,CAACe,IAZuC,EAYhC;AACfZ,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMW,gBADlB;AAELT,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMO;AAHnB,GADQ;AAMfD,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMY,KADhB;AAEPJ,IAAAA,KAAK,EAAER,cAAMC;AAFN;AANM,CAZgC,WAA5C;;;AA6BP,IAAMY,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD;AAAA,SAAuB,uBAAYA,KAAZ,EAAmB,CAAC,SAAD,CAAnB,CAAvB;AAAA,CAAzB;;AAEO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACD,KAAD;AAAA,SAC3B,eAAC,6BAAD;AAAsB,IAAA,KAAK,EAAElB,MAAM,CAACkB,KAAK,CAACE,OAAP;AAAnC,KAAwDH,gBAAgB,CAACC,KAAD,CAAxE,EAD2B;AAAA,CAAtB","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/core';\nimport React from 'react';\nimport {ThemeProvider as EmotionThemeProvider} from 'emotion-theming';\n\nimport {COLOR} from '../Identity/colors';\nimport {filterProps} from '../util';\n\nexport enum THEME_ID {\n  DARK = 'THEME_DARK',\n  LIGHT = 'THEME_LIGHT',\n}\n\nexport interface Theme {\n  general: {\n    backgroundColor: string;\n    color: string;\n  };\n  Input: {\n    backgroundColor: string;\n    backgroundColorDisabled: string;\n    placeholderColor: string;\n  };\n}\n\nexport const themes: {[themeId in THEME_ID]: Theme} = {\n  [THEME_ID.LIGHT]: {\n    Input: {\n      backgroundColor: COLOR.WHITE,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_DARKEN_24,\n    },\n    general: {\n      backgroundColor: COLOR.GRAY_LIGHTEN_88,\n      color: COLOR.TEXT,\n    },\n  },\n  [THEME_ID.DARK]: {\n    Input: {\n      backgroundColor: COLOR.BLACK_LIGHTEN_24,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_LIGHTEN_88,\n    },\n    general: {\n      backgroundColor: COLOR.BLACK,\n      color: COLOR.WHITE,\n    },\n  },\n};\n\nexport interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  themeId: THEME_ID;\n}\n\nconst filterThemeProps = (props: ThemeProps) => filterProps(props, ['themeId']);\n\nexport const ThemeProvider = (props: ThemeProps) => (\n  <EmotionThemeProvider theme={themes[props.themeId]} {...filterThemeProps(props)} />\n);\n"],"file":"Theme.js"}
+{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","DISABLED","placeholderColor","GRAY_DARKEN_24","general","GRAY_LIGHTEN_88","color","TEXT","DARK","BLACK_LIGHTEN_24","BLACK","filterThemeProps","props","ThemeProvider","themeId"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;;;IAEYA,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;AAiBL,IAAMC,MAAsC,4DAChDD,QAAQ,CAACE,KADuC,EAC/B;AAChBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMC,KADlB;AAELC,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMK;AAHnB,GADS;AAMhBC,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMO,eADhB;AAEPC,IAAAA,KAAK,EAAER,cAAMS;AAFN;AANO,CAD+B,6CAYhDd,QAAQ,CAACe,IAZuC,EAYhC;AACfZ,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMW,gBADlB;AAELT,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMO;AAHnB,GADQ;AAMfD,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMY,KADhB;AAEPJ,IAAAA,KAAK,EAAER,cAAMC;AAFN;AANM,CAZgC,WAA5C;;;AA6BP,IAAMY,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD;AAAA,SAAuB,uBAAYA,KAAZ,EAAmB,CAAC,SAAD,CAAnB,CAAvB;AAAA,CAAzB;;AAEO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACD,KAAD;AAAA,SAC3B,gBAAC,oBAAD;AAAsB,IAAA,KAAK,EAAElB,MAAM,CAACkB,KAAK,CAACE,OAAP;AAAnC,KAAwDH,gBAAgB,CAACC,KAAD,CAAxE,EAD2B;AAAA,CAAtB","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, ThemeProvider as EmotionThemeProvider} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity/colors';\nimport {filterProps} from '../util';\n\nexport enum THEME_ID {\n  DARK = 'THEME_DARK',\n  LIGHT = 'THEME_LIGHT',\n}\n\nexport interface Theme {\n  general: {\n    backgroundColor: string;\n    color: string;\n  };\n  Input: {\n    backgroundColor: string;\n    backgroundColorDisabled: string;\n    placeholderColor: string;\n  };\n}\n\nexport const themes: {[themeId in THEME_ID]: Theme} = {\n  [THEME_ID.LIGHT]: {\n    Input: {\n      backgroundColor: COLOR.WHITE,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_DARKEN_24,\n    },\n    general: {\n      backgroundColor: COLOR.GRAY_LIGHTEN_88,\n      color: COLOR.TEXT,\n    },\n  },\n  [THEME_ID.DARK]: {\n    Input: {\n      backgroundColor: COLOR.BLACK_LIGHTEN_24,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_LIGHTEN_88,\n    },\n    general: {\n      backgroundColor: COLOR.BLACK,\n      color: COLOR.WHITE,\n    },\n  },\n};\n\nexport interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  themeId: THEME_ID;\n}\n\nconst filterThemeProps = (props: ThemeProps) => filterProps(props, ['themeId']);\n\nexport const ThemeProvider = (props: ThemeProps) => (\n  <EmotionThemeProvider theme={themes[props.themeId]} {...filterThemeProps(props)} />\n);\n"],"file":"Theme.js"}