"use client";
'use strict';

var jsxRuntime = require('react/jsx-runtime');
var reactIcons_esm = require('../../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.1.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
var flex = require('../../flex/flex.cjs');
var iconButton = require('../../icon-button/icon-button.cjs');
var select = require('../../select/select.cjs');
var text = require('../../text/text.cjs');
var dataTable_module = require('../data-table.module.css.cjs');
var dataTable_types = require('../data-table.types.cjs');

function Ordering({ columnList, onChange, value }) {
    function handleColumnChange(columnId) {
        onChange(columnId, value.order);
    }
    function handleOrderChange() {
        const newOrder = value.order === dataTable_types.SortOrders.ASC ? dataTable_types.SortOrders.DESC : dataTable_types.SortOrders.ASC;
        onChange(value.name, newOrder);
    }
    return (jsxRuntime.jsxs(flex.Flex, { justify: 'between', align: 'center', children: [jsxRuntime.jsx(text.Text, { size: 2, weight: 500, className: dataTable_module.default['flex-1'], children: "Ordering" }), jsxRuntime.jsxs(flex.Flex, { gap: 'extra-small', className: dataTable_module.default['flex-1'], children: [jsxRuntime.jsxs(select.Select, { onValueChange: handleColumnChange, value: value.name, disabled: columnList.length === 0, children: [jsxRuntime.jsx(select.Select.Trigger, { size: 'small', className: dataTable_module.default['display-popover-properties-select'], "with-icon-button": 'true', children: jsxRuntime.jsx(select.Select.Value, { placeholder: 'Select value' }) }), jsxRuntime.jsx(select.Select.Content, { "data-variant": 'filter', children: columnList.map(column => (jsxRuntime.jsx(select.Select.Item, { value: column.id, children: column.label }, column.id))) })] }), jsxRuntime.jsx(iconButton.IconButton, { onClick: handleOrderChange, size: 4, disabled: columnList.length === 0, children: value.order === dataTable_types.SortOrders?.ASC ? (jsxRuntime.jsx(reactIcons_esm.TextAlignBottomIcon, { className: dataTable_module.default['display-popover-sort-icon'] })) : (jsxRuntime.jsx(reactIcons_esm.TextAlignTopIcon, { className: dataTable_module.default['display-popover-sort-icon'] })) })] })] }));
}

exports.Ordering = Ordering;
//# sourceMappingURL=ordering.cjs.map
