UNPKG

@bee-design/ui

Version:

Bee Design React UI Library.

82 lines (81 loc) 4.54 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); var react_1 = __importDefault(require("react")); var IconLeft_1 = __importDefault(require("../../../icon/react-icon-cjs/IconLeft")); var IconRight_1 = __importDefault(require("../../../icon/react-icon-cjs/IconRight")); var IconUp_1 = __importDefault(require("../../../icon/react-icon-cjs/IconUp")); var IconDown_1 = __importDefault(require("../../../icon/react-icon-cjs/IconDown")); var icon_hover_1 = __importDefault(require("../../_class/icon-hover")); var classNames_1 = __importDefault(require("../../_util/classNames")); var TabNavIcon = function (props) { var _a, _b, _c, _d; var direction = props.direction, headerSize = props.headerSize, headerWrapperSize = props.headerWrapperSize, prefixCls = props.prefixCls, iconPos = props.iconPos, curOffset = props.currentOffset, align = props.align, rtl = props.rtl; var wrapHeight = headerWrapperSize.height, wrapWidth = headerWrapperSize.width; var headerHeight = headerSize.height, headerWidth = headerSize.width; var maxHeightOffset = headerHeight - wrapHeight; var maxWidthOffset = headerWidth - wrapWidth; var onChange = function (offset) { if (offset !== props.currentOffset) { props.onChange && props.onChange(offset); } }; var handleHozClick = function (e, pos) { e.preventDefault(); var nextOffset; if (align === 'left') { nextOffset = pos === 'left' ? curOffset - wrapWidth : curOffset + wrapWidth; } else { nextOffset = pos === 'left' ? curOffset + wrapWidth : curOffset - wrapWidth; } onChange(nextOffset); }; var handleVerticalClick = function (e, pos) { e.preventDefault(); var nextOffset; if (pos === 'up') { nextOffset = curOffset - wrapHeight; } else { nextOffset = curOffset + wrapHeight; if (nextOffset >= headerHeight) return; } onChange(nextOffset); }; var disabledPrev = false; var disabledNext = false; if (align === 'left') { disabledPrev = curOffset <= 0; disabledNext = direction === 'vertical' ? curOffset >= maxHeightOffset : curOffset >= maxWidthOffset; } else { disabledPrev = direction === 'vertical' ? curOffset >= maxHeightOffset : curOffset >= maxWidthOffset; disabledNext = curOffset <= 0; } return direction === 'vertical' ? (iconPos === 'prev' ? (react_1.default.createElement(icon_hover_1.default, { disabled: disabledPrev, prefix: prefixCls, className: (0, classNames_1.default)(prefixCls + "-up-icon", (_a = {}, _a[prefixCls + "-nav-icon-disabled"] = disabledPrev, _a)), onClick: function (e) { handleVerticalClick(e, 'up'); } }, react_1.default.createElement(IconUp_1.default, null))) : (react_1.default.createElement(icon_hover_1.default, { prefix: prefixCls, className: (0, classNames_1.default)(prefixCls + "-down-icon", (_b = {}, _b[prefixCls + "-nav-icon-disabled"] = disabledNext, _b)), disabled: disabledNext, onClick: function (e) { handleVerticalClick(e, 'down'); } }, react_1.default.createElement(IconDown_1.default, null)))) : iconPos === 'prev' ? (react_1.default.createElement(icon_hover_1.default, { prefix: prefixCls, disabled: disabledPrev, className: (0, classNames_1.default)(prefixCls + "-left-icon", (_c = {}, _c[prefixCls + "-nav-icon-disabled"] = disabledPrev, _c)), onClick: function (e) { handleHozClick(e, 'left'); } }, rtl ? react_1.default.createElement(IconRight_1.default, null) : react_1.default.createElement(IconLeft_1.default, null))) : (react_1.default.createElement(icon_hover_1.default, { prefix: prefixCls, className: (0, classNames_1.default)(prefixCls + "-right-icon", (_d = {}, _d[prefixCls + "-nav-icon-disabled"] = disabledNext, _d)), disabled: disabledNext, onClick: function (e) { handleHozClick(e, 'right'); } }, rtl ? react_1.default.createElement(IconLeft_1.default, null) : react_1.default.createElement(IconRight_1.default, null))); }; exports.default = TabNavIcon;