function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import classNames from 'classnames';
import React, { forwardRef, useImperativeHandle, useMemo, useRef } from 'react';
import PisellBasicGrid from "../PisellBasicGrid";
import PisellScrollView from "../PisellScrollView";
import "./PisellSuperTabs.less";
import { useTabsState } from "./hooks";
import { getRowKey } from "./utils";

/** 避免解构默认值 `{}` 每次 render 新建引用。 */
var EMPTY_GRID_PROPS = {};
var EMPTY_SCROLL_VIEW_PROPS = {};
/**
 * PisellSuperTabs 组件
 * @description 通用导航框架封装的全能型 Tab 组件
 * @template T - 数据源项的类型
 */
var PisellSuperTabs = function PisellSuperTabs(props, ref) {
  var _scrollViewProps$scro, _scrollViewProps$scro2, _scrollViewProps$snap, _scrollViewProps$snap2;
  var className = props.className,
    style = props.style,
    _props$dataSource = props.dataSource,
    dataSource = _props$dataSource === void 0 ? [] : _props$dataSource,
    _props$rowKey = props.rowKey,
    rowKey = _props$rowKey === void 0 ? 'key' : _props$rowKey,
    value = props.value,
    id = props.id,
    defaultValue = props.defaultValue,
    onChange = props.onChange,
    _renderItem = props.renderItem,
    _props$gridProps = props.gridProps,
    gridProps = _props$gridProps === void 0 ? EMPTY_GRID_PROPS : _props$gridProps,
    _props$scrollViewProp = props.scrollViewProps,
    scrollViewProps = _props$scrollViewProp === void 0 ? EMPTY_SCROLL_VIEW_PROPS : _props$scrollViewProp,
    children = props.children,
    slotLeft = props.slotLeft,
    slotRight = props.slotRight,
    slotTop = props.slotTop,
    slotBottom = props.slotBottom,
    tabItemClassName = props.tabItemClassName,
    tabItemStyle = props.tabItemStyle,
    slotLeftClassName = props.slotLeftClassName,
    slotRightClassName = props.slotRightClassName,
    slotTopClassName = props.slotTopClassName,
    slotBottomClassName = props.slotBottomClassName,
    slotLeftStyle = props.slotLeftStyle,
    slotRightStyle = props.slotRightStyle,
    slotTopStyle = props.slotTopStyle,
    slotBottomStyle = props.slotBottomStyle,
    _props$isControlled = props.isControlled,
    isControlled = _props$isControlled === void 0 ? true : _props$isControlled,
    __designMode = props.__designMode;
  var containerRef = useRef(null);

  // 状态管理：处理受控/非受控模式
  var _useTabsState = useTabsState({
      value: value,
      defaultValue: defaultValue,
      onChange: onChange,
      isControlled: isControlled !== null && isControlled !== void 0 ? isControlled : false
    }),
    activeKey = _useTabsState.activeKey,
    handleTabChange = _useTabsState.handleTabChange;
  var scrollItemByRowKey = function scrollItemByRowKey(key) {
    var item = document.querySelector(".pisell-super-tabs-item-".concat(id, "-").concat(key));
    console.log(".pisell-super-tabs-item-".concat(id, "-").concat(key));
    if (item) {
      item.scrollIntoView({
        behavior: 'smooth'
      });
    }
  };
  useImperativeHandle(ref, function () {
    if (__designMode) {
      //@ts-ignore
      return containerRef.current;
    }
    return {
      scrollItemByRowKey: scrollItemByRowKey
    };
  });

  /** 透传给 PisellScrollView 的配置；按字段依赖避免父级对象引用抖动。 */
  var resolvedScrollViewProps = useMemo(function () {
    return scrollViewProps;
  }, [scrollViewProps.overflow, scrollViewProps.scrollbarStyle, scrollViewProps.style, (_scrollViewProps$scro = scrollViewProps.scrollActionsConfig) === null || _scrollViewProps$scro === void 0 ? void 0 : _scrollViewProps$scro.show, (_scrollViewProps$scro2 = scrollViewProps.scrollActionsConfig) === null || _scrollViewProps$scro2 === void 0 ? void 0 : _scrollViewProps$scro2.type, (_scrollViewProps$snap = scrollViewProps.snapScroll) === null || _scrollViewProps$snap === void 0 ? void 0 : _scrollViewProps$snap.enabled, (_scrollViewProps$snap2 = scrollViewProps.snapScroll) === null || _scrollViewProps$snap2 === void 0 ? void 0 : _scrollViewProps$snap2.type]);
  return /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-super-tabs', className),
    style: style,
    id: id,
    ref: containerRef
  }, /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-super-tabs-slot-top-' + id, slotTopClassName),
    style: slotTopStyle
  }, slotTop), /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-super-tabs-slot-left-' + id, slotLeftClassName),
    style: slotLeftStyle
  }, slotLeft), /*#__PURE__*/React.createElement(PisellScrollView, resolvedScrollViewProps, /*#__PURE__*/React.createElement(PisellBasicGrid, _extends({}, gridProps, {
    dataSource: dataSource,
    rowKey: rowKey,
    renderItem: function renderItem(item, index) {
      // 获取当前项的 key
      var key = getRowKey(item, index, rowKey);

      // 判断是否激活
      var active = key === String(activeKey);

      // 渲染内容
      // 支持两种模式：函数模式和插槽模式
      var content;
      if (_renderItem) {
        if (typeof _renderItem === 'function') {
          // 函数模式：调用用户自定义渲染函数
          content = _renderItem({
            dataSource: item,
            index: index,
            onClick: function onClick() {
              if (item.customClick) {
                return;
              }
              handleTabChange(key, item);
            },
            tabsState: {
              activeKey: activeKey,
              handleTabChange: handleTabChange
            },
            tabsProps: props,
            active: {
              value: active
            }
          });
        } else {
          // 插槽模式：直接使用 renderItem
          content = _renderItem;
        }
      } else {
        content = item['label'];
      }

      // 包裹点击事件处理
      return /*#__PURE__*/React.createElement("div", {
        key: key,
        className: classNames('pisell-super-tabs-item', "pisell-super-tabs-item-".concat(id, "-").concat(key), {
          'pisell-super-tabs-item--active': active
        }, tabItemClassName),
        style: tabItemStyle
      }, content);
    }
  }))), /*#__PURE__*/React.createElement("div", {
    className: "pisell-super-tabs-content"
  }, children), /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-super-tabs-slot-right-' + id, slotRightClassName),
    style: slotRightStyle
  }, slotRight), /*#__PURE__*/React.createElement("div", {
    className: classNames('pisell-super-tabs-slot-bottom-' + id, slotBottomClassName),
    style: slotBottomStyle
  }, slotBottom));
};
PisellSuperTabs.displayName = 'PisellSuperTabs';
export default /*#__PURE__*/forwardRef(PisellSuperTabs);