'use client';
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
import { getTranslation } from '@payloadcms/translations';
import { PeopleIcon } from '../../../icons/People/index.js';
import { XIcon } from '../../../icons/X/index.js';
import { useConfig } from '../../../providers/Config/index.js';
import { useTranslation } from '../../../providers/Translation/index.js';
import { Pill } from '../../Pill/index.js';
import './index.scss';
const baseClass = 'active-query-preset';
export function QueryPresetToggler({ activePreset, openPresetListDrawer, resetPreset }) {
    const { i18n, t } = useTranslation();
    const { getEntityConfig } = useConfig();
    const presetsConfig = getEntityConfig({
        collectionSlug: 'payload-query-presets'
    });
    return /*#__PURE__*/ _jsxDEV(Pill, {
        className: [
            baseClass,
            activePreset && `${baseClass}--active`
        ].filter(Boolean).join(' '),
        id: "select-preset",
        onClick: ()=>{
            openPresetListDrawer();
        },
        pillStyle: "light",
        size: "small",
        children: /*#__PURE__*/ _jsxDEV("div", {
            className: `${baseClass}__label`,
            children: [
                activePreset?.isShared && /*#__PURE__*/ _jsxDEV(PeopleIcon, {
                    className: `${baseClass}__shared`
                }, void 0, false, {
                    fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
                    lineNumber: 42,
                    columnNumber: 36
                }, this),
                /*#__PURE__*/ _jsxDEV("div", {
                    className: `${baseClass}__label-text-max-width`,
                    children: /*#__PURE__*/ _jsxDEV("div", {
                        className: `${baseClass}__label-text`,
                        children: activePreset?.title || t('general:selectLabel', {
                            label: getTranslation(presetsConfig.labels.singular, i18n)
                        })
                    }, void 0, false, {
                        fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
                        lineNumber: 44,
                        columnNumber: 11
                    }, this)
                }, void 0, false, {
                    fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
                    lineNumber: 43,
                    columnNumber: 9
                }, this),
                activePreset ? /*#__PURE__*/ _jsxDEV("div", {
                    className: `${baseClass}__clear`,
                    id: "clear-preset",
                    onClick: async (e)=>{
                        e.stopPropagation();
                        await resetPreset();
                    },
                    onKeyDown: async (e)=>{
                        if (e.key === 'Enter' || e.key === ' ') {
                            e.stopPropagation();
                            await resetPreset();
                        }
                    },
                    role: "button",
                    tabIndex: 0,
                    children: /*#__PURE__*/ _jsxDEV(XIcon, {}, void 0, false, {
                        fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
                        lineNumber: 68,
                        columnNumber: 13
                    }, this)
                }, void 0, false, {
                    fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
                    lineNumber: 52,
                    columnNumber: 11
                }, this) : null
            ]
        }, void 0, true, {
            fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
            lineNumber: 41,
            columnNumber: 7
        }, this)
    }, void 0, false, {
        fileName: "src/elements/QueryPresets/QueryPresetToggler/index.tsx",
        lineNumber: 32,
        columnNumber: 5
    }, this);
}

//# sourceMappingURL=index.js.map