@will-ui/vue 1.0.0 → 1.0.2

package/dist/components/index.js

@@ -19,7 +19,7 @@ import ChooseItem_default from "./chooseItem/ChooseItem.js";
 import Choose_default from "./choose/Choose.js";
 import Write_default from "./write/Write.js";
 import Choose2_default from "./choose2/Choose2.js";
-import CopyImpl from "./copy/Copy.js";
+import Copy from "./copy/Copy.js";
 import CornerEars from "./cornerEars/CornerEars.js";
 import ColorPicker_default from "./colorPicker/ColorPicker.js";
 import Drawer_default from "./drawer/Drawer.js";
@@ -31,9 +31,9 @@ import Ellipsis_default from "./ellipsis/Ellipsis.js";
 import Equalizer_default from "./equalizer/Equalizer.js";
 import Form_default from "./form/Form.js";
 import FormItem_default from "./formItem/FormItem.js";
-import ImageImpl from "./image/Image.js";
+import Image from "./image/Image.js";
 import SvgIcon, { resolvePlayModeIconName } from "./svgIcon/SvgIcon.js";
-import PictureImpl from "./picture/Picture.js";
+import Picture from "./picture/Picture.js";
 import { LCD_FONT_FALLBACK } from "./lcdFont/config.js";
 import LcdFont_default from "./lcdFont/LcdFont.js";
 import Match_default from "./match/Match.js";
@@ -51,7 +51,7 @@ import Slider_default from "./slider/Slider.js";
 import Switch_default from "./switch/Switch.js";
 import TimePicker_default from "./time/TimePicker.js";
 import Tab from "./tab/Tab.js";
-import TextareaImpl from "./textarea/Textarea.js";
+import Textarea from "./textarea/Textarea.js";
 import Tree from "./tree/Tree.js";
 import TreeChoose_default from "./tree-choose/TreeChoose.js";
 import Upload_default from "./upload/Upload.js";
@@ -70,7 +70,7 @@ var components_exports = /* @__PURE__ */ __exportAll({
 	Close: () => Close_default,
 	ColorPicker: () => ColorPicker_default,
 	Confirm: () => confirm_default,
-	Copy: () => CopyImpl,
+	Copy: () => Copy,
 	CornerEars: () => CornerEars,
 	DATE_PICKER_FALLBACK: () => DATE_PICKER_FALLBACK,
 	DatePicker: () => DatePicker_default,
@@ -83,7 +83,7 @@ var components_exports = /* @__PURE__ */ __exportAll({
 	FormItem: () => FormItem_default,
 	ICON_FALLBACK: () => ICON_FALLBACK,
 	Icon: () => Icon_default,
-	Image: () => ImageImpl,
+	Image: () => Image,
 	LCD_FONT_FALLBACK: () => LCD_FONT_FALLBACK,
 	Layer: () => Layer_default,
 	LcdFont: () => LcdFont_default,
@@ -95,7 +95,7 @@ var components_exports = /* @__PURE__ */ __exportAll({
 	Notice: () => NoticePlugin,
 	Num: () => Number_default,
 	Pagination: () => Pagination_default,
-	Picture: () => PictureImpl,
+	Picture: () => Picture,
 	Progress: () => Progress_default,
 	Radio: () => Radio_default,
 	Scrollbar: () => Scrollbar_default,
@@ -105,7 +105,7 @@ var components_exports = /* @__PURE__ */ __exportAll({
 	SvgIcon: () => SvgIcon,
 	Switch: () => Switch_default,
 	Tab: () => Tab,
-	Textarea: () => TextareaImpl,
+	Textarea: () => Textarea,
 	TimePicker: () => TimePicker_default,
 	Toggle: () => Toggle_default,
 	Tooltip: () => Tooltip_default,
@@ -119,6 +119,6 @@ var components_exports = /* @__PURE__ */ __exportAll({
 	resolvePlayModeIconName: () => resolvePlayModeIconName
 });
 //#endregion
-export { AudioPlayer_default as AudioPlayer, Btn, BtnGroup, Cascade_default as Cascade, Checkbox_default as Checkbox, Choose_default as Choose, Choose2_default as Choose2, ChooseItem_default as ChooseItem, CircleProgress_default as CircleProgress, Close_default as Close, ColorPicker_default as ColorPicker, confirm_default as Confirm, CopyImpl as Copy, CornerEars, DATE_PICKER_FALLBACK, DatePicker_default as DatePicker, Drawer_default as Drawer, Ellipsis_default as Ellipsis, Empty_default as Empty, Equalizer_default as Equalizer, Fallback_default as Fallback, Form_default as Form, FormItem_default as FormItem, ICON_FALLBACK, Icon_default as Icon, ImageImpl as Image, LCD_FONT_FALLBACK, Layer_default as Layer, LcdFont_default as LcdFont, List_default as List, Loading_default as Loading, Mask_default as Mask, Match_default as Match, Modal_default as Modal, NoticePlugin as Notice, Number_default as Num, Pagination_default as Pagination, PictureImpl as Picture, Progress_default as Progress, Radio_default as Radio, Scrollbar_default as Scrollbar, Sheet_default as Sheet, SlideDown_default as SlideDown, Slider_default as Slider, SvgIcon, Switch_default as Switch, Tab, TextareaImpl as Textarea, TimePicker_default as TimePicker, Toggle_default as Toggle, Tooltip_default as Tooltip, Tree, TreeChoose_default as TreeChoose, Trigger_default as Trigger, Upload_default as Upload, Virtual, Write_default as Write, components_exports, resolveIconName, resolvePlayModeIconName };
+export { AudioPlayer_default as AudioPlayer, Btn, BtnGroup, Cascade_default as Cascade, Checkbox_default as Checkbox, Choose_default as Choose, Choose2_default as Choose2, ChooseItem_default as ChooseItem, CircleProgress_default as CircleProgress, Close_default as Close, ColorPicker_default as ColorPicker, confirm_default as Confirm, Copy, CornerEars, DATE_PICKER_FALLBACK, DatePicker_default as DatePicker, Drawer_default as Drawer, Ellipsis_default as Ellipsis, Empty_default as Empty, Equalizer_default as Equalizer, Fallback_default as Fallback, Form_default as Form, FormItem_default as FormItem, ICON_FALLBACK, Icon_default as Icon, Image, LCD_FONT_FALLBACK, Layer_default as Layer, LcdFont_default as LcdFont, List_default as List, Loading_default as Loading, Mask_default as Mask, Match_default as Match, Modal_default as Modal, NoticePlugin as Notice, Number_default as Num, Pagination_default as Pagination, Picture, Progress_default as Progress, Radio_default as Radio, Scrollbar_default as Scrollbar, Sheet_default as Sheet, SlideDown_default as SlideDown, Slider_default as Slider, SvgIcon, Switch_default as Switch, Tab, Textarea, TimePicker_default as TimePicker, Toggle_default as Toggle, Tooltip_default as Tooltip, Tree, TreeChoose_default as TreeChoose, Trigger_default as Trigger, Upload_default as Upload, Virtual, Write_default as Write, components_exports, resolveIconName, resolvePlayModeIconName };
 
 //# sourceMappingURL=index.js.map

package/dist/components/modal/Modal.d.ts

@@ -367,7 +367,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         direction: import('..').IconRotateDirection;
         ariaLabel: string;
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-    Btn: import('..').BtnComponent;
+    Btn: import('vue').DefineComponent<import('..').BtnJSXProps>;
     Loading: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         name: {
             type: StringConstructor;

package/dist/components/modal/Modal.js

@@ -9,6 +9,7 @@ import Close_default from "../close/Close.js";
 import Loading_default from "../loading/Loading.js";
 import { useUII18n } from "../../use/useUII18n.js";
 import useScaleFromPoint, { captureScaleFromPoint } from "../../use/useScaleFromPoint.js";
+import usePointerDrag from "../../use/usePointerDrag.js";
 import { MODAL_FALLBACK } from "./config.js";
 import { Fragment, Teleport, Transition, computed, createVNode, defineComponent, mergeProps, nextTick, reactive, ref, useTemplateRef, watch } from "vue";
 //#region components/modal/Modal.tsx
@@ -189,27 +190,34 @@ var Modal_default = /* @__PURE__ */ defineComponent({
 				style: { "z-index": zIndex.value }
 			}, null);
 		}
-		function onStartDrag(ev) {
-			let offsetLeft = 0;
-			let offsetTop = 0;
-			if (modal.value) {
-				offsetLeft = modal.value.offsetLeft;
-				offsetTop = modal.value.offsetTop;
-				setStyle(modal.value, { position: "absolute" });
-				setStyle(modal.value, {
-					left: offsetLeft + "px",
-					top: offsetTop + "px",
-					margin: 0
-				});
-			}
-			ev.preventDefault();
-			ev.stopImmediatePropagation();
-			const disX = ev.clientX - offsetLeft;
-			const disY = ev.clientY - offsetTop;
-			const { inner } = getWindowSize();
-			document.onmousemove = function(e) {
+		const { onMouseDown: onStartDrag } = usePointerDrag({
+			events: "mouse",
+			bind: "document",
+			onStart: (ev, ctx) => {
+				let offsetLeft = 0;
+				let offsetTop = 0;
+				if (modal.value) {
+					offsetLeft = modal.value.offsetLeft;
+					offsetTop = modal.value.offsetTop;
+					setStyle(modal.value, { position: "absolute" });
+					setStyle(modal.value, {
+						left: offsetLeft + "px",
+						top: offsetTop + "px",
+						margin: 0
+					});
+				}
+				ev.preventDefault();
+				ev.stopImmediatePropagation();
+				ctx.data.disX = ev.clientX - offsetLeft;
+				ctx.data.disY = ev.clientY - offsetTop;
+				ctx.data.inner = getWindowSize().inner;
+			},
+			onMove: (e, ctx) => {
 				e.preventDefault();
 				e.stopImmediatePropagation();
+				const disX = ctx.data.disX;
+				const disY = ctx.data.disY;
+				const inner = ctx.data.inner;
 				let x = e.clientX;
 				let y = e.clientY;
 				if (x < 0) x = 0;
@@ -218,11 +226,8 @@ var Modal_default = /* @__PURE__ */ defineComponent({
 				else if (y > inner.height) y = inner.height;
 				pos.x = x - disX;
 				pos.y = y - disY;
-				document.onmouseup = function() {
-					document.onmousemove = null;
-				};
-			};
-		}
+			}
+		});
 		return () => createVNode(Fragment, null, [
 			ctx.slots.trigger?.({
 				show: () => {

package/dist/components/modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","names":["Teleport","Transition","ref","computed","reactive","watch","defineComponent","nextTick","useTemplateRef","mergeProps","createVNode","_createVNode","Fragment","_Fragment","_mergeProps","Mask","Close","Btn","Loading","useGlobalZIndex","useComponentConfig","useScaleFromPoint","captureScaleFromPoint","useEscStack","getWindowSize","setStyle","propSizeToCssVars","toCssVarsStyle","useUII18n","MODAL_FALLBACK","inheritAttrs","name","components","props","show","type","Boolean","default","title","String","Object","Array","width","undefined","maxWidth","height","minHeight","maxHeight","okText","cancelText","beforeCancel","Function","hasMask","hasFooter","zIndex","Number","canCloseByClickSelf","to","HTMLElement","document","body","loading","size","cssVars","emits","_b","_el","enter","after-leave","_opts","after-cancel","setup","ctx","cfg","modal","emptyModal","showMask","showContainer","showEmptyModal","showModal","add","get","transformOrigin","measureOrigin","morphCss","fromTrigger","pinTriggerForLeave","unpinTrigger","pos","x","y","t","hasHeader","slots","resolvedOkText","value","resolvedCancelText","modalOptions","attrs","class","style","left","top","position","onClick","e","stopPropagation","v","immediate","force","setTimeout","hideFromInner","renderLoading","transitionName","onStartDrag","ev","offsetLeft","offsetTop","margin","preventDefault","stopImmediatePropagation","disX","clientX","disY","clientY","inner","onmousemove","onmouseup","trigger","hide","emit","el","onAfterLeave","footer"],"sources":["../../../components/modal/Modal.tsx"],"sourcesContent":["import type { PropType } from 'vue'\r\nimport {\r\n  Teleport,\r\n  Transition,\r\n  Fragment,\r\n  ref,\r\n  computed,\r\n  reactive,\r\n  watch,\r\n  defineComponent,\r\n  nextTick,\r\n  useTemplateRef,\r\n  mergeProps,\r\n} from 'vue'\r\nimport Mask from '../mask/index'\r\nimport Close from '../close/index'\r\nimport Btn from '../btn/index'\r\nimport Loading from '../loading/index'\r\nimport type { LoadingComponentProps } from '../loading/type'\r\nimport useGlobalZIndex from '../../use/useGlobalZIndex'\r\nimport useComponentConfig from '../../use/useComponentConfig'\r\nimport useScaleFromPoint, {\r\n  captureScaleFromPoint,\r\n} from '../../use/useScaleFromPoint'\r\nimport useEscStack from '../../use/useEscStack'\r\nimport { getWindowSize, setStyle, propSizeToCssVars, toCssVarsStyle, type CssVars } from '../../util'\r\nimport { useUII18n } from '../../use/useUII18n'\r\nimport { MODAL_FALLBACK } from './config'\r\n\r\nexport type { ModalGlobalConfig } from './config'\r\nexport { MODAL_FALLBACK } from './config'\r\n\r\ninterface IMethods {\r\n  hide: () => void\r\n}\r\n\r\nexport default defineComponent({\r\n  inheritAttrs: false,\r\n  name: 'Modal',\r\n  components: { Mask, Close, Btn, Loading },\r\n  props: {\r\n    show: { type: Boolean, default: false },\r\n    title: [String, Object, Array],\r\n    width: { type: String, default: undefined },\r\n    maxWidth: { type: String, default: undefined },\r\n    height: { type: String, default: undefined },\r\n    minHeight: { type: String, default: undefined },\r\n    maxHeight: { type: String, default: undefined },\r\n    okText: { type: String, default: undefined },\r\n    cancelText: { type: String, default: undefined },\r\n    beforeCancel: Function,\r\n    hasMask: { type: Boolean, default: undefined },\r\n    hasFooter: { type: Boolean, default: undefined },\r\n    zIndex: Number,\r\n    canCloseByClickSelf: { type: Boolean, default: undefined },\r\n    to: {\r\n      type: HTMLElement,\r\n      default: () => document.body,\r\n    },\r\n    type: {\r\n      type: String as PropType<'white' | 'black'>,\r\n      default: undefined,\r\n    },\r\n    loading: {\r\n      type: Object as PropType<LoadingComponentProps>,\r\n      default: () => ({ show: false }),\r\n    },\r\n    /** 尺度核 → `--w-prop-modal-size`（标题 / header / Close / Btn / Loading） */\r\n    size: { type: Number, default: undefined },\r\n    /** 实例 CSS 变量 */\r\n    cssVars: { type: Object as PropType<CssVars>, default: undefined },\r\n  },\r\n  emits: {\r\n    'update:show': (_b: boolean) => true,\r\n    'before-enter': (_el: HTMLElement) => true,\r\n    enter: (_el: HTMLElement) => true,\r\n    'after-enter': (_el: HTMLElement) => true,\r\n    'after-leave': () => true,\r\n    'after-ok': (_opts: IMethods) => true,\r\n    'after-cancel': () => true,\r\n  },\r\n  setup(props, ctx) {\r\n    const cfg = useComponentConfig('Modal', props, MODAL_FALLBACK)\r\n    const modal = useTemplateRef<HTMLElement>('modal')\r\n    const emptyModal = useTemplateRef<HTMLElement>('emodal')\r\n    const showMask = ref(false)\r\n    const showContainer = ref(false)\r\n    const showEmptyModal = ref(false)\r\n    const showModal = ref(false)\r\n    const { zIndex, add, get } = useGlobalZIndex()\r\n    const {\r\n      transformOrigin,\r\n      measureOrigin,\r\n      morphCss,\r\n      fromTrigger,\r\n      pinTriggerForLeave,\r\n      unpinTrigger,\r\n    } = useScaleFromPoint('modal')\r\n    const pos = reactive<{ x?: number; y?: number }>({\r\n      x: undefined,\r\n      y: undefined,\r\n    })\r\n    const { t } = useUII18n()\r\n\r\n    const hasHeader = computed(() => !!(props.title || ctx.slots.title?.()))\r\n\r\n    const resolvedOkText = computed(() => cfg.value.okText || t('modal.ok'))\r\n    const resolvedCancelText = computed(\r\n      () => cfg.value.cancelText || t('modal.cancel'),\r\n    )\r\n\r\n    const modalOptions = computed(() =>\r\n      mergeProps(ctx.attrs, {\r\n        class: [\r\n          'w-modal',\r\n          `w-modal--${cfg.value.type}`,\r\n          fromTrigger.value && 'w-scale-from-trigger',\r\n        ],\r\n        style: {\r\n          ...toCssVarsStyle({\r\n            ...propSizeToCssVars('modal', cfg.value.size),\r\n            ...props.cssVars,\r\n          }),\r\n          '--w-modal-width': cfg.value.width,\r\n          '--w-modal-max-width': cfg.value.maxWidth,\r\n          '--w-modal-height': cfg.value.height,\r\n          '--w-modal-min-height': cfg.value.minHeight,\r\n          '--w-modal-max-height': cfg.value.maxHeight,\r\n          transformOrigin: `${transformOrigin.x}px ${transformOrigin.y}px`,\r\n          ...morphCss.value,\r\n          left: pos.x === undefined ? '' : `${pos.x}px`,\r\n          top: pos.y === undefined ? '' : `${pos.y}px`,\r\n          position: pos.x === undefined ? '' : 'absolute',\r\n        },\r\n        onClick: (e: MouseEvent) => {\r\n          e.stopPropagation()\r\n        },\r\n      }),\r\n    )\r\n\r\n    watch(\r\n      () => props.show,\r\n      (v) => {\r\n        if (v) {\r\n          showContainer.value = v\r\n        } else {\r\n          showModal.value = v\r\n          showMask.value = v\r\n        }\r\n      },\r\n      { immediate: true },\r\n    )\r\n\r\n    watch(\r\n      showContainer,\r\n      (v) => {\r\n        if (v) {\r\n          captureScaleFromPoint(null, { force: true })\r\n          add()\r\n        }\r\n        setTimeout(async () => {\r\n          if (!v) return\r\n          showMask.value = v\r\n          showEmptyModal.value = v\r\n          await nextTick()\r\n          measureOrigin(emptyModal.value)\r\n          showEmptyModal.value = false\r\n          await nextTick()\r\n          showModal.value = v\r\n        })\r\n      },\r\n      { immediate: true },\r\n    )\r\n\r\n    async function hideFromInner() {\r\n      if (props.beforeCancel) {\r\n        await props.beforeCancel()\r\n      }\r\n      showModal.value = false\r\n      showMask.value = false\r\n    }\r\n\r\n    useEscStack(\r\n      showContainer,\r\n      () => {\r\n        void hideFromInner()\r\n      },\r\n      () => props.zIndex || get(),\r\n    )\r\n\r\n    function renderLoading() {\r\n      return (\r\n        <Loading\r\n          {...{\r\n            ...props.loading,\r\n            show: props.loading?.show,\r\n            transitionName: 'w-fade-white',\r\n            class: 'w-modal-loading',\r\n            style: { 'z-index': zIndex.value },\r\n          }}\r\n        />\r\n      )\r\n    }\r\n\r\n    function onStartDrag(ev: MouseEvent): void {\r\n      let offsetLeft = 0\r\n      let offsetTop = 0\r\n      if (modal.value) {\r\n        offsetLeft = modal.value.offsetLeft\r\n        offsetTop = modal.value.offsetTop\r\n        setStyle(modal.value, { position: 'absolute' })\r\n        setStyle(modal.value, {\r\n          left: offsetLeft + 'px',\r\n          top: offsetTop + 'px',\r\n          margin: 0,\r\n        })\r\n      }\r\n      ev.preventDefault()\r\n      ev.stopImmediatePropagation()\r\n      const disX = ev.clientX - offsetLeft\r\n      const disY = ev.clientY - offsetTop\r\n      const { inner } = getWindowSize()\r\n      document.onmousemove = function (e: MouseEvent) {\r\n        e.preventDefault()\r\n        e.stopImmediatePropagation()\r\n        let x = e.clientX\r\n        let y = e.clientY\r\n        if (x < 0) x = 0\r\n        else if (x > inner.width) x = inner.width\r\n        if (y < 0) y = 0\r\n        else if (y > inner.height) y = inner.height\r\n        pos.x = x - disX\r\n        pos.y = y - disY\r\n        document.onmouseup = function () {\r\n          document.onmousemove = null\r\n        }\r\n      }\r\n    }\r\n\r\n    return () => (\r\n      <>\r\n        {ctx.slots.trigger?.({\r\n          show: () => {\r\n            showContainer.value = true\r\n            showMask.value = true\r\n          },\r\n          hide: hideFromInner,\r\n        })}\r\n        <Mask\r\n          show={!!cfg.value.hasMask && showMask.value}\r\n          zIndex={(props.zIndex || zIndex.value) - 1}\r\n          to={props.to}\r\n          class=\"w-mask--modal\"\r\n          onUpdate:show={(v: boolean) => {\r\n            ctx.emit('update:show', v)\r\n          }}\r\n        />\r\n        {showContainer.value && (\r\n          <Teleport to={props.to}>\r\n            <div\r\n              class=\"w-modal-container\"\r\n              style={{ zIndex: props.zIndex || zIndex.value }}\r\n              onClick={() => {\r\n                if (cfg.value.canCloseByClickSelf) hideFromInner()\r\n              }}>\r\n              {showEmptyModal.value ? (\r\n                <div {...modalOptions.value} ref=\"emodal\"></div>\r\n              ) : null}\r\n              <Transition\r\n                name=\"w-scale\"\r\n                onBeforeEnter={(el) => {\r\n                  ctx.emit('before-enter', el as HTMLElement)\r\n                }}\r\n                onEnter={(el) => {\r\n                  ctx.emit('enter', el as HTMLElement)\r\n                }}\r\n                onAfterEnter={(el) => {\r\n                  ctx.emit('after-enter', el as HTMLElement)\r\n                }}\r\n                onBeforeLeave={(el) => {\r\n                  pinTriggerForLeave(\r\n                    props.zIndex || zIndex.value,\r\n                    el as HTMLElement,\r\n                  )\r\n                }}\r\n                onAfterLeave={() => {\r\n                  showContainer.value = false\r\n                  ctx.emit('after-leave')\r\n                  ctx.emit('update:show', false)\r\n                  nextTick(() => unpinTrigger())\r\n                }}>\r\n                {showModal.value && (\r\n                  <div {...modalOptions.value} ref=\"modal\">\r\n                    <Close class=\"w-modal-close\" onClick={hideFromInner} />\r\n                    {hasHeader.value ? (\r\n                      <div class=\"w-modal-header\">\r\n                        {ctx.slots.title?.() || (\r\n                          <span class=\"w-modal-title\">{props.title}</span>\r\n                        )}\r\n                        <span\r\n                          class=\"w-modal-dragger\"\r\n                          onMousedown={onStartDrag}></span>\r\n                      </div>\r\n                    ) : null}\r\n                    <div class=\"w-modal-body\">\r\n                      {ctx.slots.default?.({ hide: hideFromInner })}\r\n                    </div>\r\n                    {cfg.value.hasFooter\r\n                      ? ctx.slots.footer?.({ hide: hideFromInner }) || (\r\n                          <div class=\"w-modal-footer\">\r\n                            <div>\r\n                              {ctx.slots['footer-prepend']?.({\r\n                                hide: hideFromInner,\r\n                              })}\r\n                            </div>\r\n                            <div>\r\n                              <Btn\r\n                                onClick={() => {\r\n                                  hideFromInner()\r\n                                  ctx.emit('after-cancel')\r\n                                }}>\r\n                                {resolvedCancelText.value}\r\n                              </Btn>\r\n                              <Btn\r\n                                disabled={props.loading?.show}\r\n                                type=\"primary\"\r\n                                onClick={() => {\r\n                                  ctx.emit('after-ok', {\r\n                                    hide: hideFromInner,\r\n                                  })\r\n                                }}>\r\n                                {resolvedOkText.value}\r\n                              </Btn>\r\n                            </div>\r\n                          </div>\r\n                        )\r\n                      : null}\r\n                    {renderLoading()}\r\n                  </div>\r\n                )}\r\n              </Transition>\r\n            </div>\r\n          </Teleport>\r\n        )}\r\n      </>\r\n    )\r\n  },\r\n})\r\n"],"mappings":"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"}
+{"version":3,"file":"Modal.js","names":["Teleport","Transition","ref","computed","reactive","watch","defineComponent","nextTick","useTemplateRef","mergeProps","createVNode","_createVNode","Fragment","_Fragment","_mergeProps","Mask","Close","Btn","Loading","useGlobalZIndex","useComponentConfig","useScaleFromPoint","captureScaleFromPoint","useEscStack","usePointerDrag","getWindowSize","setStyle","propSizeToCssVars","toCssVarsStyle","useUII18n","MODAL_FALLBACK","inheritAttrs","name","components","props","show","type","Boolean","default","title","String","Object","Array","width","undefined","maxWidth","height","minHeight","maxHeight","okText","cancelText","beforeCancel","Function","hasMask","hasFooter","zIndex","Number","canCloseByClickSelf","to","HTMLElement","document","body","loading","size","cssVars","emits","_b","_el","enter","after-leave","_opts","after-cancel","setup","ctx","cfg","modal","emptyModal","showMask","showContainer","showEmptyModal","showModal","add","get","transformOrigin","measureOrigin","morphCss","fromTrigger","pinTriggerForLeave","unpinTrigger","pos","x","y","t","hasHeader","slots","resolvedOkText","value","resolvedCancelText","modalOptions","attrs","class","style","left","top","position","onClick","e","stopPropagation","v","immediate","force","setTimeout","hideFromInner","renderLoading","transitionName","onMouseDown","onStartDrag","events","bind","onStart","ev","offsetLeft","offsetTop","margin","preventDefault","stopImmediatePropagation","data","disX","clientX","disY","clientY","inner","onMove","trigger","hide","emit","el","onAfterLeave","footer"],"sources":["../../../components/modal/Modal.tsx"],"sourcesContent":["import type { PropType } from 'vue'\r\nimport {\r\n  Teleport,\r\n  Transition,\r\n  Fragment,\r\n  ref,\r\n  computed,\r\n  reactive,\r\n  watch,\r\n  defineComponent,\r\n  nextTick,\r\n  useTemplateRef,\r\n  mergeProps,\r\n} from 'vue'\r\nimport Mask from '../mask/index'\r\nimport Close from '../close/index'\r\nimport Btn from '../btn/index'\r\nimport Loading from '../loading/index'\r\nimport type { LoadingComponentProps } from '../loading/type'\r\nimport useGlobalZIndex from '../../use/useGlobalZIndex'\r\nimport useComponentConfig from '../../use/useComponentConfig'\r\nimport useScaleFromPoint, {\r\n  captureScaleFromPoint,\r\n} from '../../use/useScaleFromPoint'\r\nimport useEscStack from '../../use/useEscStack'\r\nimport usePointerDrag from '../../use/usePointerDrag'\r\nimport { getWindowSize, setStyle, propSizeToCssVars, toCssVarsStyle, type CssVars } from '../../util'\r\nimport { useUII18n } from '../../use/useUII18n'\r\nimport { MODAL_FALLBACK } from './config'\r\n\r\nexport type { ModalGlobalConfig } from './config'\r\nexport { MODAL_FALLBACK } from './config'\r\n\r\ninterface IMethods {\r\n  hide: () => void\r\n}\r\n\r\nexport default defineComponent({\r\n  inheritAttrs: false,\r\n  name: 'Modal',\r\n  components: { Mask, Close, Btn, Loading },\r\n  props: {\r\n    show: { type: Boolean, default: false },\r\n    title: [String, Object, Array],\r\n    width: { type: String, default: undefined },\r\n    maxWidth: { type: String, default: undefined },\r\n    height: { type: String, default: undefined },\r\n    minHeight: { type: String, default: undefined },\r\n    maxHeight: { type: String, default: undefined },\r\n    okText: { type: String, default: undefined },\r\n    cancelText: { type: String, default: undefined },\r\n    beforeCancel: Function,\r\n    hasMask: { type: Boolean, default: undefined },\r\n    hasFooter: { type: Boolean, default: undefined },\r\n    zIndex: Number,\r\n    canCloseByClickSelf: { type: Boolean, default: undefined },\r\n    to: {\r\n      type: HTMLElement,\r\n      default: () => document.body,\r\n    },\r\n    type: {\r\n      type: String as PropType<'white' | 'black'>,\r\n      default: undefined,\r\n    },\r\n    loading: {\r\n      type: Object as PropType<LoadingComponentProps>,\r\n      default: () => ({ show: false }),\r\n    },\r\n    /** 尺度核 → `--w-prop-modal-size`（标题 / header / Close / Btn / Loading） */\r\n    size: { type: Number, default: undefined },\r\n    /** 实例 CSS 变量 */\r\n    cssVars: { type: Object as PropType<CssVars>, default: undefined },\r\n  },\r\n  emits: {\r\n    'update:show': (_b: boolean) => true,\r\n    'before-enter': (_el: HTMLElement) => true,\r\n    enter: (_el: HTMLElement) => true,\r\n    'after-enter': (_el: HTMLElement) => true,\r\n    'after-leave': () => true,\r\n    'after-ok': (_opts: IMethods) => true,\r\n    'after-cancel': () => true,\r\n  },\r\n  setup(props, ctx) {\r\n    const cfg = useComponentConfig('Modal', props, MODAL_FALLBACK)\r\n    const modal = useTemplateRef<HTMLElement>('modal')\r\n    const emptyModal = useTemplateRef<HTMLElement>('emodal')\r\n    const showMask = ref(false)\r\n    const showContainer = ref(false)\r\n    const showEmptyModal = ref(false)\r\n    const showModal = ref(false)\r\n    const { zIndex, add, get } = useGlobalZIndex()\r\n    const {\r\n      transformOrigin,\r\n      measureOrigin,\r\n      morphCss,\r\n      fromTrigger,\r\n      pinTriggerForLeave,\r\n      unpinTrigger,\r\n    } = useScaleFromPoint('modal')\r\n    const pos = reactive<{ x?: number; y?: number }>({\r\n      x: undefined,\r\n      y: undefined,\r\n    })\r\n    const { t } = useUII18n()\r\n\r\n    const hasHeader = computed(() => !!(props.title || ctx.slots.title?.()))\r\n\r\n    const resolvedOkText = computed(() => cfg.value.okText || t('modal.ok'))\r\n    const resolvedCancelText = computed(\r\n      () => cfg.value.cancelText || t('modal.cancel'),\r\n    )\r\n\r\n    const modalOptions = computed(() =>\r\n      mergeProps(ctx.attrs, {\r\n        class: [\r\n          'w-modal',\r\n          `w-modal--${cfg.value.type}`,\r\n          fromTrigger.value && 'w-scale-from-trigger',\r\n        ],\r\n        style: {\r\n          ...toCssVarsStyle({\r\n            ...propSizeToCssVars('modal', cfg.value.size),\r\n            ...props.cssVars,\r\n          }),\r\n          '--w-modal-width': cfg.value.width,\r\n          '--w-modal-max-width': cfg.value.maxWidth,\r\n          '--w-modal-height': cfg.value.height,\r\n          '--w-modal-min-height': cfg.value.minHeight,\r\n          '--w-modal-max-height': cfg.value.maxHeight,\r\n          transformOrigin: `${transformOrigin.x}px ${transformOrigin.y}px`,\r\n          ...morphCss.value,\r\n          left: pos.x === undefined ? '' : `${pos.x}px`,\r\n          top: pos.y === undefined ? '' : `${pos.y}px`,\r\n          position: pos.x === undefined ? '' : 'absolute',\r\n        },\r\n        onClick: (e: MouseEvent) => {\r\n          e.stopPropagation()\r\n        },\r\n      }),\r\n    )\r\n\r\n    watch(\r\n      () => props.show,\r\n      (v) => {\r\n        if (v) {\r\n          showContainer.value = v\r\n        } else {\r\n          showModal.value = v\r\n          showMask.value = v\r\n        }\r\n      },\r\n      { immediate: true },\r\n    )\r\n\r\n    watch(\r\n      showContainer,\r\n      (v) => {\r\n        if (v) {\r\n          captureScaleFromPoint(null, { force: true })\r\n          add()\r\n        }\r\n        setTimeout(async () => {\r\n          if (!v) return\r\n          showMask.value = v\r\n          showEmptyModal.value = v\r\n          await nextTick()\r\n          measureOrigin(emptyModal.value)\r\n          showEmptyModal.value = false\r\n          await nextTick()\r\n          showModal.value = v\r\n        })\r\n      },\r\n      { immediate: true },\r\n    )\r\n\r\n    async function hideFromInner() {\r\n      if (props.beforeCancel) {\r\n        await props.beforeCancel()\r\n      }\r\n      showModal.value = false\r\n      showMask.value = false\r\n    }\r\n\r\n    useEscStack(\r\n      showContainer,\r\n      () => {\r\n        void hideFromInner()\r\n      },\r\n      () => props.zIndex || get(),\r\n    )\r\n\r\n    function renderLoading() {\r\n      return (\r\n        <Loading\r\n          {...{\r\n            ...props.loading,\r\n            show: props.loading?.show,\r\n            transitionName: 'w-fade-white',\r\n            class: 'w-modal-loading',\r\n            style: { 'z-index': zIndex.value },\r\n          }}\r\n        />\r\n      )\r\n    }\r\n\r\n    const { onMouseDown: onStartDrag } = usePointerDrag({\r\n      events: 'mouse',\r\n      bind: 'document',\r\n      onStart: (ev, ctx) => {\r\n        let offsetLeft = 0\r\n        let offsetTop = 0\r\n        if (modal.value) {\r\n          offsetLeft = modal.value.offsetLeft\r\n          offsetTop = modal.value.offsetTop\r\n          setStyle(modal.value, { position: 'absolute' })\r\n          setStyle(modal.value, {\r\n            left: offsetLeft + 'px',\r\n            top: offsetTop + 'px',\r\n            margin: 0,\r\n          })\r\n        }\r\n        ev.preventDefault()\r\n        ev.stopImmediatePropagation()\r\n        ctx.data.disX = ev.clientX - offsetLeft\r\n        ctx.data.disY = ev.clientY - offsetTop\r\n        ctx.data.inner = getWindowSize().inner\r\n      },\r\n      onMove: (e, ctx) => {\r\n        e.preventDefault()\r\n        e.stopImmediatePropagation()\r\n        const disX = ctx.data.disX as number\r\n        const disY = ctx.data.disY as number\r\n        const inner = ctx.data.inner as { width: number; height: number }\r\n        let x = e.clientX\r\n        let y = e.clientY\r\n        if (x < 0) x = 0\r\n        else if (x > inner.width) x = inner.width\r\n        if (y < 0) y = 0\r\n        else if (y > inner.height) y = inner.height\r\n        pos.x = x - disX\r\n        pos.y = y - disY\r\n      },\r\n    })\r\n\r\n    return () => (\r\n      <>\r\n        {ctx.slots.trigger?.({\r\n          show: () => {\r\n            showContainer.value = true\r\n            showMask.value = true\r\n          },\r\n          hide: hideFromInner,\r\n        })}\r\n        <Mask\r\n          show={!!cfg.value.hasMask && showMask.value}\r\n          zIndex={(props.zIndex || zIndex.value) - 1}\r\n          to={props.to}\r\n          class=\"w-mask--modal\"\r\n          onUpdate:show={(v: boolean) => {\r\n            ctx.emit('update:show', v)\r\n          }}\r\n        />\r\n        {showContainer.value && (\r\n          <Teleport to={props.to}>\r\n            <div\r\n              class=\"w-modal-container\"\r\n              style={{ zIndex: props.zIndex || zIndex.value }}\r\n              onClick={() => {\r\n                if (cfg.value.canCloseByClickSelf) hideFromInner()\r\n              }}>\r\n              {showEmptyModal.value ? (\r\n                <div {...modalOptions.value} ref=\"emodal\"></div>\r\n              ) : null}\r\n              <Transition\r\n                name=\"w-scale\"\r\n                onBeforeEnter={(el) => {\r\n                  ctx.emit('before-enter', el as HTMLElement)\r\n                }}\r\n                onEnter={(el) => {\r\n                  ctx.emit('enter', el as HTMLElement)\r\n                }}\r\n                onAfterEnter={(el) => {\r\n                  ctx.emit('after-enter', el as HTMLElement)\r\n                }}\r\n                onBeforeLeave={(el) => {\r\n                  pinTriggerForLeave(\r\n                    props.zIndex || zIndex.value,\r\n                    el as HTMLElement,\r\n                  )\r\n                }}\r\n                onAfterLeave={() => {\r\n                  showContainer.value = false\r\n                  ctx.emit('after-leave')\r\n                  ctx.emit('update:show', false)\r\n                  nextTick(() => unpinTrigger())\r\n                }}>\r\n                {showModal.value && (\r\n                  <div {...modalOptions.value} ref=\"modal\">\r\n                    <Close class=\"w-modal-close\" onClick={hideFromInner} />\r\n                    {hasHeader.value ? (\r\n                      <div class=\"w-modal-header\">\r\n                        {ctx.slots.title?.() || (\r\n                          <span class=\"w-modal-title\">{props.title}</span>\r\n                        )}\r\n                        <span\r\n                          class=\"w-modal-dragger\"\r\n                          onMousedown={onStartDrag}></span>\r\n                      </div>\r\n                    ) : null}\r\n                    <div class=\"w-modal-body\">\r\n                      {ctx.slots.default?.({ hide: hideFromInner })}\r\n                    </div>\r\n                    {cfg.value.hasFooter\r\n                      ? ctx.slots.footer?.({ hide: hideFromInner }) || (\r\n                          <div class=\"w-modal-footer\">\r\n                            <div>\r\n                              {ctx.slots['footer-prepend']?.({\r\n                                hide: hideFromInner,\r\n                              })}\r\n                            </div>\r\n                            <div>\r\n                              <Btn\r\n                                onClick={() => {\r\n                                  hideFromInner()\r\n                                  ctx.emit('after-cancel')\r\n                                }}>\r\n                                {resolvedCancelText.value}\r\n                              </Btn>\r\n                              <Btn\r\n                                disabled={props.loading?.show}\r\n                                type=\"primary\"\r\n                                onClick={() => {\r\n                                  ctx.emit('after-ok', {\r\n                                    hide: hideFromInner,\r\n                                  })\r\n                                }}>\r\n                                {resolvedOkText.value}\r\n                              </Btn>\r\n                            </div>\r\n                          </div>\r\n                        )\r\n                      : null}\r\n                    {renderLoading()}\r\n                  </div>\r\n                )}\r\n              </Transition>\r\n            </div>\r\n          </Teleport>\r\n        )}\r\n      </>\r\n    )\r\n  },\r\n})\r\n"],"mappings":"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"}

package/dist/components/notice/src/_util/index.d.ts

@@ -1,4 +1,4 @@
-import { NoticePlacementType } from '../types';
+import { NoticePlacementType } from '../../types';
 declare function createNoticeWrapper(placement: NoticePlacementType | string, options?: {
     offset?: number | string;
     zIndex?: number;

package/dist/components/notice/src/_util/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../components/notice/src/_util/index.ts"],"sourcesContent":["import useGlobalZIndex from '../../../../use/useGlobalZIndex'\r\nimport type { NoticePlacementType } from '../types'\r\n\r\ninterface WrapperType {\r\n  [k: string]: HTMLElement\r\n}\r\n\r\nlet WRAPPERS: WrapperType = {}\r\n\r\nfunction normalizeOffset(offset?: number | string) {\r\n  if (offset === undefined || offset === null || offset === '') return undefined\r\n  return typeof offset === 'number' ? `${offset}px` : String(offset)\r\n}\r\n\r\nfunction applyWrapperStyle(\r\n  el: HTMLElement,\r\n  options?: {\r\n    offset?: number | string\r\n    zIndex?: number\r\n    wrapperClass?: any\r\n    wrapperStyle?: Record<string, string>\r\n  },\r\n) {\r\n  const { offset, zIndex, wrapperClass, wrapperStyle } = options || {}\r\n\r\n  if (wrapperClass) {\r\n    const extra = Array.isArray(wrapperClass)\r\n      ? wrapperClass.filter(Boolean).join(' ')\r\n      : typeof wrapperClass === 'string'\r\n        ? wrapperClass\r\n        : Object.keys(wrapperClass)\r\n            .filter((k) => (wrapperClass as Record<string, boolean>)[k])\r\n            .join(' ')\r\n    const base = el.getAttribute('data-base-class') || el.className\r\n    if (!el.getAttribute('data-base-class')) {\r\n      el.setAttribute('data-base-class', el.className)\r\n    }\r\n    el.className = `${el.getAttribute('data-base-class')} ${extra}`.trim()\r\n  }\r\n\r\n  if (wrapperStyle) {\r\n    Object.assign(el.style, wrapperStyle)\r\n  }\r\n\r\n  const offsetValue = normalizeOffset(offset)\r\n  if (offsetValue) {\r\n    el.style.setProperty('--w-notice-offset', offsetValue)\r\n  }\r\n\r\n  if (typeof zIndex === 'number') {\r\n    el.style.zIndex = String(zIndex)\r\n  }\r\n}\r\n\r\nfunction createNoticeWrapper(\r\n  placement: NoticePlacementType | string,\r\n  options?: {\r\n    offset?: number | string\r\n    zIndex?: number\r\n    wrapperClass?: any\r\n    wrapperStyle?: Record<string, string>\r\n  },\r\n) {\r\n  const { zIndex, add } = useGlobalZIndex()\r\n\r\n  if (placement in WRAPPERS) {\r\n    const el = WRAPPERS[placement]\r\n    el.style.zIndex =\r\n      options?.zIndex != null ? String(options.zIndex) : String(add())\r\n    applyWrapperStyle(el, options)\r\n    return el\r\n  }\r\n\r\n  const el = document.createElement('div')\r\n  const id = `notice_container_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`\r\n  const klass = `w-notice w-notice--${placement}`\r\n  el.id = id\r\n  el.className = klass\r\n  el.setAttribute('data-base-class', klass)\r\n  el.style.zIndex =\r\n    options?.zIndex != null ? String(options.zIndex) : String(zIndex.value)\r\n  applyWrapperStyle(el, options)\r\n  WRAPPERS[placement] = el\r\n  document.body.appendChild(el)\r\n  return el\r\n}\r\n\r\nfunction removeNoticeWrapper(el: HTMLElement) {\r\n  let p = ''\r\n  for (const pla in WRAPPERS) {\r\n    if (WRAPPERS[pla] === el) {\r\n      p = pla\r\n    }\r\n  }\r\n  if (p) {\r\n    if (el.parentNode) {\r\n      document.body.removeChild(el)\r\n    }\r\n    delete WRAPPERS[p]\r\n  }\r\n}\r\n\r\nfunction clearNoticeWrapper() {\r\n  for (const p in WRAPPERS) {\r\n    if (WRAPPERS[p]) {\r\n      if (WRAPPERS[p].parentNode) {\r\n        document.body.removeChild(WRAPPERS[p])\r\n      }\r\n      delete WRAPPERS[p]\r\n    }\r\n  }\r\n}\r\n\r\nfunction getWrapperCount(placement?: string) {\r\n  if (placement) {\r\n    const el = WRAPPERS[placement]\r\n    return el ? el.childElementCount : 0\r\n  }\r\n  return Object.values(WRAPPERS).reduce((n, el) => n + el.childElementCount, 0)\r\n}\r\n\r\nexport {\r\n  createNoticeWrapper,\r\n  removeNoticeWrapper,\r\n  clearNoticeWrapper,\r\n  getWrapperCount,\r\n}\r\n"],"mappings":";;AAOA,IAAI,WAAwB,CAAC;AAE7B,SAAS,gBAAgB,QAA0B;CACjD,IAAI,WAAW,KAAA,KAAa,WAAW,QAAQ,WAAW,IAAI,OAAO,KAAA;CACrE,OAAO,OAAO,WAAW,WAAW,GAAG,OAAO,MAAM,OAAO,MAAM;AACnE;AAEA,SAAS,kBACP,IACA,SAMA;CACA,MAAM,EAAE,QAAQ,QAAQ,cAAc,iBAAiB,WAAW,CAAC;CAEnE,IAAI,cAAc;EAChB,MAAM,QAAQ,MAAM,QAAQ,YAAY,IACpC,aAAa,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,IACrC,OAAO,iBAAiB,WACtB,eACA,OAAO,KAAK,YAAY,CAAC,CACtB,QAAQ,MAAO,aAAyC,EAAE,CAAC,CAC3D,KAAK,GAAG;EACJ,GAAG,aAAa,iBAAiB,KAAK,GAAG;EACtD,IAAI,CAAC,GAAG,aAAa,iBAAiB,GACpC,GAAG,aAAa,mBAAmB,GAAG,SAAS;EAEjD,GAAG,YAAY,GAAG,GAAG,aAAa,iBAAiB,EAAE,GAAG,QAAQ,KAAK;CACvE;CAEA,IAAI,cACF,OAAO,OAAO,GAAG,OAAO,YAAY;CAGtC,MAAM,cAAc,gBAAgB,MAAM;CAC1C,IAAI,aACF,GAAG,MAAM,YAAY,qBAAqB,WAAW;CAGvD,IAAI,OAAO,WAAW,UACpB,GAAG,MAAM,SAAS,OAAO,MAAM;AAEnC;AAEA,SAAS,oBACP,WACA,SAMA;CACA,MAAM,EAAE,QAAQ,QAAQ,gBAAgB;CAExC,IAAI,aAAa,UAAU;EACzB,MAAM,KAAK,SAAS;EACpB,GAAG,MAAM,SACP,SAAS,UAAU,OAAO,OAAO,QAAQ,MAAM,IAAI,OAAO,IAAI,CAAC;EACjE,kBAAkB,IAAI,OAAO;EAC7B,OAAO;CACT;CAEA,MAAM,KAAK,SAAS,cAAc,KAAK;CACvC,MAAM,KAAK,oBAAoB,KAAK,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC;CAClF,MAAM,QAAQ,sBAAsB;CACpC,GAAG,KAAK;CACR,GAAG,YAAY;CACf,GAAG,aAAa,mBAAmB,KAAK;CACxC,GAAG,MAAM,SACP,SAAS,UAAU,OAAO,OAAO,QAAQ,MAAM,IAAI,OAAO,OAAO,KAAK;CACxE,kBAAkB,IAAI,OAAO;CAC7B,SAAS,aAAa;CACtB,SAAS,KAAK,YAAY,EAAE;CAC5B,OAAO;AACT;AAiBA,SAAS,qBAAqB;CAC5B,KAAK,MAAM,KAAK,UACd,IAAI,SAAS,IAAI;EACf,IAAI,SAAS,EAAE,CAAC,YACd,SAAS,KAAK,YAAY,SAAS,EAAE;EAEvC,OAAO,SAAS;CAClB;AAEJ"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../components/notice/src/_util/index.ts"],"sourcesContent":["import useGlobalZIndex from '../../../../use/useGlobalZIndex'\r\nimport type { NoticePlacementType } from '../../types'\r\n\r\ninterface WrapperType {\r\n  [k: string]: HTMLElement\r\n}\r\n\r\nlet WRAPPERS: WrapperType = {}\r\n\r\nfunction normalizeOffset(offset?: number | string) {\r\n  if (offset === undefined || offset === null || offset === '') return undefined\r\n  return typeof offset === 'number' ? `${offset}px` : String(offset)\r\n}\r\n\r\nfunction applyWrapperStyle(\r\n  el: HTMLElement,\r\n  options?: {\r\n    offset?: number | string\r\n    zIndex?: number\r\n    wrapperClass?: any\r\n    wrapperStyle?: Record<string, string>\r\n  },\r\n) {\r\n  const { offset, zIndex, wrapperClass, wrapperStyle } = options || {}\r\n\r\n  if (wrapperClass) {\r\n    const extra = Array.isArray(wrapperClass)\r\n      ? wrapperClass.filter(Boolean).join(' ')\r\n      : typeof wrapperClass === 'string'\r\n        ? wrapperClass\r\n        : Object.keys(wrapperClass)\r\n            .filter((k) => (wrapperClass as Record<string, boolean>)[k])\r\n            .join(' ')\r\n    const base = el.getAttribute('data-base-class') || el.className\r\n    if (!el.getAttribute('data-base-class')) {\r\n      el.setAttribute('data-base-class', el.className)\r\n    }\r\n    el.className = `${el.getAttribute('data-base-class')} ${extra}`.trim()\r\n  }\r\n\r\n  if (wrapperStyle) {\r\n    Object.assign(el.style, wrapperStyle)\r\n  }\r\n\r\n  const offsetValue = normalizeOffset(offset)\r\n  if (offsetValue) {\r\n    el.style.setProperty('--w-notice-offset', offsetValue)\r\n  }\r\n\r\n  if (typeof zIndex === 'number') {\r\n    el.style.zIndex = String(zIndex)\r\n  }\r\n}\r\n\r\nfunction createNoticeWrapper(\r\n  placement: NoticePlacementType | string,\r\n  options?: {\r\n    offset?: number | string\r\n    zIndex?: number\r\n    wrapperClass?: any\r\n    wrapperStyle?: Record<string, string>\r\n  },\r\n) {\r\n  const { zIndex, add } = useGlobalZIndex()\r\n\r\n  if (placement in WRAPPERS) {\r\n    const el = WRAPPERS[placement]\r\n    el.style.zIndex =\r\n      options?.zIndex != null ? String(options.zIndex) : String(add())\r\n    applyWrapperStyle(el, options)\r\n    return el\r\n  }\r\n\r\n  const el = document.createElement('div')\r\n  const id = `notice_container_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`\r\n  const klass = `w-notice w-notice--${placement}`\r\n  el.id = id\r\n  el.className = klass\r\n  el.setAttribute('data-base-class', klass)\r\n  el.style.zIndex =\r\n    options?.zIndex != null ? String(options.zIndex) : String(zIndex.value)\r\n  applyWrapperStyle(el, options)\r\n  WRAPPERS[placement] = el\r\n  document.body.appendChild(el)\r\n  return el\r\n}\r\n\r\nfunction removeNoticeWrapper(el: HTMLElement) {\r\n  let p = ''\r\n  for (const pla in WRAPPERS) {\r\n    if (WRAPPERS[pla] === el) {\r\n      p = pla\r\n    }\r\n  }\r\n  if (p) {\r\n    if (el.parentNode) {\r\n      document.body.removeChild(el)\r\n    }\r\n    delete WRAPPERS[p]\r\n  }\r\n}\r\n\r\nfunction clearNoticeWrapper() {\r\n  for (const p in WRAPPERS) {\r\n    if (WRAPPERS[p]) {\r\n      if (WRAPPERS[p].parentNode) {\r\n        document.body.removeChild(WRAPPERS[p])\r\n      }\r\n      delete WRAPPERS[p]\r\n    }\r\n  }\r\n}\r\n\r\nfunction getWrapperCount(placement?: string) {\r\n  if (placement) {\r\n    const el = WRAPPERS[placement]\r\n    return el ? el.childElementCount : 0\r\n  }\r\n  return Object.values(WRAPPERS).reduce((n, el) => n + el.childElementCount, 0)\r\n}\r\n\r\nexport {\r\n  createNoticeWrapper,\r\n  removeNoticeWrapper,\r\n  clearNoticeWrapper,\r\n  getWrapperCount,\r\n}\r\n"],"mappings":";;AAOA,IAAI,WAAwB,CAAC;AAE7B,SAAS,gBAAgB,QAA0B;CACjD,IAAI,WAAW,KAAA,KAAa,WAAW,QAAQ,WAAW,IAAI,OAAO,KAAA;CACrE,OAAO,OAAO,WAAW,WAAW,GAAG,OAAO,MAAM,OAAO,MAAM;AACnE;AAEA,SAAS,kBACP,IACA,SAMA;CACA,MAAM,EAAE,QAAQ,QAAQ,cAAc,iBAAiB,WAAW,CAAC;CAEnE,IAAI,cAAc;EAChB,MAAM,QAAQ,MAAM,QAAQ,YAAY,IACpC,aAAa,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,IACrC,OAAO,iBAAiB,WACtB,eACA,OAAO,KAAK,YAAY,CAAC,CACtB,QAAQ,MAAO,aAAyC,EAAE,CAAC,CAC3D,KAAK,GAAG;EACJ,GAAG,aAAa,iBAAiB,KAAK,GAAG;EACtD,IAAI,CAAC,GAAG,aAAa,iBAAiB,GACpC,GAAG,aAAa,mBAAmB,GAAG,SAAS;EAEjD,GAAG,YAAY,GAAG,GAAG,aAAa,iBAAiB,EAAE,GAAG,QAAQ,KAAK;CACvE;CAEA,IAAI,cACF,OAAO,OAAO,GAAG,OAAO,YAAY;CAGtC,MAAM,cAAc,gBAAgB,MAAM;CAC1C,IAAI,aACF,GAAG,MAAM,YAAY,qBAAqB,WAAW;CAGvD,IAAI,OAAO,WAAW,UACpB,GAAG,MAAM,SAAS,OAAO,MAAM;AAEnC;AAEA,SAAS,oBACP,WACA,SAMA;CACA,MAAM,EAAE,QAAQ,QAAQ,gBAAgB;CAExC,IAAI,aAAa,UAAU;EACzB,MAAM,KAAK,SAAS;EACpB,GAAG,MAAM,SACP,SAAS,UAAU,OAAO,OAAO,QAAQ,MAAM,IAAI,OAAO,IAAI,CAAC;EACjE,kBAAkB,IAAI,OAAO;EAC7B,OAAO;CACT;CAEA,MAAM,KAAK,SAAS,cAAc,KAAK;CACvC,MAAM,KAAK,oBAAoB,KAAK,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC;CAClF,MAAM,QAAQ,sBAAsB;CACpC,GAAG,KAAK;CACR,GAAG,YAAY;CACf,GAAG,aAAa,mBAAmB,KAAK;CACxC,GAAG,MAAM,SACP,SAAS,UAAU,OAAO,OAAO,QAAQ,MAAM,IAAI,OAAO,OAAO,KAAK;CACxE,kBAAkB,IAAI,OAAO;CAC7B,SAAS,aAAa;CACtB,SAAS,KAAK,YAAY,EAAE;CAC5B,OAAO;AACT;AAiBA,SAAS,qBAAqB;CAC5B,KAAK,MAAM,KAAK,UACd,IAAI,SAAS,IAAI;EACf,IAAI,SAAS,EAAE,CAAC,YACd,SAAS,KAAK,YAAY,SAAS,EAAE;EAEvC,OAAO,SAAS;CAClB;AAEJ"}

package/dist/components/number/Number copy.d.ts

@@ -45,9 +45,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
 }>, {
     block: boolean;
     disabled: boolean;
+    step: number;
     readonly: boolean;
     hasBtn: boolean;
-    step: number;
 }, {}, {
     Write: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         modelValue: {

package/dist/components/number/Number.d.ts

@@ -112,10 +112,10 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     color: string;
     cssVars: CssVars;
     disabled: boolean;
+    step: number;
     readonly: boolean;
     hasBtn: boolean;
     allowDecimal: boolean;
-    step: number;
 }, {}, {
     Write: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         modelValue: {

package/dist/components/pagination/src/Pagination.d.ts

@@ -511,8 +511,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         manual: boolean;
         exclude: HTMLElement[];
         hasMask: boolean;
-        clearable: boolean;
         placeholder: string;
+        clearable: boolean;
         virtual: boolean;
         virtualThreshold: number;
         itemHeight: number;
@@ -820,7 +820,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         }, {}, {}, {
             clickOutside: import('vue').ObjectDirective<any, any, string, any>;
         }, string, import('vue').ComponentProvideOptions, true, {}, any>;
-        Virtual: import('../..').VirtualComponent;
+        Virtual: new <T = any>() => import('../..').VirtualListMethods & {
+            $props: import('../..').VirtualJSXProps<T>;
+        };
         Close: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
             name: {
                 type: StringConstructor;
@@ -1118,7 +1120,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             tag: string;
         }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
-    Btn: import('../..').BtnComponent;
+    Btn: import('vue').DefineComponent<import('../..').BtnJSXProps>;
     Tooltip: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         trigger: {
             default: string;
@@ -1758,10 +1760,10 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         color: string;
         cssVars: CssVars;
         disabled: boolean;
+        step: number;
         readonly: boolean;
         hasBtn: boolean;
         allowDecimal: boolean;
-        step: number;
     }, {}, {
         Write: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
             modelValue: {

package/dist/components/picture/Picture.d.ts

@@ -1,3 +1,4 @@
+import { DefineComponent } from 'vue';
 import { CssVars } from '../../util';
 export type { PictureGlobalConfig } from './config';
 export { PICTURE_FALLBACK, normalizePictureImages } from './config';
@@ -9,10 +10,7 @@ export type PictureProps = {
     cssVars?: CssVars;
 };
 export type PictureJSXProps = PictureProps & Omit<JSX.IntrinsicElements['div'], keyof PictureProps | 'ref'>;
-export type PictureComponent = {
-    new (): {
-        $props: PictureJSXProps;
-    };
-};
-declare const _default: PictureComponent;
-export default _default;
+/** 断言为 DefineComponent，hover / 补全直接看到 PictureJSXProps（勿再包 XxxComponent 别名） */
+declare const Picture: DefineComponent<PictureJSXProps>;
+export type PictureInstance = InstanceType<typeof Picture>;
+export default Picture;

package/dist/components/picture/Picture.js

@@ -7,7 +7,7 @@ import Mask_default from "../mask/Mask.js";
 import Close_default from "../close/Close.js";
 import { useUII18n } from "../../use/useUII18n.js";
 import Toggle_default from "../toggle/Toggle.js";
-import ImageImpl from "../image/Image.js";
+import Image from "../image/Image.js";
 import { createPictureViewport } from "../../use/usePictureViewport.js";
 import { PICTURE_FALLBACK, normalizePictureImages } from "./config.js";
 import { runPictureImgEnter } from "./pictureFlip.js";
@@ -16,11 +16,12 @@ import PictureViewport from "./PictureViewport.js";
 import { Fragment, Teleport, computed, createVNode, defineComponent, mergeProps, nextTick, onBeforeUnmount, ref, watch } from "vue";
 //#region components/picture/Picture.tsx
 var INTERACT_SAFE = ".w-picture-viewer__viewport, .w-picture-viewer__img-wrap, .w-picture-viewer__img, .w-picture-viewer__thumb, .w-picture-viewer__nav, .w-picture-viewer__close, .w-picture-viewer__thumbs, .w-picture-viewer__toolbar";
-var PictureImpl = /* @__PURE__ */ defineComponent({
+/** 断言为 DefineComponent，hover / 补全直接看到 PictureJSXProps（勿再包 XxxComponent 别名） */
+var Picture = /* @__PURE__ */ defineComponent({
 	name: "Picture",
 	inheritAttrs: false,
 	components: {
-		Image: ImageImpl,
+		Image,
 		Mask: Mask_default,
 		Toggle: Toggle_default,
 		Close: Close_default,
@@ -154,7 +155,7 @@ var PictureImpl = /* @__PURE__ */ defineComponent({
 			}, attrs);
 			const multi = images.length > 1;
 			return createVNode(Fragment, null, [
-				createVNode("div", rootProps, [images.map((src, i) => createVNode(ImageImpl, {
+				createVNode("div", rootProps, [images.map((src, i) => createVNode(Image, {
 					"key": `${src}-${i}`,
 					"class": ["w-picture__thumb", { "is-previewing": show.value && curIndex.value === i }],
 					"src": src,
@@ -249,6 +250,6 @@ var PictureImpl = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-export { PictureImpl as default };
+export { Picture as default };
 
 //# sourceMappingURL=Picture.js.map

package/dist/components/picture/Picture.js.map

@@ -1 +1 @@
-{"version":3,"file":"Picture.js","names":["Teleport","computed","defineComponent","mergeProps","nextTick","onBeforeUnmount","ref","watch","Fragment","_Fragment","createVNode","_createVNode","propSizeToCssVars","toCssVarsStyle","useComponentConfig","useEscStack","useGlobalZIndex","useUII18n","createPictureViewport","Close","Icon","Image","Mask","Toggle","normalizePictureImages","PICTURE_FALLBACK","runPictureImgEnter","PictureToolbar","PictureViewport","INTERACT_SAFE","PictureImpl","name","inheritAttrs","components","props","images","type","String","Array","default","undefined","size","Number","round","Boolean","cssVars","Object","emits","_v","show","_index","hide","setup","attrs","emit","cfg","t","zIndex","add","curIndex","alwaysOneWay","fromRect","interact","viewportApi","viewportController","stopFlip","list","v","value","reset","prepareImageChange","enableInteract","fit","playEnterFlip","Promise","r","requestAnimationFrame","el","getFlipEl","from","onEnd","openAt","i","e","target","currentTarget","getBoundingClientRect","close","onViewerClick","closest","onThumbClick","goPrev","prev","goNext","next","bindViewport","length","rootProps","class","style","multi","map","src","stopPropagation","item","use","index","onClick"],"sources":["../../../components/picture/Picture.tsx"],"sourcesContent":["import {\r\n  Teleport,\r\n  computed,\r\n  defineComponent,\r\n  mergeProps,\r\n  nextTick,\r\n  onBeforeUnmount,\r\n  ref,\r\n  watch,\r\n  type PropType,\r\n} from 'vue'\r\nimport {\r\n  propSizeToCssVars,\r\n  toCssVarsStyle,\r\n  type CssVars,\r\n} from '../../util'\r\nimport useComponentConfig from '../../use/useComponentConfig'\r\nimport useEscStack from '../../use/useEscStack'\r\nimport useGlobalZIndex from '../../use/useGlobalZIndex'\r\nimport { useUII18n } from '../../use/useUII18n'\r\nimport { createPictureViewport } from '../../use/usePictureViewport'\r\nimport Close from '../close/index'\r\nimport Icon from '../icon/index'\r\nimport Image from '../image/index'\r\nimport Mask from '../mask/index'\r\nimport Toggle from '../toggle/index'\r\nimport {\r\n  normalizePictureImages,\r\n  PICTURE_FALLBACK,\r\n} from './config'\r\nimport { runPictureImgEnter } from './pictureFlip'\r\nimport PictureToolbar from './PictureToolbar'\r\nimport PictureViewport, {\r\n  type PictureViewportMethods,\r\n} from './PictureViewport'\r\n\r\nexport type { PictureGlobalConfig } from './config'\r\nexport { PICTURE_FALLBACK, normalizePictureImages } from './config'\r\n\r\nexport type PictureProps = {\r\n  /** 图片地址：逗号分隔字符串或数组 */\r\n  images?: string | string[]\r\n  size?: number\r\n  round?: boolean | string\r\n  cssVars?: CssVars\r\n}\r\n\r\nexport type PictureJSXProps = PictureProps &\r\n  Omit<JSX.IntrinsicElements['div'], keyof PictureProps | 'ref'>\r\n\r\nexport type PictureComponent = {\r\n  new (): {\r\n    $props: PictureJSXProps\r\n  }\r\n}\r\n\r\nconst INTERACT_SAFE =\r\n  '.w-picture-viewer__viewport, .w-picture-viewer__img-wrap, .w-picture-viewer__img, .w-picture-viewer__thumb, .w-picture-viewer__nav, .w-picture-viewer__close, .w-picture-viewer__thumbs, .w-picture-viewer__toolbar'\r\n\r\nconst PictureImpl = defineComponent({\r\n  name: 'Picture',\r\n  inheritAttrs: false,\r\n  components: {\r\n    Image,\r\n    Mask,\r\n    Toggle,\r\n    Close,\r\n    Icon,\r\n    PictureViewport,\r\n    PictureToolbar,\r\n  },\r\n  props: {\r\n    images: {\r\n      type: [String, Array] as PropType<string | string[]>,\r\n      default: undefined,\r\n    },\r\n    size: { type: Number, default: undefined },\r\n    round: {\r\n      type: [Boolean, String] as PropType<boolean | string>,\r\n      default: undefined,\r\n    },\r\n    cssVars: { type: Object as PropType<CssVars>, default: undefined },\r\n  },\r\n  emits: {\r\n    'update:show': (_v: boolean) => true,\r\n    show: (_index: number) => true,\r\n    hide: () => true,\r\n  },\r\n  setup(props, { attrs, emit }) {\r\n    const cfg = useComponentConfig('Picture', props, PICTURE_FALLBACK)\r\n    const { t } = useUII18n()\r\n    const { zIndex, add } = useGlobalZIndex()\r\n    const show = ref(false)\r\n    const curIndex = ref(0)\r\n    const alwaysOneWay = ref(false)\r\n    const fromRect = ref<DOMRect | null>(null)\r\n    const interact = ref(false)\r\n    const viewportApi = ref<PictureViewportMethods | null>(null)\r\n    const viewportController = createPictureViewport()\r\n    let stopFlip: (() => void) | undefined\r\n\r\n    const list = computed(() => normalizePictureImages(props.images))\r\n\r\n    watch(show, (v) => {\r\n      emit('update:show', v)\r\n      if (!v) {\r\n        emit('hide')\r\n        stopFlip?.()\r\n        stopFlip = undefined\r\n        fromRect.value = null\r\n        interact.value = false\r\n        viewportApi.value = null\r\n        viewportController.reset()\r\n      }\r\n    })\r\n\r\n    watch(curIndex, () => {\r\n      if (!show.value || !interact.value) return\r\n      // 切图：保留相对缩放，仅清平移（具体落点在新图 onLoad）\r\n      viewportController.prepareImageChange()\r\n    })\r\n\r\n    useEscStack(\r\n      show,\r\n      () => {\r\n        show.value = false\r\n      },\r\n      () => zIndex.value,\r\n    )\r\n\r\n    function enableInteract() {\r\n      // 仅打开进场结束后校准一次适应；切图不走这里\r\n      viewportApi.value?.fit(false)\r\n      interact.value = true\r\n    }\r\n\r\n    async function playEnterFlip() {\r\n      stopFlip?.()\r\n      stopFlip = undefined\r\n      interact.value = false\r\n      await nextTick()\r\n      await new Promise<void>((r) => requestAnimationFrame(() => r()))\r\n      const el = viewportApi.value?.getFlipEl()\r\n      const from = fromRect.value\r\n      if (!el || !from) {\r\n        fromRect.value = null\r\n        enableInteract()\r\n        return\r\n      }\r\n      fromRect.value = null\r\n      stopFlip = runPictureImgEnter(el, from, {\r\n        onEnd: () => {\r\n          enableInteract()\r\n        },\r\n      })\r\n    }\r\n\r\n    function openAt(i: number, e?: MouseEvent) {\r\n      const target = (e?.currentTarget as HTMLElement | null) ?? null\r\n      fromRect.value = target?.getBoundingClientRect() ?? null\r\n      viewportController.reset()\r\n      curIndex.value = i\r\n      alwaysOneWay.value = false\r\n      interact.value = false\r\n      add()\r\n      show.value = true\r\n      emit('show', i)\r\n      void playEnterFlip()\r\n    }\r\n\r\n    function close() {\r\n      show.value = false\r\n    }\r\n\r\n    function onViewerClick(e: MouseEvent) {\r\n      const el = e.target as HTMLElement | null\r\n      if (el?.closest(INTERACT_SAFE)) return\r\n      close()\r\n    }\r\n\r\n    function onThumbClick(i: number) {\r\n      curIndex.value = i\r\n      alwaysOneWay.value = false\r\n    }\r\n\r\n    function goPrev(prev: () => void) {\r\n      alwaysOneWay.value = true\r\n      prev()\r\n    }\r\n\r\n    function goNext(next: () => void) {\r\n      alwaysOneWay.value = true\r\n      next()\r\n    }\r\n\r\n    function bindViewport(el: unknown) {\r\n      // Toggle 切图时旧实例可能后触发 null，勿清掉新实例\r\n      if (el) viewportApi.value = el as PictureViewportMethods\r\n    }\r\n\r\n    onBeforeUnmount(() => {\r\n      stopFlip?.()\r\n    })\r\n\r\n    return () => {\r\n      const images = list.value\r\n      if (!images.length) return null\r\n\r\n      const rootProps = mergeProps(\r\n        {\r\n          class: 'w-picture',\r\n          style: toCssVarsStyle({\r\n            ...propSizeToCssVars('picture', cfg.value.size),\r\n            ...props.cssVars,\r\n          }),\r\n        },\r\n        attrs,\r\n      )\r\n\r\n      const multi = images.length > 1\r\n\r\n      return (\r\n        <>\r\n          <div {...rootProps}>\r\n            {images.map((src, i) => (\r\n              <Image\r\n                key={`${src}-${i}`}\r\n                class={[\r\n                  'w-picture__thumb',\r\n                  { 'is-previewing': show.value && curIndex.value === i },\r\n                ]}\r\n                src={src}\r\n                round={cfg.value.round}\r\n                onClick={(e: MouseEvent) => openAt(i, e)}\r\n              />\r\n            ))}\r\n          </div>\r\n\r\n          <Mask\r\n            show={show.value}\r\n            zIndex={zIndex.value}\r\n            class=\"w-picture-mask\"\r\n            canCloseByClickSelf\r\n            onUpdate:show={(v: boolean) => {\r\n              show.value = v\r\n            }}\r\n          />\r\n\r\n          <Teleport to=\"body\">\r\n            {show.value ? (\r\n              <div\r\n                class=\"w-picture-viewer\"\r\n                style={{\r\n                  /* 高于 Mask，避免同层 portal 重排后盖住操作控件 */\r\n                  ['--__w-picture-viewer-z-index' as string]: zIndex.value + 1,\r\n                }}\r\n                onClick={onViewerClick}>\r\n                <Close\r\n                  class=\"w-picture-viewer__close\"\r\n                  size={24}\r\n                  ariaLabel={t('picture.close')}\r\n                  title={t('picture.close')}\r\n                  onClick={(e: MouseEvent) => {\r\n                    e.stopPropagation()\r\n                    close()\r\n                  }}\r\n                />\r\n\r\n                <Toggle\r\n                  class=\"w-picture-viewer__stage\"\r\n                  wheel={false}\r\n                  index={curIndex.value}\r\n                  data={images}\r\n                  itemClass=\"w-picture-viewer__item\"\r\n                  transform=\"translate\"\r\n                  alwaysOneWay={alwaysOneWay.value}\r\n                  onUpdate:index={(i: number) => {\r\n                    curIndex.value = i\r\n                  }}\r\n                  v-slots={{\r\n                    default: ({ item }: { item: string }) => (\r\n                      <PictureViewport\r\n                        key={`${item}-${curIndex.value}`}\r\n                        ref={bindViewport}\r\n                        src={item}\r\n                        interact={interact.value}\r\n                        controller={viewportController}\r\n                      />\r\n                    ),\r\n                    use: ({\r\n                      index,\r\n                      prev,\r\n                      next,\r\n                    }: {\r\n                      index: number\r\n                      prev: () => void\r\n                      next: () => void\r\n                    }) => (\r\n                      <>\r\n                        <PictureToolbar\r\n                          viewport={viewportApi.value}\r\n                          disabled={!interact.value}\r\n                        />\r\n                        {multi ? (\r\n                          <div class=\"w-picture-viewer__thumbs\">\r\n                            {images.map((src, i) => (\r\n                              <img\r\n                                key={`${src}-t-${i}`}\r\n                                class={[\r\n                                  'w-picture-viewer__thumb',\r\n                                  { 'is-active': i === index },\r\n                                ]}\r\n                                src={src}\r\n                                alt=\"\"\r\n                                draggable={false}\r\n                                onClick={() => onThumbClick(i)}\r\n                              />\r\n                            ))}\r\n                          </div>\r\n                        ) : null}\r\n                        {multi ? (\r\n                          <>\r\n                            <Icon\r\n                              class=\"w-picture-viewer__nav w-picture-viewer__nav--prev\"\r\n                              name=\"w-icon-arrow-down\"\r\n                              rotate\r\n                              direction=\"z\"\r\n                              deg={90}\r\n                              size=\"var(--w-picture-viewer-nav-size)\"\r\n                              ariaLabel={t('picture.prev')}\r\n                              title={t('picture.prev')}\r\n                              onClick={(e: MouseEvent) => {\r\n                                e.stopPropagation()\r\n                                goPrev(prev)\r\n                              }}\r\n                            />\r\n                            <Icon\r\n                              class=\"w-picture-viewer__nav w-picture-viewer__nav--next\"\r\n                              name=\"w-icon-arrow-down\"\r\n                              rotate\r\n                              direction=\"z\"\r\n                              deg={-90}\r\n                              size=\"var(--w-picture-viewer-nav-size)\"\r\n                              ariaLabel={t('picture.next')}\r\n                              title={t('picture.next')}\r\n                              onClick={(e: MouseEvent) => {\r\n                                e.stopPropagation()\r\n                                goNext(next)\r\n                              }}\r\n                            />\r\n                          </>\r\n                        ) : null}\r\n                      </>\r\n                    ),\r\n                  }}\r\n                />\r\n              </div>\r\n            ) : null}\r\n          </Teleport>\r\n        </>\r\n      )\r\n    }\r\n  },\r\n})\r\n\r\nexport default PictureImpl as unknown as PictureComponent\r\n"],"mappings":"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"}
+{"version":3,"file":"Picture.js","names":["Teleport","computed","defineComponent","mergeProps","nextTick","onBeforeUnmount","ref","watch","Fragment","_Fragment","createVNode","_createVNode","propSizeToCssVars","toCssVarsStyle","useComponentConfig","useEscStack","useGlobalZIndex","useUII18n","createPictureViewport","Close","Icon","Image","Mask","Toggle","normalizePictureImages","PICTURE_FALLBACK","runPictureImgEnter","PictureToolbar","PictureViewport","INTERACT_SAFE","PictureImpl","name","inheritAttrs","components","props","images","type","String","Array","default","undefined","size","Number","round","Boolean","cssVars","Object","emits","_v","show","_index","hide","setup","attrs","emit","cfg","t","zIndex","add","curIndex","alwaysOneWay","fromRect","interact","viewportApi","viewportController","stopFlip","list","v","value","reset","prepareImageChange","enableInteract","fit","playEnterFlip","Promise","r","requestAnimationFrame","el","getFlipEl","from","onEnd","openAt","i","e","target","currentTarget","getBoundingClientRect","close","onViewerClick","closest","onThumbClick","goPrev","prev","goNext","next","bindViewport","length","rootProps","class","style","multi","map","src","stopPropagation","item","use","index","onClick","Picture"],"sources":["../../../components/picture/Picture.tsx"],"sourcesContent":["import {\r\n  Teleport,\r\n  computed,\r\n  defineComponent,\r\n  mergeProps,\r\n  nextTick,\r\n  onBeforeUnmount,\r\n  ref,\r\n  watch,\r\n  type DefineComponent,\r\n  type PropType,\r\n} from 'vue'\r\nimport {\r\n  propSizeToCssVars,\r\n  toCssVarsStyle,\r\n  type CssVars,\r\n} from '../../util'\r\nimport useComponentConfig from '../../use/useComponentConfig'\r\nimport useEscStack from '../../use/useEscStack'\r\nimport useGlobalZIndex from '../../use/useGlobalZIndex'\r\nimport { useUII18n } from '../../use/useUII18n'\r\nimport { createPictureViewport } from '../../use/usePictureViewport'\r\nimport Close from '../close/index'\r\nimport Icon from '../icon/index'\r\nimport Image from '../image/index'\r\nimport Mask from '../mask/index'\r\nimport Toggle from '../toggle/index'\r\nimport {\r\n  normalizePictureImages,\r\n  PICTURE_FALLBACK,\r\n} from './config'\r\nimport { runPictureImgEnter } from './pictureFlip'\r\nimport PictureToolbar from './PictureToolbar'\r\nimport PictureViewport, {\r\n  type PictureViewportMethods,\r\n} from './PictureViewport'\r\n\r\nexport type { PictureGlobalConfig } from './config'\r\nexport { PICTURE_FALLBACK, normalizePictureImages } from './config'\r\n\r\nexport type PictureProps = {\r\n  /** 图片地址：逗号分隔字符串或数组 */\r\n  images?: string | string[]\r\n  size?: number\r\n  round?: boolean | string\r\n  cssVars?: CssVars\r\n}\r\n\r\nexport type PictureJSXProps = PictureProps &\r\n  Omit<JSX.IntrinsicElements['div'], keyof PictureProps | 'ref'>\r\n\r\nconst INTERACT_SAFE =\r\n  '.w-picture-viewer__viewport, .w-picture-viewer__img-wrap, .w-picture-viewer__img, .w-picture-viewer__thumb, .w-picture-viewer__nav, .w-picture-viewer__close, .w-picture-viewer__thumbs, .w-picture-viewer__toolbar'\r\n\r\nconst PictureImpl = defineComponent({\r\n  name: 'Picture',\r\n  inheritAttrs: false,\r\n  components: {\r\n    Image,\r\n    Mask,\r\n    Toggle,\r\n    Close,\r\n    Icon,\r\n    PictureViewport,\r\n    PictureToolbar,\r\n  },\r\n  props: {\r\n    images: {\r\n      type: [String, Array] as PropType<string | string[]>,\r\n      default: undefined,\r\n    },\r\n    size: { type: Number, default: undefined },\r\n    round: {\r\n      type: [Boolean, String] as PropType<boolean | string>,\r\n      default: undefined,\r\n    },\r\n    cssVars: { type: Object as PropType<CssVars>, default: undefined },\r\n  },\r\n  emits: {\r\n    'update:show': (_v: boolean) => true,\r\n    show: (_index: number) => true,\r\n    hide: () => true,\r\n  },\r\n  setup(props, { attrs, emit }) {\r\n    const cfg = useComponentConfig('Picture', props, PICTURE_FALLBACK)\r\n    const { t } = useUII18n()\r\n    const { zIndex, add } = useGlobalZIndex()\r\n    const show = ref(false)\r\n    const curIndex = ref(0)\r\n    const alwaysOneWay = ref(false)\r\n    const fromRect = ref<DOMRect | null>(null)\r\n    const interact = ref(false)\r\n    const viewportApi = ref<PictureViewportMethods | null>(null)\r\n    const viewportController = createPictureViewport()\r\n    let stopFlip: (() => void) | undefined\r\n\r\n    const list = computed(() => normalizePictureImages(props.images))\r\n\r\n    watch(show, (v) => {\r\n      emit('update:show', v)\r\n      if (!v) {\r\n        emit('hide')\r\n        stopFlip?.()\r\n        stopFlip = undefined\r\n        fromRect.value = null\r\n        interact.value = false\r\n        viewportApi.value = null\r\n        viewportController.reset()\r\n      }\r\n    })\r\n\r\n    watch(curIndex, () => {\r\n      if (!show.value || !interact.value) return\r\n      // 切图：保留相对缩放，仅清平移（具体落点在新图 onLoad）\r\n      viewportController.prepareImageChange()\r\n    })\r\n\r\n    useEscStack(\r\n      show,\r\n      () => {\r\n        show.value = false\r\n      },\r\n      () => zIndex.value,\r\n    )\r\n\r\n    function enableInteract() {\r\n      // 仅打开进场结束后校准一次适应；切图不走这里\r\n      viewportApi.value?.fit(false)\r\n      interact.value = true\r\n    }\r\n\r\n    async function playEnterFlip() {\r\n      stopFlip?.()\r\n      stopFlip = undefined\r\n      interact.value = false\r\n      await nextTick()\r\n      await new Promise<void>((r) => requestAnimationFrame(() => r()))\r\n      const el = viewportApi.value?.getFlipEl()\r\n      const from = fromRect.value\r\n      if (!el || !from) {\r\n        fromRect.value = null\r\n        enableInteract()\r\n        return\r\n      }\r\n      fromRect.value = null\r\n      stopFlip = runPictureImgEnter(el, from, {\r\n        onEnd: () => {\r\n          enableInteract()\r\n        },\r\n      })\r\n    }\r\n\r\n    function openAt(i: number, e?: MouseEvent) {\r\n      const target = (e?.currentTarget as HTMLElement | null) ?? null\r\n      fromRect.value = target?.getBoundingClientRect() ?? null\r\n      viewportController.reset()\r\n      curIndex.value = i\r\n      alwaysOneWay.value = false\r\n      interact.value = false\r\n      add()\r\n      show.value = true\r\n      emit('show', i)\r\n      void playEnterFlip()\r\n    }\r\n\r\n    function close() {\r\n      show.value = false\r\n    }\r\n\r\n    function onViewerClick(e: MouseEvent) {\r\n      const el = e.target as HTMLElement | null\r\n      if (el?.closest(INTERACT_SAFE)) return\r\n      close()\r\n    }\r\n\r\n    function onThumbClick(i: number) {\r\n      curIndex.value = i\r\n      alwaysOneWay.value = false\r\n    }\r\n\r\n    function goPrev(prev: () => void) {\r\n      alwaysOneWay.value = true\r\n      prev()\r\n    }\r\n\r\n    function goNext(next: () => void) {\r\n      alwaysOneWay.value = true\r\n      next()\r\n    }\r\n\r\n    function bindViewport(el: unknown) {\r\n      // Toggle 切图时旧实例可能后触发 null，勿清掉新实例\r\n      if (el) viewportApi.value = el as PictureViewportMethods\r\n    }\r\n\r\n    onBeforeUnmount(() => {\r\n      stopFlip?.()\r\n    })\r\n\r\n    return () => {\r\n      const images = list.value\r\n      if (!images.length) return null\r\n\r\n      const rootProps = mergeProps(\r\n        {\r\n          class: 'w-picture',\r\n          style: toCssVarsStyle({\r\n            ...propSizeToCssVars('picture', cfg.value.size),\r\n            ...props.cssVars,\r\n          }),\r\n        },\r\n        attrs,\r\n      )\r\n\r\n      const multi = images.length > 1\r\n\r\n      return (\r\n        <>\r\n          <div {...rootProps}>\r\n            {images.map((src, i) => (\r\n              <Image\r\n                key={`${src}-${i}`}\r\n                class={[\r\n                  'w-picture__thumb',\r\n                  { 'is-previewing': show.value && curIndex.value === i },\r\n                ]}\r\n                src={src}\r\n                round={cfg.value.round}\r\n                onClick={(e: MouseEvent) => openAt(i, e)}\r\n              />\r\n            ))}\r\n          </div>\r\n\r\n          <Mask\r\n            show={show.value}\r\n            zIndex={zIndex.value}\r\n            class=\"w-picture-mask\"\r\n            canCloseByClickSelf\r\n            onUpdate:show={(v: boolean) => {\r\n              show.value = v\r\n            }}\r\n          />\r\n\r\n          <Teleport to=\"body\">\r\n            {show.value ? (\r\n              <div\r\n                class=\"w-picture-viewer\"\r\n                style={{\r\n                  /* 高于 Mask，避免同层 portal 重排后盖住操作控件 */\r\n                  ['--__w-picture-viewer-z-index' as string]: zIndex.value + 1,\r\n                }}\r\n                onClick={onViewerClick}>\r\n                <Close\r\n                  class=\"w-picture-viewer__close\"\r\n                  size={24}\r\n                  ariaLabel={t('picture.close')}\r\n                  title={t('picture.close')}\r\n                  onClick={(e: MouseEvent) => {\r\n                    e.stopPropagation()\r\n                    close()\r\n                  }}\r\n                />\r\n\r\n                <Toggle\r\n                  class=\"w-picture-viewer__stage\"\r\n                  wheel={false}\r\n                  index={curIndex.value}\r\n                  data={images}\r\n                  itemClass=\"w-picture-viewer__item\"\r\n                  transform=\"translate\"\r\n                  alwaysOneWay={alwaysOneWay.value}\r\n                  onUpdate:index={(i: number) => {\r\n                    curIndex.value = i\r\n                  }}\r\n                  v-slots={{\r\n                    default: ({ item }: { item: string }) => (\r\n                      <PictureViewport\r\n                        key={`${item}-${curIndex.value}`}\r\n                        ref={bindViewport}\r\n                        src={item}\r\n                        interact={interact.value}\r\n                        controller={viewportController}\r\n                      />\r\n                    ),\r\n                    use: ({\r\n                      index,\r\n                      prev,\r\n                      next,\r\n                    }: {\r\n                      index: number\r\n                      prev: () => void\r\n                      next: () => void\r\n                    }) => (\r\n                      <>\r\n                        <PictureToolbar\r\n                          viewport={viewportApi.value}\r\n                          disabled={!interact.value}\r\n                        />\r\n                        {multi ? (\r\n                          <div class=\"w-picture-viewer__thumbs\">\r\n                            {images.map((src, i) => (\r\n                              <img\r\n                                key={`${src}-t-${i}`}\r\n                                class={[\r\n                                  'w-picture-viewer__thumb',\r\n                                  { 'is-active': i === index },\r\n                                ]}\r\n                                src={src}\r\n                                alt=\"\"\r\n                                draggable={false}\r\n                                onClick={() => onThumbClick(i)}\r\n                              />\r\n                            ))}\r\n                          </div>\r\n                        ) : null}\r\n                        {multi ? (\r\n                          <>\r\n                            <Icon\r\n                              class=\"w-picture-viewer__nav w-picture-viewer__nav--prev\"\r\n                              name=\"w-icon-arrow-down\"\r\n                              rotate\r\n                              direction=\"z\"\r\n                              deg={90}\r\n                              size=\"var(--w-picture-viewer-nav-size)\"\r\n                              ariaLabel={t('picture.prev')}\r\n                              title={t('picture.prev')}\r\n                              onClick={(e: MouseEvent) => {\r\n                                e.stopPropagation()\r\n                                goPrev(prev)\r\n                              }}\r\n                            />\r\n                            <Icon\r\n                              class=\"w-picture-viewer__nav w-picture-viewer__nav--next\"\r\n                              name=\"w-icon-arrow-down\"\r\n                              rotate\r\n                              direction=\"z\"\r\n                              deg={-90}\r\n                              size=\"var(--w-picture-viewer-nav-size)\"\r\n                              ariaLabel={t('picture.next')}\r\n                              title={t('picture.next')}\r\n                              onClick={(e: MouseEvent) => {\r\n                                e.stopPropagation()\r\n                                goNext(next)\r\n                              }}\r\n                            />\r\n                          </>\r\n                        ) : null}\r\n                      </>\r\n                    ),\r\n                  }}\r\n                />\r\n              </div>\r\n            ) : null}\r\n          </Teleport>\r\n        </>\r\n      )\r\n    }\r\n  },\r\n})\r\n\r\n/** 断言为 DefineComponent，hover / 补全直接看到 PictureJSXProps（勿再包 XxxComponent 别名） */\r\nconst Picture = PictureImpl as unknown as DefineComponent<PictureJSXProps>\r\n\r\nexport type PictureInstance = InstanceType<typeof Picture>\r\n\r\nexport default Picture\r\n"],"mappings":"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"}

package/dist/components/picture/PictureViewport.js

@@ -1,5 +1,6 @@
 import useVisibleResize from "../../use/useVisibleResize.js";
 import { PICTURE_VIEWPORT_ZOOM_STEP, createPictureViewport } from "../../use/usePictureViewport.js";
+import usePointerDrag from "../../use/usePointerDrag.js";
 import { computed, createVNode, defineComponent, onBeforeUnmount, onMounted, ref, shallowRef, watch } from "vue";
 //#region components/picture/PictureViewport.tsx
 var PictureViewport = /* @__PURE__ */ defineComponent({
@@ -27,7 +28,6 @@ var PictureViewport = /* @__PURE__ */ defineComponent({
 		const transformCss = ref("translate(0px, 0px) rotate(0deg) scale(1, 1)");
 		const useTransition = ref(false);
 		const ready = ref(false);
-		const dragging = ref(false);
 		const canPan = ref(false);
 		const natural = shallowRef({
 			w: 0,
@@ -35,7 +35,6 @@ var PictureViewport = /* @__PURE__ */ defineComponent({
 		});
 		const localApi = createPictureViewport();
 		const api = () => props.controller ?? localApi;
-		let dragLast = null;
 		let unsub;
 		const syncFromApi = () => {
 			const a = api();
@@ -102,36 +101,27 @@ var PictureViewport = /* @__PURE__ */ defineComponent({
 			const p = pointerFromCenter(e.clientX, e.clientY);
 			api().zoomAt(p.x, p.y, factor);
 		}
-		function onPointerDown(e) {
-			if (!props.interact || !ready.value) return;
-			if (e.button !== 0) return;
-			if (!api().canPan()) return;
-			e.preventDefault();
-			dragging.value = true;
-			dragLast = {
-				x: e.clientX,
-				y: e.clientY
-			};
-			e.currentTarget.setPointerCapture?.(e.pointerId);
-		}
-		function onPointerMove(e) {
-			if (!dragging.value || !dragLast) return;
-			const dx = e.clientX - dragLast.x;
-			const dy = e.clientY - dragLast.y;
-			dragLast = {
-				x: e.clientX,
-				y: e.clientY
-			};
-			api().panBy(dx, dy);
-		}
-		function onPointerUp(e) {
-			if (!dragging.value) return;
-			dragging.value = false;
-			dragLast = null;
-			try {
-				e.currentTarget.releasePointerCapture?.(e.pointerId);
-			} catch {}
-		}
+		const { dragging, onPointerDown, onPointerMove, onPointerUp } = usePointerDrag({
+			events: "pointer",
+			bind: "capture",
+			disabled: () => !props.interact || !ready.value,
+			onStart: (e, ctx) => {
+				if (e.button !== 0) return false;
+				if (!api().canPan()) return false;
+				e.preventDefault();
+				ctx.data.lastX = e.clientX;
+				ctx.data.lastY = e.clientY;
+			},
+			onMove: (e, ctx) => {
+				const lastX = ctx.data.lastX;
+				const lastY = ctx.data.lastY;
+				const dx = e.clientX - lastX;
+				const dy = e.clientY - lastY;
+				ctx.data.lastX = e.clientX;
+				ctx.data.lastY = e.clientY;
+				api().panBy(dx, dy);
+			}
+		});
 		onMounted(() => {
 			measureViewport();
 			if (imgRef.value?.complete) onImgLoad();