@activecollab/components
Version:
ActiveCollab Components
45 lines • 1.34 kB
JavaScript
import React, { forwardRef, useCallback } from "react";
import { StyledNavBarButton } from "./Styles";
import { ArrowRightIcon } from "../Icons";
import ArrowLeftIcon from "../Icons/collection/ArrowLeft";
export const NavBarElement = /*#__PURE__*/forwardRef((_ref, ref) => {
let {
onPreviousClick,
onNextClick
} = _ref;
const onPrevious = useCallback(() => {
onPreviousClick();
}, [onPreviousClick]);
const onNext = useCallback(() => {
onNextClick();
}, [onNextClick]);
return /*#__PURE__*/React.createElement("div", {
className: "c-DayPicker-NavBar",
ref: ref,
tabIndex: 0
}, /*#__PURE__*/React.createElement(StyledNavBarButton, {
type: "button",
variant: "text gray",
size: "small",
tabIndex: 0,
onClick: onPrevious,
$direction: "previous"
}, /*#__PURE__*/React.createElement(ArrowLeftIcon, {
"aria-label": "Previous Month",
width: "24",
height: "24"
})), /*#__PURE__*/React.createElement(StyledNavBarButton, {
type: "button",
variant: "text gray",
size: "small",
tabIndex: 0,
onClick: onNext,
$direction: "next"
}, /*#__PURE__*/React.createElement(ArrowRightIcon, {
"aria-label": "Next Month",
width: "24",
height: "24"
})));
});
NavBarElement.displayName = "NavBarElement";
//# sourceMappingURL=NavBarElement.js.map