import { jsx, jsxs } from 'react/jsx-runtime';
import React__default, { createContext, useMemo, useContext } from 'react';
import { cn } from '../../../utils/cn.js';
import { descriptionListTheme } from './DescriptionList.theme.js';

// ──────────────────────────────────────────────
// Context
// ──────────────────────────────────────────────
const DescriptionListContext = createContext(undefined);
function useDescriptionListContext() {
    const ctx = useContext(DescriptionListContext);
    if (!ctx) {
        throw new Error("DescriptionList.Item must be used within a <DescriptionList>");
    }
    return ctx;
}
// ──────────────────────────────────────────────
// DescriptionList (container)
// ──────────────────────────────────────────────
const DescriptionListRoot = React__default.forwardRef(({ className, variant = "horizontal", theme: customTheme, children, ...props }, ref) => {
    const theme = useMemo(() => ({ ...descriptionListTheme, ...customTheme }), [customTheme]);
    const contextValue = useMemo(() => ({ variant, theme }), [variant, theme]);
    return (jsx(DescriptionListContext.Provider, { value: contextValue, children: jsx("dl", { ref: ref, className: cn(theme.baseStyle, className), ...props, children: children }) }));
});
DescriptionListRoot.displayName = "DescriptionList";
// ──────────────────────────────────────────────
// DescriptionList.Item
// ──────────────────────────────────────────────
const DescriptionListItem = React__default.forwardRef(({ term, detail, className, ...props }, ref) => {
    const { variant, theme } = useDescriptionListContext();
    const isHorizontal = variant === "horizontal";
    return (jsxs("div", { ref: ref, className: cn(theme.itemStyle, isHorizontal && "sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0", className), ...props, children: [jsx("dt", { className: theme.termStyle, children: term }), jsx("dd", { className: cn(theme.detailStyle, isHorizontal && "sm:col-span-2 sm:mt-0"), children: detail })] }));
});
DescriptionListItem.displayName = "DescriptionList.Item";
// ──────────────────────────────────────────────
// Compound export
// ──────────────────────────────────────────────
const DescriptionList = Object.assign(DescriptionListRoot, {
    Item: DescriptionListItem,
});

export { DescriptionList };
