@material-ui/lab/legacy/internal/pickers/PickersToolbar.js

Laboratory for new Material-UI modules.

import _extends from "@babel/runtime/helpers/esm/extends";

var _ClockIcon, _CalendarIcon, _PenIcon;

import * as React from 'react';
import clsx from 'clsx';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import IconButton from '@material-ui/core/IconButton';
import { styled } from '@material-ui/core/styles';
import { generateUtilityClasses } from '@material-ui/unstyled';
import PenIcon from '../svg-icons/Pen';
import CalendarIcon from '../svg-icons/Calendar';
import ClockIcon from '../svg-icons/Clock';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var classes = generateUtilityClasses('PrivatePickersToolbar', ['root', 'dateTitleContainer']);
var PickersToolbarRoot = styled('div', {
  skipSx: true
})(function (_ref) {
  var theme = _ref.theme,
      styleProps = _ref.styleProps;
  return _extends({
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'flex-start',
    justifyContent: 'space-between',
    padding: theme.spacing(2, 3)
  }, styleProps.isLandscape && {
    height: 'auto',
    maxWidth: 160,
    padding: 16,
    justifyContent: 'flex-start',
    flexWrap: 'wrap'
  });
});
var PickersToolbarGrid = styled(Grid, {
  skipSx: true
})({
  flex: 1
});

var getViewTypeIcon = function getViewTypeIcon(viewType) {
  return viewType === 'clock' ? _ClockIcon || (_ClockIcon = /*#__PURE__*/_jsx(ClockIcon, {
    color: "inherit"
  })) : _CalendarIcon || (_CalendarIcon = /*#__PURE__*/_jsx(CalendarIcon, {
    color: "inherit"
  }));
};

function defaultGetKeyboardInputSwitchingButtonText(isKeyboardInputOpen, viewType) {
  return isKeyboardInputOpen ? "text input view is open, go to ".concat(viewType, " view") : "".concat(viewType, " view is open, go to text input view");
}

var PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersToolbar(props, ref) {
  var children = props.children,
      className = props.className,
      _props$getMobileKeybo = props.getMobileKeyboardInputViewButtonText,
      getMobileKeyboardInputViewButtonText = _props$getMobileKeybo === void 0 ? defaultGetKeyboardInputSwitchingButtonText : _props$getMobileKeybo,
      isLandscape = props.isLandscape,
      isMobileKeyboardViewOpen = props.isMobileKeyboardViewOpen,
      _props$landscapeDirec = props.landscapeDirection,
      landscapeDirection = _props$landscapeDirec === void 0 ? 'column' : _props$landscapeDirec,
      penIconClassName = props.penIconClassName,
      toggleMobileKeyboardView = props.toggleMobileKeyboardView,
      toolbarTitle = props.toolbarTitle,
      _props$viewType = props.viewType,
      viewType = _props$viewType === void 0 ? 'calendar' : _props$viewType;
  var styleProps = props;
  return /*#__PURE__*/_jsxs(PickersToolbarRoot, {
    ref: ref,
    className: clsx(classes.root, className),
    styleProps: styleProps,
    children: [/*#__PURE__*/_jsx(Typography, {
      color: "text.secondary",
      variant: "overline",
      children: toolbarTitle
    }), /*#__PURE__*/_jsxs(PickersToolbarGrid, {
      container: true,
      justifyContent: "space-between",
      className: classes.dateTitleContainer,
      direction: isLandscape ? landscapeDirection : 'row',
      alignItems: isLandscape ? 'flex-start' : 'flex-end',
      children: [children, /*#__PURE__*/_jsx(IconButton, {
        onClick: toggleMobileKeyboardView,
        className: penIconClassName,
        color: "inherit",
        "aria-label": getMobileKeyboardInputViewButtonText(isMobileKeyboardViewOpen, viewType),
        children: isMobileKeyboardViewOpen ? getViewTypeIcon(viewType) : _PenIcon || (_PenIcon = /*#__PURE__*/_jsx(PenIcon, {
          color: "inherit"
        }))
      })]
    })]
  });
});
export default PickersToolbar;