@symbo.ls/datepicker 2.11.76 → 2.11.90
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/days.js +6 -3
- package/index.js +34 -17
- package/months.js +18 -3
- package/package.json +2 -2
- package/years.js +2 -2
package/days.js
CHANGED
|
@@ -8,11 +8,14 @@ export const DatePickerDay = {
|
|
|
8
8
|
state: true,
|
|
9
9
|
|
|
10
10
|
props: ({ state, key }) => {
|
|
11
|
-
const isSelected = state.parent.activeDay === parseInt(key) + 1
|
|
11
|
+
const isSelected = state.parent.parent.activeDay === parseInt(key) + 1
|
|
12
12
|
const gridColumnStart = 7 - state.parent.weekItems.weeks[0].dates.length
|
|
13
|
+
const isWeekend = state.moment.isoWeekday()
|
|
14
|
+
// const isWeekend = state.moment.isWeekend
|
|
13
15
|
|
|
14
16
|
return {
|
|
15
17
|
isSelected,
|
|
18
|
+
isWeekend,
|
|
16
19
|
textAlign: 'center',
|
|
17
20
|
fontSize: 'Z1',
|
|
18
21
|
round: '100%',
|
|
@@ -27,8 +30,8 @@ export const DatePickerDay = {
|
|
|
27
30
|
},
|
|
28
31
|
'.isSelected': { theme: 'primary' },
|
|
29
32
|
'!isSelected': {
|
|
30
|
-
'
|
|
31
|
-
':
|
|
33
|
+
'.isWeekend': { opacity: '.5' },
|
|
34
|
+
':hover': { theme: 'secondary' }
|
|
32
35
|
}
|
|
33
36
|
}
|
|
34
37
|
},
|
package/index.js
CHANGED
|
@@ -21,7 +21,7 @@ const extractMonthDays = (data) => {
|
|
|
21
21
|
return result
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
const
|
|
24
|
+
export const DatePickerGridContainer = {
|
|
25
25
|
props: {
|
|
26
26
|
maxWidth: `${272 / 16}em`,
|
|
27
27
|
position: 'relative',
|
|
@@ -70,28 +70,27 @@ const monthNumbersContainer = {
|
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
-
const props = {
|
|
74
|
-
yearRange: [1993, 2023],
|
|
75
|
-
maxHeight: 'G+B',
|
|
76
|
-
boxSize: 'fit-content fit-content',
|
|
77
|
-
style: {
|
|
78
|
-
button: {
|
|
79
|
-
padding: '0'
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
73
|
export const DatePicker = {
|
|
85
74
|
extend: [Dialog, Flex],
|
|
75
|
+
|
|
86
76
|
state: {
|
|
77
|
+
yearRange: [1993, 2023],
|
|
87
78
|
activeYear: 1993,
|
|
88
79
|
activeMonth: 8,
|
|
89
80
|
activeDay: 14
|
|
90
81
|
},
|
|
91
82
|
|
|
92
|
-
props
|
|
83
|
+
props: {
|
|
84
|
+
maxHeight: 'G+B2'
|
|
85
|
+
},
|
|
93
86
|
|
|
94
|
-
DatePickerYears: {
|
|
87
|
+
DatePickerYears: {
|
|
88
|
+
style: {
|
|
89
|
+
button: {
|
|
90
|
+
padding: '0'
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
},
|
|
95
94
|
|
|
96
95
|
Flex: {
|
|
97
96
|
props: {
|
|
@@ -100,11 +99,29 @@ export const DatePicker = {
|
|
|
100
99
|
position: 'relative'
|
|
101
100
|
},
|
|
102
101
|
|
|
103
|
-
DatePickerMonthsSlider: {
|
|
102
|
+
DatePickerMonthsSlider: {
|
|
103
|
+
style: {
|
|
104
|
+
button: {
|
|
105
|
+
padding: '0'
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
},
|
|
104
109
|
|
|
105
|
-
DatePickerWeekDays: {
|
|
110
|
+
DatePickerWeekDays: {
|
|
111
|
+
style: {
|
|
112
|
+
button: {
|
|
113
|
+
padding: '0'
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
},
|
|
106
117
|
|
|
107
|
-
|
|
118
|
+
DatePickerGridContainer: {
|
|
119
|
+
style: {
|
|
120
|
+
button: {
|
|
121
|
+
padding: '0'
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
},
|
|
108
125
|
|
|
109
126
|
DialogFooter: {}
|
|
110
127
|
}
|
package/months.js
CHANGED
|
@@ -39,14 +39,21 @@ export const DatePickerMonthsSlider = {
|
|
|
39
39
|
position: 'absolute',
|
|
40
40
|
zIndex: '35',
|
|
41
41
|
background: 'transparent',
|
|
42
|
-
color: '#0079FD',
|
|
43
42
|
':first-child': { left: '18px' },
|
|
44
43
|
':last-child': { right: '18px' }
|
|
45
44
|
}
|
|
46
45
|
}
|
|
47
46
|
},
|
|
48
47
|
|
|
49
|
-
Button_left: {
|
|
48
|
+
Button_left: {
|
|
49
|
+
icon: 'arrowLeft',
|
|
50
|
+
'@dark': {
|
|
51
|
+
theme: 'primary @dark .color-only'
|
|
52
|
+
},
|
|
53
|
+
'@light': {
|
|
54
|
+
theme: 'primary @light .color-only'
|
|
55
|
+
}
|
|
56
|
+
},
|
|
50
57
|
|
|
51
58
|
Flex: {
|
|
52
59
|
props: {
|
|
@@ -96,5 +103,13 @@ export const DatePickerMonthsSlider = {
|
|
|
96
103
|
}
|
|
97
104
|
},
|
|
98
105
|
|
|
99
|
-
Button_right: {
|
|
106
|
+
Button_right: {
|
|
107
|
+
icon: 'arrowRight',
|
|
108
|
+
'@dark': {
|
|
109
|
+
theme: 'primary @dark .color-only'
|
|
110
|
+
},
|
|
111
|
+
'@light': {
|
|
112
|
+
theme: 'primary @light .color-only'
|
|
113
|
+
}
|
|
114
|
+
}
|
|
100
115
|
}
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@symbo.ls/datepicker",
|
|
3
|
-
"version": "2.11.
|
|
3
|
+
"version": "2.11.90",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"license": "MIT",
|
|
6
|
-
"gitHead": "
|
|
6
|
+
"gitHead": "4c5a23152b7b38852c4f7115c2565dfe724382ee",
|
|
7
7
|
"dependencies": {
|
|
8
8
|
"@symbo.ls/atoms": "latest",
|
|
9
9
|
"@symbo.ls/button": "latest",
|
package/years.js
CHANGED
|
@@ -63,8 +63,8 @@ export const DatePickerYears = {
|
|
|
63
63
|
}
|
|
64
64
|
},
|
|
65
65
|
|
|
66
|
-
$setCollection: ({ state
|
|
67
|
-
const { yearRange } =
|
|
66
|
+
$setCollection: ({ state }) => {
|
|
67
|
+
const { yearRange } = state
|
|
68
68
|
|
|
69
69
|
if (yearRange) {
|
|
70
70
|
const [start, end] = yearRange
|