@uiw/react-native/lib/MenuDropdown/index.js

UIW for React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _reactNative = require("react-native");

var _item = _interopRequireDefault(require("./item"));

var _Button = _interopRequireDefault(require("../Button"));

var _Icon = _interopRequireDefault(require("../Icon"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

class MenuDropdown extends _react.default.Component {
  constructor(...args) {
    super(...args);
    this.state = {
      btnIcon: 'down',
      visibleMenu: false,
      listHeightValue: new _reactNative.Animated.Value(0),
      listHeight: 0
    };

    this.handleonPress = () => {
      const {
        visibleMenu
      } = this.state;
      this.setState({
        visibleMenu: !visibleMenu,
        btnIcon: visibleMenu ? 'down' : 'up'
      });

      if (visibleMenu) {
        this.animateClose();
      } else {
        this.animateStart();
      }
    };

    this.animateStart = () => {
      _reactNative.Animated.timing(this.state.listHeightValue, {
        toValue: 1,
        duration: 500,
        useNativeDriver: false // 动画值在不同的驱动方式之间是不能兼容的。因此如果你在某个动画中启用了原生驱动，那么所有和此动画依赖相同动画值的其他动画也必须启用原生驱动。

      }).start();
    };

    this.animateClose = () => {
      this.setState({
        listHeightValue: new _reactNative.Animated.Value(0)
      });
    };

    this.menuContainer = event => {
      const {
        height
      } = event.nativeEvent.layout;
      this.setState({
        listHeight: height
      });
    };
  }

  render() {
    const {
      title,
      children,
      size,
      ...btnProps
    } = this.props;
    const {
      btnIcon,
      listHeightValue,
      listHeight
    } = this.state;
    return <_reactNative.View style={styles.menuBox}>
        <_Button.default {...btnProps} onPress={this.handleonPress} size={size}>
          <_reactNative.Text>{title}</_reactNative.Text>
          <_Icon.default name={btnIcon} size={17} />
        </_Button.default>
        {
        /* {
        visibleMenu && */
      }
        <_reactNative.Animated.View style={[styles.list, // eslint-disable-next-line react-native/no-inline-styles
      {
        opacity: listHeightValue,
        height: listHeightValue.interpolate({
          inputRange: [0, 1],
          outputRange: [0, listHeight || 5]
        }),
        top: size === 'large' ? 35 : size === 'small' ? 21 : 30
      }]}>
          <_reactNative.View onLayout={this.menuContainer}>{children}</_reactNative.View>
        </_reactNative.Animated.View>
        {
        /* } */
      }
      </_reactNative.View>;
  }

}

exports.default = MenuDropdown;
MenuDropdown.defaultProps = {
  title: '菜单'
};
MenuDropdown.Item = void 0;
MenuDropdown.Item = _item.default;

const styles = _reactNative.StyleSheet.create({
  menuBox: {},
  list: {
    position: 'absolute',
    zIndex: 1000,
    left: 0,
    right: 0,
    top: 0,
    height: 100,
    marginTop: 10,
    borderColor: '#ddd',
    borderWidth: 1,
    borderRadius: 1,
    backgroundColor: '#fff',
    overflow: 'hidden'
  }
});

module.exports = exports.default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9NZW51RHJvcGRvd24vaW5kZXgudHN4Il0sIm5hbWVzIjpbIk1lbnVEcm9wZG93biIsIlJlYWN0IiwiQ29tcG9uZW50Iiwic3RhdGUiLCJidG5JY29uIiwidmlzaWJsZU1lbnUiLCJsaXN0SGVpZ2h0VmFsdWUiLCJBbmltYXRlZCIsIlZhbHVlIiwibGlzdEhlaWdodCIsImhhbmRsZW9uUHJlc3MiLCJzZXRTdGF0ZSIsImFuaW1hdGVDbG9zZSIsImFuaW1hdGVTdGFydCIsInRpbWluZyIsInRvVmFsdWUiLCJkdXJhdGlvbiIsInVzZU5hdGl2ZURyaXZlciIsInN0YXJ0IiwibWVudUNvbnRhaW5lciIsImV2ZW50IiwiaGVpZ2h0IiwibmF0aXZlRXZlbnQiLCJsYXlvdXQiLCJyZW5kZXIiLCJ0aXRsZSIsImNoaWxkcmVuIiwic2l6ZSIsImJ0blByb3BzIiwicHJvcHMiLCJzdHlsZXMiLCJtZW51Qm94IiwibGlzdCIsIm9wYWNpdHkiLCJpbnRlcnBvbGF0ZSIsImlucHV0UmFuZ2UiLCJvdXRwdXRSYW5nZSIsInRvcCIsImRlZmF1bHRQcm9wcyIsIkl0ZW0iLCJTdHlsZVNoZWV0IiwiY3JlYXRlIiwicG9zaXRpb24iLCJ6SW5kZXgiLCJsZWZ0IiwicmlnaHQiLCJtYXJnaW5Ub3AiLCJib3JkZXJDb2xvciIsImJvcmRlcldpZHRoIiwiYm9yZGVyUmFkaXVzIiwiYmFja2dyb3VuZENvbG9yIiwib3ZlcmZsb3ciXSwibWFwcGluZ3MiOiI7Ozs7Ozs7QUFBQTs7QUFDQTs7QUFDQTs7QUFDQTs7QUFDQTs7OztBQWFlLE1BQU1BLFlBQU4sU0FBMkJDLGVBQU1DLFNBQWpDLENBQThEO0FBQUE7QUFBQTtBQUFBLFNBTzNFQyxLQVAyRSxHQU8zRDtBQUNkQyxNQUFBQSxPQUFPLEVBQUUsTUFESztBQUVkQyxNQUFBQSxXQUFXLEVBQUUsS0FGQztBQUdkQyxNQUFBQSxlQUFlLEVBQUUsSUFBSUMsc0JBQVNDLEtBQWIsQ0FBbUIsQ0FBbkIsQ0FISDtBQUlkQyxN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QU0sb0JBekJGO0FBMkJEOztBQS9FMEU7OztBQUF4RDFCLFksQ0FDWnNDLFksR0FBa0M7QUFDdkNiLEVBQUFBLEtBQUssRUFBRTtBQURnQyxDO0FBRHRCekIsWSxDQUtadUMsSTtBQTZFVHZDLFlBQVksQ0FBQ3VDLElBQWIsR0FBb0JBLGFBQXBCOztBQUVBLE1BQU1ULE1BQU0sR0FBR1Usd0JBQVdDLE1BQVgsQ0FBa0I7QUFDL0JWLEVBQUFBLE9BQU8sRUFBRSxFQURzQjtBQUUvQkMsRUFBQUEsSUFBSSxFQUFFO0FBQ0pVLElBQUFBLFFBQVEsRUFBRSxVQUROO0FBRUpDLElBQUFBLE1BQU0sRUFBRSxJQUZKO0FBR0pDLElBQUFBLElBQUksRUFBRSxDQUhGO0FBSUpDLElBQUFBLEtBQUssRUFBRSxDQUpIO0FBS0pSLElBQUFBLEdBQUcsRUFBRSxDQUxEO0FBTUpoQixJQUFBQSxNQUFNLEVBQUUsR0FOSjtBQU9KeUIsSUFBQUEsU0FBUyxFQUFFLEVBUFA7QUFRSkMsSUFBQUEsV0FBVyxFQUFFLE1BUlQ7QUFTSkMsSUFBQUEsV0FBVyxFQUFFLENBVFQ7QUFVSkMsSUFBQUEsWUFBWSxFQUFFLENBVlY7QUFXSkMsSUFBQUEsZUFBZSxFQUFFLE1BWGI7QUFZSkMsSUFBQUEsUUFBUSxFQUFFO0FBWk47QUFGeUIsQ0FBbEIsQ0FBZiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBWaWV3LCBTdHlsZVNoZWV0LCBUZXh0LCBBbmltYXRlZCwgTGF5b3V0Q2hhbmdlRXZlbnQsIEVhc2luZyB9IGZyb20gJ3JlYWN0LW5hdGl2ZSc7XG5pbXBvcnQgSXRlbSBmcm9tICcuL2l0ZW0nO1xuaW1wb3J0IEJ1dHRvbiwgeyBCdXR0b25Qcm9wcyB9IGZyb20gJy4uL0J1dHRvbic7XG5pbXBvcnQgSWNvbiwgeyBJY29uc05hbWUgfSBmcm9tICcuLi9JY29uJztcblxuZXhwb3J0IGludGVyZmFjZSBNZW51RHJvcGRvd25Qcm9wcyBleHRlbmRzIEJ1dHRvblByb3BzIHtcbiAgdGl0bGU6IHN0cmluZztcbn1cblxuaW50ZXJmYWNlIElTdGF0ZSB7XG4gIGJ0bkljb246IEljb25zTmFtZTtcbiAgdmlzaWJsZU1lbnU6IEJvb2xlYW47XG4gIGxpc3RIZWlnaHRWYWx1ZTogQW5pbWF0ZWQuVmFsdWU7XG4gIGxpc3RIZWlnaHQ6IG51bWJlcjtcbn1cblxuZXhwb3J0IGRlZmF1bHQgY2xhc3MgTWVudURyb3Bkb3duIGV4dGVuZHMgUmVhY3QuQ29tcG9uZW50PE1lbnVEcm9wZG93blByb3BzPiB7XG4gIHN0YXRpYyBkZWZhdWx0UHJvcHM6IE1lbnVEcm9wZG93blByb3BzID0ge1xuICAgIHRpdGxlOiAn6I+c5Y2VJyxcbiAgfTtcblxuICBzdGF0aWMgSXRlbTogdHlwZW9mIEl0ZW07XG5cbiAgc3RhdGU6IElTdGF0ZSA9IHtcbiAgICBidG5JY29uOiAnZG93bicsXG4gICAgdmlzaWJsZU1lbnU6IGZhbHNlLFxuICAgIGxpc3RIZWlnaHRWYWx1ZTogbmV3IEFuaW1hdGVkLlZhbHVlKDApLFxuICAgIGxpc3RIZWlnaHQ6IDAsXG4gIH07XG5cbiAgaGFuZGxlb25QcmVzcyA9ICgpID0+IHtcbiAgICBjb25zdCB7IHZpc2libGVNZW51IH0gPSB0aGlzLnN0YXRlO1xuICAgIHRoaXMuc2V0U3RhdGUoe1xuICAgICAgdmlzaWJsZU1lbnU6ICF2aXNpYmxlTWVudSxcbiAgICAgIGJ0bkljb246IHZpc2libGVNZW51ID8gJ2Rvd24nIDogJ3VwJyxcbiAgICB9KTtcbiAgICBpZiAodmlzaWJsZU1lbnUpIHtcbiAgICAgIHRoaXMuYW5pbWF0ZUNsb3NlKCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuYW5pbWF0ZVN0YXJ0KCk7XG4gICAgfVxuICB9O1xuXG4gIGFuaW1hdGVTdGFydCA9ICgpID0+IHtcbiAgICBBbmltYXRlZC50aW1pbmcodGhpcy5zdGF0ZS5saXN0SGVpZ2h0VmFsdWUsIHtcbiAgICAgIHRvVmFsdWU6IDEsXG4gICAgICBkdXJhdGlvbjogNTAwLFxuICAgICAgdXNlTmF0aXZlRHJpdmVyOiBmYWxzZSwgLy8g5Yqo55S75YC85Zyo5LiN5ZCM55qE6amx5Yqo5pa55byP5LmL6Ze05piv5LiN6IO95YW85a6555qE44CC5Zug5q2k5aaC5p6c5L2g5Zyo5p+Q5Liq5Yqo55S75Lit5ZCv55So5LqG5Y6f55Sf6amx5Yqo77yM6YKj5LmI5omA5pyJ5ZKM5q2k5Yqo55S75L6d6LWW55u45ZCM5Yqo55S75YC855qE5YW25LuW5Yqo55S75Lmf5b+F6aG75ZCv55So5Y6f55Sf6amx5Yqo44CCXG4gICAgfSkuc3RhcnQoKTtcbiAgfTtcblxuICBhbmltYXRlQ2xvc2UgPSAoKSA9PiB7XG4gICAgdGhpcy5zZXRTdGF0ZSh7XG4gICAgICBsaXN0SGVpZ2h0VmFsdWU6IG5ldyBBbmltYXRlZC5WYWx1ZSgwKSxcbiAgICB9KTtcbiAgfTtcblxuICBtZW51Q29udGFpbmVyID0gKGV2ZW50OiBMYXlvdXRDaGFuZ2VFdmVudCkgPT4ge1xuICAgIGNvbnN0IHsgaGVpZ2h0IH0gPSBldmVudC5uYXRpdmVFdmVudC5sYXlvdXQ7XG4gICAgdGhpcy5zZXRTdGF0ZSh7XG4gICAgICBsaXN0SGVpZ2h0OiBoZWlnaHQsXG4gICAgfSk7XG4gIH07XG5cbiAgcmVuZGVyKCkge1xuICAgIGNvbnN0IHsgdGl0bGUsIGNoaWxkcmVuLCBzaXplLCAuLi5idG5Qcm9wcyB9ID0gdGhpcy5wcm9wcztcblxuICAgIGNvbnN0IHsgYnRuSWNvbiwgbGlzdEhlaWdodFZhbHVlLCBsaXN0SGVpZ2h0IH0gPSB0aGlzLnN0YXRlO1xuICAgIHJldHVybiAoXG4gICAgICA8VmlldyBzdHlsZT17c3R5bGVzLm1lbnVCb3h9PlxuICAgICAgICA8QnV0dG9uIHsuLi5idG5Qcm9wc30gb25QcmVzcz17dGhpcy5oYW5kbGVvblByZXNzfSBzaXplPXtzaXplfT5cbiAgICAgICAgICA8VGV4dD57dGl0bGV9PC9UZXh0PlxuICAgICAgICAgIDxJY29uIG5hbWU9e2J0bkljb259IHNpemU9ezE3fSAvPlxuICAgICAgICA8L0J1dHRvbj5cbiAgICAgICAgey8qIHtcbiAgICAgICAgdmlzaWJsZU1lbnUgJiYgKi99XG4gICAgICAgIDxBbmltYXRlZC5WaWV3XG4gICAgICAgICAgc3R5bGU9e1tcbiAgICAgICAgICAgIHN0eWxlcy5saXN0LFxuICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LW5hdGl2ZS9uby1pbmxpbmUtc3R5bGVzXG4gICAgICAgICAgICB7XG4gICAgICAgICAgICAgIG9wYWNpdHk6IGxpc3RIZWlnaHRWYWx1ZSxcbiAgICAgICAgICAgICAgaGVpZ2h0OiBsaXN0SGVpZ2h0VmFsdWUuaW50ZXJwb2xhdGUoe1xuICAgICAgICAgICAgICAgIGlucHV0UmFuZ2U6IFswLCAxXSxcbiAgICAgICAgICAgICAgICBvdXRwdXRSYW5nZTogWzAsIGxpc3RIZWlnaHQgfHwgNV0sXG4gICAgICAgICAgICAgIH0pLFxuICAgICAgICAgICAgICB0b3A6IHNpemUgPT09ICdsYXJnZScgPyAzNSA6IHNpemUgPT09ICdzbWFsbCcgPyAyMSA6IDMwLFxuICAgICAgICAgICAgfSxcbiAgICAgICAgICBdfVxuICAgICAgICA+XG4gICAgICAgICAgPFZpZXcgb25MYXlvdXQ9e3RoaXMubWVudUNvbnRhaW5lcn0+e2NoaWxkcmVufTwvVmlldz5cbiAgICAgICAgPC9BbmltYXRlZC5WaWV3PlxuICAgICAgICB7LyogfSAqL31cbiAgICAgIDwvVmlldz5cbiAgICApO1xuICB9XG59XG5cbk1lbnVEcm9wZG93bi5JdGVtID0gSXRlbTtcblxuY29uc3Qgc3R5bGVzID0gU3R5bGVTaGVldC5jcmVhdGUoe1xuICBtZW51Qm94OiB7fSxcbiAgbGlzdDoge1xuICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgIHpJbmRleDogMTAwMCxcbiAgICBsZWZ0OiAwLFxuICAgIHJpZ2h0OiAwLFxuICAgIHRvcDogMCxcbiAgICBoZWlnaHQ6IDEwMCxcbiAgICBtYXJnaW5Ub3A6IDEwLFxuICAgIGJvcmRlckNvbG9yOiAnI2RkZCcsXG4gICAgYm9yZGVyV2lkdGg6IDEsXG4gICAgYm9yZGVyUmFkaXVzOiAxLFxuICAgIGJhY2tncm91bmRDb2xvcjogJyNmZmYnLFxuICAgIG92ZXJmbG93OiAnaGlkZGVuJyxcbiAgfSxcbn0pO1xuIl19