@tipp/ui 2.3.32 → 2.3.34

package/dist/app/platform/session-card.cjs

@@ -62,7 +62,7 @@ __export(session_card_exports, {
   SessionCard: () => SessionCard
 });
 module.exports = __toCommonJS(session_card_exports);
-var import_react52 = require("react");
+var import_react53 = require("react");
 var import_date_fns3 = require("date-fns");
 
 // src/atoms/alert-dialog.tsx
@@ -597,8 +597,16 @@ var Content3 = (0, import_react11.forwardRef)((props, ref) => {
   );
 });
 Content3.displayName = "DropdownMenu.Content";
+var Trigger3 = (0, import_react11.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { asChild: _asChild } = _b, props = __objRest(_b, ["asChild"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_themes20.DropdownMenu.Trigger, __spreadValues({ ref }, props));
+  }
+);
+Trigger3.displayName = "DropdownMenu.Trigger";
 var DropdownMenu = __spreadProps(__spreadValues({}, import_themes20.DropdownMenu), {
-  Content: Content3
+  Content: Content3,
+  Trigger: Trigger3
 });
 
 // src/atoms/em.tsx
@@ -678,7 +686,7 @@ var Content4 = (0, import_react13.forwardRef)((props, ref) => {
   );
 });
 Content4.displayName = "Select.Content";
-var Trigger3 = (0, import_react13.forwardRef)(
+var Trigger4 = (0, import_react13.forwardRef)(
   (props, ref) => {
     const _a = props, { className } = _a, rest = __objRest(_a, ["className"]);
     const { error } = (0, import_react13.useContext)(SelectContext);
@@ -689,7 +697,7 @@ var Trigger3 = (0, import_react13.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_themes38.Select.Trigger, __spreadProps(__spreadValues({}, rest), { className: cls, ref }));
   }
 );
-Trigger3.displayName = "Select.Trigger";
+Trigger4.displayName = "Select.Trigger";
 function Root4(props) {
   const _a = props, { error } = _a, rest = __objRest(_a, ["error"]);
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SelectContext.Provider, { value: { error }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_themes38.Select.Root, __spreadValues({}, rest)) });
@@ -697,7 +705,7 @@ function Root4(props) {
 Root4.displayName = "Select.Root";
 var Select = __spreadProps(__spreadValues({}, import_themes38.Select), {
   Root: Root4,
-  Trigger: Trigger3,
+  Trigger: Trigger4,
   Content: Content4
 });
 
@@ -1693,7 +1701,7 @@ var ListContext = (0, import_react24.createContext)({
 });
 
 // src/app/platform/edit-coaching-time.tsx
-var import_react50 = require("react");
+var import_react51 = require("react");
 
 // src/molecules/expand-table/index.tsx
 var import_react_table2 = require("@tanstack/react-table");
@@ -2287,8 +2295,258 @@ var import_jsx_runtime96 = require("react/jsx-runtime");
 // src/molecules/dynamic-form-editor.tsx
 var import_jsx_runtime97 = require("react/jsx-runtime");
 
-// src/app/platform/edit-coaching-time.tsx
+// src/molecules/autocomplete-textfield.tsx
+var import_react50 = require("react");
+var import_themes58 = require("@radix-ui/themes");
 var import_jsx_runtime98 = require("react/jsx-runtime");
+var AutocompleteTextfield = (0, import_react50.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, {
+      options,
+      value: externalValue,
+      onChange,
+      onSelect,
+      placeholder,
+      emptyMessage = "\uAC80\uC0C9 \uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.",
+      maxItems = 10,
+      slotLeft,
+      slotRight,
+      error
+    } = _b, rest = __objRest(_b, [
+      "options",
+      "value",
+      "onChange",
+      "onSelect",
+      "placeholder",
+      "emptyMessage",
+      "maxItems",
+      "slotLeft",
+      "slotRight",
+      "error"
+    ]);
+    const isControlled = externalValue !== void 0;
+    const [internalValue, setInternalValue] = (0, import_react50.useState)("");
+    const inputValue = isControlled ? externalValue : internalValue;
+    const [open, setOpen] = (0, import_react50.useState)(false);
+    const [highlightedIndex, setHighlightedIndex] = (0, import_react50.useState)(-1);
+    const inputRef = (0, import_react50.useRef)(null);
+    const listRef = (0, import_react50.useRef)(null);
+    const listboxId = (0, import_react50.useId)();
+    const justSelectedRef = (0, import_react50.useRef)(false);
+    const filtered = options.filter(
+      (opt) => opt.label.toLowerCase().includes(inputValue.toLowerCase())
+    ).slice(0, maxItems);
+    const handleInputChange = (0, import_react50.useCallback)(
+      (e) => {
+        const next = e.target.value;
+        if (!isControlled) setInternalValue(next);
+        onChange == null ? void 0 : onChange(next);
+        const nextFiltered = options.filter((opt) => opt.label.toLowerCase().includes(next.toLowerCase())).slice(0, maxItems);
+        setOpen(nextFiltered.length > 0 || emptyMessage !== null);
+        setHighlightedIndex(-1);
+      },
+      [isControlled, onChange, options, maxItems, emptyMessage]
+    );
+    const handleSelect = (0, import_react50.useCallback)(
+      (option) => {
+        var _a2;
+        if (!isControlled) setInternalValue(option.label);
+        onChange == null ? void 0 : onChange(option.label);
+        onSelect == null ? void 0 : onSelect(option);
+        setOpen(false);
+        setHighlightedIndex(-1);
+        justSelectedRef.current = true;
+        (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
+      },
+      [isControlled, onChange, onSelect]
+    );
+    const handleFocus = (0, import_react50.useCallback)(() => {
+      if (justSelectedRef.current) {
+        justSelectedRef.current = false;
+        return;
+      }
+      const currentFiltered = options.filter((opt) => opt.label.toLowerCase().includes(inputValue.toLowerCase())).slice(0, maxItems);
+      setOpen(currentFiltered.length > 0 || emptyMessage !== null);
+    }, [options, inputValue, maxItems, emptyMessage]);
+    const handleBlur = (0, import_react50.useCallback)((e) => {
+      var _a2, _b2;
+      if (e.relatedTarget && ((_b2 = (_a2 = inputRef.current) == null ? void 0 : _a2.parentElement) == null ? void 0 : _b2.contains(e.relatedTarget))) {
+        return;
+      }
+      setOpen(false);
+      setHighlightedIndex(-1);
+    }, []);
+    const handleKeyDown = (0, import_react50.useCallback)(
+      (e) => {
+        if (!open) {
+          if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+            setOpen(true);
+            setHighlightedIndex(0);
+            e.preventDefault();
+          }
+          return;
+        }
+        switch (e.key) {
+          case "ArrowDown":
+            e.preventDefault();
+            setHighlightedIndex(
+              (prev) => prev < filtered.length - 1 ? prev + 1 : 0
+            );
+            break;
+          case "ArrowUp":
+            e.preventDefault();
+            setHighlightedIndex(
+              (prev) => prev > 0 ? prev - 1 : filtered.length - 1
+            );
+            break;
+          case "Enter":
+            e.preventDefault();
+            if (highlightedIndex >= 0 && filtered[highlightedIndex]) {
+              handleSelect(filtered[highlightedIndex]);
+            }
+            break;
+          case "Escape":
+            setOpen(false);
+            setHighlightedIndex(-1);
+            break;
+          case "Tab":
+            setOpen(false);
+            setHighlightedIndex(-1);
+            break;
+          default:
+            break;
+        }
+      },
+      [open, filtered, highlightedIndex, handleSelect]
+    );
+    (0, import_react50.useEffect)(() => {
+      if (!listRef.current || highlightedIndex < 0) return;
+      const item = listRef.current.children[highlightedIndex];
+      item.scrollIntoView({ block: "nearest" });
+    }, [highlightedIndex]);
+    return /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(import_themes58.Box, { position: "relative", style: { width: "100%" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+        TextField.Root,
+        __spreadProps(__spreadValues({
+          "aria-activedescendant": open && highlightedIndex >= 0 ? `${listboxId}-option-${highlightedIndex}` : void 0,
+          "aria-autocomplete": "list",
+          "aria-controls": open ? listboxId : void 0,
+          "aria-expanded": open,
+          error,
+          onBlur: handleBlur,
+          onChange: handleInputChange,
+          onFocus: handleFocus,
+          onKeyDown: handleKeyDown,
+          placeholder,
+          ref: (node) => {
+            inputRef.current = node;
+            if (typeof ref === "function") {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+          },
+          role: "combobox",
+          style: { width: "100%" },
+          value: inputValue
+        }, rest), {
+          children: [
+            slotLeft && /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(TextField.Slot, { side: "left", children: slotLeft }),
+            slotRight && /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(TextField.Slot, { side: "right", children: slotRight })
+          ]
+        })
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+        DropdownMenu.Root,
+        {
+          modal: false,
+          onOpenChange: (nextOpen) => {
+            if (!nextOpen && document.activeElement !== inputRef.current) {
+              setOpen(false);
+              setHighlightedIndex(-1);
+            }
+          },
+          open,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+              "span",
+              {
+                "aria-hidden": "true",
+                style: {
+                  bottom: 0,
+                  height: 0,
+                  left: 0,
+                  opacity: 0,
+                  pointerEvents: "none",
+                  position: "absolute",
+                  width: "100%"
+                }
+              }
+            ) }),
+            /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+              DropdownMenu.Content,
+              {
+                align: "start",
+                onCloseAutoFocus: (e) => {
+                  e.preventDefault();
+                },
+                onOpenAutoFocus: (e) => {
+                  e.preventDefault();
+                },
+                sideOffset: 4,
+                style: {
+                  maxHeight: 240,
+                  overflowY: "auto",
+                  padding: 0,
+                  width: "var(--radix-dropdown-menu-trigger-width)"
+                },
+                children: filtered.length === 0 && emptyMessage !== null ? /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_themes58.Box, { px: "2", py: "2", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Typo, { color: "gray", children: emptyMessage }) }) : /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+                  "ul",
+                  {
+                    id: listboxId,
+                    ref: listRef,
+                    role: "listbox",
+                    style: { listStyle: "none", margin: 0, padding: 0 },
+                    children: filtered.map((option, index) => {
+                      const isHighlighted = index === highlightedIndex;
+                      return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+                        "li",
+                        {
+                          "aria-selected": isHighlighted,
+                          id: `${listboxId}-option-${index}`,
+                          onMouseEnter: () => {
+                            setHighlightedIndex(index);
+                          },
+                          onPointerDown: (e) => {
+                            e.preventDefault();
+                            handleSelect(option);
+                          },
+                          role: "option",
+                          style: {
+                            padding: "var(--spacing-4) var(--spacing-6)",
+                            cursor: "pointer",
+                            backgroundColor: isHighlighted ? "var(--accent-3)" : "transparent",
+                            transition: "background-color 80ms"
+                          },
+                          children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Typo, { variant: "body", children: option.label })
+                        },
+                        option.value
+                      );
+                    })
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    ] });
+  }
+);
+AutocompleteTextfield.displayName = "AutocompleteTextfield";
+
+// src/app/platform/edit-coaching-time.tsx
+var import_jsx_runtime99 = require("react/jsx-runtime");
 var getValueFromDefaultValue = (args) => {
   return {
     startTime: args.startAt ? getTimeOption(args.startAt) : "00:00",
@@ -2308,14 +2566,14 @@ var getDateFromValue = (date, time) => {
 };
 function EditCoachingTime(props) {
   const { defaultEndAt, defaultStartAt, onClickCancel } = props;
-  const [values, setValues] = (0, import_react50.useState)(() => {
+  const [values, setValues] = (0, import_react51.useState)(() => {
     return getValueFromDefaultValue({
       startAt: defaultStartAt,
       endAt: defaultEndAt
     });
   });
-  const [timeError, setTimeError] = (0, import_react50.useState)("");
-  const checkTimeError = (0, import_react50.useCallback)(
+  const [timeError, setTimeError] = (0, import_react51.useState)("");
+  const checkTimeError = (0, import_react51.useCallback)(
     (startTime, endTime) => {
       const error = startTime >= endTime ? "\uC2DC\uC791\uC2DC\uAC04\uC744 \uC885\uB8CC\uC2DC\uAC04\uBCF4\uB2E4 \uBE60\uB974\uAC8C \uC120\uD0DD\uD574\uC8FC\uC138\uC694." : "";
       if (error) {
@@ -2326,7 +2584,7 @@ function EditCoachingTime(props) {
     },
     []
   );
-  const onChangeStartTime = (0, import_react50.useCallback)(
+  const onChangeStartTime = (0, import_react51.useCallback)(
     (v) => {
       checkTimeError(v, values.endTime);
       setValues((prev) => __spreadProps(__spreadValues({}, prev), {
@@ -2335,7 +2593,7 @@ function EditCoachingTime(props) {
     },
     [checkTimeError, values.endTime]
   );
-  const onChangeEndTime = (0, import_react50.useCallback)(
+  const onChangeEndTime = (0, import_react51.useCallback)(
     (v) => {
       checkTimeError(values.startTime, v);
       setValues((prev) => __spreadProps(__spreadValues({}, prev), {
@@ -2344,12 +2602,12 @@ function EditCoachingTime(props) {
     },
     [checkTimeError, values.startTime]
   );
-  const onChangeDate = (0, import_react50.useCallback)((date) => {
+  const onChangeDate = (0, import_react51.useCallback)((date) => {
     date && setValues((prev) => __spreadProps(__spreadValues({}, prev), {
       date
     }));
   }, []);
-  const onClickSave = (0, import_react50.useCallback)(() => {
+  const onClickSave = (0, import_react51.useCallback)(() => {
     if (checkTimeError(values.startTime, values.endTime)) {
       const startAt = getDateFromValue(values.date, values.startTime);
       const endAt = getDateFromValue(values.date, values.endTime);
@@ -2358,10 +2616,10 @@ function EditCoachingTime(props) {
       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_runtime98.jsx)(import_themes6.Box, { width: { initial: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Form.Root, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(Form.Field, { name: "date", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Label, { variant: "caption", children: "\uB0A0\uC9DC" }),
-      /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_themes6.Box, { width: { initial: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Form.Root, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(Form.Field, { name: "date", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Label, { variant: "caption", children: "\uB0A0\uC9DC" }),
+      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
         DatePickerButton,
         {
           maxDate: /* @__PURE__ */ new Date(),
@@ -2371,7 +2629,7 @@ function EditCoachingTime(props) {
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
       import_themes23.Grid,
       {
         align: "center",
@@ -2386,10 +2644,10 @@ function EditCoachingTime(props) {
         mt: "5",
         width: "100%",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Field, { name: "startTime", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Label, { variant: "caption", children: "\uC2DC\uC791 \uC2DC\uAC04" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", {}),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Field, { name: "endTime", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Label, { variant: "caption", children: "\uC885\uB8CC \uC2DC\uAC04" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Field, { name: "startTime", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Label, { variant: "caption", children: "\uC2DC\uC791 \uC2DC\uAC04" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)("div", {}),
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Field, { name: "endTime", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Label, { variant: "caption", children: "\uC885\uB8CC \uC2DC\uAC04" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
             TimeSelect,
             {
               onValueChange: onChangeStartTime,
@@ -2397,8 +2655,8 @@ function EditCoachingTime(props) {
               value: values.startTime
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_themes6.Box, { overflow: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_themes39.Separator, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_themes6.Box, { overflow: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_themes39.Separator, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
             TimeSelect,
             {
               onValueChange: onChangeEndTime,
@@ -2406,36 +2664,36 @@ function EditCoachingTime(props) {
               value: values.endTime
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Field, { name: "startEndTime", style: { gridColumn: "1/span 3" }, children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Form.Message, { forceMatch: Boolean(timeError), children: timeError }) })
+          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Field, { name: "startEndTime", style: { gridColumn: "1/span 3" }, children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Form.Message, { forceMatch: Boolean(timeError), children: timeError }) })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(import_themes22.Flex, { gap: "3", justify: "end", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Button, { onClick: onClickCancel, type: "button", variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(Button, { onClick: onClickSave, type: "button", children: "\uC800\uC7A5\uD558\uAE30" }) })
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_themes22.Flex, { gap: "3", justify: "end", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Button, { onClick: onClickCancel, type: "button", variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Button, { onClick: onClickSave, type: "button", children: "\uC800\uC7A5\uD558\uAE30" }) })
     ] })
   ] }) });
 }
 
 // src/app/platform/edit-service-type.tsx
-var import_react51 = require("react");
+var import_react52 = require("react");
 
 // src/app/platform/on-offline-radio-card.tsx
 var import_react_icons9 = require("@radix-ui/react-icons");
-var import_jsx_runtime99 = require("react/jsx-runtime");
+var import_jsx_runtime100 = require("react/jsx-runtime");
 var SERVICE_TYPE = {
   onlineCoaching: "onlineCoaching",
   offlineCoaching: "offlineCoaching"
 };
 var breakpoint = "sm";
 function HideSmallBox(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_themes6.Box, { display: { initial: "none", [breakpoint]: "block" }, children: props.children });
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_themes6.Box, { display: { initial: "none", [breakpoint]: "block" }, children: props.children });
 }
 function OnOfflineRadioCard(props) {
   const Wrapper = props.response ? HideSmallBox : (p) => p.children;
   const columns = props.response ? { initial: "2", [breakpoint]: "1" } : "1";
   const justify = props.response ? { initial: "center", [breakpoint]: "between" } : "between";
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
     RadioButtonCard.Root,
     __spreadProps(__spreadValues({
       RadioWrapper: Wrapper,
@@ -2444,13 +2702,13 @@ function OnOfflineRadioCard(props) {
       justify
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.onlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_react_icons9.GlobeIcon, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Typo, { children: "\uC628\uB77C\uC778" })
+        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.onlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_react_icons9.GlobeIcon, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Typo, { children: "\uC628\uB77C\uC778" })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.offlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_react_icons9.BackpackIcon, {}) }),
-          /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(Typo, { children: "\uC624\uD504\uB77C\uC778" })
+        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(RadioButtonCard.Item, { value: SERVICE_TYPE.offlineCoaching, children: /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_themes22.Flex, { align: "center", gap: "2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Wrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_react_icons9.BackpackIcon, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Typo, { children: "\uC624\uD504\uB77C\uC778" })
         ] }) })
       ]
     })
@@ -2458,18 +2716,18 @@ function OnOfflineRadioCard(props) {
 }
 
 // src/app/platform/edit-service-type.tsx
-var import_jsx_runtime100 = require("react/jsx-runtime");
+var import_jsx_runtime101 = require("react/jsx-runtime");
 function EditServiceType(props) {
   const { defaultServiceType, onClickCancel } = props;
-  const [sessionType, setSessionType] = (0, import_react51.useState)(
+  const [sessionType, setSessionType] = (0, import_react52.useState)(
     defaultServiceType
   );
-  const onClickSave = (0, import_react51.useCallback)(() => {
+  const onClickSave = (0, import_react52.useCallback)(() => {
     var _a;
     (_a = props.onClickSave) == null ? void 0 : _a.call(props, sessionType);
   }, [props, sessionType]);
-  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_themes6.Box, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes6.Box, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
       Typo,
       {
         as: "p",
@@ -2479,16 +2737,16 @@ function EditServiceType(props) {
         children: "\uC138\uC158 \uC720\uD615\uC5D0 \uB530\uB77C \uCC45\uC815\uB418\uB294 \uCF54\uCE6D \uAE08\uC561\uC774 \uB2EC\uB77C\uC9C0\uBBC0\uB85C, \uC815\uD655\uD558\uAC8C \uC120\uD0DD\uD574\uC8FC\uC138\uC694"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(OnOfflineRadioCard, { onValueChange: setSessionType, value: sessionType }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(import_themes22.Flex, { gap: "3", justify: "end", mt: { initial: "6", xs: "3" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { color: "gray", onClick: onClickCancel, variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { onClick: onClickSave, children: "\uC800\uC7A5\uD558\uAE30" }) })
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(OnOfflineRadioCard, { onValueChange: setSessionType, value: sessionType }),
+    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes22.Flex, { gap: "3", justify: "end", mt: { initial: "6", xs: "3" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Button, { color: "gray", onClick: onClickCancel, variant: "outline", children: "\uCDE8\uC18C\uD558\uAE30" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Dialog.Close, { children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Button, { onClick: onClickSave, children: "\uC800\uC7A5\uD558\uAE30" }) })
     ] })
   ] });
 }
 
 // src/app/platform/session-card.tsx
-var import_jsx_runtime101 = require("react/jsx-runtime");
+var import_jsx_runtime102 = require("react/jsx-runtime");
 var preventDefault2 = (e) => {
   e.preventDefault();
 };
@@ -2518,33 +2776,33 @@ function SessionCard(props) {
     "endAt",
     "sessionType"
   ]);
-  const renderEditButton = (0, import_react52.useCallback)(() => {
-    return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Button, { color: "gray", ml: "2", variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_react_icons2.Pencil1Icon, {}) });
+  const renderEditButton = (0, import_react53.useCallback)(() => {
+    return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Button, { color: "gray", ml: "2", variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_react_icons2.Pencil1Icon, {}) });
   }, []);
-  const sessionTimeStr = (0, import_react52.useMemo)(() => {
+  const sessionTimeStr = (0, import_react53.useMemo)(() => {
     if (!startAt || !endAt) return "\uC54C \uC218 \uC5C6\uC74C";
     return `${(0, import_date_fns3.format)(startAt, "yyyy\uB144 MM\uC6D4 dd\uC77C HH\uC2DC mm\uBD84")} ~ ${(0, import_date_fns3.format)(endAt, "HH\uC2DC mm\uBD84")}`;
   }, [startAt, endAt]);
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Card, __spreadProps(__spreadValues({ error: Boolean(error) }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes22.Flex, { direction: "column", gap: "3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes22.Flex, { align: "center", width: "100%", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Heading2, { variant: "heading4", children: `${userName || "\uC54C \uC218 \uC5C6\uC74C"}\uB2D8 ${sessionNumber || "-"}\uD68C\uCC28` }),
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Card, __spreadProps(__spreadValues({ error: Boolean(error) }, rest), { children: /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes22.Flex, { direction: "column", gap: "3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes22.Flex, { align: "center", width: "100%", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Heading2, { variant: "heading4", children: `${userName || "\uC54C \uC218 \uC5C6\uC74C"}\uB2D8 ${sessionNumber || "-"}\uD68C\uCC28` }),
       TitleExtra,
-      error ? /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(BulletText, { as: "p", color: "red", variant: "caption", children: error }) : null
+      error ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(BulletText, { as: "p", color: "red", variant: "caption", children: error }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes15.DataList.Root, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes15.DataList.Item, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_themes15.DataList.Label, { children: "\uCF54\uCE6D \uC77C\uC2DC" }),
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes15.DataList.Value, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes15.DataList.Root, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes15.DataList.Item, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_themes15.DataList.Label, { children: "\uCF54\uCE6D \uC77C\uC2DC" }),
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes15.DataList.Value, { children: [
           sessionTimeStr,
-          editable ? /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(Dialog.Root, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Dialog.Trigger, { children: renderEditButton() }),
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+          editable ? /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(Dialog.Root, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Dialog.Trigger, { children: renderEditButton() }),
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
               Dialog.Content,
               {
                 onOpenAutoFocus: preventDefault2,
                 style: { overflow: "visible" },
                 title: `${sessionNumber}\uD68C\uCC28 \uC138\uC158 \uC77C\uC2DC \uBCC0\uACBD\uD558\uAE30`,
-                children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                   EditCoachingTime,
                   {
                     defaultEndAt: endAt,
@@ -2557,18 +2815,18 @@ function SessionCard(props) {
           ] }) : null
         ] })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes23.Grid, { columns: { initial: "1", xs: "2" }, style: { gap: "inherit" }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes15.DataList.Item, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_themes15.DataList.Label, { children: "\uC138\uC158 \uCC38\uC5EC \uBC29\uC2DD" }),
-          /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(import_themes15.DataList.Value, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes23.Grid, { columns: { initial: "1", xs: "2" }, style: { gap: "inherit" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes15.DataList.Item, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_themes15.DataList.Label, { children: "\uC138\uC158 \uCC38\uC5EC \uBC29\uC2DD" }),
+          /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(import_themes15.DataList.Value, { children: [
             sessionType === "offlineCoaching" ? "\uC624\uD504\uB77C\uC778" : "\uC628\uB77C\uC778",
-            editable ? /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(Dialog.Root, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Dialog.Trigger, { children: renderEditButton() }),
-              /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+            editable ? /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(Dialog.Root, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Dialog.Trigger, { children: renderEditButton() }),
+              /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                 Dialog.Content,
                 {
                   title: `${sessionNumber}\uD68C\uCC28 \uC138\uC158 \uC9C4\uD589 \uBC29\uC2DD \uBCC0\uACBD\uD558\uAE30`,
-                  children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                     EditServiceType,
                     {
                       defaultServiceType: sessionType,
@@ -2580,7 +2838,7 @@ function SessionCard(props) {
             ] }) : null
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_themes22.Flex, { gap: "2", justify: "end", children: ExtraButtons })
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_themes22.Flex, { gap: "2", justify: "end", children: ExtraButtons })
       ] })
     ] })
   ] }) }));