@wireapp/react-ui-kit 8.14.3 → 8.14.6

package/src/Layout/Container.js

@@ -0,0 +1,128 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContainerXXS = exports.ContainerXS = exports.ContainerSM = exports.ContainerMD = exports.ContainerLG = exports.Container = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _mediaQueries = require("../mediaQueries");
+
+var _util = require("../util");
+
+var _sizes = require("./sizes");
+
+/*
+ * 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/.
+ *
+ */
+
+/** @jsx jsx */
+var LEVEL = {
+  lg: _sizes.WIDTH.DESKTOP_MAX,
+  md: _sizes.WIDTH.TABLET_MAX,
+  sm: _sizes.WIDTH.TABLET_MIN,
+  xs: _sizes.WIDTH.MOBILE,
+  xxs: _sizes.WIDTH.TINY
+};
+
+var containerStyle = function containerStyle(_ref) {
+  var _ref$centerText = _ref.centerText,
+      centerText = _ref$centerText === void 0 ? false : _ref$centerText,
+      _ref$level = _ref.level,
+      level = _ref$level === void 0 ? undefined : _ref$level,
+      _ref$verticalCenter = _ref.verticalCenter,
+      verticalCenter = _ref$verticalCenter === void 0 ? false : _ref$verticalCenter;
+  return (0, _defineProperty2["default"])({
+    margin: verticalCenter ? 'auto' : '0 auto',
+    maxWidth: level ? "".concat(LEVEL[level], "px") : undefined,
+    position: 'relative',
+    textAlign: centerText ? 'center' : 'left',
+    width: '100%'
+  }, _mediaQueries.media[_mediaQueries.QueryKeys.DESKTOP], level ? undefined : {
+    padding: 0,
+    width: "".concat(_sizes.WIDTH.DESKTOP_MIN - _sizes.GUTTER * 2, "px")
+  });
+};
+
+var filterContainerProps = function filterContainerProps(props) {
+  return (0, _util.filterProps)(props, ['centerText', 'level', 'verticalCenter']);
+};
+
+var Container = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)("div", (0, _extends2["default"])({
+    ref: ref,
+    css: containerStyle(props)
+  }, filterContainerProps(props)));
+});
+
+exports.Container = Container;
+
+var ContainerLG = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
+    ref: ref,
+    level: 'lg'
+  }, props));
+});
+
+exports.ContainerLG = ContainerLG;
+
+var ContainerMD = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
+    ref: ref,
+    level: 'md'
+  }, props));
+});
+
+exports.ContainerMD = ContainerMD;
+
+var ContainerSM = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
+    ref: ref,
+    level: 'sm'
+  }, props));
+});
+
+exports.ContainerSM = ContainerSM;
+
+var ContainerXS = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
+    ref: ref,
+    level: 'xs'
+  }, props));
+});
+
+exports.ContainerXS = ContainerXS;
+
+var ContainerXXS = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)(Container, (0, _extends2["default"])({
+    ref: ref,
+    level: 'xxs'
+  }, props));
+});
+
+exports.ContainerXXS = ContainerXXS;
+//# sourceMappingURL=Container.js.map

package/src/Layout/Container.js.map

@@ -0,0 +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/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.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=Content.d.js.map

package/src/Layout/Content.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"Content.d.js"}

package/src/Layout/Content.d.ts

@@ -0,0 +1,6 @@
+/** @jsx jsx */
+import React from 'react';
+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.JSX.Element;

package/src/Layout/Content.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Content = exports.contentStyle = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@emotion/react");
+
+var _sizes = require("./sizes");
+
+/*
+ * 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/.
+ *
+ */
+
+/** @jsx jsx */
+var contentStyle = function contentStyle(props) {
+  return {
+    display: 'flex',
+    flexDirection: 'column',
+    flexGrow: 1,
+    padding: "0 ".concat(_sizes.GUTTER, "px")
+  };
+};
+
+exports.contentStyle = contentStyle;
+
+var Content = function Content(props) {
+  return (0, _react2.jsx)("div", (0, _extends2["default"])({
+    css: contentStyle(props)
+  }, props));
+};
+
+exports.Content = Content;
+//# sourceMappingURL=Content.js.map

package/src/Layout/Content.js.map

@@ -0,0 +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/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.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=FlexBox.d.js.map

package/src/Layout/FlexBox.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"FlexBox.d.js"}

package/src/Layout/FlexBox.d.ts

@@ -0,0 +1,13 @@
+/** @jsx jsx */
+import { CSSObject } from '@emotion/react';
+import { Property } from 'csstype';
+import React from 'react';
+export interface FlexBoxProps<T = HTMLDivElement> extends React.PropsWithRef<React.HTMLProps<T>> {
+    align?: string;
+    column?: boolean;
+    flexWrap?: Property.FlexWrap;
+    justify?: string;
+}
+export declare const flexBoxStyle: <T>(props: FlexBoxProps<T>) => CSSObject;
+export declare const filterFlexBoxProps: (props: FlexBoxProps) => Object;
+export declare const FlexBox: React.FC<FlexBoxProps>;

package/src/Layout/FlexBox.js

@@ -0,0 +1,72 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FlexBox = exports.filterFlexBoxProps = exports.flexBoxStyle = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+var _util = require("../util");
+
+/*
+ * Wire
+ * Copyright (C) 2017 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/.
+ *
+ */
+
+/** @jsx jsx */
+var flexBoxStyle = function flexBoxStyle(_ref) {
+  var _ref$align = _ref.align,
+      align = _ref$align === void 0 ? 'flex-start' : _ref$align,
+      _ref$column = _ref.column,
+      column = _ref$column === void 0 ? false : _ref$column,
+      _ref$justify = _ref.justify,
+      justify = _ref$justify === void 0 ? 'flex-start' : _ref$justify,
+      _ref$flexWrap = _ref.flexWrap,
+      flexWrap = _ref$flexWrap === void 0 ? 'nowrap' : _ref$flexWrap;
+  return {
+    alignItems: align,
+    display: 'flex',
+    flexDirection: column ? 'column' : 'row',
+    flexWrap: flexWrap,
+    justifyContent: justify
+  };
+};
+
+exports.flexBoxStyle = flexBoxStyle;
+
+var filterFlexBoxProps = function filterFlexBoxProps(props) {
+  return (0, _util.filterProps)(props, ['align', 'column', 'justify', 'flexWrap']);
+};
+
+exports.filterFlexBoxProps = filterFlexBoxProps;
+
+var FlexBox = /*#__PURE__*/_react2["default"].forwardRef(function (props, ref) {
+  return (0, _react.jsx)("div", (0, _extends2["default"])({
+    ref: ref,
+    css: flexBoxStyle(props)
+  }, filterFlexBoxProps(props)));
+});
+
+exports.FlexBox = FlexBox;
+//# sourceMappingURL=FlexBox.js.map

package/src/Layout/FlexBox.js.map

@@ -0,0 +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,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 {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.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=Footer.d.js.map

package/src/Layout/Footer.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"Footer.d.js"}

package/src/Layout/Footer.d.ts

@@ -0,0 +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.JSX.Element;
+export {};

package/src/Layout/Footer.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Footer = void 0;
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+/*
+ * 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/.
+ *
+ */
+
+/** @jsx jsx */
+var Footer = function Footer(props) {
+  return (0, _react.jsx)("footer", props);
+};
+
+exports.Footer = Footer;
+//# sourceMappingURL=Footer.js.map

package/src/Layout/Footer.js.map

@@ -0,0 +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,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.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=Header.d.js.map

package/src/Layout/Header.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"Header.d.js"}

package/src/Layout/Header.d.ts

@@ -0,0 +1,6 @@
+/** @jsx jsx */
+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.JSX.Element;

package/src/Layout/Header.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Header = exports.headerStyle = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireDefault(require("react"));
+
+/*
+ * 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/.
+ *
+ */
+
+/** @jsx jsx */
+var headerStyle = function headerStyle(props) {
+  return {
+    alignItems: 'center',
+    display: 'flex',
+    height: '64px',
+    justifyContent: 'space-between'
+  };
+};
+
+exports.headerStyle = headerStyle;
+
+var Header = function Header(props) {
+  return (0, _react.jsx)("header", (0, _extends2["default"])({
+    css: headerStyle(props)
+  }, props));
+};
+
+exports.Header = Header;
+//# sourceMappingURL=Header.js.map

package/src/Layout/Header.js.map

@@ -0,0 +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/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.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=MatchMedia.d.js.map

package/src/Layout/MatchMedia.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"MatchMedia.d.js"}

package/src/Layout/MatchMedia.d.ts

@@ -0,0 +1,21 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import React, { ReactFragment } from 'react';
+import { QueryKeys } from '../mediaQueries';
+declare type Query = string | QueryKeys;
+export interface MatchMediaProps extends React.HTMLProps<ReactFragment> {
+    not?: boolean;
+    query: Query;
+}
+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.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

@@ -0,0 +1,147 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.IsTabletUp = exports.IsTabletDown = exports.IsTablet = exports.IsMobileUp = exports.IsMobileDown = exports.IsMobile = exports.IsDesktopXL = exports.IsDesktop = exports.MatchMedia = exports.useMatchMedia = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = require("@emotion/react");
+
+var _react2 = _interopRequireWildcard(require("react"));
+
+var _mediaQueries = require("../mediaQueries");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/*
+ * 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/.
+ *
+ */
+
+/** @jsx jsx */
+
+/* @jsxFrag React.Fragment */
+var useMatchMedia = function useMatchMedia(query) {
+  var matchMedia = (0, _react2.useMemo)(function () {
+    return window.matchMedia("(".concat(query, ")"));
+  }, [query]);
+
+  var _useState = (0, _react2.useState)(matchMedia.matches),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      isMatching = _useState2[0],
+      setIsMatching = _useState2[1];
+
+  var updateMatching = function updateMatching(event) {
+    setIsMatching(event.matches);
+  };
+
+  (0, _react2.useEffect)(function () {
+    matchMedia.addEventListener('change', updateMatching);
+    return function () {
+      return matchMedia.removeEventListener('change', updateMatching);
+    };
+  }, [matchMedia]);
+  return isMatching;
+};
+
+exports.useMatchMedia = useMatchMedia;
+
+var MatchMedia = function MatchMedia(_ref) {
+  var query = _ref.query,
+      children = _ref.children,
+      not = _ref.not;
+  var matchQuery = useMatchMedia(_mediaQueries.QUERY[query] || query);
+  var isMatching = not ? !matchQuery : matchQuery;
+  return isMatching ? (0, _react.jsx)(_react2["default"].Fragment, null, children) : null;
+};
+
+exports.MatchMedia = MatchMedia;
+
+var IsDesktop = function IsDesktop(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.DESKTOP
+  }, props));
+};
+
+exports.IsDesktop = IsDesktop;
+
+var IsDesktopXL = function IsDesktopXL(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.DESKTOP_XL
+  }, props));
+};
+
+exports.IsDesktopXL = IsDesktopXL;
+
+var IsMobile = function IsMobile(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.MOBILE
+  }, props));
+};
+
+exports.IsMobile = IsMobile;
+
+var IsMobileDown = function IsMobileDown(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.MOBILE_DOWN
+  }, props));
+};
+
+exports.IsMobileDown = IsMobileDown;
+
+var IsMobileUp = function IsMobileUp(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.MOBILE_UP
+  }, props));
+};
+
+exports.IsMobileUp = IsMobileUp;
+
+var IsTablet = function IsTablet(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.TABLET
+  }, props));
+};
+
+exports.IsTablet = IsTablet;
+
+var IsTabletDown = function IsTabletDown(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.TABLET_DOWN
+  }, props));
+};
+
+exports.IsTabletDown = IsTabletDown;
+
+var IsTabletUp = function IsTabletUp(props) {
+  return (0, _react.jsx)(MatchMedia, (0, _extends2["default"])({
+    query: _mediaQueries.QueryKeys.TABLET_UP
+  }, props));
+};
+
+exports.IsTabletUp = IsTabletUp;
+//# sourceMappingURL=MatchMedia.js.map