File tree Expand file tree Collapse file tree 8 files changed +30
-4
lines changed Expand file tree Collapse file tree 8 files changed +30
-4
lines changed Original file line number Diff line number Diff line change @@ -26,6 +26,7 @@ export interface CalendarProps {
26
26
closeIcon ?: ReactNode
27
27
disableDate : ( date : CalendarDay ) => boolean
28
28
renderHeaderButtons ?: ( ) => string | JSX . Element
29
+ renderBottomButton ?: ( ) => string | JSX . Element
29
30
renderDay ?: ( date : CalendarDay ) => string | JSX . Element
30
31
renderDayTop ?: ( date : CalendarDay ) => string | JSX . Element
31
32
renderDayBottom ?: ( date : CalendarDay ) => string | JSX . Element
@@ -92,6 +93,7 @@ export const Calendar = React.forwardRef<
92
93
closeIcon,
93
94
disableDate,
94
95
renderHeaderButtons,
96
+ renderBottomButton,
95
97
renderDay,
96
98
renderDayTop,
97
99
renderDayBottom,
@@ -155,6 +157,7 @@ export const Calendar = React.forwardRef<
155
157
firstDayOfWeek = { firstDayOfWeek }
156
158
disableDate = { disableDate }
157
159
renderHeaderButtons = { renderHeaderButtons }
160
+ renderBottomButton = { renderBottomButton }
158
161
renderDay = { renderDay }
159
162
renderDayTop = { renderDayTop }
160
163
renderDayBottom = { renderDayBottom }
Original file line number Diff line number Diff line change @@ -26,6 +26,7 @@ export interface CalendarProps {
26
26
closeIcon ?: ReactNode
27
27
disableDate : ( date : CalendarDay ) => boolean
28
28
renderHeaderButtons ?: ( ) => string | JSX . Element
29
+ renderBottomButton ?: ( ) => string | JSX . Element
29
30
renderDay ?: ( date : CalendarDay ) => string | JSX . Element
30
31
renderDayTop ?: ( date : CalendarDay ) => string | JSX . Element
31
32
renderDayBottom ?: ( date : CalendarDay ) => string | JSX . Element
@@ -92,6 +93,7 @@ export const Calendar = React.forwardRef<
92
93
closeIcon,
93
94
disableDate,
94
95
renderHeaderButtons,
96
+ renderBottomButton,
95
97
renderDay,
96
98
renderDayTop,
97
99
renderDayBottom,
@@ -140,6 +142,7 @@ export const Calendar = React.forwardRef<
140
142
children = { children }
141
143
type = { type }
142
144
autoBackfill = { autoBackfill }
145
+ renderBottomButton = { renderBottomButton }
143
146
popup = { popup }
144
147
title = { title || locale . calendaritem . title }
145
148
defaultValue = { defaultValue }
Original file line number Diff line number Diff line change @@ -123,6 +123,7 @@ import { Calendar } from '@nutui/nutui-react'
123
123
| closeIcon | Custom Icon | ` ReactNode ` | ` close ` |
124
124
| disableDate | set disable date | ` (date: CalendarDay) => boolean ` | ` - ` |
125
125
| renderHeaderButtons | custom buttons, under the title but above the subtitle | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
+ | renderBottomButton | Custom calendar bottom button | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
127
| renderDay | day info | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
127
128
| renderDayTop | something above day | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
128
129
| renderDayBottom | something under day | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
Original file line number Diff line number Diff line change @@ -123,6 +123,7 @@ import { Calendar } from '@nutui/nutui-react'
123
123
| closeIcon | 自定义 Icon | ` ReactNode ` | ` close ` |
124
124
| disableDate | 设置不可选日期 | ` (date: CalendarDay) => boolean ` | ` - ` |
125
125
| renderHeaderButtons | 自定义日历标题下部,可用以添加自定义操作 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
+ | renderBottomButton | 自定义日历底部按钮 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
127
| renderDay | 日期信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
127
128
| renderDayTop | 日期顶部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
128
129
| renderDayBottom | 日期底部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
Original file line number Diff line number Diff line change @@ -123,6 +123,7 @@ import { Calendar } from '@nutui/nutui-react-taro'
123
123
| closeIcon | 自定义 Icon | ` ReactNode ` | ` close ` |
124
124
| disableDate | 设置不可选日期 | ` (date: CalendarDay) => boolean ` | ` - ` |
125
125
| renderHeaderButtons | 自定义日历标题下部,可用以添加自定义操作 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
+ | renderBottomButton | 自定义日历底部按钮 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
127
| renderDay | 日期信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
127
128
| renderDayTop | 日期顶部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
128
129
| renderDayBottom | 日期底部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
Original file line number Diff line number Diff line change @@ -123,6 +123,7 @@ import { Calendar } from '@nutui/nutui-react'
123
123
| closeIcon | 自定義 Icon | ` ReactNode ` | ` close ` |
124
124
| disableDate | 設置不可選日期 | ` (date: CalendarDay) => boolean ` | ` - ` |
125
125
| renderHeaderButtons | 自定義日歴標題下部,可用以添加自定義操作 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
+ | renderBottomButton | 自定義日歴底部按鈕 | ` () => string ` \| ` JSX.Element ` | ` - ` |
126
127
| renderDay | 日期信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
127
128
| renderDayTop | 日期頂部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
128
129
| renderDayBottom | 日期底部信息 | ` (date: CalendarDay) => string ` \| ` JSX.Element ` | ` - ` |
Original file line number Diff line number Diff line change @@ -56,6 +56,7 @@ export interface CalendarItemProps extends PopupProps {
56
56
firstDayOfWeek : number
57
57
disableDate : ( date : CalendarDay ) => boolean
58
58
renderHeaderButtons : ( ) => string | JSX . Element
59
+ renderBottomButton : ( ) => string | JSX . Element
59
60
renderDay : ( date : CalendarDay ) => string | JSX . Element
60
61
renderDayTop : ( date : CalendarDay ) => string | JSX . Element
61
62
renderDayBottom : ( date : CalendarDay ) => string | JSX . Element
@@ -121,6 +122,7 @@ export const CalendarItem = React.forwardRef<
121
122
renderDay,
122
123
renderDayTop,
123
124
renderDayBottom,
125
+ renderBottomButton,
124
126
value,
125
127
onConfirm,
126
128
onUpdate,
@@ -876,8 +878,14 @@ export const CalendarItem = React.forwardRef<
876
878
return (
877
879
< div className = "nut-calendar-footer" >
878
880
{ children }
879
- < div className = "calendar-confirm-btn" onClick = { confirm } >
880
- { confirmText || locale . confirm }
881
+ < div onClick = { confirm } >
882
+ { renderBottomButton ? (
883
+ renderBottomButton ( )
884
+ ) : (
885
+ < div className = "calendar-confirm-btn" >
886
+ { confirmText || locale . confirm }
887
+ </ div >
888
+ ) }
881
889
</ div >
882
890
</ div >
883
891
)
Original file line number Diff line number Diff line change @@ -55,6 +55,7 @@ export interface CalendarItemProps extends PopupProps {
55
55
firstDayOfWeek : number
56
56
disableDate : ( date : CalendarDay ) => boolean
57
57
renderHeaderButtons : ( ) => string | JSX . Element
58
+ renderBottomButton : ( ) => string | JSX . Element
58
59
renderDay : ( date : CalendarDay ) => string | JSX . Element
59
60
renderDayTop : ( date : CalendarDay ) => string | JSX . Element
60
61
renderDayBottom : ( date : CalendarDay ) => string | JSX . Element
@@ -116,6 +117,7 @@ export const CalendarItem = React.forwardRef<
116
117
firstDayOfWeek,
117
118
disableDate,
118
119
renderHeaderButtons,
120
+ renderBottomButton,
119
121
renderDay,
120
122
renderDayTop,
121
123
renderDayBottom,
@@ -875,8 +877,14 @@ export const CalendarItem = React.forwardRef<
875
877
return (
876
878
< div className = "nut-calendar-footer" >
877
879
{ children }
878
- < div className = "calendar-confirm-btn" onClick = { confirm } >
879
- { confirmText || locale . confirm }
880
+ < div onClick = { confirm } >
881
+ { renderBottomButton ? (
882
+ renderBottomButton ( )
883
+ ) : (
884
+ < div className = "calendar-confirm-btn" >
885
+ { confirmText || locale . confirm }
886
+ </ div >
887
+ ) }
880
888
</ div >
881
889
</ div >
882
890
)
You can’t perform that action at this time.
0 commit comments