@codecademy/gamut 67.4.2-alpha.b3304f.0 → 67.4.2-alpha.c20997.0

package/dist/Tip/InfoTip/index.js

@@ -8,7 +8,15 @@ import { ScreenreaderNavigableText } from './elements';
 import { InfoTipButton } from './InfoTipButton';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const ARIA_HIDDEN_DELAY_MS = 1000;
-const MODAL_SELECTOR = 'dialog[open],[role="dialog"],[role="alertdialog"]';
+
+// Match native dialogs with open attribute, and role-based dialogs that aren't aria-hidden
+const MODAL_SELECTOR = 'dialog[open],[role="dialog"]:not([aria-hidden="true"]),[role="alertdialog"]:not([aria-hidden="true"])';
+
+// Check if an element is actually visible (not hidden via CSS)
+const isElementVisible = element => {
+  if (!(element instanceof HTMLElement)) return false;
+  return element.checkVisibility?.() ?? true;
+};
 export const InfoTip = ({
   alignment = 'top-right',
   emphasis = 'low',
@@ -105,7 +113,7 @@ export const InfoTip = ({
     const handleGlobalEscapeKey = e => {
       if (e.key !== 'Escape') return;
       const openModals = document.querySelectorAll(MODAL_SELECTOR);
-      const hasUnrelatedModal = Array.from(openModals).some(modal => wrapperRef.current && !modal.contains(wrapperRef.current));
+      const hasUnrelatedModal = Array.from(openModals).some(modal => isElementVisible(modal) && wrapperRef.current && !modal.contains(wrapperRef.current));
       if (hasUnrelatedModal) return;
       e.preventDefault();
       e.stopPropagation();

package/dist/Tip/__tests__/mocks.d.ts

@@ -5,6 +5,8 @@ import { ToolTipProps } from '../ToolTip';
 export declare const ToolTipMock: React.FC<ToolTipProps & ComponentProps<typeof FillButton>>;
 export declare const InfoTipInsideModalMock: React.FC<Pick<InfoTipProps, 'info' | 'placement'>>;
 export declare const MultipleInfoTipsMock: React.FC<{
-    tips: Array<Pick<InfoTipProps, 'info' | 'placement'>>;
+    tips: (Pick<InfoTipProps, 'info' | 'placement'> & {
+        id: string;
+    })[];
     includeOutsideElement?: boolean;
 }>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@codecademy/gamut",
   "description": "Styleguide & Component library for Codecademy",
-  "version": "67.4.2-alpha.b3304f.0",
+  "version": "67.4.2-alpha.c20997.0",
   "author": "Codecademy Engineering <dev@codecademy.com>",
   "dependencies": {
     "@codecademy/gamut-icons": "9.52.1",
@@ -56,5 +56,5 @@
     "dist/**/[A-Z]**/[A-Z]*.js",
     "dist/**/[A-Z]**/index.js"
   ],
-  "gitHead": "6b3b4d9e8f8c69654e70ccd8890133eb772cc86c"
+  "gitHead": "6d5c2b4a781352133e3aa27a072121c48895c896"
 }