import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import Icon from '../Icon/Icon.js';
import Tabs from '../Tabs/Tabs.js';
import Typography from '../Typography/Typography.js';
import Tooltip from '../Tooltip/Tooltip.js';

const SessionDropdown = ({ header, secondaryHeader, primaryCount, secondaryCount, primaryItems, secondaryItems, width, activeTab = 'primary', activeTabId, onPrimaryTabClick, onSecondaryTabClick, onTabClick, actions, tabsData, notchPosition = 'top-left', }) => {
    const itemsToDisplay = secondaryHeader && activeTab === 'secondary'
        ? secondaryItems
        : primaryItems;
    const hasSecondaryItems = secondaryCount && parseInt(secondaryCount) > 0;
    const hasPrimaryItems = primaryCount && parseInt(primaryCount) > 0;
    const showActionIcons = secondaryHeader && (hasPrimaryItems || hasSecondaryItems);
    const handleTabClick = (tabId) => {
        if (onTabClick) {
            onTabClick(tabId);
        }
        if (tabId === 'tab-1' && onPrimaryTabClick) {
            onPrimaryTabClick();
        }
        else if (tabId === 'tab-2' && onSecondaryTabClick) {
            onSecondaryTabClick();
        }
    };
    const { tooltip: downloadTooltip = 'Download', iconName: downloadIconName = 'download_file', disabled: isDownloadDisabled = false, onClick: onDownloadClick, className: downloadClassName = '', } = actions?.download || {};
    const { tooltip: deleteTooltip = 'Delete', iconName: deleteIconName = 'delete_icon', disabled: isDeleteDisabled = false, onClick: onDeleteClick, className: deleteClassName = '', } = actions?.delete || {};
    const renderHeaderIcons = () => (jsxs("div", { className: "ff-dropdown-header-icons", children: [actions?.download && (jsx(Tooltip, { title: downloadTooltip, children: jsx(Icon, { name: downloadIconName || '', className: `ff-dropdown-icon ff-download-icon ${downloadClassName}`, onClick: onDownloadClick, width: 18, height: 20, disabled: isDownloadDisabled, hoverEffect: true }) })), actions?.delete && (jsx(Tooltip, { title: deleteTooltip, children: jsx(Icon, { name: deleteIconName || '', className: `ff-dropdown-icon ff-delete-icon ${deleteClassName}`, onClick: onDeleteClick, width: 25, height: 25, disabled: isDeleteDisabled, hoverEffect: true }) }))] }));
    return (jsxs("div", { className: "ff-resolution-dropdown", style: width ? { minWidth: width } : {}, children: [jsx("div", { className: `ff-dropdown-notch ${notchPosition === 'bottom-center' ? 'bottom-center' : 'top-left'}` }), jsx("div", { className: "ff-dropdown-header", children: jsx("div", { className: "ff-dropdown-header-content", children: secondaryHeader && tabsData && activeTabId ? (jsxs(Fragment, { children: [jsx(Tabs, { tabsData: tabsData, activeTabId: activeTabId, onTabClick: handleTabClick }), showActionIcons && renderHeaderIcons()] })) : secondaryHeader && showActionIcons ? (jsxs("div", { className: "ff-dropdown-header-dual", children: [jsxs("div", { className: `ff-dropdown-header-item ${activeTab === 'primary' ? 'active' : ''}`, onClick: onPrimaryTabClick, children: [jsx(Typography, { fontWeight: "semi-bold", className: "ff-dropdown-text", children: header }), primaryCount && (jsx("span", { className: "ff-dropdown-count", children: primaryCount }))] }), jsxs("div", { className: `ff-dropdown-header-item ${activeTab === 'secondary' ? 'active' : ''}`, onClick: onSecondaryTabClick, children: [jsx(Typography, { fontWeight: "semi-bold", className: "ff-dropdown-text", children: secondaryHeader }), secondaryCount && (jsx("span", { className: "ff-dropdown-count", children: secondaryCount }))] }), renderHeaderIcons()] })) : secondaryHeader ? (jsxs("div", { className: "ff-dropdown-header-dual", children: [jsxs("div", { className: `ff-dropdown-header-item ${activeTab === 'primary' ? 'active' : ''}`, onClick: onPrimaryTabClick, children: [jsx(Typography, { fontWeight: "semi-bold", className: "ff-dropdown-text", children: header }), primaryCount && (jsx("span", { className: "ff-dropdown-count", children: primaryCount }))] }), jsxs("div", { className: `ff-dropdown-header-item ${activeTab === 'secondary' ? 'active' : ''}`, onClick: onSecondaryTabClick, children: [jsx(Typography, { fontWeight: "semi-bold", className: "ff-dropdown-text", children: secondaryHeader }), secondaryCount && (jsx("span", { className: "ff-dropdown-count", children: secondaryCount }))] })] })) : (jsx(Typography, { fontSize: 16, fontWeight: "semi-bold", children: header })) }) }), jsx("ul", { className: "ff-dropdown-list", children: itemsToDisplay?.map((item, index) => (jsx("li", { className: "ff-dropdown-item", children: item }, index))) })] }));
};

export { SessionDropdown as default };
//# sourceMappingURL=SessionDropdown.js.map
