Skip to content

Commit 43cf6c3

Browse files
Brechardrobingenz
Brechard
and
robingenz
authored
feat: add minuteInterval parameter for time picker intervals (#616)
* feat: add minuteInterval parameter for time picker intervals * fix: remove Android changes for minuteInterval parameter * Update .changeset/hot-feet-roll.md --------- Co-authored-by: Robin Genz <mail@robingenz.dev>
1 parent c422d1d commit 43cf6c3

6 files changed

Lines changed: 48 additions & 23 deletions

File tree

‎.changeset/hot-feet-roll.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@capawesome-team/capacitor-datetime-picker': minor
3+
---
4+
5+
feat(ios): add `minuteInterval` option

‎packages/datetime-picker/README.md‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -115,19 +115,20 @@ Only available on Android and iOS.
115115

116116
#### PresentOptions
117117

118-
| Prop | Type | Description | Default | Since |
119-
| --------------------------- | ------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- | ----- |
120-
| **`cancelButtonText`** | <code>string</code> | The cancel button text. | <code>'Cancel'</code> | 0.0.1 |
121-
| **`doneButtonText`** | <code>string</code> | The done button text. | <code>'Ok'</code> | 0.0.1 |
122-
| **`format`** | <code>string</code> | The format in which values are received and returned. | <code>'yyyy-MM-dd'T'HH:mm:ss.sss'Z''</code> | 0.0.1 |
123-
| **`locale`** | <code>string</code> | BCP 47 language tag to define the language of the UI. | | 0.0.2 |
124-
| **`max`** | <code>string</code> | The latest date and time to accept. The format of this value must match the value of the `format` parameter. This value must specify a date string later than or equal to the one specified by the `min` attribute. | | 0.0.1 |
125-
| **`min`** | <code>string</code> | The earliest date and time to accept. The format of this value must match the value of the `format` parameter. This value must specify a date string earlier than or equal to the one specified by the `max` attribute. | | 0.0.1 |
126-
| **`mode`** | <code>'date' \| 'time' \| 'datetime'</code> | Whether you want a date or time or datetime picker. | <code>'datetime'</code> | 0.0.1 |
127-
| **`theme`** | <code>'auto' \| 'light' \| 'dark'</code> | Choose the theme that the datetime picker should have. With `auto` the system theme is used. This value overwrites the `theme` configuration value. Only available on Android and iOS. Spinner options only available on Android | | 0.0.1 |
128-
| **`value`** | <code>string</code> | The predefined value when opening the picker. The format of this value must match the value of the `format` parameter. | | 0.0.1 |
129-
| **`androidTimePickerMode`** | <code>'clock' \| 'spinner'</code> | Whether to use the spinner or clock mode for the time picker on Android. This value overwrites the `androidTimePickerMode` configuration value. Only available on Android. | | 5.1.0 |
130-
| **`androidDatePickerMode`** | <code>'spinner' \| 'calendar'</code> | Whether to use the calendar or spinner mode for the date picker on Android. This value overwrites the `androidDatePickerMode` configuration value. Only available on Android. | | 5.1.0 |
118+
| Prop | Type | Description | Default | Since |
119+
| --------------------------- | ------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- | ----- |
120+
| **`cancelButtonText`** | <code>string</code> | The cancel button text. | <code>'Cancel'</code> | 0.0.1 |
121+
| **`doneButtonText`** | <code>string</code> | The done button text. | <code>'Ok'</code> | 0.0.1 |
122+
| **`format`** | <code>string</code> | The format in which values are received and returned. | <code>'yyyy-MM-dd'T'HH:mm:ss.sss'Z''</code> | 0.0.1 |
123+
| **`locale`** | <code>string</code> | BCP 47 language tag to define the language of the UI. | | 0.0.2 |
124+
| **`max`** | <code>string</code> | The latest date and time to accept. The format of this value must match the value of the `format` parameter. This value must specify a date string later than or equal to the one specified by the `min` attribute. | | 0.0.1 |
125+
| **`min`** | <code>string</code> | The earliest date and time to accept. The format of this value must match the value of the `format` parameter. This value must specify a date string earlier than or equal to the one specified by the `max` attribute. | | 0.0.1 |
126+
| **`mode`** | <code>'date' \| 'time' \| 'datetime'</code> | Whether you want a date or time or datetime picker. | <code>'datetime'</code> | 0.0.1 |
127+
| **`theme`** | <code>'auto' \| 'light' \| 'dark'</code> | Choose the theme that the datetime picker should have. With `auto` the system theme is used. This value overwrites the `theme` configuration value. Only available on Android and iOS. Spinner options only available on Android | | 0.0.1 |
128+
| **`value`** | <code>string</code> | The predefined value when opening the picker. The format of this value must match the value of the `format` parameter. | | 0.0.1 |
129+
| **`androidTimePickerMode`** | <code>'clock' \| 'spinner'</code> | Whether to use the spinner or clock mode for the time picker on Android. This value overwrites the `androidTimePickerMode` configuration value. Only available on Android. | | 5.1.0 |
130+
| **`androidDatePickerMode`** | <code>'spinner' \| 'calendar'</code> | Whether to use the calendar or spinner mode for the date picker on Android. This value overwrites the `androidDatePickerMode` configuration value. Only available on Android. | | 5.1.0 |
131+
| **`minuteInterval`** | <code>number</code> | The minute interval of the time picker. This controls the granularity of the minute selector (e.g., 15 for 0, 15, 30, 45). The value must be evenly divisible into 60. Only available on iOS when using time or datetime modes. On Android, this parameter is ignored. | <code>1</code> | 6.1.0 |
131132

132133
</docgen-api>
133134

‎packages/datetime-picker/ios/Plugin/DatetimePicker.swift‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@ import Foundation
1111
self.config = config
1212
}
1313

14-
@objc public func presentDatetimePicker(date: Date, minDate: Date?, maxDate: Date?, locale: Locale?, cancelButtonText: String, doneButtonText: String, theme: String?, completion: @escaping (Date?, ErrorCode) -> Void) {
14+
@objc public func presentDatetimePicker(date: Date, minDate: Date?, maxDate: Date?, locale: Locale?, cancelButtonText: String, doneButtonText: String, theme: String?, minuteInterval: Int, completion: @escaping (Date?, ErrorCode) -> Void) {
1515
closeKeyboard()
1616
DispatchQueue.main.asyncAfter(deadline: .now() + waitForKeyboardCloseSeconds) {
1717
RPicker.selectDate(title: "", cancelText: cancelButtonText, doneText: doneButtonText, datePickerMode: .dateAndTime, selectedDate: date,
18-
minDate: minDate, maxDate: maxDate, locale: locale, theme: self.getTheme(unconvertedTheme: theme), completion: { (date, errorCode) in
18+
minDate: minDate, maxDate: maxDate, locale: locale, theme: self.getTheme(unconvertedTheme: theme), minuteInterval: minuteInterval, completion: { (date, errorCode) in
1919
completion(date, errorCode)
2020
})
2121
}
@@ -32,12 +32,12 @@ import Foundation
3232
}
3333
}
3434

35-
@objc public func presentTimePicker(date: Date, locale: Locale?, cancelButtonText: String, doneButtonText: String, theme: String?, completion: @escaping (Date?, ErrorCode) -> Void) {
35+
@objc public func presentTimePicker(date: Date, locale: Locale?, cancelButtonText: String, doneButtonText: String, theme: String?, minuteInterval: Int, completion: @escaping (Date?, ErrorCode) -> Void) {
3636
closeKeyboard()
3737
DispatchQueue.main.asyncAfter(deadline: .now() + waitForKeyboardCloseSeconds) {
3838
RPicker.selectDate(title: "", cancelText: cancelButtonText, doneText: doneButtonText,
3939
datePickerMode: .time, selectedDate: date, locale: locale, style: DatetimePickerStyle.wheel,
40-
theme: self.getTheme(unconvertedTheme: theme), completion: { (date, errorCode) in
40+
theme: self.getTheme(unconvertedTheme: theme), minuteInterval: minuteInterval, completion: { (date, errorCode) in
4141
completion(date, errorCode)
4242
})
4343
}

‎packages/datetime-picker/ios/Plugin/DatetimePickerPlugin.swift‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ public class DatetimePickerPlugin: CAPPlugin, CAPBridgedPlugin {
3535
let value = call.getString("value")
3636
let cancelButtonText = call.getString("cancelButtonText", "Cancel")
3737
let doneButtonText = call.getString("doneButtonText", "Ok")
38+
let minuteInterval = call.getInt("minuteInterval", 1)
3839

3940
var locale: Locale?
4041
if let localeString = localeString {
@@ -74,13 +75,13 @@ public class DatetimePickerPlugin: CAPPlugin, CAPBridgedPlugin {
7475

7576
if mode == "datetime" {
7677
implementation?.presentDatetimePicker(date: date, minDate: minDate, maxDate: maxDate, locale: locale,
77-
cancelButtonText: cancelButtonText, doneButtonText: doneButtonText, theme: theme, completion: completion)
78+
cancelButtonText: cancelButtonText, doneButtonText: doneButtonText, theme: theme, minuteInterval: minuteInterval, completion: completion)
7879
} else if mode == "date" {
7980
implementation?.presentDatePicker(date: date, minDate: minDate, maxDate: maxDate, locale: locale,
8081
cancelButtonText: cancelButtonText, doneButtonText: doneButtonText, theme: theme, completion: completion)
8182
} else if mode == "time" {
8283
implementation?.presentTimePicker(date: date, locale: locale, cancelButtonText: cancelButtonText,
83-
doneButtonText: doneButtonText, theme: theme, completion: completion)
84+
doneButtonText: doneButtonText, theme: theme, minuteInterval: minuteInterval, completion: completion)
8485
} else {
8586
call.reject(errorModeInvalid)
8687
}

‎packages/datetime-picker/ios/Plugin/RPicker.swift‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -45,10 +45,11 @@ import UIKit
4545
locale: Locale? = nil,
4646
style: DatetimePickerStyle = .inline,
4747
theme: Theme = .auto,
48+
minuteInterval: Int = 1,
4849
completion: ((_ date: Date?, _ errorCode: ErrorCode) -> Void)?) {
4950

5051
guard let vc = controller(title: title, cancelText: cancelText, doneText: doneText, datePickerMode: datePickerMode,
51-
selectedDate: selectedDate, minDate: minDate, maxDate: maxDate, locale: locale, style: style, theme: theme) else { return }
52+
selectedDate: selectedDate, minDate: minDate, maxDate: maxDate, locale: locale, style: style, theme: theme, minuteInterval: minuteInterval) else { return }
5253

5354
vc.onDateSelected = { (selectedData) in
5455
completion?(selectedData, ErrorCode.none)
@@ -70,14 +71,15 @@ import UIKit
7071
maxDate: Date? = nil,
7172
locale: Locale? = nil,
7273
style: DatetimePickerStyle = .inline,
73-
theme: Theme = .auto) -> RPickerController? {
74+
theme: Theme = .auto,
75+
minuteInterval: Int = 1) -> RPickerController? {
7476

7577
if let cc = UIWindow.currentController {
7678
if RPicker.sharedInstance.isPresented == false {
7779
RPicker.sharedInstance.isPresented = true
7880

7981
let vc = RPickerController(title: title, cancelText: cancelText, doneText: doneText, datePickerMode: datePickerMode,
80-
selectedDate: selectedDate, minDate: minDate, maxDate: maxDate, locale: locale, style: style, theme: theme)
82+
selectedDate: selectedDate, minDate: minDate, maxDate: maxDate, locale: locale, style: style, theme: theme, minuteInterval: minuteInterval)
8183

8284
vc.modalPresentationStyle = .overCurrentContext
8385
vc.modalTransitionStyle = .crossDissolve
@@ -133,6 +135,7 @@ class RPickerController: UIViewController {
133135
var datePickerMode: UIDatePicker.Mode = .date
134136
var datePickerStyle: DatetimePickerStyle = .inline
135137
var theme: Theme = .auto
138+
var minuteInterval: Int = 1
136139

137140
// MARK: - Private variables
138141
private let barViewHeight: CGFloat = 44
@@ -152,7 +155,8 @@ class RPickerController: UIViewController {
152155
maxDate: Date? = nil,
153156
locale: Locale? = nil,
154157
style: DatetimePickerStyle = .inline,
155-
theme: Theme = .auto) {
158+
theme: Theme = .auto,
159+
minuteInterval: Int = 1) {
156160

157161
self.titleText = title
158162
self.cancelText = cancelText
@@ -164,6 +168,7 @@ class RPickerController: UIViewController {
164168
self.locale = locale
165169
self.datePickerStyle = style
166170
self.theme = theme
171+
self.minuteInterval = minuteInterval
167172

168173
super.init(nibName: nil, bundle: nil)
169174

@@ -312,6 +317,7 @@ class RPickerController: UIViewController {
312317
picker.maximumDate = maxDate
313318
picker.date = selectedDate
314319
picker.datePickerMode = datePickerMode
320+
picker.minuteInterval = minuteInterval
315321
if let locale = locale {
316322
picker.locale = locale
317323
}

‎packages/datetime-picker/src/definitions.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -139,6 +139,18 @@ export interface PresentOptions {
139139
* @since 5.1.0
140140
*/
141141
androidDatePickerMode?: 'calendar' | 'spinner';
142+
/**
143+
* The minute interval of the time picker.
144+
* This controls the granularity of the minute selector (e.g., 15 for 0, 15, 30, 45).
145+
* The value must be evenly divisible into 60.
146+
*
147+
* Only available on iOS when using time or datetime modes.
148+
* On Android, this parameter is ignored.
149+
*
150+
* @since 7.1.0
151+
* @default 1
152+
*/
153+
minuteInterval?: number;
142154
}
143155

144156
export interface PresentResult {

0 commit comments

Comments
 (0)