import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn, Icon } from "@powerhousedao/design-system";
import React from "react";
const IconRenderer = ({ customIcon, asPlaceholder }) => {
    if (typeof customIcon === "string") {
        return (_jsx(Icon, { name: customIcon, size: 24, className: cn("shrink-0", asPlaceholder
                ? "text-gray-400 dark:text-gray-700"
                : "text-gray-900 dark:text-gray-300") }));
    }
    if (React.isValidElement(customIcon)) {
        return _jsx("div", { className: "size-6 shrink-0 overflow-hidden", children: customIcon });
    }
    return null;
};
const ReloadButton = ({ isLoadingSelectedOption, handleFetchSelectedOption, isFetchSelectedOptionSync, value, }) => (_jsx("div", { children: _jsx("button", { type: "button", disabled: isLoadingSelectedOption || isFetchSelectedOptionSync, onClick: () => {
            if (!isLoadingSelectedOption && !isFetchSelectedOptionSync) {
                handleFetchSelectedOption(value);
            }
        }, className: cn("mt-0.5 focus-visible:outline-none", "disabled:pointer-events-none [&_svg]:pointer-events-none"), "aria-label": isLoadingSelectedOption
            ? "Loading"
            : isFetchSelectedOptionSync
                ? "Success"
                : "Reload", children: _jsx(Icon, { name: isFetchSelectedOptionSync ? "Checkmark" : "Reload", size: 16, className: cn("text-gray-500 dark:text-gray-600", isLoadingSelectedOption && "animate-spin", isFetchSelectedOptionSync && "animate-in fade-in duration-500") }) }) }));
const IdAutocompleteListOption = ({ variant = "withValue", icon, title = "Title not available", path = "Path not available", value, description = "Description not available", asPlaceholder, showValue = true, isLoadingSelectedOption, handleFetchSelectedOption, isFetchSelectedOptionSync, className, placeholderIcon = "PowerhouseLogoSmall", ...extraProps }) => {
    const renderWithValue = () => (_jsx("div", { className: cn("flex w-full items-center"), children: _jsx("span", { className: cn("truncate text-xs leading-5", asPlaceholder
                ? "text-gray-400 dark:text-gray-700"
                : "text-gray-500 dark:text-gray-600"), children: value }) }));
    const renderWithValueTitleAndDescription = (showDescription = true) => (_jsxs("div", { className: cn("flex w-full flex-col gap-1"), children: [_jsxs("div", { className: cn("flex gap-2"), children: [_jsx(IconRenderer, { customIcon: asPlaceholder ? placeholderIcon : icon, asPlaceholder: asPlaceholder }), _jsxs("div", { className: cn("flex min-w-0 grow flex-col gap-[-2px]"), children: [_jsx("span", { className: cn("truncate text-sm font-bold leading-5", asPlaceholder
                                    ? "text-gray-400 dark:text-gray-700"
                                    : "text-gray-900 dark:text-gray-300"), children: title }), !showValue && typeof path === "object" ? (_jsx("a", { href: path.url, target: "_blank", rel: "noopener noreferrer", className: cn("truncate text-xs leading-5 text-blue-900 hover:underline focus-visible:outline-none"), children: path.text })) : (_jsx("span", { className: cn("truncate text-xs leading-5", asPlaceholder
                                    ? "text-gray-400 dark:text-gray-700"
                                    : "text-gray-500 dark:text-gray-600"), children: typeof path === "object" ? path.text : path }))] }), asPlaceholder === false && handleFetchSelectedOption && (_jsx(ReloadButton, { isLoadingSelectedOption: isLoadingSelectedOption, handleFetchSelectedOption: handleFetchSelectedOption, isFetchSelectedOptionSync: isFetchSelectedOptionSync, value: value }))] }), showValue && (_jsx("div", { className: cn("flex max-w-full items-center"), children: _jsx("span", { className: cn("truncate text-xs leading-5", asPlaceholder
                        ? "text-gray-400 dark:text-gray-700"
                        : "text-gray-500 dark:text-gray-600"), children: value }) })), showDescription && (_jsx("div", { className: cn("flex flex-col"), children: _jsx("p", { className: cn("line-clamp-2 text-xs leading-5", asPlaceholder
                        ? "text-gray-400 dark:text-gray-700"
                        : "text-gray-900 dark:text-gray-300"), children: description }) })), showDescription &&
                "agentType" in extraProps &&
                typeof extraProps.agentType === "string" && (_jsx("div", { className: cn("flex max-w-full items-center justify-end"), children: _jsx("span", { className: cn("truncate text-xs leading-5", asPlaceholder
                        ? "text-gray-400 dark:text-gray-700"
                        : "text-gray-500 dark:text-gray-600"), children: extraProps.agentType }) }))] }));
    return (_jsxs("div", { className: cn("w-full max-w-full rounded-md bg-transparent px-3 pb-2", variant === "withValue" ? "pt-2" : "pt-3", className), children: [variant === "withValue" && renderWithValue(), variant === "withValueAndTitle" &&
                renderWithValueTitleAndDescription(false), variant === "withValueTitleAndDescription" &&
                renderWithValueTitleAndDescription()] }));
};
export { IdAutocompleteListOption };
//# sourceMappingURL=id-autocomplete-list-option.js.map