@carbon/ibm-products/lib/components/AddSelect/AddSelectFormControl.js

Carbon for IBM Products

/**
 * 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.
 */

'use strict';

var React = require('react');
var icons = require('@carbon/react/icons');
var index = require('../../_virtual/index.js');
var settings = require('../../settings.js');
var UserProfileImage = require('../UserProfileImage/UserProfileImage.js');

const componentName = 'AddSelectFormControl';
const blockClass = `${settings.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.createElement(icons.CheckboxCheckedFilled, controlProps);
    }
    return /*#__PURE__*/React.createElement(icons.Checkbox, controlProps);
  };
  const getRadio = () => {
    if (selected) {
      return /*#__PURE__*/React.createElement(icons.RadioButtonChecked, controlProps);
    }
    return /*#__PURE__*/React.createElement(icons.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.createElement(Icon, null);
  };
  return /*#__PURE__*/React.createElement("div", {
    className: `${blockClass}-form-control`
  }, getFormControl(), /*#__PURE__*/React.createElement("div", {
    className: `${blockClass}-form-control-label-wrapper`
  }, item.avatar && /*#__PURE__*/React.createElement(UserProfileImage.UserProfileImage, getAvatarProps(item.avatar)), item.icon && /*#__PURE__*/React.createElement("div", {
    className: `${blockClass}-cell-icon`
  }, getItemIcon(item)), /*#__PURE__*/React.createElement("div", {
    className: `${blockClass}-form-control-label-text`
  }, /*#__PURE__*/React.createElement("span", {
    className: `${blockClass}-cell-title`,
    id: `control-label-${item.id}`
  }, item.title), item.subtitle && /*#__PURE__*/React.createElement("span", {
    className: `${blockClass}-cell-subtitle`
  }, item.subtitle))));
};
AddSelectFormControl.propTypes = {
  item: index.default.object,
  onClick: index.default.func,
  selected: index.default.bool,
  type: index.default.oneOf(['checkbox', 'radio'])
};
AddSelectFormControl.displayName = componentName;

exports.AddSelectFormControl = AddSelectFormControl;