@rufous/ui 0.2.77 → 0.2.79

package/dist/main.cjs

@@ -1528,6 +1528,7 @@ var React65 = __toESM(require("react"), 1);
 var import_react14 = require("react");
 var import_react_dom = __toESM(require("react-dom"), 1);
 var import_lucide_react = require("lucide-react");
+var DialogDepthContext = React65.createContext(0);
 var BaseDialog = ({
   open = false,
   onConfirm,
@@ -1561,6 +1562,21 @@ var BaseDialog = ({
   const { themeConfig } = useRufousTheme();
   const [isSubmitting, setIsSubmitting] = (0, import_react14.useState)(false);
   const sxClass = useSx(sx);
+  const depth = (0, import_react14.useContext)(DialogDepthContext);
+  const overlayZ = 2e3 + depth * 200;
+  const portalZ = overlayZ + 100;
+  (0, import_react14.useEffect)(() => {
+    if (!open) return;
+    const el = document.documentElement;
+    const prev = el.style.getPropertyValue("--rf-dialog-portal-z");
+    const prevVal = parseInt(prev || "0");
+    if (portalZ > prevVal) {
+      el.style.setProperty("--rf-dialog-portal-z", String(portalZ));
+    }
+    return () => {
+      el.style.setProperty("--rf-dialog-portal-z", prev || "");
+    };
+  }, [open, portalZ]);
   if (!open && !TransitionComponent) return null;
   const isButtonLoading = isSubmitting || loading;
   const renderButtons = () => /* @__PURE__ */ React65.createElement(React65.Fragment, null, showCancelButton && /* @__PURE__ */ React65.createElement(
@@ -1629,6 +1645,14 @@ var BaseDialog = ({
     },
     dialogInner
   ) : /* @__PURE__ */ React65.createElement("div", { className: containerClass, style: containerStyle }, dialogInner);
+  const overlayNode = (content) => /* @__PURE__ */ React65.createElement(
+    "div",
+    {
+      className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}`,
+      style: { zIndex: overlayZ }
+    },
+    /* @__PURE__ */ React65.createElement(DialogDepthContext.Provider, { value: depth + 1 }, content)
+  );
   if (TransitionComponent) {
     return import_react_dom.default.createPortal(
       /* @__PURE__ */ React65.createElement(
@@ -1641,13 +1665,13 @@ var BaseDialog = ({
             TransitionProps?.onExited?.();
           }
         },
-        /* @__PURE__ */ React65.createElement("div", { className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}` }, dialogContent)
+        overlayNode(dialogContent)
       ),
       document.body
     );
   }
   return import_react_dom.default.createPortal(
-    /* @__PURE__ */ React65.createElement("div", { className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}` }, dialogContent),
+    overlayNode(dialogContent),
     document.body
   );
 };
@@ -1903,12 +1927,6 @@ var AddressLookup = ({
   const [suggestions, setSuggestions] = (0, import_react18.useState)([]);
   const [loading, setLoading] = (0, import_react18.useState)(false);
   const [showSuggestions, setShowSuggestions] = (0, import_react18.useState)(false);
-  const [googleFields, setGoogleFields] = (0, import_react18.useState)({
-    country: false,
-    state: false,
-    city: false,
-    pincode: false
-  });
   const debounceTimeout = (0, import_react18.useRef)(null);
   const containerRef = (0, import_react18.useRef)(null);
   const apiKey = token || "";
@@ -1924,16 +1942,6 @@ var AddressLookup = ({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  (0, import_react18.useEffect)(() => {
-    if (value.country || value.state || value.city || value.pincode) {
-      setGoogleFields({
-        country: !!value.country,
-        state: !!value.state,
-        city: !!value.city,
-        pincode: !!value.pincode
-      });
-    }
-  }, []);
   (0, import_react18.useEffect)(() => {
     if (value.country) {
       const country = countries.find((c) => c.name === value.country);
@@ -1994,12 +2002,6 @@ var AddressLookup = ({
       const state = findComp("administrative_area_level_1");
       const country = findComp("country");
       const pincode = findComp("postal_code");
-      setGoogleFields({
-        country: !!country,
-        state: !!state,
-        city: !!city,
-        pincode: !!pincode
-      });
       const updatedData = {
         ...value,
         addressLine1: mainText || value.addressLine1,
@@ -2050,7 +2052,6 @@ var AddressLookup = ({
       state: "",
       city: ""
     });
-    setGoogleFields({ ...googleFields, country: false, state: false, city: false });
   };
   const handleStateChange = (newState) => {
     onChange({
@@ -2082,7 +2083,6 @@ var AddressLookup = ({
           });
           setSuggestions([]);
           setShowSuggestions(false);
-          setGoogleFields({ country: false, state: false, city: false, pincode: false });
         } else {
           if (debounceTimeout.current) clearTimeout(debounceTimeout.current);
           debounceTimeout.current = setTimeout(() => {
@@ -2131,8 +2131,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.country || "",
       required,
-      className: googleFields.country && value.country ? "field-disabled" : "",
-      readOnly: googleFields.country && !!value.country,
       onChange: (e) => handleCountryChange(e.target.value),
       list: "countries-list"
     }
@@ -2144,9 +2142,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.state || "",
       required,
-      disabled: !value.country,
-      className: googleFields.state && value.state ? "field-disabled" : "",
-      readOnly: googleFields.state && !!value.state,
       onChange: (e) => handleStateChange(e.target.value),
       list: "states-list"
     }
@@ -2158,9 +2153,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.city || "",
       required,
-      disabled: !value.state,
-      className: googleFields.city && value.city ? "field-disabled" : "",
-      readOnly: googleFields.city && !!value.city,
       onChange: (e) => handleChange("city", e.target.value),
       list: "cities-list"
     }
@@ -2172,8 +2164,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.pincode || "",
       required,
-      className: googleFields.pincode && value.pincode ? "field-disabled" : "",
-      readOnly: googleFields.pincode && !!value.pincode,
       onChange: (e) => handleChange("pincode", e.target.value)
     }
   ), error.pincode && /* @__PURE__ */ import_react18.default.createElement("div", { className: "field-error-text" }, error.pincode))));

package/dist/main.css

@@ -83,7 +83,7 @@
 .p-treeselect-panel,
 .MuiModal-root:not(.dialog-overlay),
 .rf-table-toolbar {
-  z-index: 2100 !important;
+  z-index: var(--rf-dialog-portal-z, 2100) !important;
 }
 .dialog-container {
   background: var(--surface-color);
@@ -1069,7 +1069,6 @@ pre {
 .autocomplete-option {
   padding: 10px 14px;
   cursor: pointer;
-  border-bottom: 1px solid var(--border-color, #f0f0f0);
 }
 .autocomplete-option:last-child {
   border-bottom: none;
@@ -1079,11 +1078,11 @@ pre {
 }
 .autocomplete-main-text {
   font-weight: 600;
-  font-size: 0.95em;
+  font-size: 0.8em;
   color: var(--text-color, #333);
 }
 .autocomplete-secondary-text {
-  font-size: 0.85em;
+  font-size: 0.75em;
   color: var(--text-secondary, #666);
 }
 .loading-indicator {
@@ -1094,10 +1093,6 @@ pre {
   display: flex;
   align-items: center;
 }
-.field-disabled {
-  background-color: var(--hover-color, #f0f0f0);
-  cursor: not-allowed;
-}
 .field-error-text {
   color: #dc2626;
   font-size: 0.75rem;

package/dist/main.js

@@ -1353,9 +1353,10 @@ IconButton.displayName = "IconButton";
 
 // lib/Dialogs/BaseDialog.tsx
 import * as React65 from "react";
-import { useState as useState2 } from "react";
+import { useState as useState2, useContext, useEffect as useEffect2 } from "react";
 import ReactDOM from "react-dom";
 import { X } from "lucide-react";
+var DialogDepthContext = React65.createContext(0);
 var BaseDialog = ({
   open = false,
   onConfirm,
@@ -1389,6 +1390,21 @@ var BaseDialog = ({
   const { themeConfig } = useRufousTheme();
   const [isSubmitting, setIsSubmitting] = useState2(false);
   const sxClass = useSx(sx);
+  const depth = useContext(DialogDepthContext);
+  const overlayZ = 2e3 + depth * 200;
+  const portalZ = overlayZ + 100;
+  useEffect2(() => {
+    if (!open) return;
+    const el = document.documentElement;
+    const prev = el.style.getPropertyValue("--rf-dialog-portal-z");
+    const prevVal = parseInt(prev || "0");
+    if (portalZ > prevVal) {
+      el.style.setProperty("--rf-dialog-portal-z", String(portalZ));
+    }
+    return () => {
+      el.style.setProperty("--rf-dialog-portal-z", prev || "");
+    };
+  }, [open, portalZ]);
   if (!open && !TransitionComponent) return null;
   const isButtonLoading = isSubmitting || loading;
   const renderButtons = () => /* @__PURE__ */ React65.createElement(React65.Fragment, null, showCancelButton && /* @__PURE__ */ React65.createElement(
@@ -1457,6 +1473,14 @@ var BaseDialog = ({
     },
     dialogInner
   ) : /* @__PURE__ */ React65.createElement("div", { className: containerClass, style: containerStyle }, dialogInner);
+  const overlayNode = (content) => /* @__PURE__ */ React65.createElement(
+    "div",
+    {
+      className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}`,
+      style: { zIndex: overlayZ }
+    },
+    /* @__PURE__ */ React65.createElement(DialogDepthContext.Provider, { value: depth + 1 }, content)
+  );
   if (TransitionComponent) {
     return ReactDOM.createPortal(
       /* @__PURE__ */ React65.createElement(
@@ -1469,13 +1493,13 @@ var BaseDialog = ({
             TransitionProps?.onExited?.();
           }
         },
-        /* @__PURE__ */ React65.createElement("div", { className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}` }, dialogContent)
+        overlayNode(dialogContent)
       ),
       document.body
     );
   }
   return ReactDOM.createPortal(
-    /* @__PURE__ */ React65.createElement("div", { className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}` }, dialogContent),
+    overlayNode(dialogContent),
     document.body
   );
 };
@@ -1483,13 +1507,13 @@ var BaseDialog_default = BaseDialog;
 
 // lib/Contexts/rufousThemeProvider.tsx
 import React66, {
-  createContext,
-  useContext,
-  useEffect as useEffect2,
+  createContext as createContext2,
+  useContext as useContext2,
+  useEffect as useEffect3,
   useMemo,
   useState as useState3
 } from "react";
-var RufousThemeContext = createContext(null);
+var RufousThemeContext = createContext2(null);
 var RufousThemeProvider = ({ children }) => {
   const [committedThemeKey, setCommittedThemeKey] = useState3("default");
   const [previewThemeKey, setPreviewThemeKey] = useState3("default");
@@ -1503,7 +1527,7 @@ var RufousThemeProvider = ({ children }) => {
       console.error("Error fetching general settings:", err);
     }
   };
-  useEffect2(() => {
+  useEffect3(() => {
     getGeneralSettings();
   }, []);
   const fullTheme = useMemo(() => {
@@ -1542,7 +1566,7 @@ var RufousThemeProvider = ({ children }) => {
     )
   );
 };
-var useRufousTheme = () => useContext(RufousThemeContext);
+var useRufousTheme = () => useContext2(RufousThemeContext);
 
 // lib/CheckBoxes/CheckBox.jsx
 import React67 from "react";
@@ -1718,7 +1742,7 @@ var TextField = forwardRef3(({
 TextField.displayName = "TextField";
 
 // lib/TextFields/AddressLookup.tsx
-import React69, { useState as useState4, useRef as useRef3, useEffect as useEffect3 } from "react";
+import React69, { useState as useState4, useRef as useRef3, useEffect as useEffect4 } from "react";
 import Axios from "axios";
 import { Country, State, City } from "country-state-city";
 var AddressLookup = ({
@@ -1737,19 +1761,13 @@ var AddressLookup = ({
   const [suggestions, setSuggestions] = useState4([]);
   const [loading, setLoading] = useState4(false);
   const [showSuggestions, setShowSuggestions] = useState4(false);
-  const [googleFields, setGoogleFields] = useState4({
-    country: false,
-    state: false,
-    city: false,
-    pincode: false
-  });
   const debounceTimeout = useRef3(null);
   const containerRef = useRef3(null);
   const apiKey = token || "";
   const countries = Country.getAllCountries();
   const [states, setStates] = useState4([]);
   const [cities, setCities] = useState4([]);
-  useEffect3(() => {
+  useEffect4(() => {
     const handleClickOutside = (event) => {
       if (containerRef.current && !containerRef.current.contains(event.target)) {
         setShowSuggestions(false);
@@ -1758,17 +1776,7 @@ var AddressLookup = ({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect3(() => {
-    if (value.country || value.state || value.city || value.pincode) {
-      setGoogleFields({
-        country: !!value.country,
-        state: !!value.state,
-        city: !!value.city,
-        pincode: !!value.pincode
-      });
-    }
-  }, []);
-  useEffect3(() => {
+  useEffect4(() => {
     if (value.country) {
       const country = countries.find((c) => c.name === value.country);
       if (country) {
@@ -1781,7 +1789,7 @@ var AddressLookup = ({
       setStates([]);
     }
   }, [value.country]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (value.state && value.country) {
       const country = countries.find((c) => c.name === value.country);
       if (country) {
@@ -1828,12 +1836,6 @@ var AddressLookup = ({
       const state = findComp("administrative_area_level_1");
       const country = findComp("country");
       const pincode = findComp("postal_code");
-      setGoogleFields({
-        country: !!country,
-        state: !!state,
-        city: !!city,
-        pincode: !!pincode
-      });
       const updatedData = {
         ...value,
         addressLine1: mainText || value.addressLine1,
@@ -1884,7 +1886,6 @@ var AddressLookup = ({
       state: "",
       city: ""
     });
-    setGoogleFields({ ...googleFields, country: false, state: false, city: false });
   };
   const handleStateChange = (newState) => {
     onChange({
@@ -1916,7 +1917,6 @@ var AddressLookup = ({
           });
           setSuggestions([]);
           setShowSuggestions(false);
-          setGoogleFields({ country: false, state: false, city: false, pincode: false });
         } else {
           if (debounceTimeout.current) clearTimeout(debounceTimeout.current);
           debounceTimeout.current = setTimeout(() => {
@@ -1965,8 +1965,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.country || "",
       required,
-      className: googleFields.country && value.country ? "field-disabled" : "",
-      readOnly: googleFields.country && !!value.country,
       onChange: (e) => handleCountryChange(e.target.value),
       list: "countries-list"
     }
@@ -1978,9 +1976,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.state || "",
       required,
-      disabled: !value.country,
-      className: googleFields.state && value.state ? "field-disabled" : "",
-      readOnly: googleFields.state && !!value.state,
       onChange: (e) => handleStateChange(e.target.value),
       list: "states-list"
     }
@@ -1992,9 +1987,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.city || "",
       required,
-      disabled: !value.state,
-      className: googleFields.city && value.city ? "field-disabled" : "",
-      readOnly: googleFields.city && !!value.city,
       onChange: (e) => handleChange("city", e.target.value),
       list: "cities-list"
     }
@@ -2006,8 +1998,6 @@ var AddressLookup = ({
       fullWidth: true,
       value: value.pincode || "",
       required,
-      className: googleFields.pincode && value.pincode ? "field-disabled" : "",
-      readOnly: googleFields.pincode && !!value.pincode,
       onChange: (e) => handleChange("pincode", e.target.value)
     }
   ), error.pincode && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.pincode))));
@@ -2018,7 +2008,7 @@ var AddressLookup_default = AddressLookup;
 import React70, {
   useState as useState5,
   useRef as useRef4,
-  useEffect as useEffect4,
+  useEffect as useEffect5,
   useCallback
 } from "react";
 import { createPortal } from "react-dom";
@@ -2179,13 +2169,13 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
   const virtualItems = infinite ? Array(MULTIPLIER).fill(items).flat() : items;
   const centerOffset = infinite ? Math.floor(MULTIPLIER / 2) * items.length : 0;
   const VISUAL_OFFSET = 54;
-  useEffect4(() => {
+  useEffect5(() => {
     if (listRef.current) {
       const targetIndex = centerOffset + selected;
       listRef.current.scrollTop = targetIndex * ITEM_H - (infinite ? VISUAL_OFFSET : 0);
     }
   }, [centerOffset, infinite, selected]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (listRef.current && !isInternalScroll.current) {
       const targetIndex = centerOffset + selected;
       listRef.current.scrollTo({
@@ -2437,7 +2427,7 @@ var DateField = ({
   const pickerRef = useRef4(null);
   const [dropUp, setDropUp] = useState5(false);
   const inputId = useRef4(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
-  useEffect4(() => {
+  useEffect5(() => {
     if (value === void 0) return;
     if (!value) {
       setSelectedDate(null);
@@ -2460,7 +2450,7 @@ var DateField = ({
       setInputStr(str);
     }
   }, [value, type]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!open) return;
     const handler = (e) => {
       const target = e.target;
@@ -2471,7 +2461,7 @@ var DateField = ({
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!open || !containerRef.current) return;
     const rect = containerRef.current.getBoundingClientRect();
     const spaceBelow = window.innerHeight - rect.bottom;
@@ -2766,7 +2756,7 @@ DateField.displayName = "DateField";
 import React71, {
   useState as useState6,
   useRef as useRef5,
-  useEffect as useEffect5
+  useEffect as useEffect6
 } from "react";
 var WEEKDAYS2 = ["SU", "MO", "TU", "WE", "TH", "FR", "SA"];
 var MONTHS2 = [
@@ -3062,7 +3052,7 @@ var DateRangeField = ({
   const [leftViewMonth, setLeftViewMonth] = useState6(() => today2.getMonth());
   const containerRef = useRef5(null);
   const inputId = useRef5(`rf-dr-${Math.random().toString(36).substr(2, 9)}`).current;
-  useEffect5(() => {
+  useEffect6(() => {
     const s2 = value?.start ? isoToDate2(value.start) : null;
     const e = value?.end ? isoToDate2(value.end) : null;
     setDraftStart(s2);
@@ -3071,10 +3061,10 @@ var DateRangeField = ({
     setEndInputStr(e ? formatShort(e) : "");
     setActivePreset(detectPreset(s2, e));
   }, [value?.start, value?.end]);
-  useEffect5(() => {
+  useEffect6(() => {
     setActivePreset(detectPreset(draftStart, draftEnd));
   }, [draftStart?.getTime(), draftEnd?.getTime()]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!open) return;
     const handler = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -3419,7 +3409,7 @@ DateRangeField.displayName = "DateRangeField";
 import React72, {
   useState as useState7,
   useRef as useRef6,
-  useEffect as useEffect6,
+  useEffect as useEffect7,
   useCallback as useCallback2
 } from "react";
 import ReactDOM2 from "react-dom";
@@ -3540,7 +3530,7 @@ function AutocompleteInner(props, _ref) {
       onInputChange?.("");
     }
   }, [freeSolo, multiple, value, onInputChange, onClose]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!open) return;
     const handleOutside = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -3556,7 +3546,7 @@ function AutocompleteInner(props, _ref) {
       window.removeEventListener("resize", calcPopupStyle);
     };
   }, [open, closePopup, calcPopupStyle]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (controlledInput !== void 0) return;
     if (!multiple) {
       const v = value;
@@ -3831,7 +3821,7 @@ var RufousLogoLoader = ({ size = 80, sx, className }) => {
 };
 
 // lib/DataGrid/DataGrid.tsx
-import React74, { useState as useState8, useMemo as useMemo2, useRef as useRef8, useEffect as useEffect7 } from "react";
+import React74, { useState as useState8, useMemo as useMemo2, useRef as useRef8, useEffect as useEffect8 } from "react";
 import {
   ChevronUp,
   ChevronDown,
@@ -3947,7 +3937,7 @@ function DataGrid({
     { column: initialFilterCol, operator: getDefaultOperator(initialColumnsProp[0]?.type), value: "", logic: "AND" }
   ]);
   const [colSearch, setColSearch] = useState8("");
-  useEffect7(() => {
+  useEffect8(() => {
     const handleMouseMove = (e) => {
       if (!resizingColumn) return;
       const col = resolvedColumns.find((c) => String(c.field) === resizingColumn);
@@ -3967,7 +3957,7 @@ function DataGrid({
       document.removeEventListener("mouseup", handleMouseUp);
     };
   }, [resizingColumn, startX, startWidth, resolvedColumns]);
-  useEffect7(() => {
+  useEffect8(() => {
     const handleClickOutside = (e) => {
       if (menuRef.current && !menuRef.current.contains(e.target)) {
         setActiveMenu(null);
@@ -3976,7 +3966,7 @@ function DataGrid({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect7(() => {
+  useEffect8(() => {
     setColumnWidths((prev) => {
       const next = { ...prev };
       initialColumnsProp.forEach((col) => {
@@ -4490,7 +4480,7 @@ function DataGrid({
 import React75, {
   useState as useState9,
   useRef as useRef9,
-  useEffect as useEffect8,
+  useEffect as useEffect9,
   useCallback as useCallback3
 } from "react";
 import ReactDOM3 from "react-dom";
@@ -4557,7 +4547,7 @@ var Select = React75.forwardRef(function Select2(props, ref) {
     if (open) closePopup();
     else openPopup();
   }, [open, openPopup, closePopup]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (!open) return;
     const handleOutside = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -4728,7 +4718,7 @@ Select.displayName = "Select";
 import React76, {
   useState as useState10,
   useRef as useRef10,
-  useEffect as useEffect9,
+  useEffect as useEffect10,
   useCallback as useCallback4
 } from "react";
 function clamp(val, min, max) {
@@ -4787,7 +4777,7 @@ var Slider = React76.forwardRef(function Slider2(props, ref) {
     const raw = min + ratio * (max - min);
     return clamp(snapToStep(raw, min, step), min, max);
   }, [min, max, step, orientation]);
-  useEffect9(() => {
+  useEffect10(() => {
     if (dragging === null) return;
     const onMove = (e) => {
       const newVal = getValueFromPointer(e);
@@ -4997,10 +4987,10 @@ var Switch = React77.forwardRef(function Switch2(props, ref) {
 Switch.displayName = "Switch";
 
 // lib/RadioGroup/RadioGroup.tsx
-import React78, { useRef as useRef12, createContext as createContext2, useContext as useContext2 } from "react";
-var RadioGroupContext = createContext2({});
+import React78, { useRef as useRef12, createContext as createContext3, useContext as useContext3 } from "react";
+var RadioGroupContext = createContext3({});
 var Radio = React78.forwardRef(function Radio2(props, ref) {
-  const ctx = useContext2(RadioGroupContext);
+  const ctx = useContext3(RadioGroupContext);
   const {
     value,
     label,
@@ -5257,13 +5247,13 @@ Rating.displayName = "Rating";
 
 // lib/ToggleButton/ToggleButton.tsx
 import React80, {
-  createContext as createContext3,
-  useContext as useContext3
+  createContext as createContext4,
+  useContext as useContext4
 } from "react";
-var ToggleGroupContext = createContext3({});
+var ToggleGroupContext = createContext4({});
 var ToggleButton = React80.forwardRef(
   function ToggleButton2(props, ref) {
-    const ctx = useContext3(ToggleGroupContext);
+    const ctx = useContext4(ToggleGroupContext);
     const { value, children, disabled: disabledProp, selected: selectedProp, sx } = props;
     const sxClass = useSx(sx);
     let isSelected = false;
@@ -5889,7 +5879,7 @@ Skeleton.displayName = "Skeleton";
 // lib/Tooltip/Tooltip.tsx
 import React87, {
   useCallback as useCallback5,
-  useEffect as useEffect10,
+  useEffect as useEffect11,
   useRef as useRef14,
   useState as useState13
 } from "react";
@@ -6022,7 +6012,7 @@ var Tooltip = ({
       setPosition(computePosition(anchorRect, tooltipRect, placement));
     }
   }, [placement, followCursor]);
-  useEffect10(() => {
+  useEffect11(() => {
     if (isOpen) {
       requestAnimationFrame(() => {
         updatePosition();
@@ -6058,7 +6048,7 @@ var Tooltip = ({
     },
     [isOpen, followCursor, updatePosition]
   );
-  useEffect10(() => {
+  useEffect11(() => {
     return () => clearTimers();
   }, [clearTimers]);
   const childProps = {};
@@ -6448,8 +6438,8 @@ CardActions.displayName = "CardActions";
 
 // lib/Accordion/Accordion.tsx
 import * as React93 from "react";
-import { useState as useState14, useContext as useContext4, createContext as createContext4 } from "react";
-var AccordionContext = createContext4({
+import { useState as useState14, useContext as useContext5, createContext as createContext5 } from "react";
+var AccordionContext = createContext5({
   expanded: false,
   disabled: false,
   toggle: () => {
@@ -6513,7 +6503,7 @@ var ChevronIcon = () => /* @__PURE__ */ React93.createElement(
 var AccordionSummary = React93.forwardRef(
   ({ expandIcon, children, sx, className, style, ...rest }, ref) => {
     const sxClass = useSx(sx);
-    const { expanded, toggle, disabled } = useContext4(AccordionContext);
+    const { expanded, toggle, disabled } = useContext5(AccordionContext);
     const classes = [
       "rf-accordion-summary",
       expanded ? "rf-accordion-summary-expanded" : "",
@@ -6545,7 +6535,7 @@ AccordionSummary.displayName = "AccordionSummary";
 var AccordionDetails = React93.forwardRef(
   ({ children, sx, className, style, ...rest }, ref) => {
     const sxClass = useSx(sx);
-    const { expanded } = useContext4(AccordionContext);
+    const { expanded } = useContext5(AccordionContext);
     const wrapperClasses = [
       "rf-accordion-details-wrapper",
       expanded ? "rf-accordion-details-wrapper-open" : ""
@@ -6562,7 +6552,7 @@ AccordionDetails.displayName = "AccordionDetails";
 
 // lib/Tabs/Tabs.tsx
 import React94, {
-  useEffect as useEffect11,
+  useEffect as useEffect12,
   useLayoutEffect,
   useRef as useRef15,
   useState as useState15,
@@ -6655,7 +6645,7 @@ var Tabs = ({
   useLayoutEffect(() => {
     updateIndicator();
   }, [value, orientation]);
-  useEffect11(() => {
+  useEffect12(() => {
     const observer = new ResizeObserver(() => {
       updateIndicator();
     });
@@ -7014,7 +7004,7 @@ Stepper.displayName = "Stepper";
 
 // lib/Menu/Menu.tsx
 import React97, {
-  useEffect as useEffect12,
+  useEffect as useEffect13,
   useRef as useRef16,
   useState as useState17
 } from "react";
@@ -7111,12 +7101,12 @@ var Menu = ({
   const paperRef = useRef16(null);
   const [menuStyle, setMenuStyle] = useState17({});
   const [mounted, setMounted] = useState17(false);
-  useEffect12(() => {
+  useEffect13(() => {
     if (open) {
       setMounted(true);
     }
   }, [open]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!open || !anchorEl || !paperRef.current) return;
     const computePosition3 = () => {
       if (!anchorEl || !paperRef.current) return;
@@ -7142,7 +7132,7 @@ var Menu = ({
     };
     requestAnimationFrame(computePosition3);
   }, [open, mounted, anchorEl, anchorOrigin, transformOrigin]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!open) return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") {
@@ -7177,7 +7167,7 @@ Menu.displayName = "Menu";
 
 // lib/Drawer/Drawer.tsx
 import React98, {
-  useEffect as useEffect13,
+  useEffect as useEffect14,
   useState as useState18
 } from "react";
 import ReactDOM6 from "react-dom";
@@ -7197,7 +7187,7 @@ var Drawer = ({
   const sxClass = useSx(sx);
   const paperSxClass = useSx(PaperProps?.sx);
   const [mounted, setMounted] = useState18(open || variant === "permanent" || keepMounted);
-  useEffect13(() => {
+  useEffect14(() => {
     if (open || variant === "permanent") {
       setMounted(true);
     } else if (!keepMounted) {
@@ -7205,7 +7195,7 @@ var Drawer = ({
       return () => clearTimeout(t);
     }
   }, [open, variant, keepMounted]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (!open || variant === "permanent") return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") onClose?.();
@@ -7213,7 +7203,7 @@ var Drawer = ({
     document.addEventListener("keydown", handleKeyDown);
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [open, variant, onClose]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (variant !== "temporary") return;
     if (open) {
       const prev = document.body.style.overflow;
@@ -7290,7 +7280,7 @@ Drawer.displayName = "Drawer";
 // lib/Snackbar/Snackbar.tsx
 import React99, {
   useCallback as useCallback6,
-  useEffect as useEffect14,
+  useEffect as useEffect15,
   useRef as useRef17,
   useState as useState19
 } from "react";
@@ -7331,7 +7321,7 @@ var Snackbar = ({
       onClose("timeout");
     }, autoHideDuration);
   }, [autoHideDuration, onClose, clearTimers]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (open) {
       setMounted(true);
       setTransitionState("entering");
@@ -7347,7 +7337,7 @@ var Snackbar = ({
     }
     return clearTimers;
   }, [open, startHideTimer, clearTimers]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!open) return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") onClose?.("escapeKeyDown");
@@ -7453,7 +7443,7 @@ Link.displayName = "Link";
 
 // lib/Popper/Popper.tsx
 import React101, {
-  useEffect as useEffect15,
+  useEffect as useEffect16,
   useLayoutEffect as useLayoutEffect2,
   useRef as useRef18,
   useState as useState20
@@ -7542,7 +7532,7 @@ var Popper = ({
   const [fadeState, setFadeState] = useState20(
     open ? "entered" : "exited"
   );
-  useEffect15(() => {
+  useEffect16(() => {
     if (open) {
       setMounted(true);
       setFadeState("entering");
@@ -7607,7 +7597,7 @@ Popper.displayName = "Popper";
 
 // lib/Popover/Popover.tsx
 import React102, {
-  useEffect as useEffect16,
+  useEffect as useEffect17,
   useLayoutEffect as useLayoutEffect3,
   useRef as useRef19,
   useState as useState21
@@ -7642,7 +7632,7 @@ var Popover = ({
   const paperRef = useRef19(null);
   const [posStyle, setPosStyle] = useState21({});
   const [mounted, setMounted] = useState21(open || keepMounted);
-  useEffect16(() => {
+  useEffect17(() => {
     if (open) {
       setMounted(true);
     } else if (!keepMounted) {
@@ -7674,7 +7664,7 @@ var Popover = ({
       window.removeEventListener("resize", compute);
     };
   }, [open, anchorEl, anchorOrigin, transformOrigin, mounted]);
-  useEffect16(() => {
+  useEffect17(() => {
     if (!open) return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") onClose?.();
@@ -7725,7 +7715,7 @@ Popover.displayName = "Popover";
 // lib/Transitions/Transitions.tsx
 import React103, {
   cloneElement as cloneElement3,
-  useEffect as useEffect17,
+  useEffect as useEffect18,
   useRef as useRef20,
   useState as useState22
 } from "react";
@@ -7739,7 +7729,7 @@ function useTransitionState(inProp, timeout, onEnter, onExited) {
   const [mounted, setMounted] = useState22(false);
   const timerRef = useRef20(null);
   const isFirstRender = useRef20(true);
-  useEffect17(() => {
+  useEffect18(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
     if (inProp) {
       setMounted(true);
@@ -7886,7 +7876,7 @@ var Collapse = ({
   const [size, setSize] = useState22(
     inProp ? "auto" : collapsedSize
   );
-  useEffect17(() => {
+  useEffect18(() => {
     if (!innerRef.current) return;
     const natural = orientation === "vertical" ? innerRef.current.scrollHeight : innerRef.current.scrollWidth;
     if (inProp) {
@@ -8072,7 +8062,7 @@ ImageField.displayName = "ImageField";
 import React105, {
   useState as useState24,
   useRef as useRef22,
-  useEffect as useEffect18,
+  useEffect as useEffect19,
   useCallback as useCallback8,
   forwardRef as forwardRef10
 } from "react";
@@ -8148,7 +8138,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
   const [focusedIdx, setFocusedIdx] = useState24(-1);
   const [search, setSearch] = useState24("");
   const prevValueRef = useRef22(value);
-  useEffect18(() => {
+  useEffect19(() => {
     if (value === prevValueRef.current) return;
     prevValueRef.current = value;
     const digits2 = sanitizeValue(value);
@@ -8172,7 +8162,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
     setFocusedIdx(-1);
     setSearch("");
   }, []);
-  useEffect18(() => {
+  useEffect19(() => {
     if (!open) return;
     const handler = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -8182,7 +8172,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open, closeDropdown]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (!open || !containerRef.current || !popupRef.current) return;
     const reference = containerRef.current;
     const floating = popupRef.current;
@@ -8376,7 +8366,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
 PhoneField.displayName = "PhoneField";
 
 // lib/RufousTextEditor/RufousTextEditor.tsx
-import React116, { useMemo as useMemo4, useCallback as useCallback13, useState as useState34, useRef as useRef30, useEffect as useEffect27 } from "react";
+import React116, { useMemo as useMemo4, useCallback as useCallback13, useState as useState34, useRef as useRef30, useEffect as useEffect28 } from "react";
 import { createPortal as createPortal8 } from "react-dom";
 import { useEditor, EditorContent, EditorContext, FloatingMenu, BubbleMenu } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
@@ -8402,7 +8392,7 @@ import { ReactRenderer } from "@tiptap/react";
 import tippy from "tippy.js";
 
 // lib/RufousTextEditor/MentionList.tsx
-import React106, { forwardRef as forwardRef11, useEffect as useEffect19, useImperativeHandle, useState as useState25 } from "react";
+import React106, { forwardRef as forwardRef11, useEffect as useEffect20, useImperativeHandle, useState as useState25 } from "react";
 var MentionList = forwardRef11((props, ref) => {
   const [selectedIndex, setSelectedIndex] = useState25(0);
   const selectItem = (index) => {
@@ -8411,7 +8401,7 @@ var MentionList = forwardRef11((props, ref) => {
       props.command({ id: item.id, label: item.shortName || item.name });
     }
   };
-  useEffect19(() => setSelectedIndex(0), [props.items]);
+  useEffect20(() => setSelectedIndex(0), [props.items]);
   useImperativeHandle(ref, () => ({
     onKeyDown: ({ event }) => {
       if (event.key === "ArrowUp") {
@@ -8498,11 +8488,11 @@ function createMentionSuggestion(users) {
 }
 
 // lib/RufousTextEditor/Toolbar.tsx
-import React112, { useState as useState30, useRef as useRef26, useEffect as useEffect23, useCallback as useCallback12 } from "react";
+import React112, { useState as useState30, useRef as useRef26, useEffect as useEffect24, useCallback as useCallback12 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 
 // lib/RufousTextEditor/TextToSpeech.tsx
-import React107, { useState as useState26, useEffect as useEffect20, useRef as useRef23, useCallback as useCallback9, forwardRef as forwardRef12, useImperativeHandle as useImperativeHandle2 } from "react";
+import React107, { useState as useState26, useEffect as useEffect21, useRef as useRef23, useCallback as useCallback9, forwardRef as forwardRef12, useImperativeHandle as useImperativeHandle2 } from "react";
 var TextToSpeech = forwardRef12(({ editor, onTextToSpeech }, ref) => {
   const [speaking, setSpeaking] = useState26(false);
   const [paused, setPaused] = useState26(false);
@@ -8512,7 +8502,7 @@ var TextToSpeech = forwardRef12(({ editor, onTextToSpeech }, ref) => {
   const [showPanel, setShowPanel] = useState26(false);
   const utteranceRef = useRef23(null);
   const panelRef = useRef23(null);
-  useEffect20(() => {
+  useEffect21(() => {
     const synth = window.speechSynthesis;
     const loadVoices = () => {
       const available = synth.getVoices();
@@ -8530,7 +8520,7 @@ var TextToSpeech = forwardRef12(({ editor, onTextToSpeech }, ref) => {
       synth.removeEventListener("voiceschanged", loadVoices);
     };
   }, [selectedVoice]);
-  useEffect20(() => {
+  useEffect21(() => {
     const handleClick = (e) => {
       if (panelRef.current && !panelRef.current.contains(e.target)) {
         setShowPanel(false);
@@ -8648,7 +8638,7 @@ var TextToSpeech = forwardRef12(({ editor, onTextToSpeech }, ref) => {
 var TextToSpeech_default = TextToSpeech;
 
 // lib/RufousTextEditor/SpeechToText.tsx
-import React108, { useState as useState27, useRef as useRef24, useCallback as useCallback10, useEffect as useEffect21, forwardRef as forwardRef13, useImperativeHandle as useImperativeHandle3 } from "react";
+import React108, { useState as useState27, useRef as useRef24, useCallback as useCallback10, useEffect as useEffect22, forwardRef as forwardRef13, useImperativeHandle as useImperativeHandle3 } from "react";
 var SpeechToText = forwardRef13(({ editor, onSpeechToText }, ref) => {
   const [listening, setListening] = useState27(false);
   const [showPanel, setShowPanel] = useState27(false);
@@ -8659,7 +8649,7 @@ var SpeechToText = forwardRef13(({ editor, onSpeechToText }, ref) => {
   const isListeningRef = useRef24(false);
   const SpeechRecognitionAPI = typeof window !== "undefined" ? window.SpeechRecognition || window.webkitSpeechRecognition : null;
   const supported = !!SpeechRecognitionAPI;
-  useEffect21(() => {
+  useEffect22(() => {
     const handleClick = (e) => {
       if (panelRef.current && !panelRef.current.contains(e.target)) {
         setShowPanel(false);
@@ -8811,7 +8801,7 @@ var SpeechToText = forwardRef13(({ editor, onSpeechToText }, ref) => {
 var SpeechToText_default = SpeechToText;
 
 // lib/RufousTextEditor/AICommands.tsx
-import React109, { useState as useState28, useRef as useRef25, useEffect as useEffect22, useCallback as useCallback11 } from "react";
+import React109, { useState as useState28, useRef as useRef25, useEffect as useEffect23, useCallback as useCallback11 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 var AI_COMMANDS = [
   { id: "improve", label: "Improve writing", prompt: "Improve the following text to make it clearer, more engaging, and well-structured. Return only the improved text, no explanations." },
@@ -8868,7 +8858,7 @@ var AICommands = ({ editor, onAICommand }) => {
   const [selectionRange, setSelectionRange] = useState28(null);
   const [previousResults, setPreviousResults] = useState28([]);
   const panelRef = useRef25(null);
-  useEffect22(() => {
+  useEffect23(() => {
     const handleClick = (e) => {
       if (panelRef.current && !panelRef.current.contains(e.target)) {
         setOpen(false);
@@ -10071,7 +10061,7 @@ var Dropdown = ({ trigger, children, className = "", keepOpen = false }) => {
   const [open, setOpen] = useState30(false);
   const ref = useRef26(null);
   const menuRef = useRef26(null);
-  useEffect23(() => {
+  useEffect24(() => {
     const handleClick = (e) => {
       const target = e.target;
       const inTrigger = ref.current?.contains(target);
@@ -10083,7 +10073,7 @@ var Dropdown = ({ trigger, children, className = "", keepOpen = false }) => {
     document.addEventListener("mousedown", handleClick);
     return () => document.removeEventListener("mousedown", handleClick);
   }, []);
-  useEffect23(() => {
+  useEffect24(() => {
     if (!open || !menuRef.current || !ref.current) return;
     const menu = menuRef.current;
     const trigger2 = ref.current;
@@ -10384,7 +10374,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
   const ttsRef = useRef26(null);
   const sttRef = useRef26(null);
   const show = (id) => !visibleButtons || visibleButtons.has(id);
-  useEffect23(() => {
+  useEffect24(() => {
     if (!editor) return;
     const onTransaction = () => setEditorState((n) => n + 1);
     editor.on("transaction", onTransaction);
@@ -11023,7 +11013,7 @@ var Toolbar = ({ editor, setLink, onAICommand, onTranslate, onSpeechToText, onTe
 var Toolbar_default = Toolbar;
 
 // lib/RufousTextEditor/ImageToolbar.tsx
-import React113, { useState as useState31, useEffect as useEffect24, useRef as useRef27 } from "react";
+import React113, { useState as useState31, useEffect as useEffect25, useRef as useRef27 } from "react";
 import { createPortal as createPortal5 } from "react-dom";
 var ALIGNMENTS = [
   { value: "left", label: "Left", icon: "\u2630" },
@@ -11042,7 +11032,7 @@ var ImagePropertiesModal = ({ editor, node, onClose }) => {
   const [lockRatio, setLockRatio] = useState31(true);
   const [naturalWidth, setNaturalWidth] = useState31(0);
   const [naturalHeight, setNaturalHeight] = useState31(0);
-  useEffect24(() => {
+  useEffect25(() => {
     if (src) {
       const img = new window.Image();
       img.onload = () => {
@@ -11167,7 +11157,7 @@ var ImageToolbar = ({ editor }) => {
   const [copyStatus, setCopyStatus] = useState31("");
   const [pos, setPos] = useState31(null);
   const toolbarRef = useRef27(null);
-  useEffect24(() => {
+  useEffect25(() => {
     if (!editor) return;
     const update = () => {
       const { selection } = editor.state;
@@ -11303,7 +11293,7 @@ var ImageToolbar = ({ editor }) => {
 var ImageToolbar_default = ImageToolbar;
 
 // lib/RufousTextEditor/VideoToolbar.tsx
-import React114, { useState as useState32, useEffect as useEffect25, useRef as useRef28 } from "react";
+import React114, { useState as useState32, useEffect as useEffect26, useRef as useRef28 } from "react";
 import { createPortal as createPortal6 } from "react-dom";
 var ALIGNMENTS2 = [
   { value: "left", label: "Left", icon: "\u2630" },
@@ -11420,7 +11410,7 @@ var VideoToolbar = ({ editor }) => {
   const [copyStatus, setCopyStatus] = useState32("");
   const [pos, setPos] = useState32(null);
   const toolbarRef = useRef28(null);
-  useEffect25(() => {
+  useEffect26(() => {
     if (!editor) return;
     const update = () => {
       const { selection } = editor.state;
@@ -11544,7 +11534,7 @@ var VideoToolbar = ({ editor }) => {
 var VideoToolbar_default = VideoToolbar;
 
 // lib/RufousTextEditor/TableToolbar.tsx
-import React115, { useState as useState33, useEffect as useEffect26, useRef as useRef29 } from "react";
+import React115, { useState as useState33, useEffect as useEffect27, useRef as useRef29 } from "react";
 import { createPortal as createPortal7 } from "react-dom";
 var IconAddRowBefore = () => /* @__PURE__ */ React115.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ React115.createElement("path", { d: "M20 3H4c-.55 0-1 .45-1 1v16c0 .55.45 1 1 1h16c.55 0 1-.45 1-1V4c0-.55-.45-1-1-1zm-1 8H5V5h14v6zm0 8H5v-6h14v6z" }), /* @__PURE__ */ React115.createElement("path", { d: "M9 6h2v1.5h1.5v2H11V11H9V9.5H7.5v-2H9z" }));
 var IconAddRowAfter = () => /* @__PURE__ */ React115.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor" }, /* @__PURE__ */ React115.createElement("path", { d: "M20 3H4c-.55 0-1 .45-1 1v16c0 .55.45 1 1 1h16c.55 0 1-.45 1-1V4c0-.55-.45-1-1-1zm-1 8H5V5h14v6zm0 8H5v-6h14v6z" }), /* @__PURE__ */ React115.createElement("path", { d: "M9 14h2v1.5h1.5v2H11V19H9v-1.5H7.5v-2H9z" }));
@@ -11559,7 +11549,7 @@ var IconToggleHeader = () => /* @__PURE__ */ React115.createElement("svg", { wid
 var TableToolbar = ({ editor }) => {
   const [pos, setPos] = useState33(null);
   const toolbarRef = useRef29(null);
-  useEffect26(() => {
+  useEffect27(() => {
     if (!editor) return;
     const update = () => {
       if (!editor.isActive("table")) {
@@ -11882,10 +11872,10 @@ var RufousTextEditor = ({
   const mentionSuggestion = useMemo4(() => createMentionSuggestion(mentions), [mentions]);
   const onChangeRef = useRef30(onChange);
   const onBlurRef = useRef30(onBlur);
-  useEffect27(() => {
+  useEffect28(() => {
     onChangeRef.current = onChange;
   }, [onChange]);
-  useEffect27(() => {
+  useEffect28(() => {
     onBlurRef.current = onBlur;
   }, [onBlur]);
   const isEditable = editable && !disabled;
@@ -11987,7 +11977,7 @@ var RufousTextEditor = ({
     }
   });
   const wrapperRef = useRef30(null);
-  useEffect27(() => {
+  useEffect28(() => {
     if (!editor) return;
     let blurTimer = null;
     const handler = ({ event }) => {
@@ -12050,10 +12040,10 @@ var RufousTextEditor = ({
     setLinkSelection({ from, to });
     setLinkModalOpen(true);
   }, [editor]);
-  useEffect27(() => {
+  useEffect28(() => {
     setLinkRef.current = setLink;
   }, [setLink]);
-  useEffect27(() => {
+  useEffect28(() => {
     if (!editor?.view) return;
     const handleKeyDown = (event) => {
       if ((event.ctrlKey || event.metaKey) && event.key === "k") {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rufous/ui",
   "private": false,
-  "version": "0.2.77",
+  "version": "0.2.79",
   "type": "module",
   "description": "Experimental: A lightweight React UI component library (Beta)",
   "style": "./dist/main.css",