import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { Icon } from '../../../../ui/components/icon/index.js';
import { FormLabel } from '../../../../scalars/components/fragments/index.js';
import { cn } from '../../../../scalars/lib/index.js';
import { SplittedInputDiff } from '../../../../ui/components/data-entry/input/splitted-input-diff.js';
import { TextDiff } from '../../../../ui/components/data-entry/input/subcomponent/text-diff.js';
const IconRenderer = ({ customIcon, asPlaceholder }) => {
    if (typeof customIcon === 'string') {
        return (_jsx(Icon, { name: customIcon, size: 24, className: cn('shrink-0', asPlaceholder ? 'text-gray-400' : 'text-gray-700') }));
    }
    if (React.isValidElement(customIcon)) {
        return _jsx("div", { className: cn('size-6 shrink-0 overflow-hidden'), children: customIcon });
    }
    return null;
};
const IdAutocompleteDiff = ({ value = '', currentOption, label, required, autoComplete, previewPlaceholder, variant, viewMode = 'addition', baseValue = '', basePreviewIcon, basePreviewTitle = '', basePreviewPath = '', basePreviewDescription = '', renderExtraDiffs, }) => {
    const previewPlaceholderPath = (typeof previewPlaceholder?.path === 'object' ? previewPlaceholder.path.text : previewPlaceholder?.path) ?? '';
    const basePreviewPathText = typeof basePreviewPath === 'object' ? basePreviewPath.text : basePreviewPath;
    const basePreviewPathUrl = typeof basePreviewPath === 'object' ? basePreviewPath.url : undefined;
    const previewTitle = currentOption?.title ?? '';
    const previewPathText = (typeof currentOption?.path === 'object' ? currentOption.path.text : currentOption?.path) ?? '';
    const previewPathUrl = typeof currentOption?.path === 'object' ? currentOption.path.url : undefined;
    const previewDescription = currentOption?.description ?? '';
    const placeholderIcon = previewPlaceholder?.icon ?? 'PowerhouseLogoSmall';
    const baseIcon = basePreviewIcon ?? placeholderIcon;
    const baseIconAsPlaceholder = !basePreviewIcon;
    const currentIcon = currentOption?.icon ?? placeholderIcon;
    const currentIconAsPlaceholder = !currentOption?.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: "sentences", 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: viewMode === 'addition' ? currentIcon : baseIcon, asPlaceholder: viewMode === 'addition' ? currentIconAsPlaceholder : baseIconAsPlaceholder }), _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: "sentences", className: cn('w-full truncate text-sm font-bold leading-[18px]') })), ((viewMode === 'removal' || viewMode === 'mixed') && basePreviewPathText === '') ||
                                                            (viewMode === 'addition' && previewPathText === '') ? (_jsx("span", { className: cn('w-full truncate text-xs leading-[18px] text-gray-400'), children: previewPlaceholderPath === '' ? 'Path not available' : previewPlaceholderPath })) : (viewMode === 'addition' && previewPathUrl) ||
                                                            ((viewMode === 'removal' || viewMode === 'mixed') && basePreviewPathUrl) ? (_jsx("a", { href: viewMode === 'addition' ? previewPathUrl : basePreviewPathUrl, target: "_blank", rel: "noopener noreferrer", className: cn('truncate text-xs leading-[18px] text-blue-900 hover:underline focus-visible:outline-none'), children: _jsx(TextDiff, { baseValue: basePreviewPathText, value: previewPathText, viewMode: viewMode === 'mixed' ? 'removal' : viewMode, diffMode: "sentences", className: cn('text-blue-900') }) })) : (_jsx(TextDiff, { baseValue: basePreviewPathText, value: previewPathText, viewMode: viewMode === 'mixed' ? 'removal' : viewMode, diffMode: "sentences", 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: currentIcon, asPlaceholder: currentIconAsPlaceholder }), _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: "sentences", className: cn('w-full truncate text-sm font-bold leading-[18px]') })), previewPathText === '' ? (_jsx("span", { className: cn('w-full truncate text-xs leading-[18px] text-gray-400'), children: previewPlaceholderPath === '' ? 'Path not available' : previewPlaceholderPath })) : previewPathUrl ? (_jsx("a", { href: previewPathUrl, target: "_blank", rel: "noopener noreferrer", className: cn('truncate text-xs leading-[18px] text-blue-900 hover:underline focus-visible:outline-none'), children: _jsx(TextDiff, { baseValue: basePreviewPathText, value: previewPathText, viewMode: "addition", diffMode: "sentences", className: cn('text-blue-900') }) })) : (_jsx(TextDiff, { baseValue: basePreviewPathText, value: previewPathText, viewMode: "addition", diffMode: "sentences", 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: "sentences", 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: "sentences", className: cn('w-full text-xs leading-5'), childrenClassName: cn('line-clamp-2') })) }))] })), variant === 'withValueTitleAndDescription' &&
                                    renderExtraDiffs?.(viewMode, previewPlaceholder, currentOption)] }) }))] })] }));
};
export { IdAutocompleteDiff };
//# sourceMappingURL=id-autocomplete-diff.js.map