import React from "react";
import styled from "styled-components";
import { Tabs, Tab } from "../../../components/tabs";
import Flex from "../../../components/templates/flex";
import Mouse from "./mouse";
import Touch from "./touch";
var StyledTabs = styled(Tabs).withConfig({
  displayName: "dashboard__StyledTabs",
  componentId: "sc-8t9551-0"
})(["width:100%;.tabs > *{min-width:initial;max-width:initial;}"]);
var Dashboard = function Dashboard() {
  return /*#__PURE__*/React.createElement(Flex, {
    overflow: {
      vertical: "auto"
    },
    "data-testid": "dashboard"
  }, /*#__PURE__*/React.createElement(StyledTabs, null, /*#__PURE__*/React.createElement(Tab, {
    label: "Using a Mouse"
  }, /*#__PURE__*/React.createElement(Mouse, null)), /*#__PURE__*/React.createElement(Tab, {
    label: "Using Touch"
  }, /*#__PURE__*/React.createElement(Touch, null))));
};
export default Dashboard;