ll-plus 2.4.15 → 2.4.16

package/es/packages/components/tooltip/src/tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.mjs","sources":["../../../../../../packages/components/tooltip/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type Tooltip from './tooltip.vue'\n\n// 弹窗定位的位置\nexport const placement = [\n  'top',\n  'left',\n  'right',\n  'bottom',\n  'topLeft',\n  'topRight',\n  'bottomLeft',\n  'bottomRight',\n  'leftTop',\n  'leftBottom',\n  'rightTop',\n  'rightBottom'\n] as const\nexport const tooltipProps = buildProps({\n  /**\n   * @description 提示语\n   */\n  tip: {\n    type: String,\n    default: '提示'\n  },\n  /**\n   * @description 气泡框位置\n   */\n  placement: {\n    type: String,\n    values: placement,\n    default: 'top'\n  },\n  /**\n   * @description 容器的宽度\n   */\n  maxWidth: {\n    type: definePropType<number | string>([Number, String]),\n    default: ''\n  }\n} as const)\n\n// props\nexport type TooltipProps = ExtractPropTypes<typeof tooltipProps> // ExtractPropTypes和defineCpmponent类似\nexport type PlacementType = TooltipProps['placement']\n\n// instance\nexport type TooltipInstance = InstanceType<typeof Tooltip>\n"],"names":[],"mappings":";;;;AAMO,MAAM,SAAY,GAAA;AAAA,EACvB,KAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,aAAA;AACF,EAAA;AACO,MAAM,eAAe,UAAW,CAAA;AAAA;AAAA;AAAA;AAAA,EAIrC,GAAK,EAAA;AAAA,IACH,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA,cAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,MAAA;AAAA,IACN,MAAQ,EAAA,SAAA;AAAA,IACR,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,cAAA,CAAgC,CAAC,MAAA,EAAQ,MAAM,CAAC,CAAA;AAAA,IACtD,OAAS,EAAA,EAAA;AAAA,GACX;AACF,CAAU;;;;"}
+{"version":3,"file":"tooltip.mjs","sources":["../../../../../../packages/components/tooltip/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@ll-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\nimport type Tooltip from './tooltip.vue'\n\n// 弹窗定位的位置\nexport const placement = [\n  'top',\n  'left',\n  'right',\n  'bottom',\n  'topLeft',\n  'topRight',\n  'bottomLeft',\n  'bottomRight',\n  'leftTop',\n  'leftBottom',\n  'rightTop',\n  'rightBottom'\n] as const\nexport const tooltipProps = buildProps({\n  /**\n   * @description 提示语\n   */\n  tip: {\n    type: String,\n    default: '提示'\n  },\n  /**\n   * @description 气泡框位置\n   */\n  placement: {\n    type: String,\n    values: placement,\n    default: 'top'\n  },\n  /**\n   * @description 容器的宽度\n   */\n  maxWidth: {\n    type: definePropType<number | string>([Number, String]),\n    default: ''\n  },\n  /**\n   * @description 提示框里的文字是否超出显示...\n   */\n  tipEllipsis: {\n    type: Boolean,\n    default: false\n  },\n  /**\n   * @description 提示框里的文字是否超出几行显示...\n   */\n  tipEllipsisLine: {\n    type: Number,\n    default: 1\n  },\n  /**\n   * @description 卡片类名\n   */\n  overlayClassName: {\n    type: String\n  },\n  /**\n   * @description 卡片样式\n   */\n  overlayStyle: {\n    type: Object\n  },\n  /**\n   * @description 文字是否超出显示...\n   */\n  ellipsis: {\n    type: Boolean,\n    default: false\n  },\n  /**\n   * @description 文字的宽度，超出这个文字显示...\n   */\n  width: {\n    type: definePropType<number | string>([Number, String]),\n    default: ''\n  }\n} as const)\n\n// props\nexport type TooltipProps = ExtractPropTypes<typeof tooltipProps> // ExtractPropTypes和defineCpmponent类似\nexport type PlacementType = TooltipProps['placement']\n\n// instance\nexport type TooltipInstance = InstanceType<typeof Tooltip>\n"],"names":[],"mappings":";;;;AAMO,MAAM,SAAY,GAAA;AAAA,EACvB,KAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,aAAA;AACF,EAAA;AACO,MAAM,eAAe,UAAW,CAAA;AAAA;AAAA;AAAA;AAAA,EAIrC,GAAK,EAAA;AAAA,IACH,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA,cAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,MAAA;AAAA,IACN,MAAQ,EAAA,SAAA;AAAA,IACR,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,cAAA,CAAgC,CAAC,MAAA,EAAQ,MAAM,CAAC,CAAA;AAAA,IACtD,OAAS,EAAA,EAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,WAAa,EAAA;AAAA,IACX,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,eAAiB,EAAA;AAAA,IACf,IAAM,EAAA,MAAA;AAAA,IACN,OAAS,EAAA,CAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,gBAAkB,EAAA;AAAA,IAChB,IAAM,EAAA,MAAA;AAAA,GACR;AAAA;AAAA;AAAA;AAAA,EAIA,YAAc,EAAA;AAAA,IACZ,IAAM,EAAA,MAAA;AAAA,GACR;AAAA;AAAA;AAAA;AAAA,EAIA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,OAAA;AAAA,IACN,OAAS,EAAA,KAAA;AAAA,GACX;AAAA;AAAA;AAAA;AAAA,EAIA,KAAO,EAAA;AAAA,IACL,IAAM,EAAA,cAAA,CAAgC,CAAC,MAAA,EAAQ,MAAM,CAAC,CAAA;AAAA,IACtD,OAAS,EAAA,EAAA;AAAA,GACX;AACF,CAAU;;;;"}

package/es/packages/components/tooltip/src/tooltip.vue2.mjs

@@ -1,8 +1,8 @@
-import { defineComponent, useAttrs, computed, resolveComponent, openBlock, createBlock, mergeProps, unref, withCtx, createElementVNode, toDisplayString, renderSlot, createVNode } from 'vue';
+import { defineComponent, useAttrs, computed, resolveComponent, openBlock, createBlock, mergeProps, unref, withCtx, createElementVNode, toDisplayString, normalizeClass, normalizeStyle, renderSlot, createVNode } from 'vue';
 import '../../../utils/index.mjs';
 import { tooltipProps } from './tooltip.mjs';
-import { addUnit } from '../../../utils/add-unit.mjs';
 import { createNamespace } from '../../../utils/create-namespace.mjs';
+import { addUnit } from '../../../utils/add-unit.mjs';
 
 "use strict";
 var _sfc_main = /* @__PURE__ */ defineComponent({
@@ -12,15 +12,37 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const attrs = useAttrs();
-    const maxWidth = computed(() => addUnit(props.maxWidth));
     const bem = createNamespace("tooltip");
+    const bemContainer = createNamespace("container-tooltip");
+    const getContainerClass = computed(() => {
+      const ellipsisClass = props.ellipsis ? bemContainer.m("ellipsis") : "";
+      return `${bemContainer.b()} ${ellipsisClass}`;
+    });
+    const getContainerStyle = computed(() => {
+      const width = addUnit(props.width);
+      return {
+        width: width ? width : ""
+      };
+    });
+    const getOverlayClass = computed(() => {
+      const ellipsisClass = props.tipEllipsis ? bem.m("ellipsis") : "";
+      return `${bem.b()} ${ellipsisClass} ${props.overlayClassName}`;
+    });
+    const getOverlayStyle = computed(() => {
+      const maxWidth = addUnit(props.maxWidth);
+      return {
+        WebkitLineClamp: props.tipEllipsis ? props.tipEllipsisLine : "none",
+        "max-width": maxWidth,
+        ...props.overlayStyle
+      };
+    });
     return (_ctx, _cache) => {
       const _component_ll_icon = resolveComponent("ll-icon");
       const _component_a_tooltip = resolveComponent("a-tooltip");
       return openBlock(), createBlock(_component_a_tooltip, mergeProps(unref(attrs), {
         placement: _ctx.placement,
-        "overlay-style": { "max-width": maxWidth.value },
-        class: unref(bem).b()
+        "overlay-style": getOverlayStyle.value,
+        "overlay-class-name": getOverlayClass.value
       }), {
         title: withCtx(() => [
           createElementVNode(
@@ -32,13 +54,24 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           )
         ]),
         default: withCtx(() => [
-          renderSlot(_ctx.$slots, "default", {}, () => [
-            createVNode(_component_ll_icon, { "icon-name": "icon-question" })
-          ])
+          createElementVNode(
+            "div",
+            {
+              class: normalizeClass(getContainerClass.value),
+              style: normalizeStyle(getContainerStyle.value)
+            },
+            [
+              renderSlot(_ctx.$slots, "default", {}, () => [
+                createVNode(_component_ll_icon, { "icon-name": "icon-question" })
+              ])
+            ],
+            6
+            /* CLASS, STYLE */
+          )
         ]),
         _: 3
         /* FORWARDED */
-      }, 16, ["placement", "overlay-style", "class"]);
+      }, 16, ["placement", "overlay-style", "overlay-class-name"]);
     };
   }
 });

package/es/packages/components/tooltip/src/tooltip.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.vue2.mjs","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n  <a-tooltip\n    v-bind=\"attrs\"\n    :placement=\"placement\"\n    :overlay-style=\"{ 'max-width': maxWidth }\"\n    :class=\"bem.b()\"\n  >\n    <template #title>\n      <span>{{ tip }}</span>\n    </template>\n    <slot>\n      <ll-icon icon-name=\"icon-question\" />\n    </slot>\n  </a-tooltip>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAttrs } from 'vue'\nimport { addUnit, createNamespace } from '@ll-plus/utils'\n\nimport { tooltipProps } from './tooltip'\nimport { computed } from 'vue'\n\n// 1.defineOptions\ndefineOptions({ name: 'LlTooltip' })\n\n// 2.props\nconst props = defineProps(tooltipProps)\nconst attrs = useAttrs()\n\n// 3.computes/const\nconst maxWidth = computed(() => addUnit(props.maxWidth))\nconst bem = createNamespace('tooltip')\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;AA2BA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAGvB,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,OAAQ,CAAA,KAAA,CAAM,QAAQ,CAAC,CAAA,CAAA;AACvD,IAAM,MAAA,GAAA,GAAM,gBAAgB,SAAS,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"tooltip.vue2.mjs","sources":["../../../../../../packages/components/tooltip/src/tooltip.vue"],"sourcesContent":["<template>\n  <a-tooltip\n    v-bind=\"attrs\"\n    :placement=\"placement\"\n    :overlay-style=\"getOverlayStyle\"\n    :overlay-class-name=\"getOverlayClass\"\n  >\n    <!-- title插槽 -->\n    <template #title>\n      <span>{{ tip }}</span>\n    </template>\n    <!-- 默认插槽 -->\n    <div :class=\"getContainerClass\" :style=\"getContainerStyle\">\n      <slot>\n        <ll-icon icon-name=\"icon-question\" />\n      </slot>\n    </div>\n  </a-tooltip>\n</template>\n\n<script setup lang=\"ts\">\nimport { useAttrs } from 'vue'\nimport { addUnit, createNamespace } from '@ll-plus/utils'\n\nimport { tooltipProps } from './tooltip'\nimport { computed } from 'vue'\n\n// 1.defineOptions\ndefineOptions({ name: 'LlTooltip' })\n\n// 2.props\nconst props = defineProps(tooltipProps)\nconst attrs = useAttrs()\n\n// 3.computes/const\nconst bem = createNamespace('tooltip')\nconst bemContainer = createNamespace('container-tooltip')\n// 根据ellipsis设置设置插槽容器的文字超出样式\nconst getContainerClass = computed(() => {\n  const ellipsisClass = props.ellipsis ? bemContainer.m('ellipsis') : ''\n  return `${bemContainer.b()} ${ellipsisClass}`\n})\n// 设置插槽容器的宽度\nconst getContainerStyle = computed(() => {\n  const width = addUnit(props.width)\n  return {\n    width: width ? width : ''\n  }\n})\n// 根据ellipsis/width设置设置tip弹窗的类名\nconst getOverlayClass = computed(() => {\n  const ellipsisClass = props.tipEllipsis ? bem.m('ellipsis') : ''\n  return `${bem.b()} ${ellipsisClass} ${props.overlayClassName}`\n})\n// 根据ellipsis/width设置设置tip弹窗的样式\nconst getOverlayStyle = computed(() => {\n  const maxWidth = addUnit(props.maxWidth)\n  return {\n    WebkitLineClamp: props.tipEllipsis ? props.tipEllipsisLine : 'none',\n    'max-width': maxWidth,\n    ...props.overlayStyle\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;AA+BA,IAAA,MAAM,KAAQ,GAAA,OAAA,CAAA;AACd,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAGvB,IAAM,MAAA,GAAA,GAAM,gBAAgB,SAAS,CAAA,CAAA;AACrC,IAAM,MAAA,YAAA,GAAe,gBAAgB,mBAAmB,CAAA,CAAA;AAExD,IAAM,MAAA,iBAAA,GAAoB,SAAS,MAAM;AACvC,MAAA,MAAM,gBAAgB,KAAM,CAAA,QAAA,GAAW,YAAa,CAAA,CAAA,CAAE,UAAU,CAAI,GAAA,EAAA,CAAA;AACpE,MAAA,OAAO,CAAG,EAAA,YAAA,CAAa,CAAE,EAAC,IAAI,aAAa,CAAA,CAAA,CAAA;AAAA,KAC5C,CAAA,CAAA;AAED,IAAM,MAAA,iBAAA,GAAoB,SAAS,MAAM;AACvC,MAAM,MAAA,KAAA,GAAQ,OAAQ,CAAA,KAAA,CAAM,KAAK,CAAA,CAAA;AACjC,MAAO,OAAA;AAAA,QACL,KAAA,EAAO,QAAQ,KAAQ,GAAA,EAAA;AAAA,OACzB,CAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAM,MAAA,eAAA,GAAkB,SAAS,MAAM;AACrC,MAAA,MAAM,gBAAgB,KAAM,CAAA,WAAA,GAAc,GAAI,CAAA,CAAA,CAAE,UAAU,CAAI,GAAA,EAAA,CAAA;AAC9D,MAAO,OAAA,CAAA,EAAG,IAAI,CAAE,EAAC,IAAI,aAAa,CAAA,CAAA,EAAI,MAAM,gBAAgB,CAAA,CAAA,CAAA;AAAA,KAC7D,CAAA,CAAA;AAED,IAAM,MAAA,eAAA,GAAkB,SAAS,MAAM;AACrC,MAAM,MAAA,QAAA,GAAW,OAAQ,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AACvC,MAAO,OAAA;AAAA,QACL,eAAiB,EAAA,KAAA,CAAM,WAAc,GAAA,KAAA,CAAM,eAAkB,GAAA,MAAA;AAAA,QAC7D,WAAa,EAAA,QAAA;AAAA,QACb,GAAG,KAAM,CAAA,YAAA;AAAA,OACX,CAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/index.full.js

@@ -75765,6 +75765,46 @@
     maxWidth: {
       type: definePropType([Number, String]),
       default: ""
+    },
+    /**
+     * @description 提示框里的文字是否超出显示...
+     */
+    tipEllipsis: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * @description 提示框里的文字是否超出几行显示...
+     */
+    tipEllipsisLine: {
+      type: Number,
+      default: 1
+    },
+    /**
+     * @description 卡片类名
+     */
+    overlayClassName: {
+      type: String
+    },
+    /**
+     * @description 卡片样式
+     */
+    overlayStyle: {
+      type: Object
+    },
+    /**
+     * @description 文字是否超出显示...
+     */
+    ellipsis: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * @description 文字的宽度，超出这个文字显示...
+     */
+    width: {
+      type: definePropType([Number, String]),
+      default: ""
     }
   });
 
@@ -75775,15 +75815,37 @@
     setup(__props) {
       const props = __props;
       const attrs = require$$0.useAttrs();
-      const maxWidth = require$$0.computed(() => addUnit(props.maxWidth));
       const bem = createNamespace("tooltip");
+      const bemContainer = createNamespace("container-tooltip");
+      const getContainerClass = require$$0.computed(() => {
+        const ellipsisClass = props.ellipsis ? bemContainer.m("ellipsis") : "";
+        return `${bemContainer.b()} ${ellipsisClass}`;
+      });
+      const getContainerStyle = require$$0.computed(() => {
+        const width = addUnit(props.width);
+        return {
+          width: width ? width : ""
+        };
+      });
+      const getOverlayClass = require$$0.computed(() => {
+        const ellipsisClass = props.tipEllipsis ? bem.m("ellipsis") : "";
+        return `${bem.b()} ${ellipsisClass} ${props.overlayClassName}`;
+      });
+      const getOverlayStyle = require$$0.computed(() => {
+        const maxWidth = addUnit(props.maxWidth);
+        return {
+          WebkitLineClamp: props.tipEllipsis ? props.tipEllipsisLine : "none",
+          "max-width": maxWidth,
+          ...props.overlayStyle
+        };
+      });
       return (_ctx, _cache) => {
         const _component_ll_icon = require$$0.resolveComponent("ll-icon");
         const _component_a_tooltip = require$$0.resolveComponent("a-tooltip");
         return require$$0.openBlock(), require$$0.createBlock(_component_a_tooltip, require$$0.mergeProps(require$$0.unref(attrs), {
           placement: _ctx.placement,
-          "overlay-style": { "max-width": maxWidth.value },
-          class: require$$0.unref(bem).b()
+          "overlay-style": getOverlayStyle.value,
+          "overlay-class-name": getOverlayClass.value
         }), {
           title: require$$0.withCtx(() => [
             require$$0.createElementVNode(
@@ -75795,13 +75857,24 @@
             )
           ]),
           default: require$$0.withCtx(() => [
-            require$$0.renderSlot(_ctx.$slots, "default", {}, () => [
-              require$$0.createVNode(_component_ll_icon, { "icon-name": "icon-question" })
-            ])
+            require$$0.createElementVNode(
+              "div",
+              {
+                class: require$$0.normalizeClass(getContainerClass.value),
+                style: require$$0.normalizeStyle(getContainerStyle.value)
+              },
+              [
+                require$$0.renderSlot(_ctx.$slots, "default", {}, () => [
+                  require$$0.createVNode(_component_ll_icon, { "icon-name": "icon-question" })
+                ])
+              ],
+              6
+              /* CLASS, STYLE */
+            )
           ]),
           _: 3
           /* FORWARDED */
-        }, 16, ["placement", "overlay-style", "class"]);
+        }, 16, ["placement", "overlay-style", "overlay-class-name"]);
       };
     }
   });