adminator-admin-dashboard 2.7.1 → 2.8.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/CHANGELOG.md +116 -0
- package/CLAUDE.md +5 -5
- package/README.md +63 -24
- package/dist/main.js +1779 -2571
- package/dist/main.js.map +1 -1
- package/package.json +28 -36
- package/src/assets/scripts/app 2.js +645 -0
- package/src/assets/scripts/app.js +3 -3
- package/src/assets/scripts/utils/theme.js +4 -2
- package/src/assets/scripts/vectorMaps/index.js +5 -5
- package/dist/55b07f26c86c8e3d3754.svg +0 -1
- package/dist/9fad440d8ee7a949a9a9.svg +0 -1
- package/dist/test.html +0 -91
- package/src/assets/scripts/app.ts +0 -757
- package/src/assets/scripts/components/Chart.ts +0 -1350
- package/src/assets/scripts/components/Sidebar.ts +0 -388
- package/src/assets/scripts/datatable/index.ts +0 -707
- package/src/assets/scripts/datepicker/index.ts +0 -699
- package/src/assets/scripts/ui/index.ts +0 -740
- package/src/assets/scripts/utils/date.ts +0 -363
- package/src/assets/scripts/utils/dom.ts +0 -513
- package/src/assets/scripts/utils/theme.ts +0 -313
- package/src/assets/scripts/vectorMaps/index.ts +0 -542
- package/src/test.html +0 -96
- package/src/types/index.ts +0 -236
- /package/dist/assets/{c1e38fd9e0e74ba58f7a2b77ef29fdd3.svg → fontawesome-webfont.svg} +0 -0
- /package/dist/assets/{f0fc8c798eac5636249c4ea287832422.svg → themify.svg} +0 -0
|
@@ -1,363 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Modern Date Utilities with TypeScript
|
|
3
|
-
* Using Day.js (2KB) instead of Moment.js (67KB) - 97% size reduction
|
|
4
|
-
* Provides consistent date formatting and manipulation across the application
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
import dayjs, { Dayjs, ConfigType, UnitType, ManipulateType } from 'dayjs';
|
|
8
|
-
import utc from 'dayjs/plugin/utc';
|
|
9
|
-
import timezone from 'dayjs/plugin/timezone';
|
|
10
|
-
import relativeTime from 'dayjs/plugin/relativeTime';
|
|
11
|
-
import customParseFormat from 'dayjs/plugin/customParseFormat';
|
|
12
|
-
import advancedFormat from 'dayjs/plugin/advancedFormat';
|
|
13
|
-
import isBetween from 'dayjs/plugin/isBetween';
|
|
14
|
-
|
|
15
|
-
// Enable Day.js plugins
|
|
16
|
-
dayjs.extend(utc);
|
|
17
|
-
dayjs.extend(timezone);
|
|
18
|
-
dayjs.extend(relativeTime);
|
|
19
|
-
dayjs.extend(customParseFormat);
|
|
20
|
-
dayjs.extend(advancedFormat);
|
|
21
|
-
dayjs.extend(isBetween);
|
|
22
|
-
|
|
23
|
-
// Type definitions
|
|
24
|
-
export interface CalendarDay {
|
|
25
|
-
date: string;
|
|
26
|
-
day: number;
|
|
27
|
-
isCurrentMonth: boolean;
|
|
28
|
-
isToday: boolean;
|
|
29
|
-
dayjs: Dayjs;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export interface CalendarMonth {
|
|
33
|
-
month: string;
|
|
34
|
-
year: number;
|
|
35
|
-
monthIndex: number;
|
|
36
|
-
days: CalendarDay[];
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
export interface WeekDay {
|
|
40
|
-
date: string;
|
|
41
|
-
day: number;
|
|
42
|
-
dayName: string;
|
|
43
|
-
shortDayName: string;
|
|
44
|
-
isToday: boolean;
|
|
45
|
-
dayjs: Dayjs;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
export interface WeekData {
|
|
49
|
-
weekStart: string;
|
|
50
|
-
weekEnd: string;
|
|
51
|
-
days: WeekDay[];
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
export interface ChartDatePoint {
|
|
55
|
-
date: string;
|
|
56
|
-
label: string;
|
|
57
|
-
value: string;
|
|
58
|
-
dayjs: Dayjs;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
export type DateInput = ConfigType;
|
|
62
|
-
export type DateUnit = UnitType;
|
|
63
|
-
export type DateManipulateUnit = ManipulateType;
|
|
64
|
-
|
|
65
|
-
export interface DateFormatters {
|
|
66
|
-
shortDate: (date: DateInput) => string;
|
|
67
|
-
longDate: (date: DateInput) => string;
|
|
68
|
-
dateTime: (date: DateInput) => string;
|
|
69
|
-
calendarDate: (date: DateInput) => string;
|
|
70
|
-
calendarDateTime: (date: DateInput) => string;
|
|
71
|
-
inputDate: (date: DateInput) => string;
|
|
72
|
-
inputDateTime: (date: DateInput) => string;
|
|
73
|
-
timeOnly: (date: DateInput) => string;
|
|
74
|
-
monthYear: (date: DateInput) => string;
|
|
75
|
-
dayMonth: (date: DateInput) => string;
|
|
76
|
-
relative: (date: DateInput) => string;
|
|
77
|
-
relativeCalendar: (date: DateInput) => string;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
export interface DateCalendarUtils {
|
|
81
|
-
getMonthData: (date?: DateInput) => CalendarMonth;
|
|
82
|
-
getWeekData: (date?: DateInput) => WeekData;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
export interface DateFormUtils {
|
|
86
|
-
toInputValue: (date: DateInput) => string;
|
|
87
|
-
toDateTimeInputValue: (date: DateInput) => string;
|
|
88
|
-
fromInputValue: (value: string) => Dayjs;
|
|
89
|
-
validateDateInput: (value: string) => boolean;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
export interface DateChartUtils {
|
|
93
|
-
generateDateRange: (start: DateInput, end: DateInput, interval?: DateManipulateUnit) => ChartDatePoint[];
|
|
94
|
-
getChartLabels: (period?: 'week' | 'month' | 'year') => string[];
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
export interface DateTimezoneUtils {
|
|
98
|
-
convert: (date: DateInput, tz: string) => Dayjs;
|
|
99
|
-
utc: (date: DateInput) => Dayjs;
|
|
100
|
-
local: (date: DateInput) => Dayjs;
|
|
101
|
-
guess: () => string;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
export interface DateUtilsInterface {
|
|
105
|
-
now: () => Dayjs;
|
|
106
|
-
parse: (input: DateInput, format?: string) => Dayjs;
|
|
107
|
-
format: (date: DateInput, format?: string) => string;
|
|
108
|
-
formatters: DateFormatters;
|
|
109
|
-
add: (date: DateInput, amount: number, unit: DateManipulateUnit) => Dayjs;
|
|
110
|
-
subtract: (date: DateInput, amount: number, unit: DateManipulateUnit) => Dayjs;
|
|
111
|
-
startOf: (date: DateInput, unit: DateUnit) => Dayjs;
|
|
112
|
-
endOf: (date: DateInput, unit: DateUnit) => Dayjs;
|
|
113
|
-
isBefore: (date1: DateInput, date2: DateInput) => boolean;
|
|
114
|
-
isAfter: (date1: DateInput, date2: DateInput) => boolean;
|
|
115
|
-
isSame: (date1: DateInput, date2: DateInput, unit?: DateUnit) => boolean;
|
|
116
|
-
isBetween: (date: DateInput, start: DateInput, end: DateInput) => boolean;
|
|
117
|
-
isValid: (date: DateInput) => boolean;
|
|
118
|
-
timezone: DateTimezoneUtils;
|
|
119
|
-
calendar: DateCalendarUtils;
|
|
120
|
-
form: DateFormUtils;
|
|
121
|
-
charts: DateChartUtils;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
export const DateUtils: DateUtilsInterface = {
|
|
125
|
-
/**
|
|
126
|
-
* Get current date/time
|
|
127
|
-
*/
|
|
128
|
-
now: (): Dayjs => dayjs(),
|
|
129
|
-
|
|
130
|
-
/**
|
|
131
|
-
* Parse date from string or Date object
|
|
132
|
-
*/
|
|
133
|
-
parse: (input: DateInput, format?: string): Dayjs => {
|
|
134
|
-
return format ? dayjs(input, format) : dayjs(input);
|
|
135
|
-
},
|
|
136
|
-
|
|
137
|
-
/**
|
|
138
|
-
* Format date for display
|
|
139
|
-
*/
|
|
140
|
-
format: (date: DateInput, format: string = 'YYYY-MM-DD'): string => {
|
|
141
|
-
return dayjs(date).format(format);
|
|
142
|
-
},
|
|
143
|
-
|
|
144
|
-
/**
|
|
145
|
-
* Common date formatting presets
|
|
146
|
-
*/
|
|
147
|
-
formatters: {
|
|
148
|
-
// Dashboard display formats
|
|
149
|
-
shortDate: (date: DateInput): string => dayjs(date).format('MMM DD, YYYY'),
|
|
150
|
-
longDate: (date: DateInput): string => dayjs(date).format('MMMM DD, YYYY'),
|
|
151
|
-
dateTime: (date: DateInput): string => dayjs(date).format('MMM DD, YYYY h:mm A'),
|
|
152
|
-
|
|
153
|
-
// Calendar formats
|
|
154
|
-
calendarDate: (date: DateInput): string => dayjs(date).format('YYYY-MM-DD'),
|
|
155
|
-
calendarDateTime: (date: DateInput): string => dayjs(date).format('YYYY-MM-DD HH:mm:ss'),
|
|
156
|
-
|
|
157
|
-
// Form input formats
|
|
158
|
-
inputDate: (date: DateInput): string => dayjs(date).format('YYYY-MM-DD'),
|
|
159
|
-
inputDateTime: (date: DateInput): string => dayjs(date).format('YYYY-MM-DDTHH:mm'),
|
|
160
|
-
|
|
161
|
-
// Display formats
|
|
162
|
-
timeOnly: (date: DateInput): string => dayjs(date).format('h:mm A'),
|
|
163
|
-
monthYear: (date: DateInput): string => dayjs(date).format('MMMM YYYY'),
|
|
164
|
-
dayMonth: (date: DateInput): string => dayjs(date).format('DD MMM'),
|
|
165
|
-
|
|
166
|
-
// Relative time
|
|
167
|
-
relative: (date: DateInput): string => dayjs(date).fromNow(),
|
|
168
|
-
relativeCalendar: (date: DateInput): string => {
|
|
169
|
-
const now = dayjs();
|
|
170
|
-
const target = dayjs(date);
|
|
171
|
-
const diffDays = now.diff(target, 'day');
|
|
172
|
-
|
|
173
|
-
if (diffDays === 0) return 'Today';
|
|
174
|
-
if (diffDays === 1) return 'Yesterday';
|
|
175
|
-
if (diffDays === -1) return 'Tomorrow';
|
|
176
|
-
if (diffDays > 1 && diffDays < 7) return `${diffDays} days ago`;
|
|
177
|
-
if (diffDays < -1 && diffDays > -7) return `In ${Math.abs(diffDays)} days`;
|
|
178
|
-
return target.format('MMM DD, YYYY');
|
|
179
|
-
},
|
|
180
|
-
},
|
|
181
|
-
|
|
182
|
-
/**
|
|
183
|
-
* Date manipulation
|
|
184
|
-
*/
|
|
185
|
-
add: (date: DateInput, amount: number, unit: DateManipulateUnit): Dayjs =>
|
|
186
|
-
dayjs(date).add(amount, unit),
|
|
187
|
-
|
|
188
|
-
subtract: (date: DateInput, amount: number, unit: DateManipulateUnit): Dayjs =>
|
|
189
|
-
dayjs(date).subtract(amount, unit),
|
|
190
|
-
|
|
191
|
-
startOf: (date: DateInput, unit: DateUnit): Dayjs =>
|
|
192
|
-
dayjs(date).startOf(unit),
|
|
193
|
-
|
|
194
|
-
endOf: (date: DateInput, unit: DateUnit): Dayjs =>
|
|
195
|
-
dayjs(date).endOf(unit),
|
|
196
|
-
|
|
197
|
-
/**
|
|
198
|
-
* Date comparison
|
|
199
|
-
*/
|
|
200
|
-
isBefore: (date1: DateInput, date2: DateInput): boolean =>
|
|
201
|
-
dayjs(date1).isBefore(dayjs(date2)),
|
|
202
|
-
|
|
203
|
-
isAfter: (date1: DateInput, date2: DateInput): boolean =>
|
|
204
|
-
dayjs(date1).isAfter(dayjs(date2)),
|
|
205
|
-
|
|
206
|
-
isSame: (date1: DateInput, date2: DateInput, unit: DateUnit = 'day'): boolean =>
|
|
207
|
-
dayjs(date1).isSame(dayjs(date2), unit),
|
|
208
|
-
|
|
209
|
-
isBetween: (date: DateInput, start: DateInput, end: DateInput): boolean =>
|
|
210
|
-
dayjs(date).isBetween(dayjs(start), dayjs(end)),
|
|
211
|
-
|
|
212
|
-
/**
|
|
213
|
-
* Date validation
|
|
214
|
-
*/
|
|
215
|
-
isValid: (date: DateInput): boolean => dayjs(date).isValid(),
|
|
216
|
-
|
|
217
|
-
/**
|
|
218
|
-
* Timezone utilities
|
|
219
|
-
*/
|
|
220
|
-
timezone: {
|
|
221
|
-
convert: (date: DateInput, tz: string): Dayjs => dayjs(date).tz(tz),
|
|
222
|
-
utc: (date: DateInput): Dayjs => dayjs(date).utc(),
|
|
223
|
-
local: (date: DateInput): Dayjs => dayjs(date).local(),
|
|
224
|
-
guess: (): string => dayjs.tz.guess(),
|
|
225
|
-
},
|
|
226
|
-
|
|
227
|
-
/**
|
|
228
|
-
* Calendar utilities
|
|
229
|
-
*/
|
|
230
|
-
calendar: {
|
|
231
|
-
// Get calendar month data for building calendar views
|
|
232
|
-
getMonthData: (date?: DateInput): CalendarMonth => {
|
|
233
|
-
const target = date ? dayjs(date) : dayjs();
|
|
234
|
-
const startOfMonth = target.startOf('month');
|
|
235
|
-
const endOfMonth = target.endOf('month');
|
|
236
|
-
const startOfCalendar = startOfMonth.startOf('week');
|
|
237
|
-
const endOfCalendar = endOfMonth.endOf('week');
|
|
238
|
-
|
|
239
|
-
const days: CalendarDay[] = [];
|
|
240
|
-
let current = startOfCalendar;
|
|
241
|
-
|
|
242
|
-
while (current.isBefore(endOfCalendar) || current.isSame(endOfCalendar, 'day')) {
|
|
243
|
-
days.push({
|
|
244
|
-
date: current.format('YYYY-MM-DD'),
|
|
245
|
-
day: current.date(),
|
|
246
|
-
isCurrentMonth: current.isSame(target, 'month'),
|
|
247
|
-
isToday: current.isSame(dayjs(), 'day'),
|
|
248
|
-
dayjs: current.clone(),
|
|
249
|
-
});
|
|
250
|
-
current = current.add(1, 'day');
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
return {
|
|
254
|
-
month: target.format('MMMM YYYY'),
|
|
255
|
-
year: target.year(),
|
|
256
|
-
monthIndex: target.month(),
|
|
257
|
-
days,
|
|
258
|
-
};
|
|
259
|
-
},
|
|
260
|
-
|
|
261
|
-
// Get week data
|
|
262
|
-
getWeekData: (date?: DateInput): WeekData => {
|
|
263
|
-
const target = date ? dayjs(date) : dayjs();
|
|
264
|
-
const startOfWeek = target.startOf('week');
|
|
265
|
-
const endOfWeek = target.endOf('week');
|
|
266
|
-
|
|
267
|
-
const days: WeekDay[] = [];
|
|
268
|
-
let current = startOfWeek;
|
|
269
|
-
|
|
270
|
-
while (current.isBefore(endOfWeek) || current.isSame(endOfWeek, 'day')) {
|
|
271
|
-
days.push({
|
|
272
|
-
date: current.format('YYYY-MM-DD'),
|
|
273
|
-
day: current.date(),
|
|
274
|
-
dayName: current.format('dddd'),
|
|
275
|
-
shortDayName: current.format('ddd'),
|
|
276
|
-
isToday: current.isSame(dayjs(), 'day'),
|
|
277
|
-
dayjs: current.clone(),
|
|
278
|
-
});
|
|
279
|
-
current = current.add(1, 'day');
|
|
280
|
-
}
|
|
281
|
-
|
|
282
|
-
return {
|
|
283
|
-
weekStart: startOfWeek.format('MMM DD'),
|
|
284
|
-
weekEnd: endOfWeek.format('MMM DD, YYYY'),
|
|
285
|
-
days,
|
|
286
|
-
};
|
|
287
|
-
},
|
|
288
|
-
},
|
|
289
|
-
|
|
290
|
-
/**
|
|
291
|
-
* Form utilities
|
|
292
|
-
*/
|
|
293
|
-
form: {
|
|
294
|
-
// Convert date to HTML5 input format
|
|
295
|
-
toInputValue: (date: DateInput): string => dayjs(date).format('YYYY-MM-DD'),
|
|
296
|
-
toDateTimeInputValue: (date: DateInput): string => dayjs(date).format('YYYY-MM-DDTHH:mm'),
|
|
297
|
-
|
|
298
|
-
// Parse from HTML5 input
|
|
299
|
-
fromInputValue: (value: string): Dayjs => dayjs(value),
|
|
300
|
-
|
|
301
|
-
// Validate date input
|
|
302
|
-
validateDateInput: (value: string): boolean => {
|
|
303
|
-
const parsed = dayjs(value);
|
|
304
|
-
return parsed.isValid() && value.length >= 8; // Basic validation
|
|
305
|
-
},
|
|
306
|
-
},
|
|
307
|
-
|
|
308
|
-
/**
|
|
309
|
-
* Chart/Data utilities
|
|
310
|
-
*/
|
|
311
|
-
charts: {
|
|
312
|
-
// Generate date ranges for charts
|
|
313
|
-
generateDateRange: (
|
|
314
|
-
start: DateInput,
|
|
315
|
-
end: DateInput,
|
|
316
|
-
interval: DateManipulateUnit = 'day'
|
|
317
|
-
): ChartDatePoint[] => {
|
|
318
|
-
const dates: ChartDatePoint[] = [];
|
|
319
|
-
let current = dayjs(start);
|
|
320
|
-
const endDate = dayjs(end);
|
|
321
|
-
|
|
322
|
-
while (current.isBefore(endDate) || current.isSame(endDate, interval)) {
|
|
323
|
-
dates.push({
|
|
324
|
-
date: current.format('YYYY-MM-DD'),
|
|
325
|
-
label: current.format('MMM DD'),
|
|
326
|
-
value: current.toISOString(),
|
|
327
|
-
dayjs: current.clone(),
|
|
328
|
-
});
|
|
329
|
-
current = current.add(1, interval);
|
|
330
|
-
}
|
|
331
|
-
|
|
332
|
-
return dates;
|
|
333
|
-
},
|
|
334
|
-
|
|
335
|
-
// Get common chart date labels
|
|
336
|
-
getChartLabels: (period: 'week' | 'month' | 'year' = 'week'): string[] => {
|
|
337
|
-
const now = dayjs();
|
|
338
|
-
|
|
339
|
-
switch (period) {
|
|
340
|
-
case 'week':
|
|
341
|
-
return Array.from({ length: 7 }, (_, i) =>
|
|
342
|
-
now.subtract(6 - i, 'day').format('ddd')
|
|
343
|
-
);
|
|
344
|
-
case 'month':
|
|
345
|
-
return Array.from({ length: 30 }, (_, i) =>
|
|
346
|
-
now.subtract(29 - i, 'day').format('DD')
|
|
347
|
-
);
|
|
348
|
-
case 'year':
|
|
349
|
-
return Array.from({ length: 12 }, (_, i) =>
|
|
350
|
-
now.subtract(11 - i, 'month').format('MMM')
|
|
351
|
-
);
|
|
352
|
-
default:
|
|
353
|
-
return [];
|
|
354
|
-
}
|
|
355
|
-
},
|
|
356
|
-
},
|
|
357
|
-
};
|
|
358
|
-
|
|
359
|
-
// Export dayjs instance for direct use when needed
|
|
360
|
-
export { dayjs };
|
|
361
|
-
|
|
362
|
-
// Default export
|
|
363
|
-
export default DateUtils;
|