datatables.net-datetime 1.6.3 → 2.0.0-beta.1
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/dist/dataTables.dateTime.css +1 -1
- package/dist/dataTables.dateTime.d.ts +272 -0
- package/dist/dataTables.dateTime.js +1540 -1783
- package/dist/dataTables.dateTime.min.js +3 -5
- package/dist/dataTables.dateTime.min.mjs +3 -5
- package/dist/dataTables.dateTime.mjs +1521 -1767
- package/dist/interface.d.ts +129 -0
- package/dist/interface.js +2 -0
- package/dist/types.d.ts +404 -0
- package/docs/option/disableDays.xml +1 -1
- package/docs/option/firstDay.xml +24 -13
- package/examples/index.xml +1 -1
- package/examples/initialisation/alwaysVisible.xml +3 -13
- package/examples/initialisation/buttons.xml +3 -17
- package/examples/initialisation/datetime.xml +3 -13
- package/examples/initialisation/dayjs.xml +3 -16
- package/examples/initialisation/hidden.xml +3 -11
- package/examples/initialisation/i18n.xml +3 -31
- package/examples/initialisation/index.xml +1 -1
- package/examples/initialisation/luxon.xml +2 -12
- package/examples/initialisation/moment.xml +2 -12
- package/examples/initialisation/simple.xml +3 -11
- package/examples/integration/datatables.xml +2 -42
- package/examples/integration/form.xml +2 -34
- package/js/{dataTables.dateTime.js → dataTables.dateTime.ts} +845 -682
- package/js/interface.ts +172 -0
- package/make.sh +17 -5
- package/nuget.nuspec +2 -2
- package/package.json +4 -1
- package/rollup.config.mjs +19 -0
- package/test/options/dateTime.disableDays.js +2 -0
- package/test/options/dateTime.firstDay.js +2 -0
- package/test/options/dateTime.i18n.weekdays.js +2 -0
- package/tsconfig.json +20 -0
- package/datatables.net-datetime.1.6.1.nupkg +0 -0
- package/datatables.net-datetime.1.6.2.nupkg +0 -0
- package/js/dataTables.dateTime.d.ts +0 -67
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { Dom } from 'datatables.net';
|
|
2
|
+
import { DateTime } from './dataTables.dateTime';
|
|
3
|
+
type DeepPartial<T> = T extends object ? {
|
|
4
|
+
[P in keyof T]?: DeepPartial<T[P]>;
|
|
5
|
+
} : T;
|
|
6
|
+
export interface Defaults {
|
|
7
|
+
/** Makes the date picker always display. */
|
|
8
|
+
alwaysVisible: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* If the picker element should be inserted next to the `<input>` or to the
|
|
11
|
+
* `<body>`.
|
|
12
|
+
*/
|
|
13
|
+
attachTo: 'body' | 'input';
|
|
14
|
+
/** Display control buttons */
|
|
15
|
+
buttons: {
|
|
16
|
+
/** Enable button to clear the value */
|
|
17
|
+
clear: boolean;
|
|
18
|
+
/** Enable button move the current value into view */
|
|
19
|
+
selected: boolean;
|
|
20
|
+
/** Enable button move "today" into view */
|
|
21
|
+
today: boolean;
|
|
22
|
+
};
|
|
23
|
+
classPrefix: string;
|
|
24
|
+
/** Specify days that cannot be selected. */
|
|
25
|
+
disableDays: number[] | null | ((day: Date) => boolean);
|
|
26
|
+
/** Initial picker month / year to show. `null` will default to current */
|
|
27
|
+
display: {
|
|
28
|
+
year: number;
|
|
29
|
+
month: number;
|
|
30
|
+
} | null;
|
|
31
|
+
/**
|
|
32
|
+
* First day of the week. (0: Sunday, 1: Monday, etc). If `null` then
|
|
33
|
+
* automatic detection will be used based on the user's locale.
|
|
34
|
+
*/
|
|
35
|
+
firstDay: number | null;
|
|
36
|
+
/** The format of the date data. */
|
|
37
|
+
format: string;
|
|
38
|
+
/** Sets which hours are selectable. */
|
|
39
|
+
hoursAvailable: number[] | null;
|
|
40
|
+
/** Language strings for DateTime */
|
|
41
|
+
i18n: DTLanguage;
|
|
42
|
+
/** Set the maximum date that can be selected and displayed. */
|
|
43
|
+
maxDate: Date | null;
|
|
44
|
+
/** Set the minimum date that can be selected and displayed. */
|
|
45
|
+
minDate: Date | null;
|
|
46
|
+
/** Sets which minutes are selectable. */
|
|
47
|
+
minutesAvailable: number[] | null;
|
|
48
|
+
/** strict parameter passed to Luxon or Moment */
|
|
49
|
+
strict: boolean;
|
|
50
|
+
/** locale parameter passed to Luxon or Moment */
|
|
51
|
+
locale: string;
|
|
52
|
+
/**
|
|
53
|
+
* Function that is called whenever the value selected for DateTime changes.
|
|
54
|
+
*
|
|
55
|
+
* @param value New text value
|
|
56
|
+
* @param date Date value
|
|
57
|
+
* @param el The input host
|
|
58
|
+
*/
|
|
59
|
+
onChange: (value: string, date: Date, el: HTMLElement) => void;
|
|
60
|
+
/** Sets which seconds are selectable. */
|
|
61
|
+
secondsAvailable: number[] | null;
|
|
62
|
+
/**
|
|
63
|
+
* Show the ISO week number at the head of the row
|
|
64
|
+
*/
|
|
65
|
+
showWeekNumber: boolean;
|
|
66
|
+
/**
|
|
67
|
+
* The range of years provided for selection. Note that this option can be
|
|
68
|
+
* overruled by max / min date.
|
|
69
|
+
*/
|
|
70
|
+
yearRange: number;
|
|
71
|
+
/** @deprecated */
|
|
72
|
+
minutesIncrement: number;
|
|
73
|
+
/** @deprecated */
|
|
74
|
+
secondsIncrement: number;
|
|
75
|
+
}
|
|
76
|
+
export interface Options extends DeepPartial<Defaults> {
|
|
77
|
+
}
|
|
78
|
+
export default DateTime;
|
|
79
|
+
declare module 'datatables.net' {
|
|
80
|
+
interface DataTablesStatic {
|
|
81
|
+
DateTime: typeof DateTime;
|
|
82
|
+
}
|
|
83
|
+
interface Language {
|
|
84
|
+
datetime: DTLanguage;
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
export interface DTLanguage {
|
|
88
|
+
clear: string;
|
|
89
|
+
previous: string;
|
|
90
|
+
next: string;
|
|
91
|
+
months: string[];
|
|
92
|
+
weekdays: string[];
|
|
93
|
+
amPm: string[];
|
|
94
|
+
hours: string;
|
|
95
|
+
minutes: string;
|
|
96
|
+
seconds: string;
|
|
97
|
+
today: string;
|
|
98
|
+
selected: string;
|
|
99
|
+
unknown: string;
|
|
100
|
+
}
|
|
101
|
+
export interface Settings {
|
|
102
|
+
d: Date | null;
|
|
103
|
+
display: Date | null;
|
|
104
|
+
minutesRange: number | null;
|
|
105
|
+
secondsRange: number | null;
|
|
106
|
+
namespace: string;
|
|
107
|
+
parts: {
|
|
108
|
+
date: boolean;
|
|
109
|
+
time: boolean;
|
|
110
|
+
seconds: boolean;
|
|
111
|
+
hours12: boolean;
|
|
112
|
+
};
|
|
113
|
+
showTo: null | ReturnType<typeof setTimeout>;
|
|
114
|
+
}
|
|
115
|
+
export interface DomInternal {
|
|
116
|
+
container: Dom;
|
|
117
|
+
date: Dom;
|
|
118
|
+
title: Dom;
|
|
119
|
+
calendar: Dom;
|
|
120
|
+
time: Dom;
|
|
121
|
+
error: Dom;
|
|
122
|
+
buttons: Dom;
|
|
123
|
+
clear: Dom;
|
|
124
|
+
today: Dom;
|
|
125
|
+
selected: Dom;
|
|
126
|
+
previous: Dom;
|
|
127
|
+
next: Dom;
|
|
128
|
+
input: Dom<HTMLInputElement>;
|
|
129
|
+
}
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,404 @@
|
|
|
1
|
+
import { Dom } from 'datatables.net';
|
|
2
|
+
|
|
3
|
+
/*! DateTime for DataTables.net
|
|
4
|
+
* Copyright (c) SpryMedia Ltd - datatables.net/license
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
declare class DateTime {
|
|
8
|
+
/**
|
|
9
|
+
* Use a specific compatible date library
|
|
10
|
+
*/
|
|
11
|
+
static use(lib: any): void;
|
|
12
|
+
/**
|
|
13
|
+
* For generating unique namespaces
|
|
14
|
+
*/
|
|
15
|
+
private static _instance;
|
|
16
|
+
/**
|
|
17
|
+
* To indicate to DataTables what type of library this is
|
|
18
|
+
*/
|
|
19
|
+
static type: string;
|
|
20
|
+
/**
|
|
21
|
+
* Defaults for the date time picker
|
|
22
|
+
*/
|
|
23
|
+
static defaults: Defaults;
|
|
24
|
+
static version: string;
|
|
25
|
+
/**
|
|
26
|
+
* Destroy the control
|
|
27
|
+
*/
|
|
28
|
+
destroy(): void;
|
|
29
|
+
display(year: any, month: any): this | {
|
|
30
|
+
month: number;
|
|
31
|
+
year: number;
|
|
32
|
+
};
|
|
33
|
+
errorMsg(msg: any): this;
|
|
34
|
+
hide(): this;
|
|
35
|
+
max(date: any): this;
|
|
36
|
+
min(date: any): this;
|
|
37
|
+
/**
|
|
38
|
+
* Check if an element belongs to this control
|
|
39
|
+
*
|
|
40
|
+
* @param {node} node Element to check
|
|
41
|
+
* @return {boolean} true if owned by this control, false otherwise
|
|
42
|
+
*/
|
|
43
|
+
owns(node: any): boolean;
|
|
44
|
+
/**
|
|
45
|
+
* Get the value
|
|
46
|
+
*/
|
|
47
|
+
val(): Date;
|
|
48
|
+
/**
|
|
49
|
+
* Set the value
|
|
50
|
+
*
|
|
51
|
+
* @param set Value to set
|
|
52
|
+
* @param write Flag to indicate if the formatted value
|
|
53
|
+
* should be written into the input element
|
|
54
|
+
*/
|
|
55
|
+
val(set: string | Date, write?: boolean): any;
|
|
56
|
+
/**
|
|
57
|
+
* Similar to `val()` but uses a given date / time format
|
|
58
|
+
*
|
|
59
|
+
* @param format Format to get the data as (getter) or that is input
|
|
60
|
+
* (setter)
|
|
61
|
+
* @param val Value to write (if undefined, used as a getter)
|
|
62
|
+
* @returns
|
|
63
|
+
*/
|
|
64
|
+
valFormat(format: any, val: any): any;
|
|
65
|
+
private dom;
|
|
66
|
+
private c;
|
|
67
|
+
private s;
|
|
68
|
+
constructor(input: any, opts: any);
|
|
69
|
+
/**
|
|
70
|
+
* Build the control and assign initial event handlers
|
|
71
|
+
*/
|
|
72
|
+
private _init;
|
|
73
|
+
/**
|
|
74
|
+
* Compare the date part only of two dates - this is made super easy by the
|
|
75
|
+
* toDateString method!
|
|
76
|
+
*
|
|
77
|
+
* @param a Date 1
|
|
78
|
+
* @param b Date 2
|
|
79
|
+
*/
|
|
80
|
+
private _compareDates;
|
|
81
|
+
/**
|
|
82
|
+
* Convert from one format to another
|
|
83
|
+
*
|
|
84
|
+
* @param val Value
|
|
85
|
+
* @param from Format to convert from. If null a `Date` must be given
|
|
86
|
+
* @param to Format to convert to. If null a `Date` will be returned
|
|
87
|
+
* @returns Converted value
|
|
88
|
+
*/
|
|
89
|
+
private _convert;
|
|
90
|
+
/**
|
|
91
|
+
* When changing month, take account of the fact that some months don't have
|
|
92
|
+
* the same number of days. For example going from January to February you
|
|
93
|
+
* can have the 31st of Jan selected and just add a month since the date
|
|
94
|
+
* would still be 31, and thus drop you into March.
|
|
95
|
+
*
|
|
96
|
+
* @param date Date - will be modified
|
|
97
|
+
* @param month Month to set
|
|
98
|
+
*/
|
|
99
|
+
private _correctMonth;
|
|
100
|
+
/**
|
|
101
|
+
* Get the number of days in a method. Based on
|
|
102
|
+
* http://stackoverflow.com/a/4881951 by Matti Virkkunen
|
|
103
|
+
*
|
|
104
|
+
* @param year Year
|
|
105
|
+
* @param month Month (starting at 0)
|
|
106
|
+
*/
|
|
107
|
+
private _daysInMonth;
|
|
108
|
+
/**
|
|
109
|
+
* Create a new date object which has the UTC values set to the local time.
|
|
110
|
+
* This allows the local time to be used directly for the library which
|
|
111
|
+
* always bases its calculations and display on UTC.
|
|
112
|
+
*
|
|
113
|
+
* @param s Date to "convert"
|
|
114
|
+
* @return Shifted date
|
|
115
|
+
*/
|
|
116
|
+
private _dateToUtc;
|
|
117
|
+
/**
|
|
118
|
+
* Create a UTC ISO8601 date part from a date object
|
|
119
|
+
*
|
|
120
|
+
* @param d Date to "convert"
|
|
121
|
+
* @return ISO formatted date
|
|
122
|
+
*/
|
|
123
|
+
private _dateToUtcString;
|
|
124
|
+
/**
|
|
125
|
+
* Hide the control and remove events related to its display
|
|
126
|
+
*
|
|
127
|
+
* @param destroy Flag to indicate that the instance is being destroyed
|
|
128
|
+
*/
|
|
129
|
+
private _hide;
|
|
130
|
+
/**
|
|
131
|
+
* Convert a 24 hour value to a 12 hour value
|
|
132
|
+
*
|
|
133
|
+
* @param val 24 hour value
|
|
134
|
+
* @return 12 hour value
|
|
135
|
+
*/
|
|
136
|
+
private _hours24To12;
|
|
137
|
+
/**
|
|
138
|
+
* Generate the HTML for a single day in the calendar - this is basically
|
|
139
|
+
* and HTML cell with a button that has data attributes so we know what was
|
|
140
|
+
* clicked on (if it is clicked on) and a bunch of classes for styling.
|
|
141
|
+
*
|
|
142
|
+
* @param {object} day Day object from the `_htmlMonth` method
|
|
143
|
+
* @return {string} HTML cell
|
|
144
|
+
*/
|
|
145
|
+
private _htmlDay;
|
|
146
|
+
/**
|
|
147
|
+
* Create the HTML for a month to be displayed in the calendar table.
|
|
148
|
+
*
|
|
149
|
+
* Based upon the logic used in Pikaday - MIT licensed
|
|
150
|
+
* Copyright (c) 2014 David Bushell
|
|
151
|
+
* https://github.com/dbushell/Pikaday
|
|
152
|
+
*
|
|
153
|
+
* @param year Year
|
|
154
|
+
* @param month Month (starting at 0)
|
|
155
|
+
* @return Calendar month HTML
|
|
156
|
+
*/
|
|
157
|
+
private _htmlMonth;
|
|
158
|
+
/**
|
|
159
|
+
* Create the calendar table's header (week days)
|
|
160
|
+
*
|
|
161
|
+
* @return {string} HTML cells for the row
|
|
162
|
+
*/
|
|
163
|
+
private _htmlMonthHead;
|
|
164
|
+
/**
|
|
165
|
+
* Create a cell that contains week of the year - ISO8601
|
|
166
|
+
*
|
|
167
|
+
* Based on https://stackoverflow.com/questions/6117814/ and
|
|
168
|
+
* http://techblog.procurios.nl/k/n618/news/view/33796/14863/
|
|
169
|
+
*
|
|
170
|
+
* @param d Day of month
|
|
171
|
+
* @param m Month of year (zero index)
|
|
172
|
+
* @param y Year
|
|
173
|
+
* @return HTML string for a day
|
|
174
|
+
*/
|
|
175
|
+
private _htmlWeekOfYear;
|
|
176
|
+
/**
|
|
177
|
+
* Determine if Luxon is being used
|
|
178
|
+
*
|
|
179
|
+
* @returns Flag for Luxon
|
|
180
|
+
*/
|
|
181
|
+
private _isLuxon;
|
|
182
|
+
/**
|
|
183
|
+
* Determine if Moment is being used
|
|
184
|
+
*
|
|
185
|
+
* @returns Flag for Moment
|
|
186
|
+
*/
|
|
187
|
+
private _isMoment;
|
|
188
|
+
/**
|
|
189
|
+
* Determine the first day of the week based on the current locale
|
|
190
|
+
*/
|
|
191
|
+
private _localeFirstDay;
|
|
192
|
+
/**
|
|
193
|
+
* Check if the instance has a date object value - it might be null.
|
|
194
|
+
* If is doesn't set one to now.
|
|
195
|
+
* @returns A Date object
|
|
196
|
+
*/
|
|
197
|
+
private _needValue;
|
|
198
|
+
/**
|
|
199
|
+
* Create option elements from a range in an array
|
|
200
|
+
*
|
|
201
|
+
* @param selector Class name unique to the select element to use
|
|
202
|
+
* @param values Array of values
|
|
203
|
+
* @param labels Array of labels. If given must be the same length as the
|
|
204
|
+
* values parameter.
|
|
205
|
+
*/
|
|
206
|
+
private _options;
|
|
207
|
+
/**
|
|
208
|
+
* Set an option and update the option's span pair (since the select element
|
|
209
|
+
* has opacity 0 for styling)
|
|
210
|
+
*
|
|
211
|
+
* @param selector Class name unique to the select element to use
|
|
212
|
+
* @param val Value to set
|
|
213
|
+
*/
|
|
214
|
+
private _optionSet;
|
|
215
|
+
/**
|
|
216
|
+
* Create time options list.
|
|
217
|
+
*
|
|
218
|
+
* @param unit Time unit - hours, minutes or seconds
|
|
219
|
+
* @param count Count range - 12, 24 or 60
|
|
220
|
+
* @param val Existing value for this unit
|
|
221
|
+
* @param allowed Values allow for selection
|
|
222
|
+
* @param range Override range
|
|
223
|
+
*/
|
|
224
|
+
private _optionsTime;
|
|
225
|
+
/**
|
|
226
|
+
* Create the options for the month and year
|
|
227
|
+
*/
|
|
228
|
+
private _optionsTitle;
|
|
229
|
+
/**
|
|
230
|
+
* Simple two digit pad
|
|
231
|
+
*
|
|
232
|
+
* @param {integer} i Value that might need padding
|
|
233
|
+
* @return {string|integer} Padded value
|
|
234
|
+
*/
|
|
235
|
+
private _pad;
|
|
236
|
+
/**
|
|
237
|
+
* Position the calendar to look attached to the input element
|
|
238
|
+
*/
|
|
239
|
+
private _position;
|
|
240
|
+
/**
|
|
241
|
+
* Create a simple array with a range of values
|
|
242
|
+
*
|
|
243
|
+
* @param start Start value (inclusive)
|
|
244
|
+
* @param end End value (inclusive)
|
|
245
|
+
* @param inc Increment value
|
|
246
|
+
* @return Created array
|
|
247
|
+
*/
|
|
248
|
+
private _range;
|
|
249
|
+
/**
|
|
250
|
+
* Redraw the calendar based on the display date - this is a destructive
|
|
251
|
+
* operation
|
|
252
|
+
*/
|
|
253
|
+
private _setCalander;
|
|
254
|
+
/**
|
|
255
|
+
* Set the month and year for the calendar based on the current display date
|
|
256
|
+
*/
|
|
257
|
+
private _setTitle;
|
|
258
|
+
/**
|
|
259
|
+
* Set the time based on the current value of the widget
|
|
260
|
+
*/
|
|
261
|
+
private _setTime;
|
|
262
|
+
/**
|
|
263
|
+
* Show the widget and add events to the document required only while it
|
|
264
|
+
* is displayed
|
|
265
|
+
*
|
|
266
|
+
*/
|
|
267
|
+
private _show;
|
|
268
|
+
/**
|
|
269
|
+
* Write the formatted string to the input element this control is attached
|
|
270
|
+
* to
|
|
271
|
+
*/
|
|
272
|
+
private _writeOutput;
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
type DeepPartial<T> = T extends object ? {
|
|
276
|
+
[P in keyof T]?: DeepPartial<T[P]>;
|
|
277
|
+
} : T;
|
|
278
|
+
interface Defaults {
|
|
279
|
+
/** Makes the date picker always display. */
|
|
280
|
+
alwaysVisible: boolean;
|
|
281
|
+
/**
|
|
282
|
+
* If the picker element should be inserted next to the `<input>` or to the
|
|
283
|
+
* `<body>`.
|
|
284
|
+
*/
|
|
285
|
+
attachTo: 'body' | 'input';
|
|
286
|
+
/** Display control buttons */
|
|
287
|
+
buttons: {
|
|
288
|
+
/** Enable button to clear the value */
|
|
289
|
+
clear: boolean;
|
|
290
|
+
/** Enable button move the current value into view */
|
|
291
|
+
selected: boolean;
|
|
292
|
+
/** Enable button move "today" into view */
|
|
293
|
+
today: boolean;
|
|
294
|
+
};
|
|
295
|
+
classPrefix: string;
|
|
296
|
+
/** Specify days that cannot be selected. */
|
|
297
|
+
disableDays: number[] | null | ((day: Date) => boolean);
|
|
298
|
+
/** Initial picker month / year to show. `null` will default to current */
|
|
299
|
+
display: {
|
|
300
|
+
year: number;
|
|
301
|
+
month: number;
|
|
302
|
+
} | null;
|
|
303
|
+
/**
|
|
304
|
+
* First day of the week. (0: Sunday, 1: Monday, etc). If `null` then
|
|
305
|
+
* automatic detection will be used based on the user's locale.
|
|
306
|
+
*/
|
|
307
|
+
firstDay: number | null;
|
|
308
|
+
/** The format of the date data. */
|
|
309
|
+
format: string;
|
|
310
|
+
/** Sets which hours are selectable. */
|
|
311
|
+
hoursAvailable: number[] | null;
|
|
312
|
+
/** Language strings for DateTime */
|
|
313
|
+
i18n: DTLanguage;
|
|
314
|
+
/** Set the maximum date that can be selected and displayed. */
|
|
315
|
+
maxDate: Date | null;
|
|
316
|
+
/** Set the minimum date that can be selected and displayed. */
|
|
317
|
+
minDate: Date | null;
|
|
318
|
+
/** Sets which minutes are selectable. */
|
|
319
|
+
minutesAvailable: number[] | null;
|
|
320
|
+
/** strict parameter passed to Luxon or Moment */
|
|
321
|
+
strict: boolean;
|
|
322
|
+
/** locale parameter passed to Luxon or Moment */
|
|
323
|
+
locale: string;
|
|
324
|
+
/**
|
|
325
|
+
* Function that is called whenever the value selected for DateTime changes.
|
|
326
|
+
*
|
|
327
|
+
* @param value New text value
|
|
328
|
+
* @param date Date value
|
|
329
|
+
* @param el The input host
|
|
330
|
+
*/
|
|
331
|
+
onChange: (value: string, date: Date, el: HTMLElement) => void;
|
|
332
|
+
/** Sets which seconds are selectable. */
|
|
333
|
+
secondsAvailable: number[] | null;
|
|
334
|
+
/**
|
|
335
|
+
* Show the ISO week number at the head of the row
|
|
336
|
+
*/
|
|
337
|
+
showWeekNumber: boolean;
|
|
338
|
+
/**
|
|
339
|
+
* The range of years provided for selection. Note that this option can be
|
|
340
|
+
* overruled by max / min date.
|
|
341
|
+
*/
|
|
342
|
+
yearRange: number;
|
|
343
|
+
/** @deprecated */
|
|
344
|
+
minutesIncrement: number;
|
|
345
|
+
/** @deprecated */
|
|
346
|
+
secondsIncrement: number;
|
|
347
|
+
}
|
|
348
|
+
interface Options extends DeepPartial<Defaults> {
|
|
349
|
+
}
|
|
350
|
+
|
|
351
|
+
declare module 'datatables.net' {
|
|
352
|
+
interface DataTablesStatic {
|
|
353
|
+
DateTime: typeof DateTime;
|
|
354
|
+
}
|
|
355
|
+
interface Language {
|
|
356
|
+
datetime: DTLanguage;
|
|
357
|
+
}
|
|
358
|
+
}
|
|
359
|
+
interface DTLanguage {
|
|
360
|
+
clear: string;
|
|
361
|
+
previous: string;
|
|
362
|
+
next: string;
|
|
363
|
+
months: string[];
|
|
364
|
+
weekdays: string[];
|
|
365
|
+
amPm: string[];
|
|
366
|
+
hours: string;
|
|
367
|
+
minutes: string;
|
|
368
|
+
seconds: string;
|
|
369
|
+
today: string;
|
|
370
|
+
selected: string;
|
|
371
|
+
unknown: string;
|
|
372
|
+
}
|
|
373
|
+
interface Settings {
|
|
374
|
+
d: Date | null;
|
|
375
|
+
display: Date | null;
|
|
376
|
+
minutesRange: number | null;
|
|
377
|
+
secondsRange: number | null;
|
|
378
|
+
namespace: string;
|
|
379
|
+
parts: {
|
|
380
|
+
date: boolean;
|
|
381
|
+
time: boolean;
|
|
382
|
+
seconds: boolean;
|
|
383
|
+
hours12: boolean;
|
|
384
|
+
};
|
|
385
|
+
showTo: null | ReturnType<typeof setTimeout>;
|
|
386
|
+
}
|
|
387
|
+
interface DomInternal {
|
|
388
|
+
container: Dom;
|
|
389
|
+
date: Dom;
|
|
390
|
+
title: Dom;
|
|
391
|
+
calendar: Dom;
|
|
392
|
+
time: Dom;
|
|
393
|
+
error: Dom;
|
|
394
|
+
buttons: Dom;
|
|
395
|
+
clear: Dom;
|
|
396
|
+
today: Dom;
|
|
397
|
+
selected: Dom;
|
|
398
|
+
previous: Dom;
|
|
399
|
+
next: Dom;
|
|
400
|
+
input: Dom<HTMLInputElement>;
|
|
401
|
+
}
|
|
402
|
+
|
|
403
|
+
export { DateTime as default };
|
|
404
|
+
export type { DTLanguage, Defaults, DomInternal, Options, Settings };
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
|
|
19
19
|
<type type="function">
|
|
20
20
|
<signature>disableDays(day)</signature>
|
|
21
|
-
<parameter type="
|
|
21
|
+
<parameter type="Date" name="day">The index of the day to check if it is disabled or not.</parameter>
|
|
22
22
|
<returns type="boolean"/>
|
|
23
23
|
<description>
|
|
24
24
|
If this option is a function it should take one parameter, a number representing the index of the day being checked (again, 0 indexed starting from Sunday) if that day should be selectable it returns `true`, otherwise `false`.
|
package/docs/option/firstDay.xml
CHANGED
|
@@ -4,25 +4,36 @@
|
|
|
4
4
|
<summary>Change which day of the week is first on the calendar.</summary>
|
|
5
5
|
<since>DateTime 1.0.0</since>
|
|
6
6
|
|
|
7
|
-
<type type="number">
|
|
7
|
+
<type type="number | null">
|
|
8
8
|
<description>
|
|
9
|
-
This value represents which day of the week should be in the first
|
|
9
|
+
This value represents which day of the week should be in the first
|
|
10
|
+
column of datetime. If `null` is given autodetection will be
|
|
11
|
+
attempted, and if that fails, 1 (Monday) will be used.
|
|
12
|
+
|
|
13
|
+
The days are 0 indexed starting from Sunday:
|
|
14
|
+
|
|
15
|
+
* 0 - Sunday
|
|
16
|
+
* 1 - Monday
|
|
17
|
+
* 2 - Tuesday
|
|
18
|
+
* 3 - Wednesday
|
|
19
|
+
* 4 - Thursday
|
|
20
|
+
* 5 - Friday
|
|
21
|
+
* 6 - Saturday
|
|
10
22
|
</description>
|
|
11
23
|
</type>
|
|
12
24
|
|
|
13
|
-
<default value="
|
|
14
|
-
The default value of
|
|
15
|
-
|
|
16
|
-
* 0 - Sunday
|
|
17
|
-
* 1 - Monday
|
|
18
|
-
* 2 - Tuesday
|
|
19
|
-
* 3 - Wednesday
|
|
20
|
-
* 4 - Thursday
|
|
21
|
-
* 5 - Friday
|
|
22
|
-
* 6 - Saturday
|
|
25
|
+
<default value="null">
|
|
26
|
+
The default value of `null` will result in auto detection being used.
|
|
23
27
|
</default>
|
|
24
28
|
<description>
|
|
25
|
-
This option allows for the "first" day to be changed to any of the days
|
|
29
|
+
This option allows for the "first" day to be changed to any of the days
|
|
30
|
+
of the week as desired.
|
|
31
|
+
|
|
32
|
+
As of DateTime 2, this parameter supports auto detection through the
|
|
33
|
+
browser's native [`Intl.Locale`
|
|
34
|
+
API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale).
|
|
35
|
+
Please note that this API isn't supported in Firefox at the time of
|
|
36
|
+
writing. If the auto detection fails, `1` (Monday) will be used.
|
|
26
37
|
</description>
|
|
27
38
|
|
|
28
39
|
<example title="Change first day to Saturday"><![CDATA[
|
package/examples/index.xml
CHANGED
|
@@ -3,17 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
<css lib="datetime"/>
|
|
5
5
|
|
|
6
|
-
<js lib="
|
|
7
|
-
<![CDATA[
|
|
8
|
-
|
|
9
|
-
$('#test').dtDateTime({
|
|
10
|
-
alwaysVisible: true
|
|
11
|
-
});
|
|
12
|
-
|
|
13
|
-
]]>
|
|
14
|
-
</js>
|
|
15
|
-
|
|
16
|
-
<js-vanilla>
|
|
6
|
+
<js lib="datatables datetime">
|
|
17
7
|
<![CDATA[
|
|
18
8
|
|
|
19
9
|
new DateTime(document.getElementById('test'), {
|
|
@@ -21,7 +11,7 @@ new DateTime(document.getElementById('test'), {
|
|
|
21
11
|
});
|
|
22
12
|
|
|
23
13
|
]]>
|
|
24
|
-
</js
|
|
14
|
+
</js>
|
|
25
15
|
|
|
26
16
|
<title lib="DateTime">Always visible picker</title>
|
|
27
17
|
|
|
@@ -32,7 +22,7 @@ The DateTime picker can be made to always be visible by using [a `hidden` input
|
|
|
32
22
|
]]></info>
|
|
33
23
|
|
|
34
24
|
<custom-table>
|
|
35
|
-
<input id="test" type="text" value="
|
|
25
|
+
<input id="test" type="text" value="2026-01-30" />
|
|
36
26
|
</custom-table>
|
|
37
27
|
|
|
38
28
|
</dt-example>
|
|
@@ -3,21 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
<css lib="datetime"/>
|
|
5
5
|
|
|
6
|
-
<js lib="
|
|
7
|
-
<![CDATA[
|
|
8
|
-
|
|
9
|
-
$('#test').dtDateTime({
|
|
10
|
-
buttons: {
|
|
11
|
-
clear: true,
|
|
12
|
-
today: true,
|
|
13
|
-
selected: true
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
]]>
|
|
18
|
-
</js>
|
|
19
|
-
|
|
20
|
-
<js-vanilla>
|
|
6
|
+
<js lib="datatables datetime">
|
|
21
7
|
<![CDATA[
|
|
22
8
|
|
|
23
9
|
new DateTime(document.getElementById('test'), {
|
|
@@ -29,7 +15,7 @@ new DateTime(document.getElementById('test'), {
|
|
|
29
15
|
});
|
|
30
16
|
|
|
31
17
|
]]>
|
|
32
|
-
</js
|
|
18
|
+
</js>
|
|
33
19
|
|
|
34
20
|
<title lib="DateTime">Action buttons (clear, today and selected)</title>
|
|
35
21
|
|
|
@@ -46,7 +32,7 @@ This example shows both buttons enabled.
|
|
|
46
32
|
]]></info>
|
|
47
33
|
|
|
48
34
|
<custom-table>
|
|
49
|
-
<input id="test" type="text" value="
|
|
35
|
+
<input id="test" type="text" value="2026-01-30" />
|
|
50
36
|
</custom-table>
|
|
51
37
|
|
|
52
38
|
</dt-example>
|