ebaoferc 0.0.1 → 0.0.2-beta.1

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.
Files changed (141) hide show
  1. package/dist/{FlexRowCol → components/FlexRowCol}/index.js +1 -1
  2. package/dist/components/MindGraph/core/default.d.ts +6 -0
  3. package/dist/components/MindGraph/core/default.js +81 -0
  4. package/dist/components/MindGraph/core/graphic/drag.d.ts +42 -0
  5. package/dist/components/MindGraph/core/graphic/drag.js +120 -0
  6. package/dist/components/MindGraph/core/graphic/index.d.ts +181 -0
  7. package/dist/components/MindGraph/core/graphic/index.js +423 -0
  8. package/dist/components/MindGraph/core/graphic/node-translate-to.d.ts +11 -0
  9. package/dist/components/MindGraph/core/graphic/node-translate-to.js +55 -0
  10. package/dist/components/MindGraph/core/graphic/zoom.d.ts +17 -0
  11. package/dist/components/MindGraph/core/graphic/zoom.js +90 -0
  12. package/dist/components/MindGraph/core/helper/breadth-first-walk-tree.d.ts +5 -0
  13. package/dist/components/MindGraph/core/helper/breadth-first-walk-tree.js +21 -0
  14. package/dist/components/MindGraph/core/helper/depth-first-walk-tree.d.ts +10 -0
  15. package/dist/components/MindGraph/core/helper/depth-first-walk-tree.js +17 -0
  16. package/dist/components/MindGraph/core/helper/descendant.d.ts +6 -0
  17. package/dist/components/MindGraph/core/helper/descendant.js +28 -0
  18. package/dist/components/MindGraph/core/helper/error.d.ts +1 -0
  19. package/dist/components/MindGraph/core/helper/error.js +3 -0
  20. package/dist/components/MindGraph/core/helper/get-layout-calc-children.d.ts +10 -0
  21. package/dist/components/MindGraph/core/helper/get-layout-calc-children.js +37 -0
  22. package/dist/components/MindGraph/core/helper/get-svg-path-id.d.ts +1 -0
  23. package/dist/components/MindGraph/core/helper/get-svg-path-id.js +4 -0
  24. package/dist/components/MindGraph/core/helper/index.d.ts +23 -0
  25. package/dist/components/MindGraph/core/helper/index.js +26 -0
  26. package/dist/components/MindGraph/core/helper/judge-if-all-child-fold.d.ts +7 -0
  27. package/dist/components/MindGraph/core/helper/judge-if-all-child-fold.js +14 -0
  28. package/dist/components/MindGraph/core/helper/judge-if-heir-and-fold.d.ts +10 -0
  29. package/dist/components/MindGraph/core/helper/judge-if-heir-and-fold.js +26 -0
  30. package/dist/components/MindGraph/core/helper/judge-if-visual-leaf.d.ts +6 -0
  31. package/dist/components/MindGraph/core/helper/judge-if-visual-leaf.js +7 -0
  32. package/dist/components/MindGraph/core/helper/root-to-node-array.d.ts +2 -0
  33. package/dist/components/MindGraph/core/helper/root-to-node-array.js +27 -0
  34. package/dist/components/MindGraph/core/helper/transform-root-to-walkable.d.ts +5 -0
  35. package/dist/components/MindGraph/core/helper/transform-root-to-walkable.js +32 -0
  36. package/dist/components/MindGraph/core/helper/with-prefix.d.ts +1 -0
  37. package/dist/components/MindGraph/core/helper/with-prefix.js +3 -0
  38. package/dist/components/MindGraph/core/index.d.ts +394 -0
  39. package/dist/components/MindGraph/core/index.js +86 -0
  40. package/dist/components/MindGraph/core/process/anchor.d.ts +12 -0
  41. package/dist/components/MindGraph/core/process/anchor.js +63 -0
  42. package/dist/components/MindGraph/core/process/index.d.ts +91 -0
  43. package/dist/components/MindGraph/core/process/index.js +30 -0
  44. package/dist/components/MindGraph/core/process/layout/dagre.d.ts +2 -0
  45. package/dist/components/MindGraph/core/process/layout/dagre.js +20 -0
  46. package/dist/components/MindGraph/core/process/layout/descendant-center.d.ts +10 -0
  47. package/dist/components/MindGraph/core/process/layout/descendant-center.js +146 -0
  48. package/dist/components/MindGraph/core/process/layout/heir-center.d.ts +10 -0
  49. package/dist/components/MindGraph/core/process/layout/heir-center.js +52 -0
  50. package/dist/components/MindGraph/core/process/layout/index.d.ts +3 -0
  51. package/dist/components/MindGraph/core/process/layout/index.js +3 -0
  52. package/dist/components/MindGraph/core/process/layout/structured/calc-drag-attach.d.ts +2 -0
  53. package/dist/components/MindGraph/core/process/layout/structured/calc-drag-attach.js +172 -0
  54. package/dist/components/MindGraph/core/process/layout/structured/calc-drop-index.d.ts +2 -0
  55. package/dist/components/MindGraph/core/process/layout/structured/calc-drop-index.js +38 -0
  56. package/dist/components/MindGraph/core/process/layout/structured/get-node-cross-boundary.d.ts +10 -0
  57. package/dist/components/MindGraph/core/process/layout/structured/get-node-cross-boundary.js +35 -0
  58. package/dist/components/MindGraph/core/process/layout/structured/index.d.ts +13 -0
  59. package/dist/components/MindGraph/core/process/layout/structured/index.js +321 -0
  60. package/dist/components/MindGraph/core/process/layout/type.d.ts +44 -0
  61. package/dist/components/MindGraph/core/process/layout/type.js +51 -0
  62. package/dist/components/MindGraph/core/process/line.d.ts +9 -0
  63. package/dist/components/MindGraph/core/process/line.js +69 -0
  64. package/dist/components/MindGraph/core/process/node-valid.d.ts +6 -0
  65. package/dist/components/MindGraph/core/process/node-valid.js +35 -0
  66. package/dist/components/MindGraph/core/process/orientation.d.ts +8 -0
  67. package/dist/components/MindGraph/core/process/orientation.js +40 -0
  68. package/dist/components/MindGraph/core/process/size.d.ts +4 -0
  69. package/dist/components/MindGraph/core/process/size.js +16 -0
  70. package/dist/components/MindGraph/core/process/visible.d.ts +16 -0
  71. package/dist/components/MindGraph/core/process/visible.js +99 -0
  72. package/dist/components/MindGraph/core/render/calc-visible.d.ts +11 -0
  73. package/dist/components/MindGraph/core/render/calc-visible.js +25 -0
  74. package/dist/components/MindGraph/core/render/connect/bezier.d.ts +2 -0
  75. package/dist/components/MindGraph/core/render/connect/bezier.js +12 -0
  76. package/dist/components/MindGraph/core/render/connect/get-path-render.d.ts +2 -0
  77. package/dist/components/MindGraph/core/render/connect/get-path-render.js +17 -0
  78. package/dist/components/MindGraph/core/render/connect/index.d.ts +10 -0
  79. package/dist/components/MindGraph/core/render/connect/index.js +45 -0
  80. package/dist/components/MindGraph/core/render/connect/line.d.ts +2 -0
  81. package/dist/components/MindGraph/core/render/connect/line.js +71 -0
  82. package/dist/components/MindGraph/core/render/connect/temporary-line.d.ts +15 -0
  83. package/dist/components/MindGraph/core/render/connect/temporary-line.js +44 -0
  84. package/dist/components/MindGraph/core/render/index.d.ts +27 -0
  85. package/dist/components/MindGraph/core/render/index.js +8 -0
  86. package/dist/components/MindGraph/core/render/layout.d.ts +12 -0
  87. package/dist/components/MindGraph/core/render/layout.js +85 -0
  88. package/dist/components/MindGraph/demo.js +54 -0
  89. package/dist/components/MindGraph/index.d.ts +3 -0
  90. package/dist/components/MindGraph/index.js +3 -0
  91. package/dist/components/MindGraph/react/component/index.d.ts +3 -0
  92. package/dist/components/MindGraph/react/component/index.js +227 -0
  93. package/dist/components/MindGraph/react/component/index.module.less +72 -0
  94. package/dist/components/MindGraph/react/component/nodes.d.ts +13 -0
  95. package/dist/components/MindGraph/react/component/nodes.js +153 -0
  96. package/dist/components/MindGraph/react/hook/use-drag.d.ts +20 -0
  97. package/dist/components/MindGraph/react/hook/use-drag.js +191 -0
  98. package/dist/components/MindGraph/react/hook/use-shadow-state.d.ts +2 -0
  99. package/dist/components/MindGraph/react/hook/use-shadow-state.js +24 -0
  100. package/dist/components/MindGraph/react/index.d.ts +154 -0
  101. package/dist/components/MindGraph/react/index.js +9 -0
  102. package/dist/components/MindGraph/react/scrollbar/axis/index.d.ts +25 -0
  103. package/dist/components/MindGraph/react/scrollbar/axis/index.js +143 -0
  104. package/dist/components/MindGraph/react/scrollbar/axis/index.module.less +48 -0
  105. package/dist/components/MindGraph/react/scrollbar/index.d.ts +8 -0
  106. package/dist/components/MindGraph/react/scrollbar/index.js +134 -0
  107. package/dist/components/MindGraph/react/tools/class-name-wrapper.d.ts +1 -0
  108. package/dist/components/MindGraph/react/tools/class-name-wrapper.js +5 -0
  109. package/dist/{SliderVerify → components/SliderVerify}/icons/close.js +0 -1
  110. package/dist/{SliderVerify → components/SliderVerify}/icons/refresh.js +0 -1
  111. package/dist/components/SliderVerify/icons/slider.d.ts +1 -0
  112. package/dist/{SliderVerify → components/SliderVerify}/icons/slider.js +0 -1
  113. package/dist/{SliderVerify → components/SliderVerify}/style.module.less +119 -121
  114. package/dist/{StyledQueryFilter → components/StyledQueryFilter}/index.less +22 -22
  115. package/dist/{StyledTable → components/StyledTable}/index.less +11 -11
  116. package/dist/{TabSearchTools → components/TabSearchTools}/index.d.ts +2 -2
  117. package/dist/{TabSearchTools → components/TabSearchTools}/index.js +1 -1
  118. package/dist/components/index.d.ts +6 -0
  119. package/dist/components/index.js +6 -0
  120. package/dist/hooks/index.d.ts +1 -0
  121. package/dist/hooks/index.js +1 -0
  122. package/dist/hooks/useBIHooks/index.d.ts +10 -0
  123. package/dist/hooks/useBIHooks/index.js +64 -0
  124. package/dist/index.d.ts +3 -5
  125. package/dist/index.js +3 -5
  126. package/dist/utils/bi/index.d.ts +2 -0
  127. package/dist/utils/bi/index.js +35 -0
  128. package/dist/utils/format/index.js +8 -8
  129. package/dist/utils/index.d.ts +1 -0
  130. package/dist/utils/index.js +1 -0
  131. package/package.json +33 -20
  132. /package/dist/{FlexRowCol → components/FlexRowCol}/index.d.ts +0 -0
  133. /package/dist/{SliderVerify/icons/close.d.ts → components/MindGraph/demo.d.ts} +0 -0
  134. /package/dist/{SliderVerify/icons/refresh.d.ts → components/SliderVerify/icons/close.d.ts} +0 -0
  135. /package/dist/{SliderVerify/icons/slider.d.ts → components/SliderVerify/icons/refresh.d.ts} +0 -0
  136. /package/dist/{SliderVerify → components/SliderVerify}/index.d.ts +0 -0
  137. /package/dist/{SliderVerify → components/SliderVerify}/index.js +0 -0
  138. /package/dist/{StyledQueryFilter → components/StyledQueryFilter}/index.d.ts +0 -0
  139. /package/dist/{StyledQueryFilter → components/StyledQueryFilter}/index.js +0 -0
  140. /package/dist/{StyledTable → components/StyledTable}/index.d.ts +0 -0
  141. /package/dist/{StyledTable → components/StyledTable}/index.js +0 -0
@@ -0,0 +1,2 @@
1
+ /// <reference types="react" />
2
+ export declare const useShadowState: <T>(init?: T | undefined) => readonly [T, (update: T | ((prevState: T) => T)) => void, import("react").MutableRefObject<T>];
@@ -0,0 +1,24 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { useCallback, useRef, useState } from 'react';
8
+ export var useShadowState = function useShadowState(init) {
9
+ var _useState = useState(init),
10
+ _useState2 = _slicedToArray(_useState, 2),
11
+ state = _useState2[0],
12
+ setState = _useState2[1];
13
+ var shadow = useRef(state);
14
+ var setStateWrapper = useCallback(function (update) {
15
+ var result = update;
16
+ if (typeof update === 'function') {
17
+ result = update(shadow.current);
18
+ }
19
+ shadow.current = result;
20
+ setState(result);
21
+ }, /* eslint-disable-next-line */
22
+ []);
23
+ return [state, setStateWrapper, shadow];
24
+ };
@@ -0,0 +1,154 @@
1
+ import React from 'react';
2
+ import { Mind } from '../core';
3
+ export declare namespace MindReact {
4
+ const View: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<GraphicRef>>;
5
+ interface GraphicRef {
6
+ mind?: Mind.Graphic;
7
+ }
8
+ interface Node extends Omit<Mind.Node, 'sizeof' | 'children'> {
9
+ /**
10
+ * 当设置 size 时,将会禁止自动测量,提升速率
11
+ */
12
+ size?: Mind.Size;
13
+ /**
14
+ * 节点是否受到保护(超出可视区域不会被销毁,但会设置`visible=hidden`)
15
+ * @default false
16
+ */
17
+ beProtected?: boolean;
18
+ /**
19
+ * 是否需要更新节点尺寸(设置为 true 之后会更新一次节点尺寸,后组件将自动设置此值为false)
20
+ * @default false
21
+ */
22
+ needUpdateSize?: boolean;
23
+ /**
24
+ * 节点总是可见(超出可视区域不会被销毁也不会改变`visible`状态)
25
+ * @default false
26
+ */
27
+ alwaysVisible?: boolean;
28
+ /**
29
+ * 禁用尺寸缓存
30
+ * @default false
31
+ */
32
+ disableSizeCache?: boolean;
33
+ /**
34
+ * 子代节点
35
+ */
36
+ children?: Node[];
37
+ /**
38
+ * 节点是否可拖拽
39
+ * @default false
40
+ */
41
+ draggable?: boolean;
42
+ /**
43
+ * 节点是否可被拖拽节点依附作为其子节点
44
+ * @default true
45
+ */
46
+ droppable?: boolean;
47
+ }
48
+ interface Root {
49
+ node: Node;
50
+ positive?: Node[];
51
+ negative?: Node[];
52
+ }
53
+ type Render = (data: Node, mirror: boolean) => React.ReactNode;
54
+ type DragStartEvent = (event: {
55
+ node: Node;
56
+ }) => void;
57
+ type DragEvent = (event: {
58
+ node: Node;
59
+ attach: {
60
+ parent: Node;
61
+ orientation: Mind.Orientation;
62
+ } | undefined;
63
+ mirrorPosition: Mind.Coordinate;
64
+ }) => void;
65
+ type DragEndEvent = (event: {
66
+ node: Node;
67
+ attach: {
68
+ parent: Node;
69
+ orientation: Mind.Orientation;
70
+ index: number;
71
+ } | undefined;
72
+ original: {
73
+ parent: Node;
74
+ orientation: Mind.Orientation;
75
+ };
76
+ }) => void;
77
+ interface ViewProps {
78
+ /**
79
+ * bade mind 配置项
80
+ * - 做浅比较,引用出现改变则重新绘制
81
+ */
82
+ options?: Mind.Options;
83
+ /**
84
+ * 脑图结构数据
85
+ * - 做浅比较,引用出现改变则重新绘制
86
+ * - html 值将由组件自动注入到对象中(不改变对象引用,只是注入值)
87
+ * - 如果节点**长宽固定值**,则,请直接设置 size,避免性能损耗
88
+ */
89
+ data: Root;
90
+ /**
91
+ * 节点渲染器
92
+ * - 做浅比较,引用出现改变则重新绘制
93
+ * - 请在节点**第一次渲染时就确定其尺寸**,当节点尺寸改变时,需要修改`data`引用,唤起重计算
94
+ * - 请保持镜像节点尺寸与源节点尺寸一致
95
+ * @param data 节点数据
96
+ * @param mirror 渲染节点是否为镜像节点(拖拽)
97
+ */
98
+ render: Render;
99
+ /**
100
+ * 渲染锚点数据
101
+ * - 在启动重渲染时保持 anchor 对应节点在屏幕上的相对位置不变
102
+ * - 如不设定,则清空锚点,根节点居中,缩放比归一
103
+ */
104
+ anchor?: string;
105
+ /**
106
+ * 是否展示滚动条
107
+ * - 当展示滚动条时,将会自动限定位移区域
108
+ * - 当隐藏滚动条时,位移范围无限制
109
+ * @default false
110
+ */
111
+ scrollbar?: boolean;
112
+ /**
113
+ * 图形更新完成
114
+ * - 由 data 和 options 改变所引起,脑图控制对象内部状态刷新
115
+ * - 即,此时,脑图所有的状态以及渲染已经完成
116
+ * @param mind 脑图控制对象
117
+ */
118
+ onUpdated?: (mind: Mind.Graphic) => void;
119
+ /**
120
+ * 注入到根上的 `class`
121
+ */
122
+ className?: string;
123
+ /**
124
+ * 注入到根上的 `style`
125
+ */
126
+ style?: React.CSSProperties;
127
+ /**
128
+ * 滚轮移动速度
129
+ * @default 0.5
130
+ */
131
+ wheelMoveSpeed?: number;
132
+ /**
133
+ * 拖拽开始事件
134
+ * @param node 拖拽的节点
135
+ */
136
+ onDragStart?: DragStartEvent;
137
+ /**
138
+ * 拖拽中事件
139
+ * @param event.node 拖拽的节点
140
+ * @param event.attach 拖拽节点关联的节点(关联父级),可能为空
141
+ * @param event.position 拖拽节点镜像中心当前位置
142
+ * @param event.orientation 拖拽节点当前位于哪个区域(位于根节点区域时为空,此时无法附着在任何一个节点上)
143
+ */
144
+ onDrag?: DragEvent;
145
+ /**
146
+ * 拖拽结束事件
147
+ * @param event.node 拖拽的节点
148
+ * @param event.attach 拖拽节点最终关联的节点(关联父级),可能为空
149
+ * @param event.orientation 拖拽节点当前最终位于哪个区域(位于根节点区域时为空,此时无法附着在任何一个节点上)
150
+ * @param event.id 拖拽节点位于最终关联节点子代(关联父级)中的目标位置(-1代表无需改变位置)(需要注意的是,关联的父节点可能仍然是拖动节点自身的父节点)
151
+ */
152
+ onDragEnd?: DragEndEvent;
153
+ }
154
+ }
@@ -0,0 +1,9 @@
1
+ /* eslint-disable @typescript-eslint/no-namespace */
2
+
3
+ import { View as _View } from "./component";
4
+ export var MindReact;
5
+ (function (_MindReact) {
6
+ var View = _MindReact.View = _View;
7
+
8
+ /* eslint-disable */
9
+ })(MindReact || (MindReact = {}));
@@ -0,0 +1,25 @@
1
+ interface AxisProps {
2
+ /**
3
+ * value最大数值
4
+ */
5
+ total: number;
6
+ /**
7
+ * 滑块所占长度(可视区域尺寸,滚动条真实尺寸)
8
+ */
9
+ thumb: number;
10
+ /**
11
+ * 当前值
12
+ */
13
+ value: number;
14
+ /**
15
+ * 滚动位置改变事件
16
+ * @param percentage 滚动比例
17
+ */
18
+ onChange: (percentage: number) => void;
19
+ /**
20
+ * 是否是垂直坐标
21
+ */
22
+ vertical: boolean;
23
+ }
24
+ export declare const Axis: (props: AxisProps) => import("react/jsx-runtime").JSX.Element;
25
+ export {};
@@ -0,0 +1,143 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import * as React from 'react';
8
+ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
9
+ import Classnames from 'classnames';
10
+ import { classNameWrapper } from "../../tools/class-name-wrapper";
11
+
12
+ // @ts-ignore-next-line
13
+ import Style from "./index.module.less";
14
+ import { jsx as _jsx } from "react/jsx-runtime";
15
+ export var Axis = function Axis(props) {
16
+ var total = props.total,
17
+ thumb = props.thumb,
18
+ value = props.value,
19
+ onChange = props.onChange,
20
+ vertical = props.vertical;
21
+ var containerRef = useRef(null);
22
+ // 滑块容器尺度
23
+ // 因为滑块滑到底的时候,实际上还占有了一定区域
24
+ var withThumbTotal = useMemo(function () {
25
+ return total + thumb;
26
+ }, [total, thumb]);
27
+ // 滑块屏幕尺寸(已经缩放转换,为真实屏幕尺寸)
28
+ var thumbSize = useMemo(function () {
29
+ return thumb * thumb / withThumbTotal;
30
+ }, [thumb, withThumbTotal]);
31
+ // 移动距离屏幕尺寸(已经缩放转换,为真实屏幕尺寸))
32
+ var moveDistance = useMemo(function () {
33
+ return value * thumb / withThumbTotal;
34
+ }, [value, thumb, withThumbTotal]);
35
+ // 鼠标是否按下
36
+ var _useState = useState(false),
37
+ _useState2 = _slicedToArray(_useState, 2),
38
+ isMouseDown = _useState2[0],
39
+ setIsMouseDown = _useState2[1];
40
+ // 开始位移时的位置
41
+ var startMovePosition = useRef();
42
+ var thumbStyle = useMemo(function () {
43
+ var result = {};
44
+ if (vertical) {
45
+ result.height = "".concat(thumbSize, "px");
46
+ result.transform = "translateY(".concat(moveDistance, "px)");
47
+ } else {
48
+ result.width = "".concat(thumbSize, "px");
49
+ result.transform = "translateX(".concat(moveDistance, "px)");
50
+ }
51
+ return result;
52
+ }, [thumbSize, moveDistance, vertical]);
53
+ var onChangeDispose = useCallback(function (screenPercentage) {
54
+ // 限定范围
55
+ if (screenPercentage < 0) {
56
+ screenPercentage = 0;
57
+ } else if (screenPercentage > 1 - thumbSize / thumb) {
58
+ screenPercentage = 1 - thumbSize / thumb;
59
+ }
60
+
61
+ // 得出虚拟尺寸
62
+ // 计算位移比例
63
+ onChange(screenPercentage * withThumbTotal / total);
64
+ }, [onChange, total, withThumbTotal]);
65
+ var onClick = useCallback(function (e) {
66
+ // 避免拖动事件干扰
67
+ if (e.target === containerRef.current) {
68
+ var diff = 0;
69
+ // 计算比例,滑块居中处理
70
+ if (vertical) {
71
+ // 计算比例,滑块居中处理
72
+ diff = (e.nativeEvent.offsetY - thumbSize / 2) / thumb;
73
+ } else {
74
+ diff = (e.nativeEvent.offsetX - thumbSize / 2) / thumb;
75
+ }
76
+ onChangeDispose(diff);
77
+ }
78
+ e.stopPropagation();
79
+ }, [thumb, thumbSize, onChangeDispose]);
80
+ var onMouseMove = useCallback(function (e) {
81
+ if (!isMouseDown) {
82
+ return;
83
+ }
84
+ if (!startMovePosition.current) {
85
+ startMovePosition.current = {
86
+ absolute: 0,
87
+ relative: 0
88
+ };
89
+ startMovePosition.current.relative = moveDistance;
90
+ if (vertical) {
91
+ startMovePosition.current.absolute = e.clientY;
92
+ } else {
93
+ startMovePosition.current.absolute = e.clientX;
94
+ }
95
+ }
96
+ var absolute = 0;
97
+ if (vertical) {
98
+ absolute = e.clientY;
99
+ } else {
100
+ absolute = e.clientX;
101
+ }
102
+ var diff = absolute - startMovePosition.current.absolute;
103
+ var result = diff + startMovePosition.current.relative;
104
+ onChangeDispose(result / thumb);
105
+ e.stopPropagation();
106
+ }, [onChangeDispose, isMouseDown, moveDistance, vertical, thumb]);
107
+ // 全局监听 move 事件
108
+ useEffect(function () {
109
+ window.addEventListener('mousemove', onMouseMove);
110
+ return function () {
111
+ return window.removeEventListener('mousemove', onMouseMove);
112
+ };
113
+ }, [onMouseMove]);
114
+
115
+ // 全局监听鼠标松开事件
116
+ useEffect(function () {
117
+ var onMouseUp = function onMouseUp(e) {
118
+ setIsMouseDown(false);
119
+ startMovePosition.current = undefined;
120
+ e.stopPropagation();
121
+ };
122
+ window.addEventListener('mouseup', onMouseUp);
123
+ return function () {
124
+ return window.removeEventListener('mouseup', onMouseUp);
125
+ };
126
+ }, [setIsMouseDown]);
127
+ return /*#__PURE__*/_jsx("div", {
128
+ className: Classnames(classNameWrapper(Style, 'axis'), classNameWrapper(Style, vertical ? 'axis--y' : 'axis--x'), isMouseDown ? classNameWrapper(Style, 'axis--active') : ''),
129
+ onClick: onClick,
130
+ ref: containerRef,
131
+ children: /*#__PURE__*/_jsx("div", {
132
+ className: classNameWrapper(Style, 'thumb'),
133
+ style: thumbStyle,
134
+ onMouseDown: function onMouseDown(e) {
135
+ setIsMouseDown(true);
136
+ // 禁用默认(防止选中文字)
137
+ e.preventDefault();
138
+ e.stopPropagation();
139
+ return false;
140
+ }
141
+ })
142
+ });
143
+ };
@@ -0,0 +1,48 @@
1
+ @size: 8px;
2
+ @border-radius: 4px;
3
+ @active-background: #7a7374;
4
+
5
+ .axis{
6
+ position: absolute;
7
+
8
+ .thumb{
9
+ position: absolute;
10
+ left: 0;
11
+ top: 0;
12
+ border-radius: @border-radius;
13
+ // 大理石灰
14
+ background: #c4cbcf;
15
+
16
+ &:hover{
17
+ background: @active-background;
18
+ }
19
+ }
20
+
21
+ &--active{
22
+ .thumb{
23
+ background: @active-background;
24
+ }
25
+ }
26
+
27
+ &--y{
28
+ right: 0;
29
+ top: 0;
30
+ height: 100%;
31
+ width: @size;
32
+
33
+ .thumb{
34
+ width: 100%;
35
+ }
36
+ }
37
+
38
+ &--x{
39
+ left: 0;
40
+ bottom: 0;
41
+ width: 100%;
42
+ height: @size;
43
+
44
+ .thumb{
45
+ height: 100%;
46
+ }
47
+ }
48
+ }
@@ -0,0 +1,8 @@
1
+ import { Mind } from '../../core';
2
+ export declare const Scrollbar: (props: {
3
+ viewport?: HTMLElement | null | undefined;
4
+ container?: HTMLElement | null | undefined;
5
+ mind?: Mind.Graphic | undefined;
6
+ transform?: Mind.Transform | undefined;
7
+ options: Mind.Options;
8
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,134 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
5
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
6
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
7
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
8
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
9
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
10
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
11
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
12
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
13
+ import React, { useEffect, useState } from 'react';
14
+ import { Axis } from "./axis";
15
+ import { jsx as _jsx } from "react/jsx-runtime";
16
+ import { jsxs as _jsxs } from "react/jsx-runtime";
17
+ export var Scrollbar = function Scrollbar(props) {
18
+ var viewport = props.viewport,
19
+ container = props.container,
20
+ mind = props.mind,
21
+ transform = props.transform,
22
+ options = props.options;
23
+ var _useState = useState({
24
+ x: {
25
+ max: 0,
26
+ min: 0
27
+ },
28
+ y: {
29
+ max: 0,
30
+ min: 0
31
+ }
32
+ }),
33
+ _useState2 = _slicedToArray(_useState, 2),
34
+ boundary = _useState2[0],
35
+ setBoundary = _useState2[1];
36
+ var _useState3 = useState({
37
+ height: 0,
38
+ width: 0
39
+ }),
40
+ _useState4 = _slicedToArray(_useState3, 2),
41
+ viewportSize = _useState4[0],
42
+ setViewportSize = _useState4[1];
43
+ var _useState5 = useState({
44
+ height: 0,
45
+ width: 0
46
+ }),
47
+ _useState6 = _slicedToArray(_useState5, 2),
48
+ containerSize = _useState6[0],
49
+ setContainerSize = _useState6[1];
50
+
51
+ // 监听视窗和容器尺寸改变
52
+ useEffect(function () {
53
+ if (viewport && container) {
54
+ var observer = new ResizeObserver(function () {
55
+ setViewportSize({
56
+ height: viewport.clientHeight,
57
+ width: viewport.clientWidth
58
+ });
59
+ setContainerSize({
60
+ height: container.clientHeight,
61
+ width: container.clientWidth
62
+ });
63
+ });
64
+ observer.observe(viewport);
65
+ observer.observe(container);
66
+ return function () {
67
+ observer.unobserve(viewport);
68
+ observer.unobserve(container);
69
+ };
70
+ }
71
+ }, [viewport, container]);
72
+ useEffect(function () {
73
+ if (containerSize.width && viewportSize.width && transform && mind) {
74
+ // 设定位移边界
75
+ mind.setOptions({
76
+ zoomExtent: {
77
+ translate: [{
78
+ x: -viewportSize.width / transform.scale,
79
+ y: -viewportSize.height / transform.scale
80
+ }, {
81
+ x: containerSize.width + viewportSize.width / transform.scale,
82
+ y: containerSize.height + viewportSize.height / transform.scale
83
+ }]
84
+ }
85
+ }, true);
86
+
87
+ // 设定边界
88
+ setBoundary({
89
+ x: {
90
+ max: viewportSize.width,
91
+ min: -containerSize.width * transform.scale
92
+ },
93
+ y: {
94
+ max: viewportSize.height,
95
+ min: -containerSize.height * transform.scale
96
+ }
97
+ });
98
+ }
99
+ },
100
+ // 当 options 改变时,需要为mind重新设定 zoom 界限
101
+ [containerSize, viewportSize, options, transform, mind]);
102
+
103
+ // 没有初始化完成之前不展示滚动条
104
+ if (!viewport || !container || !mind || !transform || !containerSize.width || !viewportSize.width) {
105
+ return /*#__PURE__*/_jsx(React.Fragment, {});
106
+ }
107
+ return /*#__PURE__*/_jsxs(React.Fragment, {
108
+ children: [/*#__PURE__*/_jsx(Axis, {
109
+ total: boundary.x.max - boundary.x.min,
110
+ thumb: viewportSize.width,
111
+ value: boundary.x.max - transform.x,
112
+ onChange: function onChange(percentage) {
113
+ if (mind) {
114
+ mind.setTransform(_objectSpread(_objectSpread({}, mind.getTransform()), {}, {
115
+ x: boundary.x.max - (boundary.x.max - boundary.x.min) * percentage
116
+ }));
117
+ }
118
+ },
119
+ vertical: false
120
+ }), /*#__PURE__*/_jsx(Axis, {
121
+ total: boundary.y.max - boundary.y.min,
122
+ thumb: viewportSize.height,
123
+ value: boundary.y.max - transform.y,
124
+ onChange: function onChange(percentage) {
125
+ if (mind) {
126
+ mind.setTransform(_objectSpread(_objectSpread({}, mind.getTransform()), {}, {
127
+ y: boundary.y.max - (boundary.y.max - boundary.y.min) * percentage
128
+ }));
129
+ }
130
+ },
131
+ vertical: true
132
+ })]
133
+ });
134
+ };
@@ -0,0 +1 @@
1
+ export declare const classNameWrapper: (style: Record<string, any>, name: string) => string;
@@ -0,0 +1,5 @@
1
+ import Classnames from 'classnames';
2
+ export var classNameWrapper = function classNameWrapper(style, name) {
3
+ // 添加 global class
4
+ return Classnames(style[name], "mind-react__".concat(name));
5
+ };
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import { jsx as _jsx } from "react/jsx-runtime";
3
2
  import { jsxs as _jsxs } from "react/jsx-runtime";
4
3
  export default function () {
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import { jsx as _jsx } from "react/jsx-runtime";
3
2
  import { jsxs as _jsxs } from "react/jsx-runtime";
4
3
  export default function () {
@@ -0,0 +1 @@
1
+ export default function (): import("react/jsx-runtime").JSX.Element;
@@ -1,4 +1,3 @@
1
- import React from 'react';
2
1
  import { jsx as _jsx } from "react/jsx-runtime";
3
2
  import { jsxs as _jsxs } from "react/jsx-runtime";
4
3
  export default function () {