@dckj-npm/dc-material 0.1.357 → 0.1.359

package/lib/components/stream-list/stream-list.js

@@ -0,0 +1,165 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _react = _interopRequireWildcard(require("react"));
+require("./index.scss");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+/**
+ * StreamList 组件
+ */
+var StreamList = function StreamList(_ref) {
+  var children = _ref.children,
+    onNextPage = _ref.onNextPage,
+    onRefreshPage = _ref.onRefreshPage,
+    _ref$refreshingText = _ref.refreshingText,
+    refreshingText = _ref$refreshingText === void 0 ? '正在刷新中...' : _ref$refreshingText,
+    _ref$loadingText = _ref.loadingText,
+    loadingText = _ref$loadingText === void 0 ? '加载中...' : _ref$loadingText,
+    _ref$loadMoreText = _ref.loadMoreText,
+    loadMoreText = _ref$loadMoreText === void 0 ? '加载更多' : _ref$loadMoreText,
+    _ref$isLastPage = _ref.isLastPage,
+    isLastPage = _ref$isLastPage === void 0 ? false : _ref$isLastPage,
+    _ref$nowPage = _ref.nowPage,
+    nowPage = _ref$nowPage === void 0 ? 1 : _ref$nowPage;
+  var _useState = (0, _react.useState)(false),
+    isLoading = _useState[0],
+    setIsLoading = _useState[1];
+  var _useState2 = (0, _react.useState)(false),
+    isRefreshing = _useState2[0],
+    setIsRefreshing = _useState2[1];
+  // 下拉刷新的阈值
+  var threshold = 50;
+  // 最大下拉距离
+  var maxPullDistance = 100;
+  var _useState3 = (0, _react.useState)(0),
+    pullDistance = _useState3[0],
+    setPullDistance = _useState3[1];
+  var startYRef = (0, _react.useRef)(0);
+  var _useState4 = (0, _react.useState)(false),
+    isDragging = _useState4[0],
+    setIsDragging = _useState4[1];
+  var observerRef = (0, _react.useRef)(null);
+  // 防止初始加载直接请求下一页
+  var hasInitialLoad = (0, _react.useRef)(false);
+
+  // 监听加载下一页数据
+  (0, _react.useEffect)(function () {
+    if (isRefreshing || isLastPage) {
+      // @ts-ignore
+      return;
+    }
+    var spinElement = document.querySelector('.spin');
+    if (spinElement && !observerRef.current) {
+      // 创建 IntersectionObserver 观察器
+      observerRef.current = new IntersectionObserver(function (entries) {
+        var entry = entries[0];
+        if (entry.isIntersecting && !isLoading) {
+          setIsLoading(true);
+          var nextPage = nowPage + 1;
+          onNextPage({
+            page: nextPage
+          }).then(function (res) {})["catch"](function (err) {
+            console.error('加载下一页失败:', err);
+          })["finally"](function () {
+            return setIsLoading(false);
+          });
+        }
+      }, {
+        threshold: 0.4
+      });
+      // 观察加载更多元素
+      observerRef.current.observe(spinElement);
+    }
+    return function () {
+      if (observerRef.current) {
+        // 清除观察者
+        observerRef.current.disconnect();
+        observerRef.current = null;
+      }
+    };
+  }, [nowPage, isLoading, isRefreshing, isLastPage]);
+
+  // 初始化加载标记
+  (0, _react.useEffect)(function () {
+    hasInitialLoad.current = true;
+  }, []);
+
+  // 处理触摸和鼠标事件
+  var handleTouchStart = function handleTouchStart(e) {
+    startYRef.current = 'touches' in e ? e.touches[0].clientY : e.clientY;
+    setIsDragging(true);
+  };
+  var handleTouchMove = function handleTouchMove(e) {
+    if (isRefreshing || !isDragging && !('touches' in e)) return;
+    var clientY = 'touches' in e ? e.touches[0].clientY : e.clientY;
+    var distance = clientY - startYRef.current;
+
+    // 更新下拉距离
+    if (distance > 0 && distance <= maxPullDistance) {
+      setPullDistance(distance);
+    } else if (distance > maxPullDistance) {
+      setPullDistance(maxPullDistance);
+    }
+  };
+  var handleTouchEnd = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+      return _regenerator["default"].wrap(function (_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            setIsDragging(false);
+            if (pullDistance > threshold) {
+              setIsRefreshing(true);
+              setPullDistance(0);
+              onRefreshPage().then(function (res) {})["catch"](function (err) {
+                console.error('刷新失败:', err);
+              })["finally"](function () {
+                setIsRefreshing(false);
+              });
+            } else {
+              setPullDistance(0); // 重置下拉距离
+            }
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function handleTouchEnd() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    onTouchStart: handleTouchStart,
+    onTouchMove: handleTouchMove,
+    onTouchEnd: handleTouchEnd,
+    onMouseDown: handleTouchStart,
+    onMouseMove: handleTouchMove,
+    onMouseUp: handleTouchEnd,
+    className: "stream-list-container"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "refresh-indicator",
+    style: {
+      position: 'fixed',
+      top: 0,
+      left: 0,
+      right: 0,
+      transform: "translateY(" + (isRefreshing ? threshold : pullDistance) + "px)",
+      transition: isRefreshing || pullDistance === 0 ? 'transform 0.3s ease' : 'none'
+    }
+  }, isRefreshing && /*#__PURE__*/_react["default"].createElement("span", null, refreshingText)), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      transform: "translateY(" + (isRefreshing ? threshold : pullDistance) + "px)",
+      transition: 'transform 0.3s ease'
+    }
+  }, children), !isRefreshing && !isLastPage && (isLoading ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: "loading-text"
+  }, loadingText) : /*#__PURE__*/_react["default"].createElement("div", {
+    className: "spin"
+  }, loadMoreText)));
+};
+StreamList.displayName = 'StreamList';
+var _default = exports["default"] = StreamList;

package/lib/components/swiper/index.d.ts

@@ -0,0 +1,3 @@
+import Swiper from './swiper';
+export type { ComponentProps } from './swiper';
+export default Swiper;

package/lib/components/swiper/index.js

@@ -0,0 +1,7 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _swiper = _interopRequireDefault(require("./swiper"));
+var _default = exports["default"] = _swiper["default"];

package/lib/components/swiper/index.scss

@@ -0,0 +1,20 @@
+.carousel {
+  position: relative;
+  overflow: hidden;
+  width: 100%;
+  max-width: 600px;
+}
+
+.carousel__wrapper {
+  display: flex;
+  transition: transform ease-in-out;
+}
+
+.carousel__slide {
+  min-width: 100%;
+}
+
+.carousel__slide img {
+  width: 100%;
+  height: auto;
+}

package/lib/components/swiper/swiper.d.ts

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import './index.scss';
+export interface ComponentProps {
+    /**
+     * 切换速度，单位ms
+     */
+    speed?: number;
+    /**
+     * 高度
+     */
+    height: number;
+    /**
+     * 自动播放
+     */
+    autoplay: boolean;
+    /**
+     * 循环播放
+     */
+    loop: boolean;
+    /**
+     * 切换间隔时间，单位ms
+     */
+    delay?: number;
+    /**
+     * 图片路径
+     */
+    picUrls: string[];
+}
+declare const DCSlider: React.FC<ComponentProps>;
+export default DCSlider;

package/lib/components/swiper/swiper.js

@@ -0,0 +1,85 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
+require("./index.scss");
+var _excluded = ["speed", "autoplay", "loop", "picUrls", "height", "delay"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var DCSlider = function DCSlider(_ref) {
+  var _ref$speed = _ref.speed,
+    speed = _ref$speed === void 0 ? 500 : _ref$speed,
+    autoplay = _ref.autoplay,
+    loop = _ref.loop,
+    _ref$picUrls = _ref.picUrls,
+    picUrls = _ref$picUrls === void 0 ? [] : _ref$picUrls,
+    height = _ref.height,
+    delay = _ref.delay,
+    otherProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
+  var _useState = (0, _react.useState)(0),
+    currentIndex = _useState[0],
+    setCurrentIndex = _useState[1];
+  var autoplayRef = (0, _react.useRef)(null);
+
+  // 切换到下一张
+  var nextSlide = function nextSlide() {
+    if (currentIndex < picUrls.length - 1) {
+      setCurrentIndex(currentIndex + 1);
+    } else if (loop) {
+      setCurrentIndex(0);
+    } else {
+      stopAutoplay();
+    }
+  };
+
+  // 启动自动播放
+  var startAutoplay = function startAutoplay() {
+    if (autoplay && !autoplayRef.current) {
+      autoplayRef.current = setInterval(function () {
+        nextSlide();
+      }, delay);
+    }
+  };
+
+  // 停止自动播放
+  var stopAutoplay = function stopAutoplay() {
+    if (autoplayRef.current) {
+      clearInterval(autoplayRef.current);
+      autoplayRef.current = null;
+    }
+  };
+  (0, _react.useEffect)(function () {
+    startAutoplay();
+    return function () {
+      return stopAutoplay();
+    };
+  }, [autoplay, currentIndex]);
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: "carousel",
+    style: {
+      height: height ? height + "px" : 'auto'
+    }
+  }, otherProps), /*#__PURE__*/React.createElement("div", {
+    className: "carousel__wrapper",
+    style: {
+      transform: "translateX(-" + currentIndex * 100 + "%)",
+      transitionDuration: speed + "ms"
+    }
+  }, picUrls.map(function (url, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      className: "carousel__slide"
+    }, /*#__PURE__*/React.createElement("img", {
+      src: url,
+      alt: "Slide " + index,
+      style: {
+        height: height ? height + "px" : '100%'
+      }
+    }));
+  })));
+};
+var _default = exports["default"] = DCSlider;

package/lib/components/switch/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 开关
+ */
+import Switch from './switch';
+export type { SwitchProps } from './switch';
+export { Switch };

package/lib/components/switch/index.js

@@ -0,0 +1,6 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+var _switch = _interopRequireDefault(require("./switch"));
+exports.Switch = _switch["default"];

package/lib/components/switch/index.scss

@@ -0,0 +1,4 @@
+.switch {
+    width: 100%;
+    display: flex;
+}

package/lib/components/switch/switch.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import './index.scss';
+export interface SwitchProps {
+    /**
+     * 是否禁用
+     */
+    disabled: boolean;
+    /**
+     * 尺寸
+     */
+    size: 'small' | 'medium';
+}
+declare const Switch: React.FC<SwitchProps>;
+export default Switch;

package/lib/components/switch/switch.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _switch = _interopRequireDefault(require("@alifd/next/lib/switch"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+require("./index.scss");
+var _excluded = ["disabled", "size"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var Switch = function Switch(_ref) {
+  var disabled = _ref.disabled,
+    size = _ref.size,
+    otherProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
+  var _otherProps = otherProps || {};
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: "switch"
+  }, _otherProps), /*#__PURE__*/React.createElement(_switch["default"], {
+    size: size,
+    disabled: disabled
+  }));
+};
+Switch.displayName = 'Switch';
+var _default = exports["default"] = Switch;

package/lib/components/tab/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * 标签tag
+ */
+import Tab from './tab';
+export type { TabProps } from './tab';
+export default Tab;

package/lib/components/tab/index.js

@@ -0,0 +1,10 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _tab = _interopRequireDefault(require("./tab"));
+/**
+ * 标签tag
+ */
+var _default = exports["default"] = _tab["default"];

package/lib/components/tab/index.scss

@@ -0,0 +1,44 @@
+.tab-message {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+}
+.tabs__container {
+  display: inline-block;
+  padding: 5px 17px;
+  border-radius: 19px;
+  background-color: #FFFFFF;
+  color: #666666;
+  font-size: 15px;
+  cursor: pointer;
+  margin-right: 6px;
+  letter-spacing: 2px;
+  position: relative;
+  &--selected {
+    background-color: #ED794A;
+    color: #FFFFFF;
+  }
+  &--small {
+    padding: 5px 16px;
+    border-radius: 19px;
+  }
+  &--large {
+    padding: 14px 30px;
+    border-radius: 28px;
+  }
+  .badge {
+    display: flex;
+    padding: 2px 4px;
+    border-radius: 8px;
+    background-color: #F44341; // 红色背景
+    color: white; // 字体颜色
+    // text-align: center;
+    letter-spacing: 0;
+    justify-content: center;
+    line-height: normal; // 垂直居中
+    font-size: 10px; // 根据需要调整字体大小
+    position: absolute; // 绝对定位
+    top: 0; // 根据需要调整位置
+    right: 3px; // 根据需要调整位置
+  }
+}

package/lib/components/tab/tab.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import './index.scss';
+export interface TabProps {
+    /**
+     * 选中背景颜色
+     */
+    selectedBGColor: string;
+    /**
+     * 选中字体颜色
+     */
+    selectedFontColor: string;
+    /**
+     * 尺寸 small | large
+     */
+    size: string;
+    /**
+     * 点击事件
+     * @param e
+     */
+    onClickHandle?: (e: number[]) => void;
+    /**
+     * 未读消息数量
+     */
+    unreadCount?: number;
+}
+declare const Tab: React.FC<TabProps>;
+export default Tab;

package/lib/components/tab/tab.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+require("./index.scss");
+var _excluded = ["selectedBGColor", "selectedFontColor", "size", "onClickHandle", "unreadCount"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var Tab = function Tab(_ref) {
+  var selectedBGColor = _ref.selectedBGColor,
+    selectedFontColor = _ref.selectedFontColor,
+    size = _ref.size,
+    onClickHandle = _ref.onClickHandle,
+    unreadCount = _ref.unreadCount,
+    otherProps = (0, _objectWithoutPropertiesLoose2["default"])(_ref, _excluded);
+  var tabList = [{
+    key: [0, 1],
+    label: '全部'
+  }, {
+    key: [1],
+    label: '已读'
+  }, {
+    key: [0],
+    label: '未读'
+  }];
+  var _React$useState = React.useState([0, 1]),
+    tab = _React$useState[0],
+    setTab = _React$useState[1];
+  var handleClick = function handleClick(key) {
+    console.log(key);
+    // 切换tab
+    setTab(key);
+    // 触发父组件传递的点击处理函数
+    onClickHandle && onClickHandle(key);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "tab-message"
+  }, tabList.map(function (item) {
+    return /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({
+      className: "tabs__container\n         " + (tab.toString() === item.key.toString() ? 'tabs__container--selected' : '') + "\n         " + (size == 'large' ? 'tabs__container--large' : 'tabs__container--small')
+    }, otherProps, {
+      onClick: function onClick() {
+        return handleClick(item.key);
+      },
+      style: {
+        backgroundColor: tab.toString() === item.key.toString() ? selectedBGColor : '',
+        color: tab.toString() === item.key.toString() ? selectedFontColor : ''
+      }
+    }), item.label, item.key.toString() === '0' && unreadCount > 0 && /*#__PURE__*/React.createElement("span", {
+      className: "badge"
+    }, unreadCount) // 条件渲染badge
+    );
+  }));
+};
+var _default = exports["default"] = Tab;

package/lib/components/tab-container/index.d.ts

@@ -0,0 +1,3 @@
+import { TabContainer } from '../tab-container/tab-container';
+export type { TabContainerProps } from '../tab-container/tab-container';
+export default TabContainer;

package/lib/components/tab-container/index.js

@@ -0,0 +1,6 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+var _tabContainer = require("../tab-container/tab-container");
+var _default = exports["default"] = _tabContainer.TabContainer;

package/lib/components/tab-container/index.scss

@@ -0,0 +1,48 @@
+.fusion-ui-tab {
+    display: block;
+    background-color: #fff;
+
+    &.next-medium {
+      .next-tabs-content {
+        padding: 0;
+      }
+      
+    }
+  .next-tabs-bar {
+    border-bottom: none;
+    margin-bottom: 15px;
+    .next-tabs-nav-container {
+      .next-tabs-nav {
+        .next-tabs-tab {
+          font-size: 16px;
+          color: #666666;
+          margin-right: 13px;
+          &.active {
+            color: #333;
+            font-size: 17px;
+          }
+          &.active::before {
+            bottom: 2px;
+            border-bottom: 5px solid #E96D40;
+            z-index: 0;
+            border-radius: 2.5px;
+          }
+        }
+      }
+    }
+  }
+
+    &.next-small {
+      .next-tabs-content {
+        padding: 12px;
+      }
+    }
+  }
+.navigation {
+  z-index: 10;
+  position: relative;
+}
+
+:global(.fd-layout-p-margin) {
+  margin-top: 0 !important;
+}

package/lib/components/tab-container/tab-container.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Tab } from '@alifd/next';
+import './index.scss';
+export interface TabContainerProps extends React.ComponentProps<typeof Tab> {
+    className?: string;
+}
+export declare const TabContainer: {
+    (props: TabContainerProps): JSX.Element;
+    displayName: string;
+};

package/lib/components/tab-container/tab-container.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.TabContainer = void 0;
+var _tab = _interopRequireDefault(require("@alifd/next/lib/tab"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireDefault(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+require("./index.scss");
+var _excluded = ["className"];
+var TabContainer = exports.TabContainer = function TabContainer(props) {
+  var className = props.className,
+    restProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
+  var CustomTabItem = function CustomTabItem(key, props) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "navigation"
+    }, key.title);
+  };
+  return /*#__PURE__*/_react["default"].createElement(_tab["default"], (0, _extends2["default"])({
+    className: (0, _classnames["default"])(className, 'fusion-ui-tab')
+  }, restProps, {
+    tabRender: function tabRender(key, props) {
+      return /*#__PURE__*/_react["default"].createElement(CustomTabItem, (0, _extends2["default"])({
+        key: key
+      }, props));
+    }
+  }));
+};
+TabContainer.displayName = 'TabContainer';

package/lib/components/tab-container-item/index.d.ts

@@ -0,0 +1,3 @@
+import { TabContainerItem } from './tab-container-item';
+export type { TabContainerItemProps } from './tab-container-item';
+export default TabContainerItem;

package/lib/components/tab-container-item/index.js

@@ -0,0 +1,6 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+var _tabContainerItem = require("./tab-container-item");
+var _default = exports["default"] = _tabContainerItem.TabContainerItem;

package/lib/components/tab-container-item/tab-container-item.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Tab } from '@alifd/next';
+export interface TabContainerItemProps extends React.ComponentProps<typeof Tab> {
+    className?: string;
+    tab: string;
+    key: string;
+}
+export declare const TabContainerItem: {
+    (props: TabContainerItemProps): JSX.Element;
+    displayName: string;
+};