import React, { useState } from 'react';
import Box from '@material-ui/core/Box';
import Button from '@material-ui/core/Button';
import Drawer from '@material-ui/core/Drawer';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import useMediaQuery from '@material-ui/core/useMediaQuery';
import { useTheme } from '@material-ui/core/styles';
import FilterListIcon from '@material-ui/icons/FilterList';

function Filters(props) {
  const isScreenSmallerThanBreakpoint = useMediaQuery(
    (theme2) => theme2.breakpoints.down(props.options?.drawerBreakpoint ?? "md")
  );
  const theme = useTheme();
  const [filterDrawerOpen, setFilterDrawerOpen] = useState(false);
  return isScreenSmallerThanBreakpoint ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
    Button,
    {
      style: { marginTop: theme.spacing(1), marginLeft: theme.spacing(1) },
      onClick: () => setFilterDrawerOpen(true),
      startIcon: /* @__PURE__ */ React.createElement(FilterListIcon, null)
    },
    "Filters"
  ), /* @__PURE__ */ React.createElement(
    Drawer,
    {
      open: filterDrawerOpen,
      onClose: () => setFilterDrawerOpen(false),
      anchor: props.options?.drawerAnchor ?? "left",
      disableAutoFocus: true,
      keepMounted: true,
      variant: "temporary"
    },
    /* @__PURE__ */ React.createElement(Box, { m: 2 }, /* @__PURE__ */ React.createElement(
      Typography,
      {
        variant: "h6",
        component: "h2",
        style: { marginBottom: theme.spacing(1) }
      },
      "Filters"
    ), props.children)
  )) : /* @__PURE__ */ React.createElement(Grid, { item: true, lg: 2 }, props.children);
}
function Table(props) {
  return /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, lg: 10 }, props.children);
}
function IndexPageLayout(props) {
  return /* @__PURE__ */ React.createElement(Grid, { container: true, style: { position: "relative" } }, props.children);
}
IndexPageLayout.Filters = Filters;
IndexPageLayout.Table = Table;

export { Filters, IndexPageLayout, Table };
//# sourceMappingURL=IndexPageLayout.esm.js.map
