datex-ui 1.0.6 → 1.1.8
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/README.md +2 -2
- package/dist/constants/locales.d.ts +4 -7
- package/dist/constants/themes.d.ts +5 -6
- package/dist/datex.d.ts +77 -115
- package/dist/index.d.ts +9 -4
- package/dist/index.esm.js +1034 -700
- package/dist/services/calendar-service.d.ts +21 -0
- package/dist/services/event-service.d.ts +17 -0
- package/dist/services/keyboard-service.d.ts +51 -0
- package/dist/services/position-service.d.ts +18 -0
- package/dist/services/theme-service.d.ts +18 -0
- package/dist/services/validation-service.d.ts +32 -0
- package/dist/types/{index.d.ts → datex-types.d.ts} +21 -7
- package/dist/utils/date-utils.d.ts +16 -0
- package/package.json +68 -68
- package/dist/style.css +0 -1
- package/dist/tests/setup.d.ts +0 -1
- package/dist/utils/dateHelpers.d.ts +0 -24
- package/dist/utils/domHelpers.d.ts +0 -30
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Calendar rendering and management service
|
|
3
|
+
*/
|
|
4
|
+
import { CalendarState, DatexLocale, DatexOptions } from "../types/datex-types";
|
|
5
|
+
export declare class CalendarService {
|
|
6
|
+
private options;
|
|
7
|
+
private locale;
|
|
8
|
+
constructor(options: Required<DatexOptions>, locale: DatexLocale);
|
|
9
|
+
buildCalendarMatrix(month: Date): Date[][];
|
|
10
|
+
renderCalendarHTML(calendar: CalendarState, side: "left" | "right", startDate: Date, endDate: Date | null, canGoPrev: boolean, canGoNext: boolean): string;
|
|
11
|
+
private renderHeader;
|
|
12
|
+
private renderDayHeaders;
|
|
13
|
+
private renderCalendarBody;
|
|
14
|
+
private renderDropdowns;
|
|
15
|
+
private calculateYearRange;
|
|
16
|
+
private renderMonthDropdown;
|
|
17
|
+
private renderYearDropdown;
|
|
18
|
+
getDayClasses(day: Date, currentMonth: Date, startDate: Date, endDate: Date | null): string[];
|
|
19
|
+
canNavigatePrevious(month: Date): boolean;
|
|
20
|
+
canNavigateNext(month: Date): boolean;
|
|
21
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Event management service for Datex date picker
|
|
3
|
+
*/
|
|
4
|
+
export declare class EventService {
|
|
5
|
+
private boundHandlers;
|
|
6
|
+
private resizeHandler?;
|
|
7
|
+
private scrollHandler?;
|
|
8
|
+
private documentClickHandler?;
|
|
9
|
+
private documentFocusHandler?;
|
|
10
|
+
addEventHandler(element: HTMLElement | Document | Window, event: string, handler: EventListener): void;
|
|
11
|
+
setDocumentListeners(clickHandler: EventListener, focusHandler: EventListener): void;
|
|
12
|
+
setWindowListeners(resizeHandler: EventListener, scrollHandler: EventListener): void;
|
|
13
|
+
removeDocumentListeners(): void;
|
|
14
|
+
removeWindowListeners(): void;
|
|
15
|
+
cleanup(): void;
|
|
16
|
+
dispatchEvent(element: HTMLElement, eventName: string, detail?: any): void;
|
|
17
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Keyboard navigation service for Datex date picker
|
|
3
|
+
*/
|
|
4
|
+
export interface KeyboardOptions {
|
|
5
|
+
enabled?: boolean;
|
|
6
|
+
shortcuts?: {
|
|
7
|
+
today?: string;
|
|
8
|
+
clear?: string;
|
|
9
|
+
close?: string;
|
|
10
|
+
apply?: string;
|
|
11
|
+
cancel?: string;
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
export declare class KeyboardService {
|
|
15
|
+
private container;
|
|
16
|
+
private options;
|
|
17
|
+
private onDateSelect?;
|
|
18
|
+
private onClose?;
|
|
19
|
+
private onApply?;
|
|
20
|
+
private onCancel?;
|
|
21
|
+
private onToday?;
|
|
22
|
+
private onClear?;
|
|
23
|
+
private currentFocusedDate;
|
|
24
|
+
private isActive;
|
|
25
|
+
constructor(container: HTMLElement, options?: KeyboardOptions);
|
|
26
|
+
setHandlers(handlers: {
|
|
27
|
+
onDateSelect?: (date: Date) => void;
|
|
28
|
+
onClose?: () => void;
|
|
29
|
+
onApply?: () => void;
|
|
30
|
+
onCancel?: () => void;
|
|
31
|
+
onToday?: () => void;
|
|
32
|
+
onClear?: () => void;
|
|
33
|
+
}): void;
|
|
34
|
+
activate(initialDate?: Date): void;
|
|
35
|
+
deactivate(): void;
|
|
36
|
+
private setupKeyboardEvents;
|
|
37
|
+
private handleKeyDown;
|
|
38
|
+
private handleFocus;
|
|
39
|
+
private handleBlur;
|
|
40
|
+
private navigateDate;
|
|
41
|
+
private navigateMonth;
|
|
42
|
+
private navigateToStartOfWeek;
|
|
43
|
+
private navigateToEndOfWeek;
|
|
44
|
+
private updateFocusedDate;
|
|
45
|
+
private removeFocusStyles;
|
|
46
|
+
private addFocusStyles;
|
|
47
|
+
private formatDateForSelector;
|
|
48
|
+
getCurrentFocusedDate(): Date | null;
|
|
49
|
+
setFocusedDate(date: Date): void;
|
|
50
|
+
cleanup(): void;
|
|
51
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Position management service for Datex date picker
|
|
3
|
+
*/
|
|
4
|
+
import { DatexOptions } from "../types/datex-types";
|
|
5
|
+
export declare class PositionService {
|
|
6
|
+
private element;
|
|
7
|
+
private container;
|
|
8
|
+
private options;
|
|
9
|
+
constructor(element: HTMLElement, container: HTMLElement, options: Required<DatexOptions>);
|
|
10
|
+
calculatePosition(): void;
|
|
11
|
+
private positionForMobile;
|
|
12
|
+
private positionForDesktop;
|
|
13
|
+
private resetContainerPosition;
|
|
14
|
+
private calculateVerticalPosition;
|
|
15
|
+
private calculateHorizontalPosition;
|
|
16
|
+
private applyDropUpClass;
|
|
17
|
+
private applyFinalPosition;
|
|
18
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Theme management service for Datex date picker
|
|
3
|
+
*/
|
|
4
|
+
import { DatexTheme } from "../types/datex-types";
|
|
5
|
+
export declare class ThemeService {
|
|
6
|
+
private theme;
|
|
7
|
+
private container;
|
|
8
|
+
private styleId?;
|
|
9
|
+
constructor(container: HTMLElement, theme?: DatexTheme);
|
|
10
|
+
applyTheme(): void;
|
|
11
|
+
setTheme(theme: DatexTheme): void;
|
|
12
|
+
cleanup(): void;
|
|
13
|
+
private removeExistingStyles;
|
|
14
|
+
private createAndApplyStyles;
|
|
15
|
+
private generateStyleId;
|
|
16
|
+
private forceReflow;
|
|
17
|
+
private generateThemeCSS;
|
|
18
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Validation service for advanced date validation
|
|
3
|
+
*/
|
|
4
|
+
export interface DatexValidation {
|
|
5
|
+
disabledDates?: Date[];
|
|
6
|
+
disabledDaysOfWeek?: number[];
|
|
7
|
+
minDaysBetween?: number;
|
|
8
|
+
maxDaysBetween?: number;
|
|
9
|
+
businessDaysOnly?: boolean;
|
|
10
|
+
customValidator?: (date: Date) => boolean;
|
|
11
|
+
holidays?: Date[];
|
|
12
|
+
enabledDateRanges?: [Date, Date][];
|
|
13
|
+
}
|
|
14
|
+
export interface ValidationResult {
|
|
15
|
+
isValid: boolean;
|
|
16
|
+
error?: string;
|
|
17
|
+
errorCode?: string;
|
|
18
|
+
}
|
|
19
|
+
export declare class ValidationService {
|
|
20
|
+
private validation;
|
|
21
|
+
constructor(validation?: DatexValidation);
|
|
22
|
+
updateValidation(validation: DatexValidation): void;
|
|
23
|
+
validateDate(date: Date): ValidationResult;
|
|
24
|
+
validateDateRange(startDate: Date, endDate: Date): ValidationResult;
|
|
25
|
+
private isSameDate;
|
|
26
|
+
private isWeekend;
|
|
27
|
+
private getDaysBetween;
|
|
28
|
+
private isDateInEnabledRanges;
|
|
29
|
+
getBusinessDays(startDate: Date, endDate: Date): number;
|
|
30
|
+
addBusinessDays(date: Date, days: number): Date;
|
|
31
|
+
isHoliday(date: Date): boolean;
|
|
32
|
+
}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Type definitions for
|
|
2
|
+
* Type definitions for Datex date picker
|
|
3
3
|
*/
|
|
4
|
-
|
|
4
|
+
import { DatexValidation } from "../services/validation-service";
|
|
5
|
+
export interface DatexTheme {
|
|
5
6
|
primaryColor?: string;
|
|
6
7
|
secondaryColor?: string;
|
|
7
8
|
backgroundColor?: string;
|
|
@@ -18,7 +19,7 @@ export interface DateRangePickerTheme {
|
|
|
18
19
|
fontSize?: string;
|
|
19
20
|
fontFamily?: string;
|
|
20
21
|
}
|
|
21
|
-
export interface
|
|
22
|
+
export interface DatexLocale {
|
|
22
23
|
format: string;
|
|
23
24
|
separator: string;
|
|
24
25
|
applyLabel: string;
|
|
@@ -28,7 +29,18 @@ export interface DateRangePickerLocale {
|
|
|
28
29
|
monthNames: string[];
|
|
29
30
|
firstDay: number;
|
|
30
31
|
}
|
|
31
|
-
export interface
|
|
32
|
+
export interface DatexEvents {
|
|
33
|
+
onOpen?: () => void;
|
|
34
|
+
onClose?: () => void;
|
|
35
|
+
onMonthChange?: (month: Date) => void;
|
|
36
|
+
onYearChange?: (year: number) => void;
|
|
37
|
+
onDateHover?: (date: Date) => void;
|
|
38
|
+
onValidationError?: (error: string, errorCode?: string) => void;
|
|
39
|
+
beforeDateSelect?: (date: Date) => boolean;
|
|
40
|
+
onDateSelect?: (date: Date) => void;
|
|
41
|
+
onRangeSelect?: (startDate: Date, endDate: Date) => void;
|
|
42
|
+
}
|
|
43
|
+
export interface DatexOptions {
|
|
32
44
|
startDate?: Date;
|
|
33
45
|
endDate?: Date;
|
|
34
46
|
minDate?: Date | null;
|
|
@@ -52,13 +64,15 @@ export interface DateRangePickerOptions {
|
|
|
52
64
|
ranges?: Record<string, [Date, Date]>;
|
|
53
65
|
opens?: "left" | "right" | "center";
|
|
54
66
|
drops?: "up" | "down" | "auto";
|
|
55
|
-
locale?:
|
|
67
|
+
locale?: DatexLocale;
|
|
56
68
|
buttonClasses?: string;
|
|
57
69
|
applyButtonClasses?: string;
|
|
58
70
|
cancelButtonClasses?: string;
|
|
59
|
-
theme?:
|
|
71
|
+
theme?: DatexTheme;
|
|
72
|
+
validation?: DatexValidation;
|
|
73
|
+
events?: DatexEvents;
|
|
60
74
|
}
|
|
61
|
-
export type
|
|
75
|
+
export type DatexCallback = (startDate: Date, endDate: Date, label?: string) => void;
|
|
62
76
|
export interface CalendarState {
|
|
63
77
|
month: Date;
|
|
64
78
|
calendar: Date[][];
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Native date utility functions
|
|
3
|
+
* Provides date manipulation and formatting without external dependencies
|
|
4
|
+
*/
|
|
5
|
+
export declare function formatDate(date: Date, formatStr: string): string;
|
|
6
|
+
export declare function addMonths(date: Date, months: number): Date;
|
|
7
|
+
export declare function startOfDay(date: Date): Date;
|
|
8
|
+
export declare function endOfDay(date: Date): Date;
|
|
9
|
+
export declare function isAfterDate(date1: Date, date2: Date): boolean;
|
|
10
|
+
export declare function isBeforeDate(date1: Date, date2: Date): boolean;
|
|
11
|
+
export declare function isSameDate(date1: Date, date2: Date, unit?: "day" | "month" | "year"): boolean;
|
|
12
|
+
export declare function isValidDate(date: Date | null | undefined): date is Date;
|
|
13
|
+
export declare function parseDate(dateStr: string, formatStr: string): Date;
|
|
14
|
+
export declare function getStartOfMonth(date: Date): Date;
|
|
15
|
+
export declare function getEndOfMonth(date: Date): Date;
|
|
16
|
+
export declare function getStartOfWeek(date: Date, firstDay?: number): Date;
|
package/package.json
CHANGED
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "datex-ui",
|
|
3
|
-
"access": "public",
|
|
4
|
-
"version": "1.
|
|
5
|
-
"type": "module",
|
|
6
|
-
"description": "A modern, lightweight, and customizable date range picker for TypeScript/JavaScript applications",
|
|
7
|
-
"main": "dist/index.esm.js",
|
|
8
|
-
"module": "dist/index.esm.js",
|
|
9
|
-
"types": "dist/index.d.ts",
|
|
10
|
-
"files": [
|
|
11
|
-
"dist",
|
|
12
|
-
"assets/images",
|
|
13
|
-
"README.md",
|
|
14
|
-
"LICENSE"
|
|
15
|
-
],
|
|
16
|
-
"scripts": {
|
|
17
|
-
"build": "vite build && tsc --emitDeclarationOnly",
|
|
18
|
-
"build:watch": "vite build --watch",
|
|
19
|
-
"dev": "vite dev --config vite.dev.config.ts",
|
|
20
|
-
"dev:simple": "vite serve dev --port 3000 --open",
|
|
21
|
-
"test": "vitest --run",
|
|
22
|
-
"test:watch": "vitest",
|
|
23
|
-
"lint": "eslint src --ext .ts,.tsx",
|
|
24
|
-
"lint:fix": "eslint src --ext .ts,.tsx --fix",
|
|
25
|
-
"type-check": "tsc --noEmit",
|
|
26
|
-
"docs:dev": "vitepress dev docs",
|
|
27
|
-
"docs:build": "vitepress build docs",
|
|
28
|
-
"docs:preview": "vitepress preview docs",
|
|
29
|
-
"docs:install": "cd docs && pnpm install"
|
|
30
|
-
},
|
|
31
|
-
"keywords": [
|
|
32
|
-
"date-picker",
|
|
33
|
-
"date-range-picker",
|
|
34
|
-
"typescript",
|
|
35
|
-
"calendar",
|
|
36
|
-
"datepicker",
|
|
37
|
-
"ui-component",
|
|
38
|
-
"vanilla-js",
|
|
39
|
-
"lightweight"
|
|
40
|
-
],
|
|
41
|
-
"author": "Emilio Senguana sengua2017@gmail.com",
|
|
42
|
-
"license": "MIT",
|
|
43
|
-
"repository": {
|
|
44
|
-
"type": "git",
|
|
45
|
-
"url": "https://github.com/senguanasoft/datex-ui.git"
|
|
46
|
-
},
|
|
47
|
-
"bugs": {
|
|
48
|
-
"url": "https://github.com/senguanasoft/datex-ui/issues"
|
|
49
|
-
},
|
|
50
|
-
"homepage": "https://datex-docs.vercel.app",
|
|
51
|
-
"devDependencies": {
|
|
52
|
-
"@types/node": "^20.10.5",
|
|
53
|
-
"@typescript-eslint/eslint-plugin": "^6.15.0",
|
|
54
|
-
"@typescript-eslint/parser": "^6.15.0",
|
|
55
|
-
"eslint": "^8.56.0",
|
|
56
|
-
"jsdom": "^23.2.0",
|
|
57
|
-
"sass": "^1.69.5",
|
|
58
|
-
"sass-embedded": "^1.97.2",
|
|
59
|
-
"typescript": "^5.3.3",
|
|
60
|
-
"vite": "^5.0.10",
|
|
61
|
-
"vitepress": "^1.0.0-rc.31",
|
|
62
|
-
"vitest": "^1.1.0"
|
|
63
|
-
},
|
|
64
|
-
"engines": {
|
|
65
|
-
"node": ">=16.0.0",
|
|
66
|
-
"pnpm": ">=8.0.0"
|
|
67
|
-
},
|
|
68
|
-
"packageManager": "pnpm@8.15.0"
|
|
1
|
+
{
|
|
2
|
+
"name": "datex-ui",
|
|
3
|
+
"access": "public",
|
|
4
|
+
"version": "1.1.8",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"description": "A modern, lightweight, and customizable date range picker for TypeScript/JavaScript applications",
|
|
7
|
+
"main": "dist/index.esm.js",
|
|
8
|
+
"module": "dist/index.esm.js",
|
|
9
|
+
"types": "dist/index.d.ts",
|
|
10
|
+
"files": [
|
|
11
|
+
"dist",
|
|
12
|
+
"assets/images",
|
|
13
|
+
"README.md",
|
|
14
|
+
"LICENSE"
|
|
15
|
+
],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "vite build && tsc --emitDeclarationOnly",
|
|
18
|
+
"build:watch": "vite build --watch",
|
|
19
|
+
"dev": "vite dev --config vite.dev.config.ts",
|
|
20
|
+
"dev:simple": "vite serve dev --port 3000 --open",
|
|
21
|
+
"test": "vitest --run",
|
|
22
|
+
"test:watch": "vitest",
|
|
23
|
+
"lint": "eslint src --ext .ts,.tsx",
|
|
24
|
+
"lint:fix": "eslint src --ext .ts,.tsx --fix",
|
|
25
|
+
"type-check": "tsc --noEmit",
|
|
26
|
+
"docs:dev": "vitepress dev docs",
|
|
27
|
+
"docs:build": "vitepress build docs",
|
|
28
|
+
"docs:preview": "vitepress preview docs",
|
|
29
|
+
"docs:install": "cd docs && pnpm install"
|
|
30
|
+
},
|
|
31
|
+
"keywords": [
|
|
32
|
+
"date-picker",
|
|
33
|
+
"date-range-picker",
|
|
34
|
+
"typescript",
|
|
35
|
+
"calendar",
|
|
36
|
+
"datepicker",
|
|
37
|
+
"ui-component",
|
|
38
|
+
"vanilla-js",
|
|
39
|
+
"lightweight"
|
|
40
|
+
],
|
|
41
|
+
"author": "Emilio Senguana sengua2017@gmail.com",
|
|
42
|
+
"license": "MIT",
|
|
43
|
+
"repository": {
|
|
44
|
+
"type": "git",
|
|
45
|
+
"url": "https://github.com/senguanasoft/datex-ui.git"
|
|
46
|
+
},
|
|
47
|
+
"bugs": {
|
|
48
|
+
"url": "https://github.com/senguanasoft/datex-ui/issues"
|
|
49
|
+
},
|
|
50
|
+
"homepage": "https://datex-docs.vercel.app",
|
|
51
|
+
"devDependencies": {
|
|
52
|
+
"@types/node": "^20.10.5",
|
|
53
|
+
"@typescript-eslint/eslint-plugin": "^6.15.0",
|
|
54
|
+
"@typescript-eslint/parser": "^6.15.0",
|
|
55
|
+
"eslint": "^8.56.0",
|
|
56
|
+
"jsdom": "^23.2.0",
|
|
57
|
+
"sass": "^1.69.5",
|
|
58
|
+
"sass-embedded": "^1.97.2",
|
|
59
|
+
"typescript": "^5.3.3",
|
|
60
|
+
"vite": "^5.0.10",
|
|
61
|
+
"vitepress": "^1.0.0-rc.31",
|
|
62
|
+
"vitest": "^1.1.0"
|
|
63
|
+
},
|
|
64
|
+
"engines": {
|
|
65
|
+
"node": ">=16.0.0",
|
|
66
|
+
"pnpm": ">=8.0.0"
|
|
67
|
+
},
|
|
68
|
+
"packageManager": "pnpm@8.15.0"
|
|
69
69
|
}
|
package/dist/style.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.datex-picker{position:absolute;color:inherit;background-color:#fff;border-radius:4px;border:1px solid #ddd;width:278px;max-width:none;padding:0;margin-top:7px;top:100px;left:20px;z-index:3001!important;display:none;font-family:arial;font-size:15px;line-height:1em;-webkit-user-select:none;user-select:none}.datex-picker:focus-within{z-index:3001!important}.datex-picker:before,.datex-picker:after{position:absolute;display:inline-block;border-bottom-color:#0003;content:""}.datex-picker:before{top:-7px;border-right:7px solid transparent;border-left:7px solid transparent;border-bottom:7px solid #ccc}.datex-picker:after{top:-6px;border-right:6px solid transparent;border-bottom:6px solid #fff;border-left:6px solid transparent}.datex-picker.opensleft:before{right:9px}.datex-picker.opensleft:after{right:10px}.datex-picker.openscenter:before,.datex-picker.openscenter:after{left:0;right:0;width:0;margin-left:auto;margin-right:auto}.datex-picker.opensright:before{left:9px}.datex-picker.opensright:after{left:10px}.datex-picker.drop-up{margin-top:-7px}.datex-picker.drop-up:before{top:initial;bottom:-7px;border-bottom:initial;border-top:7px solid #ccc}.datex-picker.drop-up:after{top:initial;bottom:-6px;border-bottom:initial;border-top:6px solid #fff}.datex-picker.single .ranges,.datex-picker.single .drp-calendar{float:none}.datex-picker.single .drp-selected{display:none}.datex-picker.show-calendar .drp-calendar,.datex-picker.show-calendar .drp-buttons{display:block}.datex-picker.auto-apply .drp-buttons{display:none}.datex-picker .drp-calendar{display:none;max-width:270px}.datex-picker .drp-calendar.left{padding:6px 0 6px 6px}.datex-picker .drp-calendar.right{padding:6px}.datex-picker .drp-calendar.single .calendar-table{border:none}.datex-picker .calendar-table{border:1px solid #fff;border-radius:4px;background-color:#fff}.datex-picker .calendar-table table{width:100%;margin:0;border-spacing:0;border-collapse:collapse}.datex-picker .calendar-table .next span,.datex-picker .calendar-table .prev span{color:#fff;border:solid black;border-width:0 2px 2px 0;border-radius:0;display:inline-block}.datex-picker .calendar-table .next span{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}.datex-picker .calendar-table .prev span{transform:rotate(135deg);-webkit-transform:rotate(135deg)}.datex-picker .calendar-table .next,.datex-picker .calendar-table .prev{cursor:pointer;-webkit-user-select:none;user-select:none;width:32px;height:28px}.datex-picker .calendar-table .next:hover,.datex-picker .calendar-table .prev:hover{background-color:#f0f0f0}.datex-picker .calendar-table th,.datex-picker .calendar-table td{white-space:nowrap;text-align:center;vertical-align:middle;min-width:28px;width:28px;height:22px;line-height:20px;font-size:11px;border-radius:3px;border:1px solid transparent;cursor:pointer}.datex-picker .calendar-table th{font-weight:600;color:#6b7280;cursor:default}.datex-picker .calendar-table th.month{width:auto;font-weight:700;color:#111827}.datex-picker .calendar-table td.available:hover,.datex-picker .calendar-table th.available:hover{background-color:#eee;border-color:transparent;color:inherit}.datex-picker .calendar-table td.week,.datex-picker .calendar-table th.week{font-size:80%;color:#ccc}.datex-picker .calendar-table td.off,.datex-picker .calendar-table td.off.in-range,.datex-picker .calendar-table td.off.start-date,.datex-picker .calendar-table td.off.end-date{background-color:#fff;border-color:transparent;color:#999;cursor:not-allowed}.datex-picker .calendar-table td.in-range{background-color:#ebf4f8;border-color:transparent;color:#000;border-radius:0}.datex-picker .calendar-table td.start-date{border-radius:3px 0 0 3px;background-color:#357ebd;color:#fff}.datex-picker .calendar-table td.start-date.end-date{border-radius:3px}.datex-picker .calendar-table td.end-date{border-radius:0 3px 3px 0;background-color:#357ebd;color:#fff}.datex-picker .calendar-table td.active,.datex-picker .calendar-table td.active:hover{background-color:#357ebd;border-color:transparent;color:#fff}.datex-picker .calendar-table td.today{font-weight:600;color:#357ebd}.datex-picker .calendar-table td.weekend{color:#ef4444}.datex-picker .calendar-table td.disabled,.datex-picker .calendar-table option.disabled{color:#999;cursor:not-allowed;text-decoration:line-through}.datex-picker .calendar-table select.monthselect,.datex-picker .calendar-table select.yearselect{font-size:12px;padding:1px;height:auto;margin:0;cursor:default;border:1px solid #ddd;border-radius:4px;background-color:#fff}.datex-picker .calendar-table select.monthselect:focus,.datex-picker .calendar-table select.yearselect:focus{outline:none;border-color:#357ebd;box-shadow:0 0 0 3px #357ebd1a}.datex-picker .calendar-table select.monthselect{margin-right:2%;width:56%}.datex-picker .calendar-table select.yearselect{width:40%}.datex-picker .calendar-time{text-align:center;margin:4px auto 0;line-height:30px;position:relative}.datex-picker .calendar-time select.hourselect,.datex-picker .calendar-time select.minuteselect,.datex-picker .calendar-time select.secondselect,.datex-picker .calendar-time select.ampmselect{width:50px;margin:0 auto;background:#eee;border:1px solid #eee;padding:2px;outline:0;font-size:12px;border-radius:4px}.datex-picker .calendar-time select.hourselect:focus,.datex-picker .calendar-time select.minuteselect:focus,.datex-picker .calendar-time select.secondselect:focus,.datex-picker .calendar-time select.ampmselect:focus{border-color:#357ebd;box-shadow:0 0 0 3px #357ebd1a}.datex-picker .calendar-time select.hourselect.disabled,.datex-picker .calendar-time select.minuteselect.disabled,.datex-picker .calendar-time select.secondselect.disabled,.datex-picker .calendar-time select.ampmselect.disabled{color:#ccc;cursor:not-allowed;background-color:#f3f4f6}.datex-picker .ranges{float:none;text-align:left;margin:0}.datex-picker .ranges ul{list-style:none;margin:0 auto;padding:0;width:100%}.datex-picker .ranges li{font-size:12px;padding:8px 12px;cursor:pointer;transition:all .15s ease-in-out}.datex-picker .ranges li:hover{background-color:#eee}.datex-picker .ranges li.active{background-color:#08c;color:#fff}.datex-picker.show-calendar .ranges{margin-top:8px}.datex-picker .drp-buttons{border-top:1px solid #ddd;vertical-align:middle;clear:both;text-align:right;padding:2px;display:none;line-height:10px}.datex-picker .drp-buttons .drp-selected{display:inline-block;font-size:12px;padding-right:8px}.datex-picker .drp-buttons .btn{border:1px solid transparent;border-radius:3px;cursor:pointer;transition:all .15s ease-in-out;margin-left:8px;font-size:12px;font-weight:700;padding:8px!important;background-color:red}.datex-picker .drp-buttons .btn:focus{outline:none;box-shadow:0 0 0 2px #357ebd1a}.datex-picker .drp-buttons .btn:disabled{opacity:.5;cursor:not-allowed}.datex-picker .drp-buttons .btn.btn-success{background-color:#007bff;color:#fff;border-color:#007bff}.datex-picker .drp-buttons .btn.btn-success:hover:not(:disabled){background-color:#0056b3;border-color:#0056b3}.datex-picker .drp-buttons .btn.btn-danger{background-color:#6c757d;color:#fff;border-color:#6c757d}.datex-picker .drp-buttons .btn.btn-danger:hover:not(:disabled){background-color:#545b62;border-color:#545b62}@media (min-width: 564px){.datex-picker{width:auto}.datex-picker .ranges ul{width:140px}.datex-picker.single .ranges ul{width:100%}.datex-picker.single .drp-calendar.left{clear:none}.datex-picker.single .ranges,.datex-picker.single .drp-calendar{float:left}.datex-picker{direction:ltr;text-align:left}.datex-picker .drp-calendar.left{clear:left;margin-right:0}.datex-picker .drp-calendar.left .calendar-table{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;padding-right:8px}.datex-picker .drp-calendar.right{margin-left:0}.datex-picker .drp-calendar.right .calendar-table{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.datex-picker .ranges,.datex-picker .drp-calendar{float:left}}@media (min-width: 730px){.datex-picker .ranges{width:auto;float:left}.datex-picker .drp-calendar.left{clear:none!important}}
|
package/dist/tests/setup.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Date utility functions for DateX
|
|
3
|
-
*/
|
|
4
|
-
export declare function format(date: Date, formatStr: string): string;
|
|
5
|
-
export declare function parse(dateStr: string, formatStr: string): Date;
|
|
6
|
-
export declare function addDay(date: Date, days: number): Date;
|
|
7
|
-
export declare function addMonth(date: Date, months: number): Date;
|
|
8
|
-
export declare function dayStart(date: Date): Date;
|
|
9
|
-
export declare function dayEnd(date: Date): Date;
|
|
10
|
-
export declare function isAfter(date1: Date, date2: Date): boolean;
|
|
11
|
-
export declare function isBefore(date1: Date, date2: Date): boolean;
|
|
12
|
-
export declare function isSame(date1: Date, date2: Date, unit?: "day" | "month" | "year"): boolean;
|
|
13
|
-
export declare function isValid(date: Date | null | undefined): date is Date;
|
|
14
|
-
export declare function getStartOfMonth(date: Date): Date;
|
|
15
|
-
export declare function getEndOfMonth(date: Date): Date;
|
|
16
|
-
export declare function getStartOfWeek(date: Date, firstDay?: number): Date;
|
|
17
|
-
/**
|
|
18
|
-
* Generate common date ranges
|
|
19
|
-
*/
|
|
20
|
-
export declare function getCommonRanges(): Record<string, [Date, Date]>;
|
|
21
|
-
/**
|
|
22
|
-
* Generate Spanish date ranges
|
|
23
|
-
*/
|
|
24
|
-
export declare function getSpanishRanges(): Record<string, [Date, Date]>;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* DOM utility functions for DateX
|
|
3
|
-
*/
|
|
4
|
-
/**
|
|
5
|
-
* Generate unique ID for theme styles
|
|
6
|
-
*/
|
|
7
|
-
export declare function generateStyleId(): string;
|
|
8
|
-
/**
|
|
9
|
-
* Create DOM element from HTML string
|
|
10
|
-
*/
|
|
11
|
-
export declare function createElementFromHTML(html: string): HTMLElement;
|
|
12
|
-
/**
|
|
13
|
-
* Check if element matches selector
|
|
14
|
-
*/
|
|
15
|
-
export declare function matches(element: Element, selector: string): boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Find closest parent element matching selector
|
|
18
|
-
*/
|
|
19
|
-
export declare function closest(element: Element, selector: string): Element | null;
|
|
20
|
-
/**
|
|
21
|
-
* Add event listener with cleanup tracking
|
|
22
|
-
*/
|
|
23
|
-
export declare function addEventListener(element: HTMLElement | Document | Window, event: string, handler: EventListener, options?: boolean | AddEventListenerOptions): () => void;
|
|
24
|
-
/**
|
|
25
|
-
* Position element relative to target
|
|
26
|
-
*/
|
|
27
|
-
export declare function positionElement(element: HTMLElement, target: HTMLElement, options?: {
|
|
28
|
-
opens?: "left" | "right" | "center";
|
|
29
|
-
drops?: "up" | "down" | "auto";
|
|
30
|
-
}): void;
|