import { jsx as _jsx } from "react/jsx-runtime";
import React, { memo, useMemo } from "react";
import { useTabContext } from "./tabContext";
import { cn } from "../utils/css";
import { TabViewMode } from "./constants";
export const TabContent = (props)=>{
    const { keepAlive, activeIndex, tabs, mode } = props;
    const { contentVisible } = useTabContext();
    // const contentVisible = true;
    const children = useMemo(()=>{
        if (!tabs) return null;
        if (!keepAlive) {
            return tabs[activeIndex ?? 0];
        }
        return tabs.map((tab, index)=>{
            return /*#__PURE__*/ _jsx("div", {
                className: cn("orderly-h-full orderly-w-full orderly-transition-all orderly-min-w-0", mode === TabViewMode.Tab ? index === activeIndex ? "orderly-inset-0" : "orderly-hidden" : "orderly-border-l orderly-border-divider first:orderly-border-l-0"),
                children: tab
            }, index);
        });
    }, [
        activeIndex,
        keepAlive,
        tabs,
        mode
    ]);
    const layout = useMemo(()=>{
        return {};
    }, []);
    return /*#__PURE__*/ _jsx("div", {
        className: cn("orderly-transition-all orderly-grid", contentVisible ? "orderly-grid-rows-[1fr]" : "orderly-grid-rows-[0fr]"),
        children: /*#__PURE__*/ _jsx("div", {
            className: cn("orderly-overflow-hidden orderly-relative", mode === TabViewMode.Group && "orderly-grid"),
            style: mode === TabViewMode.Group ? {
                gridTemplateColumns: `repeat(${props.tabs?.length}, 1fr)`,
                ...layout
            } : layout,
            children: children
        })
    });
};
export const MemorizedTabContent = /*#__PURE__*/ memo(TabContent);

//# sourceMappingURL=tabContent.js.map