vantui-edit/es/action-sheet/index.js

一套适用于Taro3及React的vantui组件库

import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["round", "zIndex", "overlay", "closeOnClickOverlay", "closeOnClickAction", "safeAreaInsetBottom", "show", "title", "description", "actions", "cancelText", "children", "onSelect", "onCancel", "onClose", "onClickOverlay", "className"],
    _excluded2 = ["name", "subname", "disabled", "loading", "openType", "color", "className"];

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

import { View, Button } from '@tarojs/components';
import { useCallback } from 'react';
import * as utils from '../wxs/utils';
import VanLoading from '../loading/index';
import VanPopup from '../popup/index';
import VanIcon from '../icon/index'; // import Button from './../button'

import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
export function ActionSheet(props) {
  var _props$round = props.round,
      round = _props$round === void 0 ? true : _props$round,
      zIndex = props.zIndex,
      _props$overlay = props.overlay,
      overlay = _props$overlay === void 0 ? true : _props$overlay,
      _props$closeOnClickOv = props.closeOnClickOverlay,
      closeOnClickOverlay = _props$closeOnClickOv === void 0 ? true : _props$closeOnClickOv,
      _props$closeOnClickAc = props.closeOnClickAction,
      closeOnClickAction = _props$closeOnClickAc === void 0 ? true : _props$closeOnClickAc,
      _props$safeAreaInsetB = props.safeAreaInsetBottom,
      safeAreaInsetBottom = _props$safeAreaInsetB === void 0 ? true : _props$safeAreaInsetB,
      show = props.show,
      title = props.title,
      description = props.description,
      actions = props.actions,
      cancelText = props.cancelText,
      children = props.children,
      onSelect = props.onSelect,
      onCancel = props.onCancel,
      onClose = props.onClose,
      onClickOverlay = props.onClickOverlay,
      className = props.className,
      others = _objectWithoutProperties(props, _excluded);

  var _onCancel = useCallback(function () {
    onCancel === null || onCancel === void 0 ? void 0 : onCancel();
  }, [onCancel]);

  var _onClose = useCallback(function () {
    onClose === null || onClose === void 0 ? void 0 : onClose();
  }, [onClose]);

  var _onSelect = useCallback(function (event) {
    var index = event.currentTarget.dataset.index; // const { actions, closeOnClickAction, canIUseGetUserProfile } = data

    var item = actions === null || actions === void 0 ? void 0 : actions[index];

    if (item) {
      Object.defineProperty(event, 'detail', {
        value: item
      });
      onSelect === null || onSelect === void 0 ? void 0 : onSelect(event);

      if (closeOnClickAction) {
        _onClose();
      }
    }
  }, [_onClose, actions, closeOnClickAction, onSelect]);

  var _onClickOverlay = useCallback(function () {
    onClickOverlay === null || onClickOverlay === void 0 ? void 0 : onClickOverlay();
    onClose === null || onClose === void 0 ? void 0 : onClose();
  }, [onClickOverlay, onClose]);

  return /*#__PURE__*/_jsx(VanPopup, _objectSpread(_objectSpread({
    show: show,
    position: "bottom",
    round: round,
    zIndex: zIndex,
    overlay: overlay,
    className: "van-action-sheet ".concat(className || ''),
    safeAreaInsetBottom: safeAreaInsetBottom,
    closeOnClickOverlay: closeOnClickOverlay,
    onClose: _onClickOverlay
  }, others), {}, {
    children: /*#__PURE__*/_jsxs(_Fragment, {
      children: [title && /*#__PURE__*/_jsxs(View, {
        className: "van-action-sheet__header",
        children: [title, /*#__PURE__*/_jsx(VanIcon, {
          name: "cross",
          className: "van-action-sheet__close",
          onClick: _onClose
        })]
      }), description && /*#__PURE__*/_jsx(View, {
        className: "van-action-sheet__description van-hairline--bottom",
        children: description
      }), actions && actions.length && /*#__PURE__*/_jsx(View, {
        children: actions.map(function (item, index) {
          var name = item.name,
              subname = item.subname,
              disabled = item.disabled,
              loading = item.loading,
              openType = item.openType,
              color = item.color,
              className = item.className,
              rest = _objectWithoutProperties(item, _excluded2);

          return /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
            openType: disabled || loading ? undefined : openType,
            style: color ? 'color: ' + color : '',
            className: utils.bem('action-sheet__item', {
              disabled: disabled || loading
            }) + ' ' + (className || ''),
            hoverClass: "van-action-sheet__item--hover",
            "data-index": index,
            onClick: disabled || loading ? function () {} : _onSelect
          }, rest), {}, {
            children: !loading ? /*#__PURE__*/_jsxs(_Fragment, {
              children: [name, subname && /*#__PURE__*/_jsx(View, {
                className: "van-action-sheet__subname",
                children: subname
              })]
            }) : /*#__PURE__*/_jsx(VanLoading, {
              className: "van-action-sheet__loading",
              size: "22px"
            })
          }), index);
        })
      }), children, cancelText && /*#__PURE__*/_jsxs(_Fragment, {
        children: [/*#__PURE__*/_jsx(View, {
          className: "van-action-sheet__gap"
        }), /*#__PURE__*/_jsx(View, {
          className: "van-action-sheet__cancel",
          hoverClass: "van-action-sheet__cancel--hover" // hoverStayTime="70"
          ,
          onClick: _onCancel,
          children: cancelText
        })]
      })]
    })
  }));
}
export default ActionSheet;