@qy_better_lib/hooks 0.2.5 → 0.2.6

package/DOCUMENTATION.md

@@ -256,6 +256,8 @@ close();
 
 ### 5. use-mqtt - MQTT功能
 
+> 注意：MQTT功能现在是可选依赖，需要单独导入
+
 #### 功能描述
 适用于需要MQTT通信的场景，支持连接管理、消息订阅和发布。
 
@@ -273,7 +275,7 @@ close();
 
 #### 示例
 ```typescript
-import { use_mqtt } from '@qy_better_lib/hooks';
+import { use_mqtt } from '@qy_better_lib/hooks/use-mqtt';
 
 const { connect, close, subscribe, publish } = use_mqtt('mqtt://localhost:1883', {
   clientId: 'test-client',
@@ -389,6 +391,8 @@ close(() => {
 
 ### 7. use-chart - 图表管理
 
+> 注意：图表管理功能现在是可选依赖，需要单独导入
+
 #### 功能描述
 适用于需要在前端使用ECharts的场景，支持图表渲染、主题切换、响应式设计等功能。
 
@@ -406,7 +410,7 @@ close(() => {
 - **返回类型**: `Promise<any>` - 图表实例
 - **示例**:
   ```typescript
-  import { use_chart } from '@qy_better_lib/hooks';
+  import { use_chart } from '@qy_better_lib/hooks/use-chart';
   
   const { render_chart } = use_chart();
   
@@ -437,7 +441,7 @@ close(() => {
 - **返回类型**: `boolean` - 是否更新成功
 - **示例**:
   ```typescript
-  import { use_chart } from '@qy_better_lib/hooks';
+  import { use_chart } from '@qy_better_lib/hooks/use-chart';
   
   const { update_chart } = use_chart();
   
@@ -457,7 +461,7 @@ close(() => {
 - **返回类型**: `boolean` - 是否删除成功
 - **示例**:
   ```typescript
-  import { use_chart } from '@qy_better_lib/hooks';
+  import { use_chart } from '@qy_better_lib/hooks/use-chart';
   
   const { remove_chart } = use_chart();
   
@@ -473,7 +477,7 @@ close(() => {
 - **返回类型**: `string | null` - 图片URL
 - **示例**:
   ```typescript
-  import { use_chart } from '@qy_better_lib/hooks';
+  import { use_chart } from '@qy_better_lib/hooks/use-chart';
   
   const { export_chart_image } = use_chart();
   
@@ -483,6 +487,8 @@ close(() => {
 
 ### 8. use-layout-flow - 流程图布局
 
+> 注意：流程图布局功能现在是可选依赖，需要单独导入
+
 #### 功能描述
 适用于需要自动布局的流程图场景，支持多种布局方向和自定义元素。
 
@@ -498,7 +504,7 @@ close(() => {
 - **返回类型**: `Promise<boolean>` - 是否初始化成功
 - **示例**:
   ```typescript
-  import { use_layout_flow } from '@qy_better_lib/hooks';
+  import { use_layout_flow } from '@qy_better_lib/hooks/use-layout-flow';
   
   const { init } = use_layout_flow({});
   
@@ -515,7 +521,7 @@ close(() => {
 - **返回类型**: `Promise<boolean>` - 是否布局成功
 - **示例**:
   ```typescript
-  import { use_layout_flow } from '@qy_better_lib/hooks';
+  import { use_layout_flow } from '@qy_better_lib/hooks/use-layout-flow';
   
   const { layout } = use_layout_flow({});
   
@@ -535,7 +541,7 @@ close(() => {
 - **返回类型**: `any[]` - 创建的节点数组
 - **示例**:
   ```typescript
-  import { use_layout_flow } from '@qy_better_lib/hooks';
+  import { use_layout_flow } from '@qy_better_lib/hooks/use-layout-flow';
   
   const { create_nodes } = use_layout_flow({});
   
@@ -567,7 +573,7 @@ close(() => {
 - **返回类型**: `any[]` - 创建的边数组
 - **示例**:
   ```typescript
-  import { use_layout_flow } from '@qy_better_lib/hooks';
+  import { use_layout_flow } from '@qy_better_lib/hooks/use-layout-flow';
   
   const { create_edges } = use_layout_flow({});
   
@@ -670,8 +676,8 @@ close();
 
 ## 注意事项
 
-1. **use-chart** 需要安装 ECharts 依赖：`npm install echarts`
-2. **use-layout-flow** 需要安装 @antv/x6 和 dagre 依赖：`npm install @antv/x6 dagre`
-3. **use-mqtt** 需要安装 mqtt 依赖：`npm install mqtt`
+1. **use-chart** 现在是可选依赖，需要单独导入：`import { use_chart } from '@qy_better_lib/hooks/use-chart'`，并需要安装 ECharts 依赖：`npm install echarts`
+2. **use-layout-flow** 现在是可选依赖，需要单独导入：`import { use_layout_flow } from '@qy_better_lib/hooks/use-layout-flow'`，并需要安装 @antv/x6 和 dagre 依赖：`npm install @antv/x6 dagre`
+3. **use-mqtt** 现在是可选依赖，需要单独导入：`import { use_mqtt } from '@qy_better_lib/hooks/use-mqtt'`，并需要安装 mqtt 依赖：`npm install mqtt`
 4. **use-websocket** 需要确保服务器端支持 WebSocket 协议
 5. **use-print** 在某些浏览器中可能存在兼容性问题，建议在现代浏览器中使用

package/lib/node_modules/@qy_better_lib/core/lib/utils/dom.js

@@ -0,0 +1,14 @@
+function on(element, event, handler, options) {
+  if (element) {
+    element.addEventListener(event, handler, options);
+  }
+}
+function off(element, event, handler, options) {
+  if (element) {
+    element.removeEventListener(event, handler, options);
+  }
+}
+export {
+  off,
+  on
+};

package/lib/node_modules/@qy_better_lib/core/lib/utils/echarts.js

@@ -1,9 +1,4 @@
-function auto_size(size, deflate_width = 1920) {
-  let client_width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
-  if (!client_width) return size;
-  let scale = client_width / deflate_width;
-  return Number((size * scale).toFixed(3));
-}
+import { on, off } from "./dom.js";
 function get_chart_gradient_color(type, start_color, end_color) {
   return {
     type: "linear",
@@ -78,9 +73,9 @@ function make_chart_responsive(chart, debounce_time = 200) {
       resize_chart(chart);
     }, debounce_time);
   };
-  window.addEventListener("resize", resize_handler);
+  on(window, "resize", resize_handler);
   return () => {
-    window.removeEventListener("resize", resize_handler);
+    off(window, "resize", resize_handler);
     clearTimeout(resize_timer);
   };
 }
@@ -152,7 +147,6 @@ function export_chart_image(chart, options = {}) {
 }
 export {
   add_chart_listener,
-  auto_size,
   destroy_chart,
   export_chart_image,
   generate_chart_colors,

package/lib/use-chart/config.js

@@ -1,4 +1,4 @@
-import { auto_size } from "../node_modules/@qy_better_lib/core/lib/utils/echarts.js";
+import { auto_size } from "@qy_better_lib/core";
 const options = {
   textStyle: {
     fontSize: auto_size(12),

package/lib/use-chart/type.d.ts

@@ -82,11 +82,4 @@ export interface UseChartReturn {
      * @param handler 事件处理函数
      */
     remove_chart_listener: (dom_id: string, event_name: string, handler: (...args: any[]) => void) => void;
-    /**
-     * 图表字体、间距自适应
-     * @param size 原始尺寸
-     * @param deflate_width 基准宽度
-     * @returns 自适应后的尺寸
-     */
-    auto_size: (size: number, deflate_width?: number) => number;
 }

package/lib/use-chart.js

@@ -1,6 +1,6 @@
 import { onUnmounted } from "vue";
 import { deep_assign, deep_clone } from "@qy_better_lib/core";
-import { destroy_chart, auto_size, get_chart_gradient_color, generate_chart_colors, remove_chart_listener, add_chart_listener, export_chart_image, resize_chart, merge_chart_options, update_chart, init_chart, make_chart_responsive } from "./node_modules/@qy_better_lib/core/lib/utils/echarts.js";
+import { destroy_chart, get_chart_gradient_color, generate_chart_colors, remove_chart_listener, add_chart_listener, export_chart_image, resize_chart, merge_chart_options, update_chart, init_chart, make_chart_responsive } from "./node_modules/@qy_better_lib/core/lib/utils/echarts.js";
 import options from "./use-chart/config.js";
 function get_chart_theme(theme) {
   {
@@ -188,8 +188,7 @@ function use_chart(options$1 = {}) {
     get_chart_gradient_color,
     export_chart_image: export_chart_image_wrapper,
     add_chart_listener: add_chart_listener_wrapper,
-    remove_chart_listener: remove_chart_listener_wrapper,
-    auto_size
+    remove_chart_listener: remove_chart_listener_wrapper
   };
 }
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@qy_better_lib/hooks",
   "private": false,
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "qy better lib hooks",
   "author": "luhuiming",
   "license": "MIT",
@@ -56,7 +56,7 @@
   },
   "devDependencies": {
     "@antv/x6": "^2.18.1",
-    "@qy_better_lib/core": "^0.2.5",
+    "@qy_better_lib/core": "^0.2.6",
     "@types/dagre": "^0.7.53",
     "@types/node": "^24.5.2",
     "@vitejs/plugin-vue": "^6.0.1",