"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ClosableTabs = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _reactDnd = require("react-dnd");
var _reactDndHtml5Backend = require("react-dnd-html5-backend");
var _faPlus = require("@fortawesome/free-solid-svg-icons/faPlus");
var _closableTab = require("./closable-tab");
var _useTranslation = require("../hooks/use-translation");
var _button = require("../button");
var _fontAwesomeIcon = require("../font-awesome-icon");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (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 (const 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); }
/** ClosableTabs displays a set of closable tabs, which can be rearranged by drag-n-drop
 * @midnight-gray-supported
 * @alpine-light-supported
 */
const ClosableTabs = ({
  tabs,
  selected,
  className,
  tooltipClassName,
  tabsListClassName,
  tabsListRef,
  testId,
  isDisabled = false,
  autoSelectTabOnClose = false,
  onClickTab,
  onSelect,
  onCreate,
  canReorderByDragging = false,
  onReorderTabs,
  onCreateIsDisabled = false,
  onCreateTooltipText = '',
  onCreateTooltipPlacement = _button.BUTTON_TOOLTIP_PLACEMENT_TYPES.TOP,
  onClose,
  groupIdentifier = '',
  rightSideActions,
  children,
  closeTabText,
  createTabText
}) => {
  const {
    t
  } = (0, _useTranslation.useTranslation)();
  const [isAnyItemDragging, setIsAnyItemDragging] = (0, _react.useState)(false);
  const dndProviderProps = {
    backend: _reactDndHtml5Backend.HTML5Backend
  };
  function getIndexByKey(key) {
    return tabs.findIndex(tab => tab.key === key);
  }
  const handleItemMove = (0, _react.useCallback)((dragIndex, hoverIndex) => {
    const nextData = [...tabs];
    const draggedItem = nextData[dragIndex];
    nextData.splice(dragIndex, 1);
    nextData.splice(hoverIndex, 0, draggedItem);
    if (onReorderTabs) {
      onReorderTabs(nextData);
    }
  }, [tabs, onReorderTabs]);
  const onCloseClick = tab => {
    if (autoSelectTabOnClose && selected?.key === tab.key) {
      const index = tabs.findIndex(item => item.key === tab.key);
      const lastIndex = tabs.length - 1;
      const newIndex = index === lastIndex ? index - 1 : index + 1;
      const newActive = (newIndex > -1 ? tabs[newIndex] : tabs[lastIndex]) ?? null;
      onSelect(newActive?.key !== tab.key ? newActive : null);
    }
    onClose(tab);
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactDnd.DndProvider, {
    ...dndProviderProps,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("section", {
      className: (0, _classnames.default)('closable-tabs', {
        'closable-tabs-no-tabs': tabs.length === 0
      }, className),
      "test-id": testId,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("header", {
        className: "closable-tabs-header",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: (0, _classnames.default)('closable-tabs-list', tabsListClassName),
          "test-id": `${testId}-tabs-wrapper`,
          ref: tabsListRef,
          children: tabs.map((tab, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_closableTab.ClosableTab, {
            tab: {
              ...tab,
              index
            },
            index: index,
            tooltipClassName: tooltipClassName,
            isActive: selected?.key === tab.key,
            isDisabled: isDisabled,
            onClick: onClickTab,
            onClose: onCloseClick,
            onSelect: onSelect,
            groupIdentifier: groupIdentifier,
            closeTabText: closeTabText ?? t('close tab'),
            getIndexByKey: getIndexByKey,
            onItemMove: handleItemMove,
            canBeDragged: canReorderByDragging,
            isAnyItemDragging: isAnyItemDragging,
            setIsAnyItemDragging: setIsAnyItemDragging
          }, tab.key))
        }), onCreate != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
          className: "closable-tabs-create",
          accentType: _button.ACCENT_TYPES.COMMAND,
          size: _button.BUTTON_SIZES.SM,
          onClick: onCreate,
          testId: testId ? `${testId}-create` : undefined,
          isDisabled: onCreateIsDisabled,
          tooltipText: onCreateTooltipText,
          tooltipPlacement: onCreateTooltipPlacement,
          "aria-label": createTabText ?? t('create tab'),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fontAwesomeIcon.FontAwesomeIcon, {
            icon: _faPlus.faPlus
          })
        }), rightSideActions != null && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
          className: "closable-tabs-right-side-actions",
          children: rightSideActions
        })]
      }), children ? /*#__PURE__*/(0, _jsxRuntime.jsx)("article", {
        className: "closable-tabs-content",
        children: children
      }) : null]
    })
  });
};
exports.ClosableTabs = ClosableTabs;