import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
/**
 * Copyright (c) 2020-present, Goldman Sachs
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { useRef, useState } from 'react';
import { clsx, CheckSquareIcon, SquareIcon, BasePopover, ResizablePanelSplitter, ResizablePanelGroup, ResizablePanel, ResizablePanelSplitterLine, InfoCircleIcon, useDragPreviewLayer, PanelLoadingIndicator, BlankPanelContent, ChevronDownIcon, ChevronRightIcon, ShareBoxIcon, Tooltip, BaseRadioGroup, ClickAwayListener, } from '@finos/legend-art';
import { CORE_PURE_PATH, Class, ELEMENT_PATH_DELIMITER, Enumeration, PROPERTY_ACCESSOR, PURE_DOC_TAG, TYPE_CAST_TOKEN, getAllClassProperties, getAllOwnClassProperties, } from '@finos/legend-graph';
import { ADVANCED_FUZZY_SEARCH_MODE, at, guaranteeNonNullable, prettyCONSTName, } from '@finos/legend-shared';
import { observer } from 'mobx-react-lite';
import { useDrag } from 'react-dnd';
import { QUERY_BUILDER_PROPERTY_SEARCH_TYPE } from '../../stores/QueryBuilderConfig.js';
import { QueryBuilderExplorerTreePropertyNodeData, QueryBuilderExplorerTreeSubTypeNodeData, QUERY_BUILDER_EXPLORER_TREE_DND_TYPE, getQueryBuilderPropertyNodeData, } from '../../stores/explorer/QueryBuilderExplorerState.js';
import { QUERY_BUILDER_EXPLORER_SEARCH_INPUT_NAME, QueryBuilderSubclassInfoTooltip, renderPropertyTypeIcon, } from './QueryBuilderExplorerPanel.js';
import { QueryBuilderPropertyInfoTooltip } from '../shared/QueryBuilderPropertyInfoTooltip.js';
import { QUERY_BUILDER_TEST_ID } from '../../__lib__/QueryBuilderTesting.js';
import { DocumentationLink } from '@finos/legend-lego/application';
import { LEGEND_APPLICATION_DOCUMENTATION_KEY } from '@finos/legend-application';
export const prettyPropertyNameFromNodeId = (name, spaceBetweenSlash) => name
    .split(TYPE_CAST_TOKEN)
    .map((p) => p.replace(new RegExp(String.raw `.*${ELEMENT_PATH_DELIMITER}`), ''))
    .filter((p) => p !== '')
    .map((p) => p
    .split(PROPERTY_ACCESSOR)
    .map(prettyCONSTName)
    .join(spaceBetweenSlash ? ' / ' : '/'))
    .join(TYPE_CAST_TOKEN);
export const prettyPropertyNameForSubType = (name, spaceBetweenSlash) => {
    let propNameArray = name.split(TYPE_CAST_TOKEN);
    propNameArray = propNameArray
        .map((p) => p.replace(new RegExp(String.raw `.*${ELEMENT_PATH_DELIMITER}`), ''))
        .filter((p) => p !== '');
    let propName = propNameArray
        .slice(0, -1)
        .map((p) => `(${TYPE_CAST_TOKEN}${p
        .split(PROPERTY_ACCESSOR)
        .map((sp) => prettyCONSTName(sp))
        .join(spaceBetweenSlash ? ' / ' : '/')})`)
        .join(spaceBetweenSlash ? ' / ' : '/');
    propName += spaceBetweenSlash ? ' / ' : '/';
    propNameArray = guaranteeNonNullable(propNameArray[propNameArray.length - 1]).split(PROPERTY_ACCESSOR);
    propNameArray = propNameArray.map((p) => prettyCONSTName(p));
    propName = `${propName}(${TYPE_CAST_TOKEN}${propNameArray[0]})${spaceBetweenSlash ? ' / ' : '/'}`;
    propNameArray.slice(1).forEach((p) => {
        propName = `${propName + p}${spaceBetweenSlash ? ' / ' : '/'}`;
    });
    propName = propName.slice(0, spaceBetweenSlash ? -3 : -1);
    return propName;
};
export const formatTextWithHighlightedMatches = (displayText, searchText, className, id) => {
    // Get ranges to highlight
    const highlightRanges = [];
    searchText
        .split(/\/| /)
        .filter((word) => word.trim().length > 0)
        .forEach((word) => {
        const regex = new RegExp(word, 'gi');
        let match;
        while ((match = regex.exec(displayText))) {
            highlightRanges.push([match.index, match.index + word.length]);
        }
    });
    // Combine any overlapping highlight ranges
    const combinedHighlightRanges = [];
    highlightRanges.sort((a, b) => a[0] - b[0]);
    highlightRanges.forEach((range) => {
        if (!combinedHighlightRanges.length) {
            combinedHighlightRanges.push(range);
        }
        else {
            const lastRange = combinedHighlightRanges[combinedHighlightRanges.length - 1];
            if (lastRange !== undefined && range[0] <= lastRange[1]) {
                lastRange[1] = Math.max(lastRange[1], range[1]);
            }
            else {
                combinedHighlightRanges.push(range);
            }
        }
    });
    // Return the property name if there are no highlight ranges
    if (!combinedHighlightRanges.length) {
        return _jsx("span", { children: displayText });
    }
    // Create formatted node
    const formattedNode = [];
    const highlightRange = at(combinedHighlightRanges, 0)[0];
    if (highlightRange > 0) {
        formattedNode.push(_jsx("span", { children: displayText.substring(0, highlightRange) }, `${id}-0-${displayText.substring(0, highlightRange)}`));
    }
    combinedHighlightRanges.forEach((range, index) => {
        formattedNode.push(_jsx("span", { className: `${className}--highlight`, children: displayText.substring(range[0], range[1]) }, `${id}-${index * 2}-${displayText.substring(range[0], range[1])}`));
        if (index < combinedHighlightRanges.length - 1 &&
            range[1] < displayText.length) {
            const highlightRange2 = at(combinedHighlightRanges, index + 1)[0];
            formattedNode.push(_jsx("span", { children: displayText.substring(range[1], highlightRange2) }, `${id}-${index * 2 + 1}--${displayText.substring(range[1], highlightRange2)}`));
        }
    });
    const highlightRange3 = at(combinedHighlightRanges, combinedHighlightRanges.length - 1)[1];
    if (highlightRange3 < displayText.length) {
        formattedNode.push(_jsx("span", { children: displayText.substring(highlightRange3) }, `${id}-${combinedHighlightRanges.length * 2 + 2}-${displayText.substring(highlightRange3)}`));
    }
    return formattedNode;
};
const QUERY_BUILDER_PROPERTY_SEARCH_LABEL_TEXT_CLASS = 'query-builder-property-search-panel__node__label';
const QUERY_BUILDER_PROPERTY_SEARCH_DOC_TEXT_CLASS = 'query-builder-property-search-panel__node__doc';
const QueryBuilderTreeNodeViewer = observer((props) => {
    const { node, queryBuilderState, explorerState, level, stepPaddingInRem } = props;
    const isExpandable = Boolean(node.childrenIds.length);
    const propertySearchState = explorerState.propertySearchState;
    const [, dragConnector, dragPreviewConnector] = useDrag(() => ({
        type: node instanceof QueryBuilderExplorerTreePropertyNodeData
            ? node.type instanceof Enumeration
                ? QUERY_BUILDER_EXPLORER_TREE_DND_TYPE.ENUM_PROPERTY
                : node.type instanceof Class
                    ? QUERY_BUILDER_EXPLORER_TREE_DND_TYPE.CLASS_PROPERTY
                    : QUERY_BUILDER_EXPLORER_TREE_DND_TYPE.PRIMITIVE_PROPERTY
            : QUERY_BUILDER_EXPLORER_TREE_DND_TYPE.ROOT,
        item: () => node instanceof QueryBuilderExplorerTreePropertyNodeData
            ? { node }
            : {},
        canDrag: () => !(node.type instanceof Class),
        collect: (monitor) => ({
            isDragging: monitor.isDragging(),
        }),
    }), [node]);
    const ref = useRef(null);
    dragConnector(ref);
    useDragPreviewLayer(dragPreviewConnector);
    const getChildrenNodes = () => {
        const childNodes = [];
        if (node.childrenIds.length) {
            if ((node instanceof QueryBuilderExplorerTreePropertyNodeData ||
                node instanceof QueryBuilderExplorerTreeSubTypeNodeData) &&
                node.type instanceof Class) {
                (node instanceof QueryBuilderExplorerTreeSubTypeNodeData
                    ? getAllOwnClassProperties(node.type)
                    : getAllClassProperties(node.type)).forEach((property) => {
                    const propertyTreeNodeData = getQueryBuilderPropertyNodeData(property, node, guaranteeNonNullable(queryBuilderState.explorerState
                        .mappingModelCoverageAnalysisResult));
                    if (propertyTreeNodeData &&
                        !(propertyTreeNodeData.type instanceof Class) &&
                        propertyTreeNodeData.mappingData.mapped) {
                        childNodes.push(propertyTreeNodeData);
                    }
                });
            }
        }
        return childNodes;
    };
    const handleHighlightNode = () => {
        explorerState.propertySearchState.setIsSearchPanelOpen(false);
        explorerState.propertySearchState.resetSearch();
        explorerState.highlightTreeNode(node.id);
    };
    const parentNode = propertySearchState.indexedExplorerTreeNodes.find((pn) => node instanceof QueryBuilderExplorerTreePropertyNodeData &&
        node.parentId === pn.id);
    const propertyName = parentNode?.type instanceof Class && level > 1
        ? prettyCONSTName(node.label)
        : parentNode instanceof QueryBuilderExplorerTreeSubTypeNodeData
            ? prettyPropertyNameForSubType(node.id, true)
            : prettyPropertyNameFromNodeId(node.id, true);
    const nodeExpandIcon = isExpandable ? (node.isOpen ? (_jsx(ChevronDownIcon, {})) : (_jsx(ChevronRightIcon, {}))) : (_jsx("div", {}));
    const docText = node instanceof QueryBuilderExplorerTreePropertyNodeData
        ? (node.property.taggedValues.find((taggedValue) => taggedValue.tag.ownerReference.value.path ===
            CORE_PURE_PATH.PROFILE_DOC &&
            taggedValue.tag.value.value === PURE_DOC_TAG)?.value ?? null)
        : null;
    const formattedDocText = docText !== null
        ? formatTextWithHighlightedMatches(docText, propertySearchState.searchText, QUERY_BUILDER_PROPERTY_SEARCH_DOC_TEXT_CLASS, `${node.id}_doc`)
        : null;
    const isMultiple = propertySearchState.isNodeMultiple(node);
    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "tree-view__node__container query-builder-property-search-panel__node__container", ref: ref, style: {
                    paddingLeft: `${(level - 1) * stepPaddingInRem + 0.5}rem`,
                    display: 'flex',
                }, onClick: () => node.setIsOpen(!node.isOpen), 
                // Temporarily hide away the panel when we drag-and-drop the properties
                onDrag: () => propertySearchState.setIsSearchPanelHidden(true), onDragEnd: () => propertySearchState.setIsSearchPanelHidden(false), children: [_jsxs("div", { className: "tree-view__node__icon query-builder-property-search-panel__node__icon", children: [_jsx("div", { className: "query-builder-property-search-panel__expand-icon", children: nodeExpandIcon }), _jsx("div", { className: "query-builder-property-search-panel__type-icon", children: renderPropertyTypeIcon(node.type) })] }), _jsxs("div", { className: "query-builder-property-search-panel__node__content", children: [_jsxs("div", { className: "tree-view__node__label query-builder-property-search-panel__node__label", children: [formatTextWithHighlightedMatches(propertyName, propertySearchState.searchText, QUERY_BUILDER_PROPERTY_SEARCH_LABEL_TEXT_CLASS, node.id), isMultiple && (_jsx("div", { className: "query-builder-explorer-tree__node__label__multiple", title: "Multiple values of this property can cause row explosion", children: "*" }))] }), _jsx("div", { className: "tree-view__node__label query-builder-property-search-panel__node__doc", children: formattedDocText })] }), _jsxs("div", { className: "query-builder-property-search-panel__node__actions", children: [node instanceof QueryBuilderExplorerTreePropertyNodeData && (_jsxs(_Fragment, { children: [_jsx(QueryBuilderPropertyInfoTooltip, { title: propertyName, property: node.property, path: node.id, isMapped: node.mappingData.mapped, children: _jsx("div", { title: "Property info", className: "query-builder-property-search-panel__node__action query-builder-property-search-panel__node__info", children: _jsx(InfoCircleIcon, {}) }) }), _jsx("button", { onClick: handleHighlightNode, title: "Show in tree", className: "query-builder-property-search-panel__node__action query-builder-property-search-panel__node__highlight", children: _jsx(ShareBoxIcon, {}) })] })), node instanceof QueryBuilderExplorerTreeSubTypeNodeData && (_jsxs(_Fragment, { children: [_jsx(QueryBuilderSubclassInfoTooltip, { subclass: node.subclass, path: node.id, isMapped: node.mappingData.mapped, multiplicity: node.multiplicity, children: _jsx("div", { title: "Property info", className: "query-builder-property-search-panel__node__action query-builder-property-search-panel__node__info", children: _jsx(InfoCircleIcon, {}) }) }), _jsx("button", { onClick: handleHighlightNode, title: "Show in tree", className: "query-builder-property-search-panel__node__action query-builder-property-search-panel__node__highlight", children: _jsx(ShareBoxIcon, {}) })] }))] })] }), node.isOpen &&
                getChildrenNodes()
                    .filter((childNode) => propertySearchState.isNodeIncludedInFilter(childNode))
                    .sort((nodeA, nodeB) => nodeA.label.localeCompare(nodeB.label))
                    .map((childNode) => (_jsx(QueryBuilderTreeNodeViewer, { node: childNode, queryBuilderState: queryBuilderState, level: level + 1, stepPaddingInRem: 2, explorerState: queryBuilderState.explorerState }, `${node.id}>${childNode.id}`)))] }));
});
const QueryBuilderSearchConfigToggleButton = observer((props) => {
    const { label, enabled, onClick, showOnlyButton, onOnlyButtonClick } = props;
    const [isMouseOver, setIsMouseOver] = useState(false);
    return (_jsxs("div", { className: "query-builder-property-search-panel__form__section__toggler__btn__container", onMouseEnter: () => setIsMouseOver(true), onMouseLeave: () => setIsMouseOver(false), children: [_jsxs("button", { className: clsx('query-builder-property-search-panel__form__section__toggler__btn', {
                    'query-builder-property-search-panel__form__section__toggler__btn--toggled': enabled,
                }), onClick: onClick, tabIndex: -1, children: [enabled ? _jsx(CheckSquareIcon, {}) : _jsx(SquareIcon, {}), _jsx("div", { className: "query-builder-property-search-panel__form__section__toggler__prompt", children: label })] }), showOnlyButton && isMouseOver && (_jsx("button", { className: "query-builder-property-search-panel__form__section__toggler__only-btn", onClick: onOnlyButtonClick, children: "only" }))] }));
});
const QueryBuilderSearchConfigToggleButtonGroup = observer((props) => {
    const { header, headerTooltipText, buttons } = props;
    return (_jsxs("div", { className: "query-builder-property-search-panel__form__section", children: [_jsxs("div", { className: "query-builder-property-search-panel__form__section__header__label", children: [header, headerTooltipText && (_jsx(Tooltip, { slotProps: {
                            transition: {
                                timeout: 0,
                            },
                        }, title: _jsx("div", { children: headerTooltipText }), children: _jsx("div", { className: "query-builder-property-search-panel__tagged-values__tooltip", children: _jsx(InfoCircleIcon, {}) }) }))] }), buttons.map(({ label, enabled, onClick, onOnlyButtonClick }) => (_jsx(QueryBuilderSearchConfigToggleButton, { label: label, enabled: enabled, onClick: onClick, showOnlyButton: buttons.length > 1, onOnlyButtonClick: onOnlyButtonClick }, label)))] }));
});
export const QueryBuilderPropertySearchPanel = observer((props) => {
    const { queryBuilderState, triggerElement, clearSearch } = props;
    const explorerState = queryBuilderState.explorerState;
    const propertySearchState = explorerState.propertySearchState;
    const handleClose = (event) => {
        if (event.target instanceof HTMLInputElement &&
            event.target.name === QUERY_BUILDER_EXPLORER_SEARCH_INPUT_NAME) {
            return;
        }
        clearSearch();
        propertySearchState.setIsSearchPanelOpen(false);
    };
    const handleSearchMode = (event) => {
        const searchMode = event.target.value;
        propertySearchState.searchConfigurationState.setCurrentMode(searchMode);
    };
    const handleToggleIncludeSubTypes = () => {
        (async () => {
            propertySearchState.searchConfigurationState.setIncludeSubTypes(!propertySearchState.searchConfigurationState.includeSubTypes);
            await propertySearchState.initialize();
            await propertySearchState.search();
        })().catch(propertySearchState.queryBuilderState.applicationStore
            .alertUnhandledError);
    };
    const handleToggleIncludeDocumentation = () => {
        (async () => {
            propertySearchState.searchConfigurationState.setIncludeDocumentation(!propertySearchState.searchConfigurationState.includeDocumentation);
            await propertySearchState.initialize();
            await propertySearchState.search();
        })().catch(propertySearchState.queryBuilderState.applicationStore
            .alertUnhandledError);
    };
    return (_jsx(BasePopover, { open: propertySearchState.isSearchPanelOpen, slotProps: {
            paper: {
                classes: {
                    root: 'query-builder-property-search-panel__container__root',
                },
            },
        }, className: clsx('query-builder-property-search-panel__container', {
            'query-builder-property-search-panel__container--hidden': propertySearchState.isSearchPanelHidden,
        }), anchorEl: triggerElement, onClose: handleClose, hideBackdrop: true, disableAutoFocus: true, disableEnforceFocus: true, anchorOrigin: {
            vertical: 40,
            horizontal: 'left',
        }, transformOrigin: {
            vertical: 'top',
            horizontal: 'center',
        }, children: _jsx(ClickAwayListener, { onClickAway: handleClose, children: _jsx("div", { "data-testid": QUERY_BUILDER_TEST_ID.QUERY_BUILDER_PROPERTY_SEARCH_PANEL, className: "query-builder-property-search-panel", children: _jsx("div", { className: "query-builder-property-search-panel__content", children: _jsxs(ResizablePanelGroup, { orientation: "vertical", children: [_jsx(ResizablePanel, { size: 175, children: _jsxs("div", { className: "query-builder-property-search-panel__config", children: [_jsxs("div", { className: "query-builder-property-search-panel__form__section", children: [_jsxs("div", { className: "query-builder-property-search-panel__form__section__header__label", children: ["Search Mode", _jsx(DocumentationLink, { documentationKey: LEGEND_APPLICATION_DOCUMENTATION_KEY.QUESTION_HOW_TO_USE_ADVANCED_SEARCH_SYNTAX })] }), _jsx("div", { className: "query-builder-property-search-panel__filter__element", children: _jsx(BaseRadioGroup, { className: "query-builder-property-search-panel__search-mode__options", value: propertySearchState.searchConfigurationState
                                                            .currentMode, onChange: handleSearchMode, row: false, options: [
                                                            ADVANCED_FUZZY_SEARCH_MODE.STANDARD,
                                                            ADVANCED_FUZZY_SEARCH_MODE.INCLUDE,
                                                            ADVANCED_FUZZY_SEARCH_MODE.EXACT,
                                                            ADVANCED_FUZZY_SEARCH_MODE.INVERSE,
                                                        ], size: 1 }) })] }), _jsx(QueryBuilderSearchConfigToggleButtonGroup, { header: "One-Many rows", buttons: [
                                                {
                                                    label: 'Include',
                                                    enabled: propertySearchState.includeOneMany,
                                                    onClick: () => propertySearchState.setIncludeOneMany(!propertySearchState.includeOneMany),
                                                },
                                            ] }), _jsx(QueryBuilderSearchConfigToggleButtonGroup, { header: "Documentation", headerTooltipText: `Include "doc" type tagged values in search results`, buttons: [
                                                {
                                                    label: 'Include',
                                                    enabled: propertySearchState.searchConfigurationState
                                                        .includeDocumentation,
                                                    onClick: handleToggleIncludeDocumentation,
                                                },
                                            ] }), _jsx(QueryBuilderSearchConfigToggleButtonGroup, { header: "Sub-types", buttons: [
                                                {
                                                    label: 'Include',
                                                    enabled: propertySearchState.searchConfigurationState
                                                        .includeSubTypes,
                                                    onClick: handleToggleIncludeSubTypes,
                                                },
                                            ] }), _jsx(QueryBuilderSearchConfigToggleButtonGroup, { header: "By type", buttons: [
                                                {
                                                    label: 'Class',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.CLASS),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.CLASS);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.CLASS);
                                                    },
                                                },
                                                {
                                                    label: 'Enumeration',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.ENUMERATION),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.ENUMERATION);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.ENUMERATION);
                                                    },
                                                },
                                                {
                                                    label: 'String',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.STRING),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.STRING);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.STRING);
                                                    },
                                                },
                                                {
                                                    label: 'Boolean',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.BOOLEAN),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.BOOLEAN);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.BOOLEAN);
                                                    },
                                                },
                                                {
                                                    label: 'Number',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.NUMBER),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.NUMBER);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.NUMBER);
                                                    },
                                                },
                                                {
                                                    label: 'Date',
                                                    enabled: propertySearchState.typeFilters.includes(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.DATE),
                                                    onClick: () => {
                                                        propertySearchState.toggleFilterForType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.DATE);
                                                    },
                                                    onOnlyButtonClick: () => {
                                                        propertySearchState.setFilterOnlyType(QUERY_BUILDER_PROPERTY_SEARCH_TYPE.DATE);
                                                    },
                                                },
                                            ] })] }) }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsxs(ResizablePanel, { children: [(propertySearchState.initializationState.isInProgress ||
                                        propertySearchState.searchState.isInProgress) && (_jsx(PanelLoadingIndicator, { isLoading: true })), _jsxs("div", { className: "query-builder-property-search-panel__results", children: [!propertySearchState.initializationState.isInProgress &&
                                                !propertySearchState.searchState.isInProgress && (_jsxs(_Fragment, { children: [Boolean(propertySearchState.filteredSearchResults.length) &&
                                                        propertySearchState.filteredSearchResults.map((node) => (_jsx(QueryBuilderTreeNodeViewer, { node: node, queryBuilderState: queryBuilderState, level: 1, stepPaddingInRem: 0, explorerState: queryBuilderState.explorerState }, node.id))), !propertySearchState.filteredSearchResults.length &&
                                                        propertySearchState.searchText && (_jsxs(BlankPanelContent, { children: [_jsx("div", { className: "query-builder-property-search-panel__result-placeholder__text", children: "No result" }), _jsx("div", { className: "query-builder-property-search-panel__result-placeholder__tips", children: "Tips: Navigate deeper into the explorer tree to improve the scope and accuracy of the search" })] }))] })), propertySearchState.initializationState.isInProgress && (_jsx(BlankPanelContent, { children: "Initializing..." })), propertySearchState.searchState.isInProgress && (_jsx(BlankPanelContent, { children: "Searching..." }))] })] })] }) }) }) }) }));
});
//# sourceMappingURL=QueryBuilderPropertySearchPanel.js.map