@fangzhongya/fang-ui 0.1.86 → 0.1.89

package/dist/directives/scroll/index.js

@@ -1,152 +1,153 @@
-import { watch, toValue } from "vue";
+import { toValue, watch } from "vue";
+//#region packages/directives/packages/scroll/index.ts
+/**
+* 解析配置参数
+* @param el - HTML元素，用于获取scroll-selector和scroll-distance属性
+* @param value - 绑定值，可以是函数或包含配置信息的对象
+* @returns 返回解析后的滚动配置对象
+*/
 function parseConfig(el, value) {
-  const scrollSelector = el.getAttribute("scroll-selector");
-  const scrollDistance = el.getAttribute("scroll-distance");
-  const baseConfig = {
-    fun: () => {
-    },
-    isEnabled: true,
-    selector: scrollSelector || null,
-    distance: scrollDistance ? Number.parseInt(scrollDistance, 10) : 10,
-    loadText: "加载中...",
-    endText: "无更多数据",
-    cssname: "v-scroll-add",
-    isFunctionBinding: false
-  };
-  if (typeof value === "function") {
-    return {
-      ...baseConfig,
-      fun: value,
-      isFunctionBinding: true
-    };
-  }
-  return {
-    ...baseConfig,
-    fun: value.onChange,
-    isEnabled: value.is ?? true,
-    selector: value.dom || baseConfig.selector,
-    distance: value.distance || baseConfig.distance,
-    loadText: value.loadText || baseConfig.loadText,
-    endText: value.endText || baseConfig.endText,
-    cssname: value.cssname || baseConfig.cssname
-  };
+	const scrollSelector = el.getAttribute("scroll-selector");
+	const scrollDistance = el.getAttribute("scroll-distance");
+	const baseConfig = {
+		fun: () => {},
+		isEnabled: true,
+		selector: scrollSelector || null,
+		distance: scrollDistance ? Number.parseInt(scrollDistance, 10) : 10,
+		loadText: "加载中...",
+		endText: "无更多数据",
+		cssname: "v-scroll-add",
+		isFunctionBinding: false
+	};
+	if (typeof value === "function") return {
+		...baseConfig,
+		fun: value,
+		isFunctionBinding: true
+	};
+	return {
+		...baseConfig,
+		fun: value.onChange,
+		isEnabled: value.is ?? true,
+		selector: value.dom || baseConfig.selector,
+		distance: value.distance || baseConfig.distance,
+		loadText: value.loadText || baseConfig.loadText,
+		endText: value.endText || baseConfig.endText,
+		cssname: value.cssname || baseConfig.cssname
+	};
 }
+/**
+* 获取滚动容器元素
+* @param el - 起始搜索的DOM元素
+* @param selector - 选择器字符串、HTMLElement元素或null值
+* @returns 返回找到的滚动容器元素或原始元素
+*/
 function getScrollContainer(el, selector) {
-  if (!selector) return el;
-  if (typeof selector === "string") {
-    const foundElement = el.querySelector(selector);
-    return foundElement || el;
-  }
-  return selector;
+	if (!selector) return el;
+	if (typeof selector === "string") return el.querySelector(selector) || el;
+	return selector;
 }
+/**
+* 创建状态提示元素
+* @param scrollContainer - 滚动容器元素，用于添加状态提示元素
+* @param cssname - CSS类名，用于设置状态提示元素的样式
+* @returns 返回创建的状态提示元素
+*/
 function createStatusElement(scrollContainer, cssname) {
-  const statusElement = document.createElement("div");
-  statusElement.className = cssname;
-  statusElement.style.display = "none";
-  scrollContainer.appendChild(statusElement);
-  return statusElement;
+	const statusElement = document.createElement("div");
+	statusElement.className = cssname;
+	statusElement.style.display = "none";
+	scrollContainer.appendChild(statusElement);
+	return statusElement;
 }
+/**
+* 设置状态监听器
+* @param statusElement - 状态显示的DOM元素
+* @param value - 滚动绑定配置对象，包含load和end状态
+* @param config - 滚动配置对象，包含CSS类名和文本配置
+*/
 function setupStatusWatchers(statusElement, value, config) {
-  if (value.load) {
-    watch(
-      () => toValue(value.load),
-      (isLoading) => {
-        if (isLoading) {
-          statusElement.className = `${config.cssname} ${config.cssname}-load`;
-          statusElement.style.display = "block";
-          statusElement.textContent = config.loadText;
-        } else {
-          statusElement.style.display = "none";
-        }
-      }
-    );
-  }
-  if (value.end) {
-    watch(
-      () => toValue(value.end),
-      (isEnd) => {
-        if (isEnd) {
-          setTimeout(() => {
-            statusElement.className = `${config.cssname} ${config.cssname}-end`;
-            statusElement.style.display = "block";
-            statusElement.textContent = config.endText;
-          }, 100);
-        } else {
-          statusElement.style.display = "none";
-        }
-      }
-    );
-  }
+	if (value.load) watch(() => toValue(value.load), (isLoading) => {
+		if (isLoading) {
+			statusElement.className = `${config.cssname} ${config.cssname}-load`;
+			statusElement.style.display = "block";
+			statusElement.textContent = config.loadText;
+		} else statusElement.style.display = "none";
+	});
+	if (value.end) watch(() => toValue(value.end), (isEnd) => {
+		if (isEnd) setTimeout(() => {
+			statusElement.className = `${config.cssname} ${config.cssname}-end`;
+			statusElement.style.display = "block";
+			statusElement.textContent = config.endText;
+		}, 100);
+		else statusElement.style.display = "none";
+	});
 }
+/**
+* 创建滚动处理函数
+* @param scrollContainer 滚动容器元素
+* @param config 滚动配置对象
+* @param value 绑定值
+* @returns 返回滚动事件处理函数
+*/
 function createScrollHandler(scrollContainer, config, value) {
-  let debounceTimer;
-  const handleScrollEnd = () => {
-    clearTimeout(debounceTimer);
-    debounceTimer = setTimeout(() => {
-      if (config.isFunctionBinding) {
-        config.fun();
-      } else {
-        const scrollValue = value;
-        const loadValue = scrollValue.load ? toValue(scrollValue.load) : false;
-        const endValue = scrollValue.end ? toValue(scrollValue.end) : false;
-        if (!loadValue && !endValue) {
-          config.fun();
-        }
-      }
-    }, 100);
-  };
-  return () => {
-    const remainingScroll = scrollContainer.scrollHeight - scrollContainer.scrollTop;
-    const visibleHeight = scrollContainer.clientHeight;
-    if (remainingScroll - config.distance <= visibleHeight) {
-      handleScrollEnd();
-    }
-  };
+	let debounceTimer;
+	/**
+	* 处理滚动结束事件，使用防抖机制避免频繁触发
+	*/
+	const handleScrollEnd = () => {
+		clearTimeout(debounceTimer);
+		debounceTimer = setTimeout(() => {
+			if (config.isFunctionBinding) config.fun();
+			else {
+				const scrollValue = value;
+				const loadValue = scrollValue.load ? toValue(scrollValue.load) : false;
+				const endValue = scrollValue.end ? toValue(scrollValue.end) : false;
+				if (!loadValue && !endValue) config.fun();
+			}
+		}, 100);
+	};
+	return () => {
+		const remainingScroll = scrollContainer.scrollHeight - scrollContainer.scrollTop;
+		const visibleHeight = scrollContainer.clientHeight;
+		if (remainingScroll - config.distance <= visibleHeight) handleScrollEnd();
+	};
 }
-const vScroll = {
-  name: "scroll",
-  /**
-   * Vue指令的mounted钩子函数，用于初始化滚动相关的功能
-   * @param el - 指令绑定的DOM元素
-   * @param binding - 指令绑定的对象，包含value属性
-   */
-  mounted(el, binding) {
-    const value = binding.value;
-    const config = parseConfig(el, value);
-    const scrollContainer = getScrollContainer(el, config.selector);
-    if (!scrollContainer || !config.isEnabled) return;
-    scrollContainer.style.overflowY = "auto";
-    if (!config.isFunctionBinding) {
-      const statusElement = createStatusElement(
-        scrollContainer,
-        config.cssname
-      );
-      setupStatusWatchers(statusElement, value, config);
-    }
-    const scrollHandler = createScrollHandler(
-      scrollContainer,
-      config,
-      value
-    );
-    scrollContainer.addEventListener("scroll", scrollHandler, {
-      passive: true
-    });
-    el._scrollCleanup = () => {
-      scrollContainer.removeEventListener("scroll", scrollHandler);
-    };
-  },
-  /**
-   * 组件卸载时的清理函数
-   *
-   * @param el - 需要清理的HTML元素
-   */
-  unmounted(el) {
-    if (el._scrollCleanup) {
-      el._scrollCleanup();
-      delete el._scrollCleanup;
-    }
-  }
-};
-export {
-  vScroll as default
+/**
+* @title { h3 }  scroll 滚动加载
+* 滚动加载指令
+* @state 0
+*/
+var scroll_default = {
+	name: "scroll",
+	/**
+	* Vue指令的mounted钩子函数，用于初始化滚动相关的功能
+	* @param el - 指令绑定的DOM元素
+	* @param binding - 指令绑定的对象，包含value属性
+	*/
+	mounted(el, binding) {
+		const value = binding.value;
+		const config = parseConfig(el, value);
+		const scrollContainer = getScrollContainer(el, config.selector);
+		if (!scrollContainer || !config.isEnabled) return;
+		scrollContainer.style.overflowY = "auto";
+		if (!config.isFunctionBinding) setupStatusWatchers(createStatusElement(scrollContainer, config.cssname), value, config);
+		const scrollHandler = createScrollHandler(scrollContainer, config, value);
+		scrollContainer.addEventListener("scroll", scrollHandler, { passive: true });
+		el._scrollCleanup = () => {
+			scrollContainer.removeEventListener("scroll", scrollHandler);
+		};
+	},
+	/**
+	* 组件卸载时的清理函数
+	*
+	* @param el - 需要清理的HTML元素
+	*/
+	unmounted(el) {
+		if (el._scrollCleanup) {
+			el._scrollCleanup();
+			delete el._scrollCleanup;
+		}
+	}
 };
+//#endregion
+export { scroll_default as default };

package/dist/directives/sortable/index.cjs

@@ -1,46 +1,42 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const Sortable = require("sortablejs");
-const vSortable = {
-  name: "Sortable",
-  /**
-   * Vue指令的mounted钩子函数，用于初始化sortable功能
-   * @param el 指令绑定的DOM元素
-   * @param binding Vue指令绑定对象，包含value等属性
-   */
-  mounted(el, binding) {
-    const value = binding.value;
-    let selector = el.getAttribute(`sortable-selector`);
-    let dom;
-    if (value.dom) {
-      if (typeof value.dom == "string") {
-        dom = el.querySelector(value.dom);
-      } else {
-        dom = value.dom;
-      }
-    } else if (selector) {
-      dom = el.querySelector(selector);
-    } else {
-      dom = el;
-    }
-    if (dom && value.is !== false) {
-      const options = {
-        animation: 150,
-        // 动画时长
-        ghostClass: "sortable-ghost",
-        // 拖拽时占位元素的样式
-        chosenClass: "sortable-chosen",
-        // 被选中元素的样式
-        dragClass: "sortable-drag",
-        // 拖拽元素的样式
-        ...value.options || {
-          ...value,
-          dom: void 0,
-          is: void 0
-        }
-      };
-      Sortable.create(dom, options);
-    }
-  }
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+let sortablejs = require("sortablejs");
+sortablejs = require_runtime.__toESM(sortablejs, 1);
+//#region packages/directives/packages/sortable/index.ts
+/**
+* @title { h3 }  Sortable 拖拽
+* 拖拽指令
+* @state 2
+*/
+var sortable_default = {
+	name: "Sortable",
+	/**
+	* Vue指令的mounted钩子函数，用于初始化sortable功能
+	* @param el 指令绑定的DOM元素
+	* @param binding Vue指令绑定对象，包含value等属性
+	*/
+	mounted(el, binding) {
+		const value = binding.value;
+		let selector = el.getAttribute(`sortable-selector`);
+		let dom;
+		if (value.dom) if (typeof value.dom == "string") dom = el.querySelector(value.dom);
+		else dom = value.dom;
+		else if (selector) dom = el.querySelector(selector);
+		else dom = el;
+		if (dom && value.is !== false) {
+			const options = {
+				animation: 150,
+				ghostClass: "sortable-ghost",
+				chosenClass: "sortable-chosen",
+				dragClass: "sortable-drag",
+				...value.options || {
+					...value,
+					dom: void 0,
+					is: void 0
+				}
+			};
+			sortablejs.default.create(dom, options);
+		}
+	}
 };
-exports.default = vSortable;
+//#endregion
+exports.default = sortable_default;

package/dist/directives/sortable/index.js

@@ -1,46 +1,40 @@
 import Sortable from "sortablejs";
-const vSortable = {
-  name: "Sortable",
-  /**
-   * Vue指令的mounted钩子函数，用于初始化sortable功能
-   * @param el 指令绑定的DOM元素
-   * @param binding Vue指令绑定对象，包含value等属性
-   */
-  mounted(el, binding) {
-    const value = binding.value;
-    let selector = el.getAttribute(`sortable-selector`);
-    let dom;
-    if (value.dom) {
-      if (typeof value.dom == "string") {
-        dom = el.querySelector(value.dom);
-      } else {
-        dom = value.dom;
-      }
-    } else if (selector) {
-      dom = el.querySelector(selector);
-    } else {
-      dom = el;
-    }
-    if (dom && value.is !== false) {
-      const options = {
-        animation: 150,
-        // 动画时长
-        ghostClass: "sortable-ghost",
-        // 拖拽时占位元素的样式
-        chosenClass: "sortable-chosen",
-        // 被选中元素的样式
-        dragClass: "sortable-drag",
-        // 拖拽元素的样式
-        ...value.options || {
-          ...value,
-          dom: void 0,
-          is: void 0
-        }
-      };
-      Sortable.create(dom, options);
-    }
-  }
-};
-export {
-  vSortable as default
+//#region packages/directives/packages/sortable/index.ts
+/**
+* @title { h3 }  Sortable 拖拽
+* 拖拽指令
+* @state 2
+*/
+var sortable_default = {
+	name: "Sortable",
+	/**
+	* Vue指令的mounted钩子函数，用于初始化sortable功能
+	* @param el 指令绑定的DOM元素
+	* @param binding Vue指令绑定对象，包含value等属性
+	*/
+	mounted(el, binding) {
+		const value = binding.value;
+		let selector = el.getAttribute(`sortable-selector`);
+		let dom;
+		if (value.dom) if (typeof value.dom == "string") dom = el.querySelector(value.dom);
+		else dom = value.dom;
+		else if (selector) dom = el.querySelector(selector);
+		else dom = el;
+		if (dom && value.is !== false) {
+			const options = {
+				animation: 150,
+				ghostClass: "sortable-ghost",
+				chosenClass: "sortable-chosen",
+				dragClass: "sortable-drag",
+				...value.options || {
+					...value,
+					dom: void 0,
+					is: void 0
+				}
+			};
+			Sortable.create(dom, options);
+		}
+	}
 };
+//#endregion
+export { sortable_default as default };

package/dist/directives/stick/index.cjs

@@ -1,84 +1,94 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const setCss = require("@fangzhongya/utils/css/setCss");
-const getShiftEvent = require("@fangzhongya/utils/dom/getShiftEvent");
-const attrValueSort = require("@fangzhongya/utils/basic/object/attrValueSort");
+let _fangzhongya_utils_dom_getShiftEvent = require("@fangzhongya/utils/dom/getShiftEvent");
+let _fangzhongya_utils_css_setCss = require("@fangzhongya/utils/css/setCss");
+let _fangzhongya_utils_basic_object_attrValueSort = require("@fangzhongya/utils/basic/object/attrValueSort");
+//#region packages/directives/packages/stick/index.ts
+/**
+* 设置DOM元素的位置和方向相关的样式，并绑定鼠标交互事件以动态调整位置。
+*
+* @param dom 要操作的目标DOM元素，若为空则不执行任何操作
+* @param el 用于设置CSS样式的元素
+* @param value 包含配置信息的对象，包括：
+*   - direction: 初始方向（'left' | 'right' | 'top' | 'bottom'）
+*   - directions: 可选的方向数组，用于排序优先级，默认为 ['left', 'right', 'top', 'bottom']
+*   - often: 是否在拖动过程中持续更新位置
+*/
 function setDom(dom, el, value) {
-  if (dom) {
-    const obj = {
-      position: "fixed",
-      display: "flex",
-      left: "initial",
-      top: "initial",
-      right: "initial",
-      bottom: "initial"
-    };
-    let key = value.direction;
-    obj[key] = "0";
-    obj["flex-direction"] = key == "left" || key == "right" ? "column" : "row";
-    setCss.setCss(el, obj);
-    const getDirection = (obj2) => {
-      return attrValueSort.attrValueSort(
-        obj2,
-        value.directions || ["left", "right", "top", "bottom"]
-      )[0];
-    };
-    const bodyStyle = document.body.style;
-    const cursor = bodyStyle.cursor;
-    const setValue = (event) => {
-      setCss.setCss(el, key, "initial");
-      key = getDirection({
-        left: event.clientX,
-        top: event.clientY,
-        right: globalThis.innerWidth - event.clientX,
-        bottom: globalThis.innerHeight - event.clientY
-      });
-      setCss.setCss(el, {
-        [key]: "0",
-        "flex-direction": key == "left" || key == "right" ? "column" : "row"
-      });
-    };
-    getShiftEvent.pressEvent(
-      dom,
-      () => {
-        bodyStyle.cursor = "move";
-        return true;
-      },
-      (event) => {
-        if (value.often) {
-          setValue(event);
-        }
-      },
-      (event) => {
-        setValue(event);
-        bodyStyle.cursor = cursor;
-      },
-      void 0,
-      "mouse"
-    );
-    setCss.setCss(dom, "cursor", "move");
-  }
+	if (dom) {
+		const obj = {
+			position: "fixed",
+			display: "flex",
+			left: "initial",
+			top: "initial",
+			right: "initial",
+			bottom: "initial"
+		};
+		let key = value.direction;
+		obj[key] = "0";
+		obj["flex-direction"] = key == "left" || key == "right" ? "column" : "row";
+		(0, _fangzhongya_utils_css_setCss.setCss)(el, obj);
+		/**
+		* 获取当前最优方向
+		* @param obj 各个方向的距离值对象
+		* @returns 排序后的最优方向
+		*/
+		const getDirection = (obj) => {
+			return (0, _fangzhongya_utils_basic_object_attrValueSort.attrValueSort)(obj, value.directions || [
+				"left",
+				"right",
+				"top",
+				"bottom"
+			])[0];
+		};
+		const bodyStyle = document.body.style;
+		const cursor = bodyStyle.cursor;
+		/**
+		* 更新元素位置样式
+		* @param event 鼠标事件对象，提供坐标信息
+		*/
+		const setValue = (event) => {
+			(0, _fangzhongya_utils_css_setCss.setCss)(el, key, "initial");
+			key = getDirection({
+				left: event.clientX,
+				top: event.clientY,
+				right: globalThis.innerWidth - event.clientX,
+				bottom: globalThis.innerHeight - event.clientY
+			});
+			(0, _fangzhongya_utils_css_setCss.setCss)(el, {
+				[key]: "0",
+				"flex-direction": key == "left" || key == "right" ? "column" : "row"
+			});
+		};
+		(0, _fangzhongya_utils_dom_getShiftEvent.pressEvent)(dom, () => {
+			bodyStyle.cursor = "move";
+			return true;
+		}, (event) => {
+			if (value.often) setValue(event);
+		}, (event) => {
+			setValue(event);
+			bodyStyle.cursor = cursor;
+		}, void 0, "mouse");
+		(0, _fangzhongya_utils_css_setCss.setCss)(dom, "cursor", "move");
+	}
 }
-const vStick = {
-  name: "Stick",
-  /**
-   * Vue指令的mounted钩子函数，用于在元素挂载时设置DOM相关属性
-   * @param el - 指令绑定的DOM元素
-   * @param binding - 指令绑定的相关信息对象
-   */
-  mounted(el, binding) {
-    const value = binding.value;
-    let dom;
-    if (value.dom) {
-      if (typeof value.dom == "string") {
-        dom = el.querySelector(value.dom);
-      } else {
-        dom = value.dom;
-      }
-    } else {
-      dom = el;
-    }
-    setDom(dom, el, value);
-  }
+/**
+* @title { h3 }  Stick 贴边框
+* @state 1
+*/
+var stick_default = {
+	name: "Stick",
+	/**
+	* Vue指令的mounted钩子函数，用于在元素挂载时设置DOM相关属性
+	* @param el - 指令绑定的DOM元素
+	* @param binding - 指令绑定的相关信息对象
+	*/
+	mounted(el, binding) {
+		const value = binding.value;
+		let dom;
+		if (value.dom) if (typeof value.dom == "string") dom = el.querySelector(value.dom);
+		else dom = value.dom;
+		else dom = el;
+		setDom(dom, el, value);
+	}
 };
-exports.default = vStick;
+//#endregion
+exports.default = stick_default;