'use strict';

var React = require('react');
var classnames = require('classnames');
var _baseEach = require('./_baseEach-cjs.js');
var _commonjsHelpers = require('./_commonjsHelpers-cjs.js');
var _baseAssignValue = require('./_baseAssignValue-cjs.js');
var isTypedArray = require('./isTypedArray-cjs.js');
var Typography = require('./Typography-cjs.js');
var Icon = require('./Icon-cjs.js');
var Text = require('./Text-cjs.js');
var Heading = require('./Heading-cjs.js');
var Markdown = require('./Markdown-cjs.js');
var Emphasis = require('./Emphasis-cjs.js');

/**
 * A specialized version of `baseAggregator` for arrays.
 *
 * @private
 * @param {Array} [array] The array to iterate over.
 * @param {Function} setter The function to set `accumulator` values.
 * @param {Function} iteratee The iteratee to transform keys.
 * @param {Object} accumulator The initial aggregated object.
 * @returns {Function} Returns `accumulator`.
 */

function arrayAggregator$1(array, setter, iteratee, accumulator) {
  var index = -1,
      length = array == null ? 0 : array.length;

  while (++index < length) {
    var value = array[index];
    setter(accumulator, value, iteratee(value), array);
  }
  return accumulator;
}

var _arrayAggregator = arrayAggregator$1;

var baseEach = _baseEach._baseEach;

/**
 * Aggregates elements of `collection` on `accumulator` with keys transformed
 * by `iteratee` and values set by `setter`.
 *
 * @private
 * @param {Array|Object} collection The collection to iterate over.
 * @param {Function} setter The function to set `accumulator` values.
 * @param {Function} iteratee The iteratee to transform keys.
 * @param {Object} accumulator The initial aggregated object.
 * @returns {Function} Returns `accumulator`.
 */
function baseAggregator$1(collection, setter, iteratee, accumulator) {
  baseEach(collection, function(value, key, collection) {
    setter(accumulator, value, iteratee(value), collection);
  });
  return accumulator;
}

var _baseAggregator = baseAggregator$1;

var arrayAggregator = _arrayAggregator,
    baseAggregator = _baseAggregator,
    baseIteratee = _baseEach._baseIteratee,
    isArray = isTypedArray.isArray_1;

/**
 * Creates a function like `_.groupBy`.
 *
 * @private
 * @param {Function} setter The function to set accumulator values.
 * @param {Function} [initializer] The accumulator object initializer.
 * @returns {Function} Returns the new aggregator function.
 */
function createAggregator$1(setter, initializer) {
  return function(collection, iteratee) {
    var func = isArray(collection) ? arrayAggregator : baseAggregator,
        accumulator = initializer ? initializer() : {};

    return func(collection, setter, baseIteratee(iteratee), accumulator);
  };
}

var _createAggregator = createAggregator$1;

var baseAssignValue = _baseAssignValue._baseAssignValue,
    createAggregator = _createAggregator;

/** Used for built-in method references. */
var objectProto = Object.prototype;

/** Used to check objects for own properties. */
var hasOwnProperty = objectProto.hasOwnProperty;

/**
 * Creates an object composed of keys generated from the results of running
 * each element of `collection` thru `iteratee`. The order of grouped values
 * is determined by the order they occur in `collection`. The corresponding
 * value of each key is an array of elements responsible for generating the
 * key. The iteratee is invoked with one argument: (value).
 *
 * @static
 * @memberOf _
 * @since 0.1.0
 * @category Collection
 * @param {Array|Object} collection The collection to iterate over.
 * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
 * @returns {Object} Returns the composed aggregate object.
 * @example
 *
 * _.groupBy([6.1, 4.2, 6.3], Math.floor);
 * // => { '4': [4.2], '6': [6.1, 6.3] }
 *
 * // The `_.property` iteratee shorthand.
 * _.groupBy(['one', 'two', 'three'], 'length');
 * // => { '3': ['one', 'two'], '5': ['three'] }
 */
var groupBy = createAggregator(function(result, value, key) {
  if (hasOwnProperty.call(result, key)) {
    result[key].push(value);
  } else {
    baseAssignValue(result, key, [value]);
  }
});

var groupBy_1 = groupBy;

var groupBy$1 = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(groupBy_1);

var styles$1 = {"action":"rJffaV10x20-","customItem":"LeWPz4r-I1o-","defaultContent":"_6vjT92J6tm0-","hoverable":"rwfzPbhL5qI-","isActive":"h6M4H38O32Y-","icon":"rQFprs7TrMI-","info":"mU08HF2afDM-","amount":"_8hKgCYORSNQ-","truncate":"Sz9JkKmEIm8-","spinning":"OH7Qd6ZYBR0-"};

function ListItem(props) {
    const actionClasses = classnames(styles$1.action, props.isActive && styles$1.isActive, (props.onClick || props.url) && styles$1.hoverable, props.customRenderItem && !props.customItemStyles && styles$1.customItem);
    const Wrapper = props.url ? "a" : "button";
    const buttonProps = Object.assign({}, (Wrapper === "button" && { role: "button", type: "button" }));
    return (React.createElement(Wrapper, Object.assign({ id: props.id.toString(), className: actionClasses, href: props.url, onClick: props.onClick }, buttonProps), props.customRenderItem ? (props.customRenderItem(props)) : (React.createElement(DefaultRenderItem, Object.assign({}, props)))));
}
function DefaultRenderItem(props) {
    return (React.createElement("div", { className: styles$1.defaultContent },
        props.icon && (React.createElement("div", { className: styles$1.icon },
            React.createElement(Icon.Icon, { name: props.icon, color: props.iconColor }))),
        React.createElement("div", { className: styles$1.info },
            props.title && React.createElement(Heading.Heading, { level: 5 }, props.title),
            props.content && React.createElement(Description, { content: props.content }),
            props.caption && (React.createElement(Text.Text, { variation: "subdued" },
                React.createElement(Typography.Typography, { element: "span", size: "small", emphasisType: "italic" }, props.caption)))),
        props.value && (React.createElement("div", { className: styles$1.amount },
            React.createElement(Text.Text, null,
                React.createElement(Emphasis.Emphasis, { variation: "bold" }, props.value))))));
}
function Description({ content }) {
    if (content instanceof Array) {
        return (React.createElement(React.Fragment, null, content.map((item, i) => (React.createElement(Text.Text, { key: i },
            React.createElement("span", { className: styles$1.truncate },
                React.createElement(Markdown.Markdown, { content: item, basicUsage: true })))))));
    }
    else {
        return (React.createElement(Text.Text, null,
            React.createElement("span", { className: styles$1.truncate },
                React.createElement(Markdown.Markdown, { content: content, basicUsage: true }))));
    }
}

var sectionStyles = {"sectionHeader":"htH4y2JBFNQ-","spinning":"Y3FXizLWanA-"};

var styles = {"list":"sFlecO8-wnY-","item":"dbZy6dviEis-","section":"vz43PAcPYt0-","spinning":"gv8zs1Wo4EY-"};

function List({ items, customRenderItem, customItemStyles, customRenderSection, customSectionStyles, defaultSectionHeader = "Other", labelledBy, }) {
    const isSectioned = items.some(item => "section" in item && item.section);
    if (isSectioned) {
        return (React.createElement(SectionedList, { items: items, customRenderItem: customRenderItem, customItemStyles: customItemStyles, customRenderSection: customRenderSection, customSectionStyles: customSectionStyles, defaultSectionHeader: defaultSectionHeader, labelledBy: labelledBy }));
    }
    else {
        return (React.createElement(DisplayList, { items: items, customRenderItem: customRenderItem, customItemStyles: customItemStyles, labelledBy: labelledBy }));
    }
}
function DisplayList({ items, customRenderItem, customItemStyles, labelledBy, }) {
    const omitDefaultStyles = customRenderItem && customItemStyles;
    const itemClassNames = classnames(!omitDefaultStyles && styles.item);
    return (React.createElement("ul", { className: styles.list, "aria-labelledby": labelledBy }, items.map(item => (React.createElement("li", { key: item.id, className: itemClassNames },
        React.createElement(ListItem, Object.assign({}, item, { customRenderItem: customRenderItem, customItemStyles: customItemStyles })))))));
}
function SectionedList({ items, customRenderItem, customItemStyles, customRenderSection, customSectionStyles, defaultSectionHeader, labelledBy, }) {
    const sectionedItems = groupBy$1(items, item => _baseEach.get(item, "section", defaultSectionHeader));
    const omitDefaultStyles = customRenderItem && customItemStyles;
    const omitDefaultSectionStyles = customRenderSection && customSectionStyles;
    const itemClassNames = classnames(!omitDefaultStyles && styles.item);
    const sectionHeaderClassNames = classnames(!omitDefaultSectionStyles && sectionStyles.sectionHeader);
    return (React.createElement("ul", { className: styles.list, "aria-labelledby": labelledBy }, Object.keys(sectionedItems).map(sectionName => {
        return (React.createElement("li", { key: sectionName, className: classnames(!omitDefaultSectionStyles && styles.section) },
            getSectionHeader(sectionName, sectionHeaderClassNames, customRenderSection),
            React.createElement("ul", { className: styles.list }, sectionedItems[sectionName].map(item => (React.createElement("li", { key: item.id, className: itemClassNames },
                React.createElement(ListItem, Object.assign({}, item, { customRenderItem: customRenderItem, customItemStyles: customItemStyles }))))))));
    })));
}
function getSectionHeader(sectionName, sectionHeaderClassNames, customRenderSection) {
    const sectionHeader = customRenderSection ? (customRenderSection(sectionName)) : (React.createElement(Typography.Typography, { element: "h4", fontWeight: "bold", size: "large" }, sectionName));
    return React.createElement("div", { className: sectionHeaderClassNames }, sectionHeader);
}

exports.List = List;
exports.ListItem = ListItem;
