react-native-tree-multi-select/lib/commonjs/components/CheckboxView.js

A super-fast, customizable tree view component for React Native with multi-selection, checkboxes, and search filtering capabilities.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.defaultCheckboxViewStyles = exports.CheckboxView = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _reactNativePaper = require("react-native-paper");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function arePropsEqual(prevProps, nextProps) {
  return prevProps.value === nextProps.value && prevProps.text === nextProps.text;
}
const CheckboxView = exports.CheckboxView = /*#__PURE__*/_react.default.memo(_CheckboxView, arePropsEqual);
function _CheckboxView(props) {
  const {
    value,
    onValueChange,
    text,
    outermostParentViewStyle = defaultCheckboxViewStyles.mainView,
    checkboxParentViewStyle = defaultCheckboxViewStyles.checkboxView,
    textTouchableStyle,
    checkboxProps,
    textProps = {
      style: defaultCheckboxViewStyles.checkboxTextStyle,
      numberOfLines: 1,
      ellipsizeMode: "middle"
    }
  } = props;
  const customCheckboxValueTypeToRNPaperType = _react.default.useCallback(customCheckboxValueType => {
    return customCheckboxValueType === "indeterminate" ? "indeterminate" : customCheckboxValueType ? "checked" : "unchecked";
  }, []);

  /**
   * This function modifies the change in value when the previous state was indeterminate.
   * If the prior value is 'indeterminate', it will mark the CheckBox as checked upon click.
   *
   * @param newValue This represents the updated CheckBox value after it's clicked.
   */
  const onValueChangeModifier = _react.default.useCallback(() => {
    // If the previous state was 'indeterminate', set checked to true
    if (value === "indeterminate") onValueChange(true);else onValueChange(!value);
  }, [onValueChange, value]);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
    style: outermostParentViewStyle,
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
      style: checkboxParentViewStyle,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativePaper.Checkbox.Android, {
        ...checkboxProps,
        status: customCheckboxValueTypeToRNPaperType(value),
        onPress: onValueChangeModifier
      })
    }), text ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
      style: textTouchableStyle,
      onPress: onValueChangeModifier,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        ...textProps,
        children: text
      })
    }) : null]
  });
}
const defaultCheckboxViewStyles = exports.defaultCheckboxViewStyles = _reactNative.StyleSheet.create({
  mainView: {
    alignSelf: "center",
    alignItems: "center",
    flexDirection: "row",
    marginEnd: 10
  },
  checkboxView: {
    marginStart: 5,
    transform: [{
      scale: 1.2
    }]
  },
  checkboxTextStyle: {
    color: "black",
    marginTop: _reactNative.Platform.OS === "android" ? 2 : undefined
  }
});
//# sourceMappingURL=CheckboxView.js.map