'use strict';

var React = require('react');
var DataListContext = require('./DataListContext-cjs.js');
var FilterPicker = require('./FilterPicker-cjs.js');
require('./FilterPickerProvider-cjs.js');
var Chip = require('./Chip-cjs.js');
require('./tslib.es6-cjs.js');
var Icon = require('./Icon-cjs.js');

function DataListSort() {
    const { sorting, headers } = DataListContext.useDataListContext();
    if (!sorting)
        return null;
    const { sortable, state, onSort } = sorting;
    const sortByOptions = getSortByOptions();
    return (React.createElement(FilterPicker.FilterPicker, { onSelect: selection => handleKeyChange(selection[0].id.toString()), selected: [
            {
                id: getSelectedSortID(),
                label: (state === null || state === void 0 ? void 0 : state.order) || "",
            },
        ] },
        React.createElement(FilterPicker.FilterPicker.Activator, null,
            React.createElement(Chip.Chip, { heading: "Sort", label: getButtonLabel(), variation: state ? "base" : "subtle" }, !state && (React.createElement(Chip.Chip.Suffix, null,
                React.createElement(Icon.Icon, { name: "arrowDown", size: "small" }))))),
        sortByOptions.map(({ label, value }) => (React.createElement(FilterPicker.FilterPicker.Option, { key: value, id: value, label: label })))));
    function getSortByOptions() {
        const options = sortable.reduce((acc, sort) => {
            const label = headers[sort.key];
            if (!label)
                return acc;
            const customOptions = sort.options;
            if (customOptions) {
                customOptions.forEach(option => {
                    acc.push({
                        label: option.label || "",
                        value: JSON.stringify({
                            key: sort.key,
                            order: option.order,
                            label: option.label,
                            id: option.id,
                        }),
                    });
                });
                return acc;
            }
            return acc;
        }, []);
        // Inject a none option as the first option
        options.unshift({ label: "None", value: "none" });
        return options;
    }
    function getButtonLabel() {
        const selectedOption = sortByOptions.find(option => option.value === getSelectedSortID());
        return (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) || "";
    }
    function handleKeyChange(value) {
        if (value && value !== "none") {
            const { key, order, label, id } = JSON.parse(value);
            onSort({ key, order: order, label, id });
            return;
        }
        onSort(undefined);
    }
    function getSelectedSortID() {
        const selectedSortID = {
            key: state === null || state === void 0 ? void 0 : state.key,
            order: state === null || state === void 0 ? void 0 : state.order,
            label: state === null || state === void 0 ? void 0 : state.label,
            id: state === null || state === void 0 ? void 0 : state.id,
        };
        return JSON.stringify(selectedSortID);
    }
}

exports.DataListSort = DataListSort;
