@shopify/polaris/dist/esm/components/ActionList/ActionList.js

Shopify’s product component library

import React$1 from 'react';
import { useFeatures } from '../../utilities/features/hooks.js';
import { classNames } from '../../utilities/css.js';
import styles from './ActionList.scss.js';
import { Section as Section$1 } from './components/Section/Section.js';

function ActionList({
  items,
  sections = [],
  actionRole,
  onActionAnyItem
}) {
  var finalSections = [];

  if (items) {
    finalSections = [{
      items
    }, ...sections];
  } else if (sections) {
    finalSections = sections;
  }

  var {
    newDesignLanguage
  } = useFeatures();
  var className = classNames(styles.ActionList, newDesignLanguage && styles.newDesignLanguage);
  var hasMultipleSections = finalSections.length > 1;
  var Element = hasMultipleSections ? 'ul' : 'div';
  var sectionMarkup = finalSections.map((section, index) => {
    return section.items.length > 0 ? /*#__PURE__*/React$1.createElement(Section$1, {
      key: section.title || index,
      section: section,
      hasMultipleSections: hasMultipleSections,
      actionRole: actionRole,
      onActionAnyItem: onActionAnyItem
    }) : null;
  });
  return /*#__PURE__*/React$1.createElement(Element, {
    className: className
  }, sectionMarkup);
}

export { ActionList };