@coreui/react-pro/dist/esm/components/chip-set/CChipSet.js

UI Components Library for React.js

import { __rest } from '../../node_modules/tslib/tslib.es6.js';
import React, { forwardRef, useState } from 'react';
import PropTypes from 'prop-types';
import classNames from '../../_virtual/index.js';
import { useChipSet } from './useChipSet.js';
import '@popperjs/core';
import { useForkedRef } from '../../hooks/useForkedRef.js';

const itemValue = (item) => typeof item === 'string' ? item : item.value;
const CChipSet = forwardRef((_a, ref) => {
    var { ariaRemoveLabel, as: Component = 'div', children, chips, className, defaultChips, defaultSelected, disabled, filter, onKeyDown, onRemove, onSelect, removable, removeIcon, selectable, selected, selectedIcon, selectionMode } = _a, rest = __rest(_a, ["ariaRemoveLabel", "as", "children", "chips", "className", "defaultChips", "defaultSelected", "disabled", "filter", "onKeyDown", "onRemove", "onSelect", "removable", "removeIcon", "selectable", "selected", "selectedIcon", "selectionMode"]);
    // The chip list is controlled by `chips` (or children) or, with `defaultChips`,
    // uncontrolled — then the set owns the list and removes chips itself.
    const isUncontrolledList = chips === undefined && defaultChips !== undefined;
    const [_chips, setChips] = useState(defaultChips !== null && defaultChips !== void 0 ? defaultChips : []);
    const { rootRef, handleKeyDown, renderChips, renderChipsFromData } = useChipSet({
        ariaRemoveLabel,
        defaultSelected,
        disabled,
        filter,
        removable,
        removeIcon,
        selectable,
        selected,
        selectedIcon,
        selectionMode,
        onRemoveChip: (value) => {
            if (isUncontrolledList) {
                setChips((prev) => prev.filter((item) => itemValue(item) !== value));
            }
            onRemove === null || onRemove === void 0 ? void 0 : onRemove(value);
        },
        onSelectionChange: onSelect,
    });
    const forkedRef = useForkedRef(ref, rootRef);
    const items = chips !== null && chips !== void 0 ? chips : (isUncontrolledList ? _chips : undefined);
    return (React.createElement(Component, Object.assign({ className: classNames('chip-set', { disabled }, className) }, (disabled && { 'aria-disabled': true }), { onKeyDown: (event) => {
            handleKeyDown(event);
            onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
        } }, rest, { ref: forkedRef }), items ? renderChipsFromData(items) : renderChips(children)));
});
CChipSet.propTypes = {
    ariaRemoveLabel: PropTypes.string,
    as: PropTypes.elementType,
    children: PropTypes.node,
    chips: PropTypes.array,
    className: PropTypes.string,
    defaultChips: PropTypes.array,
    defaultSelected: PropTypes.array,
    disabled: PropTypes.bool,
    filter: PropTypes.bool,
    onRemove: PropTypes.func,
    onSelect: PropTypes.func,
    removable: PropTypes.bool,
    removeIcon: PropTypes.node,
    selectable: PropTypes.bool,
    selected: PropTypes.array,
    selectedIcon: PropTypes.node,
    selectionMode: PropTypes.oneOf(['single', 'multiple']),
};
CChipSet.displayName = 'CChipSet';

export { CChipSet };
//# sourceMappingURL=CChipSet.js.map