single-tab
Version:
A lightweight React library to detect and handle duplicate tabs in web applications
21 lines (20 loc) • 1.01 kB
JavaScript
import React from "react";
const SingleTabModal = ({ isOpen, content, style, }) => {
if (!isOpen)
return null; // Modal won't render if not open
return (React.createElement("div", { style: Object.assign({ position: "fixed", top: 0, left: 0, width: "100%", height: "100%", backgroundColor: "rgba(0, 0, 0, 0.5)", display: "flex", justifyContent: "center", alignItems: "center", zIndex: 9999 }, style), onKeyDown: (e) => {
if (e.key === "Escape") {
e.preventDefault(); // Block escape key functionality
}
}, tabIndex: -1 },
React.createElement("div", { style: {
backgroundColor: "#fff",
padding: "20px",
borderRadius: "8px",
boxShadow: "0px 4px 6px rgba(0, 0, 0, 0.1)",
maxWidth: "400px",
width: "90%", // Responsive width for smaller screens
textAlign: "center",
} }, content)));
};
export default SingleTabModal;