pds-dev-kit-web-test 2.5.490 → 2.5.491
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/index.d.ts +4 -4
- package/dist/index.js +4 -5
- package/dist/src/common/services/i18n/resources/en.json +42 -1
- package/dist/src/common/services/i18n/resources/es.json +41 -1
- package/dist/src/common/services/i18n/resources/fil.json +41 -1
- package/dist/src/common/services/i18n/resources/index.d.ts +285 -0
- package/dist/src/common/services/i18n/resources/ja.json +42 -1
- package/dist/src/common/services/i18n/resources/ko.json +42 -1
- package/dist/src/common/services/i18n/resources/zh-cn.json +42 -1
- package/dist/src/common/services/i18n/resources/zh-tw.json +42 -1
- package/dist/src/common/types/components.d.ts +9 -0
- package/dist/src/common/types/components.js +8 -0
- package/dist/src/common/types/index.d.ts +0 -1
- package/dist/src/common/types/index.js +0 -1
- package/dist/src/common/utils/dateHelper.d.ts +3 -0
- package/dist/src/common/utils/dateHelper.js +37 -0
- package/dist/src/desktop/components/BasicFormGroup/BasicFormGroup.d.ts +18 -1
- package/dist/src/desktop/components/BasicFormGroup/BasicFormGroup.js +46 -3
- package/dist/src/desktop/components/BoxItem/BoxItem.d.ts +1 -5
- package/dist/src/desktop/components/BoxItem/BoxItem.js +5 -8
- package/dist/src/desktop/components/Calendar/AllDaySchedulesSection.d.ts +13 -0
- package/dist/src/desktop/components/Calendar/AllDaySchedulesSection.js +132 -0
- package/dist/src/desktop/components/Calendar/Calendar.d.ts +4 -0
- package/dist/src/desktop/components/Calendar/Calendar.js +384 -0
- package/dist/src/desktop/components/Calendar/CurrentTimeIndicator.d.ts +7 -0
- package/dist/src/desktop/components/Calendar/CurrentTimeIndicator.js +48 -0
- package/dist/src/desktop/components/Calendar/DailyView.d.ts +17 -0
- package/dist/src/desktop/components/Calendar/DailyView.js +64 -0
- package/dist/src/desktop/components/Calendar/MonthlyView.d.ts +27 -0
- package/dist/src/desktop/components/Calendar/MonthlyView.js +263 -0
- package/dist/src/desktop/components/Calendar/MultiWeekSchedulesLayer.d.ts +19 -0
- package/dist/src/desktop/components/Calendar/MultiWeekSchedulesLayer.js +73 -0
- package/dist/src/desktop/components/Calendar/ScheduleItem.d.ts +16 -0
- package/dist/src/desktop/components/Calendar/ScheduleItem.js +50 -0
- package/dist/src/desktop/components/Calendar/TimeBasedScheduleItem.d.ts +9 -0
- package/dist/src/desktop/components/Calendar/TimeBasedScheduleItem.js +170 -0
- package/dist/src/desktop/components/Calendar/WeeklyView.d.ts +21 -0
- package/dist/src/desktop/components/Calendar/WeeklyView.js +91 -0
- package/dist/src/desktop/components/Calendar/YearlyView.d.ts +12 -0
- package/dist/src/desktop/components/Calendar/YearlyView.js +76 -0
- package/dist/src/desktop/components/Calendar/calendarUtils.d.ts +24 -0
- package/dist/src/desktop/components/Calendar/calendarUtils.js +112 -0
- package/dist/src/desktop/components/Calendar/constants.d.ts +1 -0
- package/dist/src/desktop/components/Calendar/constants.js +31 -0
- package/dist/src/desktop/components/Calendar/index.d.ts +10 -0
- package/dist/src/desktop/components/Calendar/index.js +37 -0
- package/dist/src/desktop/components/Calendar/timeFormatUtils.d.ts +16 -0
- package/dist/src/desktop/components/Calendar/timeFormatUtils.js +45 -0
- package/dist/src/desktop/components/Calendar/types.d.ts +60 -0
- package/dist/src/desktop/components/Calendar/types.js +2 -0
- package/dist/src/desktop/components/index.d.ts +2 -2
- package/dist/src/desktop/components/index.js +4 -4
- package/dist/src/desktop/index.d.ts +1 -1
- package/dist/src/desktop/index.js +2 -2
- package/dist/src/desktop/panels/MultilingualModal/MultilingualModal.d.ts +23 -0
- package/dist/src/desktop/panels/MultilingualModal/MultilingualModal.js +199 -0
- package/dist/src/desktop/panels/MultilingualModal/index.d.ts +1 -0
- package/dist/src/desktop/panels/MultilingualModal/index.js +8 -0
- package/dist/src/desktop/panels/index.d.ts +2 -1
- package/dist/src/desktop/panels/index.js +6 -1
- package/dist/src/mobile/components/BoxItem/BoxItem.d.ts +1 -5
- package/dist/src/mobile/components/BoxItem/BoxItem.js +5 -7
- package/dist/src/mobile/components/index.d.ts +1 -2
- package/dist/src/mobile/components/index.js +1 -3
- package/dist/src/mobile/index.d.ts +1 -1
- package/dist/src/mobile/index.js +2 -3
- package/package.json +1 -1
- package/release-note.md +2 -2
- package/dist/src/common/types/form.d.ts +0 -9
- package/dist/src/common/types/form.js +0 -10
- package/dist/src/desktop/components/Snackbar/Snackbar.d.ts +0 -16
- package/dist/src/desktop/components/Snackbar/Snackbar.js +0 -209
- package/dist/src/desktop/components/Snackbar/index.d.ts +0 -1
- package/dist/src/desktop/components/Snackbar/index.js +0 -8
- package/dist/src/desktop/components/Snackbar/provider.d.ts +0 -11
- package/dist/src/desktop/components/Snackbar/provider.js +0 -52
- package/dist/src/mobile/components/Snackbar/Snackbar.d.ts +0 -16
- package/dist/src/mobile/components/Snackbar/Snackbar.js +0 -209
- package/dist/src/mobile/components/Snackbar/index.d.ts +0 -1
- package/dist/src/mobile/components/Snackbar/index.js +0 -8
- package/dist/src/mobile/components/Snackbar/provider.d.ts +0 -11
- package/dist/src/mobile/components/Snackbar/provider.js +0 -52
|
@@ -33,6 +33,47 @@
|
|
|
33
33
|
"str_3890": "목",
|
|
34
34
|
"str_3891": "금",
|
|
35
35
|
"str_3892": "토",
|
|
36
|
-
"str_3893": "일"
|
|
36
|
+
"str_3893": "일",
|
|
37
|
+
"calendar_all_day": "종일",
|
|
38
|
+
"calendar_more_schedules": "개 더보기",
|
|
39
|
+
"calendar_today": "오늘",
|
|
40
|
+
"calendar_month_1": "1월",
|
|
41
|
+
"calendar_month_2": "2월",
|
|
42
|
+
"calendar_month_3": "3월",
|
|
43
|
+
"calendar_month_4": "4월",
|
|
44
|
+
"calendar_month_5": "5월",
|
|
45
|
+
"calendar_month_6": "6월",
|
|
46
|
+
"calendar_month_7": "7월",
|
|
47
|
+
"calendar_month_8": "8월",
|
|
48
|
+
"calendar_month_9": "9월",
|
|
49
|
+
"calendar_month_10": "10월",
|
|
50
|
+
"calendar_month_11": "11월",
|
|
51
|
+
"calendar_month_12": "12월",
|
|
52
|
+
"calendar_time_am": "오전",
|
|
53
|
+
"calendar_time_pm": "오후",
|
|
54
|
+
"calendar_time_hour": "시",
|
|
55
|
+
"calendar_duration_hour": "시간",
|
|
56
|
+
"calendar_duration_hours": "시간",
|
|
57
|
+
"calendar_time_noon": "점심",
|
|
58
|
+
"calendar_header_daily": "{{year}}년 {{month}} {{day}}일 {{dayText}}요일",
|
|
59
|
+
"calendar_header_weekly_same_month": "{{month}} {{startDay}}일 - {{endDay}}일",
|
|
60
|
+
"calendar_header_weekly_diff_month": "{{startMonth}} {{startDay}}일 - {{endMonth}} {{endDay}}일",
|
|
61
|
+
"calendar_header_monthly": "{{year}}년 {{month}}",
|
|
62
|
+
"calendar_view_monthly": "월간",
|
|
63
|
+
"calendar_view_weekly": "주간",
|
|
64
|
+
"calendar_view_daily": "일간",
|
|
65
|
+
"calendar_view_yearly": "연간",
|
|
66
|
+
"calendar_date_format": "{{day}}일 ({{dayText}})",
|
|
67
|
+
"multilingual_settings": "다국어 설정",
|
|
68
|
+
"str_multilingual_ko": "한국어",
|
|
69
|
+
"str_multilingual_en": "영어",
|
|
70
|
+
"str_multilingual_ja": "일본어",
|
|
71
|
+
"str_multilingual_zh_cn": "중국어 (간체)",
|
|
72
|
+
"str_multilingual_zh_tw": "중국어 (번체)",
|
|
73
|
+
"str_multilingual_fr": "프랑스어",
|
|
74
|
+
"str_multilingual_es": "스페인어",
|
|
75
|
+
"str_9071": "국가에 맞는 언어를 입력해 주세요.",
|
|
76
|
+
"apply": "적용",
|
|
77
|
+
"cancel": "취소"
|
|
37
78
|
}
|
|
38
79
|
}
|
|
@@ -33,6 +33,47 @@
|
|
|
33
33
|
"str_3890": "Thu",
|
|
34
34
|
"str_3891": "Fri",
|
|
35
35
|
"str_3892": "Sat",
|
|
36
|
-
"str_3893": "Sun"
|
|
36
|
+
"str_3893": "Sun",
|
|
37
|
+
"calendar_all_day": "全天",
|
|
38
|
+
"calendar_more_schedules": "更多",
|
|
39
|
+
"calendar_today": "今天",
|
|
40
|
+
"calendar_month_1": "1月",
|
|
41
|
+
"calendar_month_2": "2月",
|
|
42
|
+
"calendar_month_3": "3月",
|
|
43
|
+
"calendar_month_4": "4月",
|
|
44
|
+
"calendar_month_5": "5月",
|
|
45
|
+
"calendar_month_6": "6月",
|
|
46
|
+
"calendar_month_7": "7月",
|
|
47
|
+
"calendar_month_8": "8月",
|
|
48
|
+
"calendar_month_9": "9月",
|
|
49
|
+
"calendar_month_10": "10月",
|
|
50
|
+
"calendar_month_11": "11月",
|
|
51
|
+
"calendar_month_12": "12月",
|
|
52
|
+
"calendar_time_am": "上午",
|
|
53
|
+
"calendar_time_pm": "下午",
|
|
54
|
+
"calendar_time_hour": "时",
|
|
55
|
+
"calendar_duration_hour": "小时",
|
|
56
|
+
"calendar_duration_hours": "小时",
|
|
57
|
+
"calendar_time_noon": "中午",
|
|
58
|
+
"calendar_header_daily": "{{year}}年{{month}}{{day}}日 {{dayText}}",
|
|
59
|
+
"calendar_header_weekly_same_month": "{{month}}{{startDay}}日 - {{endDay}}日",
|
|
60
|
+
"calendar_header_weekly_diff_month": "{{startMonth}}{{startDay}}日 - {{endMonth}}{{endDay}}日",
|
|
61
|
+
"calendar_header_monthly": "{{year}}年{{month}}",
|
|
62
|
+
"calendar_view_monthly": "月",
|
|
63
|
+
"calendar_view_weekly": "周",
|
|
64
|
+
"calendar_view_daily": "日",
|
|
65
|
+
"calendar_view_yearly": "年",
|
|
66
|
+
"calendar_date_format": "{{day}}日 ({{dayText}})",
|
|
67
|
+
"multilingual_settings": "多语言设置",
|
|
68
|
+
"str_multilingual_ko": "韩语",
|
|
69
|
+
"str_multilingual_en": "英语",
|
|
70
|
+
"str_multilingual_ja": "日语",
|
|
71
|
+
"str_multilingual_zh_cn": "中文(简体)",
|
|
72
|
+
"str_multilingual_zh_tw": "中文(繁体)",
|
|
73
|
+
"str_multilingual_fr": "法语",
|
|
74
|
+
"str_multilingual_es": "西班牙语",
|
|
75
|
+
"str_9071": "请输入适合您国家的语言。",
|
|
76
|
+
"apply": "应用",
|
|
77
|
+
"cancel": "取消"
|
|
37
78
|
}
|
|
38
79
|
}
|
|
@@ -33,6 +33,47 @@
|
|
|
33
33
|
"str_3890": "Thu",
|
|
34
34
|
"str_3891": "Fri",
|
|
35
35
|
"str_3892": "Sat",
|
|
36
|
-
"str_3893": "Sun"
|
|
36
|
+
"str_3893": "Sun",
|
|
37
|
+
"calendar_all_day": "全天",
|
|
38
|
+
"calendar_more_schedules": "更多",
|
|
39
|
+
"calendar_today": "今天",
|
|
40
|
+
"calendar_month_1": "1月",
|
|
41
|
+
"calendar_month_2": "2月",
|
|
42
|
+
"calendar_month_3": "3月",
|
|
43
|
+
"calendar_month_4": "4月",
|
|
44
|
+
"calendar_month_5": "5月",
|
|
45
|
+
"calendar_month_6": "6月",
|
|
46
|
+
"calendar_month_7": "7月",
|
|
47
|
+
"calendar_month_8": "8月",
|
|
48
|
+
"calendar_month_9": "9月",
|
|
49
|
+
"calendar_month_10": "10月",
|
|
50
|
+
"calendar_month_11": "11月",
|
|
51
|
+
"calendar_month_12": "12月",
|
|
52
|
+
"calendar_time_am": "上午",
|
|
53
|
+
"calendar_time_pm": "下午",
|
|
54
|
+
"calendar_time_hour": "時",
|
|
55
|
+
"calendar_duration_hour": "小時",
|
|
56
|
+
"calendar_duration_hours": "小時",
|
|
57
|
+
"calendar_time_noon": "中午",
|
|
58
|
+
"calendar_header_daily": "{{year}}年{{month}}{{day}}日 {{dayText}}",
|
|
59
|
+
"calendar_header_weekly_same_month": "{{month}}{{startDay}}日 - {{endDay}}日",
|
|
60
|
+
"calendar_header_weekly_diff_month": "{{startMonth}}{{startDay}}日 - {{endMonth}}{{endDay}}日",
|
|
61
|
+
"calendar_header_monthly": "{{year}}年{{month}}",
|
|
62
|
+
"calendar_view_monthly": "月",
|
|
63
|
+
"calendar_view_weekly": "周",
|
|
64
|
+
"calendar_view_daily": "日",
|
|
65
|
+
"calendar_view_yearly": "年",
|
|
66
|
+
"calendar_date_format": "{{day}}日 ({{dayText}})",
|
|
67
|
+
"multilingual_settings": "多語言設置",
|
|
68
|
+
"str_multilingual_ko": "韓語",
|
|
69
|
+
"str_multilingual_en": "英語",
|
|
70
|
+
"str_multilingual_ja": "日語",
|
|
71
|
+
"str_multilingual_zh_cn": "中文(簡體)",
|
|
72
|
+
"str_multilingual_zh_tw": "中文(繁體)",
|
|
73
|
+
"str_multilingual_fr": "法語",
|
|
74
|
+
"str_multilingual_es": "西班牙語",
|
|
75
|
+
"str_9071": "請輸入適合您國家的語言。",
|
|
76
|
+
"apply": "應用",
|
|
77
|
+
"cancel": "取消"
|
|
37
78
|
}
|
|
38
79
|
}
|
|
@@ -55,3 +55,12 @@ export type SegmentedButtonGroupValueOption = Pick<PDSValueOption, 'value'> & {
|
|
|
55
55
|
tooltipPosition?: IconCaseTooltipPositionType;
|
|
56
56
|
};
|
|
57
57
|
export type ForwardedRefType<T> = ForwardedRef<T | null>;
|
|
58
|
+
export interface IFormValues {
|
|
59
|
+
[key: string]: string;
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* 중첩된 객체 구조에서 점(.)으로 구분된 경로를 통해 에러 객체를 조회합니다
|
|
63
|
+
*/
|
|
64
|
+
export declare const getErrorByName: (errors: {
|
|
65
|
+
[x: string]: any;
|
|
66
|
+
}, name: string) => any;
|
|
@@ -1,2 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getErrorByName = void 0;
|
|
4
|
+
/**
|
|
5
|
+
* 중첩된 객체 구조에서 점(.)으로 구분된 경로를 통해 에러 객체를 조회합니다
|
|
6
|
+
*/
|
|
7
|
+
var getErrorByName = function (errors, name) {
|
|
8
|
+
return name.split('.').reduce(function (errors, property) { return errors && errors[property]; }, errors);
|
|
9
|
+
};
|
|
10
|
+
exports.getErrorByName = getErrorByName;
|
|
@@ -14,7 +14,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
14
14
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./form"), exports);
|
|
18
17
|
__exportStar(require("./icon"), exports);
|
|
19
18
|
__exportStar(require("./styled-components"), exports);
|
|
20
19
|
__exportStar(require("./text"), exports);
|
|
@@ -10,4 +10,7 @@ export declare class DateHelper {
|
|
|
10
10
|
static addMonths(date: Date, diff: number): Date;
|
|
11
11
|
static addDays(date: Date, diff: number): Date;
|
|
12
12
|
static getCalendarDates(monthDate: Date, startOfWeek: 'sunday' | 'monday'): Date[];
|
|
13
|
+
static endOfMonth(date: Date): Date;
|
|
14
|
+
static getCalendarDatesForCalendar(monthDate: Date, startOfWeek: 'sunday' | 'monday'): Date[];
|
|
15
|
+
static getDatesInRange(startDate: Date, endDate: Date): Date[];
|
|
13
16
|
}
|
|
@@ -82,6 +82,43 @@ var DateHelper = /** @class */ (function () {
|
|
|
82
82
|
var calendarStart = this.addDays(start, -offset);
|
|
83
83
|
return Array.from({ length: 42 }, function (_, i) { return _this.addDays(calendarStart, i); });
|
|
84
84
|
};
|
|
85
|
+
/*
|
|
86
|
+
* 월의 마지막 날짜 반환
|
|
87
|
+
*/
|
|
88
|
+
DateHelper.endOfMonth = function (date) {
|
|
89
|
+
return new Date(date.getFullYear(), date.getMonth() + 1, 0);
|
|
90
|
+
};
|
|
91
|
+
/*
|
|
92
|
+
* 일반 캘린더처럼 현재 달의 날짜만 표시하고, 필요한 경우에만 이전/다음 달의 날짜를 포함
|
|
93
|
+
*/
|
|
94
|
+
DateHelper.getCalendarDatesForCalendar = function (monthDate, startOfWeek) {
|
|
95
|
+
var start = this.startOfMonth(monthDate);
|
|
96
|
+
var end = this.endOfMonth(monthDate);
|
|
97
|
+
var startIndex = startOfWeek === 'monday' ? 1 : 0;
|
|
98
|
+
// 시작 날짜의 요일 조정
|
|
99
|
+
var startOffset = (start.getDay() - startIndex + 7) % 7;
|
|
100
|
+
var calendarStart = this.addDays(start, -startOffset);
|
|
101
|
+
// 마지막 날짜의 요일 조정
|
|
102
|
+
var endOffset = (6 - end.getDay() + startIndex) % 7;
|
|
103
|
+
var calendarEnd = this.addDays(end, endOffset);
|
|
104
|
+
// 전체 날짜 배열 생성
|
|
105
|
+
var dates = [];
|
|
106
|
+
var currentDate = new Date(calendarStart);
|
|
107
|
+
while (currentDate <= calendarEnd) {
|
|
108
|
+
dates.push(new Date(currentDate));
|
|
109
|
+
currentDate = this.addDays(currentDate, 1);
|
|
110
|
+
}
|
|
111
|
+
return dates;
|
|
112
|
+
};
|
|
113
|
+
DateHelper.getDatesInRange = function (startDate, endDate) {
|
|
114
|
+
var dates = [];
|
|
115
|
+
var currentDate = new Date(startDate);
|
|
116
|
+
while (currentDate <= endDate) {
|
|
117
|
+
dates.push(new Date(currentDate));
|
|
118
|
+
currentDate.setDate(currentDate.getDate() + 1);
|
|
119
|
+
}
|
|
120
|
+
return dates;
|
|
121
|
+
};
|
|
85
122
|
return DateHelper;
|
|
86
123
|
}());
|
|
87
124
|
exports.DateHelper = DateHelper;
|
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { PDSTextType } from '../../../common';
|
|
3
|
+
type LanguageCode = 'en' | 'ko' | 'ja' | 'zh' | 'zh-Hant' | 'fr' | 'de' | 'es' | 'it' | 'pt' | 'ru' | 'vi' | 'th' | 'id' | 'ms' | 'ar' | 'tr' | 'pl' | 'nl' | 'sv' | 'fi' | 'no' | 'da' | 'he' | 'hi' | 'bn' | 'ta' | 'el' | 'cs' | 'ro';
|
|
4
|
+
type MultilingualConfig = {
|
|
5
|
+
originalText?: string;
|
|
6
|
+
initialValues?: {
|
|
7
|
+
[key in LanguageCode]?: string;
|
|
8
|
+
};
|
|
9
|
+
visibleLanguages?: LanguageCode[];
|
|
10
|
+
readonlyLanguages?: LanguageCode[];
|
|
11
|
+
hiddenInputId: string;
|
|
12
|
+
onApply?: (values: {
|
|
13
|
+
[key in LanguageCode]?: string;
|
|
14
|
+
}) => void;
|
|
15
|
+
};
|
|
3
16
|
type BasicFormGroupProps = {
|
|
4
17
|
titleStyleTheme?: 'headingBold' | 'leadParaBold' | 'subTitleBold';
|
|
5
18
|
titleText?: PDSTextType;
|
|
@@ -7,6 +20,10 @@ type BasicFormGroupProps = {
|
|
|
7
20
|
captionText?: PDSTextType;
|
|
8
21
|
inputForm?: JSX.Element;
|
|
9
22
|
titleRequirementMode?: 'use' | 'none';
|
|
23
|
+
multilingualMode?: 'use' | 'none';
|
|
24
|
+
multilingualBtnState?: 'normal' | 'disabled';
|
|
25
|
+
multilingualConfig?: MultilingualConfig;
|
|
10
26
|
};
|
|
11
|
-
declare function BasicFormGroup({ titleStyleTheme, titleText, descText, captionText, inputForm, titleRequirementMode }: BasicFormGroupProps): JSX.Element;
|
|
27
|
+
declare function BasicFormGroup({ titleStyleTheme, titleText, descText, captionText, inputForm, titleRequirementMode, multilingualMode, multilingualBtnState, multilingualConfig }: BasicFormGroupProps): JSX.Element;
|
|
12
28
|
export default BasicFormGroup;
|
|
29
|
+
export type { LanguageCode, MultilingualConfig };
|
|
@@ -19,17 +19,60 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
19
19
|
};
|
|
20
20
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
21
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
22
|
+
var react_1 = require("react");
|
|
22
23
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
23
24
|
var hybrid_1 = require("../../../hybrid");
|
|
25
|
+
var panels_1 = require("../../panels");
|
|
26
|
+
var IconButton_1 = require("../IconButton");
|
|
24
27
|
var TextLabel_1 = require("../TextLabel");
|
|
25
28
|
function BasicFormGroup(_a) {
|
|
26
|
-
var _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'subTitleBold' : _b, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, inputForm = _a.inputForm, _c = _a.titleRequirementMode, titleRequirementMode = _c === void 0 ? 'none' : _c;
|
|
27
|
-
|
|
29
|
+
var _b = _a.titleStyleTheme, titleStyleTheme = _b === void 0 ? 'subTitleBold' : _b, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, inputForm = _a.inputForm, _c = _a.titleRequirementMode, titleRequirementMode = _c === void 0 ? 'none' : _c, _d = _a.multilingualMode, multilingualMode = _d === void 0 ? 'none' : _d, _e = _a.multilingualBtnState, multilingualBtnState = _e === void 0 ? 'normal' : _e, multilingualConfig = _a.multilingualConfig;
|
|
30
|
+
var _f = (0, react_1.useState)(false), isMultiLanguageModalOpen = _f[0], setIsMultiLanguageModalOpen = _f[1];
|
|
31
|
+
var _g = (0, react_1.useState)(false), hasMultilingualValues = _g[0], setHasMultilingualValues = _g[1];
|
|
32
|
+
var _h = (0, react_1.useState)(function () {
|
|
33
|
+
return JSON.stringify((multilingualConfig === null || multilingualConfig === void 0 ? void 0 : multilingualConfig.initialValues) || {});
|
|
34
|
+
}), hiddenInputValue = _h[0], setHiddenInputValue = _h[1];
|
|
35
|
+
// hiddenInput의 값이 있는지 확인하는 함수
|
|
36
|
+
var checkMultilingualValues = function () {
|
|
37
|
+
try {
|
|
38
|
+
var values = JSON.parse(hiddenInputValue || '{}');
|
|
39
|
+
var hasValues = Object.values(values).some(function (value) { return value && value.toString().trim() !== ''; });
|
|
40
|
+
setHasMultilingualValues(hasValues);
|
|
41
|
+
}
|
|
42
|
+
catch (_a) {
|
|
43
|
+
setHasMultilingualValues(false);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
// initialValues가 변경될 때 hiddenInputValue 업데이트
|
|
47
|
+
(0, react_1.useEffect)(function () {
|
|
48
|
+
var newValue = JSON.stringify((multilingualConfig === null || multilingualConfig === void 0 ? void 0 : multilingualConfig.initialValues) || {});
|
|
49
|
+
setHiddenInputValue(newValue);
|
|
50
|
+
}, [multilingualConfig === null || multilingualConfig === void 0 ? void 0 : multilingualConfig.initialValues]);
|
|
51
|
+
// hiddenInputValue가 변경될 때마다 체크
|
|
52
|
+
(0, react_1.useEffect)(function () {
|
|
53
|
+
checkMultilingualValues();
|
|
54
|
+
}, [hiddenInputValue]);
|
|
55
|
+
var handleLanguageButtonClick = function () {
|
|
56
|
+
setIsMultiLanguageModalOpen(true);
|
|
57
|
+
};
|
|
58
|
+
var handleLanguageModalClose = function () {
|
|
59
|
+
setIsMultiLanguageModalOpen(false);
|
|
60
|
+
};
|
|
61
|
+
var handleHiddenInputUpdate = function (newValue) {
|
|
62
|
+
setHiddenInputValue(newValue);
|
|
63
|
+
};
|
|
64
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ "x-pds-name": "BasicFormGroup", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [titleText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(S_TitleTextWrapper, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: "sysTextPrimary" }), titleRequirementMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconWrapper, { children: (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: "ic_requirement", size: 16, fillType: "line", colorKey: "ui_cpnt_icon_sys_error_01" }) })), multilingualMode === 'use' && ((0, jsx_runtime_1.jsx)(S_MultilingualButtonWrapper, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_language", baseSize: "small", shapeType: "round", baseColorKey: "ui_cpnt_button_icon_default", iconColorKey: hasMultilingualValues
|
|
65
|
+
? 'ui_cpnt_button_fill_base_primary'
|
|
66
|
+
: 'ui_cpnt_button_fill_base_disabled', state: multilingualBtnState, onClick: multilingualBtnState === 'normal' ? handleLanguageButtonClick : undefined }) }))] }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" })] })), multilingualMode === 'use' && multilingualConfig && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { type: "hidden", id: "hiddenInput_".concat(multilingualConfig.hiddenInputId), name: multilingualConfig.hiddenInputId, value: hiddenInputValue, readOnly: true }), (0, jsx_runtime_1.jsx)(panels_1.MultilingualModal, { isOpen: isMultiLanguageModalOpen, onClose: handleLanguageModalClose, config: multilingualConfig, onHiddenInputUpdate: handleHiddenInputUpdate })] })), descText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: descText, styleTheme: "caption1Regular", colorTheme: "sysTextSecondary" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" })] })), inputForm, captionText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextPrimary" })] }))] })));
|
|
28
67
|
}
|
|
29
68
|
var S_TitleTextWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n"], ["\n align-items: center;\n display: flex;\n"])));
|
|
30
69
|
var S_IconWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 100%;\n height: 16px;\n justify-content: center;\n padding: 0 ", ";\n width: 16px;\n"], ["\n align-items: center;\n display: flex;\n height: 100%;\n height: 16px;\n justify-content: center;\n padding: 0 ", ";\n width: 16px;\n"])), function (_a) {
|
|
31
70
|
var theme = _a.theme;
|
|
32
71
|
return theme.spacing.spacingA;
|
|
33
72
|
});
|
|
73
|
+
var S_MultilingualButtonWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n margin-left: ", ";\n"], ["\n align-items: center;\n display: flex;\n margin-left: ", ";\n"])), function (_a) {
|
|
74
|
+
var theme = _a.theme;
|
|
75
|
+
return theme.spacing.spacingB;
|
|
76
|
+
});
|
|
34
77
|
exports.default = BasicFormGroup;
|
|
35
|
-
var templateObject_1, templateObject_2;
|
|
78
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -11,10 +11,8 @@ export type BoxItemProps = {
|
|
|
11
11
|
titleFontSize?: 'subTitleBold' | 'leadParaBold' | 'body2Bold' | 'headingBold';
|
|
12
12
|
titleTextLineLimit?: number;
|
|
13
13
|
titleTextColorKey?: UiColors;
|
|
14
|
-
titleTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
15
14
|
descText?: PDSTextType;
|
|
16
15
|
descTextColorKey?: UiColors;
|
|
17
|
-
descTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
18
16
|
descLineLimit?: number;
|
|
19
17
|
imageMode?: 'use' | 'none';
|
|
20
18
|
imageShapeType?: 'round' | 'circular' | 'rectangle';
|
|
@@ -24,8 +22,6 @@ export type BoxItemProps = {
|
|
|
24
22
|
imageScaleType?: 'none' | 'cover' | 'contain' | 'fill';
|
|
25
23
|
chipMode?: 'use' | 'none';
|
|
26
24
|
chipText?: PDSTextType;
|
|
27
|
-
chipOverrideTextColorKey?: UiColors;
|
|
28
|
-
chipOverrideBackgroundColorKey?: UiColors;
|
|
29
25
|
displayType?: 'none' | 'ibtn_amount1' | 'ibtn_amount2' | 'ibtn_amount3';
|
|
30
26
|
iBtn1IconName?: PDSIconType;
|
|
31
27
|
iBtn1IconFillType?: 'fill' | 'line';
|
|
@@ -62,5 +58,5 @@ declare const paddingSpacing: {
|
|
|
62
58
|
readonly spacing_m: "spacingM";
|
|
63
59
|
readonly spacing_n: "spacingN";
|
|
64
60
|
};
|
|
65
|
-
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey,
|
|
61
|
+
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey, descText, descTextColorKey, descLineLimit, imageMode, imageShapeType, imageSrc, imageWidth, imageRatio, imageScaleType, chipMode, chipText, displayType, iBtn1IconName, iBtn1IconFillType, iBtn1IconColorKey, iBtn2IconName, iBtn2IconFillType, iBtn2IconColorKey, iBtn3IconName, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
66
62
|
export default BoxItem;
|
|
@@ -42,7 +42,7 @@ var paddingSpacing = {
|
|
|
42
42
|
spacing_n: 'spacingN'
|
|
43
43
|
};
|
|
44
44
|
function BoxItem(_a) {
|
|
45
|
-
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h,
|
|
45
|
+
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h, descText = _a.descText, _j = _a.descTextColorKey, descTextColorKey = _j === void 0 ? 'ui_cpnt_textlabel_sys_secondary' : _j, _k = _a.descLineLimit, descLineLimit = _k === void 0 ? 2 : _k, _l = _a.imageMode, imageMode = _l === void 0 ? 'none' : _l, _m = _a.imageShapeType, imageShapeType = _m === void 0 ? 'round' : _m, imageSrc = _a.imageSrc, imageWidth = _a.imageWidth, _o = _a.imageRatio, imageRatio = _o === void 0 ? '1_1' : _o, _p = _a.imageScaleType, imageScaleType = _p === void 0 ? 'cover' : _p, _q = _a.chipMode, chipMode = _q === void 0 ? 'none' : _q, chipText = _a.chipText, _r = _a.displayType, displayType = _r === void 0 ? 'none' : _r, iBtn1IconName = _a.iBtn1IconName, _s = _a.iBtn1IconFillType, iBtn1IconFillType = _s === void 0 ? 'line' : _s, iBtn1IconColorKey = _a.iBtn1IconColorKey, iBtn2IconName = _a.iBtn2IconName, _t = _a.iBtn2IconFillType, iBtn2IconFillType = _t === void 0 ? 'line' : _t, iBtn2IconColorKey = _a.iBtn2IconColorKey, iBtn3IconName = _a.iBtn3IconName, _u = _a.iBtn3IconFillType, iBtn3IconFillType = _u === void 0 ? 'line' : _u, iBtn3IconColorKey = _a.iBtn3IconColorKey, _v = _a.paddingTop, paddingTop = _v === void 0 ? 'spacing_d' : _v, _w = _a.paddingRight, paddingRight = _w === void 0 ? 'spacing_d' : _w, _x = _a.paddingBottom, paddingBottom = _x === void 0 ? 'spacing_d' : _x, _y = _a.paddingLeft, paddingLeft = _y === void 0 ? 'spacing_d' : _y, id = _a.id, onClick = _a.onClick, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onClickIBtn3 = _a.onClickIBtn3;
|
|
46
46
|
var handleClick = function () {
|
|
47
47
|
if (state === 'disabled') {
|
|
48
48
|
return;
|
|
@@ -87,9 +87,8 @@ function BoxItem(_a) {
|
|
|
87
87
|
flexDirection: 'row',
|
|
88
88
|
alignItems: 'center',
|
|
89
89
|
justifyContent: 'space-between',
|
|
90
|
-
maxWidth: '100%',
|
|
91
90
|
cursor: state === 'disabled' ? 'default' : selectionMode === 'use' ? 'pointer' : 'default'
|
|
92
|
-
} }, { children: [(0, jsx_runtime_1.jsxs)(
|
|
91
|
+
} }, { children: [(0, jsx_runtime_1.jsxs)(S_LeftBox, { children: [checkboxMode !== 'none' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox, __assign({ hasRightBox: true }, { children: (0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Checkbox, { selected: selectState === 'selected', isIndeterminate: checkboxMode === 'indeterminate' }) }))), imageMode === 'use' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Image, { shape: imageShapeType, src: imageSrc, width: imageWidth, ratio: imageRatio, scaleType: imageScaleType })), (0, jsx_runtime_1.jsxs)(S_TextGroup, { children: [titleText && ((0, jsx_runtime_1.jsx)(index_1.D_TextLabel, { text: titleText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : titleTextColorKey, styleTheme: titleFontSize, lineLimit: titleTextLineLimit, ellipsisMode: "use" })), descText && ((0, jsx_runtime_1.jsx)(index_1.D_TextLabel, { text: descText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : descTextColorKey, lineLimit: descLineLimit, ellipsisMode: "use", styleTheme: "caption1Regular" }))] })] }), (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [chipMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Chip_1.Chip, { text: chipText }), (0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" })] })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [displayType === 'ibtn_amount1' && ((0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', baseSize: "medium", fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, iconSize: 20, state: state, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", shapeType: "rectangle" })), displayType === 'ibtn_amount2' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, state: state, onClick: handleIBtn2Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] })), displayType === 'ibtn_amount3' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, state: state, onClick: handleIBtn1Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, state: state, onClick: handleIBtn2Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn3IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn3IconFillType, iconColorKey: iBtn3IconColorKey, state: state, onClick: handleIBtn3Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] }))] }), indicatorMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: "ic_arrow_right", fillType: "line", size: 20, colorKey: "ui_cpnt_icon_sys_grey_01" })] }))] })] })) })));
|
|
93
92
|
}
|
|
94
93
|
var S_BoxItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"])), function (_a) {
|
|
95
94
|
var theme = _a.theme;
|
|
@@ -99,9 +98,7 @@ var S_TextGroup = styled_components_1.default.div(templateObject_2 || (templateO
|
|
|
99
98
|
var theme = _a.theme;
|
|
100
99
|
return theme.spacing.spacingA;
|
|
101
100
|
});
|
|
102
|
-
var
|
|
103
|
-
|
|
104
|
-
return hasRightBox && 3;
|
|
105
|
-
});
|
|
101
|
+
var S_LeftBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: row;\n"], ["\n align-items: center;\n display: flex;\n flex-direction: row;\n"])));
|
|
102
|
+
var S_RightBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: row;\n"], ["\n align-items: center;\n display: flex;\n flex-direction: row;\n"])));
|
|
106
103
|
exports.default = BoxItem;
|
|
107
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
104
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { Schedule, displayAllDayScheduleMode } from './types';
|
|
2
|
+
import type React from 'react';
|
|
3
|
+
interface AllDaySchedulesSectionProps {
|
|
4
|
+
calendarDates: Date[];
|
|
5
|
+
displayAllDayScheduleMode?: displayAllDayScheduleMode;
|
|
6
|
+
getSchedulesForDate: (date: Date) => Schedule[];
|
|
7
|
+
renderScheduleItem: (schedule: Schedule, extraProps?: any) => React.ReactNode;
|
|
8
|
+
handleDateDragOver: (date: Date, e: React.DragEvent) => void;
|
|
9
|
+
handleDateDragLeave: () => void;
|
|
10
|
+
handleDateDrop: (date: Date, e: React.DragEvent) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const AllDaySchedulesSection: React.FC<AllDaySchedulesSectionProps>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __assign = (this && this.__assign) || function () {
|
|
7
|
+
__assign = Object.assign || function(t) {
|
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
+
s = arguments[i];
|
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
+
t[p] = s[p];
|
|
12
|
+
}
|
|
13
|
+
return t;
|
|
14
|
+
};
|
|
15
|
+
return __assign.apply(this, arguments);
|
|
16
|
+
};
|
|
17
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
|
+
};
|
|
20
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
|
+
exports.AllDaySchedulesSection = void 0;
|
|
22
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
23
|
+
var react_1 = require("react");
|
|
24
|
+
var react_i18next_1 = require("react-i18next");
|
|
25
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
26
|
+
var TextLabel_1 = require("../TextLabel");
|
|
27
|
+
var calendarUtils_1 = require("./calendarUtils");
|
|
28
|
+
var AllDaySchedulesSection = function (_a) {
|
|
29
|
+
var calendarDates = _a.calendarDates, _b = _a.displayAllDayScheduleMode, displayAllDayScheduleMode = _b === void 0 ? 'use' : _b, getSchedulesForDate = _a.getSchedulesForDate, renderScheduleItem = _a.renderScheduleItem, handleDateDragOver = _a.handleDateDragOver, handleDateDragLeave = _a.handleDateDragLeave, handleDateDrop = _a.handleDateDrop;
|
|
30
|
+
var t = (0, react_i18next_1.useTranslation)().t;
|
|
31
|
+
// 다중 날짜 종일 이벤트 계산
|
|
32
|
+
var multiDayAllDaySchedules = (0, react_1.useMemo)(function () {
|
|
33
|
+
var allSchedules = new Map();
|
|
34
|
+
var multiDaySchedules = [];
|
|
35
|
+
// 모든 종일 이벤트 수집
|
|
36
|
+
calendarDates.forEach(function (date) {
|
|
37
|
+
var schedulesForDate = getSchedulesForDate(date);
|
|
38
|
+
schedulesForDate.forEach(function (schedule) {
|
|
39
|
+
if (!(0, calendarUtils_1.calculateIsAllDay)(new Date(schedule.startDate), new Date(schedule.endDate))) {
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
var scheduleStart = new Date(schedule.startDate);
|
|
43
|
+
var scheduleEnd = new Date(schedule.endDate);
|
|
44
|
+
scheduleStart.setHours(0, 0, 0, 0);
|
|
45
|
+
scheduleEnd.setHours(0, 0, 0, 0);
|
|
46
|
+
// 단일 날짜 종일 이벤트는 제외
|
|
47
|
+
if (scheduleStart.getTime() === scheduleEnd.getTime()) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
allSchedules.set(schedule.id, schedule);
|
|
51
|
+
});
|
|
52
|
+
});
|
|
53
|
+
// 주간 뷰의 시작/끝 날짜 계산
|
|
54
|
+
var weekStart = new Date(calendarDates[0]);
|
|
55
|
+
var weekEnd = new Date(calendarDates[calendarDates.length - 1]);
|
|
56
|
+
weekStart.setHours(0, 0, 0, 0);
|
|
57
|
+
weekEnd.setHours(0, 0, 0, 0);
|
|
58
|
+
// 다중 날짜 이벤트의 위치 계산
|
|
59
|
+
var scheduleIndexCounter = 0;
|
|
60
|
+
allSchedules.forEach(function (schedule) {
|
|
61
|
+
var scheduleStart = new Date(schedule.startDate);
|
|
62
|
+
var scheduleEnd = new Date(schedule.endDate);
|
|
63
|
+
scheduleStart.setHours(0, 0, 0, 0);
|
|
64
|
+
scheduleEnd.setHours(0, 0, 0, 0);
|
|
65
|
+
// 이벤트가 현재 주와 교차하지 않으면 건너뛰기
|
|
66
|
+
var isIntersecting = !(scheduleEnd.getTime() < weekStart.getTime() || scheduleStart.getTime() > weekEnd.getTime());
|
|
67
|
+
if (!isIntersecting) {
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
// 표시할 실제 시작/끝 날짜 계산 (주간 뷰 범위 내로 제한)
|
|
71
|
+
var displayStart = new Date(Math.max(scheduleStart.getTime(), weekStart.getTime()));
|
|
72
|
+
var displayEnd = new Date(Math.min(scheduleEnd.getTime(), weekEnd.getTime()));
|
|
73
|
+
// 시작과 끝 컬럼 찾기
|
|
74
|
+
var startIndex = calendarDates.findIndex(function (date) {
|
|
75
|
+
var d = new Date(date);
|
|
76
|
+
d.setHours(0, 0, 0, 0);
|
|
77
|
+
return d.getTime() === displayStart.getTime();
|
|
78
|
+
});
|
|
79
|
+
var endIndex = calendarDates.findIndex(function (date) {
|
|
80
|
+
var d = new Date(date);
|
|
81
|
+
d.setHours(0, 0, 0, 0);
|
|
82
|
+
return d.getTime() === displayEnd.getTime();
|
|
83
|
+
});
|
|
84
|
+
if (startIndex === -1 || endIndex === -1) {
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
var startCol = startIndex + 2; // 라벨 컬럼(1) + 0-based 인덱스 보정
|
|
88
|
+
var endCol = endIndex + 2;
|
|
89
|
+
multiDaySchedules.push({
|
|
90
|
+
schedule: schedule,
|
|
91
|
+
startCol: startCol,
|
|
92
|
+
endCol: endCol,
|
|
93
|
+
scheduleIndex: scheduleIndexCounter
|
|
94
|
+
});
|
|
95
|
+
scheduleIndexCounter += 1;
|
|
96
|
+
});
|
|
97
|
+
return multiDaySchedules;
|
|
98
|
+
}, [calendarDates, getSchedulesForDate]);
|
|
99
|
+
if (displayAllDayScheduleMode === 'none') {
|
|
100
|
+
return null;
|
|
101
|
+
}
|
|
102
|
+
return ((0, jsx_runtime_1.jsxs)(S_WeeklyAllDaySection, __assign({ "$rowCount": Math.max(1, multiDayAllDaySchedules.length) }, { children: [(0, jsx_runtime_1.jsx)(S_AllDayLabel, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { styleTheme: "caption1Regular", colorTheme: "sysTextTertiary", text: t('calendar_all_day') }) }), (0, jsx_runtime_1.jsx)(S_WeeklyAllDayGrid, { children: calendarDates.map(function (date, index) {
|
|
103
|
+
// 단일 날짜 종일 이벤트만 표시
|
|
104
|
+
var singleDayAllDaySchedules = getSchedulesForDate(date).filter(function (schedule) {
|
|
105
|
+
var isAllDay = (0, calendarUtils_1.calculateIsAllDay)(new Date(schedule.startDate), new Date(schedule.endDate));
|
|
106
|
+
if (!isAllDay)
|
|
107
|
+
return false;
|
|
108
|
+
var scheduleStart = new Date(schedule.startDate);
|
|
109
|
+
var scheduleEnd = new Date(schedule.endDate);
|
|
110
|
+
scheduleStart.setHours(0, 0, 0, 0);
|
|
111
|
+
scheduleEnd.setHours(0, 0, 0, 0);
|
|
112
|
+
// 단일 날짜 종일 이벤트만 포함
|
|
113
|
+
return scheduleStart.getTime() === scheduleEnd.getTime();
|
|
114
|
+
});
|
|
115
|
+
return ((0, jsx_runtime_1.jsx)(S_WeeklyAllDayCell, __assign({ onDragOver: function (e) { return handleDateDragOver(date, e); }, onDragLeave: handleDateDragLeave, onDrop: function (e) { return handleDateDrop(date, e); } }, { children: singleDayAllDaySchedules.map(function (schedule) { return renderScheduleItem(schedule); }) }), index));
|
|
116
|
+
}) }), multiDayAllDaySchedules.map(function (_a) {
|
|
117
|
+
var schedule = _a.schedule, startCol = _a.startCol, endCol = _a.endCol, scheduleIndex = _a.scheduleIndex;
|
|
118
|
+
return ((0, jsx_runtime_1.jsx)(S_MultiDayAllDaySchedule, __assign({ "$startCol": startCol, "$endCol": endCol, "$scheduleIndex": scheduleIndex }, { children: renderScheduleItem(schedule) }), "multi-".concat(schedule.id)));
|
|
119
|
+
})] })));
|
|
120
|
+
};
|
|
121
|
+
exports.AllDaySchedulesSection = AllDaySchedulesSection;
|
|
122
|
+
var S_WeeklyAllDaySection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n display: grid;\n grid-template-columns: 80px repeat(7, 1fr);\n grid-template-rows: repeat(", ", 24px);\n min-height: 40px;\n position: relative;\n"], ["\n border-bottom: 1px solid ", ";\n display: grid;\n grid-template-columns: 80px repeat(7, 1fr);\n grid-template-rows: repeat(", ", 24px);\n min-height: 40px;\n position: relative;\n"])), function (_a) {
|
|
123
|
+
var theme = _a.theme;
|
|
124
|
+
return theme.ui_cpnt_divider;
|
|
125
|
+
}, function (props) { return props.$rowCount; });
|
|
126
|
+
var S_AllDayLabel = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: center;\n padding: 8px;\n"], ["\n align-items: center;\n display: flex;\n justify-content: center;\n padding: 8px;\n"])));
|
|
127
|
+
var S_WeeklyAllDayGrid = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: contents;\n"], ["\n display: contents;\n"])));
|
|
128
|
+
var S_WeeklyAllDayCell = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n gap: 2px;\n padding: 4px;\n"], ["\n align-items: center;\n display: flex;\n gap: 2px;\n padding: 4px;\n"])));
|
|
129
|
+
var S_MultiDayAllDaySchedule = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n grid-area: ", ";\n margin: 2px;\n position: relative;\n z-index: 10;\n"], ["\n grid-area: ", ";\n margin: 2px;\n position: relative;\n z-index: 10;\n"])), function (props) {
|
|
130
|
+
return "".concat(1 + props.$scheduleIndex, " / ").concat(props.$startCol, " / ").concat(2 + props.$scheduleIndex, " / ").concat(props.$endCol + 1);
|
|
131
|
+
});
|
|
132
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|