@td-design/react-native/lib/module/tree/TreeGroup.js

react-native UI组件库

import { memo } from 'react';
import React from 'react';
import Animated from 'react-native-reanimated';
import { useTheme } from '@shopify/restyle';
import Box from '../box';
import Flex from '../flex';
import Pressable from '../pressable';
import Text from '../text';
import Checkbox from './Checkbox';
import Chevron from './Chevron';
import useGroup from './useGroup';
function TreeGroup(_ref) {
  let {
    id,
    text,
    disabled,
    style,
    textStyle,
    onPress,
    customCheckIcon,
    customExpandIcon,
    checkable,
    level,
    activeOpacity,
    nodeStyle,
    currentKeys,
    openedKeys,
    handleCheck,
    handleExpand,
    flatData,
    children
  } = _ref;
  const theme = useTheme();
  const {
    bodyStyle,
    progress,
    checkStatus,
    handleLayout,
    handlePress
  } = useGroup({
    id,
    openedKeys,
    currentKeys,
    flatData,
    handleExpand
  });
  return /*#__PURE__*/React.createElement(Box, {
    style: [{
      marginLeft: level * theme.spacing.x2
    }]
  }, /*#__PURE__*/React.createElement(Flex, {
    alignItems: 'center',
    style: [nodeStyle, style]
  }, /*#__PURE__*/React.createElement(Pressable, {
    activeOpacity: activeOpacity,
    onPress: handlePress
  }, /*#__PURE__*/React.createElement(Box, {
    marginRight: 'x1',
    width: 20,
    height: 20,
    justifyContent: 'center',
    alignItems: 'center'
  }, customExpandIcon ? customExpandIcon(progress) : /*#__PURE__*/React.createElement(Chevron, {
    progress
  }))), checkable && /*#__PURE__*/React.createElement(Pressable, {
    activeOpacity: activeOpacity,
    onPress: () => handleCheck(id),
    disabled: disabled,
    style: {
      marginRight: theme.spacing.x1
    }
  }, customCheckIcon ? customCheckIcon(checkStatus) : /*#__PURE__*/React.createElement(Checkbox, {
    disabled: disabled,
    checked: checkStatus
  })), /*#__PURE__*/React.createElement(Pressable, {
    activeOpacity: activeOpacity,
    onPress: () => onPress === null || onPress === void 0 ? void 0 : onPress(id),
    disabled: disabled
  }, /*#__PURE__*/React.createElement(Text, {
    variant: 'p0',
    color: disabled ? 'disabled' : 'text',
    style: textStyle
  }, text))), /*#__PURE__*/React.createElement(Animated.View, {
    style: [{
      position: 'relative',
      overflow: 'hidden'
    }, bodyStyle]
  }, /*#__PURE__*/React.createElement(Box, {
    position: 'absolute',
    width: "100%",
    collapsable: false,
    onLayout: handleLayout
  }, children)));
}
export default /*#__PURE__*/memo(TreeGroup);
//# sourceMappingURL=TreeGroup.js.map