@tipp/ui 2.3.23 → 2.3.25

package/dist/index.cjs

@@ -168,8 +168,10 @@ __export(index_exports, {
   EllipsisTooltip: () => EllipsisTooltip,
   Em: () => import_themes21.Em,
   EndCallIcon: () => EndCallIcon,
+  EnterFullScreenIcon: () => import_react_icons2.EnterFullScreenIcon,
   EnvelopeClosedIcon: () => import_react_icons2.EnvelopeClosedIcon,
   ExclamationTriangleIcon: () => import_react_icons2.ExclamationTriangleIcon,
+  ExitFullScreenIcon: () => import_react_icons2.ExitFullScreenIcon,
   ExitIcon: () => import_react_icons2.ExitIcon,
   ExpandTable: () => ExpandTable,
   FaceIcon: () => import_react_icons2.FaceIcon,
@@ -277,12 +279,13 @@ __export(index_exports, {
   getCalloutIconComponent: () => getCalloutIconComponent,
   getCellAlign: () => getCellAlign,
   getColumnMeta: () => getColumnMeta,
+  getDynamicFormDisplayValue: () => getDynamicFormDisplayValue,
   getTimeOption: () => getTimeOption,
   getTimeOptions: () => getTimeOptions,
   oneOnOneNoteTextReplacer: () => oneOnOneNoteTextReplacer,
   parseTimeOption: () => parseTimeOption,
   scrollTo: () => scrollTo,
-  toast: () => import_react_toastify2.toast,
+  toast: () => toast,
   uiProps: () => uiProps,
   useCurriculumContext: () => useCurriculumContext,
   useDynamicForm: () => useDynamicForm,
@@ -778,6 +781,7 @@ function Root3(props) {
   (0, import_react10.useEffect)(() => {
     const prevOpen = prevOpenRef.current;
     const currentOpen = props.open;
+    prevOpenRef.current = currentOpen;
     if (prevOpen === true && currentOpen === false && !cleanupExecutedRef.current) {
       cleanupExecutedRef.current = true;
       const timer = setTimeout(() => {
@@ -796,8 +800,14 @@ function Root3(props) {
         cleanupExecutedRef.current = false;
       };
     }
-    prevOpenRef.current = currentOpen;
   }, [props.open]);
+  (0, import_react10.useEffect)(() => {
+    return () => {
+      if (prevOpenRef.current === true) {
+        document.body.style.pointerEvents = "";
+      }
+    };
+  }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(RadixDialog.Root, __spreadValues({}, props));
 }
 var Dialog = {
@@ -1935,30 +1945,21 @@ var Drawer = {
 };
 
 // src/atoms/toast.tsx
-var import_react_icons3 = require("@radix-ui/react-icons");
-var import_react_toastify = require("react-toastify");
-var import_react_toastify2 = require("react-toastify");
+var import_sonner = require("sonner");
 var import_jsx_runtime39 = require("react/jsx-runtime");
-function CloseButton() {
-  return null;
-}
+var toast = Object.assign(import_sonner.toast, {
+  warn: import_sonner.toast.warning
+});
 function ToastContainer(props) {
+  const { style } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-    import_react_toastify.ToastContainer,
-    __spreadValues({
-      autoClose: 5e3,
-      closeButton: CloseButton,
-      closeOnClick: true,
-      draggable: true,
-      hideProgressBar: true,
-      icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_icons3.InfoCircledIcon, {}),
-      newestOnTop: true,
-      pauseOnFocusLoss: true,
-      pauseOnHover: true,
+    import_sonner.Toaster,
+    {
+      closeButton: false,
+      duration: 5e5,
       position: "bottom-right",
-      rtl: false,
-      style: { zIndex: 999999 }
-    }, props)
+      style: __spreadValues({ zIndex: 999999 }, style)
+    }
   );
 }
 
@@ -2786,7 +2787,7 @@ var getRenderCustomHeader = (props) => {
 
 // src/molecules/dot-navigation.tsx
 var import_react28 = require("react");
-var import_react_icons4 = require("@radix-ui/react-icons");
+var import_react_icons3 = require("@radix-ui/react-icons");
 var import_jsx_runtime48 = require("react/jsx-runtime");
 function DotNavigation(props) {
   const { dotCount, onClick, dotIndex, defaultDotIndex, onChangeDotIndex } = props;
@@ -2816,7 +2817,7 @@ function DotNavigation(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes22.Flex, { children: dotCount ? Array.from({ length: dotCount }, (_, i) => i).map((_, index) => {
     const isSelected = currentDot === index;
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
-      import_react_icons4.DotFilledIcon,
+      import_react_icons3.DotFilledIcon,
       {
         height: "24px",
         onClick: () => {
@@ -2987,7 +2988,7 @@ var Stepper = {
 
 // src/molecules/tag-selector.tsx
 var import_react30 = require("react");
-var import_react_icons5 = require("@radix-ui/react-icons");
+var import_react_icons4 = require("@radix-ui/react-icons");
 var import_jsx_runtime50 = require("react/jsx-runtime");
 var OPTION_HEIGHT = 32;
 var stopDefaultEvents = (e) => {
@@ -3203,7 +3204,7 @@ function TagSelector(props) {
                     onDelete(item.id);
                   },
                   variant: "transparent",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons5.Cross1Icon, {})
+                  children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons4.Cross1Icon, {})
                 }
               )
             ] }, item.id);
@@ -3223,7 +3224,7 @@ function TagSelector(props) {
         ]
       }
     ),
-    focus ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons5.MagnifyingGlassIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons5.ChevronRightIcon, {})
+    focus ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons4.MagnifyingGlassIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons4.ChevronRightIcon, {})
   ] });
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_themes29.Popover.Root, { open: Boolean(filteredOptions.length) && propsOpen || open, children: [
     /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes29.Popover.Trigger, { style: { position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
@@ -3441,7 +3442,7 @@ function LearningPost(props) {
 }
 
 // src/molecules/force-refresh.tsx
-var import_react_icons6 = require("@radix-ui/react-icons");
+var import_react_icons5 = require("@radix-ui/react-icons");
 var import_jsx_runtime53 = require("react/jsx-runtime");
 function CodeSize3(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
@@ -3462,7 +3463,7 @@ function ForceRefresh() {
       "1. \uD06C\uB86C \uBE0C\uB77C\uC6B0\uC800 \uC624\uB978\uCABD \uC0C1\uB2E8\uC758",
       " ",
       /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(CodeSize3, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons6.DotsVerticalIcon, { height: "13px" }),
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons5.DotsVerticalIcon, { height: "13px" }),
         "\uB354\uBCF4\uAE30"
       ] }),
       "\uC544\uC774\uCF58\uC744 \uD074\uB9AD\uD569\uB2C8\uB2E4."
@@ -3494,7 +3495,7 @@ function ForceRefresh() {
       "3. \uAC1C\uBC1C\uC790 \uB3C4\uAD6C\uAC00 \uC5F4\uB9AC\uBA74, \uBE0C\uB77C\uC6B0\uC800 \uC0C1\uB2E8\uC5D0 \uC788\uB294",
       " ",
       /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(CodeSize3, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons6.ReloadIcon, { style: { paddingRight: "5px" } }),
+        /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons5.ReloadIcon, { style: { paddingRight: "5px" } }),
         "\uC0C8\uB85C\uACE0\uCE68 \uBC84\uD2BC"
       ] }),
       "\uC744 \uC6B0\uD074\uB9AD\uD569\uB2C8\uB2E4."
@@ -3654,6 +3655,58 @@ function getCalloutIconComponent(iconName) {
   return (_a = iconByName[iconName]) != null ? _a : DEFAULT_ICON;
 }
 
+// src/utils/get-dynamic-form-display-value.ts
+function isEmptyDisplayValue(value) {
+  return value === void 0 || value === null || value === "";
+}
+function findOptionLabel(options, value) {
+  const valueString = String(value);
+  const found = options.find(
+    (option) => String(option.value) === valueString
+  );
+  return found == null ? void 0 : found.label;
+}
+function joinLabelsOrValues(options, values) {
+  const labels = values.map((v) => {
+    const label = findOptionLabel(options, v);
+    return label != null ? label : String(v);
+  });
+  return labels.join(", ");
+}
+function getDynamicFormDisplayValue(field, value) {
+  if (isEmptyDisplayValue(value)) return "";
+  switch (field.type) {
+    case "dropdown":
+    case "choice":
+    case "radio_cards": {
+      const label = findOptionLabel(field.options, value);
+      return label != null ? label : String(value);
+    }
+    case "image_radio_card": {
+      const label = findOptionLabel(field.options, value);
+      return label != null ? label : String(value);
+    }
+    case "choices": {
+      if (Array.isArray(value)) {
+        return joinLabelsOrValues(field.options, value);
+      }
+      const label = findOptionLabel(field.options, value);
+      return label != null ? label : String(value);
+    }
+    case "yes_no": {
+      if (value === true || value === "true" || value === "yes") return "\uB3D9\uC758";
+      if (value === false || value === "false" || value === "no") return "\uBE44\uB3D9\uC758";
+      return String(value);
+    }
+    case "short_text":
+    case "long_text":
+    case "number":
+    case "email":
+    default:
+      return String(value);
+  }
+}
+
 // src/molecules/time-select.tsx
 var import_jsx_runtime55 = require("react/jsx-runtime");
 var getOptionValue = (date, timeValue) => {
@@ -3742,7 +3795,7 @@ var RadioButtonCard = {
 };
 
 // src/molecules/download-card.tsx
-var import_react_icons7 = require("@radix-ui/react-icons");
+var import_react_icons6 = require("@radix-ui/react-icons");
 var import_jsx_runtime57 = require("react/jsx-runtime");
 function DownloadCard({
   fileName,
@@ -3758,7 +3811,7 @@ function DownloadCard({
       style: { width: "100%", height: 56 },
       variant: "soft",
       children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes22.Flex, { align: "center", gap: "3", pl: "4", width: "100%", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { color: "gray", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_icons7.DownloadIcon, { height: 20, width: 20 }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Typo, { color: "gray", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_icons6.DownloadIcon, { height: 20, width: 20 }) }),
         /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes22.Flex, { align: "start", direction: "column", gap: "1", children: [
           /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
             Typo,
@@ -4135,7 +4188,7 @@ var curriculum_video_default = CurriculumVideo;
 
 // src/molecules/curriculumV2/CurriculumContents/curriculum-review.tsx
 var import_react39 = require("react");
-var import_react_icons8 = require("@radix-ui/react-icons");
+var import_react_icons7 = require("@radix-ui/react-icons");
 
 // src/molecules/curriculumV2/CurriculumContents/CurriculumReviewSteps/curriculum-review-context.tsx
 var import_react37 = require("react");
@@ -5185,8 +5238,8 @@ function CurriculumReview(props) {
                   onClick: onClickCloseDrawer,
                   variant: "ghost",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_themes6.Box, { display: { initial: "none", md: "block" }, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_react_icons8.Cross1Icon, { height: 20, width: 20 }) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_themes6.Box, { display: { initial: "block", md: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_react_icons8.Cross1Icon, { height: 16, width: 16 }) })
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_themes6.Box, { display: { initial: "none", md: "block" }, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_react_icons7.Cross1Icon, { height: 20, width: 20 }) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_themes6.Box, { display: { initial: "block", md: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_react_icons7.Cross1Icon, { height: 16, width: 16 }) })
                   ]
                 }
               ) }),
@@ -6111,12 +6164,6 @@ function createYupValidation(field, validation) {
 function isRecord2(value) {
   return Boolean(value) && typeof value === "object" && !Array.isArray(value);
 }
-function isFieldOption2(value) {
-  if (!isRecord2(value)) return false;
-  const label = value.label;
-  const optionValue = value.value;
-  return typeof label === "string" && (typeof optionValue === "string" || typeof optionValue === "number");
-}
 function DynamicFormResponseItem({
   payload,
   questionType,
@@ -6126,47 +6173,24 @@ function DynamicFormResponseItem({
   if (value === void 0 || value === null || value === "") {
     return "\uC751\uB2F5 \uC5C6\uC74C";
   }
-  const getOptions2 = (fieldConfig) => {
-    if (!isRecord2(fieldConfig)) return void 0;
-    const options2 = fieldConfig.options;
-    if (!Array.isArray(options2)) return void 0;
-    if (!options2.every(isFieldOption2)) return void 0;
-    return options2;
-  };
-  const options = getOptions2(config);
+  if (config) {
+    const displayValue = getDynamicFormDisplayValue(config, value);
+    return displayValue === "" ? "\uC751\uB2F5 \uC5C6\uC74C" : displayValue;
+  }
   switch (questionType) {
     case "text":
     case "textarea":
       return String(value);
     case "radio":
     case "select":
-    case "choice":
-    case "radio_cards":
-    case "image_radio_card":
-      if (options) {
-        const option = options.find((opt) => String(opt.value) === String(value));
-        return option ? option.label : String(value);
-      }
       return String(value);
     case "checkbox":
     case "choices":
       if (Array.isArray(value)) {
-        if (options) {
-          return value.map((val) => {
-            const option = options.find(
-              (opt) => String(opt.value) === String(val)
-            );
-            return option ? option.label : String(val);
-          }).join(", ");
-        }
-        return value.join(", ");
+        return value.map((v) => String(v)).join(", ");
       }
       return String(value);
     case "rating":
-      if (options) {
-        const option = options.find((opt) => opt.value === value);
-        return option ? option.label : String(value);
-      }
       return String(value);
     case "number":
       return String(value);
@@ -6285,7 +6309,7 @@ function DescriptionJsonRender(props) {
 
 // src/molecules/training-info-guideline.tsx
 var import_react46 = require("react");
-var import_react_icons9 = require("@radix-ui/react-icons");
+var import_react_icons8 = require("@radix-ui/react-icons");
 var import_jsx_runtime92 = require("react/jsx-runtime");
 function TrainingInfoGuideline({
   values,
@@ -6313,7 +6337,7 @@ function TrainingInfoGuidelineItem({
       TrainingInfoGuidelineButton,
       {
         description: "\uD30C\uC77C \uB2E4\uC6B4\uB85C\uB4DC",
-        icon: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_react_icons9.FileTextIcon, {}),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_react_icons8.FileTextIcon, {}),
         onClick: () => {
           onClickFileDownload({ url: value.url, filename: value.filename });
         },
@@ -6327,7 +6351,7 @@ function TrainingInfoGuidelineItem({
         TrainingInfoGuidelineButton,
         {
           description: "\uC601\uC0C1 \uC790\uB8CC",
-          icon: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_react_icons9.VideoIcon, {}),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(import_react_icons8.VideoIcon, {}),
           title: value.videoTitle
         }
       ) }),
@@ -7874,7 +7898,7 @@ function CoachingCustomerInfoSmall({
 
 // src/app/platform/userInfos/utils.tsx
 var import_date_fns3 = require("date-fns");
-var import_react_icons10 = require("@radix-ui/react-icons");
+var import_react_icons9 = require("@radix-ui/react-icons");
 var import_jsx_runtime100 = require("react/jsx-runtime");
 var infoList = [
   { label: "\uC774\uB984", getValue: (customer) => customer == null ? void 0 : customer.username },
@@ -7958,7 +7982,7 @@ function CopyButton(props) {
       },
       style: { marginLeft: "0", marginTop: "0" },
       variant: "transparent",
-      children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_react_icons10.CopyIcon, {})
+      children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_react_icons9.CopyIcon, {})
     }
   );
 }
@@ -8351,7 +8375,7 @@ function EditCoachingTime(props) {
       const endAt = getDateFromValue(values.date, values.endTime);
       props.onClickSave && props.onClickSave(startAt, endAt);
     } else {
-      import_react_toastify2.toast.error("\uC785\uB825 \uAC12\uC774 \uC720\uD6A8\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.");
+      toast.error("\uC785\uB825 \uAC12\uC774 \uC720\uD6A8\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.");
     }
   }, [checkTimeError, props, values.date, values.endTime, values.startTime]);
   return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_themes6.Box, { width: { initial: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(Form.Root, { children: [
@@ -8417,7 +8441,7 @@ function EditCoachingTime(props) {
 var import_react53 = require("react");
 
 // src/app/platform/on-offline-radio-card.tsx
-var import_react_icons11 = require("@radix-ui/react-icons");
+var import_react_icons10 = require("@radix-ui/react-icons");
 var import_jsx_runtime107 = require("react/jsx-runtime");
 var SERVICE_TYPE = {
   onlineCoaching: "onlineCoaching",
@@ -8441,11 +8465,11 @@ function OnOfflineRadioCard(props) {
     }, props), {
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.onlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_icons11.GlobeIcon, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_icons10.GlobeIcon, {}) }),
           /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Typo, { children: "\uC628\uB77C\uC778" })
         ] }) }),
         /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.offlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_icons11.BackpackIcon, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_react_icons10.BackpackIcon, {}) }),
           /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Typo, { children: "\uC624\uD504\uB77C\uC778" })
         ] }) })
       ]
@@ -8660,7 +8684,7 @@ function ReservationCard(props) {
   (0, import_react55.useEffect)(() => {
     if (!minTime || !editValues.date || readonly) return;
     if (editValues.date < minTime) {
-      import_react_toastify2.toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
+      toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
       setEditValues((prev) => {
         return __spreadProps(__spreadValues({}, prev), {
           date: minTime
@@ -8671,7 +8695,7 @@ function ReservationCard(props) {
   (0, import_react55.useEffect)(() => {
     if (!maxTime || !editValues.date || readonly) return;
     if (editValues.date > maxTime) {
-      import_react_toastify2.toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
+      toast.warn("\uC120\uD0DD \uAC00\uB2A5\uD55C \uC2DC\uAC04\uB300\uB85C \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
       setEditValues((prev) => {
         return __spreadProps(__spreadValues({}, prev), {
           date: maxTime
@@ -9123,8 +9147,10 @@ function CurriculumCard(props) {
   EllipsisTooltip,
   Em,
   EndCallIcon,
+  EnterFullScreenIcon,
   EnvelopeClosedIcon,
   ExclamationTriangleIcon,
+  ExitFullScreenIcon,
   ExitIcon,
   ExpandTable,
   FaceIcon,
@@ -9232,6 +9258,7 @@ function CurriculumCard(props) {
   getCalloutIconComponent,
   getCellAlign,
   getColumnMeta,
+  getDynamicFormDisplayValue,
   getTimeOption,
   getTimeOptions,
   oneOnOneNoteTextReplacer,