import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2007-2026 GoodData Corporation
import { useMemo } from "react";
import cx from "classnames";
import { compact, sortBy } from "lodash-es";
import { FormattedMessage } from "react-intl";
import { Typography } from "@gooddata/sdk-ui-kit";
import { useDashboardSelector } from "../../../model/react/DashboardStoreProvider.js";
import { selectSupportsRichTextWidgets } from "../../../model/store/backendCapabilities/backendCapabilitiesSelectors.js";
import { selectEnableKDRichText, selectEnableVisualizationSwitcher, selectSettings, } from "../../../model/store/config/configSelectors.js";
import { selectIsNewDashboard } from "../../../model/store/meta/metaSelectors.js";
import { DraggableInsightList } from "./DraggableInsightList/DraggableInsightList.js";
export function CreationPanel(props) {
    const { className, WrapCreatePanelItemWithDragComponent, WrapInsightListItemWithDragComponent } = props;
    const supportsRichText = useDashboardSelector(selectSupportsRichTextWidgets);
    const enableRichText = useDashboardSelector(selectEnableKDRichText);
    const enableVisualizationSwitcher = useDashboardSelector(selectEnableVisualizationSwitcher);
    const isNewDashboard = useDashboardSelector(selectIsNewDashboard);
    const settings = useDashboardSelector(selectSettings);
    const AttributeFilterComponentSet = props.AttributeFilterComponentSet;
    const InsightWidgetComponentSet = props.InsightWidgetComponentSet;
    const RichTextWidgetComponentSet = props.RichTextWidgetComponentSet;
    const VisualizationSwitcherWidgetComponentSet = props.VisualizationSwitcherWidgetComponentSet;
    const DashboardLayoutWidgetComponentSet = props.DashboardLayoutWidgetComponentSet;
    const addItemPanelItems = useMemo(() => {
        const items = compact([
            InsightWidgetComponentSet.creating,
            AttributeFilterComponentSet.creating,
            DashboardLayoutWidgetComponentSet.creating,
            enableVisualizationSwitcher && VisualizationSwitcherWidgetComponentSet.creating,
            supportsRichText && enableRichText && RichTextWidgetComponentSet.creating,
        ]);
        return sortBy(items, (item) => item.priority ?? 0).map(({ CreatePanelListItemComponent, type }) => {
            return (_jsx(CreatePanelListItemComponent, { WrapCreatePanelItemWithDragComponent: WrapCreatePanelItemWithDragComponent }, type));
        });
    }, [
        AttributeFilterComponentSet,
        InsightWidgetComponentSet,
        RichTextWidgetComponentSet,
        VisualizationSwitcherWidgetComponentSet,
        DashboardLayoutWidgetComponentSet,
        supportsRichText,
        enableRichText,
        enableVisualizationSwitcher,
        WrapCreatePanelItemWithDragComponent,
    ]);
    return (_jsx("div", { className: cx("configuration-panel creation-panel", className), children: _jsxs("div", { className: "configuration-panel-content", children: [
                _jsx(Typography, { tagName: "h2", className: "flex-panel-item-nostretch", children: _jsx(FormattedMessage, { id: "visualizationsList.dragToAdd" }) }), _jsxs("div", { className: "configuration-category drag-to-add", children: [
                        _jsx(Typography, { tagName: "h3", children: _jsx(FormattedMessage, { id: "addPanel.newItem" }) }), _jsx("div", { className: "add-item-panel", children: addItemPanelItems })
                    ] }), _jsxs("div", { className: "configuration-category configuration-category-vis drag-to-add flex-panel-item-stretch", children: [
                        _jsx(Typography, { tagName: "h3", children: _jsx(FormattedMessage, { id: "visualizationsList.savedVisualizations" }) }), _jsx(DraggableInsightList, { WrapInsightListItemWithDragComponent: WrapInsightListItemWithDragComponent, recalculateSizeReference: className, searchAutofocus: !isNewDashboard, enableDescriptions: settings?.enableDescriptions })
                    ] })
            ] }) }));
}
//# sourceMappingURL=CreationPanel.js.map