@king-design/intact 3.5.1 → 3.6.0-beta.0
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/components/breadcrumb/demos/separator.md +4 -4
- package/components/breadcrumb/index.vdt +1 -1
- package/components/breadcrumb/styles.ts +3 -2
- package/components/button/index.md +1 -0
- package/components/datepicker/basepicker.ts +60 -13
- package/components/datepicker/calendar.ts +5 -1
- package/components/datepicker/calendar.vdt +20 -6
- package/components/datepicker/dayjs.ts +22 -2
- package/components/datepicker/demos/multiple.md +0 -5
- package/components/datepicker/demos/nowrap.md +35 -0
- package/components/datepicker/demos/yearMonth.md +8 -2
- package/components/datepicker/helpers.ts +5 -5
- package/components/datepicker/index.md +3 -2
- package/components/datepicker/index.spec.ts +107 -90
- package/components/datepicker/index.ts +23 -5
- package/components/datepicker/index.vdt +34 -35
- package/components/datepicker/styles.ts +102 -3
- package/components/datepicker/useDisabled.ts +3 -3
- package/components/datepicker/useFormats.ts +2 -0
- package/components/datepicker/useMergeRange.ts +54 -0
- package/components/datepicker/usePosition.ts +169 -0
- package/components/datepicker/useQuarters.ts +47 -0
- package/components/datepicker/useShowDate.ts +42 -11
- package/components/datepicker/useValue.ts +35 -4
- package/components/datepicker/useWeeks.ts +58 -0
- package/components/dialog/useFixBody.ts +7 -64
- package/components/ellipsis/styles.ts +4 -0
- package/components/form/styles.ts +1 -0
- package/components/scrollSelect/index.spec.ts +3 -3
- package/components/scrollSelect/useMouseEvents.ts +23 -10
- package/components/select/base.vdt +2 -1
- package/components/select/demos/creatable.md +13 -0
- package/components/select/index.md +1 -0
- package/components/select/index.spec.ts +180 -0
- package/components/select/option.ts +9 -1
- package/components/select/select.ts +2 -0
- package/components/select/useFilterable.ts +1 -1
- package/components/select/useInput.ts +4 -2
- package/components/select/useSearchable.ts +2 -2
- package/components/table/table.vdt +3 -3
- package/components/timepicker/demos/step.md +1 -1
- package/components/timepicker/panelPicker.vdt +5 -1
- package/components/timepicker/styles.ts +0 -1
- package/components/tour/demos/basic.md +73 -0
- package/components/tour/demos/beforeChange.md +109 -0
- package/components/tour/demos/closable.md +70 -0
- package/components/tour/demos/custom.md +98 -0
- package/components/tour/demos/customText.md +94 -0
- package/components/tour/demos/declarative.md +72 -0
- package/components/tour/demos/events.md +101 -0
- package/components/tour/demos/maskClosable.md +76 -0
- package/components/tour/demos/notarget.md +59 -0
- package/components/tour/index.md +48 -0
- package/components/tour/index.spec.ts +259 -0
- package/components/tour/index.ts +2 -0
- package/components/tour/step.ts +55 -0
- package/components/tour/step.vdt +75 -0
- package/components/tour/styles.ts +283 -0
- package/components/tour/tour.ts +107 -0
- package/components/tour/tour.vdt +83 -0
- package/components/tour/useArrow.ts +46 -0
- package/components/tour/useFixBody.ts +22 -0
- package/components/tour/useHighlight.ts +36 -0
- package/components/tour/useMaskClosable.ts +26 -0
- package/components/tour/useNavigation.ts +46 -0
- package/components/tour/usePosition.ts +91 -0
- package/components/tour/useSteps.ts +80 -0
- package/components/tree/useChecked.ts +6 -4
- package/components/treeSelect/index.spec.ts +13 -1
- package/components/virtualList/useVirtualRows.ts +1 -1
- package/es/components/breadcrumb/index.vdt.js +2 -1
- package/es/components/breadcrumb/styles.js +5 -3
- package/es/components/datepicker/basepicker.d.ts +4 -2
- package/es/components/datepicker/basepicker.js +46 -13
- package/es/components/datepicker/calendar.d.ts +34 -6
- package/es/components/datepicker/calendar.js +4 -0
- package/es/components/datepicker/calendar.vdt.js +21 -5
- package/es/components/datepicker/dayjs.d.ts +13 -2
- package/es/components/datepicker/dayjs.js +6 -0
- package/es/components/datepicker/helpers.d.ts +5 -5
- package/es/components/datepicker/index.d.ts +17 -2
- package/es/components/datepicker/index.js +23 -5
- package/es/components/datepicker/index.spec.js +356 -355
- package/es/components/datepicker/index.vdt.js +25 -29
- package/es/components/datepicker/styles.d.ts +17 -0
- package/es/components/datepicker/styles.js +29 -2
- package/es/components/datepicker/useDisabled.d.ts +2 -2
- package/es/components/datepicker/useDisabled.js +1 -1
- package/es/components/datepicker/useFormats.js +3 -1
- package/es/components/datepicker/useMergeRange.d.ts +5 -0
- package/es/components/datepicker/useMergeRange.js +50 -0
- package/es/components/datepicker/usePosition.d.ts +10 -0
- package/es/components/datepicker/usePosition.js +166 -0
- package/es/components/datepicker/useQuarters.d.ts +15 -0
- package/es/components/datepicker/useQuarters.js +36 -0
- package/es/components/datepicker/useShowDate.d.ts +1 -1
- package/es/components/datepicker/useShowDate.js +42 -9
- package/es/components/datepicker/useStatus.d.ts +1 -1
- package/es/components/datepicker/useValue.d.ts +1 -0
- package/es/components/datepicker/useValue.js +26 -2
- package/es/components/datepicker/useWeeks.d.ts +19 -0
- package/es/components/datepicker/useWeeks.js +48 -0
- package/es/components/dialog/useFixBody.js +6 -58
- package/es/components/ellipsis/styles.js +1 -1
- package/es/components/form/styles.js +1 -1
- package/es/components/scrollSelect/index.spec.js +4 -6
- package/es/components/scrollSelect/useMouseEvents.js +21 -9
- package/es/components/select/base.vdt.js +4 -2
- package/es/components/select/index.spec.js +269 -42
- package/es/components/select/option.d.ts +1 -0
- package/es/components/select/option.js +9 -2
- package/es/components/select/select.d.ts +1 -0
- package/es/components/select/select.js +2 -1
- package/es/components/select/useFilterable.js +2 -1
- package/es/components/select/useInput.js +5 -2
- package/es/components/select/useSearchable.js +1 -0
- package/es/components/table/table.vdt.js +4 -2
- package/es/components/timepicker/panelPicker.d.ts +2 -1
- package/es/components/timepicker/panelPicker.vdt.js +12 -4
- package/es/components/timepicker/selectPicker.d.ts +1 -1
- package/es/components/timepicker/styles.js +1 -1
- package/es/components/timepicker/useDisabled.d.ts +1 -1
- package/es/components/timepicker/useValue.d.ts +1 -0
- package/es/components/tour/index.d.ts +2 -0
- package/es/components/tour/index.js +2 -0
- package/es/components/tour/index.spec.d.ts +1 -0
- package/es/components/tour/index.spec.js +356 -0
- package/es/components/tour/step.d.ts +23 -0
- package/es/components/tour/step.js +46 -0
- package/es/components/tour/step.vdt.js +74 -0
- package/es/components/tour/styles.d.ts +7 -0
- package/es/components/tour/styles.js +84 -0
- package/es/components/tour/tour.d.ts +73 -0
- package/es/components/tour/tour.js +70 -0
- package/es/components/tour/tour.vdt.js +66 -0
- package/es/components/tour/useArrow.d.ts +4 -0
- package/es/components/tour/useArrow.js +40 -0
- package/es/components/tour/useFixBody.d.ts +4 -0
- package/es/components/tour/useFixBody.js +17 -0
- package/es/components/tour/useHighlight.d.ts +4 -0
- package/es/components/tour/useHighlight.js +31 -0
- package/es/components/tour/useMaskClosable.d.ts +1 -0
- package/es/components/tour/useMaskClosable.js +25 -0
- package/es/components/tour/useNavigation.d.ts +5 -0
- package/es/components/tour/useNavigation.js +103 -0
- package/es/components/tour/usePosition.d.ts +6 -0
- package/es/components/tour/usePosition.js +93 -0
- package/es/components/tour/useSteps.d.ts +6 -0
- package/es/components/tour/useSteps.js +68 -0
- package/es/components/tree/useChecked.js +6 -4
- package/es/components/treeSelect/index.spec.js +20 -5
- package/es/components/virtualList/useVirtualRows.js +1 -1
- package/es/hooks/useDocumentClick.js +3 -3
- package/es/hooks/useFixBody.d.ts +11 -0
- package/es/hooks/useFixBody.js +72 -0
- package/es/index.d.ts +3 -2
- package/es/index.js +3 -2
- package/es/site/data/components/breadcrumb/demos/separator/react.js +7 -5
- package/es/site/data/components/datepicker/demos/multiple/index.d.ts +0 -1
- package/es/site/data/components/datepicker/demos/multiple/index.js +1 -2
- package/es/site/data/components/datepicker/demos/multiple/react.d.ts +0 -1
- package/es/site/data/components/datepicker/demos/multiple/react.js +2 -13
- package/es/site/data/components/datepicker/demos/nowrap/index.d.ts +10 -0
- package/es/site/data/components/datepicker/demos/nowrap/index.js +19 -0
- package/es/site/data/components/datepicker/demos/nowrap/react.d.ts +10 -0
- package/es/site/data/components/datepicker/demos/nowrap/react.js +49 -0
- package/es/site/data/components/datepicker/demos/yearMonth/index.d.ts +2 -0
- package/es/site/data/components/datepicker/demos/yearMonth/index.js +3 -1
- package/es/site/data/components/datepicker/demos/yearMonth/react.d.ts +2 -0
- package/es/site/data/components/datepicker/demos/yearMonth/react.js +21 -1
- package/es/site/data/components/select/demos/creatable/index.d.ts +1 -0
- package/es/site/data/components/select/demos/creatable/index.js +2 -1
- package/es/site/data/components/select/demos/creatable/react.d.ts +1 -0
- package/es/site/data/components/select/demos/creatable/react.js +31 -2
- package/es/site/data/components/select/demos/searchable/index.js +1 -1
- package/es/site/data/components/select/demos/searchable/react.js +1 -1
- package/es/site/data/components/tour/demos/basic/index.d.ts +17 -0
- package/es/site/data/components/tour/demos/basic/index.js +46 -0
- package/es/site/data/components/tour/demos/basic/react.d.ts +16 -0
- package/es/site/data/components/tour/demos/basic/react.js +82 -0
- package/es/site/data/components/tour/demos/beforeChange/index.d.ts +20 -0
- package/es/site/data/components/tour/demos/beforeChange/index.js +69 -0
- package/es/site/data/components/tour/demos/beforeChange/react.d.ts +19 -0
- package/es/site/data/components/tour/demos/beforeChange/react.js +129 -0
- package/es/site/data/components/tour/demos/closable/index.d.ts +18 -0
- package/es/site/data/components/tour/demos/closable/index.js +42 -0
- package/es/site/data/components/tour/demos/closable/react.d.ts +17 -0
- package/es/site/data/components/tour/demos/closable/react.js +85 -0
- package/es/site/data/components/tour/demos/custom/index.d.ts +11 -0
- package/es/site/data/components/tour/demos/custom/index.js +35 -0
- package/es/site/data/components/tour/demos/custom/react.d.ts +11 -0
- package/es/site/data/components/tour/demos/custom/react.js +108 -0
- package/es/site/data/components/tour/demos/customButtons/index.d.ts +33 -0
- package/es/site/data/components/tour/demos/customButtons/index.js +55 -0
- package/es/site/data/components/tour/demos/customButtons/react.d.ts +33 -0
- package/es/site/data/components/tour/demos/customButtons/react.js +99 -0
- package/es/site/data/components/tour/demos/customText/index.d.ts +20 -0
- package/es/site/data/components/tour/demos/customText/index.js +54 -0
- package/es/site/data/components/tour/demos/customText/react.d.ts +19 -0
- package/es/site/data/components/tour/demos/customText/react.js +95 -0
- package/es/site/data/components/tour/demos/declarative/index.d.ts +11 -0
- package/es/site/data/components/tour/demos/declarative/index.js +36 -0
- package/es/site/data/components/tour/demos/declarative/react.d.ts +10 -0
- package/es/site/data/components/tour/demos/declarative/react.js +80 -0
- package/es/site/data/components/tour/demos/events/index.d.ts +18 -0
- package/es/site/data/components/tour/demos/events/index.js +58 -0
- package/es/site/data/components/tour/demos/events/react.d.ts +18 -0
- package/es/site/data/components/tour/demos/events/react.js +101 -0
- package/es/site/data/components/tour/demos/maskClosable/index.d.ts +18 -0
- package/es/site/data/components/tour/demos/maskClosable/index.js +47 -0
- package/es/site/data/components/tour/demos/maskClosable/react.d.ts +17 -0
- package/es/site/data/components/tour/demos/maskClosable/react.js +95 -0
- package/es/site/data/components/tour/demos/notarget/index.d.ts +11 -0
- package/es/site/data/components/tour/demos/notarget/index.js +35 -0
- package/es/site/data/components/tour/demos/notarget/react.d.ts +10 -0
- package/es/site/data/components/tour/demos/notarget/react.js +61 -0
- package/es/site/data/components/tour/index.d.ts +57 -0
- package/es/site/data/components/tour/index.js +32 -0
- package/es/site/src/pages/resource/index.js +1 -1
- package/es/styles/fonts/iconfont.js +2 -1
- package/es/styles/global.js +2 -1
- package/hooks/useDocumentClick.ts +3 -3
- package/hooks/useFixBody.ts +87 -0
- package/index.ts +3 -2
- package/package.json +1 -1
- package/styles/fonts/iconfont.ts +2 -1
- package/styles/global.ts +2 -1
|
@@ -38,6 +38,7 @@ export function useValue(formats, disabled, panel) {
|
|
|
38
38
|
multiple = _instance$get3.multiple,
|
|
39
39
|
type = _instance$get3.type,
|
|
40
40
|
range = _instance$get3.range;
|
|
41
|
+
var activePosition = instance.activePosition.position.value;
|
|
41
42
|
var _value;
|
|
42
43
|
if (range) {
|
|
43
44
|
var oldValue = last(value.value);
|
|
@@ -48,9 +49,24 @@ export function useValue(formats, disabled, panel) {
|
|
|
48
49
|
* #877
|
|
49
50
|
*/
|
|
50
51
|
flag = PanelFlags.Start;
|
|
51
|
-
|
|
52
|
+
if ((type === 'datetime' || type === 'date') && (oldValue == null ? void 0 : oldValue.length) === 2) {
|
|
53
|
+
// Use activePosition instead of Coordinate
|
|
54
|
+
_value = activePosition === 'end' ? [oldValue[0], fixDatetimeWithMinDate(v)] : multiple ? [fixDatetimeWithMinDate(v)] : [fixDatetimeWithMinDate(v), oldValue[1]];
|
|
55
|
+
} else {
|
|
56
|
+
_value = [fixDatetimeWithMinDate(v)];
|
|
57
|
+
}
|
|
52
58
|
} else {
|
|
53
|
-
|
|
59
|
+
if (type === 'datetime') {
|
|
60
|
+
if (oldValue.length === 1) {
|
|
61
|
+
// 如果只有开始日期,根据activePosition决定是替换开始日期还是设置结束日期
|
|
62
|
+
_value = activePosition === 'end' ? [oldValue[0], fixDatetimeWithMaxDate(v)] : [fixDatetimeWithMaxDate(v)];
|
|
63
|
+
} else {
|
|
64
|
+
// oldValue.length === 2的情况
|
|
65
|
+
_value = activePosition === 'end' ? [oldValue[0], fixDatetimeWithMaxDate(v)] : multiple ? [fixDatetimeWithMaxDate(v)] : [fixDatetimeWithMaxDate(v), oldValue[1]];
|
|
66
|
+
}
|
|
67
|
+
} else {
|
|
68
|
+
_value = [oldValue[0], fixDatetimeWithMaxDate(v)];
|
|
69
|
+
}
|
|
54
70
|
_sortInstanceProperty(_value).call(_value, function (a, b) {
|
|
55
71
|
return a.isAfter(b) ? 1 : -1;
|
|
56
72
|
});
|
|
@@ -70,6 +86,14 @@ export function useValue(formats, disabled, panel) {
|
|
|
70
86
|
} else {
|
|
71
87
|
panel.changePanel(PanelTypes.Time, flag);
|
|
72
88
|
}
|
|
89
|
+
} else if (type === 'week') {
|
|
90
|
+
_value = v.startOf('week');
|
|
91
|
+
setValue(_value, false);
|
|
92
|
+
instance.hide();
|
|
93
|
+
} else if (type === 'quarter') {
|
|
94
|
+
_value = v.startOf('quarter');
|
|
95
|
+
setValue(_value, false);
|
|
96
|
+
instance.hide();
|
|
73
97
|
} else if (!multiple && (!range || _value.length === 2)) {
|
|
74
98
|
instance.hide();
|
|
75
99
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import dayjs, { Dayjs } from 'dayjs';
|
|
2
|
+
import { State } from '../../hooks/useState';
|
|
3
|
+
import type { useStatus } from './useStatus';
|
|
4
|
+
export declare function useWeeks(showDate: State<Dayjs>, status: ReturnType<typeof useStatus>, focusDate: State<Dayjs | null>): {
|
|
5
|
+
getWeeks: (now: Dayjs) => {
|
|
6
|
+
week: number;
|
|
7
|
+
days: {
|
|
8
|
+
isExceed: boolean;
|
|
9
|
+
label: number;
|
|
10
|
+
value: dayjs.Dayjs;
|
|
11
|
+
isActive: boolean;
|
|
12
|
+
isToday: boolean;
|
|
13
|
+
isDisabled: boolean;
|
|
14
|
+
isHover: boolean;
|
|
15
|
+
isInRange: boolean;
|
|
16
|
+
}[];
|
|
17
|
+
}[];
|
|
18
|
+
onClick: (day: Dayjs) => void;
|
|
19
|
+
};
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { useInstance } from 'intact';
|
|
2
|
+
export function useWeeks(showDate, status, focusDate) {
|
|
3
|
+
var instance = useInstance();
|
|
4
|
+
function getWeeks(now) {
|
|
5
|
+
var weeks = [];
|
|
6
|
+
// 从当前显示月份的月初开始,并调整到该周的开始
|
|
7
|
+
var startOfMonth = showDate.value.startOf('month');
|
|
8
|
+
var start = startOfMonth.startOf('week');
|
|
9
|
+
var current = start;
|
|
10
|
+
var currentMonth = showDate.value.month();
|
|
11
|
+
// 遍历6周,以覆盖整个月份
|
|
12
|
+
for (var weekIndex = 0; weekIndex < 6; weekIndex++) {
|
|
13
|
+
var weekNumber = current.week(); // 获取当前周的周数
|
|
14
|
+
var days = [];
|
|
15
|
+
// 遍历一周的7天
|
|
16
|
+
for (var i = 0; i < 7; i++) {
|
|
17
|
+
var day = current.add(i, 'day');
|
|
18
|
+
var isFirstOrLastDay = i === 0 || i === 6;
|
|
19
|
+
days.push({
|
|
20
|
+
isExceed: day.month() !== currentMonth,
|
|
21
|
+
label: day.date(),
|
|
22
|
+
value: day,
|
|
23
|
+
isActive: isFirstOrLastDay && status.isActive(day, 'week'),
|
|
24
|
+
isToday: day.isSame(now, 'week'),
|
|
25
|
+
isDisabled: status.isDisabled(day),
|
|
26
|
+
isHover: day.isSame(focusDate.value, 'week'),
|
|
27
|
+
isInRange: !isFirstOrLastDay && status.isActive(day, 'week')
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
// 每周的数据,包括周数和7天的信息
|
|
31
|
+
weeks.push({
|
|
32
|
+
week: weekNumber,
|
|
33
|
+
days: days
|
|
34
|
+
});
|
|
35
|
+
current = current.add(1, 'week'); // 移动到下一周的开始
|
|
36
|
+
}
|
|
37
|
+
return weeks;
|
|
38
|
+
}
|
|
39
|
+
function onClick(day) {
|
|
40
|
+
var weekStart = day.startOf('week');
|
|
41
|
+
showDate.set(weekStart); // 设置显示日期为周的开始
|
|
42
|
+
instance.triggerChange(weekStart); // 触发日期改变事件
|
|
43
|
+
}
|
|
44
|
+
return {
|
|
45
|
+
getWeeks: getWeeks,
|
|
46
|
+
onClick: onClick
|
|
47
|
+
};
|
|
48
|
+
}
|
|
@@ -1,72 +1,20 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import { scrollbarWidth } from '../position';
|
|
1
|
+
import { useInstance } from 'intact';
|
|
2
|
+
import { useFixBody as useFixBodyHook, setHooks as setFixBodyHooks } from '../../hooks/useFixBody';
|
|
4
3
|
import { SHOW } from './constants';
|
|
5
|
-
var dialogs = new _Set();
|
|
6
|
-
var originalStyle = null;
|
|
7
|
-
var hooks = null;
|
|
8
4
|
export function useFixBody(elementRef) {
|
|
9
5
|
var instance = useInstance();
|
|
10
|
-
var
|
|
6
|
+
var fixBodyHook = useFixBodyHook();
|
|
11
7
|
instance.on(SHOW, onEnter);
|
|
12
8
|
instance.on('afterClose', onAfterLeave);
|
|
13
|
-
onBeforeUnmount(function () {
|
|
14
|
-
// should also remove body style when dialog is removed, #805
|
|
15
|
-
// if (fixedBody && instance.get('value')) {
|
|
16
|
-
if (fixedBody) {
|
|
17
|
-
// maybe HIDE event has not triggered
|
|
18
|
-
onClosed(instance);
|
|
19
|
-
}
|
|
20
|
-
});
|
|
21
9
|
function onEnter() {
|
|
22
10
|
if (instance.get('overlay')) {
|
|
23
|
-
|
|
24
|
-
onOpen(instance);
|
|
11
|
+
fixBodyHook.onOpen();
|
|
25
12
|
}
|
|
26
13
|
}
|
|
27
14
|
function onAfterLeave() {
|
|
28
|
-
|
|
29
|
-
fixedBody = false;
|
|
30
|
-
onClosed(instance);
|
|
31
|
-
}
|
|
15
|
+
fixBodyHook.onClose();
|
|
32
16
|
}
|
|
33
17
|
}
|
|
34
18
|
export function setHooks(h) {
|
|
35
|
-
|
|
36
|
-
}
|
|
37
|
-
function onOpen(dialog) {
|
|
38
|
-
var body = document.body;
|
|
39
|
-
if (dialogs.size === 0) {
|
|
40
|
-
var bodyStyle = body.style;
|
|
41
|
-
originalStyle = body.getAttribute('style');
|
|
42
|
-
bodyStyle.overflow = 'hidden';
|
|
43
|
-
var scrollBarWidth = shouldFixBody();
|
|
44
|
-
if (scrollBarWidth) {
|
|
45
|
-
bodyStyle.paddingRight = scrollBarWidth + "px";
|
|
46
|
-
}
|
|
47
|
-
if (hooks && hooks.onStart) {
|
|
48
|
-
hooks.onStart(scrollBarWidth);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
dialogs.add(dialog);
|
|
52
|
-
}
|
|
53
|
-
function onClosed(dialog) {
|
|
54
|
-
var body = document.body;
|
|
55
|
-
dialogs.delete(dialog);
|
|
56
|
-
if (dialogs.size === 0) {
|
|
57
|
-
if (originalStyle) {
|
|
58
|
-
// console.log(originalStyle);
|
|
59
|
-
body.setAttribute('style', originalStyle);
|
|
60
|
-
} else {
|
|
61
|
-
body.removeAttribute('style');
|
|
62
|
-
}
|
|
63
|
-
if (hooks && hooks.onEnd) {
|
|
64
|
-
hooks.onEnd();
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
function shouldFixBody() {
|
|
69
|
-
if (document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight)) {
|
|
70
|
-
return scrollbarWidth();
|
|
71
|
-
}
|
|
19
|
+
setFixBodyHooks(h);
|
|
72
20
|
}
|
|
@@ -6,5 +6,5 @@ setDefault(function () {
|
|
|
6
6
|
makeStyles == null || makeStyles.clearCache();
|
|
7
7
|
});
|
|
8
8
|
export var makeStyles = cache(function makeStyles(k, maxLines) {
|
|
9
|
-
return /*#__PURE__*/css("width:100%;&.", k, "-multiline{.k-ellipsis-wrapper{white-space:normal;display:-webkit-box;-webkit-line-clamp:", maxLines, ";-webkit-box-orient:vertical;}}");
|
|
9
|
+
return /*#__PURE__*/css("width:100%;&.", k, "-multiline{.k-ellipsis-wrapper{white-space:normal;display:-webkit-box;-webkit-line-clamp:", maxLines, ";-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-clamp:", maxLines, ";box-orient:vertical;}}");
|
|
10
10
|
});
|
|
@@ -46,7 +46,7 @@ setDefault(function () {
|
|
|
46
46
|
makeFormStyles == null || makeFormStyles.clearCache();
|
|
47
47
|
});
|
|
48
48
|
export var makeItemStyles = cache(function makeItemStyles(k) {
|
|
49
|
-
return /*#__PURE__*/css("display:flex;position:relative;&:not(:last-of-type){margin-bottom:", form.item.gap, ";}&.", k, "-fluid>.", k, "-form-content{flex:1;}.", k, "-form-label{display:flex;align-items:center;justify-content:", form.item.labelTextAlign === 'right' ? 'end' : 'start', ";width:", form.item.labelWidth, ";padding-right:", form.item.labelGap, ";max-height:", form.item.labelHeight, ";flex-shrink:0;}.", k, "-form-star{color:", form.item.starColor, ";margin-right:", form.item.starGap, ";}.", k, "-form-content{position:relative;}.", k, "-form-error{position:absolute;color:", form.item.errorColor, ";font-size:", form.item.errorFontSize, ";left:0;right:0;display:flex;align-items:center;&.", k, "-ellipsis{.", k, "-form-error-more{display:inline-block;}}}.", k, "-form-error-more{line-height:", form.item.errorFontSize, ";display:none;}&.", k, "-invalid{.", k, "-input{.", k, "-input-wrapper{border:", form.item.invalidBorder, ";position:relative;z-index:1;}}.", k, "-select,.", k, "-checkbox-wrapper,.", k, "-radio-wrapper{border:", form.item.invalidBorder, "!important;}.", k, "-select .", k, "-input .", k, "-input-wrapper{border:none;}}.", k, "-form-append{padding:", form.item.appendPadding, ";vertical-align:middle;}");
|
|
49
|
+
return /*#__PURE__*/css("display:flex;position:relative;&:not(:last-of-type){margin-bottom:", form.item.gap, ";}&.", k, "-fluid>.", k, "-form-content{flex:1;min-width:0;}.", k, "-form-label{display:flex;align-items:center;justify-content:", form.item.labelTextAlign === 'right' ? 'end' : 'start', ";width:", form.item.labelWidth, ";padding-right:", form.item.labelGap, ";max-height:", form.item.labelHeight, ";flex-shrink:0;}.", k, "-form-star{color:", form.item.starColor, ";margin-right:", form.item.starGap, ";}.", k, "-form-content{position:relative;}.", k, "-form-error{position:absolute;color:", form.item.errorColor, ";font-size:", form.item.errorFontSize, ";left:0;right:0;display:flex;align-items:center;&.", k, "-ellipsis{.", k, "-form-error-more{display:inline-block;}}}.", k, "-form-error-more{line-height:", form.item.errorFontSize, ";display:none;}&.", k, "-invalid{.", k, "-input{.", k, "-input-wrapper{border:", form.item.invalidBorder, ";position:relative;z-index:1;}}.", k, "-select,.", k, "-checkbox-wrapper,.", k, "-radio-wrapper{border:", form.item.invalidBorder, "!important;}.", k, "-select .", k, "-input .", k, "-input-wrapper{border:none;}}.", k, "-form-append{padding:", form.item.appendPadding, ";vertical-align:middle;}");
|
|
50
50
|
});
|
|
51
51
|
export var makeFormStyles = cache(function makeFormStyles(k) {
|
|
52
52
|
var _context;
|
|
@@ -3,14 +3,12 @@ import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
|
|
|
3
3
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
|
|
4
4
|
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
|
|
5
5
|
import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
|
|
6
|
-
import { mount,
|
|
6
|
+
import { mount, dispatchEvent, wait } from '../../test/utils';
|
|
7
7
|
import BasicDemo from '~/components/scrollSelect/demos/basic';
|
|
8
8
|
import { ScrollSelect } from './';
|
|
9
9
|
import { Component } from 'intact';
|
|
10
10
|
describe('ScrollSelect', function () {
|
|
11
|
-
afterEach(
|
|
12
|
-
return unmount();
|
|
13
|
-
});
|
|
11
|
+
// afterEach(() => unmount());
|
|
14
12
|
it('should select by scroll', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
15
13
|
var _mount, instance, element;
|
|
16
14
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
@@ -18,14 +16,14 @@ describe('ScrollSelect', function () {
|
|
|
18
16
|
case 0:
|
|
19
17
|
_mount = mount(BasicDemo), instance = _mount[0], element = _mount[1]; // scroll
|
|
20
18
|
dispatchEvent(element.firstElementChild, 'wheel', {
|
|
21
|
-
deltaY:
|
|
19
|
+
deltaY: 30
|
|
22
20
|
});
|
|
23
21
|
_context.next = 4;
|
|
24
22
|
return wait(100);
|
|
25
23
|
case 4:
|
|
26
24
|
expect(instance.get('value')).to.eql(1);
|
|
27
25
|
dispatchEvent(element.firstElementChild, 'wheel', {
|
|
28
|
-
deltaY: -
|
|
26
|
+
deltaY: -30
|
|
29
27
|
});
|
|
30
28
|
_context.next = 8;
|
|
31
29
|
return wait(100);
|
|
@@ -21,11 +21,11 @@ export function useMouseEvents(translate, list) {
|
|
|
21
21
|
deltaY = meta.deltaY;
|
|
22
22
|
},
|
|
23
23
|
onMove: function onMove(e) {
|
|
24
|
-
var deltaY = e.clientY - y;
|
|
24
|
+
var deltaY = (e.clientY - y) * 0.8;
|
|
25
25
|
dragged = !!deltaY;
|
|
26
26
|
y = e.clientY;
|
|
27
27
|
var _deltaY = y - initY;
|
|
28
|
-
var offsetIndex = Math.floor(Math.abs(_deltaY) / itemHeight);
|
|
28
|
+
var offsetIndex = Math.floor(Math.abs(_deltaY) / itemHeight * 1.2);
|
|
29
29
|
if (offsetIndex) {
|
|
30
30
|
if (_deltaY < 0) {
|
|
31
31
|
offsetIndex = -offsetIndex;
|
|
@@ -60,24 +60,36 @@ export function useMouseEvents(translate, list) {
|
|
|
60
60
|
function onWheel(e) {
|
|
61
61
|
e.preventDefault();
|
|
62
62
|
itemHeight = getItemHeight();
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
63
|
+
var threshold = itemHeight * 0.6;
|
|
64
|
+
deltaY = (deltaY || 0) + e.deltaY;
|
|
65
|
+
if (Math.abs(deltaY) >= threshold) {
|
|
66
|
+
if (deltaY > 0) {
|
|
67
|
+
setByRelativeIndex(1, null, true);
|
|
68
|
+
} else {
|
|
69
|
+
setByRelativeIndex(-1, null, true);
|
|
70
|
+
}
|
|
71
|
+
deltaY = 0;
|
|
68
72
|
}
|
|
69
73
|
}
|
|
70
74
|
// throttle onWheel
|
|
71
|
-
var _onWheel = throttle(onWheel,
|
|
75
|
+
var _onWheel = throttle(onWheel, 50, function (e) {
|
|
72
76
|
return e.preventDefault();
|
|
73
77
|
});
|
|
74
78
|
function onClick(item, index) {
|
|
75
|
-
|
|
79
|
+
var _context2;
|
|
80
|
+
// if dragged, do not trigger click event
|
|
76
81
|
if (dragged) return;
|
|
77
82
|
var _instance$get = instance.get(),
|
|
78
83
|
count = _instance$get.count;
|
|
79
84
|
var half = Math.floor(count / 2);
|
|
80
85
|
var itemHeight = getItemHeight();
|
|
86
|
+
var currentIndex = _findIndexInstanceProperty(_context2 = list.data.value).call(_context2, function (v) {
|
|
87
|
+
return v.value === list.value.value;
|
|
88
|
+
});
|
|
89
|
+
var targetOffset = index - half;
|
|
90
|
+
if (currentIndex + targetOffset < 0 || currentIndex + targetOffset >= list.data.value.length) {
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
81
93
|
translate.set(translate.value - itemHeight * (index - half));
|
|
82
94
|
marginTop.set(marginTop.value + itemHeight * (index - half));
|
|
83
95
|
list.setValue(item.value, true);
|
|
@@ -44,7 +44,8 @@ export default function ($props, $blocks, $__proto__) {
|
|
|
44
44
|
position = _this$get.position,
|
|
45
45
|
flat = _flatInstanceProperty(_this$get),
|
|
46
46
|
nowrap = _this$get.nowrap,
|
|
47
|
-
draggable = _this$get.draggable
|
|
47
|
+
draggable = _this$get.draggable,
|
|
48
|
+
range = _this$get.range;
|
|
48
49
|
var k = this.config.k;
|
|
49
50
|
var classNameObj = (_classNameObj = {}, _classNameObj[k + "-select"] = true, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-" + size] = size !== 'default', _classNameObj[k + "-fluid"] = fluid, _classNameObj[k + "-inline"] = inline, _classNameObj[k + "-flat"] = flat, _classNameObj[k + "-nowrap"] = nowrap, _classNameObj[className] = className, _classNameObj[$props.className] = $props.className, _classNameObj[makeStyles(k)] = true, _classNameObj);
|
|
50
51
|
var placeholder = this.getPlaceholder();
|
|
@@ -122,7 +123,8 @@ export default function ($props, $blocks, $__proto__) {
|
|
|
122
123
|
'key': 'input',
|
|
123
124
|
'readonly': !show,
|
|
124
125
|
'waveDisabled': true,
|
|
125
|
-
'flat': flat
|
|
126
|
+
'flat': flat,
|
|
127
|
+
'ev-click': $props.onClick
|
|
126
128
|
}, 'input', inputRef) : !filterable && !hasValue ? _$ce(2, 'div', placeholder, 0, _$cn(k + "-select-placeholder c-ellipsis"), null, 'placeholder') : !multiple ? _$ce(2, 'div', (_$blocks['value'] = function ($super) {
|
|
127
129
|
return label;
|
|
128
130
|
}, __$blocks['value'] = function ($super, data) {
|