"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { TableConfigProvider } from "./TableConfigurationProvider.js";
import { tableFooter } from "./tableFooterStyles.js";
import { tableHeader } from "./tableHeaderStyles.js";
import { useStickyTableSection } from "./useStickyTableSection.js";
import { useTableSectionConfig } from "./useTableSectionConfig.js";
/**
 * **Client Component**
 *
 * This component is used to render a sticky `<thead>`/`<tfoot>` that
 * dynamically applies styles whenever the `<thead>`/`<tfoot>` are covering
 * content in the table.
 *
 * @since 6.0.0
 */ export const StickyTableSection = /*#__PURE__*/ forwardRef(function StickyTableSection(props, ref) {
    const { type, className, hoverable, lineWrap, children, stickyOptions, isStickyActive, disableStickyStyles = false, stickyActiveClassName, ...remaining } = props;
    const isHeader = type === "header";
    const Section = isHeader ? "thead" : "tfoot";
    const styles = isHeader ? tableHeader : tableFooter;
    const { tbody, sectionRef, stickyActive } = useStickyTableSection({
        ref,
        type,
        stickyOptions,
        isStickyActive,
        disableStickyStyles,
        stickyActiveClassName
    });
    const config = useTableSectionConfig({
        type,
        lineWrap,
        hoverable
    });
    return /*#__PURE__*/ _jsxs(TableConfigProvider, {
        value: config,
        children: [
            !isHeader && tbody,
            /*#__PURE__*/ _jsx(Section, {
                ...remaining,
                ref: sectionRef,
                className: styles({
                    className,
                    dense: config.dense,
                    sticky: true,
                    stickyActive,
                    stickyActiveClassName
                }),
                children: children
            }),
            isHeader && tbody
        ]
    });
});

//# sourceMappingURL=StickyTableSection.js.map