@xpyjs/gantt-react 0.0.1-alpha.1 → 0.0.1-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -134,8 +134,6 @@ function MyGantt() {
134
134
  | getInstance | - | `XGantt \| null` | 获取甘特图核心实例,通过实例可调用所有核心方法 |
135
135
  | jumpTo | `date?: any` | `boolean` | 跳转到指定日期(不传参数跳转到今天) |
136
136
 
137
- > **注意**:为了简化API,`updateOptions` 和 `render` 方法已移除。options变化时会自动更新,其他操作请通过 `getInstance()` 获取核心实例进行操作。
138
-
139
137
  ### Hooks
140
138
 
141
139
  #### useXGantt()
@@ -144,11 +142,8 @@ function MyGantt() {
144
142
 
145
143
  - `ganttRef`: 甘特图组件引用
146
144
  - `getInstance()`: 获取核心实例
147
- - `jumpToToday()`: 跳转到今天
148
145
  - `jumpTo(date)`: 跳转到指定日期
149
146
 
150
- > **变更说明**:已移除 `updateGanttOptions()` 和 `renderGantt()` 方法,请通过 `getInstance()` 获取核心实例进行操作。
151
-
152
147
  #### useGanttEvents()
153
148
 
154
149
  提供事件处理的便捷方法:
@@ -173,7 +168,7 @@ function AdvancedGantt() {
173
168
  const instance = getInstance();
174
169
  if (instance) {
175
170
  // 更新配置
176
- instance.updateOptions({
171
+ instance.update({
177
172
  unit: 'week',
178
173
  primaryColor: '#007acc'
179
174
  });
package/dist/index.cjs CHANGED
@@ -9,6 +9,7 @@ const XGanttReact = react.forwardRef(
9
9
  options,
10
10
  className,
11
11
  style,
12
+ onLoaded,
12
13
  onError,
13
14
  onUpdateLink,
14
15
  onCreateLink,
@@ -28,6 +29,9 @@ const XGanttReact = react.forwardRef(
28
29
  const registerEventListeners = react.useCallback(() => {
29
30
  const instance = ganttInstanceRef.current;
30
31
  if (!instance) return;
32
+ if (onLoaded) {
33
+ instance.on("loaded", onLoaded);
34
+ }
31
35
  if (onError) {
32
36
  instance.on("error", onError);
33
37
  }
@@ -65,6 +69,7 @@ const XGanttReact = react.forwardRef(
65
69
  instance.on("move", onMove);
66
70
  }
67
71
  }, [
72
+ onLoaded,
68
73
  onError,
69
74
  onUpdateLink,
70
75
  onCreateLink,
@@ -107,7 +112,7 @@ const XGanttReact = react.forwardRef(
107
112
  }, []);
108
113
  react.useEffect(() => {
109
114
  if (ganttInstanceRef.current) {
110
- ganttInstanceRef.current.updateOptions(options);
115
+ ganttInstanceRef.current.update(options);
111
116
  }
112
117
  }, [options]);
113
118
  return /* @__PURE__ */ jsxRuntime.jsx(
package/dist/index.d.ts CHANGED
@@ -12,6 +12,7 @@ import { IOptionConfig } from '@xpyjs/gantt-core';
12
12
  import { IOptions } from '@xpyjs/gantt-core';
13
13
  import { RefObject } from 'react';
14
14
  import { XGantt } from '@xpyjs/gantt-core';
15
+ import { XGanttUnit } from '@xpyjs/gantt-core';
15
16
 
16
17
  export { Colorjs }
17
18
 
@@ -52,17 +53,17 @@ export { IOptions }
52
53
  * jumpTo(); // 没有参数,默认跳转到今天
53
54
  * };
54
55
  *
55
- * const handleUpdateOptions = () => {
56
+ * const handleUpdate = () => {
56
57
  * const instance = getInstance();
57
58
  * if (instance) {
58
- * instance.updateOptions({ unit: 'week' });
59
+ * instance.update({ unit: 'week' });
59
60
  * }
60
61
  * };
61
62
  *
62
63
  * return (
63
64
  * <div>
64
65
  * <button onClick={handleJumpToToday}>跳转到今天</button>
65
- * <button onClick={handleUpdateOptions}>切换到周视图</button>
66
+ * <button onClick={handleUpdate}>切换到周视图</button>
66
67
  * <XGanttReact
67
68
  * ref={ganttRef}
68
69
  * options={{ data: [] }}
@@ -147,6 +148,12 @@ export declare interface XGanttReactProps extends Omit<React.HTMLAttributes<HTML
147
148
  * 容器的样式
148
149
  */
149
150
  style?: React.CSSProperties;
151
+ /**
152
+ * 加载完成事件回调
153
+ *
154
+ * @description 当甘特图加载完成时触发
155
+ */
156
+ onLoaded?: EventMap["loaded"];
150
157
  /**
151
158
  * 错误事件回调
152
159
  *
@@ -263,7 +270,7 @@ export declare interface XGanttReactRef {
263
270
  * const instance = ganttRef.current?.getInstance();
264
271
  * if (instance) {
265
272
  * // 调用核心实例的方法
266
- * instance.updateOptions({ unit: 'week' });
273
+ * instance.update({ unit: 'week' });
267
274
  * instance.render();
268
275
  * instance.destroy();
269
276
  * }
@@ -300,4 +307,6 @@ export declare interface XGanttReactRef {
300
307
  jumpTo: (date?: any) => boolean;
301
308
  }
302
309
 
310
+ export { XGanttUnit }
311
+
303
312
  export { }
package/dist/index.js CHANGED
@@ -8,6 +8,7 @@ const XGanttReact = forwardRef(
8
8
  options,
9
9
  className,
10
10
  style,
11
+ onLoaded,
11
12
  onError,
12
13
  onUpdateLink,
13
14
  onCreateLink,
@@ -27,6 +28,9 @@ const XGanttReact = forwardRef(
27
28
  const registerEventListeners = useCallback(() => {
28
29
  const instance = ganttInstanceRef.current;
29
30
  if (!instance) return;
31
+ if (onLoaded) {
32
+ instance.on("loaded", onLoaded);
33
+ }
30
34
  if (onError) {
31
35
  instance.on("error", onError);
32
36
  }
@@ -64,6 +68,7 @@ const XGanttReact = forwardRef(
64
68
  instance.on("move", onMove);
65
69
  }
66
70
  }, [
71
+ onLoaded,
67
72
  onError,
68
73
  onUpdateLink,
69
74
  onCreateLink,
@@ -106,7 +111,7 @@ const XGanttReact = forwardRef(
106
111
  }, []);
107
112
  useEffect(() => {
108
113
  if (ganttInstanceRef.current) {
109
- ganttInstanceRef.current.updateOptions(options);
114
+ ganttInstanceRef.current.update(options);
110
115
  }
111
116
  }, [options]);
112
117
  return /* @__PURE__ */ jsx(
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .x-gantt{--x-gantt-border-color: #e5e5e5}.x-gantt-table-container{flex-shrink:0;box-sizing:border-box;height:100%;overflow:hidden;display:flex;flex-direction:column;width:100%}.x-gantt-table-header{flex-shrink:0;box-sizing:border-box;border-bottom:1px solid var(--x-gantt-border-color)!important;display:flex;flex-direction:row;overflow:hidden;position:relative;flex-wrap:nowrap}.x-gantt-table-header .x-gantt-table-header-cell{position:relative;box-sizing:border-box;overflow:hidden;font-weight:var(--x-gantt-header-font-weight);flex-shrink:0;padding:0 8px}.x-gantt-table-header .x-gantt-table-header-cell.border{border-right:1px solid var(--x-gantt-border-color)!important}.x-gantt-table-header .x-gantt-table-header-cell .x-gantt-column-resize-handle{transition:background-color .2s ease}.x-gantt-table-header .x-gantt-table-header-cell .x-gantt-column-resize-handle:hover{background-color:#0000001a!important}.x-gantt-table-header>div:last-child.x-gantt-table-header-group.border>.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header>div:last-child .x-gantt-table-header-group.border>.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header>div:last-child.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header-group{display:flex;flex-direction:column;box-sizing:border-box}.x-gantt-table-header-group>.x-gantt-table-header-cell{border-bottom:1px solid var(--x-gantt-border-color)!important}.x-gantt-table-header-group>.x-gantt-table-header-cell>.x-gantt-table-header-title{text-align:center}.x-gantt-table-header-children{display:flex;flex-direction:row}.x-gantt-table-body{flex:1;overflow:hidden;box-sizing:border-box;position:relative;width:100%;height:100%}.x-gantt-table-row{box-sizing:border-box}.x-gantt-table-row.hover>.x-gantt-table-cell{background-color:var(--x-gantt-row-hover-color, rgba(0, 0, 0, .05))!important}.x-gantt-table-row.selected>.x-gantt-table-cell{background-color:var(--x-gantt-row-selected-color, rgba(0, 0, 0, .1))!important}.x-gantt-table-cell{box-sizing:border-box;display:inline-block;border-bottom:1px solid var(--x-gantt-border-color)!important;padding:var(--x-gantt-cell-padding, 4px 8px)}.x-gantt-table-cell .x-gantt-table-cell__content{box-sizing:border-box}.x-gantt-table-cell.border{border-right:1px solid var(--x-gantt-border-color)!important}.x-gantt-content-wrapper{width:100%;height:100%;scrollbar-width:none}.x-gantt-content-wrapper::-webkit-scrollbar{display:none}.gantt-scrollbar{position:absolute;z-index:10;opacity:0;transition:opacity .2s ease-in-out;pointer-events:none}.gantt-scrollbar.visible{opacity:1;pointer-events:auto}.gantt-scrollbar-thumb{position:absolute;cursor:pointer;transition:background-color .2s ease-in-out,height .1s ease-out,width .1s ease-out,transform .05s linear}.gantt-scrollbar-vertical{top:0;right:0;bottom:0}.gantt-scrollbar-vertical .gantt-scrollbar-thumb-vertical{top:0;left:0;right:0}.gantt-scrollbar-horizontal{left:0;bottom:0;right:0}.gantt-scrollbar-horizontal .gantt-scrollbar-thumb-horizontal{left:0;top:0;bottom:0}.x-gantt-checkbox{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--x-gantt-border-color);border-radius:3px;cursor:pointer;transition:all .15s ease-in-out;box-sizing:border-box;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.x-gantt-checkbox:focus{outline:none}.x-gantt-checkbox:focus-visible{outline:none}.x-gantt-checkbox__icon svg{transition:all .15s ease-in-out}.x-gantt-checkbox:hover{border-color:var(--x-gantt-primary-color)}.x-gantt{width:100%;height:100%;display:flex;box-sizing:border-box;flex-wrap:nowrap;padding:0;margin:0;overflow:hidden;position:relative}.x-gantt.border{border:1px solid var(--x-gantt-border-color)}
1
+ .x-gantt{--x-gantt-border-color: #e5e5e5}.x-gantt-table-container{flex-shrink:0;box-sizing:border-box;height:100%;overflow:hidden;display:flex;flex-direction:column;width:100%}.x-gantt-table-header{flex-shrink:0;box-sizing:border-box;border-bottom:1px solid var(--x-gantt-border-color)!important;display:flex;flex-direction:row;overflow:hidden;position:relative;flex-wrap:nowrap}.x-gantt-table-header .x-gantt-table-header-cell{position:relative;box-sizing:border-box;overflow:hidden;font-weight:var(--x-gantt-header-font-weight);flex-shrink:0;padding:0 8px}.x-gantt-table-header .x-gantt-table-header-cell.border{border-right:1px solid var(--x-gantt-border-color)!important}.x-gantt-table-header .x-gantt-table-header-cell .x-gantt-column-resize-handle{transition:background-color .2s ease}.x-gantt-table-header .x-gantt-table-header-cell .x-gantt-column-resize-handle:hover{background-color:#0000001a!important}.x-gantt-table-header>div:last-child.x-gantt-table-header-group.border>.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header>div:last-child .x-gantt-table-header-group.border>.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header>div:last-child.x-gantt-table-header-cell.border{border-right:none}.x-gantt-table-header-group{display:flex;flex-direction:column;box-sizing:border-box}.x-gantt-table-header-group>.x-gantt-table-header-cell{border-bottom:1px solid var(--x-gantt-border-color)!important}.x-gantt-table-header-group>.x-gantt-table-header-cell>.x-gantt-table-header-title{text-align:center}.x-gantt-table-header-children{display:flex;flex-direction:row}.x-gantt-table-body{flex:1;overflow:hidden;box-sizing:border-box;position:relative;width:100%;height:100%}.x-gantt-table-row{box-sizing:border-box}.x-gantt-table-row.hover>.x-gantt-table-cell{background-color:var(--x-gantt-row-hover-color, rgba(0, 0, 0, .05))!important}.x-gantt-table-row.selected>.x-gantt-table-cell{background-color:var(--x-gantt-row-selected-color, rgba(0, 0, 0, .1))!important}.x-gantt-table-cell{box-sizing:border-box;display:inline-block;border-bottom:1px solid var(--x-gantt-border-color)!important;padding:var(--x-gantt-cell-padding, 4px 8px)}.x-gantt-table-cell .x-gantt-table-cell__content{box-sizing:border-box}.x-gantt-table-cell.border{border-right:1px solid var(--x-gantt-border-color)!important}.x-gantt-content-wrapper{width:100%;height:100%;scrollbar-width:none}.x-gantt-content-wrapper::-webkit-scrollbar{display:none}.gantt-scrollbar{position:absolute;z-index:10;opacity:0;transition:opacity .2s ease-in-out;pointer-events:none}.gantt-scrollbar.visible{opacity:1;pointer-events:auto}.gantt-scrollbar-thumb{position:absolute;cursor:pointer;transition:background-color .2s ease-in-out,height .1s ease-out,width .1s ease-out,transform .05s linear}.gantt-scrollbar-vertical{top:0;right:0;bottom:0}.gantt-scrollbar-vertical .gantt-scrollbar-thumb-vertical{top:0;left:0;right:0}.gantt-scrollbar-horizontal{left:0;bottom:0;right:0}.gantt-scrollbar-horizontal .gantt-scrollbar-thumb-horizontal{left:0;top:0;bottom:0}.x-gantt-checkbox{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--x-gantt-border-color);border-radius:3px;cursor:pointer;transition:all .15s ease-in-out;box-sizing:border-box;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.x-gantt-checkbox:focus{outline:none}.x-gantt-checkbox:focus-visible{outline:none}.x-gantt-checkbox__icon svg{transition:all .15s ease-in-out}.x-gantt-checkbox:hover{border-color:var(--x-gantt-primary-color)}.x-gantt{width:100%;height:100%;display:flex;box-sizing:border-box;flex-wrap:nowrap;padding:0;margin:0;overflow:hidden;position:relative}.x-gantt.border{border:1px solid var(--x-gantt-border-color)}.x-gantt-container{position:relative;height:100%;overflow:hidden}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xpyjs/gantt-react",
3
- "version": "0.0.1-alpha.1",
3
+ "version": "0.0.1-alpha.2",
4
4
  "private": false,
5
5
  "description": "React wrapper for x-gantt",
6
6
  "author": "JeremyJone",
@@ -23,7 +23,7 @@
23
23
  "README.md"
24
24
  ],
25
25
  "dependencies": {
26
- "@xpyjs/gantt-core": "0.0.1-alpha.1"
26
+ "@xpyjs/gantt-core": "0.0.1-alpha.2"
27
27
  },
28
28
  "peerDependencies": {
29
29
  "react": ">=16.8.0",
@@ -67,6 +67,6 @@
67
67
  "test": "vitest",
68
68
  "test:ui": "vitest --ui",
69
69
  "coverage": "vitest run --coverage",
70
- "release": "pnpm publish --access public --no-git-checks"
70
+ "release": "pnpm publish --access public"
71
71
  }
72
72
  }