choo-taro-ui-vue3/lib/action-sheet/index.js

Taro UI Rewritten in Vue 3.0

import { defineComponent, renderSlot, resolveComponent, withCtx, openBlock, createBlock, ref, watch, toRefs, createCommentVNode, createVNode, toDisplayString, createTextVNode, mergeProps } from 'vue';

const AtActionSheetHeader = defineComponent({
  name: "AtActionSheetHeader"
});

// Binding optimization for webpack code-split
const _renderSlot$3 = renderSlot, _resolveComponent$3 = resolveComponent, _withCtx$3 = withCtx, _openBlock$3 = openBlock, _createBlock$3 = createBlock;

function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_taro_view = process.env.TARO_ENV === "h5" ? _resolveComponent$3("taro-view") : "view";

  return (_openBlock$3(), _createBlock$3(_component_taro_view, { class: "at-action-sheet__header" }, {
    default: _withCtx$3(() => [
      _renderSlot$3(_ctx.$slots, "default")
    ]),
    _: 3 /* FORWARDED */
  }))
}


AtActionSheetHeader.render = _sfc_render$3;

const AtActionSheetBody = defineComponent({
  name: "AtActionSheetBody"
});

// Binding optimization for webpack code-split
const _renderSlot$2 = renderSlot, _resolveComponent$2 = resolveComponent, _withCtx$2 = withCtx, _openBlock$2 = openBlock, _createBlock$2 = createBlock;

function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_taro_view = process.env.TARO_ENV === "h5" ? _resolveComponent$2("taro-view") : "view";

  return (_openBlock$2(), _createBlock$2(_component_taro_view, { class: "at-action-sheet__body" }, {
    default: _withCtx$2(() => [
      _renderSlot$2(_ctx.$slots, "default")
    ]),
    _: 3 /* FORWARDED */
  }))
}


AtActionSheetBody.render = _sfc_render$2;

const AtActionSheetFooter = defineComponent({
  name: "AtActionSheetFooter",
  emits: ["click"],
  setup(_, { emit }) {
    function handleClick(...args) {
      emit("click", ...args);
    }
    return {
      handleClick
    };
  }
});

// Binding optimization for webpack code-split
const _renderSlot$1 = renderSlot, _resolveComponent$1 = resolveComponent, _withCtx$1 = withCtx, _openBlock$1 = openBlock, _createBlock$1 = createBlock;

function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_taro_view = process.env.TARO_ENV === "h5" ? _resolveComponent$1("taro-view") : "view";

  return (_openBlock$1(), _createBlock$1(_component_taro_view, {
    class: "at-action-sheet__footer",
    onTap: _ctx.handleClick
  }, {
    default: _withCtx$1(() => [
      _renderSlot$1(_ctx.$slots, "default")
    ]),
    _: 3 /* FORWARDED */
  }, 8 /* PROPS */, ["onTap"]))
}


AtActionSheetFooter.render = _sfc_render$1;

const AtActionSheet = defineComponent({
  name: "AtActionSheet",
  components: {
    AtActionSheetHeader,
    AtActionSheetBody,
    AtActionSheetFooter
  },
  emits: ["close", "cancel"],
  props: {
    isOpened: Boolean,
    title: {
      type: String,
      default: ""
    },
    cancelText: {
      type: String,
      default: ""
    }
  },
  setup(props, { emit }) {
    const opened = ref(props.isOpened);
    watch(() => props.isOpened, (isOpened) => {
      if (isOpened !== opened.value) {
        opened.value = isOpened;
      }
      !isOpened && handleClose();
    });
    function handleClose() {
      emit("close");
    }
    function handleCancel() {
      emit("cancel");
      close();
    }
    function close() {
      opened.value = false;
      handleClose();
    }
    function handleTouchmove(e) {
      e.stopPropagation();
      e.preventDefault();
    }
    return {
      ...toRefs(props),
      opened,
      close,
      handleCancel,
      handleTouchmove
    };
  }
});

// Binding optimization for webpack code-split
const _createCommentVNode = createCommentVNode, _resolveComponent = resolveComponent, _createVNode = createVNode, _toDisplayString = toDisplayString, _createTextVNode = createTextVNode, _withCtx = withCtx, _openBlock = openBlock, _createBlock = createBlock, _renderSlot = renderSlot, _mergeProps = mergeProps;

function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_taro_view = process.env.TARO_ENV === "h5" ? _resolveComponent("taro-view") : "view";
  const _component_at_action_sheet_header = _resolveComponent("at-action-sheet-header");
  const _component_at_action_sheet_body = _resolveComponent("at-action-sheet-body");
  const _component_at_action_sheet_footer = _resolveComponent("at-action-sheet-footer");

  return (_openBlock(), _createBlock(_component_taro_view, _mergeProps(_ctx.$attrs, {
    class: ['at-action-sheet', {
      'at-action-sheet--active': _ctx.opened,
    }],
    catchMove: true,
    onTouchmove: _ctx.handleTouchmove
  }), {
    default: _withCtx(() => [
      _createCommentVNode(" overlay "),
      _createVNode(_component_taro_view, {
        class: "at-action-sheet__overlay",
        onTap: _ctx.close
      }, null, 8 /* PROPS */, ["onTap"]),
      _createCommentVNode(" container "),
      _createVNode(_component_taro_view, { class: "at-action-sheet__container" }, {
        default: _withCtx(() => [
          _createCommentVNode(" title "),
          (_ctx.title)
            ? (_openBlock(), _createBlock(_component_at_action_sheet_header, { key: 0 }, {
                default: _withCtx(() => [
                  _createTextVNode(_toDisplayString(_ctx.title), 1 /* TEXT */)
                ]),
                _: 1 /* STABLE */
              }))
            : _createCommentVNode("v-if", true),
          _createCommentVNode(" body "),
          _createVNode(_component_at_action_sheet_body, null, {
            default: _withCtx(() => [
              _renderSlot(_ctx.$slots, "default")
            ]),
            _: 3 /* FORWARDED */
          }),
          _createCommentVNode(" footer "),
          (_ctx.cancelText)
            ? (_openBlock(), _createBlock(_component_at_action_sheet_footer, {
                key: 1,
                onClick: _ctx.handleCancel
              }, {
                default: _withCtx(() => [
                  _createTextVNode(_toDisplayString(_ctx.cancelText), 1 /* TEXT */)
                ]),
                _: 1 /* STABLE */
              }, 8 /* PROPS */, ["onClick"]))
            : _createCommentVNode("v-if", true)
        ]),
        _: 3 /* FORWARDED */
      })
    ]),
    _: 3 /* FORWARDED */
  }, 16 /* FULL_PROPS */, ["class", "onTouchmove"]))
}


AtActionSheet.render = _sfc_render;

export default AtActionSheet;