UNPKG

@arco-design/web-vue

Version:

Arco Design Vue 2.0: A Vue.js 3 UI Library

123 lines (122 loc) 3.57 kB
"use strict"; var vue = require("vue"); var globalConfig = require("../_utils/global-config.js"); var index = require("../trigger/index.js"); var pluginVue_exportHelper = require("../_virtual/plugin-vue_export-helper.js"); const _sfc_main = vue.defineComponent({ name: "Popover", components: { Trigger: index }, props: { popupVisible: { type: Boolean, default: void 0 }, defaultPopupVisible: { type: Boolean, default: false }, title: String, content: String, trigger: { type: [String, Array], default: "hover" }, position: { type: String, default: "top" }, contentClass: { type: [String, Array, Object] }, contentStyle: { type: Object }, arrowClass: { type: [String, Array, Object] }, arrowStyle: { type: Object }, popupContainer: { type: [String, Object] } }, emits: { "update:popupVisible": (visible) => true, "popupVisibleChange": (visible) => true }, setup(props, { emit }) { const prefixCls = globalConfig.getPrefixCls("popover"); const _popupVisible = vue.ref(props.defaultPopupVisible); const computedPopupVisible = vue.computed( () => { var _a; return (_a = props.popupVisible) != null ? _a : _popupVisible.value; } ); const handlePopupVisibleChange = (visible) => { _popupVisible.value = visible; emit("update:popupVisible", visible); emit("popupVisibleChange", visible); }; const contentCls = vue.computed(() => [ `${prefixCls}-popup-content`, props.contentClass ]); const arrowCls = vue.computed(() => [ `${prefixCls}-popup-arrow`, props.arrowClass ]); return { prefixCls, computedPopupVisible, contentCls, arrowCls, handlePopupVisibleChange }; } }); function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) { const _component_trigger = vue.resolveComponent("trigger"); return vue.openBlock(), vue.createBlock(_component_trigger, { class: vue.normalizeClass(_ctx.prefixCls), trigger: _ctx.trigger, position: _ctx.position, "popup-visible": _ctx.computedPopupVisible, "popup-offset": 10, "content-class": _ctx.contentCls, "content-style": _ctx.contentStyle, "arrow-class": _ctx.arrowCls, "arrow-style": _ctx.arrowStyle, "show-arrow": "", "popup-container": _ctx.popupContainer, "animation-name": "zoom-in-fade-out", "auto-fit-transform-origin": "", onPopupVisibleChange: _ctx.handlePopupVisibleChange }, { content: vue.withCtx(() => [ vue.createElementVNode("div", { class: vue.normalizeClass(`${_ctx.prefixCls}-title`) }, [ vue.renderSlot(_ctx.$slots, "title", {}, () => [ vue.createTextVNode(vue.toDisplayString(_ctx.title), 1) ]) ], 2), vue.createElementVNode("div", { class: vue.normalizeClass(`${_ctx.prefixCls}-content`) }, [ vue.renderSlot(_ctx.$slots, "content", {}, () => [ vue.createTextVNode(vue.toDisplayString(_ctx.content), 1) ]) ], 2) ]), default: vue.withCtx(() => [ vue.renderSlot(_ctx.$slots, "default") ]), _: 3 }, 8, ["class", "trigger", "position", "popup-visible", "content-class", "content-style", "arrow-class", "arrow-style", "popup-container", "onPopupVisibleChange"]); } var _Popover = /* @__PURE__ */ pluginVue_exportHelper(_sfc_main, [["render", _sfc_render]]); module.exports = _Popover;