import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/* eslint-disable react/jsx-max-depth */
import { Icon } from "../../icon/index.js";
import { FormLabel } from "../../../../scalars/components/fragments/index.js";
import { cn } from "../../../../scalars/lib/index.js";
import React from "react";
import { SplittedInputDiff } from "../input/splitted-input-diff.js";
import { TextDiff } from "../input/subcomponent/text-diff.js";
const IconRenderer = ({ customIcon, asPlaceholder, isRemoval, isAddition, }) => {
    if (typeof customIcon === "string") {
        return (_jsx(Icon, { name: customIcon, size: 24, className: cn("shrink-0", asPlaceholder ? "text-gray-400" : "text-gray-700", isRemoval && "rounded-md bg-red-600/30 p-1", isAddition && "rounded-md bg-green-600/30 p-1") }));
    }
    if (React.isValidElement(customIcon)) {
        return (_jsx("div", { className: cn("size-6 shrink-0 overflow-hidden", isRemoval && "rounded-md bg-red-600/30 p-1", isAddition && "rounded-md bg-green-600/30 p-1"), children: customIcon }));
    }
    return null;
};
const PHIDInputDiff = ({ value = "", label, required, autoComplete, initialOptions, previewPlaceholder, variant, viewMode, diffMode = "sentences", baseValue = "", basePreviewIcon, basePreviewTitle = "", basePreviewPath = "", basePreviewDescription = "", }) => {
    const matchingOption = Array.isArray(initialOptions)
        ? initialOptions.find((option) => option.value === value)
        : undefined;
    const previewPlaceholderPath = (typeof previewPlaceholder?.path === "object"
        ? previewPlaceholder.path.text
        : previewPlaceholder?.path) ?? "";
    const previewTitle = matchingOption?.title ?? "";
    const previewPath = (typeof matchingOption?.path === "object"
        ? matchingOption.path.text
        : matchingOption?.path) ?? "";
    const previewDescription = matchingOption?.description ?? "";
    // TODO: implement icon differences
    // temporary logic to handle icon rendering
    const asPlaceholder = matchingOption?.icon === undefined;
    const previewIcon = asPlaceholder
        ? (previewPlaceholder?.icon ?? "PowerhouseLogoSmall")
        : matchingOption.icon;
    return (_jsxs("div", { className: cn("flex flex-col gap-2"), children: [label && (_jsx(FormLabel, { disabled: true, required: required, children: label })), _jsxs("div", { className: cn("relative w-full rounded-md bg-gray-100"), children: [_jsx("div", { className: cn("absolute left-0 right-0 top-0 z-10 w-full rounded-md bg-gray-50"), children: _jsx(SplittedInputDiff, { baseValue: baseValue, value: value, viewMode: viewMode, diffMode: diffMode, showCopyIcon: true }) }), autoComplete &&
                        (variant === "withValueAndTitle" ||
                            variant === "withValueTitleAndDescription") && (_jsx("div", { className: cn("w-full max-w-full rounded-md px-3 pb-2 pt-3"), children: _jsxs("div", { className: cn("mt-8 flex w-full flex-col gap-1"), children: [_jsxs("div", { className: cn("grid w-full", viewMode === "mixed" && "grid-cols-2 gap-4"), children: [_jsxs("div", { className: cn("flex gap-2 overflow-hidden", viewMode === "mixed" && "pr-1"), children: [_jsx(IconRenderer, { customIcon: previewIcon, asPlaceholder: asPlaceholder }), _jsxs("div", { className: cn("flex min-w-0 grow flex-col gap-1 overflow-hidden"), children: [((viewMode === "removal" || viewMode === "mixed") &&
                                                            basePreviewTitle === "") ||
                                                            (viewMode === "addition" && previewTitle === "") ? (_jsx("span", { className: cn("w-full truncate text-sm font-bold leading-[18px] text-gray-400"), children: previewPlaceholder?.title ?? "Title not available" })) : (_jsx(TextDiff, { baseValue: basePreviewTitle, value: previewTitle, viewMode: viewMode === "mixed" ? "removal" : viewMode, diffMode: diffMode, className: cn("w-full truncate text-sm font-bold leading-[18px]") })), ((viewMode === "removal" || viewMode === "mixed") &&
                                                            basePreviewPath === "") ||
                                                            (viewMode === "addition" && previewPath === "") ? (_jsx("span", { className: cn("w-full truncate text-xs leading-[18px] text-gray-400"), children: previewPlaceholderPath === ""
                                                                ? "Type not available"
                                                                : previewPlaceholderPath })) : (_jsx(TextDiff, { baseValue: basePreviewPath, value: previewPath, viewMode: viewMode === "mixed" ? "removal" : viewMode, diffMode: diffMode, className: cn("w-full truncate text-xs leading-[18px] text-gray-500") }))] })] }), viewMode === "mixed" && (_jsxs("div", { className: cn("flex gap-2 overflow-hidden pl-1"), children: [_jsx(IconRenderer, { customIcon: previewIcon, asPlaceholder: asPlaceholder }), _jsxs("div", { className: cn("flex min-w-0 grow flex-col gap-1 overflow-hidden"), children: [previewTitle === "" ? (_jsx("span", { className: cn("w-full truncate text-sm font-bold leading-[18px] text-gray-400"), children: previewPlaceholder?.title ?? "Title not available" })) : (_jsx(TextDiff, { baseValue: basePreviewTitle, value: previewTitle, viewMode: "addition", diffMode: diffMode, className: cn("w-full truncate text-sm font-bold leading-[18px]") })), previewPath === "" ? (_jsx("span", { className: cn("w-full truncate text-xs leading-[18px] text-gray-400"), children: previewPlaceholderPath === ""
                                                                ? "Type not available"
                                                                : previewPlaceholderPath })) : (_jsx(TextDiff, { baseValue: basePreviewPath, value: previewPath, viewMode: "addition", diffMode: diffMode, className: cn("w-full truncate text-xs leading-[18px] text-gray-500") }))] })] }))] }), variant === "withValueTitleAndDescription" && (_jsxs("div", { className: cn("grid w-full", viewMode === "mixed" && "grid-cols-2 gap-4"), children: [_jsx("div", { className: cn("flex w-full flex-col", viewMode === "mixed" && "pr-1"), children: ((viewMode === "removal" || viewMode === "mixed") &&
                                                basePreviewDescription === "") ||
                                                (viewMode === "addition" && previewDescription === "") ? (_jsx("span", { className: cn("line-clamp-2 w-full text-xs leading-5 text-gray-400"), children: previewPlaceholder?.description ??
                                                    "Description not available" })) : (_jsx(TextDiff, { baseValue: basePreviewDescription, value: previewDescription, viewMode: viewMode === "mixed" ? "removal" : viewMode, diffMode: diffMode, className: cn("w-full text-xs leading-5"), childrenClassName: cn("line-clamp-2") })) }), viewMode === "mixed" && (_jsx("div", { className: cn("flex w-full flex-col pl-1"), children: previewDescription === "" ? (_jsx("span", { className: cn("line-clamp-2 w-full text-xs leading-5 text-gray-400"), children: previewPlaceholder?.description ??
                                                    "Description not available" })) : (_jsx(TextDiff, { baseValue: basePreviewDescription, value: previewDescription, viewMode: "addition", diffMode: diffMode, className: cn("w-full text-xs leading-5"), childrenClassName: cn("line-clamp-2") })) }))] }))] }) }))] })] }));
};
export { PHIDInputDiff };
//# sourceMappingURL=phid-input-diff.js.map