'use strict';

var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
var React = require('react');
var box = require('../box/box.cjs');
var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/UI.cjs');
require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/useDayPicker.cjs');
var flex = require('../flex/flex.cjs');
var select = require('../select/select.cjs');
require('../tooltip/tooltip.cjs');
var datePicker = require('../calendar/date-picker.cjs');
require('../../node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/dayjs.min.cjs');
require('../popover/popover.cjs');
require('../input-field/input-field.cjs');
var text = require('../text/text.cjs');
var textfield = require('../textfield/textfield.cjs');
var filterChip_module = require('./filter-chip.module.css.cjs');
var filters = require('../../types/filters.cjs');

const chip = index.cva(filterChip_module.default.chip, {
    variants: {
        variant: {
            default: filterChip_module.default["chip-default"],
            text: null,
        },
    },
    defaultVariants: {
        variant: "default",
    },
});
const Operation = ({ label, columnType = filters.FilterType.string, onOperationSelect, }) => {
    const filterOptions = filters.filterOperators[columnType] || [];
    // FilterOperatorTypes gives error as Select returns string
    const [value, setValue] = React.useState(filterOptions?.[0]?.value);
    React.useEffect(() => {
        const selectedOption = filterOptions.find(o => o.value === value);
        if (selectedOption) {
            onOperationSelect(selectedOption);
        }
    }, [value]);
    return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: value, onValueChange: setValue, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: "text", className: filterChip_module.default.selectValue, "aria-label": `${label} filter operation`, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: "Select operation", className: filterChip_module.default.operationText }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": "filter", children: filterOptions.map(opt => {
                    return (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value, "aria-label": `Filter ${label} ${opt.label}`, children: opt.label }, opt.value));
                }) })] }));
};
const FilterChip = ({ label, value, onRemove, className, ref, columnType = filters.FilterType.string, options = [], onValueChange, onOperationChange, leadingIcon, variant, ...props }) => {
    const [operation, setOperation] = React.useState();
    const [filterValue, setFilterValue] = React.useState(value || "");
    const showOnRemove = typeof onRemove === "function";
    React.useEffect(() => {
        if (onOperationChange && operation?.value) {
            onOperationChange(operation?.value);
        }
    }, [operation?.value]);
    React.useEffect(() => {
        if (onValueChange) {
            onValueChange(filterValue);
        }
    }, [filterValue]);
    const renderValueInput = () => {
        switch (columnType) {
            case filters.FilterType.select:
                return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: filterValue.toString(), onValueChange: setFilterValue, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: "text", className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.selectColumn), children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: "Select value" }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": "filter", children: options.map(opt => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
            case filters.FilterType.date:
                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.dateFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(datePicker.DatePicker, { value: filterValue, onSelect: date => setFilterValue(date), showCalendarIcon: false, textFieldProps: { className: filterChip_module.default.dateField } }) }));
            default:
                return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.textFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(textfield.TextField, { className: filterChip_module.default.textField, value: filterValue, onChange: e => setFilterValue(e.target.value) }) }));
        }
    };
    return (jsxRuntime.jsxRuntimeExports.jsx(box.Box, { ref: ref, className: chip({ variant, className }), role: "group", "aria-label": `Filter by ${label}`, ...props, children: jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: "center", children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: "center", gap: 2, children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": "true", children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: "normal", children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(Operation, { columnType: columnType, label: label, onOperationSelect: setOperation }), renderValueInput(), showOnRemove && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }) }));
};
FilterChip.displayName = "FilterChip";

exports.FilterChip = FilterChip;
//# sourceMappingURL=filter-chip.cjs.map
