@boomerang-io/carbon-addons-boomerang-react
Version:
Carbon Addons for Boomerang apps
52 lines (45 loc) • 3 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var React = require('react');
var icons = require('@carbon/react/icons');
var cx = require('classnames');
var MultiSelect = require('./MultiSelect.js');
var TooltipHover = require('../TooltipHover/TooltipHover.js');
var settings = require('../../internal/settings.js');
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
var React__default = /*#__PURE__*/_interopDefault(React);
var cx__default = /*#__PURE__*/_interopDefault(cx);
/*
IBM Confidential
694970X, 69497O0
© Copyright IBM Corp. 2022, 2024
*/
/**
* For now we expect that if the prop value is a csv string,
* then the items would be either in the key:value or value:label format.
* The prop value would contain either the keys in the key:value or values in the value:label.
*/
function getFilteredItems({ items, selectedItems }) {
return items.filter((item) => selectedItems.some((selectedItem) => selectedItem === item.key || selectedItem === item.value));
}
function ComboBoxMultiSelect({ disableClear = false, id, initialSelectedItems, items, label, labelText, selectedItems, titleText, tooltipClassName = `${settings.prefix}--bmrg-multi-select__tooltip`, tooltipContent, tooltipProps = { direction: "top" }, ...multiSelectProps }) {
const labelValue = titleText || label || labelText;
let finalInitialSelectedItems = initialSelectedItems;
let finalSelectedItems = selectedItems;
/** Add support for csv strings */
if (typeof finalInitialSelectedItems === "string") {
const initialSelectedItemsArray = finalInitialSelectedItems.split(",");
finalInitialSelectedItems = getFilteredItems({ items, selectedItems: initialSelectedItemsArray });
}
if (typeof finalSelectedItems === "string") {
const selectedItemsArray = finalSelectedItems.split(",");
finalSelectedItems = getFilteredItems({ items, selectedItems: selectedItemsArray });
}
return (React__default.default.createElement("div", { key: id, className: cx__default.default(`${settings.prefix}--bmrg-multi-select`, { "--disableClear": disableClear }) },
React__default.default.createElement(MultiSelect.default, { id: id, titleText: labelValue && (React__default.default.createElement("div", { style: { display: "flex" } },
React__default.default.createElement("div", null, titleText || labelText || label),
tooltipContent && (React__default.default.createElement("div", { className: tooltipClassName },
React__default.default.createElement(TooltipHover.default, { ...tooltipProps, tooltipText: tooltipContent },
React__default.default.createElement(icons.Information, { size: 16, fill: "currentColor" })))))), initialSelectedItems: finalInitialSelectedItems, selectedItems: finalSelectedItems, items: items, ...multiSelectProps })));
}
exports.default = ComboBoxMultiSelect;