@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');

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`,
      label: cur,
      direction: 'asc',
      attribute: cur
    }, {
      id: `${cur}-desc`,
      label: 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.unstable_FeatureFlags, {
    enableV12Overflowmenu: true
  }, /*#__PURE__*/React.createElement(react.OverflowMenu
  // @ts-ignore // TODO: remove after carbon fixes this ts error
  , {
    autoAlign: true,
    menuAlignment: "bottom-end",
    renderIcon: props => /*#__PURE__*/React.createElement(icons.ArrowsVertical, _rollupPluginBabelHelpers.extends({
      size: 32
    }, props)),
    className: `${blockClass}_overflow`,
    label: sortByLabel
  }, sortByOpts.map(opt => {
    return /*#__PURE__*/React.createElement(react.MenuItem, {
      className: `${blockClass}_overflow-item`,
      key: opt?.id,
      label: `${opt?.label} ${opt?.direction}`,
      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;