@carbon/ibm-products
Version:
Carbon for IBM Products
99 lines (95 loc) • 3.13 kB
JavaScript
/**
* 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.
*/
import React__default from 'react';
import { CheckboxCheckedFilled, Checkbox, RadioButtonChecked, RadioButton } from '@carbon/react/icons';
import PropTypes from '../../_virtual/index.js';
import { pkg } from '../../settings.js';
import { UserProfileImage } from '../UserProfileImage/UserProfileImage.js';
const componentName = 'AddSelectFormControl';
const blockClass = `${pkg.prefix}--add-select__selections`;
let AddSelectFormControl = _ref => {
let {
item,
onClick,
selected,
type
} = _ref;
const controlProps = {
onClick,
className: `${blockClass}-form-control-wrapper ${blockClass}-form-control-wrapper--${type}`,
size: 20,
[`aria-labelledby`]: `control-label-${item.id}`
};
const getCheckbox = () => {
if (selected) {
return /*#__PURE__*/React__default.createElement(CheckboxCheckedFilled, controlProps);
}
return /*#__PURE__*/React__default.createElement(Checkbox, controlProps);
};
const getRadio = () => {
if (selected) {
return /*#__PURE__*/React__default.createElement(RadioButtonChecked, controlProps);
}
return /*#__PURE__*/React__default.createElement(RadioButton, controlProps);
};
const getFormControl = () => {
if (!item) {
return;
}
if (type === 'checkbox') {
return getCheckbox();
} else {
return getRadio();
}
};
const getAvatarProps = _ref2 => {
let {
src,
alt,
icon,
backgroundColor,
theme
} = _ref2;
return {
className: `${blockClass}-cell-avatar`,
size: 'lg',
theme,
image: src,
imageDescription: alt,
icon,
backgroundColor
};
};
const getItemIcon = _ref3 => {
let {
icon: Icon
} = _ref3;
return /*#__PURE__*/React__default.createElement(Icon, null);
};
return /*#__PURE__*/React__default.createElement("div", {
className: `${blockClass}-form-control`
}, getFormControl(), /*#__PURE__*/React__default.createElement("div", {
className: `${blockClass}-form-control-label-wrapper`
}, item.avatar && /*#__PURE__*/React__default.createElement(UserProfileImage, getAvatarProps(item.avatar)), item.icon && /*#__PURE__*/React__default.createElement("div", {
className: `${blockClass}-cell-icon`
}, getItemIcon(item)), /*#__PURE__*/React__default.createElement("div", {
className: `${blockClass}-form-control-label-text`
}, /*#__PURE__*/React__default.createElement("span", {
className: `${blockClass}-cell-title`,
id: `control-label-${item.id}`
}, item.title), item.subtitle && /*#__PURE__*/React__default.createElement("span", {
className: `${blockClass}-cell-subtitle`
}, item.subtitle))));
};
AddSelectFormControl.propTypes = {
item: PropTypes.object,
onClick: PropTypes.func,
selected: PropTypes.bool,
type: PropTypes.oneOf(['checkbox', 'radio'])
};
AddSelectFormControl.displayName = componentName;
export { AddSelectFormControl };