@element-plus/nightly 0.0.20240610 → 0.0.20240612

package/lib/components/pagination/src/components/total2.js.map

@@ -1 +1 @@
-{"version":3,"file":"total2.js","sources":["../../../../../../../packages/components/pagination/src/components/total.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type Total from './total.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const paginationTotalProps = buildProps({\n  total: {\n    type: Number,\n    default: 1000,\n  },\n} as const)\n\nexport type PaginationTotalProps = ExtractPropTypes<typeof paginationTotalProps>\n\nexport type TotalInstance = InstanceType<typeof Total>\n"],"names":["buildProps"],"mappings":";;;;;;;AACY,MAAC,oBAAoB,GAAGA,kBAAU,CAAC;AAC/C,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"total2.js","sources":["../../../../../../../packages/components/pagination/src/components/total.vue"],"sourcesContent":["<template>\n  <span :class=\"ns.e('total')\" :disabled=\"disabled\">\n    {{\n      t('el.pagination.total', {\n        total,\n      })\n    }}\n  </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { usePagination } from '../usePagination'\nimport { paginationTotalProps } from './total'\n\nconst { t } = useLocale()\nconst ns = useNamespace('pagination')\nconst { disabled } = usePagination()\n\ndefineOptions({\n  name: 'ElPaginationTotal',\n})\n\ndefineProps(paginationTotalProps)\n</script>\n"],"names":["useLocale","useNamespace","usePagination"],"mappings":";;;;;;;;;;;;;uCAmBc,CAAA;AAAA,EACZ,IAAM,EAAA,mBAAA;AACR,CAAA,CAAA,CAAA;;;;;AANA,IAAM,MAAA,EAAE,MAAMA,eAAU,EAAA,CAAA;AACxB,IAAM,MAAA,EAAA,GAAKC,qBAAa,YAAY,CAAA,CAAA;AACpC,IAAM,MAAA,EAAE,aAAaC,2BAAc,EAAA,CAAA;;;;;;;;;;;;;;;"}

package/lib/components/pagination/src/pagination.js

@@ -11,7 +11,7 @@ var prev = require('./components/prev2.js');
 var next = require('./components/next2.js');
 var sizes = require('./components/sizes2.js');
 var jumper = require('./components/jumper2.js');
-var total = require('./components/total.js');
+var total = require('./components/total2.js');
 var pager = require('./components/pager2.js');
 var runtime = require('../../../utils/vue/props/runtime.js');
 var types = require('../../../utils/types.js');

package/lib/components/table-v2/src/composables/use-row.js

@@ -40,7 +40,7 @@ const useRow = (props, {
       return;
     }
     const tableRoot = tableInstance.vnode.el;
-    const rows = tableRoot.querySelectorAll(`[rowkey=${rowKey}]`);
+    const rows = tableRoot.querySelectorAll(`[rowkey="${String(rowKey)}"]`);
     rows.forEach((row) => {
       if (hovered) {
         row.classList.add(ns.is("hovered"));

package/lib/components/table-v2/src/composables/use-row.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-row.js","sources":["../../../../../../../packages/components/table-v2/src/composables/use-row.ts"],"sourcesContent":["import { computed, getCurrentInstance, ref, shallowRef, unref } from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { isNumber } from '@element-plus/utils'\nimport { FixedDir } from '../constants'\n\nimport type { ComponentInternalInstance, Ref, ShallowRef } from 'vue'\nimport type { TableV2Props } from '../table'\nimport type {\n  RowExpandParams,\n  RowHeightChangedParams,\n  RowHoverParams,\n} from '../row'\nimport type { FixedDirection, KeyType } from '../types'\nimport type { onRowRenderedParams } from '../grid'\nimport type { TableGridInstance } from '../table-grid'\nimport type { UseNamespaceReturn } from '@element-plus/hooks'\n\ntype Heights = Record<KeyType, number>\ntype GridInstanceRef = Ref<TableGridInstance | undefined>\n\ntype UseRowProps = {\n  mainTableRef: GridInstanceRef\n  leftTableRef: GridInstanceRef\n  rightTableRef: GridInstanceRef\n  tableInstance: ComponentInternalInstance\n  ns: UseNamespaceReturn\n  isScrolling: ShallowRef<boolean>\n}\n\nexport const useRow = (\n  props: TableV2Props,\n  {\n    mainTableRef,\n    leftTableRef,\n    rightTableRef,\n    tableInstance,\n    ns,\n    isScrolling,\n  }: UseRowProps\n) => {\n  const vm = getCurrentInstance()!\n  const { emit } = vm\n  const isResetting = shallowRef(false)\n  const expandedRowKeys = ref<KeyType[]>(props.defaultExpandedRowKeys || [])\n  const lastRenderedRowIndex = ref(-1)\n  const resetIndex = shallowRef<number | null>(null)\n  const rowHeights = ref<Heights>({})\n  const pendingRowHeights = ref<Heights>({})\n  const leftTableHeights = shallowRef<Heights>({})\n  const mainTableHeights = shallowRef<Heights>({})\n  const rightTableHeights = shallowRef<Heights>({})\n  const isDynamic = computed(() => isNumber(props.estimatedRowHeight))\n\n  function onRowsRendered(params: onRowRenderedParams) {\n    props.onRowsRendered?.(params)\n\n    if (params.rowCacheEnd > unref(lastRenderedRowIndex)) {\n      lastRenderedRowIndex.value = params.rowCacheEnd\n    }\n  }\n\n  function onRowHovered({ hovered, rowKey }: RowHoverParams) {\n    if (isScrolling.value) {\n      return\n    }\n    const tableRoot = tableInstance!.vnode.el as HTMLElement\n    const rows = tableRoot.querySelectorAll(`[rowkey=${rowKey as string}]`)\n    rows.forEach((row) => {\n      if (hovered) {\n        row.classList.add(ns.is('hovered'))\n      } else {\n        row.classList.remove(ns.is('hovered'))\n      }\n    })\n  }\n\n  function onRowExpanded({\n    expanded,\n    rowData,\n    rowIndex,\n    rowKey,\n  }: RowExpandParams) {\n    const _expandedRowKeys = [...unref(expandedRowKeys)]\n    const currentKeyIndex = _expandedRowKeys.indexOf(rowKey)\n    if (expanded) {\n      if (currentKeyIndex === -1) _expandedRowKeys.push(rowKey)\n    } else {\n      if (currentKeyIndex > -1) _expandedRowKeys.splice(currentKeyIndex, 1)\n    }\n    expandedRowKeys.value = _expandedRowKeys\n\n    emit('update:expandedRowKeys', _expandedRowKeys)\n    props.onRowExpand?.({\n      expanded,\n      rowData,\n      rowIndex,\n      rowKey,\n    })\n    // If this is not controlled, then use this to notify changes\n    props.onExpandedRowsChange?.(_expandedRowKeys)\n  }\n\n  const flushingRowHeights = debounce(() => {\n    isResetting.value = true\n    rowHeights.value = { ...unref(rowHeights), ...unref(pendingRowHeights) }\n    resetAfterIndex(unref(resetIndex)!, false)\n    pendingRowHeights.value = {}\n    // force update\n    resetIndex.value = null\n    mainTableRef.value?.forceUpdate()\n    leftTableRef.value?.forceUpdate()\n    rightTableRef.value?.forceUpdate()\n    vm.proxy?.$forceUpdate()\n    isResetting.value = false\n  }, 0)\n\n  function resetAfterIndex(index: number, forceUpdate = false) {\n    if (!unref(isDynamic)) return\n    ;[mainTableRef, leftTableRef, rightTableRef].forEach((tableRef) => {\n      const table = unref(tableRef)\n      if (table) table.resetAfterRowIndex(index, forceUpdate)\n    })\n  }\n\n  function resetHeights(rowKey: KeyType, height: number, rowIdx: number) {\n    const resetIdx = unref(resetIndex)\n    if (resetIdx === null) {\n      resetIndex.value = rowIdx\n    } else {\n      if (resetIdx > rowIdx) {\n        resetIndex.value = rowIdx\n      }\n    }\n\n    pendingRowHeights.value[rowKey] = height\n  }\n\n  function onRowHeightChange(\n    { rowKey, height, rowIndex }: RowHeightChangedParams,\n    fixedDir: FixedDirection\n  ) {\n    if (!fixedDir) {\n      mainTableHeights.value[rowKey] = height\n    } else {\n      if (fixedDir === FixedDir.RIGHT) {\n        rightTableHeights.value[rowKey] = height\n      } else {\n        leftTableHeights.value[rowKey] = height\n      }\n    }\n\n    const maximumHeight = Math.max(\n      ...[leftTableHeights, rightTableHeights, mainTableHeights].map(\n        (records) => records.value[rowKey] || 0\n      )\n    )\n\n    if (unref(rowHeights)[rowKey] !== maximumHeight) {\n      resetHeights(rowKey, maximumHeight, rowIndex)\n      flushingRowHeights()\n    }\n  }\n\n  return {\n    expandedRowKeys,\n    lastRenderedRowIndex,\n    isDynamic,\n    isResetting,\n    rowHeights,\n\n    resetAfterIndex,\n    onRowExpanded,\n    onRowHovered,\n    onRowsRendered,\n    onRowHeightChange,\n  }\n}\n\nexport type UseRowReturn = ReturnType<typeof useRow>\n"],"names":["getCurrentInstance","shallowRef","ref","computed","isNumber","unref","debounce","FixedDir"],"mappings":"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"}
+{"version":3,"file":"use-row.js","sources":["../../../../../../../packages/components/table-v2/src/composables/use-row.ts"],"sourcesContent":["import { computed, getCurrentInstance, ref, shallowRef, unref } from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { isNumber } from '@element-plus/utils'\nimport { FixedDir } from '../constants'\n\nimport type { ComponentInternalInstance, Ref, ShallowRef } from 'vue'\nimport type { TableV2Props } from '../table'\nimport type {\n  RowExpandParams,\n  RowHeightChangedParams,\n  RowHoverParams,\n} from '../row'\nimport type { FixedDirection, KeyType } from '../types'\nimport type { onRowRenderedParams } from '../grid'\nimport type { TableGridInstance } from '../table-grid'\nimport type { UseNamespaceReturn } from '@element-plus/hooks'\n\ntype Heights = Record<KeyType, number>\ntype GridInstanceRef = Ref<TableGridInstance | undefined>\n\ntype UseRowProps = {\n  mainTableRef: GridInstanceRef\n  leftTableRef: GridInstanceRef\n  rightTableRef: GridInstanceRef\n  tableInstance: ComponentInternalInstance\n  ns: UseNamespaceReturn\n  isScrolling: ShallowRef<boolean>\n}\n\nexport const useRow = (\n  props: TableV2Props,\n  {\n    mainTableRef,\n    leftTableRef,\n    rightTableRef,\n    tableInstance,\n    ns,\n    isScrolling,\n  }: UseRowProps\n) => {\n  const vm = getCurrentInstance()!\n  const { emit } = vm\n  const isResetting = shallowRef(false)\n  const expandedRowKeys = ref<KeyType[]>(props.defaultExpandedRowKeys || [])\n  const lastRenderedRowIndex = ref(-1)\n  const resetIndex = shallowRef<number | null>(null)\n  const rowHeights = ref<Heights>({})\n  const pendingRowHeights = ref<Heights>({})\n  const leftTableHeights = shallowRef<Heights>({})\n  const mainTableHeights = shallowRef<Heights>({})\n  const rightTableHeights = shallowRef<Heights>({})\n  const isDynamic = computed(() => isNumber(props.estimatedRowHeight))\n\n  function onRowsRendered(params: onRowRenderedParams) {\n    props.onRowsRendered?.(params)\n\n    if (params.rowCacheEnd > unref(lastRenderedRowIndex)) {\n      lastRenderedRowIndex.value = params.rowCacheEnd\n    }\n  }\n\n  function onRowHovered({ hovered, rowKey }: RowHoverParams) {\n    if (isScrolling.value) {\n      return\n    }\n    const tableRoot = tableInstance!.vnode.el as HTMLElement\n    const rows = tableRoot.querySelectorAll(`[rowkey=\"${String(rowKey)}\"]`)\n    rows.forEach((row) => {\n      if (hovered) {\n        row.classList.add(ns.is('hovered'))\n      } else {\n        row.classList.remove(ns.is('hovered'))\n      }\n    })\n  }\n\n  function onRowExpanded({\n    expanded,\n    rowData,\n    rowIndex,\n    rowKey,\n  }: RowExpandParams) {\n    const _expandedRowKeys = [...unref(expandedRowKeys)]\n    const currentKeyIndex = _expandedRowKeys.indexOf(rowKey)\n    if (expanded) {\n      if (currentKeyIndex === -1) _expandedRowKeys.push(rowKey)\n    } else {\n      if (currentKeyIndex > -1) _expandedRowKeys.splice(currentKeyIndex, 1)\n    }\n    expandedRowKeys.value = _expandedRowKeys\n\n    emit('update:expandedRowKeys', _expandedRowKeys)\n    props.onRowExpand?.({\n      expanded,\n      rowData,\n      rowIndex,\n      rowKey,\n    })\n    // If this is not controlled, then use this to notify changes\n    props.onExpandedRowsChange?.(_expandedRowKeys)\n  }\n\n  const flushingRowHeights = debounce(() => {\n    isResetting.value = true\n    rowHeights.value = { ...unref(rowHeights), ...unref(pendingRowHeights) }\n    resetAfterIndex(unref(resetIndex)!, false)\n    pendingRowHeights.value = {}\n    // force update\n    resetIndex.value = null\n    mainTableRef.value?.forceUpdate()\n    leftTableRef.value?.forceUpdate()\n    rightTableRef.value?.forceUpdate()\n    vm.proxy?.$forceUpdate()\n    isResetting.value = false\n  }, 0)\n\n  function resetAfterIndex(index: number, forceUpdate = false) {\n    if (!unref(isDynamic)) return\n    ;[mainTableRef, leftTableRef, rightTableRef].forEach((tableRef) => {\n      const table = unref(tableRef)\n      if (table) table.resetAfterRowIndex(index, forceUpdate)\n    })\n  }\n\n  function resetHeights(rowKey: KeyType, height: number, rowIdx: number) {\n    const resetIdx = unref(resetIndex)\n    if (resetIdx === null) {\n      resetIndex.value = rowIdx\n    } else {\n      if (resetIdx > rowIdx) {\n        resetIndex.value = rowIdx\n      }\n    }\n\n    pendingRowHeights.value[rowKey] = height\n  }\n\n  function onRowHeightChange(\n    { rowKey, height, rowIndex }: RowHeightChangedParams,\n    fixedDir: FixedDirection\n  ) {\n    if (!fixedDir) {\n      mainTableHeights.value[rowKey] = height\n    } else {\n      if (fixedDir === FixedDir.RIGHT) {\n        rightTableHeights.value[rowKey] = height\n      } else {\n        leftTableHeights.value[rowKey] = height\n      }\n    }\n\n    const maximumHeight = Math.max(\n      ...[leftTableHeights, rightTableHeights, mainTableHeights].map(\n        (records) => records.value[rowKey] || 0\n      )\n    )\n\n    if (unref(rowHeights)[rowKey] !== maximumHeight) {\n      resetHeights(rowKey, maximumHeight, rowIndex)\n      flushingRowHeights()\n    }\n  }\n\n  return {\n    expandedRowKeys,\n    lastRenderedRowIndex,\n    isDynamic,\n    isResetting,\n    rowHeights,\n\n    resetAfterIndex,\n    onRowExpanded,\n    onRowHovered,\n    onRowsRendered,\n    onRowHeightChange,\n  }\n}\n\nexport type UseRowReturn = ReturnType<typeof useRow>\n"],"names":["getCurrentInstance","shallowRef","ref","computed","isNumber","unref","debounce","FixedDir"],"mappings":"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"}

package/lib/components/tour/src/mask.js

@@ -2,27 +2,86 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../../utils/index.js');
-var runtime = require('../../../utils/vue/props/runtime.js');
+var vue = require('vue');
+require('../../../hooks/index.js');
+var mask = require('./mask2.js');
+var helper = require('./helper.js');
+var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
+var index = require('../../../hooks/use-lockscreen/index.js');
 
-const maskProps = runtime.buildProps({
-  zIndex: {
-    type: Number,
-    default: 1001
-  },
-  visible: Boolean,
-  fill: {
-    type: String,
-    default: "rgba(0,0,0,0.5)"
-  },
-  pos: {
-    type: runtime.definePropType(Object)
-  },
-  targetAreaClickable: {
-    type: Boolean,
-    default: true
+const _hoisted_1 = { style: {
+  width: "100%",
+  height: "100%"
+} };
+const _hoisted_2 = ["d"];
+const __default__ = vue.defineComponent({
+  name: "ElTourMask",
+  inheritAttrs: false
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: mask.maskProps,
+  setup(__props) {
+    const props = __props;
+    const { ns } = vue.inject(helper.tourKey);
+    const radius = vue.computed(() => {
+      var _a, _b;
+      return (_b = (_a = props.pos) == null ? void 0 : _a.radius) != null ? _b : 2;
+    });
+    const roundInfo = vue.computed(() => {
+      const v = radius.value;
+      const baseInfo = `a${v},${v} 0 0 1`;
+      return {
+        topRight: `${baseInfo} ${v},${v}`,
+        bottomRight: `${baseInfo} ${-v},${v}`,
+        bottomLeft: `${baseInfo} ${-v},${-v}`,
+        topLeft: `${baseInfo} ${v},${-v}`
+      };
+    });
+    const path = vue.computed(() => {
+      const width = window.innerWidth;
+      const height = window.innerHeight;
+      const info = roundInfo.value;
+      const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`;
+      const _radius = radius.value;
+      return props.pos ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${props.pos.width - _radius * 2} ${info.topRight} v${props.pos.height - _radius * 2} ${info.bottomRight} h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${-props.pos.height + _radius * 2} ${info.topLeft} z` : _path;
+    });
+    const pathStyle = vue.computed(() => {
+      return {
+        fill: props.fill,
+        pointerEvents: "auto",
+        cursor: "auto"
+      };
+    });
+    index.useLockscreen(vue.toRef(props, "visible"), {
+      ns
+    });
+    return (_ctx, _cache) => {
+      return _ctx.visible ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+        key: 0,
+        class: vue.unref(ns).e("mask"),
+        style: {
+          position: "fixed",
+          left: 0,
+          right: 0,
+          top: 0,
+          bottom: 0,
+          zIndex: _ctx.zIndex,
+          pointerEvents: _ctx.pos && _ctx.targetAreaClickable ? "none" : "auto"
+        }
+      }, _ctx.$attrs), [
+        (vue.openBlock(), vue.createElementBlock("svg", _hoisted_1, [
+          vue.createElementVNode("path", {
+            class: vue.normalizeClass(vue.unref(ns).e("hollow")),
+            style: vue.normalizeStyle(vue.unref(pathStyle)),
+            d: vue.unref(path)
+          }, null, 14, _hoisted_2)
+        ]))
+      ], 16)) : vue.createCommentVNode("v-if", true);
+    };
   }
 });
+var ElTourMask = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "mask.vue"]]);
 
-exports.maskProps = maskProps;
+exports["default"] = ElTourMask;
 //# sourceMappingURL=mask.js.map

package/lib/components/tour/src/mask.js.map

@@ -1 +1 @@
-{"version":3,"file":"mask.js","sources":["../../../../../../packages/components/tour/src/mask.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type { PosInfo } from './types'\n\nexport const maskProps = buildProps({\n  /**\n   * @description mask's zIndex\n   */\n  zIndex: {\n    type: Number,\n    default: 1001,\n  },\n  /**\n   * @description whether to show the mask\n   */\n  visible: Boolean,\n  /**\n   * @description mask's fill\n   */\n  fill: {\n    type: String,\n    default: 'rgba(0,0,0,0.5)',\n  },\n  /***\n   * @description mask's transparent space position\n   */\n  pos: {\n    type: definePropType<PosInfo | null>(Object),\n  },\n  /**\n   * @description whether the target element can be clickable, when using mask\n   */\n  targetAreaClickable: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nexport type MaskProps = ExtractPropTypes<typeof maskProps>\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;;AACY,MAAC,SAAS,GAAGA,kBAAU,CAAC;AACpC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,iBAAiB;AAC9B,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAEC,sBAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"mask.js","sources":["../../../../../../packages/components/tour/src/mask.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"visible\"\n    :class=\"ns.e('mask')\"\n    :style=\"({\n    position: 'fixed',\n    left: 0,\n    right: 0,\n    top: 0,\n    bottom: 0,\n    zIndex,\n    pointerEvents: pos && targetAreaClickable ? 'none' : 'auto',\n  } as any)\"\n    v-bind=\"$attrs\"\n  >\n    <svg\n      :style=\"{\n        width: '100%',\n        height: '100%',\n      }\"\n    >\n      <path :class=\"ns.e('hollow')\" :style=\"pathStyle\" :d=\"path\" />\n    </svg>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, toRef } from 'vue'\nimport { useLockscreen } from '@element-plus/hooks'\nimport { maskProps } from './mask'\nimport { tourKey } from './helper'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElTourMask',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(maskProps)\n\nconst { ns } = inject(tourKey)!\nconst radius = computed(() => props.pos?.radius ?? 2)\nconst roundInfo = computed(() => {\n  const v = radius.value\n  const baseInfo = `a${v},${v} 0 0 1`\n  return {\n    topRight: `${baseInfo} ${v},${v}`,\n    bottomRight: `${baseInfo} ${-v},${v}`,\n    bottomLeft: `${baseInfo} ${-v},${-v}`,\n    topLeft: `${baseInfo} ${v},${-v}`,\n  }\n})\n\nconst path = computed(() => {\n  const width = window.innerWidth\n  const height = window.innerHeight\n  const info = roundInfo.value\n  const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`\n  const _radius = radius.value\n  return props.pos\n    ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${\n        props.pos.width - _radius * 2\n      } ${info.topRight} v${props.pos.height - _radius * 2} ${\n        info.bottomRight\n      } h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${\n        -props.pos.height + _radius * 2\n      } ${info.topLeft} z`\n    : _path\n})\n\nconst pathStyle = computed<CSSProperties>(() => {\n  return {\n    fill: props.fill,\n    pointerEvents: 'auto',\n    cursor: 'auto',\n  }\n})\n\nuseLockscreen(toRef(props, 'visible'), {\n  ns,\n})\n</script>\n"],"names":["inject","tourKey","computed"],"mappings":"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"}

package/lib/components/tour/src/mask2.js

@@ -2,86 +2,27 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var vue = require('vue');
-require('../../../hooks/index.js');
-var mask = require('./mask.js');
-var helper = require('./helper.js');
-var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
-var index = require('../../../hooks/use-lockscreen/index.js');
+require('../../../utils/index.js');
+var runtime = require('../../../utils/vue/props/runtime.js');
 
-const _hoisted_1 = { style: {
-  width: "100%",
-  height: "100%"
-} };
-const _hoisted_2 = ["d"];
-const __default__ = vue.defineComponent({
-  name: "ElTourMask",
-  inheritAttrs: false
-});
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  ...__default__,
-  props: mask.maskProps,
-  setup(__props) {
-    const props = __props;
-    const { ns } = vue.inject(helper.tourKey);
-    const radius = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.pos) == null ? void 0 : _a.radius) != null ? _b : 2;
-    });
-    const roundInfo = vue.computed(() => {
-      const v = radius.value;
-      const baseInfo = `a${v},${v} 0 0 1`;
-      return {
-        topRight: `${baseInfo} ${v},${v}`,
-        bottomRight: `${baseInfo} ${-v},${v}`,
-        bottomLeft: `${baseInfo} ${-v},${-v}`,
-        topLeft: `${baseInfo} ${v},${-v}`
-      };
-    });
-    const path = vue.computed(() => {
-      const width = window.innerWidth;
-      const height = window.innerHeight;
-      const info = roundInfo.value;
-      const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`;
-      const _radius = radius.value;
-      return props.pos ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${props.pos.width - _radius * 2} ${info.topRight} v${props.pos.height - _radius * 2} ${info.bottomRight} h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${-props.pos.height + _radius * 2} ${info.topLeft} z` : _path;
-    });
-    const pathStyle = vue.computed(() => {
-      return {
-        fill: props.fill,
-        pointerEvents: "auto",
-        cursor: "auto"
-      };
-    });
-    index.useLockscreen(vue.toRef(props, "visible"), {
-      ns
-    });
-    return (_ctx, _cache) => {
-      return _ctx.visible ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
-        key: 0,
-        class: vue.unref(ns).e("mask"),
-        style: {
-          position: "fixed",
-          left: 0,
-          right: 0,
-          top: 0,
-          bottom: 0,
-          zIndex: _ctx.zIndex,
-          pointerEvents: _ctx.pos && _ctx.targetAreaClickable ? "none" : "auto"
-        }
-      }, _ctx.$attrs), [
-        (vue.openBlock(), vue.createElementBlock("svg", _hoisted_1, [
-          vue.createElementVNode("path", {
-            class: vue.normalizeClass(vue.unref(ns).e("hollow")),
-            style: vue.normalizeStyle(vue.unref(pathStyle)),
-            d: vue.unref(path)
-          }, null, 14, _hoisted_2)
-        ]))
-      ], 16)) : vue.createCommentVNode("v-if", true);
-    };
+const maskProps = runtime.buildProps({
+  zIndex: {
+    type: Number,
+    default: 1001
+  },
+  visible: Boolean,
+  fill: {
+    type: String,
+    default: "rgba(0,0,0,0.5)"
+  },
+  pos: {
+    type: runtime.definePropType(Object)
+  },
+  targetAreaClickable: {
+    type: Boolean,
+    default: true
   }
 });
-var ElTourMask = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "mask.vue"]]);
 
-exports["default"] = ElTourMask;
+exports.maskProps = maskProps;
 //# sourceMappingURL=mask2.js.map

package/lib/components/tour/src/mask2.js.map

@@ -1 +1 @@
-{"version":3,"file":"mask2.js","sources":["../../../../../../packages/components/tour/src/mask.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"visible\"\n    :class=\"ns.e('mask')\"\n    :style=\"({\n    position: 'fixed',\n    left: 0,\n    right: 0,\n    top: 0,\n    bottom: 0,\n    zIndex,\n    pointerEvents: pos && targetAreaClickable ? 'none' : 'auto',\n  } as any)\"\n    v-bind=\"$attrs\"\n  >\n    <svg\n      :style=\"{\n        width: '100%',\n        height: '100%',\n      }\"\n    >\n      <path :class=\"ns.e('hollow')\" :style=\"pathStyle\" :d=\"path\" />\n    </svg>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, toRef } from 'vue'\nimport { useLockscreen } from '@element-plus/hooks'\nimport { maskProps } from './mask'\nimport { tourKey } from './helper'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElTourMask',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(maskProps)\n\nconst { ns } = inject(tourKey)!\nconst radius = computed(() => props.pos?.radius ?? 2)\nconst roundInfo = computed(() => {\n  const v = radius.value\n  const baseInfo = `a${v},${v} 0 0 1`\n  return {\n    topRight: `${baseInfo} ${v},${v}`,\n    bottomRight: `${baseInfo} ${-v},${v}`,\n    bottomLeft: `${baseInfo} ${-v},${-v}`,\n    topLeft: `${baseInfo} ${v},${-v}`,\n  }\n})\n\nconst path = computed(() => {\n  const width = window.innerWidth\n  const height = window.innerHeight\n  const info = roundInfo.value\n  const _path = `M${width},0 L0,0 L0,${height} L${width},${height} L${width},0 Z`\n  const _radius = radius.value\n  return props.pos\n    ? `${_path} M${props.pos.left + _radius},${props.pos.top} h${\n        props.pos.width - _radius * 2\n      } ${info.topRight} v${props.pos.height - _radius * 2} ${\n        info.bottomRight\n      } h${-props.pos.width + _radius * 2} ${info.bottomLeft} v${\n        -props.pos.height + _radius * 2\n      } ${info.topLeft} z`\n    : _path\n})\n\nconst pathStyle = computed<CSSProperties>(() => {\n  return {\n    fill: props.fill,\n    pointerEvents: 'auto',\n    cursor: 'auto',\n  }\n})\n\nuseLockscreen(toRef(props, 'visible'), {\n  ns,\n})\n</script>\n"],"names":["inject","tourKey","computed"],"mappings":"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"}
+{"version":3,"file":"mask2.js","sources":["../../../../../../packages/components/tour/src/mask.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type { PosInfo } from './types'\n\nexport const maskProps = buildProps({\n  /**\n   * @description mask's zIndex\n   */\n  zIndex: {\n    type: Number,\n    default: 1001,\n  },\n  /**\n   * @description whether to show the mask\n   */\n  visible: Boolean,\n  /**\n   * @description mask's fill\n   */\n  fill: {\n    type: String,\n    default: 'rgba(0,0,0,0.5)',\n  },\n  /***\n   * @description mask's transparent space position\n   */\n  pos: {\n    type: definePropType<PosInfo | null>(Object),\n  },\n  /**\n   * @description whether the target element can be clickable, when using mask\n   */\n  targetAreaClickable: {\n    type: Boolean,\n    default: true,\n  },\n})\n\nexport type MaskProps = ExtractPropTypes<typeof maskProps>\n"],"names":["buildProps","definePropType"],"mappings":";;;;;;;AACY,MAAC,SAAS,GAAGA,kBAAU,CAAC;AACpC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,iBAAiB;AAC9B,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAEC,sBAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC;;;;"}

package/lib/components/tour/src/tour2.js

@@ -6,7 +6,7 @@ var vue = require('vue');
 var core = require('@vueuse/core');
 require('../../../hooks/index.js');
 require('../../../utils/index.js');
-var mask = require('./mask2.js');
+var mask = require('./mask.js');
 var content = require('./content2.js');
 var steps = require('./steps.js');
 var tour = require('./tour.js');

package/lib/components/watermark/index.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('../../utils/index.js');
-var watermark$1 = require('./src/watermark.js');
-var watermark = require('./src/watermark2.js');
+var watermark$1 = require('./src/watermark2.js');
+var watermark = require('./src/watermark.js');
 var install = require('../../utils/vue/install.js');
 
 const ElWatermark = install.withInstall(watermark$1["default"]);

package/lib/components/watermark/src/watermark.js

@@ -2,217 +2,36 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var vue = require('vue');
-var core = require('@vueuse/core');
-var watermark = require('./watermark2.js');
-var utils = require('./utils.js');
-var useClips = require('./useClips.js');
-var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
+require('../../../utils/index.js');
+var runtime = require('../../../utils/vue/props/runtime.js');
 
-const __default__ = vue.defineComponent({
-  name: "ElWatermark"
-});
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  ...__default__,
-  props: watermark.watermarkProps,
-  setup(__props) {
-    const props = __props;
-    const style = {
-      position: "relative"
-    };
-    const color = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.color) != null ? _b : "rgba(0,0,0,.15)";
-    });
-    const fontSize = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.fontSize) != null ? _b : 16;
-    });
-    const fontWeight = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.fontWeight) != null ? _b : "normal";
-    });
-    const fontStyle = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.fontStyle) != null ? _b : "normal";
-    });
-    const fontFamily = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.fontFamily) != null ? _b : "sans-serif";
-    });
-    const textAlign = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.textAlign) != null ? _b : "center";
-    });
-    const textBaseline = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.font) == null ? void 0 : _a.textBaseline) != null ? _b : "hanging";
-    });
-    const gapX = vue.computed(() => props.gap[0]);
-    const gapY = vue.computed(() => props.gap[1]);
-    const gapXCenter = vue.computed(() => gapX.value / 2);
-    const gapYCenter = vue.computed(() => gapY.value / 2);
-    const offsetLeft = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.offset) == null ? void 0 : _a[0]) != null ? _b : gapXCenter.value;
-    });
-    const offsetTop = vue.computed(() => {
-      var _a, _b;
-      return (_b = (_a = props.offset) == null ? void 0 : _a[1]) != null ? _b : gapYCenter.value;
-    });
-    const getMarkStyle = () => {
-      const markStyle = {
-        zIndex: props.zIndex,
-        position: "absolute",
-        left: 0,
-        top: 0,
-        width: "100%",
-        height: "100%",
-        pointerEvents: "none",
-        backgroundRepeat: "repeat"
-      };
-      let positionLeft = offsetLeft.value - gapXCenter.value;
-      let positionTop = offsetTop.value - gapYCenter.value;
-      if (positionLeft > 0) {
-        markStyle.left = `${positionLeft}px`;
-        markStyle.width = `calc(100% - ${positionLeft}px)`;
-        positionLeft = 0;
-      }
-      if (positionTop > 0) {
-        markStyle.top = `${positionTop}px`;
-        markStyle.height = `calc(100% - ${positionTop}px)`;
-        positionTop = 0;
-      }
-      markStyle.backgroundPosition = `${positionLeft}px ${positionTop}px`;
-      return markStyle;
-    };
-    const containerRef = vue.shallowRef(null);
-    const watermarkRef = vue.shallowRef();
-    const stopObservation = vue.ref(false);
-    const destroyWatermark = () => {
-      if (watermarkRef.value) {
-        watermarkRef.value.remove();
-        watermarkRef.value = void 0;
-      }
-    };
-    const appendWatermark = (base64Url, markWidth) => {
-      var _a;
-      if (containerRef.value && watermarkRef.value) {
-        stopObservation.value = true;
-        watermarkRef.value.setAttribute("style", utils.getStyleStr({
-          ...getMarkStyle(),
-          backgroundImage: `url('${base64Url}')`,
-          backgroundSize: `${Math.floor(markWidth)}px`
-        }));
-        (_a = containerRef.value) == null ? void 0 : _a.append(watermarkRef.value);
-        setTimeout(() => {
-          stopObservation.value = false;
-        });
-      }
-    };
-    const getMarkSize = (ctx) => {
-      let defaultWidth = 120;
-      let defaultHeight = 64;
-      const image = props.image;
-      const content = props.content;
-      const width = props.width;
-      const height = props.height;
-      if (!image && ctx.measureText) {
-        ctx.font = `${Number(fontSize.value)}px ${fontFamily.value}`;
-        const contents = Array.isArray(content) ? content : [content];
-        const sizes = contents.map((item) => {
-          const metrics = ctx.measureText(item);
-          return [
-            metrics.width,
-            metrics.fontBoundingBoxAscent !== void 0 ? metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent : metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent
-          ];
-        });
-        defaultWidth = Math.ceil(Math.max(...sizes.map((size) => size[0])));
-        defaultHeight = Math.ceil(Math.max(...sizes.map((size) => size[1]))) * contents.length + (contents.length - 1) * useClips.FontGap;
-      }
-      return [width != null ? width : defaultWidth, height != null ? height : defaultHeight];
-    };
-    const getClips = useClips["default"]();
-    const renderWatermark = () => {
-      const canvas = document.createElement("canvas");
-      const ctx = canvas.getContext("2d");
-      const image = props.image;
-      const content = props.content;
-      const rotate = props.rotate;
-      if (ctx) {
-        if (!watermarkRef.value) {
-          watermarkRef.value = document.createElement("div");
-        }
-        const ratio = utils.getPixelRatio();
-        const [markWidth, markHeight] = getMarkSize(ctx);
-        const drawCanvas = (drawContent) => {
-          const [textClips, clipWidth] = getClips(drawContent || "", rotate, ratio, markWidth, markHeight, {
-            color: color.value,
-            fontSize: fontSize.value,
-            fontStyle: fontStyle.value,
-            fontWeight: fontWeight.value,
-            fontFamily: fontFamily.value,
-            textAlign: textAlign.value,
-            textBaseline: textBaseline.value
-          }, gapX.value, gapY.value);
-          appendWatermark(textClips, clipWidth);
-        };
-        if (image) {
-          const img = new Image();
-          img.onload = () => {
-            drawCanvas(img);
-          };
-          img.onerror = () => {
-            drawCanvas(content);
-          };
-          img.crossOrigin = "anonymous";
-          img.referrerPolicy = "no-referrer";
-          img.src = image;
-        } else {
-          drawCanvas(content);
-        }
-      }
-    };
-    vue.onMounted(() => {
-      renderWatermark();
-    });
-    vue.watch(() => props, () => {
-      renderWatermark();
-    }, {
-      deep: true,
-      flush: "post"
-    });
-    vue.onBeforeUnmount(() => {
-      destroyWatermark();
-    });
-    const onMutate = (mutations) => {
-      if (stopObservation.value) {
-        return;
-      }
-      mutations.forEach((mutation) => {
-        if (utils.reRendering(mutation, watermarkRef.value)) {
-          destroyWatermark();
-          renderWatermark();
-        }
-      });
-    };
-    core.useMutationObserver(containerRef, onMutate, {
-      attributes: true,
-      subtree: true,
-      childList: true
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        ref_key: "containerRef",
-        ref: containerRef,
-        style: vue.normalizeStyle([style])
-      }, [
-        vue.renderSlot(_ctx.$slots, "default")
-      ], 4);
-    };
+const watermarkProps = runtime.buildProps({
+  zIndex: {
+    type: Number,
+    default: 9
+  },
+  rotate: {
+    type: Number,
+    default: -22
+  },
+  width: Number,
+  height: Number,
+  image: String,
+  content: {
+    type: runtime.definePropType([String, Array]),
+    default: "Element Plus"
+  },
+  font: {
+    type: runtime.definePropType(Object)
+  },
+  gap: {
+    type: runtime.definePropType(Array),
+    default: () => [100, 100]
+  },
+  offset: {
+    type: runtime.definePropType(Array)
   }
 });
-var Watermark = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "watermark.vue"]]);
 
-exports["default"] = Watermark;
+exports.watermarkProps = watermarkProps;
 //# sourceMappingURL=watermark.js.map