ele-admin-plus 1.2.1-beta.1 → 1.2.1-beta.3

package/lib/ele-text/index.d.ts

@@ -11,7 +11,7 @@ declare const _default: import('vue').DefineComponent<{
     italic: BooleanConstructor;
     icon: import('vue').PropType<import('./types').TextIcon>;
     iconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    iconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    iconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
 }, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     tag: {
         type: StringConstructor;
@@ -25,7 +25,7 @@ declare const _default: import('vue').DefineComponent<{
     italic: BooleanConstructor;
     icon: import('vue').PropType<import('./types').TextIcon>;
     iconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    iconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    iconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
 }>>, {
     tag: string;
     underline: boolean;

package/lib/ele-text/props.d.ts

@@ -1,4 +1,5 @@
 import { PropType, ExtractPropTypes } from 'vue';
+import { StyleValue } from '../ele-app/types';
 import { ElIconProps } from '../ele-app/el';
 import { TextType, TextSize, TextIcon } from './types';
 
@@ -28,7 +29,7 @@ export declare const textProps: {
     /** 图标属性 */
     iconProps: PropType<ElIconProps>;
     /** 图标样式 */
-    iconStyle: PropType<Partial<import('vue').CSSProperties>>;
+    iconStyle: PropType<StyleValue>;
 };
 export type TextProps = ExtractPropTypes<typeof textProps>;
 export type TextPropKeys = Array<keyof typeof textProps>;

package/lib/ele-tool/index.cjs

@@ -1,34 +1,45 @@
 "use strict";
 const vue = require("vue");
-const EleTooltip = require("../ele-tooltip/index");
+const props$1 = require("../ele-toolbar/props");
 const props = require("./props");
 const _sfc_main = vue.defineComponent({
   name: "EleTool",
-  components: { EleTooltip },
   props: props.toolProps,
   emits: props.toolEmits,
   setup(props2, { emit }) {
-    const visible = vue.ref(false);
-    const updateVisible = (value) => {
-      if (value && (!props2.title || props2.disabled)) {
-        visible.value = false;
-        return;
+    const toolbarProvide = vue.inject(props$1.TOOLBAR_KEY, {});
+    const showTooltip = (text, el, options) => {
+      if (toolbarProvide.showTooltip) {
+        toolbarProvide.showTooltip(text, el, options);
       }
-      visible.value = value;
     };
-    const onClick = (e) => {
-      visible.value = false;
+    const hideTooltip = () => {
+      toolbarProvide.hideTooltip && toolbarProvide.hideTooltip();
+    };
+    const handleClick = (e) => {
+      if (props2.clickHideTooltip) {
+        hideTooltip();
+      }
       emit("click", e);
     };
+    const handleMouseover = (e) => {
+      if (props2.title && !props2.disabled) {
+        showTooltip(props2.title, e.currentTarget, {
+          placement: props2.placement,
+          offset: 10
+        });
+      }
+    };
     vue.watch([() => props2.disabled, () => props2.title], () => {
       if (!props2.title || props2.disabled) {
-        visible.value = false;
+        hideTooltip();
       }
     });
     return {
-      visible,
-      updateVisible,
-      onClick
+      handleClick,
+      handleMouseover,
+      showTooltip,
+      hideTooltip
     };
   }
 });
@@ -41,26 +52,15 @@ const _export_sfc = (sfc, props2) => {
 };
 const _hoisted_1 = { class: "ele-tool-body" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_EleTooltip = vue.resolveComponent("EleTooltip");
   return vue.openBlock(), vue.createElementBlock("div", {
     class: "ele-tool",
-    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClick && _ctx.onClick(...args))
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args)),
+    onMouseover: _cache[1] || (_cache[1] = (...args) => _ctx.handleMouseover && _ctx.handleMouseover(...args))
   }, [
-    vue.createVNode(_component_EleTooltip, {
-      content: _ctx.title,
-      visible: _ctx.visible,
-      placement: _ctx.placement,
-      offset: 10,
-      "onUpdate:visible": _ctx.updateVisible
-    }, {
-      default: vue.withCtx(() => [
-        vue.createElementVNode("div", _hoisted_1, [
-          vue.renderSlot(_ctx.$slots, "default")
-        ])
-      ]),
-      _: 3
-    }, 8, ["content", "visible", "placement", "onUpdate:visible"])
-  ]);
+    vue.createElementVNode("div", _hoisted_1, [
+      vue.renderSlot(_ctx.$slots, "default")
+    ])
+  ], 32);
 }
 const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 module.exports = index;

package/lib/ele-tool/index.d.ts

@@ -1,27 +1,33 @@
+import { EleTooltipProps } from '../ele-app/plus';
+
 declare const _default: import('vue').DefineComponent<{
     title: StringConstructor;
     placement: {
-        type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, import('element-plus').Placement, unknown> | undefined>;
+        type: import('vue').PropType<EleTooltipProps["placement"]>;
         default: string;
     };
     disabled: BooleanConstructor;
+    clickHideTooltip: BooleanConstructor;
 }, {
-    visible: import('vue').Ref<boolean>;
-    updateVisible: (value: boolean) => void;
-    onClick: (e: MouseEvent) => void;
+    handleClick: (e: MouseEvent) => void;
+    handleMouseover: (e: MouseEvent) => void;
+    showTooltip: (text?: string, el?: HTMLElement, options?: EleTooltipProps) => void;
+    hideTooltip: () => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     click: (_e: MouseEvent) => boolean;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     title: StringConstructor;
     placement: {
-        type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, import('element-plus').Placement, unknown> | undefined>;
+        type: import('vue').PropType<EleTooltipProps["placement"]>;
         default: string;
     };
     disabled: BooleanConstructor;
+    clickHideTooltip: BooleanConstructor;
 }>> & {
     onClick?: ((_e: MouseEvent) => any) | undefined;
 }, {
     placement: import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, import('element-plus').Placement, unknown> | undefined;
     disabled: boolean;
+    clickHideTooltip: boolean;
 }, {}>;
 export default _default;

package/lib/ele-tool/props.cjs

@@ -9,7 +9,9 @@ const toolProps = {
     default: "top"
   },
   /** 是否禁用提示 */
-  disabled: Boolean
+  disabled: Boolean,
+  /** 是否点击时关闭提示 */
+  clickHideTooltip: Boolean
 };
 const toolEmits = {
   /** 点击事件 */

package/lib/ele-tool/props.d.ts

@@ -1,4 +1,5 @@
 import { PropType, ExtractPropTypes } from 'vue';
+import { EleTooltipProps } from '../ele-app/plus';
 
 /**
  * 属性
@@ -8,11 +9,13 @@ export declare const toolProps: {
     title: StringConstructor;
     /** 提示方向 */
     placement: {
-        type: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, import('element-plus').Placement, unknown> | undefined>;
+        type: PropType<EleTooltipProps["placement"]>;
         default: string;
     };
     /** 是否禁用提示 */
     disabled: BooleanConstructor;
+    /** 是否点击时关闭提示 */
+    clickHideTooltip: BooleanConstructor;
 };
 export type ToolProps = ExtractPropTypes<typeof toolProps>;
 /**

package/lib/ele-tool/style/index.cjs

@@ -1,3 +1,2 @@
 "use strict";
-require("../../ele-tooltip/style/index");
 require("./index.scss");

package/lib/ele-toolbar/index.cjs

@@ -1,11 +1,39 @@
 "use strict";
 const vue = require("vue");
+const EleTooltip = require("../ele-tooltip/index");
 const EleText = require("../ele-text/index");
 const props = require("./props");
 const _sfc_main = vue.defineComponent({
   name: "EleToolbar",
-  components: { EleText },
-  props: props.toolbarProps
+  components: { EleTooltip, EleText },
+  props: props.toolbarProps,
+  setup() {
+    const tooltipRef = vue.ref(null);
+    const virtualRef = vue.ref();
+    const tooltipContent = vue.ref("");
+    const tooltipProps = vue.ref({});
+    const showTooltip = (text, el, options) => {
+      virtualRef.value = el;
+      tooltipContent.value = text ?? "";
+      tooltipProps.value = options || {};
+    };
+    const hideTooltip = () => {
+      tooltipRef.value && tooltipRef.value.hide();
+    };
+    const toolbarProvide = vue.shallowReactive({
+      showTooltip,
+      hideTooltip
+    });
+    vue.provide(props.TOOLBAR_KEY, toolbarProvide);
+    return {
+      tooltipRef,
+      virtualRef,
+      tooltipContent,
+      tooltipProps,
+      showTooltip,
+      hideTooltip
+    };
+  }
 });
 const _export_sfc = (sfc, props2) => {
   const target = sfc.__vccOpts || sfc;
@@ -16,6 +44,7 @@ const _export_sfc = (sfc, props2) => {
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_EleText = vue.resolveComponent("EleText");
+  const _component_EleTooltip = vue.resolveComponent("EleTooltip");
   return vue.openBlock(), vue.createElementBlock("div", {
     class: vue.normalizeClass([
       "ele-toolbar",
@@ -58,7 +87,17 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       style: vue.normalizeStyle(_ctx.toolsStyle)
     }, [
       vue.renderSlot(_ctx.$slots, "tools")
-    ], 4)
+    ], 4),
+    vue.createVNode(_component_EleTooltip, vue.mergeProps({
+      trigger: "hover",
+      placement: "top",
+      persistent: false,
+      content: _ctx.tooltipContent
+    }, _ctx.tooltipProps || {}, {
+      virtualTriggering: true,
+      virtualRef: _ctx.virtualRef,
+      ref: "tooltipRef"
+    }), null, 16, ["content", "virtualRef"])
   ], 2);
 }
 const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);