"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.TOGGLE_BUTTON_PLACEMENTS = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _faChevronLeft = require("@fortawesome/free-solid-svg-icons/faChevronLeft");
var _faChevronRight = require("@fortawesome/free-solid-svg-icons/faChevronRight");
var _useResize = require("./useResize");
var _useTranslation = require("../hooks/use-translation");
var _useForwardRef = require("../hooks/use-forward-ref");
var _fontAwesomeIcon = require("../font-awesome-icon");
var _button = require("../button");
var _tooltip = require("../tooltip");
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); }
const TOGGLE_BUTTON_PLACEMENTS = exports.TOGGLE_BUTTON_PLACEMENTS = {
  left: 'left',
  right: 'right'
};
const CHEVRON_CLASSNAME_TABLE = {
  [TOGGLE_BUTTON_PLACEMENTS.left]: {
    true: _faChevronLeft.faChevronLeft,
    false: _faChevronRight.faChevronRight
  },
  [TOGGLE_BUTTON_PLACEMENTS.right]: {
    true: _faChevronRight.faChevronRight,
    false: _faChevronLeft.faChevronLeft
  }
};
/**
 * Use card block to display data helps users quickly locate and browse data.
 * @midnight-gray-supported
 * @alpine-light-supported
 * */
const CollapsibleSidebar = /*#__PURE__*/(0, _react.forwardRef)(function CollapsibleSidebar({
  children,
  sidebarClassName,
  isMinimized = false,
  onToggleMinimized = () => {},
  sidebarMinimizedClassName,
  testId,
  toggleButtonTestId,
  toggleButtonClassName,
  toggleButtonPlacement = TOGGLE_BUTTON_PLACEMENTS.right,
  disableToggleMinimization,
  activeMinimize,
  sidebarName,
  isResizeEnabled = false,
  width,
  onWidthChange,
  maxWidth,
  minWidth = 'max(16%, 230px)',
  openTooltipText,
  closeTooltipText,
  resizeTooltipText
}, ref) {
  const [setPanelRef, panelRef] = (0, _useForwardRef.useForwardRef)(ref);
  const {
    t
  } = (0, _useTranslation.useTranslation)();
  const openTooltipTextValue = openTooltipText ?? t('click to open');
  const closeTooltipTextValue = closeTooltipText ?? t('click to close');
  const resizeTooltipTextValue = resizeTooltipText ?? t('drag to resize');
  const {
    isResizing,
    shouldRespondToBorderClick,
    onMouseDownHandler
  } = (0, _useResize.useResize)({
    panelElement: panelRef,
    onWidthChange,
    sideBarPlacement: toggleButtonPlacement,
    isResizeEnabled,
    isMinimized
  });
  const chevronIcon = CHEVRON_CLASSNAME_TABLE[toggleButtonPlacement][isMinimized ? 'true' : 'false'];
  const onToggleButtonClick = () => onToggleMinimized(!isMinimized);
  const onToggleBorderLineClick = () => {
    // we do not need to toggle sidebar if click event happened after resizing
    // (otherwise everytime user does resizing - it would trigger sidebar toggle)
    if (shouldRespondToBorderClick) {
      onToggleMinimized(!isMinimized);
    }
  };
  const tooltipText = (0, _react.useMemo)(() => {
    const usualText = isMinimized ? openTooltipTextValue : closeTooltipTextValue;
    const resizeText = isResizeEnabled && !isMinimized ? resizeTooltipTextValue : '';
    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
        style: {
          display: 'inline'
        },
        children: usualText
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
        children: resizeText
      })]
    });
  }, [isMinimized, isResizeEnabled]);
  return (
    /*#__PURE__*/
    // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
    (0, _jsxRuntime.jsxs)("div", {
      className: (0, _classnames.default)('collapsible-sidebar-container', sidebarClassName, activeMinimize && 'active-minimize', isMinimized && ['minimized', sidebarMinimizedClassName], !isResizing && 'transition-enabled'),
      "test-id": testId
      /* eslint-disable-next-line react/forbid-dom-props */,
      style: {
        width: isMinimized ? undefined : width,
        minWidth: isMinimized ? undefined : minWidth,
        maxWidth: isMinimized ? undefined : maxWidth
      },
      onClick: activeMinimize && isMinimized ? onToggleButtonClick : undefined,
      ref: setPanelRef,
      children: [children, !disableToggleMinimization && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
        className: (0, _classnames.default)('collapsible-sidebar-buttons-wrapper', isResizing && 'resizing'),
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
          accentType: _button.ACCENT_TYPES.COMMAND,
          className: (0, _classnames.default)('toggle-sidebar', toggleButtonClassName, toggleButtonPlacement),
          onClick: onToggleButtonClick,
          testId: toggleButtonTestId,
          "aria-label": sidebarName ?? t('Sidebar'),
          "aria-expanded": !isMinimized,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fontAwesomeIcon.FontAwesomeIcon, {
            icon: chevronIcon,
            className: toggleButtonPlacement
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.Tooltip, {
          content: tooltipText,
          placement: toggleButtonPlacement === TOGGLE_BUTTON_PLACEMENTS.right ? _tooltip.TOOLTIP_PLACEMENT_TYPES.RIGHT : _tooltip.TOOLTIP_PLACEMENT_TYPES.LEFT,
          delayType: _tooltip.TOOLTIP_DELAY_TYPES.SLOW,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
            onClick: onToggleBorderLineClick,
            className: (0, _classnames.default)('toggle-sidebar-border-panel', isResizeEnabled && !isMinimized && 'is-resizable', toggleButtonPlacement),
            onMouseDown: onMouseDownHandler
          })
        })]
      })]
    })
  );
});
var _default = exports.default = CollapsibleSidebar;