@x-plat/design-system 0.14.15 → 0.14.16

package/dist/components/Dropdown/index.cjs

@@ -230,7 +230,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react3.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react3.default.useEffect(() => {
@@ -238,14 +238,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -275,7 +278,7 @@ var Dropdown = (props) => {
   const menuRef = import_react4.default.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/Dropdown/index.js

@@ -194,7 +194,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React3.useRef(onClose);
   onCloseRef.current = onClose;
   React3.useEffect(() => {
@@ -202,14 +202,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -239,7 +242,7 @@ var Dropdown = (props) => {
   const menuRef = React4.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/PopOver/index.cjs

@@ -230,7 +230,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react3.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react3.default.useEffect(() => {
@@ -238,14 +238,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -273,7 +276,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = import_react4.default.useState(false);
   const [eventTrigger, setEventTrigger] = import_react4.default.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/PopOver/index.js

@@ -194,7 +194,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React3.useRef(onClose);
   onCloseRef.current = onClose;
   React3.useEffect(() => {
@@ -202,14 +202,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -237,7 +240,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = React4.useState(false);
   const [eventTrigger, setEventTrigger] = React4.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/Select/index.cjs

@@ -231,7 +231,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react3.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react3.default.useEffect(() => {
@@ -239,14 +239,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/tokens/svg/action/CopyIcon.tsx
@@ -1404,7 +1407,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = import_react6.default.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/Select/index.js

@@ -194,7 +194,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React3.useRef(onClose);
   onCloseRef.current = onClose;
   React3.useEffect(() => {
@@ -202,14 +202,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/tokens/svg/action/CopyIcon.tsx
@@ -1367,7 +1370,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = React6.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/TimePicker/index.cjs

@@ -230,7 +230,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react3.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react3.default.useEffect(() => {
@@ -238,14 +238,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -456,7 +459,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = import_react4.default.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/TimePicker/index.js

@@ -194,7 +194,7 @@ var useEscapeKey = (enabled, onEscape) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, onEscape]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React3.useRef(onClose);
   onCloseRef.current = onClose;
   React3.useEffect(() => {
@@ -202,14 +202,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // ../../node_modules/clsx/dist/clsx.mjs
@@ -420,7 +423,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = React4.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/index.cjs

@@ -3441,7 +3441,7 @@ var useFocusTrap = (containerRef, enabled, options = {}) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, trap, containerRef]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react11.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react11.default.useEffect(() => {
@@ -3449,14 +3449,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/components/Modal/Modal.tsx
@@ -4164,7 +4167,7 @@ var Dropdown = (props) => {
   const menuRef = import_react21.default.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });
@@ -6095,7 +6098,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = import_react27.default.useState(false);
   const [eventTrigger, setEventTrigger] = import_react27.default.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });
@@ -6375,7 +6378,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = import_react31.default.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });
@@ -7316,7 +7319,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = import_react40.default.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/components/index.js

@@ -3339,7 +3339,7 @@ var useFocusTrap = (containerRef, enabled, options = {}) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, trap, containerRef]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React11.useRef(onClose);
   onCloseRef.current = onClose;
   React11.useEffect(() => {
@@ -3347,14 +3347,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/components/Modal/Modal.tsx
@@ -4062,7 +4065,7 @@ var Dropdown = (props) => {
   const menuRef = React21.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });
@@ -5993,7 +5996,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = React27.useState(false);
   const [eventTrigger, setEventTrigger] = React27.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });
@@ -6273,7 +6276,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = React31.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });
@@ -7214,7 +7217,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = React40.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/index.cjs

@@ -7853,7 +7853,7 @@ var useFocusTrap = (containerRef, enabled, options = {}) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, trap, containerRef]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = import_react11.default.useRef(onClose);
   onCloseRef.current = onClose;
   import_react11.default.useEffect(() => {
@@ -7861,14 +7861,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/components/Modal/Modal.tsx
@@ -8576,7 +8579,7 @@ var Dropdown = (props) => {
   const menuRef = import_react21.default.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });
@@ -10507,7 +10510,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = import_react27.default.useState(false);
   const [eventTrigger, setEventTrigger] = import_react27.default.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });
@@ -10787,7 +10790,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = import_react31.default.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });
@@ -11728,7 +11731,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = import_react40.default.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/dist/index.js

@@ -7442,7 +7442,7 @@ var useFocusTrap = (containerRef, enabled, options = {}) => {
     return () => document.removeEventListener("keydown", onKey);
   }, [enabled, trap, containerRef]);
 };
-var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
+var useCloseWhenFocusHidden = (enabled, triggerRef, popRef, onClose) => {
   const onCloseRef = React11.useRef(onClose);
   onCloseRef.current = onClose;
   React11.useEffect(() => {
@@ -7450,14 +7450,17 @@ var useCloseWhenTriggerHidden = (enabled, triggerRef, onClose) => {
     if (!enabled || !trigger) return;
     const observer = new IntersectionObserver(
       ([entry]) => {
-        if (!entry.isIntersecting) onCloseRef.current();
+        if (entry.isIntersecting) return;
+        if (!popRef.current?.contains(document.activeElement)) return;
+        onCloseRef.current();
+        trigger.focus({ preventScroll: true });
       },
       // 그릇이 없으면 root: null → 뷰포트 기준
       { root: findScrollParent(trigger), threshold: 0 }
     );
     observer.observe(trigger);
     return () => observer.disconnect();
-  }, [enabled, triggerRef]);
+  }, [enabled, triggerRef, popRef]);
 };
 
 // src/components/Modal/Modal.tsx
@@ -8165,7 +8168,7 @@ var Dropdown = (props) => {
   const menuRef = React21.useRef(null);
   useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, () => setIsOpen(false));
+  useCloseWhenFocusHidden(isOpen, triggerRef, menuRef, () => setIsOpen(false));
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
     triggerRef.current?.focus({ preventScroll: true });
@@ -10096,7 +10099,7 @@ var PopOver = (props) => {
   const [localOpen, setLocalOpen] = React27.useState(false);
   const [eventTrigger, setEventTrigger] = React27.useState(false);
   useClickOutside_default([popRef, triggerRef], onClose, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, onClose);
+  useCloseWhenFocusHidden(isOpen, triggerRef, popRef, onClose);
   useEscapeKey(isOpen, () => {
     onClose();
     triggerRef.current?.focus({ preventScroll: true });
@@ -10376,7 +10379,7 @@ var SelectRoot = (props) => {
   }, []);
   const toggle = React31.useCallback(() => setOpen((prev) => !prev), []);
   useClickOutside_default([contentRef, triggerRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });
@@ -11317,7 +11320,7 @@ var TimePicker = (props) => {
   }, [step, min, max]);
   const close = React40.useCallback(() => setOpen(false), []);
   useClickOutside_default([triggerRef, contentRef], close, isOpen);
-  useCloseWhenTriggerHidden(isOpen, triggerRef, close);
+  useCloseWhenFocusHidden(isOpen, triggerRef, contentRef, close);
   useEscapeKey(isOpen, () => {
     close();
     triggerRef.current?.focus({ preventScroll: true });

package/guidelines/MIGRATION.md

@@ -284,30 +284,36 @@ Dropdown · PopOver · TimePicker 가 전부 애니메이션 없이 툭 튀어
 **올리기만 하면 된다. 쓰는 쪽에서 고칠 것은 없다.** `.repositioning` 클래스를
 직접 잡는 CSS 를 쓰고 있었다면 그 규칙만 지우면 된다.
 
-## 0.14.7 ~ 0.14.14 — 안쪽 상자가 스크롤되면 닫혔다 (0.14.15 에서 되돌림)
+## 0.14.7 ~ 0.14.15 — 스크롤하면 오버레이가 닫혔다 (0.14.16 에서 되돌림)
 
 **이 구간을 쓰고 있었다면** `Select` · `Dropdown` · `PopOver` · `TimePicker`
-를 열어 둔 채 페이지가 아닌 안쪽 상자를 스크롤하면 닫혔다. **0.14.15 부터는
-닫지 않는다** — 따라간다.
+를 열어 둔 채 스크롤하면 닫혔다. **0.14.16 부터는 안 닫힌다** — 따라간다.
 
-0.14.7 에 그 땜질을 넣은 것은 팝업이 스크롤을 **제때 못 따라가고**(JS 로
-옮기느라 한 프레임 늦었다) 그릇 밖으로 나가도 안 잘려 헤더를 덮었기
-때문이다. 어차피 어긋나 보이니 닫는 쪽이 나았다.
+두 번에 걸쳐 걷어냈다.
 
-그 전제가 둘 다 무너졌다:
+    0.14.7   스크롤이 나면 바로 닫는다
+    0.14.15  트리거가 그릇 밖으로 나가면 닫는다
+    0.14.16  안 닫는다 (포커스가 패널 안에 있을 때만 예외)
 
-    0.14.3 ~ 0.14.6   자리를 DOM 에 직접 쓰고 문서 좌표로 바꿔 지연이 사라졌다
-    0.14.9 ~ 0.14.14  그릇 기준으로 자리를 잡고 그릇 밖은 clip-path 로 잘라낸다
+0.14.7 의 땜질은 팝업이 스크롤을 **제때 못 따라가고**(JS 로 옮기느라 한 프레임
+늦었다) 그릇 밖으로 나가도 안 잘려 헤더를 덮었기 때문이다. 어차피 어긋나
+보이니 닫는 쪽이 나았다. 그 전제는 0.14.3~0.14.6(지연 제거)과
+0.14.9~0.14.14(그릇 기준 자리 + `clip-path`)로 무너졌다.
 
-이제 따라가도 어긋나 보이지 않는다. 그리고 닫는 쪽이 손해다 — 긴 목록에서
-아래를 보려고 바퀴를 조금 굴렸을 뿐인데 고르던 것이 사라진다.
+0.14.15 는 "안 보이는데 열린 상태" 를 걱정해 남겨 둔 것인데, 쓰는 사람에게는
+**굴리다가 목록이 툭 사라지는 쪽**이 더 거슬렸다. 목록은 트리거에 딸린
+것이라 **트리거가 돌아오면 목록도 돌아오는 것**이 맞는 그림이다. 잠깐
+지나쳤다는 이유로 고르던 것이 없어질 이유가 없다.
 
-### 다만 트리거가 그릇 밖으로 완전히 나가면 닫는다
+### 예외 하나 — 포커스가 패널 안에 있을 때
 
-안 닫으면 **패널이 통째로 잘려 안 보이는데 열린 상태**가 된다. 눈에는 닫힌
-것 같은데 키보드 포커스와 `Escape` 는 거기 살아 있다. 판정은
-`IntersectionObserver` 에 맡긴다 — 스크롤마다 재는 것보다 싸고, 그릇이
-스크롤하든 페이지가 스크롤하든 같은 방식으로 걸린다.
+그때는 **보이지 않는 곳에 커서가 있는** 상태가 된다. 패널이 통째로 잘려
+있는데 거기 포커스가 살아 있고, 자리가 `absolute` 라 브라우저가 스크롤로
+되돌려 주지도 않는다. 이때만 닫고 포커스를 트리거로 돌린다
+(`preventScroll: true` — 사용자가 굴린 자리를 빼앗지 않는다).
+
+키보드로 열어 항목을 오르내리다 굴리는 경우라 흔하지 않다. 마우스로 쓰면
+겪을 일이 없다.
 
 **쓰는 쪽에서 할 일은 없다.**
 
@@ -384,6 +390,7 @@ export { Button, Input, Select, SideBar /* 쓰는 것만 */ } from "@x-plat/desi
 | 팝업 목록 안에서 휠 → 안 닫힘 (0.14.7) | **사람이 화면에서 확인함** |
 | 긴 항목 줄바꿈 (0.14.8) | **사람이 화면에서 확인함** — 두세 줄로 떨어진다 |
 | 자리·간격·여는 동안 (0.14.14) | **프레임 단위로 측정함** — 멈춘 상태 간격 8px, 여는 동안 4→8 로 벌어짐, 포커스 링 여유가 한 프레임도 음수가 아님 |
+| 열린 채 스크롤 (0.14.15) | **프레임 단위로 측정함** — 간격이 8px 에서 한 번도 안 흔들림(지연 없음), 헤더 침범 0.0px(경계에 닿되 안 넘음), 트리거가 29px 걸쳤을 때는 열려 있고 0 이 된 뒤 닫힘 |
 | 페이지(문서) 스크롤 시 안 닫힘 (0.14.7) | **확인 안 됨.** 규칙상 맞지만 그 조건의 화면에 고르개가 없어 볼 자리가 없었다 |
 | `Layout` 타입 (0.14.2) | 소비자 흉내 프로젝트로 타입 검사 통과 |
 | `ToggleChip` 커서·초점 테두리 | 마크업·CSS 만 확인. 눌러 본 사람 없음 |
@@ -398,6 +405,12 @@ export { Button, Input, Select, SideBar /* 쓰는 것만 */ } from "@x-plat/desi
 > `div[tabindex]` 라 마우스 클릭에는 `:focus-visible` 이 안 걸린다. 마우스로만
 > 열면 링이 아예 안 떠서 그 항목이 **늘 통과한다.**
 >
+> **읽는 시점이 화면보다 빠르면 그것도 거짓말이다.** 스크롤 뒤 32ms 만에
+> 읽었더니 헤더 침범이 −1.6 → −2.8 → −3.5 로 나왔고 끝까지 안 닫혔다.
+> `clip-path` 갱신과 `IntersectionObserver` 가 아직 안 돈 것이다. 120ms 로
+> 늘리니 침범 0, 제때 닫힘이었다. 재는 **범위**만이 아니라 **시점**도 맞아야
+> 한다.
+>
 > 확인할 때는 **배포가 앉은 뒤에** 볼 것. 한 번은 "안 닫힌다" 로 나왔다가
 > 다시 보니 닫혔다 — 반쯤 배포된 화면이었다. 그리고 버전 번호가 아니라
 > 받은 파일 안을 열어 확인하는 편이 낫다(0.14.1 은 번호만 올라가고 내용이

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@x-plat/design-system",
-  "version": "0.14.15",
+  "version": "0.14.16",
   "description": "XPLAT UI Design System",
   "author": "XPLAT WOONG",
   "main": "dist/index.cjs",