@talend/react-components/lib-esm/MultiSelect/ItemOption.component.js

Set of react components.

import { Component } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { getRowData } from '../VirtualizedList/utils/gridrow';
import theme from './ItemOption.module.scss';
import Emphasis from '../Emphasis/Emphasis.component';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
class ItemOptionRow extends Component {
  static getDerivedStateFromProps(props) {
    return {
      item: getRowData(props.parent, props.index)
    };
  }
  constructor(props) {
    super(props);
    this.state = {};
  }
  shouldComponentUpdate(nextProps, nextState) {
    const oldData = this.state.item;
    const newData = nextState.item;
    return oldData !== newData && ['selected', 'value', 'name', 'searchTerm'].some(attr => oldData[attr] !== newData[attr]);
  }
  render() {
    const item = this.state.item;
    const id = `${item.id || item.value}`;
    return /*#__PURE__*/_jsx("div", {
      className: classnames('form-group', theme.row, 'tc-multi-select-item'),
      style: this.props.style,
      children: /*#__PURE__*/_jsx("div", {
        className: "checkbox",
        children: /*#__PURE__*/_jsxs("label", {
          children: [/*#__PURE__*/_jsx("input", {
            id: `checkbox-${id}`,
            type: "checkbox",
            checked: !!item.selected,
            onChange: event => this.props.parent.props.onRowClick({
              event,
              rowData: item.value
            })
          }), /*#__PURE__*/_jsx("span", {
            className: `${theme.item} control-label`,
            htmlFor: `checkbox-${id}`,
            children: /*#__PURE__*/_jsx(Emphasis, {
              text: item.name,
              value: item.searchTerm
            })
          })]
        })
      })
    });
  }
}
ItemOptionRow.propTypes = {
  style: PropTypes.object,
  index: PropTypes.number,
  parent: PropTypes.shape({
    props: PropTypes.shape({
      collection: PropTypes.array,
      onRowClick: PropTypes.func
    })
  })
};

// eslint-disable-next-line import/prefer-default-export
export function ItemOption(props) {
  return /*#__PURE__*/_jsx(ItemOptionRow, {
    ...props
  });
}
ItemOption.rowHeight = 40;
//# sourceMappingURL=ItemOption.component.js.map