pds-dev-kit-web-test 2.5.629 → 2.5.630

package/dist/src/desktop/components/Calendar/YearlyView.js

@@ -0,0 +1,76 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.YearlyView = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_i18next_1 = require("react-i18next");
+var styled_components_1 = __importDefault(require("styled-components"));
+var TextLabel_1 = require("../TextLabel");
+var YearlyView = function (_a) {
+    var selectedDate = _a.selectedDate, getMonthDates = _a.getMonthDates, getDayTextByDate = _a.getDayTextByDate, startOfWeek = _a.startOfWeek, isToday = _a.isToday, handleDateClick = _a.handleDateClick, getSchedulesForDate = _a.getSchedulesForDate;
+    var t = (0, react_i18next_1.useTranslation)().t;
+    var currentYear = selectedDate.getFullYear();
+    var orderedDayTexts = (function () {
+        var weekDates = [];
+        var today = new Date();
+        var startIndex = startOfWeek === 'monday' ? 1 : 0;
+        var firstDayOfWeek = new Date(today);
+        firstDayOfWeek.setDate(today.getDate() - ((today.getDay() - startIndex + 7) % 7));
+        for (var i = 0; i < 7; i += 1) {
+            var date = new Date(firstDayOfWeek);
+            date.setDate(firstDayOfWeek.getDate() + i);
+            weekDates.push(getDayTextByDate(date));
+        }
+        return weekDates;
+    })();
+    var getDateColorTheme = function (isTodayDate) {
+        if (isTodayDate) {
+            return 'sysTextBrandPrimary';
+        }
+        return 'sysTextTertiary';
+    };
+    return ((0, jsx_runtime_1.jsx)(S_YearlyGrid, { children: Array.from({ length: 12 }, function (_unused, monthIndex) {
+            var monthDates = getMonthDates(currentYear, monthIndex);
+            return ((0, jsx_runtime_1.jsxs)(S_YearlyMonth, { children: [(0, jsx_runtime_1.jsx)(S_YearlyMonthHeader, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: t("calendar_month_".concat(monthIndex + 1)), styleTheme: "body1Bold", colorTheme: "sysTextBrandPrimary" }) }), (0, jsx_runtime_1.jsxs)(S_YearlyMiniCalendar, { children: [(0, jsx_runtime_1.jsx)(S_YearlyDayHeaders, { children: orderedDayTexts.map(function (day, index) { return ((0, jsx_runtime_1.jsx)(S_YearlyDayHeader, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: day, styleTheme: "caption2Regular", textAlign: "center", colorTheme: "sysTextTertiary" }) }, "".concat(day, "-").concat(index))); }) }), (0, jsx_runtime_1.jsx)(S_YearlyDatesGrid, { children: monthDates.map(function (date, dateIndex) {
+                                    var isCurrentMonth = date.getMonth() === monthIndex;
+                                    var isTodayDate = isToday(date);
+                                    var hasSchedule = getSchedulesForDate(date).length > 0;
+                                    return ((0, jsx_runtime_1.jsxs)(S_YearlyDateCell, __assign({ "$isToday": isTodayDate, "$isCurrentMonth": isCurrentMonth, onClick: function () { return handleDateClick(date); } }, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: date.getDate().toString(), styleTheme: "caption2Regular", textAlign: "center", colorTheme: getDateColorTheme(isTodayDate) }), hasSchedule && (0, jsx_runtime_1.jsx)(S_Dot, {})] }), dateIndex));
+                                }) })] })] }, monthIndex));
+        }) }));
+};
+exports.YearlyView = YearlyView;
+// Styled Components
+var S_YearlyGrid = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  gap: 24px 32px;\n  grid-template-columns: repeat(4, 1fr);\n  margin: 0 auto;\n  max-width: 1200px;\n  padding: 24px;\n"], ["\n  display: grid;\n  gap: 24px 32px;\n  grid-template-columns: repeat(4, 1fr);\n  margin: 0 auto;\n  max-width: 1200px;\n  padding: 24px;\n"])));
+var S_YearlyMonth = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  min-width: 240px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  min-width: 240px;\n"])));
+var S_YearlyMonthHeader = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding-left: 4px;\n"], ["\n  padding-left: 4px;\n"])));
+var S_YearlyMiniCalendar = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"])));
+var S_YearlyDayHeaders = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: grid;\n  gap: 1px;\n  grid-template-columns: repeat(7, 1fr);\n"], ["\n  display: grid;\n  gap: 1px;\n  grid-template-columns: repeat(7, 1fr);\n"])));
+var S_YearlyDayHeader = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  min-height: 20px;\n  padding: 4px 2px;\n  text-align: center;\n"], ["\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  min-height: 20px;\n  padding: 4px 2px;\n  text-align: center;\n"])));
+var S_YearlyDatesGrid = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: grid;\n  gap: 1px;\n  grid-template-columns: repeat(7, 1fr);\n"], ["\n  display: grid;\n  gap: 1px;\n  grid-template-columns: repeat(7, 1fr);\n"])));
+var S_YearlyDateCell = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  min-height: 24px;\n  opacity: ", ";\n\n  &:hover {\n    background: ", ";\n  }\n"], ["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  min-height: 24px;\n  opacity: ", ";\n\n  &:hover {\n    background: ", ";\n  }\n"])), function (props) { return (props.$isCurrentMonth ? 1 : 0.3); }, function (_a) {
+    var theme = _a.theme;
+    return theme.ui_72;
+});
+var S_Dot = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  background: ", ";\n  border-radius: 50%;\n  height: 5px;\n  margin: 2px auto 0 auto;\n  width: 5px;\n"], ["\n  background: ", ";\n  border-radius: 50%;\n  height: 5px;\n  margin: 2px auto 0 auto;\n  width: 5px;\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_icon_sys_grey_02;
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;

package/dist/src/desktop/components/Calendar/calendarUtils.d.ts

@@ -0,0 +1,24 @@
+import type { CalendarViewType } from './types';
+import type { TFunction } from 'i18next';
+/**
+ * 일정이 종일 일정인지 확인하는 함수
+ * @param startDate 시작 날짜
+ * @param endDate 종료 날짜
+ * @returns 종일 일정 여부
+ */
+export declare const calculateIsAllDay: (startDate: Date, endDate: Date) => boolean;
+export declare const calculateDateRange: (viewType: CalendarViewType, baseDate: Date) => {
+    startDate: Date;
+    endDate: Date;
+};
+/**
+ * 뷰 타입에 따른 헤더 텍스트를 반환하는 함수
+ * @param viewType 캘린더 뷰 타입 (DAILY, WEEKLY, MONTHLY, YEARLY)
+ * @param selectedDate 선택된 날짜
+ * @param t 다국어 변환 함수 (i18next)
+ * @param monthNames 월 이름 배열 (예: ['1월', '2월', ...])
+ * @param getDayTextByDate 날짜에 따른 요일 텍스트 반환 함수
+ * @returns 헤더에 표시할 텍스트
+ */
+export declare const getHeaderText: (viewType: CalendarViewType, selectedDate: Date, t: TFunction) => string;
+export declare const toUTC: (date: Date | null | undefined) => string | null;

package/dist/src/desktop/components/Calendar/calendarUtils.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.toUTC = exports.getHeaderText = exports.calculateDateRange = exports.calculateIsAllDay = void 0;
+var dateHelper_1 = require("../../../common/utils/dateHelper");
+/**
+ * 일정이 종일 일정인지 확인하는 함수
+ * @param startDate 시작 날짜
+ * @param endDate 종료 날짜
+ * @returns 종일 일정 여부
+ */
+var calculateIsAllDay = function (startDate, endDate) {
+    // 시작 시간이 00:00:00(UTC)이고 종료 시간이 23:59:59(UTC)인 경우를 체크
+    var isStartAtMidnight = startDate.getUTCHours() === 0 &&
+        startDate.getUTCMinutes() === 0 &&
+        startDate.getUTCSeconds() === 0;
+    var isEndAtEndOfDay = endDate.getUTCHours() === 23 &&
+        endDate.getUTCMinutes() === 59 &&
+        endDate.getUTCSeconds() === 59;
+    // 시작 시간이 00:00:00(UTC)이고 종료 시간이 23:59:59(UTC)인 경우를 전체일로 간주
+    return isStartAtMidnight && isEndAtEndOfDay;
+};
+exports.calculateIsAllDay = calculateIsAllDay;
+var calculateDateRange = function (viewType, baseDate) {
+    switch (viewType) {
+        case 'DAILY':
+            return { startDate: baseDate, endDate: baseDate };
+        case 'WEEKLY': {
+            var start = new Date(baseDate);
+            start.setDate(baseDate.getDate() - baseDate.getDay());
+            var end = new Date(start);
+            end.setDate(start.getDate() + 6);
+            return { startDate: start, endDate: end };
+        }
+        case 'MONTHLY': {
+            var startDate = new Date(baseDate.getFullYear(), baseDate.getMonth(), 1);
+            // 실제 MonthlyView에서 보여지는 날짜 배열을 구함
+            var days = dateHelper_1.DateHelper.getCalendarDatesForCalendar(startDate, 'sunday');
+            return {
+                startDate: days[0],
+                endDate: days[days.length - 1]
+            };
+        }
+        case 'YEARLY':
+            return {
+                startDate: new Date(baseDate.getFullYear(), 0, 1),
+                endDate: new Date(baseDate.getFullYear(), 11, 31)
+            };
+        default:
+            return { startDate: baseDate, endDate: baseDate };
+    }
+};
+exports.calculateDateRange = calculateDateRange;
+/**
+ * 뷰 타입에 따른 헤더 텍스트를 반환하는 함수
+ * @param viewType 캘린더 뷰 타입 (DAILY, WEEKLY, MONTHLY, YEARLY)
+ * @param selectedDate 선택된 날짜
+ * @param t 다국어 변환 함수 (i18next)
+ * @param monthNames 월 이름 배열 (예: ['1월', '2월', ...])
+ * @param getDayTextByDate 날짜에 따른 요일 텍스트 반환 함수
+ * @returns 헤더에 표시할 텍스트
+ */
+var getHeaderText = function (viewType, selectedDate, t) {
+    var year = selectedDate.getFullYear();
+    var monthNumber = selectedDate.getMonth() + 1;
+    var day = selectedDate.getDate();
+    if (viewType === 'DAILY') {
+        return t('str_calendar_daily_header', { year: year, month: monthNumber, day: day });
+    }
+    if (viewType === 'WEEKLY') {
+        return t('str_calendar_weekly_header', { year: year, month: monthNumber });
+    }
+    if (viewType === 'MONTHLY') {
+        return t('str_calendar_monthly_header', { year: year, month: monthNumber });
+    }
+    if (viewType === 'YEARLY') {
+        return t('str_calendar_yearly_header', { year: year });
+    }
+    return '';
+};
+exports.getHeaderText = getHeaderText;
+// Date를 UTC 시간으로 변환
+var toUTC = function (date) {
+    if (!(date instanceof Date))
+        return null;
+    return date.toISOString();
+};
+exports.toUTC = toUTC;

package/dist/src/desktop/components/Calendar/constants.d.ts

@@ -0,0 +1 @@
+export declare const getLocaleFromLang: (lang: string) => string;

package/dist/src/desktop/components/Calendar/constants.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getLocaleFromLang = void 0;
+// Map language codes to locales for toLocaleString
+var getLocaleFromLang = function (lang) {
+    switch (lang.toLowerCase()) {
+        case 'ko':
+        case 'ko-kr':
+            return 'ko-KR';
+        case 'ja':
+        case 'ja-jp':
+            return 'ja-JP';
+        case 'zh':
+        case 'zh-cn':
+            return 'zh-CN';
+        case 'zh-tw':
+            return 'zh-TW';
+        case 'zh-hk':
+            return 'zh-HK';
+        case 'fil':
+            return 'fil-PH';
+        case 'es':
+        case 'es-es':
+            return 'es-ES';
+        case 'en':
+        case 'en-us':
+        default:
+            return 'en-US';
+    }
+};
+exports.getLocaleFromLang = getLocaleFromLang;

package/dist/src/desktop/components/Calendar/index.d.ts

@@ -0,0 +1,14 @@
+export { AllDaySchedulesSection } from './AllDaySchedulesSection';
+export { default as Calendar } from './Calendar';
+export { CalendarProvider, useCalendarContext } from './CalendarContext';
+export { DailyView } from './DailyView';
+export { MonthlyView } from './MonthlyView';
+export { ScheduleItem } from './ScheduleItem';
+export { TimeBasedScheduleItem } from './TimeBasedScheduleItem';
+export { WeeklyView } from './WeeklyView';
+export { YearlyView } from './YearlyView';
+export * from './timeFormatUtils';
+export type { CalendarProps, Schedule, CalendarViewType, displayAllDayScheduleMode, StartOfWeek, TodayBtnMode, Config, CalendarAction } from './types';
+export { getLocaleFromLang } from './constants';
+export type { ScheduleItemExtraProps } from './ScheduleItem';
+export type { ScheduleItemExtraProps as CalendarContextExtraProps } from './CalendarContext';

package/dist/src/desktop/components/Calendar/index.js

@@ -0,0 +1,42 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getLocaleFromLang = exports.YearlyView = exports.WeeklyView = exports.TimeBasedScheduleItem = exports.ScheduleItem = exports.MonthlyView = exports.DailyView = exports.useCalendarContext = exports.CalendarProvider = exports.Calendar = exports.AllDaySchedulesSection = void 0;
+var AllDaySchedulesSection_1 = require("./AllDaySchedulesSection");
+Object.defineProperty(exports, "AllDaySchedulesSection", { enumerable: true, get: function () { return AllDaySchedulesSection_1.AllDaySchedulesSection; } });
+var Calendar_1 = require("./Calendar");
+Object.defineProperty(exports, "Calendar", { enumerable: true, get: function () { return __importDefault(Calendar_1).default; } });
+var CalendarContext_1 = require("./CalendarContext");
+Object.defineProperty(exports, "CalendarProvider", { enumerable: true, get: function () { return CalendarContext_1.CalendarProvider; } });
+Object.defineProperty(exports, "useCalendarContext", { enumerable: true, get: function () { return CalendarContext_1.useCalendarContext; } });
+var DailyView_1 = require("./DailyView");
+Object.defineProperty(exports, "DailyView", { enumerable: true, get: function () { return DailyView_1.DailyView; } });
+var MonthlyView_1 = require("./MonthlyView");
+Object.defineProperty(exports, "MonthlyView", { enumerable: true, get: function () { return MonthlyView_1.MonthlyView; } });
+var ScheduleItem_1 = require("./ScheduleItem");
+Object.defineProperty(exports, "ScheduleItem", { enumerable: true, get: function () { return ScheduleItem_1.ScheduleItem; } });
+var TimeBasedScheduleItem_1 = require("./TimeBasedScheduleItem");
+Object.defineProperty(exports, "TimeBasedScheduleItem", { enumerable: true, get: function () { return TimeBasedScheduleItem_1.TimeBasedScheduleItem; } });
+var WeeklyView_1 = require("./WeeklyView");
+Object.defineProperty(exports, "WeeklyView", { enumerable: true, get: function () { return WeeklyView_1.WeeklyView; } });
+var YearlyView_1 = require("./YearlyView");
+Object.defineProperty(exports, "YearlyView", { enumerable: true, get: function () { return YearlyView_1.YearlyView; } });
+__exportStar(require("./timeFormatUtils"), exports);
+var constants_1 = require("./constants");
+Object.defineProperty(exports, "getLocaleFromLang", { enumerable: true, get: function () { return constants_1.getLocaleFromLang; } });

package/dist/src/desktop/components/Calendar/timeFormatUtils.d.ts

@@ -0,0 +1,18 @@
+import type { TFunction } from 'react-i18next';
+/**
+ * 로케일에 따라 시간을 문자열로 포맷팅
+ * @param hour - 시간 (0-23)
+ * @param minute - 분 (0-59)
+ * @param currentLang - 현재 언어 코드
+ * @returns 포맷팅된 시간 문자열
+ */
+export declare const formatHour: (hour: number, minute: number | undefined, currentLang: string) => string;
+/**
+ * 로케일별 텍스트로 시간 포맷팅 (한국어용)
+ * @param hour - 시간 (0-23)
+ * @param minute - 분 (0-59)
+ * @param currentLang - 현재 언어 코드
+ * @param t - react-i18next의 번역 함수
+ * @returns 로케일별 텍스트가 포함된 포맷팅된 시간 문자열
+ */
+export declare const formatTimeWithLocale: (hour: number, minute: number | undefined, currentLang: string, t: TFunction) => string;

package/dist/src/desktop/components/Calendar/timeFormatUtils.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatTimeWithLocale = exports.formatHour = void 0;
+/**
+ * 로케일에 따라 시간을 문자열로 포맷팅
+ * @param hour - 시간 (0-23)
+ * @param minute - 분 (0-59)
+ * @param currentLang - 현재 언어 코드
+ * @returns 포맷팅된 시간 문자열
+ */
+var formatHour = function (hour, minute, currentLang) {
+    if (minute === void 0) { minute = 0; }
+    var is24HourFormat = ['ko', 'ja', 'zh', 'zh-cn', 'zh-tw', 'es'].includes(currentLang);
+    var minuteStr = minute.toString().padStart(2, '0');
+    if (is24HourFormat) {
+        return "".concat(hour, ":").concat(minuteStr);
+    }
+    if (hour === 0)
+        return "12:".concat(minuteStr, " AM");
+    if (hour === 12)
+        return "12:".concat(minuteStr, " PM");
+    if (hour < 12)
+        return "".concat(hour, ":").concat(minuteStr, " AM");
+    return "".concat(hour - 12, ":").concat(minuteStr, " PM");
+};
+exports.formatHour = formatHour;
+/**
+ * 로케일별 텍스트로 시간 포맷팅 (한국어용)
+ * @param hour - 시간 (0-23)
+ * @param minute - 분 (0-59)
+ * @param currentLang - 현재 언어 코드
+ * @param t - react-i18next의 번역 함수
+ * @returns 로케일별 텍스트가 포함된 포맷팅된 시간 문자열
+ */
+var formatTimeWithLocale = function (hour, minute, currentLang, t) {
+    if (minute === void 0) { minute = 0; }
+    if (currentLang === 'ko') {
+        var minuteStr = minute.toString().padStart(2, '0');
+        if (hour === 12) {
+            return minute === 0 ? t('str_fm_datetime_noon') : "".concat(t('str_fm_pm'), " 12:").concat(minuteStr);
+        }
+        if (hour < 12) {
+            if (hour === 0) {
+                return minute === 0
+                    ? "".concat(t('str_fm_datetime_am', { hour: 12 }))
+                    : "".concat(t('str_fm_am'), " 12:").concat(minuteStr);
+            }
+            return minute === 0
+                ? "".concat(t('str_fm_datetime_am', { hour: hour }))
+                : "".concat(t('str_fm_am'), " ").concat(hour, ":").concat(minuteStr);
+        }
+        return minute === 0
+            ? "".concat(t('str_fm_datetime_pm', { hour: hour - 12 }))
+            : "".concat(t('str_fm_pm'), " ").concat(hour - 12, ":").concat(minuteStr);
+    }
+    // 다른 언어의 경우 기본 formatHour 함수 사용
+    return (0, exports.formatHour)(hour, minute, currentLang);
+};
+exports.formatTimeWithLocale = formatTimeWithLocale;

package/dist/src/desktop/components/Calendar/types.d.ts

@@ -0,0 +1,61 @@
+/// <reference types="react" />
+export type CalendarViewType = 'MONTHLY' | 'WEEKLY' | 'DAILY' | 'YEARLY';
+export type displayAllDayScheduleMode = 'none' | 'use';
+export type StartOfWeek = 'sunday' | 'monday';
+export type TodayBtnMode = 'none' | 'use';
+export type ActionType = 'CLICK' | 'CLICK_WITH_SHIFT_KEY_DOWN' | 'DELETE_KEY_DOWN' | 'DRAG' | 'DOUBLE_CLICK';
+export type TargetType = 'SCHEDULE' | 'DATE';
+export type Action = {
+    action: ActionType;
+    target: TargetType;
+    date?: Date;
+    dates?: Date[];
+    schedule?: Schedule;
+    schedules?: Schedule[];
+    selectedDates?: Date[];
+    startDate?: string | undefined | null;
+    endDate?: string | undefined | null;
+};
+export type ConfigTrigger = (action: Action) => void;
+export type Config = {
+    [target in TargetType]?: {
+        [action in ActionType]?: ConfigTrigger;
+    };
+};
+export type Schedule = {
+    id: number;
+    title: string;
+    startDate: Date;
+    endDate: Date;
+    isAllDay?: boolean;
+    [key: string]: any;
+};
+export type CalendarActionType = 'CALENDAR_TYPE_CHANGE' | 'PREV_BUTTON_CLICK' | 'NEXT_BUTTON_CLICK' | 'TODAY_BUTTON_CLICK';
+export type CalendarAction = {
+    type: CalendarActionType;
+    payload: {
+        type?: CalendarViewType;
+        startDate: string | undefined | null;
+        endDate: string | undefined | null;
+    };
+};
+export type CalendarProps = {
+    defaultViewType?: CalendarViewType | 'str_fm_month' | 'str_fm_week' | 'str_fm_day' | 'str_fm_year';
+    viewTypes?: (CalendarViewType | 'str_fm_month' | 'str_fm_week' | 'str_fm_day' | 'str_fm_year')[];
+    displayAllDayScheduleMode?: displayAllDayScheduleMode;
+    startOfWeek?: StartOfWeek;
+    todayBtnMode?: TodayBtnMode;
+    schedules?: Schedule[];
+    config?: Config;
+    onActionDispatch?: (action: CalendarAction) => void;
+};
+export type EventItemProps = {
+    event: Schedule;
+    date?: Date;
+    extraProps?: Record<string, any>;
+    onDragStart: (event: Schedule, e: React.DragEvent) => void;
+    onDragEnd: (e: React.DragEvent) => void;
+    onClick: (schedule: Schedule, e: React.MouseEvent) => void;
+    onDoubleClick: (schedule: Schedule) => void;
+    isSelected?: boolean;
+};

package/dist/src/desktop/components/ChatBubbleListItem/ChatBubbleListItem.d.ts

@@ -9,8 +9,7 @@ export type ChatBubbleListItemProps = {
     colorTheme?: ColorThemeType;
     timeMode?: 'none' | 'use';
     timeText?: PDSTextType;
-    countMode?: 'none' | 'use';
-    countText?: PDSTextType;
+    labelText?: PDSTextType;
     contextMenuOptionArray?: PDSValueOption[];
     contextMenuState?: 'normal' | 'disabled';
     children?: React.ReactNode;
@@ -18,5 +17,5 @@ export type ChatBubbleListItemProps = {
     onClickContextMenuItem?: (option: PDSValueOption) => void;
     onClickDownloadIBtn?: () => void;
 };
-declare function ChatBubbleListItem({ titleText, imageSrc, hoverMode, styleTheme, colorTheme, timeMode, timeText, countMode, countText, contextMenuOptionArray, contextMenuState, children, downloadIBtnMode, onClickContextMenuItem, onClickDownloadIBtn }: ChatBubbleListItemProps): JSX.Element;
+declare function ChatBubbleListItem({ titleText, imageSrc, hoverMode, styleTheme, colorTheme, timeMode, timeText, labelText, contextMenuOptionArray, contextMenuState, children, downloadIBtnMode, onClickContextMenuItem, onClickDownloadIBtn }: ChatBubbleListItemProps): JSX.Element;
 export default ChatBubbleListItem;

package/dist/src/desktop/components/ChatBubbleListItem/ChatBubbleListItem.js

@@ -68,8 +68,8 @@ var profileImageBorderColorTheme = {
     transparent: 'ui_cpnt_list_chatbubble_base_transparent'
 };
 function ChatBubbleListItem(_a) {
-    var titleText = _a.titleText, imageSrc = _a.imageSrc, _b = _a.hoverMode, hoverMode = _b === void 0 ? 'use' : _b, styleTheme = _a.styleTheme, _c = _a.colorTheme, colorTheme = _c === void 0 ? 'grey' : _c, _d = _a.timeMode, timeMode = _d === void 0 ? 'use' : _d, timeText = _a.timeText, _e = _a.countMode, countMode = _e === void 0 ? 'none' : _e, countText = _a.countText, contextMenuOptionArray = _a.contextMenuOptionArray, _f = _a.contextMenuState, contextMenuState = _f === void 0 ? 'normal' : _f, children = _a.children, _g = _a.downloadIBtnMode, downloadIBtnMode = _g === void 0 ? 'none' : _g, onClickContextMenuItem = _a.onClickContextMenuItem, onClickDownloadIBtn = _a.onClickDownloadIBtn;
-    var _h = (0, react_1.useState)(false), isContextMenuOpen = _h[0], setIsContextMenuOpen = _h[1];
+    var titleText = _a.titleText, imageSrc = _a.imageSrc, _b = _a.hoverMode, hoverMode = _b === void 0 ? 'use' : _b, styleTheme = _a.styleTheme, _c = _a.colorTheme, colorTheme = _c === void 0 ? 'grey' : _c, _d = _a.timeMode, timeMode = _d === void 0 ? 'use' : _d, timeText = _a.timeText, labelText = _a.labelText, contextMenuOptionArray = _a.contextMenuOptionArray, _e = _a.contextMenuState, contextMenuState = _e === void 0 ? 'normal' : _e, children = _a.children, _f = _a.downloadIBtnMode, downloadIBtnMode = _f === void 0 ? 'none' : _f, onClickContextMenuItem = _a.onClickContextMenuItem, onClickDownloadIBtn = _a.onClickDownloadIBtn;
+    var _g = (0, react_1.useState)(false), isContextMenuOpen = _g[0], setIsContextMenuOpen = _g[1];
     var contextMenuRef = (0, react_1.useRef)(null);
     var chatBody = document.querySelector('#chatMessageBox');
     var rect = chatBody === null || chatBody === void 0 ? void 0 : chatBody.getBoundingClientRect();
@@ -80,26 +80,21 @@ function ChatBubbleListItem(_a) {
         styleTheme === 'other_avatar' ||
         styleTheme === 'other_avatar_sub';
     var titleTextColorTheme = 'sysTextPrimary';
-    var countTextColorTheme = 'sysTextPrimary';
     switch (colorTheme) {
         case 'grey': {
             titleTextColorTheme = 'sysTextPrimary';
-            countTextColorTheme = 'sysTextPrimary';
             break;
         }
         case 'brand_primary': {
             titleTextColorTheme = 'usrTextBrandPrimary';
-            countTextColorTheme = 'sysTextPrimary';
             break;
         }
         case 'translucent_white': {
             titleTextColorTheme = 'sysTextBlack';
-            countTextColorTheme = 'sysTextPrimary';
             break;
         }
         case 'translucent_black': {
             titleTextColorTheme = 'sysTextWhite';
-            countTextColorTheme = 'sysTextPrimary';
         }
     }
     /**
@@ -140,7 +135,7 @@ function ChatBubbleListItem(_a) {
         }
         setIsContextMenuOpen(false);
     };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(S_ChatBubbleListItem, __assign({ "x-pds-name": "ChatBubbleListItem", "x-pds-element-type": "component", "x-pds-device-type": "desktop", isMe: isMe }, { children: [hasLeftSpacing ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isProfileImageShow ? ((0, jsx_runtime_1.jsx)(S_ImageViewWrapper, __assign({ isOtherAvatarImpact: styleTheme === 'other_avatar_impact', colorTheme: colorTheme }, { children: (0, jsx_runtime_1.jsx)(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: styleTheme === 'other_avatar_impact' ? 36 : 38 }) }))) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })) })) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" })), (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [isTitleTextShow && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", colorTheme: titleTextColorTheme }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" })] })), (0, jsx_runtime_1.jsxs)(S_ChatBubbleBox, { children: [(0, jsx_runtime_1.jsxs)(S_ChatBubbleWrapper, __assign({ isMe: isMe }, { children: [isMe && ((0, jsx_runtime_1.jsxs)(S_Box, { children: [downloadIBtnMode === 'use' && (0, jsx_runtime_1.jsx)("div", { style: { height: '32px', width: '1px' } }), (0, jsx_runtime_1.jsx)(S_DownloadIconWrapper, __assign({ isMe: isMe }, { children: downloadIBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { shapeType: "circular", iconFillType: "fill", baseColorKey: "ui_cpnt_list_chatbubble_download_button_base", iconColorKey: "ui_cpnt_button_icon_white", iconSize: 16, iconName: "ic_download", onClick: onClickDownloadIBtn })) })), (0, jsx_runtime_1.jsxs)(S_TimeWrapper, __assign({ isMe: isMe }, { children: [countMode === 'use' && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: countText, styleTheme: "caption2Regular", colorTheme: countTextColorTheme })), timeMode === 'use' && timeText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: timeText, styleTheme: "caption2Regular", colorTheme: "sysTextTertiary", singleLineMode: "use" })] }))] }))] })), (0, jsx_runtime_1.jsx)(ChatBubble_1.default, __assign({ colorTheme: colorTheme, tailType: chatBubbleTailType[styleTheme] }, { children: children })), !isMe && ((0, jsx_runtime_1.jsxs)(S_Box, { children: [downloadIBtnMode === 'use' && (0, jsx_runtime_1.jsx)("div", { style: { height: '32px', width: '1px' } }), (0, jsx_runtime_1.jsx)(S_DownloadIconWrapper, __assign({ isMe: isMe }, { children: downloadIBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { shapeType: "circular", iconFillType: "fill", baseColorKey: "ui_cpnt_list_chatbubble_download_button_base", iconColorKey: "ui_cpnt_button_icon_white", iconSize: 16, iconName: "ic_download", onClick: onClickDownloadIBtn })) })), (0, jsx_runtime_1.jsxs)(S_TimeWrapper, __assign({ isMe: isMe }, { children: [countMode === 'use' && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: countText, styleTheme: "caption2Regular", colorTheme: countTextColorTheme })), timeMode === 'use' && timeText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: timeText, styleTheme: "caption2Regular", colorTheme: "sysTextTertiary", singleLineMode: "use" })] }))] }))] }))] })), hoverMode === 'use' && !isMe && ((0, jsx_runtime_1.jsx)(S_SeeMoreButton, __assign({ isContextMenuOpen: isContextMenuOpen, hoverMode: hoverMode, ref: contextMenuRef }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: "xsmall", iconFillType: "fill", iconSize: 20, iconName: "ic_more", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: "ui_cpnt_button_icon_enabled", onClick: handleMoreButtonClick }) })))] })] }), (0, jsx_runtime_1.jsx)(Popup_1.PopupProvider, { children: (0, jsx_runtime_1.jsx)(Popup_1.Popup, __assign({ targetRef: contextMenuRef, isOpen: isContextMenuOpen, placement: "top-end", wrapperHeight: rect === null || rect === void 0 ? void 0 : rect.height, onClickOutside: function () { return setIsContextMenuOpen(false); } }, { children: (0, jsx_runtime_1.jsx)(ContextMenu_1.ContextMenu, { children: contextMenuOptionArray === null || contextMenuOptionArray === void 0 ? void 0 : contextMenuOptionArray.map(function (el) { return ((0, jsx_runtime_1.jsx)(ContextMenuItem_1.ContextMenuItem, { option: el, onClick: handleContextMenuItemClick, state: contextMenuState }, el.value)); }) }) })) })] })) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(S_ChatBubbleListItem, __assign({ "x-pds-name": "ChatBubbleListItem", "x-pds-element-type": "component", "x-pds-device-type": "desktop", isMe: isMe }, { children: [hasLeftSpacing ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isProfileImageShow ? ((0, jsx_runtime_1.jsx)(S_ImageViewWrapper, __assign({ isOtherAvatarImpact: styleTheme === 'other_avatar_impact', colorTheme: colorTheme }, { children: (0, jsx_runtime_1.jsx)(hybrid_1.ImageView, { shapeType: "circular", ratio: "1_1", scaleType: "cover", src: imageSrc, width: styleTheme === 'other_avatar_impact' ? 36 : 38 }) }))) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_g", spacingType: "width" })) })) : ((0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" })), (0, jsx_runtime_1.jsxs)(S_RightBox, { children: [isTitleTextShow && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: titleText, styleTheme: "caption1Bold", colorTheme: titleTextColorTheme }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b" })] })), (0, jsx_runtime_1.jsxs)(S_ChatBubbleBox, { children: [(0, jsx_runtime_1.jsxs)(S_ChatBubbleWrapper, __assign({ isMe: isMe }, { children: [isMe && ((0, jsx_runtime_1.jsxs)(S_Box, { children: [downloadIBtnMode === 'use' && (0, jsx_runtime_1.jsx)("div", { style: { height: '32px', width: '1px' } }), (0, jsx_runtime_1.jsx)(S_DownloadIconWrapper, __assign({ isMe: isMe }, { children: downloadIBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { shapeType: "circular", iconFillType: "fill", baseColorKey: "ui_cpnt_list_chatbubble_download_button_base", iconColorKey: "ui_cpnt_button_icon_white", iconSize: 16, iconName: "ic_download", onClick: onClickDownloadIBtn })) })), (0, jsx_runtime_1.jsxs)(S_TimeWrapper, __assign({ isMe: isMe }, { children: [labelText && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: labelText, styleTheme: "caption2Bold", colorTheme: "sysTextTertiary" })), timeMode === 'use' && timeText && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: timeText, styleTheme: "caption2Regular", colorTheme: "sysTextTertiary", singleLineMode: "use" }))] }))] })), (0, jsx_runtime_1.jsx)(ChatBubble_1.default, __assign({ colorTheme: colorTheme, tailType: chatBubbleTailType[styleTheme] }, { children: children })), !isMe && ((0, jsx_runtime_1.jsxs)(S_Box, { children: [downloadIBtnMode === 'use' && (0, jsx_runtime_1.jsx)("div", { style: { height: '32px', width: '1px' } }), (0, jsx_runtime_1.jsx)(S_DownloadIconWrapper, __assign({ isMe: isMe }, { children: downloadIBtnMode === 'use' && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { shapeType: "circular", iconFillType: "fill", baseColorKey: "ui_cpnt_list_chatbubble_download_button_base", iconColorKey: "ui_cpnt_button_icon_white", iconSize: 16, iconName: "ic_download", onClick: onClickDownloadIBtn })) })), (0, jsx_runtime_1.jsxs)(S_TimeWrapper, __assign({ isMe: isMe }, { children: [labelText && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: labelText, styleTheme: "caption2Bold", colorTheme: "sysTextTertiary" })), timeMode === 'use' && timeText && ((0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: timeText, styleTheme: "caption2Regular", colorTheme: "sysTextTertiary", singleLineMode: "use" }))] }))] }))] })), hoverMode === 'use' && !isMe && ((0, jsx_runtime_1.jsx)(S_SeeMoreButton, __assign({ isContextMenuOpen: isContextMenuOpen, hoverMode: hoverMode, ref: contextMenuRef }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: "xsmall", iconFillType: "fill", iconSize: 20, iconName: "ic_more", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: "ui_cpnt_button_icon_enabled", onClick: handleMoreButtonClick }) })))] })] }), (0, jsx_runtime_1.jsx)(Popup_1.PopupProvider, { children: (0, jsx_runtime_1.jsx)(Popup_1.Popup, __assign({ targetRef: contextMenuRef, isOpen: isContextMenuOpen, placement: "top-end", wrapperHeight: rect === null || rect === void 0 ? void 0 : rect.height, onClickOutside: function () { return setIsContextMenuOpen(false); } }, { children: (0, jsx_runtime_1.jsx)(ContextMenu_1.ContextMenu, { children: contextMenuOptionArray === null || contextMenuOptionArray === void 0 ? void 0 : contextMenuOptionArray.map(function (el) { return ((0, jsx_runtime_1.jsx)(ContextMenuItem_1.ContextMenuItem, { option: el, onClick: handleContextMenuItemClick, state: contextMenuState }, el.value)); }) }) })) })] })) }));
 }
 var MyChatBubbleListItem = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-right: ", ";\n"], ["\n  margin-right: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/desktop/components/ChatList/Body.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { Props as ChatListProps } from './ChatList';
-declare const Body: React.ForwardRefExoticComponent<Pick<ChatListProps, "children" | "scrollVisibleType" | "bodyMBtnText" | "bodySpacingMode" | "bodyChildren"> & {
+declare const Body: React.ForwardRefExoticComponent<Pick<ChatListProps, "children" | "scrollVisibleType" | "bodySpacingMode" | "bodyMBtnText" | "bodyChildren"> & {
     isSubmitted: boolean;
     callBackAfterScrollToBottom: () => void;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/src/desktop/components/PriceTextField/PriceTextField.d.ts

@@ -0,0 +1,43 @@
+/// <reference types="react" />
+import { Path } from 'react-hook-form';
+import { CurrencyCode, ExchangeRateMap } from '../../../core/pricing';
+import type { IFormValues, PDSTextType } from '../../../common';
+import type { TextFieldBaseProps } from '../../common/components/TextFieldBase/TextFieldBase';
+export declare const DEFAULT_DECIMAL_PLACES: {
+    readonly KRW: 0;
+    readonly USD: 2;
+};
+type Props = {
+    name: Path<IFormValues>;
+    hintText?: PDSTextType;
+    defaultAmount?: number;
+    size?: 'large' | 'rlarge';
+    responsiveMode?: 'none' | 'use';
+    state?: 'normal' | 'read_only' | 'disabled';
+    dropdownState?: 'normal' | 'read_only';
+    customWidth?: string;
+    baseCurrency?: CurrencyCode;
+    currencies?: CurrencyCode[];
+    decimalPlaces?: Record<string, number>;
+    exchangeRates?: ExchangeRateMap;
+    hintTextFontWeight?: 'normal' | 'bold';
+    validation?: any;
+    useRequiredValidation?: 'none' | 'use';
+    useDotBadge?: 'none' | 'use';
+    returnType?: 'object' | 'string' | 'rawValue';
+    deleteBtnMode?: 'none' | 'use';
+    minPriceAmount?: string | number;
+    onExChange?: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
+    onChange?: (value: string) => void;
+    onBlur?: (e: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement>) => void;
+    onFocus?: (e: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement>) => void;
+    onCurrencyChange?: (selectedCurrency: string) => void;
+    onValueChange?: (data: {
+        selectedCurrency: string;
+        baseCurrencyValue: number;
+        calculatedValue: number;
+        displayValue: string;
+    }) => void;
+} & Omit<Partial<TextFieldBaseProps>, 'textAlign' | 'preventBlankMode' | 'enterSubmitMode' | 'multiRows' | 'colorTheme'>;
+declare function PriceTextField({ name, hintText, defaultAmount, colorTheme, size, fontWeight, hintTextFontWeight, responsiveMode, state, dropdownState, customWidth, baseCurrency, currencies, decimalPlaces, exchangeRates, textAlign, validation, useRequiredValidation, useDotBadge, returnType, deleteBtnMode, minPriceAmount, onChange, onExChange, onBlur, onFocus, onTarget, onCurrencyChange, onValueChange }: Props): JSX.Element;
+export default PriceTextField;