@nutui/nutui-react/dist/es/packages/fixednav/fixednav.js

京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序

import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
import React from "react";
import classNames from "classnames";
import { ArrowLeft } from "@nutui/icons-react";
import Overlay from "../overlay/index";
import { useConfig } from "../configprovider";
import { defaultOverlayProps } from "../overlay/overlay";
import Badge from "../badge/index";
var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps), {
    activeText: '',
    inactiveText: '',
    type: 'right',
    list: [],
    overlay: true,
    position: {
        top: 'auto',
        bottom: 'auto'
    },
    zIndex: 200,
    onChange: function(value) {},
    onSelect: function() {}
});
export var FixedNav = function(props) {
    var locale = useConfig().locale;
    var _ref = _object_spread({}, defaultProps, props), overlay = _ref.overlay, visible = _ref.visible, list = _ref.list, activeText = _ref.activeText, inactiveText = _ref.inactiveText, position = _ref.position, type = _ref.type, children = _ref.children, style = _ref.style, className = _ref.className, content = _ref.content, zIndex = _ref.zIndex, onChange = _ref.onChange, onSelect = _ref.onSelect, rest = _object_without_properties(_ref, [
        "overlay",
        "visible",
        "list",
        "activeText",
        "inactiveText",
        "position",
        "type",
        "children",
        "style",
        "className",
        "content",
        "zIndex",
        "onChange",
        "onSelect"
    ]);
    var classPrefix = 'nut-fixednav';
    var classes = classNames(classPrefix, {
        active: visible
    }, "".concat(classPrefix, "-").concat(type), className);
    var renderListItem = function(item, index) {
        return /*#__PURE__*/ React.createElement("div", {
            className: "".concat(classPrefix, "-list-item"),
            onClick: function(event) {
                return onSelect(item, event);
            },
            key: item.id || index
        }, /*#__PURE__*/ React.isValidElement(item.icon) ? item.icon : /*#__PURE__*/ React.createElement("img", {
            src: item.icon,
            alt: "",
            className: "".concat(classPrefix, "-list-image")
        }), /*#__PURE__*/ React.createElement("div", {
            className: "".concat(classPrefix, "-list-text")
        }, item.text));
    };
    return /*#__PURE__*/ React.createElement("div", _object_spread({
        className: classes,
        style: _object_spread({}, position, style)
    }, rest), overlay && /*#__PURE__*/ React.createElement(Overlay, {
        visible: visible,
        zIndex: zIndex,
        onClick: function() {
            return onChange(false);
        }
    }), /*#__PURE__*/ React.createElement("div", {
        className: "list"
    }, children || /*#__PURE__*/ React.createElement("div", {
        className: "".concat(classPrefix, "-list")
    }, list.map(function(item, index) {
        return /*#__PURE__*/ React.createElement(React.Fragment, null, item.num ? /*#__PURE__*/ React.createElement(Badge, {
            value: item.num,
            top: 8,
            right: 6
        }, renderListItem(item, index)) : /*#__PURE__*/ React.createElement(React.Fragment, null, renderListItem(item, index)));
    }))), /*#__PURE__*/ React.createElement("div", {
        className: "".concat(classPrefix, "-btn"),
        onClick: function() {
            return onChange(!visible);
        }
    }, content || /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(ArrowLeft, {
        color: "#fff"
    }), /*#__PURE__*/ React.createElement("div", {
        className: "text"
    }, visible ? activeText || locale.fixednav.activeText : inactiveText || locale.fixednav.inactiveText))));
};
FixedNav.displayName = 'NutFixedNav';