various-ui/lib/components/modal/aside/index.vue2.js

This is a test version of the Vue 3 component library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var index$2 = require('../../icon/index.js');
require('../../../utils/index.js');
var index = require('./index.js');
var composable = require('./src/composable.js');
var index$1 = require('../../../utils/src/node/index.js');

const __default__ = vue.defineComponent({ name: "UiModalSide" });
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...__default__,
  props: index.UiModalSidePropsOption,
  emits: index.UiModalSideEmits,
  setup(__props, { expose: __expose, emit: __emit }) {
    const emits = __emit;
    const define = __props;
    const { ons, refs, nodes, binds, methods } = composable.useComposable(define, emits);
    const { open } = refs;
    const { main, container } = nodes;
    const { openModal, closeModal, scrollTo } = methods;
    vue.onMounted(() => {
      if (main.value) {
        index$1.append(document.body, main.value);
      }
    });
    vue.onBeforeUnmount(() => {
      document.body.style.overflow = "";
      if (main.value) {
        index$1.remove(document.body, main.value);
      }
    });
    ;
    __expose({ openModal, closeModal, scrollTo });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(
        vue.Transition,
        vue.mergeProps(vue.toHandlers(vue.unref(ons).animation), { persisted: "" }),
        {
          default: vue.withCtx(() => [
            vue.withDirectives(vue.createElementVNode(
              "div",
              {
                class: "ui-modal-aside ui-mask",
                ref_key: "main",
                ref: main,
                onClick: _cache[0] || (_cache[0] = vue.withModifiers(
                  //@ts-ignore
                  (...args) => vue.unref(closeModal) && vue.unref(closeModal)(...args),
                  ["self"]
                )),
                style: vue.normalizeStyle({ zIndex: _ctx.zIndex })
              },
              [
                vue.createElementVNode(
                  "div",
                  vue.mergeProps({
                    class: "ui-modal-container",
                    ref_key: "container",
                    ref: container
                  }, vue.unref(binds).container),
                  [
                    vue.createCommentVNode(" * \u5173\u95ED\u6309\u94AE "),
                    _ctx.close ? (vue.openBlock(), vue.createElementBlock(
                      "div",
                      {
                        key: 0,
                        class: "ui-modal-close",
                        style: vue.normalizeStyle({ "font-size": _ctx.closeSize + "px" })
                      },
                      [
                        vue.createVNode(vue.unref(index$2.UiIcon), {
                          name: _ctx.closeIcon,
                          onClick: vue.unref(closeModal)
                        }, null, 8, ["name", "onClick"])
                      ],
                      4
                      /* STYLE */
                    )) : vue.createCommentVNode("v-if", true),
                    vue.createCommentVNode(" * \u5185\u5BB9 "),
                    vue.createElementVNode(
                      "div",
                      vue.mergeProps({
                        class: "ui-modal-content",
                        ref: "content"
                      }, vue.unref(binds).content),
                      [
                        vue.renderSlot(_ctx.$slots, "default")
                      ],
                      16
                      /* FULL_PROPS */
                    )
                  ],
                  16
                  /* FULL_PROPS */
                )
              ],
              4
              /* STYLE */
            ), [
              [vue.vShow, vue.unref(open)]
            ])
          ]),
          _: 3
          /* FORWARDED */
        },
        16
        /* FULL_PROPS */
      );
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=index.vue2.js.map