@opensig/opendesign/lib/message/OMessageList.vue.js

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

"use strict";
const vue = require("vue");
const types = require("./types.js");
const OMessage_vue_vue_type_script_setup_true_lang = require("./OMessage.vue.js");
const is = require("../_utils/is.js");
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "OMessageList",
  props: types.messageListProps,
  setup(__props, { expose: __expose }) {
    const props = __props;
    const getUniqueId = /* @__PURE__ */ (() => {
      let id = 0;
      return () => {
        id += 1;
        return id;
      };
    })();
    const optionList = vue.ref([]);
    const add = (params) => {
      const option = {
        id: getUniqueId(),
        ...params
      };
      if (params.icon) {
        option.icon = vue.shallowRef(params.icon);
      }
      optionList.value.push(option);
    };
    const remove = (idx) => {
      optionList.value.splice(idx, 1);
    };
    const removeAll = () => {
      optionList.value = [];
    };
    const close = (id) => {
      const idx = optionList.value.findIndex((option) => option.id === id);
      remove(idx);
      if (optionList.value.length === 0 && props.onDestory) {
        props.onDestory();
      }
    };
    const handleDurationEnd = (item) => {
      const { id, onDurationEnd } = item;
      onDurationEnd == null ? void 0 : onDurationEnd();
      close(id);
    };
    const handleClose = (item, ev) => {
      const { id, onClose } = item;
      onClose == null ? void 0 : onClose(ev);
      close(id);
    };
    __expose({ add, remove, removeAll });
    return (_ctx, _cache) => {
      return optionList.value.length ? (vue.openBlock(), vue.createElementBlock(
        "div",
        {
          key: 0,
          class: vue.normalizeClass(["o-message-list", [`o-message-list-${props.position}`]])
        },
        [
          vue.createVNode(vue.TransitionGroup, { name: "o-message-fade" }, {
            default: vue.withCtx(() => [
              (vue.openBlock(true), vue.createElementBlock(
                vue.Fragment,
                null,
                vue.renderList(optionList.value, (item) => {
                  return vue.openBlock(), vue.createBlock(OMessage_vue_vue_type_script_setup_true_lang, {
                    key: item.id,
                    status: item.status,
                    duration: item.duration,
                    closable: item.closable,
                    onDurationEnd: ($event) => handleDurationEnd(item),
                    onClose: (ev) => {
                      handleClose(item, ev);
                    }
                  }, vue.createSlots({
                    default: vue.withCtx(() => [
                      vue.unref(is.isString)(item.content) ? (vue.openBlock(), vue.createElementBlock(
                        vue.Fragment,
                        { key: 0 },
                        [
                          vue.createTextVNode(
                            vue.toDisplayString(item.content),
                            1
                            /* TEXT */
                          )
                        ],
                        64
                        /* STABLE_FRAGMENT */
                      )) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(item.content), { key: 1 }))
                    ]),
                    _: 2
                    /* DYNAMIC */
                  }, [
                    item.icon ? {
                      name: "icon",
                      fn: vue.withCtx(() => [
                        (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(item.icon)))
                      ]),
                      key: "0"
                    } : void 0
                  ]), 1032, ["status", "duration", "closable", "onDurationEnd", "onClose"]);
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ]),
            _: 1
            /* STABLE */
          })
        ],
        2
        /* CLASS */
      )) : vue.createCommentVNode("v-if", true);
    };
  }
});
module.exports = _sfc_main;