@carbon/ibm-products/lib/components/AddSelect/AddSelectSort.js

Carbon for IBM Products

/**
 * Copyright IBM Corp. 2020, 2025
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

'use strict';

var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var index = require('../../_virtual/index.js');
var react = require('@carbon/react');
var icons = require('@carbon/react/icons');
var settings = require('../../settings.js');

var _ArrowUp, _ArrowDown;
const blockClass = `${settings.pkg.prefix}--add-select-sort`;
const componentName = 'AddSelectSort';
const AddSelectSort = _ref => {
  let {
    setSortAttribute,
    setSortDirection,
    sortBy,
    sortByLabel
  } = _ref;
  const sortByOpts = sortBy ? sortBy?.reduce((acc, cur) => {
    const opts = [{
      id: `${cur}-asc`,
      itemText: /*#__PURE__*/React.createElement(React.Fragment, null, _ArrowUp || (_ArrowUp = /*#__PURE__*/React.createElement(icons.ArrowUp, {
        size: 16
      })), cur),
      direction: 'asc',
      attribute: cur
    }, {
      id: `${cur}-desc`,
      itemText: /*#__PURE__*/React.createElement(React.Fragment, null, _ArrowDown || (_ArrowDown = /*#__PURE__*/React.createElement(icons.ArrowDown, {
        size: 16
      })), cur),
      direction: 'desc',
      attribute: cur
    }];
    return [...acc, ...opts];
  }, []) : [];

  // handlers
  const sortHandler = _ref2 => {
    let {
      direction,
      attribute
    } = _ref2;
    setSortAttribute?.(attribute);
    setSortDirection?.(direction);
  };
  return /*#__PURE__*/React.createElement("div", {
    className: blockClass
  }, sortByOpts.length > 0 && /*#__PURE__*/React.createElement(react.OverflowMenu, {
    renderIcon: props => /*#__PURE__*/React.createElement(icons.ArrowsVertical, _rollupPluginBabelHelpers.extends({
      size: 32
    }, props)),
    className: `${blockClass}_overflow`,
    flipped: true,
    "aria-label": sortByLabel,
    iconDescription: sortByLabel
  }, sortByOpts.map(opt => {
    return /*#__PURE__*/React.createElement(react.OverflowMenuItem, {
      className: `${blockClass}_overflow-item`,
      key: opt?.id,
      itemText: opt?.itemText,
      onClick: () => sortHandler(opt)
    });
  })));
};
AddSelectSort.propTypes = {
  setSortAttribute: index.default.func,
  setSortDirection: index.default.func,
  sortBy: index.default.array,
  sortByLabel: index.default.string
};
AddSelectSort.displayName = componentName;

exports.AddSelectSort = AddSelectSort;