tntd 3.0.25 → 3.0.26

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 (191) hide show
  1. package/CHANGELOG.json +1034 -0
  2. package/CHANGELOG.md +605 -0
  3. package/es/checkbox/checkbox-group.js +5 -0
  4. package/es/checkbox/checkbox-group.js.map +1 -0
  5. package/es/radio/radio-group.js +5 -0
  6. package/es/radio/radio-group.js.map +1 -0
  7. package/es/steps/stepStyle/small.less +5 -0
  8. package/es/table/table.js +11 -7
  9. package/es/table/table.js.map +1 -1
  10. package/es/tntd-virtual-tree/index.less +2 -2
  11. package/es/tntd-virtual-tree-select/index.js +4 -2
  12. package/es/tntd-virtual-tree-select/index.js.map +1 -1
  13. package/es/upload/svg/UploadSVG.js +37 -0
  14. package/es/upload/svg/UploadSVG.js.map +1 -0
  15. package/es/upload/upload.less +108 -0
  16. package/lib/checkbox/checkbox-group.d.ts +8 -0
  17. package/lib/checkbox/checkbox-group.d.ts.map +1 -0
  18. package/lib/checkbox/checkbox-group.js +12 -0
  19. package/lib/checkbox/checkbox-group.js.map +1 -0
  20. package/lib/radio/radio-group.d.ts +8 -0
  21. package/lib/radio/radio-group.d.ts.map +1 -0
  22. package/lib/radio/radio-group.js +12 -0
  23. package/lib/radio/radio-group.js.map +1 -0
  24. package/lib/steps/stepStyle/small.less +5 -0
  25. package/lib/table/table.d.ts +1 -1
  26. package/lib/table/table.d.ts.map +1 -1
  27. package/lib/table/table.js +14 -7
  28. package/lib/table/table.js.map +1 -1
  29. package/lib/tntd-virtual-tree/index.less +2 -2
  30. package/lib/tntd-virtual-tree-select/index.d.ts +2 -1
  31. package/lib/tntd-virtual-tree-select/index.d.ts.map +1 -1
  32. package/lib/tntd-virtual-tree-select/index.js +6 -3
  33. package/lib/tntd-virtual-tree-select/index.js.map +1 -1
  34. package/lib/{query-form-v3/Field/Composition/Select.d.ts → upload/svg/UploadSVG.d.ts} +1 -1
  35. package/lib/upload/svg/UploadSVG.d.ts.map +1 -0
  36. package/lib/upload/svg/UploadSVG.js +44 -0
  37. package/lib/upload/svg/UploadSVG.js.map +1 -0
  38. package/lib/upload/upload.less +108 -0
  39. package/lib/utils/index.d.ts +1 -0
  40. package/lib/utils/index.d.ts.map +1 -1
  41. package/package.json +2 -2
  42. package/es/query-form/Field/Composition/FieldPopover.js +0 -310
  43. package/es/query-form/Field/Composition/FieldPopover.js.map +0 -1
  44. package/es/query-form/Field/Composition/FieldPopover.less +0 -35
  45. package/es/query-form/Field/Composition/Select.js +0 -122
  46. package/es/query-form/Field/Composition/Select.js.map +0 -1
  47. package/es/query-form/Field/Composition/index.js +0 -248
  48. package/es/query-form/Field/Composition/index.js.map +0 -1
  49. package/es/query-form/Field/Composition/index.less +0 -118
  50. package/es/query-form/Field/Composition/utils.js +0 -153
  51. package/es/query-form/Field/Composition/utils.js.map +0 -1
  52. package/es/query-form-v2/index.less +0 -133
  53. package/es/scroll-bar/Bar.js +0 -56
  54. package/es/scroll-bar/Bar.js.map +0 -1
  55. package/es/scroll-bar/Context.js +0 -6
  56. package/es/scroll-bar/Context.js.map +0 -1
  57. package/es/scroll-bar/ScrollBar.js +0 -86
  58. package/es/scroll-bar/ScrollBar.js.map +0 -1
  59. package/es/scroll-bar/Thumb.js +0 -105
  60. package/es/scroll-bar/Thumb.js.map +0 -1
  61. package/es/scroll-bar/index.js +0 -3
  62. package/es/scroll-bar/index.js.map +0 -1
  63. package/es/scroll-bar/scrollBar.less +0 -59
  64. package/es/scroll-bar/util.js +0 -31
  65. package/es/scroll-bar/util.js.map +0 -1
  66. package/lib/query-form/Field/Composition/FieldPopover.d.ts +0 -19
  67. package/lib/query-form/Field/Composition/FieldPopover.d.ts.map +0 -1
  68. package/lib/query-form/Field/Composition/FieldPopover.js +0 -345
  69. package/lib/query-form/Field/Composition/FieldPopover.js.map +0 -1
  70. package/lib/query-form/Field/Composition/FieldPopover.less +0 -35
  71. package/lib/query-form/Field/Composition/Select.d.ts +0 -4
  72. package/lib/query-form/Field/Composition/Select.d.ts.map +0 -1
  73. package/lib/query-form/Field/Composition/Select.js +0 -146
  74. package/lib/query-form/Field/Composition/Select.js.map +0 -1
  75. package/lib/query-form/Field/Composition/index.d.ts +0 -12
  76. package/lib/query-form/Field/Composition/index.d.ts.map +0 -1
  77. package/lib/query-form/Field/Composition/index.js +0 -294
  78. package/lib/query-form/Field/Composition/index.js.map +0 -1
  79. package/lib/query-form/Field/Composition/index.less +0 -118
  80. package/lib/query-form/Field/Composition/utils.d.ts +0 -21
  81. package/lib/query-form/Field/Composition/utils.d.ts.map +0 -1
  82. package/lib/query-form/Field/Composition/utils.js +0 -164
  83. package/lib/query-form/Field/Composition/utils.js.map +0 -1
  84. package/lib/query-form-v2/Field/Checkbox.d.ts +0 -8
  85. package/lib/query-form-v2/Field/Checkbox.d.ts.map +0 -1
  86. package/lib/query-form-v2/Field/Checkbox.js +0 -28
  87. package/lib/query-form-v2/Field/Checkbox.js.map +0 -1
  88. package/lib/query-form-v2/Field/Select.d.ts +0 -4
  89. package/lib/query-form-v2/Field/Select.d.ts.map +0 -1
  90. package/lib/query-form-v2/Field/Select.js +0 -80
  91. package/lib/query-form-v2/Field/Select.js.map +0 -1
  92. package/lib/query-form-v2/Field/SelectInput.d.ts +0 -4
  93. package/lib/query-form-v2/Field/SelectInput.d.ts.map +0 -1
  94. package/lib/query-form-v2/Field/SelectInput.js +0 -88
  95. package/lib/query-form-v2/Field/SelectInput.js.map +0 -1
  96. package/lib/query-form-v2/Field/fieldsMap.d.ts +0 -24
  97. package/lib/query-form-v2/Field/fieldsMap.d.ts.map +0 -1
  98. package/lib/query-form-v2/Field/fieldsMap.js +0 -35
  99. package/lib/query-form-v2/Field/fieldsMap.js.map +0 -1
  100. package/lib/query-form-v2/Field/index.d.ts +0 -14
  101. package/lib/query-form-v2/Field/index.d.ts.map +0 -1
  102. package/lib/query-form-v2/Field/index.js +0 -146
  103. package/lib/query-form-v2/Field/index.js.map +0 -1
  104. package/lib/query-form-v2/createActions.d.ts +0 -14
  105. package/lib/query-form-v2/createActions.d.ts.map +0 -1
  106. package/lib/query-form-v2/createActions.js +0 -54
  107. package/lib/query-form-v2/createActions.js.map +0 -1
  108. package/lib/query-form-v2/index.d.ts +0 -39
  109. package/lib/query-form-v2/index.d.ts.map +0 -1
  110. package/lib/query-form-v2/index.js +0 -391
  111. package/lib/query-form-v2/index.js.map +0 -1
  112. package/lib/query-form-v2/index.less +0 -133
  113. package/lib/query-form-v2/useForm.d.ts +0 -13
  114. package/lib/query-form-v2/useForm.d.ts.map +0 -1
  115. package/lib/query-form-v2/useForm.js +0 -13
  116. package/lib/query-form-v2/useForm.js.map +0 -1
  117. package/lib/query-form-v3/Field/Checkbox.d.ts +0 -8
  118. package/lib/query-form-v3/Field/Checkbox.d.ts.map +0 -1
  119. package/lib/query-form-v3/Field/Checkbox.js +0 -28
  120. package/lib/query-form-v3/Field/Checkbox.js.map +0 -1
  121. package/lib/query-form-v3/Field/Composition/FieldPopover.d.ts +0 -19
  122. package/lib/query-form-v3/Field/Composition/FieldPopover.d.ts.map +0 -1
  123. package/lib/query-form-v3/Field/Composition/FieldPopover.js +0 -381
  124. package/lib/query-form-v3/Field/Composition/FieldPopover.js.map +0 -1
  125. package/lib/query-form-v3/Field/Composition/FieldPopover.less +0 -35
  126. package/lib/query-form-v3/Field/Composition/Select.d.ts.map +0 -1
  127. package/lib/query-form-v3/Field/Composition/Select.js +0 -131
  128. package/lib/query-form-v3/Field/Composition/Select.js.map +0 -1
  129. package/lib/query-form-v3/Field/Composition/index.d.ts +0 -10
  130. package/lib/query-form-v3/Field/Composition/index.d.ts.map +0 -1
  131. package/lib/query-form-v3/Field/Composition/index.js +0 -255
  132. package/lib/query-form-v3/Field/Composition/index.js.map +0 -1
  133. package/lib/query-form-v3/Field/Composition/index.less +0 -118
  134. package/lib/query-form-v3/Field/Composition/utils.d.ts +0 -22
  135. package/lib/query-form-v3/Field/Composition/utils.d.ts.map +0 -1
  136. package/lib/query-form-v3/Field/Composition/utils.js +0 -147
  137. package/lib/query-form-v3/Field/Composition/utils.js.map +0 -1
  138. package/lib/query-form-v3/Field/Select.d.ts +0 -4
  139. package/lib/query-form-v3/Field/Select.d.ts.map +0 -1
  140. package/lib/query-form-v3/Field/Select.js +0 -80
  141. package/lib/query-form-v3/Field/Select.js.map +0 -1
  142. package/lib/query-form-v3/Field/SelectInput.d.ts +0 -4
  143. package/lib/query-form-v3/Field/SelectInput.d.ts.map +0 -1
  144. package/lib/query-form-v3/Field/SelectInput.js +0 -100
  145. package/lib/query-form-v3/Field/SelectInput.js.map +0 -1
  146. package/lib/query-form-v3/Field/fieldsMap.d.ts +0 -27
  147. package/lib/query-form-v3/Field/fieldsMap.d.ts.map +0 -1
  148. package/lib/query-form-v3/Field/fieldsMap.js +0 -35
  149. package/lib/query-form-v3/Field/fieldsMap.js.map +0 -1
  150. package/lib/query-form-v3/Field/index.d.ts +0 -14
  151. package/lib/query-form-v3/Field/index.d.ts.map +0 -1
  152. package/lib/query-form-v3/Field/index.js +0 -147
  153. package/lib/query-form-v3/Field/index.js.map +0 -1
  154. package/lib/query-form-v3/createActions.d.ts +0 -14
  155. package/lib/query-form-v3/createActions.d.ts.map +0 -1
  156. package/lib/query-form-v3/createActions.js +0 -54
  157. package/lib/query-form-v3/createActions.js.map +0 -1
  158. package/lib/query-form-v3/index.d.ts +0 -27
  159. package/lib/query-form-v3/index.d.ts.map +0 -1
  160. package/lib/query-form-v3/index.js +0 -206
  161. package/lib/query-form-v3/index.js.map +0 -1
  162. package/lib/query-form-v3/index.less +0 -91
  163. package/lib/query-form-v3/useForm.d.ts +0 -13
  164. package/lib/query-form-v3/useForm.d.ts.map +0 -1
  165. package/lib/query-form-v3/useForm.js +0 -13
  166. package/lib/query-form-v3/useForm.js.map +0 -1
  167. package/lib/scroll-bar/Bar.d.ts +0 -4
  168. package/lib/scroll-bar/Bar.d.ts.map +0 -1
  169. package/lib/scroll-bar/Bar.js +0 -91
  170. package/lib/scroll-bar/Bar.js.map +0 -1
  171. package/lib/scroll-bar/Context.d.ts +0 -7
  172. package/lib/scroll-bar/Context.d.ts.map +0 -1
  173. package/lib/scroll-bar/Context.js +0 -13
  174. package/lib/scroll-bar/Context.js.map +0 -1
  175. package/lib/scroll-bar/ScrollBar.d.ts +0 -4
  176. package/lib/scroll-bar/ScrollBar.d.ts.map +0 -1
  177. package/lib/scroll-bar/ScrollBar.js +0 -97
  178. package/lib/scroll-bar/ScrollBar.js.map +0 -1
  179. package/lib/scroll-bar/Thumb.d.ts +0 -3
  180. package/lib/scroll-bar/Thumb.d.ts.map +0 -1
  181. package/lib/scroll-bar/Thumb.js +0 -125
  182. package/lib/scroll-bar/Thumb.js.map +0 -1
  183. package/lib/scroll-bar/index.d.ts +0 -3
  184. package/lib/scroll-bar/index.d.ts.map +0 -1
  185. package/lib/scroll-bar/index.js +0 -10
  186. package/lib/scroll-bar/index.js.map +0 -1
  187. package/lib/scroll-bar/scrollBar.less +0 -59
  188. package/lib/scroll-bar/util.d.ts +0 -40
  189. package/lib/scroll-bar/util.d.ts.map +0 -1
  190. package/lib/scroll-bar/util.js +0 -39
  191. package/lib/scroll-bar/util.js.map +0 -1
@@ -1,153 +0,0 @@
1
- import _flatten from "lodash/flatten";
2
- import _isString from "lodash/isString";
3
- import _isArray from "lodash/isArray";
4
- import React from 'react';
5
- import moment from 'moment';
6
- export function highlightSubstring(str, substring) {
7
- const highlighted = `<span class="tnt-highlight">${substring}</span>`;
8
- return str.replace(new RegExp(substring, 'g'), highlighted);
9
- }
10
- export function getLabelByValue({
11
- value,
12
- options,
13
- fieldNames = {
14
- label: 'label',
15
- value: 'value'
16
- }
17
- }) {
18
- const getLabel = value => {
19
- const target = options === null || options === void 0 ? void 0 : options.find(item => {
20
- const valueKey = fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.value;
21
- const itemValue = item instanceof Object ? item[valueKey] : item;
22
- return itemValue === value;
23
- });
24
- if (target) {
25
- return target instanceof Object ? target === null || target === void 0 ? void 0 : target[fieldNames === null || fieldNames === void 0 ? void 0 : fieldNames.label] : target;
26
- } else {
27
- return value;
28
- }
29
- };
30
- if (_isArray(value)) {
31
- return value.map(getLabel).join(' | ');
32
- } else {
33
- return getLabel(value);
34
- }
35
- }
36
- export function formatLabel(reactDom) {
37
- return _flatten(React.Children.map(reactDom.props.children, child => {
38
- if (React.isValidElement(child)) {
39
- return formatLabel(child);
40
- } else if (_isString(child)) {
41
- return child;
42
- }
43
- return '';
44
- })).join('');
45
- }
46
- export function parseObjectToArray(value, data) {
47
- var _a, _b;
48
- return (_b = (_a = Object.keys(value || {})) === null || _a === void 0 ? void 0 : _a.map(key => {
49
- var _a;
50
- const target = data === null || data === void 0 ? void 0 : data.find(item => {
51
- var _a;
52
- return ((_a = item.props) === null || _a === void 0 ? void 0 : _a.name) === key;
53
- });
54
- if (!target) return null;
55
- const dataItem = (target === null || target === void 0 ? void 0 : target.props) || {};
56
- const {
57
- type,
58
- component,
59
- setLabel,
60
- props: fieldProps
61
- } = dataItem || {};
62
- const {
63
- options
64
- } = fieldProps || {};
65
- if (!type && component) {
66
- if (!setLabel) {
67
- console.error('自定义组件需要传入setLabel()方法');
68
- }
69
- } else if (options) {
70
- if (type === 'selectInput') {
71
- const selectKey = (_a = Object.keys(value[key] || {})) === null || _a === void 0 ? void 0 : _a[0];
72
- if (!selectKey) {
73
- // 17. inputSelect组件,初始值{},展示undefined:undefined
74
- return false;
75
- }
76
- return {
77
- key,
78
- value: value[key],
79
- closable: true
80
- };
81
- }
82
- }
83
- return {
84
- key,
85
- value: value[key],
86
- closable: true
87
- };
88
- })) === null || _b === void 0 ? void 0 : _b.filter(item => !!item);
89
- }
90
- export function parseArrayToObject(value) {
91
- return value === null || value === void 0 ? void 0 : value.reduce((acc, v) => {
92
- acc[v.key] = v.value;
93
- return acc;
94
- }, {});
95
- }
96
- export function getLabel({
97
- key,
98
- value
99
- }, data, locale) {
100
- var _a, _b, _c;
101
- const target = data === null || data === void 0 ? void 0 : data.find(item => {
102
- var _a;
103
- return ((_a = item.props) === null || _a === void 0 ? void 0 : _a.name) === key;
104
- });
105
- if (!target) return null;
106
- const dataItem = (target === null || target === void 0 ? void 0 : target.props) || {};
107
- const {
108
- type,
109
- setLabel,
110
- props: fieldProps,
111
- propsTitle,
112
- title,
113
- name
114
- } = dataItem || {};
115
- const _propsTitle = propsTitle || title || name;
116
- const {
117
- options,
118
- format
119
- } = fieldProps || {};
120
- let labelValue = value;
121
- if (setLabel) {
122
- // setLabel: 对于自定义组件,无法控制label的显示,可以通过setLabel方法控制
123
- labelValue = setLabel(value);
124
- } else if (options) {
125
- if (type === 'selectInput') {
126
- const selectKey = (_a = Object.keys(value || {})) === null || _a === void 0 ? void 0 : _a[0];
127
- if (!selectKey) {
128
- // 17. inputSelect组件,初始值{},展示undefined:undefined
129
- return false;
130
- }
131
- const inputValue = value[selectKey];
132
- const selectLabel = (_b = options === null || options === void 0 ? void 0 : options.find(v => v.value === selectKey)) === null || _b === void 0 ? void 0 : _b.label;
133
- return selectLabel + ':' + inputValue;
134
- }
135
- labelValue = getLabelByValue({
136
- value,
137
- options,
138
- fieldNames: ((_c = dataItem === null || dataItem === void 0 ? void 0 : dataItem.props) === null || _c === void 0 ? void 0 : _c.fieldNames) || {
139
- label: 'label',
140
- value: 'value'
141
- }
142
- });
143
- } else if (type === 'checkbox') {
144
- labelValue = value ? locale.yes : locale.no;
145
- } else if (type === 'dateRange' && format) {
146
- if (value === null || value === void 0 ? void 0 : value.length) {
147
- labelValue = [moment(value === null || value === void 0 ? void 0 : value[0]).format(format), moment(value === null || value === void 0 ? void 0 : value[1]).format(format)].join('~');
148
- }
149
- } else if (type === 'date' && format) {
150
- labelValue = value ? moment(value).format(format) : undefined;
151
- }
152
- return _propsTitle + ':' + (labelValue === undefined ? '' : labelValue);
153
- }
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/query-form/Field/Composition/utils.js"],"names":[],"mappings":"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","sourcesContent":["import React from 'react'\nimport { isArray, isString, flatten } from 'lodash'\nimport moment from 'moment'\n\nexport function highlightSubstring(str, substring) {\n const highlighted = `<span class=\"tnt-highlight\">${substring}</span>`\n return str.replace(new RegExp(substring, 'g'), highlighted)\n}\n\nexport function getLabelByValue({\n value,\n options,\n fieldNames = {\n label: 'label',\n value: 'value',\n },\n}) {\n const getLabel = (value) => {\n const target = options?.find((item) => {\n const valueKey = fieldNames?.value\n const itemValue = item instanceof Object ? item[valueKey] : item\n return itemValue === value\n })\n if (target) {\n return target instanceof Object ? target?.[fieldNames?.label] : target\n } else {\n return value\n }\n }\n if (isArray(value)) {\n return value.map(getLabel).join(' | ')\n } else {\n return getLabel(value)\n }\n}\n\nexport function formatLabel(reactDom) {\n return flatten(\n React.Children.map(reactDom.props.children, (child) => {\n if (React.isValidElement(child)) {\n return formatLabel(child)\n } else if (isString(child)) {\n return child\n }\n return ''\n })\n ).join('')\n}\n\nexport function parseObjectToArray(value, data) {\n return Object.keys(value || {})\n ?.map((key) => {\n const target = data?.find((item) => item.props?.name === key)\n if (!target) return null\n const dataItem = target?.props || {}\n const { type, component, setLabel, props: fieldProps } = dataItem || {}\n const { options } = fieldProps || {}\n\n if (!type && component) {\n if (!setLabel) {\n console.error('自定义组件需要传入setLabel()方法')\n }\n } else if (options) {\n if (type === 'selectInput') {\n const selectKey = Object.keys(value[key] || {})?.[0]\n if (!selectKey) {\n // 17. inputSelect组件,初始值{},展示undefined:undefined\n return false\n }\n return {\n key,\n value: value[key],\n closable: true,\n }\n }\n }\n return {\n key,\n value: value[key],\n closable: true,\n }\n })\n ?.filter((item) => !!item)\n}\n\nexport function parseArrayToObject(value) {\n return value?.reduce((acc, v) => {\n acc[v.key] = v.value\n return acc\n }, {})\n}\n\nexport function getLabel({ key, value }, data, locale) {\n const target = data?.find((item) => item.props?.name === key)\n if (!target) return null\n const dataItem = target?.props || {}\n const { type, setLabel, props: fieldProps, propsTitle, title, name } = dataItem || {}\n const _propsTitle = propsTitle || title || name\n const { options, format } = fieldProps || {}\n let labelValue = value\n if (setLabel) {\n // setLabel: 对于自定义组件,无法控制label的显示,可以通过setLabel方法控制\n labelValue = setLabel(value)\n } else if (options) {\n if (type === 'selectInput') {\n const selectKey = Object.keys(value || {})?.[0]\n if (!selectKey) {\n // 17. inputSelect组件,初始值{},展示undefined:undefined\n return false\n }\n const inputValue = value[selectKey]\n const selectLabel = options?.find((v) => v.value === selectKey)?.label\n return selectLabel + ':' + inputValue\n }\n labelValue = getLabelByValue({\n value,\n options,\n fieldNames: dataItem?.props?.fieldNames || {\n label: 'label',\n value: 'value',\n },\n })\n } else if (type === 'checkbox') {\n labelValue = value ? locale.yes : locale.no\n } else if (type === 'dateRange' && format) {\n if(value?.length) {\n labelValue = [moment(value?.[0]).format(format), moment(value?.[1]).format(format)].join('~')\n }\n } else if (type === 'date' && format) {\n labelValue = value ? moment(value).format(format) : undefined\n }\n return _propsTitle + ':' + (labelValue === undefined ? '' : labelValue)\n}\n"]}
@@ -1,133 +0,0 @@
1
- .tnt-queryform {
2
- display: flex;
3
-
4
- &-extra {
5
- line-height: 32px;
6
- margin-left: 12px;
7
- & > * {
8
- margin-left: 8px;
9
- }
10
- }
11
-
12
- &-actions {
13
- align-items: center;
14
- display: inline-block;
15
- height: 32px;
16
- line-height: 32px;
17
-
18
- & > *:not(.expand-link) {
19
- margin-right: 10px;
20
- }
21
- & > .expand-link {
22
- padding: 0;
23
- margin-right: 0;
24
- }
25
- & > .ant-badge {
26
- .tnt-icon {
27
- margin-right: 8px;
28
- }
29
- }
30
- }
31
-
32
- .ant-form {
33
- display: inline-block;
34
- margin-bottom: 12px;
35
- display: flex;
36
- flex: 1;
37
- &.ant-form-inline {
38
- flex-wrap: unset;
39
- }
40
-
41
- & > div:nth-child(1) {
42
- height: 32px;
43
- overflow: hidden;
44
- .ant-form-item-label {
45
- label {
46
- // bottom: 4px;
47
- }
48
- }
49
- }
50
-
51
- &.expanded {
52
- & > div:nth-child(1) {
53
- height: auto !important;
54
- }
55
- }
56
-
57
- &.showMore {
58
- & > div:nth-child(1) {
59
- .ant-form-item {
60
- margin-bottom: 12px;
61
- }
62
- }
63
- }
64
-
65
- & > div:nth-child(2) {
66
- display: flex;
67
- }
68
-
69
- &.ant-form-inline .ant-form-item {
70
- margin-right: 10px;
71
- display: inline-block;
72
- }
73
-
74
- .ant-form-item-control {
75
- // min-width: 160px;
76
- line-height: unset;
77
- .ant-calendar-picker-input {
78
- padding: 0 11px;
79
- }
80
- .ant-form-item-children {
81
- & > .ant-input,
82
- & > .ant-input-affix-wrapper {
83
- width: 160px;
84
- // width: 200px;
85
- }
86
- }
87
- }
88
- }
89
-
90
- &-drawer {
91
- margin-top: 50px;
92
- &.large-size {
93
- margin-top: 60px;
94
- }
95
-
96
- &.ant-drawer.ant-drawer-open {
97
- .ant-drawer-mask {
98
- opacity: 0;
99
- background: unset;
100
- }
101
- }
102
- .ant-drawer-body {
103
- .ant-form-item {
104
- display: block;
105
- margin-right: 0;
106
- margin-bottom: 20px;
107
- width: 100%;
108
- }
109
- .ant-form-item-label {
110
- display: block;
111
- text-align: left;
112
- line-height: 22px;
113
- margin-bottom: 10px;
114
- }
115
- .ant-form-item-control-wrapper,
116
- .ant-form-item-control,
117
- .ant-calendar-picker,
118
- .ant-input {
119
- min-width: 100%;
120
- width: 100%;
121
- }
122
-
123
- & > .ant-btn {
124
- display: block;
125
- width: 100%;
126
- margin-bottom: 10px;
127
- &.ant-btn-primary {
128
- margin-top: 20px;
129
- }
130
- }
131
- }
132
- }
133
- }
@@ -1,56 +0,0 @@
1
- import React, { forwardRef, useContext, useImperativeHandle, useState } from 'react';
2
- import Context from './Context';
3
- import Thumb from './Thumb';
4
- import { GAP } from './util';
5
- export default forwardRef((props, ref) => {
6
- const {
7
- wrapElement
8
- } = useContext(Context);
9
- const [moveX, setMoveX] = useState(0);
10
- const [moveY, setMoveY] = useState(0);
11
- const [sizeWidth, setSizeWidth] = useState(0);
12
- const [sizeHeight, setSizeHeight] = useState(0);
13
- const [ratioX, setRatioX] = useState(1);
14
- const [ratioY, setRatioY] = useState(1);
15
- useImperativeHandle(ref, () => ({
16
- update,
17
- handleScroll
18
- }));
19
- function handleScroll() {
20
- const wrap = wrapElement.current;
21
- if (!wrap) return;
22
- const offsetHeight = wrap.offsetHeight - GAP;
23
- const offsetWidth = wrap.offsetWidth - GAP;
24
- setMoveY(wrap.scrollTop * 100 / offsetHeight * ratioY);
25
- setMoveX(wrap.scrollLeft * 100 / offsetWidth * ratioX);
26
- }
27
- function update() {
28
- const wrap = wrapElement.current;
29
- if (!wrap) return;
30
- // 滚动窗口的高度
31
- const offsetHeight = wrap.offsetHeight - GAP;
32
- const offsetWidth = wrap.offsetWidth - GAP;
33
- // 滚动条的逻辑高度
34
- const originalHeight = offsetHeight ** 2 / wrap.scrollHeight;
35
- const originalWidth = offsetWidth ** 2 / wrap.scrollWidth;
36
- // 滚动条的实际高度,因为如果内容太长会导致滚动条非常短,可能难以点击拖拽,所以设置了最小高度
37
- const height = Math.max(originalHeight, props.minSize);
38
- const width = Math.max(originalWidth, props.minSize);
39
- setRatioY(originalHeight / (offsetHeight - originalHeight) / (height / (offsetHeight - height)));
40
- setRatioX(originalWidth / (offsetWidth - originalWidth) / (width / (offsetWidth - width)));
41
- setSizeHeight(height + GAP < offsetHeight ? height : 0);
42
- setSizeWidth(width + GAP < offsetWidth ? width : 0);
43
- }
44
- return React.createElement(React.Fragment, null, React.createElement(Thumb, {
45
- always: props.always,
46
- move: moveX,
47
- size: sizeWidth,
48
- ratio: ratioX
49
- }), React.createElement(Thumb, {
50
- always: props.always,
51
- move: moveY,
52
- size: sizeHeight,
53
- ratio: ratioY,
54
- vertical: true
55
- }));
56
- });
@@ -1 +0,0 @@
1
- {"version":3,"file":"Bar.js","sourceRoot":"","sources":["../../src/scroll-bar/Bar.js"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, useContext, useImperativeHandle, useState } from 'react'\nimport Context from './Context'\nimport Thumb from './Thumb'\nimport { GAP } from './util'\n\nexport default forwardRef((props, ref) => {\n const { wrapElement } = useContext(Context)\n\n const [moveX, setMoveX] = useState(0)\n const [moveY, setMoveY] = useState(0)\n const [sizeWidth, setSizeWidth] = useState(0)\n const [sizeHeight, setSizeHeight] = useState(0)\n const [ratioX, setRatioX] = useState(1)\n const [ratioY, setRatioY] = useState(1)\n\n useImperativeHandle(ref, () => ({\n update,\n handleScroll,\n }))\n\n function handleScroll() {\n const wrap = wrapElement.current\n if (!wrap) return\n const offsetHeight = wrap.offsetHeight - GAP\n const offsetWidth = wrap.offsetWidth - GAP\n setMoveY(((wrap.scrollTop * 100) / offsetHeight) * ratioY)\n setMoveX(((wrap.scrollLeft * 100) / offsetWidth) * ratioX)\n }\n\n function update() {\n const wrap = wrapElement.current\n if (!wrap) return\n // 滚动窗口的高度\n const offsetHeight = wrap.offsetHeight - GAP\n const offsetWidth = wrap.offsetWidth - GAP\n // 滚动条的逻辑高度\n const originalHeight = offsetHeight ** 2 / wrap.scrollHeight\n const originalWidth = offsetWidth ** 2 / wrap.scrollWidth\n // 滚动条的实际高度,因为如果内容太长会导致滚动条非常短,可能难以点击拖拽,所以设置了最小高度\n const height = Math.max(originalHeight, props.minSize)\n const width = Math.max(originalWidth, props.minSize)\n\n setRatioY(originalHeight / (offsetHeight - originalHeight) / (height / (offsetHeight - height)))\n setRatioX(originalWidth / (offsetWidth - originalWidth) / (width / (offsetWidth - width)))\n setSizeHeight(height + GAP < offsetHeight ? height : 0)\n setSizeWidth(width + GAP < offsetWidth ? width : 0)\n }\n\n return (\n <>\n <Thumb always={props.always} move={moveX} size={sizeWidth} ratio={ratioX} />\n <Thumb always={props.always} move={moveY} size={sizeHeight} ratio={ratioY} vertical />\n </>\n )\n})\n"]}
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- const Context = React.createContext({
3
- scrollbarElement: null,
4
- wrapElement: null
5
- });
6
- export default Context;
@@ -1 +0,0 @@
1
- {"version":3,"file":"Context.js","sourceRoot":"","sources":["../../src/scroll-bar/Context.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC;IAClC,gBAAgB,EAAE,IAAI;IACtB,WAAW,EAAE,IAAI;CAClB,CAAC,CAAA;AAEF,eAAe,OAAO,CAAA","sourcesContent":["import React from 'react'\n\nconst Context = React.createContext({\n scrollbarElement: null,\n wrapElement: null,\n})\n\nexport default Context\n"]}
@@ -1,86 +0,0 @@
1
- var __rest = this && this.__rest || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
4
- if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
5
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
6
- }
7
- return t;
8
- };
9
- import clsx from 'classnames';
10
- import React, { forwardRef, useEffect, useRef } from 'react';
11
- import Bar from './Bar';
12
- import Context from './Context';
13
- export default forwardRef((_a, ref) => {
14
- var {
15
- children,
16
- minSize = 20
17
- } = _a,
18
- props = __rest(_a, ["children", "minSize"]);
19
- const scrollbarElement = useRef();
20
- let wrapElement = useRef();
21
- wrapElement = ref || wrapElement;
22
- const resizeRef = useRef();
23
- const barRef = useRef();
24
- useEffect(() => {
25
- const wrapDom = wrapElement.current;
26
- const resizeDom = resizeRef.current;
27
- // 监听容器尺寸变化,因为尺寸可以设置类似height:100vh之类样式,高度并不是固定的
28
- const observerCallback = () => requestAnimationFrame(() => {
29
- var _a;
30
- update();
31
- (_a = barRef.current) === null || _a === void 0 ? void 0 : _a.handleScroll();
32
- });
33
- const observer = new ResizeObserver(observerCallback);
34
- observer.observe(wrapDom);
35
- observer.observe(resizeDom);
36
- return () => {
37
- observer.unobserve(wrapDom);
38
- observer.unobserve(resizeDom);
39
- };
40
- }, []);
41
- useEffect(() => {
42
- var _a;
43
- if (!props.native) {
44
- update();
45
- (_a = barRef.current) === null || _a === void 0 ? void 0 : _a.handleScroll();
46
- }
47
- }, [props.native]);
48
- function update() {
49
- var _a;
50
- (_a = barRef.current) === null || _a === void 0 ? void 0 : _a.update();
51
- }
52
- function handleScroll(e) {
53
- var _a, _b;
54
- (_a = barRef.current) === null || _a === void 0 ? void 0 : _a.handleScroll();
55
- (_b = props.onScroll) === null || _b === void 0 ? void 0 : _b.call(props, e);
56
- }
57
- const wrapStyle = {
58
- height: props.height,
59
- maxHeight: props.maxHeight
60
- };
61
- const wrapClassName = clsx('tntd-scroll-bar-wrap', {
62
- 'tntd-scroll-bar-wrap-hidden-default': !props.native
63
- });
64
- return React.createElement(Context.Provider, {
65
- value: {
66
- scrollbarElement,
67
- wrapElement
68
- }
69
- }, React.createElement("div", {
70
- style: props.style,
71
- className: clsx('tntd-scroll-bar', props.className),
72
- ref: scrollbarElement
73
- }, React.createElement("div", {
74
- style: wrapStyle,
75
- className: wrapClassName,
76
- ref: wrapElement,
77
- onScroll: handleScroll
78
- }, React.createElement("div", {
79
- className: "tntd-scroll-bar-view",
80
- ref: resizeRef
81
- }, children)), !props.native && React.createElement(Bar, {
82
- ref: barRef,
83
- always: props.always,
84
- minSize: minSize
85
- })));
86
- });
@@ -1 +0,0 @@
1
- {"version":3,"file":"ScrollBar.js","sourceRoot":"","sources":["../../src/scroll-bar/ScrollBar.js"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,YAAY,CAAA;AAC7B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC5D,OAAO,GAAG,MAAM,OAAO,CAAA;AACvB,OAAO,OAAO,MAAM,WAAW,CAAA;AAE/B,eAAe,UAAU,CAAC,CAAC,EAAoC,EAAE,GAAG,EAAE,EAAE;QAA7C,EAAE,QAAQ,EAAE,OAAO,GAAG,EAAE,OAAY,EAAP,KAAK,cAAlC,uBAAoC,CAAF;IAC3D,MAAM,gBAAgB,GAAG,MAAM,EAAE,CAAA;IACjC,IAAI,WAAW,GAAG,MAAM,EAAE,CAAA;IAC1B,WAAW,GAAG,GAAG,IAAI,WAAW,CAAA;IAChC,MAAM,SAAS,GAAG,MAAM,EAAE,CAAA;IAC1B,MAAM,MAAM,GAAG,MAAM,EAAE,CAAA;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,WAAW,CAAC,OAAO,CAAA;QACnC,MAAM,SAAS,GAAG,SAAS,CAAC,OAAO,CAAA;QACnC,+CAA+C;QAC/C,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAC5B,qBAAqB,CAAC,GAAG,EAAE;;YACzB,MAAM,EAAE,CAAA;YACR,MAAA,MAAM,CAAC,OAAO,0CAAE,YAAY,EAAE,CAAA;QAChC,CAAC,CAAC,CAAA;QACJ,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,gBAAgB,CAAC,CAAA;QACrD,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QACzB,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;QAC3B,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAA;YAC3B,QAAQ,CAAC,SAAS,CAAC,SAAS,CAAC,CAAA;QAC/B,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,SAAS,CAAC,GAAG,EAAE;;QACb,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,MAAM,EAAE,CAAA;YACR,MAAA,MAAM,CAAC,OAAO,0CAAE,YAAY,EAAE,CAAA;SAC/B;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAElB,SAAS,MAAM;;QACb,MAAA,MAAM,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAA;IAC1B,CAAC;IAED,SAAS,YAAY,CAAC,CAAC;;QACrB,MAAA,MAAM,CAAC,OAAO,0CAAE,YAAY,EAAE,CAAA;QAC9B,MAAA,KAAK,CAAC,QAAQ,sDAAG,CAAC,CAAC,CAAA;IACrB,CAAC;IAED,MAAM,SAAS,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACtE,MAAM,aAAa,GAAG,IAAI,CAAC,sBAAsB,EAAE;QACjD,qCAAqC,EAAE,CAAC,KAAK,CAAC,MAAM;KACrD,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,OAAO,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,gBAAgB,EAAE,WAAW,EAAE;QACxD,6BACE,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,SAAS,EAAE,IAAI,CAAC,iBAAiB,EAAE,KAAK,CAAC,SAAS,CAAC,EACnD,GAAG,EAAE,gBAAgB;YAErB,6BAAK,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY;gBACvF,6BAAK,SAAS,EAAC,sBAAsB,EAAC,GAAG,EAAE,SAAS,IACjD,QAAQ,CACL,CACF;YACL,CAAC,KAAK,CAAC,MAAM,IAAI,oBAAC,GAAG,IAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,GAAI,CAC1E,CACW,CACpB,CAAA;AACH,CAAC,CAAC,CAAA","sourcesContent":["import clsx from 'classnames'\nimport React, { forwardRef, useEffect, useRef } from 'react'\nimport Bar from './Bar'\nimport Context from './Context'\n\nexport default forwardRef(({ children, minSize = 20, ...props }, ref) => {\n const scrollbarElement = useRef()\n let wrapElement = useRef()\n wrapElement = ref || wrapElement\n const resizeRef = useRef()\n const barRef = useRef()\n\n useEffect(() => {\n const wrapDom = wrapElement.current\n const resizeDom = resizeRef.current\n // 监听容器尺寸变化,因为尺寸可以设置类似height:100vh之类样式,高度并不是固定的\n const observerCallback = () =>\n requestAnimationFrame(() => {\n update()\n barRef.current?.handleScroll()\n })\n const observer = new ResizeObserver(observerCallback)\n observer.observe(wrapDom)\n observer.observe(resizeDom)\n return () => {\n observer.unobserve(wrapDom)\n observer.unobserve(resizeDom)\n }\n }, [])\n useEffect(() => {\n if (!props.native) {\n update()\n barRef.current?.handleScroll()\n }\n }, [props.native])\n\n function update() {\n barRef.current?.update()\n }\n\n function handleScroll(e) {\n barRef.current?.handleScroll()\n props.onScroll?.(e)\n }\n\n const wrapStyle = { height: props.height, maxHeight: props.maxHeight }\n const wrapClassName = clsx('tntd-scroll-bar-wrap', {\n 'tntd-scroll-bar-wrap-hidden-default': !props.native,\n })\n\n return (\n <Context.Provider value={{ scrollbarElement, wrapElement }}>\n <div\n style={props.style}\n className={clsx('tntd-scroll-bar', props.className)}\n ref={scrollbarElement}\n >\n <div style={wrapStyle} className={wrapClassName} ref={wrapElement} onScroll={handleScroll}>\n <div className=\"tntd-scroll-bar-view\" ref={resizeRef}>\n {children}\n </div>\n </div>\n {!props.native && <Bar ref={barRef} always={props.always} minSize={minSize} />}\n </div>\n </Context.Provider>\n )\n})\n"]}
@@ -1,105 +0,0 @@
1
- import clsx from 'classnames';
2
- import React, { useContext, useEffect, useRef, useState } from 'react';
3
- import Context from './Context';
4
- import { BAR_MAP, renderThumbStyle } from './util';
5
- export default function Thumb(props) {
6
- const {
7
- scrollbarElement,
8
- wrapElement
9
- } = useContext(Context);
10
- const instance = useRef();
11
- const thumb = useRef();
12
- const [visible, setVisible] = useState(false);
13
- // 当作非响应式变量使用
14
- const thumbState = useRef({});
15
- const cursorDown = useRef(false);
16
- const cursorLeave = useRef(false);
17
- const originalOnSelectStart = useRef(document.onselectstart);
18
- const bar = BAR_MAP[props.vertical ? 'vertical' : 'horizontal'];
19
- useEffect(() => {
20
- const element = scrollbarElement.current;
21
- element.addEventListener('mousemove', mouseMoveScrollbarHandler);
22
- element.addEventListener('mouseleave', mouseLeaveScrollbarHandler);
23
- return () => {
24
- restoreOnselectstart();
25
- document.removeEventListener('mouseup', mouseUpDocumentHandler);
26
- element.removeEventListener('mousemove', mouseMoveScrollbarHandler);
27
- element.removeEventListener('mouseleave', mouseLeaveScrollbarHandler);
28
- };
29
- }, []);
30
- function mouseMoveScrollbarHandler() {
31
- cursorLeave.current = false;
32
- setVisible(true);
33
- }
34
- function mouseLeaveScrollbarHandler() {
35
- cursorLeave.current = true;
36
- setVisible(cursorDown.current);
37
- }
38
- function getOffsetRatio() {
39
- return instance.current[bar.offset] ** 2 / wrapElement.current[bar.scrollSize] / props.ratio / thumb.current[bar.offset];
40
- }
41
- function clickTrackHandler(e) {
42
- if (!thumb.current || !instance.current || !wrapElement.current) return;
43
- // 鼠标点击的坐标距离顶端的距离
44
- const offset = Math.abs(e.target.getBoundingClientRect()[bar.direction] - e[bar.client]);
45
- const thumbHalf = thumb.current[bar.offset] / 2;
46
- const thumbPositionPercentage = (offset - thumbHalf) * 100 * getOffsetRatio() / instance.current[bar.offset];
47
- // 直接给scrollTop赋值,就会调用bar组件的handleScroll函数
48
- wrapElement.current[bar.scroll] = thumbPositionPercentage * wrapElement.current[bar.scrollSize] / 100;
49
- }
50
- function clickThumbHandler(e) {
51
- var _a;
52
- e.stopPropagation();
53
- if (e.ctrlKey || [1, 2].includes(e.button)) return;
54
- (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
55
- startDrag(e);
56
- const el = e.currentTarget;
57
- if (!el) return;
58
- thumbState.current[bar.axis] = el[bar.offset] - (e[bar.client] - el.getBoundingClientRect()[bar.direction]);
59
- }
60
- function startDrag(e) {
61
- e.persist();
62
- cursorDown.current = true;
63
- document.addEventListener('mousemove', mouseMoveDocumentHandler);
64
- document.addEventListener('mouseup', mouseUpDocumentHandler);
65
- originalOnSelectStart.current = document.onselectstart;
66
- document.onselectstart = () => false;
67
- }
68
- function mouseMoveDocumentHandler(e) {
69
- if (!instance.current || !thumb.current) return;
70
- if (cursorDown.current === false) return;
71
- const prevPage = thumbState.current[bar.axis];
72
- if (!prevPage) return;
73
- const offset = (instance.current.getBoundingClientRect()[bar.direction] - e[bar.client]) * -1;
74
- const thumbClickPosition = thumb.current[bar.offset] - prevPage;
75
- const thumbPositionPercentage = (offset - thumbClickPosition) * 100 * getOffsetRatio() / instance.current[bar.offset];
76
- wrapElement.current[bar.scroll] = thumbPositionPercentage * wrapElement.current[bar.scrollSize] / 100;
77
- }
78
- function mouseUpDocumentHandler() {
79
- cursorDown.current = false;
80
- thumbState.current[bar.axis] = 0;
81
- document.removeEventListener('mousemove', mouseMoveDocumentHandler);
82
- document.removeEventListener('mouseup', mouseUpDocumentHandler);
83
- restoreOnselectstart();
84
- if (cursorLeave.current) setVisible(false);
85
- }
86
- function restoreOnselectstart() {
87
- if (document.onselectstart !== originalOnSelectStart.current) document.onselectstart = originalOnSelectStart.current;
88
- }
89
- const thumbStyle = renderThumbStyle({
90
- size: props.size,
91
- move: props.move,
92
- bar: bar
93
- });
94
- return React.createElement("div", {
95
- hidden: !(props.always || visible),
96
- className: clsx('tntd-scroll-bar-bar', bar.key),
97
- ref: instance,
98
- onMouseDown: clickTrackHandler
99
- }, React.createElement("div", {
100
- className: "tntd-scroll-bar-thumb",
101
- style: thumbStyle,
102
- ref: thumb,
103
- onMouseDown: clickThumbHandler
104
- }));
105
- }
@@ -1 +0,0 @@
1
- {"version":3,"file":"Thumb.js","sourceRoot":"","sources":["../../src/scroll-bar/Thumb.js"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'classnames'\nimport React, { useContext, useEffect, useRef, useState } from 'react'\nimport Context from './Context'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nexport default function Thumb(props) {\n const { scrollbarElement, wrapElement } = useContext(Context)\n const instance = useRef()\n const thumb = useRef()\n const [visible, setVisible] = useState(false)\n // 当作非响应式变量使用\n const thumbState = useRef({})\n const cursorDown = useRef(false)\n const cursorLeave = useRef(false)\n const originalOnSelectStart = useRef(document.onselectstart)\n const bar = BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n\n useEffect(() => {\n const element = scrollbarElement.current\n element.addEventListener('mousemove', mouseMoveScrollbarHandler)\n element.addEventListener('mouseleave', mouseLeaveScrollbarHandler)\n return () => {\n restoreOnselectstart()\n document.removeEventListener('mouseup', mouseUpDocumentHandler)\n element.removeEventListener('mousemove', mouseMoveScrollbarHandler)\n element.removeEventListener('mouseleave', mouseLeaveScrollbarHandler)\n }\n }, [])\n\n function mouseMoveScrollbarHandler() {\n cursorLeave.current = false\n setVisible(true)\n }\n\n function mouseLeaveScrollbarHandler() {\n cursorLeave.current = true\n setVisible(cursorDown.current)\n }\n\n function getOffsetRatio() {\n return (\n instance.current[bar.offset] ** 2 /\n wrapElement.current[bar.scrollSize] /\n props.ratio /\n thumb.current[bar.offset]\n )\n }\n\n function clickTrackHandler(e) {\n if (!thumb.current || !instance.current || !wrapElement.current) return\n // 鼠标点击的坐标距离顶端的距离\n const offset = Math.abs(e.target.getBoundingClientRect()[bar.direction] - e[bar.client])\n const thumbHalf = thumb.current[bar.offset] / 2\n const thumbPositionPercentage =\n ((offset - thumbHalf) * 100 * getOffsetRatio()) / instance.current[bar.offset]\n // 直接给scrollTop赋值,就会调用bar组件的handleScroll函数\n wrapElement.current[bar.scroll] =\n (thumbPositionPercentage * wrapElement.current[bar.scrollSize]) / 100\n }\n\n function clickThumbHandler(e) {\n e.stopPropagation()\n if (e.ctrlKey || [1, 2].includes(e.button)) return\n window.getSelection()?.removeAllRanges()\n startDrag(e)\n\n const el = e.currentTarget\n if (!el) return\n thumbState.current[bar.axis] =\n el[bar.offset] - (e[bar.client] - el.getBoundingClientRect()[bar.direction])\n }\n\n function startDrag(e) {\n e.persist()\n cursorDown.current = true\n document.addEventListener('mousemove', mouseMoveDocumentHandler)\n document.addEventListener('mouseup', mouseUpDocumentHandler)\n originalOnSelectStart.current = document.onselectstart\n document.onselectstart = () => false\n }\n\n function mouseMoveDocumentHandler(e) {\n if (!instance.current || !thumb.current) return\n if (cursorDown.current === false) return\n const prevPage = thumbState.current[bar.axis]\n if (!prevPage) return\n\n const offset = (instance.current.getBoundingClientRect()[bar.direction] - e[bar.client]) * -1\n const thumbClickPosition = thumb.current[bar.offset] - prevPage\n const thumbPositionPercentage =\n ((offset - thumbClickPosition) * 100 * getOffsetRatio()) / instance.current[bar.offset]\n wrapElement.current[bar.scroll] =\n (thumbPositionPercentage * wrapElement.current[bar.scrollSize]) / 100\n }\n\n function mouseUpDocumentHandler() {\n cursorDown.current = false\n thumbState.current[bar.axis] = 0\n document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n document.removeEventListener('mouseup', mouseUpDocumentHandler)\n restoreOnselectstart()\n if (cursorLeave.current) setVisible(false)\n }\n\n function restoreOnselectstart() {\n if (document.onselectstart !== originalOnSelectStart.current)\n document.onselectstart = originalOnSelectStart.current\n }\n\n const thumbStyle = renderThumbStyle({\n size: props.size,\n move: props.move,\n bar: bar,\n })\n\n return (\n <div\n hidden={!(props.always || visible)}\n className={clsx('tntd-scroll-bar-bar', bar.key)}\n ref={instance}\n onMouseDown={clickTrackHandler}\n >\n <div\n className=\"tntd-scroll-bar-thumb\"\n style={thumbStyle}\n ref={thumb}\n onMouseDown={clickThumbHandler}\n />\n </div>\n )\n}\n"]}
@@ -1,3 +0,0 @@
1
- import ScrollBar from './ScrollBar';
2
- import './scrollBar.less';
3
- export default ScrollBar;
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/scroll-bar/index.js"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,kBAAkB,CAAA;AAEzB,eAAe,SAAS,CAAA","sourcesContent":["import ScrollBar from './ScrollBar'\nimport './scrollBar.less'\n\nexport default ScrollBar\n"]}