@idares-ui/react
Version:
18 lines • 1.62 kB
JavaScript
"use strict";
exports.__esModule = true;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var enum_1 = require("../utils/enum");
var arrow_1 = tslib_1.__importDefault(require("../assets/arrow"));
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
var ArrowButton = function (_a) {
var type = _a.type;
return (React.createElement(Container, null,
React.createElement(React.Fragment, null,
type === enum_1.NAVIGATION_BUTTON_TYPES.PREVIOUS && (React.createElement(arrow_1["default"], { className: "arrow previous" })),
type === enum_1.NAVIGATION_BUTTON_TYPES.NEXT && (React.createElement(arrow_1["default"], { className: "arrow next" })))));
};
exports["default"] = ArrowButton;
var Container = styled_components_1["default"].div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: grid;\n place-items: center;\n\n .arrow {\n width: 0.8em;\n\n &.previous {\n transform: rotate(90deg);\n }\n\n &.next {\n transform: rotate(-90deg);\n }\n }\n\n &:hover {\n .arrow {\n fill: var(--color-primary);\n transition: fill 0s ease-in-out;\n }\n }\n"], ["\n display: grid;\n place-items: center;\n\n .arrow {\n width: 0.8em;\n\n &.previous {\n transform: rotate(90deg);\n }\n\n &.next {\n transform: rotate(-90deg);\n }\n }\n\n &:hover {\n .arrow {\n fill: var(--color-primary);\n transition: fill 0s ease-in-out;\n }\n }\n"])));
var templateObject_1;
//# sourceMappingURL=ArrowButton.js.map