tyrell-components 1.0.0-TC52 → 1.0.0-TC53
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/css/tyrell-theme.css +25 -2
- package/css/tyrell.css +4 -0
- package/dist/tyrell-colors-static.css +1 -316
- package/dist/tyrell-theme.css +1 -1443
- package/dist/tyrell.css +1 -1390
- package/dist/tyrell.js +1 -1
- package/lib/base/ty-component.js +196 -196
- package/lib/components/button.d.ts +1 -1
- package/lib/components/button.js +260 -259
- package/lib/components/calendar-month.d.ts +2 -2
- package/lib/components/calendar-month.js +426 -416
- package/lib/components/calendar-navigation.js +238 -238
- package/lib/components/calendar.js +605 -602
- package/lib/components/checkbox.d.ts +1 -1
- package/lib/components/checkbox.js +273 -272
- package/lib/components/copy.d.ts +1 -1
- package/lib/components/copy.js +279 -278
- package/lib/components/date-picker.d.ts +1 -1
- package/lib/components/date-picker.js +1103 -1108
- package/lib/components/file-upload.js +404 -404
- package/lib/components/icon.js +141 -141
- package/lib/components/input.d.ts +1 -1
- package/lib/components/input.js +593 -596
- package/lib/components/modal.js +319 -319
- package/lib/components/option.js +167 -167
- package/lib/components/popup.js +233 -233
- package/lib/components/radio.d.ts +2 -2
- package/lib/components/radio.js +407 -406
- package/lib/components/resize-observer.js +67 -67
- package/lib/components/scroll-container.js +294 -294
- package/lib/components/select.d.ts +1 -1
- package/lib/components/select.js +1524 -1532
- package/lib/components/selected-tags.js +184 -184
- package/lib/components/step.js +62 -62
- package/lib/components/switch.d.ts +1 -1
- package/lib/components/switch.js +214 -213
- package/lib/components/tab.js +62 -62
- package/lib/components/tabs.js +507 -507
- package/lib/components/tag.d.ts +1 -1
- package/lib/components/tag.js +236 -235
- package/lib/components/textarea.d.ts +1 -1
- package/lib/components/textarea.js +457 -456
- package/lib/components/tooltip.js +283 -283
- package/lib/components/wizard.js +384 -384
- package/lib/icons/heroicons/micro.js +392 -392
- package/lib/icons/heroicons/mini.js +382 -382
- package/lib/icons/heroicons/outline.js +337 -337
- package/lib/icons/heroicons/solid.js +407 -407
- package/lib/icons/lucide.js +22843 -22843
- package/lib/icons/material/filled.js +9653 -9653
- package/lib/icons/material/outlined.js +10271 -10271
- package/lib/icons/material/round.js +10495 -10495
- package/lib/icons/material/sharp.js +9905 -9905
- package/lib/icons/material/two-tone.js +12792 -12792
- package/lib/index.js +21 -21
- package/lib/styles/button.js +176 -288
- package/lib/styles/calendar-month.js +123 -183
- package/lib/styles/calendar-navigation.js +60 -79
- package/lib/styles/calendar.js +8 -9
- package/lib/styles/checkbox.js +45 -72
- package/lib/styles/copy.js +67 -91
- package/lib/styles/custom-scrollbar.js +80 -100
- package/lib/styles/date-picker.js +261 -331
- package/lib/styles/field-size.d.ts +6 -0
- package/lib/styles/field-size.js +91 -0
- package/lib/styles/file-upload.js +139 -169
- package/lib/styles/icon.js +92 -156
- package/lib/styles/input.js +125 -241
- package/lib/styles/modal.js +67 -102
- package/lib/styles/option.d.ts +1 -1
- package/lib/styles/option.js +47 -67
- package/lib/styles/popup.js +34 -65
- package/lib/styles/radio.js +69 -96
- package/lib/styles/resize-observer.js +2 -5
- package/lib/styles/scroll-container.js +100 -130
- package/lib/styles/select-base.js +525 -778
- package/lib/styles/select.js +140 -228
- package/lib/styles/step.js +22 -29
- package/lib/styles/switch.js +34 -55
- package/lib/styles/tab.js +22 -29
- package/lib/styles/tabs.js +171 -252
- package/lib/styles/tag.js +135 -188
- package/lib/styles/textarea.d.ts +1 -1
- package/lib/styles/textarea.js +205 -271
- package/lib/styles/tooltip.js +3 -3
- package/lib/styles/wizard.js +170 -226
- package/lib/types/common.d.ts +2 -0
- package/lib/types/common.js +6 -5
- package/lib/utils/calendar-utils.js +100 -100
- package/lib/utils/custom-scrollbar.js +272 -272
- package/lib/utils/flavor-sheet.js +14 -14
- package/lib/utils/icon-registry.js +127 -127
- package/lib/utils/loader-registry.js +3 -3
- package/lib/utils/locale.js +34 -34
- package/lib/utils/mobile.js +1 -1
- package/lib/utils/number-format.js +54 -54
- package/lib/utils/positioning.js +212 -212
- package/lib/utils/property-capture.js +36 -36
- package/lib/utils/property-manager.js +125 -125
- package/lib/utils/resize-observer.js +23 -23
- package/lib/utils/scroll-lock.js +57 -57
- package/lib/utils/styles.js +17 -17
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/package.json +4 -4
|
@@ -1,128 +1,128 @@
|
|
|
1
1
|
function validateMonth(month) {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
if (!Number.isInteger(month) || month < 1 || month > 12) {
|
|
3
|
+
throw new RangeError(`Invalid month: ${month}. Must be an integer between 1 and 12.`);
|
|
4
|
+
}
|
|
5
5
|
}
|
|
6
6
|
function validateYear(year) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
if (!Number.isInteger(year) || year < 1 || year > 9999) {
|
|
8
|
+
throw new RangeError(`Invalid year: ${year}. Must be an integer between 1 and 9999.`);
|
|
9
|
+
}
|
|
10
10
|
}
|
|
11
11
|
function isSameDay(date1, date2) {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
return date1.getFullYear() === date2.getFullYear()
|
|
13
|
+
&& date1.getMonth() === date2.getMonth()
|
|
14
|
+
&& date1.getDate() === date2.getDate();
|
|
15
15
|
}
|
|
16
16
|
function createMidnightDate(year, month, day) {
|
|
17
|
-
|
|
17
|
+
return new Date(year, month - 1, day, 0, 0, 0, 0);
|
|
18
18
|
}
|
|
19
19
|
function getTodayMidnight() {
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
const now = new Date();
|
|
21
|
+
return new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0, 0);
|
|
22
22
|
}
|
|
23
23
|
function createDayContext(date, targetYear, targetMonth, selection) {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
24
|
+
const year = date.getFullYear();
|
|
25
|
+
const month = date.getMonth() + 1;
|
|
26
|
+
const dayInMonth = date.getDate();
|
|
27
|
+
const dayOfWeek = date.getDay();
|
|
28
|
+
const isOtherMonth = year !== targetYear || month !== targetMonth;
|
|
29
|
+
let isPrevMonth = false;
|
|
30
|
+
let isNextMonth = false;
|
|
31
|
+
if (isOtherMonth) {
|
|
32
|
+
if (year < targetYear || (year === targetYear && month < targetMonth)) {
|
|
33
|
+
isPrevMonth = true;
|
|
34
|
+
}
|
|
35
|
+
else {
|
|
36
|
+
isNextMonth = true;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
const todayMidnight = getTodayMidnight();
|
|
40
|
+
const isToday = isSameDay(date, todayMidnight);
|
|
41
|
+
const isSelected = selection?.year === year
|
|
42
|
+
&& selection?.month === month
|
|
43
|
+
&& selection?.day === dayInMonth;
|
|
44
|
+
const utcValue = Date.UTC(year, month - 1, dayInMonth, 0, 0, 0, 0);
|
|
45
|
+
const localValue = date.getTime();
|
|
46
|
+
return {
|
|
47
|
+
value: utcValue,
|
|
48
|
+
localValue,
|
|
49
|
+
year,
|
|
50
|
+
month,
|
|
51
|
+
dayInMonth,
|
|
52
|
+
weekend: dayOfWeek === 0 || dayOfWeek === 6,
|
|
53
|
+
otherMonth: isOtherMonth,
|
|
54
|
+
prevMonth: isPrevMonth,
|
|
55
|
+
nextMonth: isNextMonth,
|
|
56
|
+
today: isToday,
|
|
57
|
+
isSelected,
|
|
58
|
+
selectedYear: selection?.year,
|
|
59
|
+
selectedMonth: selection?.month,
|
|
60
|
+
selectedDay: selection?.day,
|
|
61
|
+
};
|
|
62
62
|
}
|
|
63
63
|
function getMondayOfWeek(date) {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
64
|
+
const dayOfWeek = date.getDay();
|
|
65
|
+
const daysToMonday = dayOfWeek === 0 ? 6 : dayOfWeek - 1;
|
|
66
|
+
const monday = new Date(date);
|
|
67
|
+
monday.setDate(date.getDate() - daysToMonday);
|
|
68
|
+
monday.setHours(0, 0, 0, 0);
|
|
69
|
+
return monday;
|
|
70
70
|
}
|
|
71
71
|
function getMonthGridStart(year, month) {
|
|
72
|
-
|
|
73
|
-
|
|
72
|
+
const firstDay = createMidnightDate(year, month, 1);
|
|
73
|
+
return getMondayOfWeek(firstDay);
|
|
74
74
|
}
|
|
75
75
|
function addDays(date, days) {
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
76
|
+
const result = new Date(date);
|
|
77
|
+
result.setDate(result.getDate() + days);
|
|
78
|
+
return result;
|
|
79
79
|
}
|
|
80
80
|
function generateDays(startDate, count, targetYear, targetMonth, selection) {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
81
|
+
const days = [];
|
|
82
|
+
for (let i = 0; i < count; i++) {
|
|
83
|
+
const date = addDays(startDate, i);
|
|
84
|
+
days.push(createDayContext(date, targetYear, targetMonth, selection));
|
|
85
|
+
}
|
|
86
|
+
return days;
|
|
87
87
|
}
|
|
88
88
|
export function getCalendarMonthDays(year, month, selection) {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
89
|
+
validateYear(year);
|
|
90
|
+
validateMonth(month);
|
|
91
|
+
const startDate = getMonthGridStart(year, month);
|
|
92
|
+
return generateDays(startDate, 42, year, month, selection);
|
|
93
93
|
}
|
|
94
94
|
export function getLocalizedWeekdays(locale, style = 'short') {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
95
|
+
const formatter = new Intl.DateTimeFormat(locale, { weekday: style });
|
|
96
|
+
const sunday = new Date(2024, 0, 7);
|
|
97
|
+
const sundayFirst = Array.from({ length: 7 }, (_, i) => {
|
|
98
|
+
const date = addDays(sunday, i);
|
|
99
|
+
return formatter.format(date);
|
|
100
|
+
});
|
|
101
|
+
const [firstDay, ...rest] = sundayFirst;
|
|
102
|
+
return [...rest, firstDay];
|
|
103
103
|
}
|
|
104
104
|
export function getMonthName(month, locale = 'en-US', style = 'long') {
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
105
|
+
validateMonth(month);
|
|
106
|
+
const date = new Date(2024, month - 1, 1);
|
|
107
|
+
const formatter = new Intl.DateTimeFormat(locale, { month: style });
|
|
108
|
+
return formatter.format(date);
|
|
109
109
|
}
|
|
110
110
|
export function parseISODate(isoString) {
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
111
|
+
const match = isoString.match(/^(\d{4})-(\d{2})-(\d{2})$/);
|
|
112
|
+
if (!match)
|
|
113
|
+
return null;
|
|
114
|
+
const year = parseInt(match[1], 10);
|
|
115
|
+
const month = parseInt(match[2], 10);
|
|
116
|
+
const day = parseInt(match[3], 10);
|
|
117
|
+
if (year < 1 || year > 9999)
|
|
118
|
+
return null;
|
|
119
|
+
if (month < 1 || month > 12)
|
|
120
|
+
return null;
|
|
121
|
+
if (day < 1 || day > 31)
|
|
122
|
+
return null;
|
|
123
|
+
const date = new Date(year, month - 1, day);
|
|
124
|
+
if (date.getFullYear() !== year || date.getMonth() !== month - 1 || date.getDate() !== day) {
|
|
125
|
+
return null;
|
|
126
|
+
}
|
|
127
|
+
return { year, month, day };
|
|
128
128
|
}
|