react-open-source-grid 1.6.5 → 1.6.7

package/dist/lib/index.cjs

@@ -341,6 +341,7 @@ __export(index_exports, {
   ColumnFilters: () => ColumnFilters,
   CurrencyCell: () => CurrencyCell,
   DataGrid: () => DataGrid,
+  DateEditor: () => DateEditor,
   DensityToggle: () => DensityToggle,
   ExportMenu: () => ExportMenu,
   FacetedSearch: () => FacetedSearch,
@@ -353,12 +354,16 @@ __export(index_exports, {
   LayoutPersistenceManager: () => LayoutPersistenceManager,
   LayoutPresetsManager: () => LayoutPresetsManager,
   LocalStorageAdapter: () => LocalStorageAdapter,
+  MarkdownEditor: () => MarkdownEditor,
   MarketDataEngine: () => MarketDataEngine,
   MarketDataGrid: () => MarketDataGrid,
+  MultiSelectEditor: () => MultiSelectEditor,
+  NumericEditor: () => NumericEditor,
   PivotToolbar: () => PivotToolbar,
   PriorityIndicator: () => PriorityIndicator,
   ProgressBar: () => ProgressBar,
   Rating: () => Rating,
+  RichSelectEditor: () => RichSelectEditor,
   ServerAdapter: () => ServerAdapter,
   ServerSideDataSource: () => ServerSideDataSource,
   StatusChip: () => StatusChip,
@@ -378,14 +383,17 @@ __export(index_exports, {
   createMockWebSocket: () => createMockWebSocket,
   createPreset: () => createPreset,
   darkTheme: () => darkTheme,
+  debounce: () => debounce2,
   densityConfigs: () => densityConfigs,
   downloadCSV: () => downloadCSV,
   expandAllNodes: () => expandAllNodes,
   exportPivotToCSV: () => exportPivotToCSV,
   exportToCSV: () => exportToCSV,
   exportToXLSX: () => exportToXLSX,
+  filterOptions: () => filterOptions,
   filterTree: () => filterTree,
   flattenTree: () => flattenTree,
+  formatNumber: () => formatNumber,
   generateDensityCSS: () => generateDensityCSS,
   generateFilename: () => generateFilename,
   generatePresetId: () => generatePresetId,
@@ -403,12 +411,17 @@ __export(index_exports, {
   isTreeNode: () => isTreeNode,
   loadDensityMode: () => loadDensityMode,
   materialTheme: () => materialTheme,
+  parseFormattedNumber: () => parseFormattedNumber,
   quartzTheme: () => quartzTheme,
   saveDensityMode: () => saveDensityMode,
   themes: () => themes,
   toggleNodeExpansion: () => toggleNodeExpansion,
   useDensityMode: () => useDensityMode,
-  useMarketData: () => useMarketData
+  useEditorAutoFocus: () => useEditorAutoFocus,
+  useEditorClickOutside: () => useEditorClickOutside,
+  useEditorKeyboardNavigation: () => useEditorKeyboardNavigation,
+  useMarketData: () => useMarketData,
+  usePopupPosition: () => usePopupPosition
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -2759,7 +2772,16 @@ var GridBody = ({
             onKeyDown: (e) => handleKeyDown(e, rowIndex, columnIndex),
             tabIndex: isCellFocused ? 0 : -1
           },
-          isEditing ? /* @__PURE__ */ import_react6.default.createElement(
+          isEditing ? column.editor ? column.editor({
+            value: editState.value,
+            row,
+            column,
+            onChange: handleEditChange,
+            onCommit: handleEditComplete,
+            onCancel: () => dispatch({ type: "END_EDIT" }),
+            autoFocus: true,
+            ...column.editorParams
+          }) : /* @__PURE__ */ import_react6.default.createElement(
             "input",
             {
               ref: editInputRef,
@@ -5430,7 +5452,7 @@ var LayoutPresetsManager = ({
       setLoading(false);
     }
   };
-  const formatDate = (timestamp) => {
+  const formatDate2 = (timestamp) => {
     return new Date(timestamp).toLocaleString();
   };
   return /* @__PURE__ */ import_react14.default.createElement("div", { className: "relative inline-block" }, /* @__PURE__ */ import_react14.default.createElement(
@@ -5544,7 +5566,7 @@ var LayoutPresetsManager = ({
         if (buttons) buttons.style.opacity = "0";
       }
     },
-    /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between" } }, /* @__PURE__ */ import_react14.default.createElement("div", { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ import_react14.default.createElement("h4", { style: { fontSize: "14px", fontWeight: "500", color: "#111827", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, preset.name), preset.description && /* @__PURE__ */ import_react14.default.createElement("p", { style: { fontSize: "12px", color: "#6b7280", marginTop: "4px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, preset.description), /* @__PURE__ */ import_react14.default.createElement("p", { style: { fontSize: "12px", color: "#9ca3af", marginTop: "4px" } }, "Updated: ", formatDate(preset.updatedAt))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "preset-actions", style: { display: "flex", gap: "4px", marginLeft: "8px", opacity: 0, transition: "opacity 0.2s" } }, /* @__PURE__ */ import_react14.default.createElement(
+    /* @__PURE__ */ import_react14.default.createElement("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between" } }, /* @__PURE__ */ import_react14.default.createElement("div", { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ import_react14.default.createElement("h4", { style: { fontSize: "14px", fontWeight: "500", color: "#111827", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, preset.name), preset.description && /* @__PURE__ */ import_react14.default.createElement("p", { style: { fontSize: "12px", color: "#6b7280", marginTop: "4px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, preset.description), /* @__PURE__ */ import_react14.default.createElement("p", { style: { fontSize: "12px", color: "#9ca3af", marginTop: "4px" } }, "Updated: ", formatDate2(preset.updatedAt))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "preset-actions", style: { display: "flex", gap: "4px", marginLeft: "8px", opacity: 0, transition: "opacity 0.2s" } }, /* @__PURE__ */ import_react14.default.createElement(
       "button",
       {
         onClick: (e) => handleUpdatePreset(preset, e),
@@ -12641,6 +12663,1280 @@ var PivotToolbar = ({
     } }, /* @__PURE__ */ import_react33.default.createElement("strong", null, "\u{1F4A1} Tip:"), " Select a Row Group column to organize data by, a Pivot column whose values become new columns, and a Value column to aggregate.")
   );
 };
+
+// src/editors/editorUtils.ts
+var import_react34 = require("react");
+function useEditorKeyboardNavigation(handlers, config = {}) {
+  const {
+    commitOnEnter = true,
+    cancelOnEscape = true,
+    commitOnTab = true,
+    preventDefault = true,
+    stopPropagation = true
+  } = config;
+  const handleKeyDown = (0, import_react34.useCallback)(
+    (event) => {
+      let handled = false;
+      switch (event.key) {
+        case "Enter":
+          if (commitOnEnter && handlers.onEnter) {
+            handlers.onEnter();
+            handled = true;
+          }
+          break;
+        case "Escape":
+          if (cancelOnEscape && handlers.onEscape) {
+            handlers.onEscape();
+            handled = true;
+          }
+          break;
+        case "Tab":
+          if (commitOnTab && handlers.onTab) {
+            handlers.onTab(event.shiftKey);
+            handled = true;
+          }
+          break;
+        case "ArrowUp":
+          if (handlers.onArrowUp) {
+            handlers.onArrowUp();
+            handled = true;
+          }
+          break;
+        case "ArrowDown":
+          if (handlers.onArrowDown) {
+            handlers.onArrowDown();
+            handled = true;
+          }
+          break;
+      }
+      if (handled) {
+        if (preventDefault) {
+          event.preventDefault();
+        }
+        if (stopPropagation) {
+          event.stopPropagation();
+        }
+      }
+    },
+    [
+      handlers,
+      commitOnEnter,
+      cancelOnEscape,
+      commitOnTab,
+      preventDefault,
+      stopPropagation
+    ]
+  );
+  return { handleKeyDown };
+}
+function useEditorAutoFocus(autoFocus = true, selectAll = false) {
+  const elementRef = (0, import_react34.useRef)(null);
+  (0, import_react34.useEffect)(() => {
+    if (autoFocus && elementRef.current) {
+      elementRef.current.focus();
+      if (selectAll && elementRef.current instanceof HTMLInputElement) {
+        elementRef.current.select();
+      }
+    }
+  }, [autoFocus, selectAll]);
+  return elementRef;
+}
+function useEditorClickOutside(ref, onClickOutside, enabled = true) {
+  (0, import_react34.useEffect)(() => {
+    if (!enabled) return;
+    const handleClickOutside = (event) => {
+      if (ref.current && !ref.current.contains(event.target)) {
+        onClickOutside();
+      }
+    };
+    const timeoutId = setTimeout(() => {
+      document.addEventListener("mousedown", handleClickOutside);
+    }, 0);
+    return () => {
+      clearTimeout(timeoutId);
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [ref, onClickOutside, enabled]);
+}
+function usePopupPosition(anchorRef, popupRef, isOpen, placement = "auto") {
+  (0, import_react34.useEffect)(() => {
+    if (!isOpen || !anchorRef.current || !popupRef.current) return;
+    const anchor = anchorRef.current;
+    const popup = popupRef.current;
+    const anchorRect = anchor.getBoundingClientRect();
+    const popupRect = popup.getBoundingClientRect();
+    const viewportHeight = window.innerHeight;
+    const viewportWidth = window.innerWidth;
+    let top = 0;
+    let left = 0;
+    let actualPlacement = placement;
+    if (placement === "auto") {
+      const spaceBelow = viewportHeight - anchorRect.bottom;
+      const spaceAbove = anchorRect.top;
+      const spaceRight = viewportWidth - anchorRect.right;
+      const spaceLeft = anchorRect.left;
+      if (spaceBelow >= popupRect.height || spaceBelow >= spaceAbove) {
+        actualPlacement = "bottom";
+      } else if (spaceAbove >= popupRect.height) {
+        actualPlacement = "top";
+      } else if (spaceRight >= popupRect.width) {
+        actualPlacement = "right";
+      } else if (spaceLeft >= popupRect.width) {
+        actualPlacement = "left";
+      } else {
+        actualPlacement = "bottom";
+      }
+    }
+    switch (actualPlacement) {
+      case "bottom":
+        top = anchorRect.bottom + window.scrollY;
+        left = anchorRect.left + window.scrollX;
+        break;
+      case "top":
+        top = anchorRect.top + window.scrollY - popupRect.height;
+        left = anchorRect.left + window.scrollX;
+        break;
+      case "right":
+        top = anchorRect.top + window.scrollY;
+        left = anchorRect.right + window.scrollX;
+        break;
+      case "left":
+        top = anchorRect.top + window.scrollY;
+        left = anchorRect.left + window.scrollX - popupRect.width;
+        break;
+    }
+    const margin = 8;
+    if (left + popupRect.width > viewportWidth) {
+      left = viewportWidth - popupRect.width - margin;
+    }
+    if (left < margin) {
+      left = margin;
+    }
+    if (top + popupRect.height > viewportHeight + window.scrollY) {
+      top = viewportHeight + window.scrollY - popupRect.height - margin;
+    }
+    if (top < window.scrollY + margin) {
+      top = window.scrollY + margin;
+    }
+    popup.style.top = `${top}px`;
+    popup.style.left = `${left}px`;
+    popup.style.minWidth = `${anchorRect.width}px`;
+  }, [isOpen, anchorRef, popupRef, placement]);
+}
+function debounce2(func, wait) {
+  let timeout = null;
+  return function executedFunction(...args) {
+    const later = () => {
+      timeout = null;
+      func(...args);
+    };
+    if (timeout) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(later, wait);
+  };
+}
+function formatNumber(value, decimals = 0, thousandsSeparator = ",", decimalSeparator = ".") {
+  const fixed = value.toFixed(decimals);
+  const [integerPart, decimalPart] = fixed.split(".");
+  const formattedInteger = integerPart.replace(
+    /\B(?=(\d{3})+(?!\d))/g,
+    thousandsSeparator
+  );
+  return decimalPart ? `${formattedInteger}${decimalSeparator}${decimalPart}` : formattedInteger;
+}
+function parseFormattedNumber(value, thousandsSeparator = ",", decimalSeparator = ".") {
+  if (!value || typeof value !== "string") return null;
+  const normalized = value.replace(new RegExp(`\\${thousandsSeparator}`, "g"), "").replace(new RegExp(`\\${decimalSeparator}`), ".");
+  const parsed = parseFloat(normalized);
+  return isNaN(parsed) ? null : parsed;
+}
+function filterOptions(options, searchQuery) {
+  if (!searchQuery.trim()) return options;
+  const lowerQuery = searchQuery.toLowerCase();
+  return options.filter(
+    (option) => option.label.toLowerCase().includes(lowerQuery)
+  );
+}
+
+// src/editors/RichSelectEditor.tsx
+var import_react35 = __toESM(require("react"), 1);
+function RichSelectEditor(props) {
+  const {
+    value,
+    onChange,
+    onCommit,
+    onCancel,
+    autoFocus = true,
+    options,
+    placeholder = "Select...",
+    allowClear = false,
+    filterable = true,
+    renderOptionLabel,
+    maxDropdownHeight = 300
+  } = props;
+  const [isOpen] = (0, import_react35.useState)(true);
+  const [searchQuery, setSearchQuery] = (0, import_react35.useState)("");
+  const [focusedIndex, setFocusedIndex] = (0, import_react35.useState)(-1);
+  const containerRef = (0, import_react35.useRef)(null);
+  const inputRef = useEditorAutoFocus(autoFocus, true);
+  const dropdownRef = (0, import_react35.useRef)(null);
+  const optionRefs = (0, import_react35.useRef)([]);
+  const filteredOptions = (0, import_react35.useMemo)(
+    () => filterable ? filterOptions(options, searchQuery) : options,
+    [options, searchQuery, filterable]
+  );
+  const selectedOption = (0, import_react35.useMemo)(
+    () => options.find((opt) => opt.value === value),
+    [options, value]
+  );
+  (0, import_react35.useEffect)(() => {
+    if (selectedOption) {
+      const index = filteredOptions.findIndex(
+        (opt) => opt.value === selectedOption.value
+      );
+      if (index !== -1 && focusedIndex === -1) {
+        queueMicrotask(() => setFocusedIndex(index));
+      }
+    }
+  }, [selectedOption, filteredOptions]);
+  (0, import_react35.useEffect)(() => {
+    var _a;
+    if (focusedIndex >= 0 && optionRefs.current[focusedIndex]) {
+      (_a = optionRefs.current[focusedIndex]) == null ? void 0 : _a.scrollIntoView({
+        block: "nearest",
+        behavior: "smooth"
+      });
+    }
+  }, [focusedIndex]);
+  usePopupPosition(containerRef, dropdownRef, isOpen, "auto");
+  useEditorClickOutside(
+    containerRef,
+    () => {
+      if (isOpen) {
+        onCommit();
+      }
+    },
+    true
+  );
+  const handleSelectOption = (option) => {
+    if (!option.disabled) {
+      onChange(option.value);
+      onCommit();
+    }
+  };
+  const handleClear = (e) => {
+    e.stopPropagation();
+    onChange(null);
+    setSearchQuery("");
+    setFocusedIndex(-1);
+  };
+  const handleArrowDown = () => {
+    setFocusedIndex((prev) => {
+      var _a;
+      let next = prev + 1;
+      while (next < filteredOptions.length && ((_a = filteredOptions[next]) == null ? void 0 : _a.disabled)) {
+        next++;
+      }
+      return next < filteredOptions.length ? next : prev;
+    });
+  };
+  const handleArrowUp = () => {
+    setFocusedIndex((prev) => {
+      var _a;
+      let next = prev - 1;
+      while (next >= 0 && ((_a = filteredOptions[next]) == null ? void 0 : _a.disabled)) {
+        next--;
+      }
+      return next >= 0 ? next : prev;
+    });
+  };
+  const handleEnter = () => {
+    if (focusedIndex >= 0 && focusedIndex < filteredOptions.length) {
+      const option = filteredOptions[focusedIndex];
+      if (option && !option.disabled) {
+        handleSelectOption(option);
+      }
+    } else {
+      onCommit();
+    }
+  };
+  const { handleKeyDown } = useEditorKeyboardNavigation(
+    {
+      onEnter: handleEnter,
+      onEscape: onCancel,
+      onArrowUp: handleArrowUp,
+      onArrowDown: handleArrowDown
+    },
+    {
+      commitOnTab: true,
+      commitOnBlur: false
+    }
+  );
+  const renderLabel = (option) => {
+    if (renderOptionLabel) {
+      return renderOptionLabel(option);
+    }
+    return /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-option-content" }, option.icon && /* @__PURE__ */ import_react35.default.createElement("span", { className: "editor-option-icon" }, option.icon), /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-option-text" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-option-label" }, option.label), option.description && /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-option-description" }, option.description)));
+  };
+  return /* @__PURE__ */ import_react35.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: "editor-container editor-richselect-container",
+      onKeyDown: handleKeyDown
+    },
+    /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-input-wrapper" }, /* @__PURE__ */ import_react35.default.createElement(
+      "input",
+      {
+        ref: inputRef,
+        type: "text",
+        className: "editor-input editor-richselect-input",
+        value: filterable ? searchQuery : (selectedOption == null ? void 0 : selectedOption.label) || "",
+        onChange: (e) => {
+          if (filterable) {
+            setSearchQuery(e.target.value);
+            setFocusedIndex(-1);
+          }
+        },
+        placeholder: (selectedOption == null ? void 0 : selectedOption.label) || placeholder,
+        "aria-label": "Select option",
+        "aria-expanded": isOpen,
+        "aria-autocomplete": "list",
+        "aria-controls": "richselect-dropdown",
+        autoComplete: "off"
+      }
+    ), /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-input-actions" }, allowClear && value !== null && value !== void 0 && /* @__PURE__ */ import_react35.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-clear-btn",
+        onClick: handleClear,
+        "aria-label": "Clear selection",
+        tabIndex: -1
+      },
+      "\xD7"
+    ), /* @__PURE__ */ import_react35.default.createElement("span", { className: "editor-dropdown-icon", "aria-hidden": "true" }, "\u25BC"))),
+    isOpen && /* @__PURE__ */ import_react35.default.createElement(
+      "div",
+      {
+        ref: dropdownRef,
+        id: "richselect-dropdown",
+        className: "editor-dropdown",
+        role: "listbox",
+        style: { maxHeight: maxDropdownHeight }
+      },
+      filteredOptions.length === 0 ? /* @__PURE__ */ import_react35.default.createElement("div", { className: "editor-dropdown-empty" }, "No options found") : filteredOptions.map((option, index) => /* @__PURE__ */ import_react35.default.createElement(
+        "div",
+        {
+          key: option.value,
+          ref: (el) => {
+            optionRefs.current[index] = el;
+          },
+          className: `editor-dropdown-option ${option.value === value ? "selected" : ""} ${option.disabled ? "disabled" : ""} ${index === focusedIndex ? "focused" : ""}`,
+          role: "option",
+          "aria-selected": option.value === value,
+          "aria-disabled": option.disabled,
+          onClick: () => handleSelectOption(option),
+          onMouseEnter: () => !option.disabled && setFocusedIndex(index)
+        },
+        renderLabel(option)
+      ))
+    )
+  );
+}
+RichSelectEditor.displayName = "RichSelectEditor";
+
+// src/editors/DateEditor.tsx
+var import_react36 = __toESM(require("react"), 1);
+function DateEditor(props) {
+  const {
+    value,
+    onChange,
+    onCommit,
+    onCancel,
+    autoFocus = true,
+    dateFormat = "yyyy-MM-dd",
+    showTime = false,
+    minDate,
+    maxDate,
+    autoCommit = false
+  } = props;
+  const [isOpen] = (0, import_react36.useState)(true);
+  const [inputValue, setInputValue] = (0, import_react36.useState)("");
+  const [viewDate, setViewDate] = (0, import_react36.useState)(/* @__PURE__ */ new Date());
+  const containerRef = (0, import_react36.useRef)(null);
+  const inputRef = useEditorAutoFocus(autoFocus, true);
+  const calendarRef = (0, import_react36.useRef)(null);
+  const parsedValue = (0, import_react36.useMemo)(() => {
+    if (!value) return null;
+    if (value instanceof Date) return value;
+    const parsed = new Date(value);
+    return isNaN(parsed.getTime()) ? null : parsed;
+  }, [value]);
+  import_react36.default.useEffect(() => {
+    if (parsedValue) {
+      setInputValue(formatDate(parsedValue, dateFormat, showTime));
+      setViewDate(parsedValue);
+    }
+  }, [parsedValue, dateFormat, showTime]);
+  usePopupPosition(containerRef, calendarRef, isOpen, "auto");
+  useEditorClickOutside(containerRef, () => {
+    if (isOpen) {
+      onCommit();
+    }
+  }, true);
+  const handleSelectDate = (date) => {
+    const newDate = new Date(date);
+    if (parsedValue && !showTime) {
+      newDate.setHours(parsedValue.getHours());
+      newDate.setMinutes(parsedValue.getMinutes());
+      newDate.setSeconds(parsedValue.getSeconds());
+    }
+    onChange(newDate);
+    setInputValue(formatDate(newDate, dateFormat, showTime));
+    if (autoCommit && !showTime) {
+      onCommit();
+    }
+  };
+  const handleTimeChange = (hours, minutes) => {
+    const newDate = parsedValue ? new Date(parsedValue) : /* @__PURE__ */ new Date();
+    newDate.setHours(hours);
+    newDate.setMinutes(minutes);
+    onChange(newDate);
+    setInputValue(formatDate(newDate, dateFormat, showTime));
+  };
+  const handleInputChange = (e) => {
+    const newValue = e.target.value;
+    setInputValue(newValue);
+    const parsed = parseDate(newValue, dateFormat);
+    if (parsed && !isNaN(parsed.getTime())) {
+      onChange(parsed);
+      setViewDate(parsed);
+    }
+  };
+  const handleInputBlur = () => {
+    if (parsedValue) {
+      setInputValue(formatDate(parsedValue, dateFormat, showTime));
+    }
+  };
+  const handlePrevMonth = () => {
+    setViewDate((prev) => {
+      const newDate = new Date(prev);
+      newDate.setMonth(newDate.getMonth() - 1);
+      return newDate;
+    });
+  };
+  const handleNextMonth = () => {
+    setViewDate((prev) => {
+      const newDate = new Date(prev);
+      newDate.setMonth(newDate.getMonth() + 1);
+      return newDate;
+    });
+  };
+  const { handleKeyDown } = useEditorKeyboardNavigation(
+    {
+      onEnter: onCommit,
+      onEscape: onCancel
+    },
+    {
+      commitOnTab: true,
+      commitOnBlur: false
+    }
+  );
+  const calendarDays = (0, import_react36.useMemo)(() => {
+    return generateCalendarDays(viewDate, parsedValue, minDate, maxDate);
+  }, [viewDate, parsedValue, minDate, maxDate]);
+  return /* @__PURE__ */ import_react36.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: "editor-container editor-date-container",
+      onKeyDown: handleKeyDown
+    },
+    /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-input-wrapper" }, /* @__PURE__ */ import_react36.default.createElement(
+      "input",
+      {
+        ref: inputRef,
+        type: "text",
+        className: "editor-input editor-date-input",
+        value: inputValue,
+        onChange: handleInputChange,
+        onBlur: handleInputBlur,
+        placeholder: dateFormat,
+        "aria-label": "Date input",
+        autoComplete: "off"
+      }
+    ), /* @__PURE__ */ import_react36.default.createElement("span", { className: "editor-calendar-icon", "aria-hidden": "true" }, "\u{1F4C5}")),
+    isOpen && /* @__PURE__ */ import_react36.default.createElement("div", { ref: calendarRef, className: "editor-dropdown editor-calendar" }, /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-calendar-header" }, /* @__PURE__ */ import_react36.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-calendar-nav",
+        onClick: handlePrevMonth,
+        "aria-label": "Previous month"
+      },
+      "\u2039"
+    ), /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-calendar-title" }, viewDate.toLocaleDateString("en-US", {
+      month: "long",
+      year: "numeric"
+    })), /* @__PURE__ */ import_react36.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-calendar-nav",
+        onClick: handleNextMonth,
+        "aria-label": "Next month"
+      },
+      "\u203A"
+    )), /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-calendar-weekdays" }, ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((day) => /* @__PURE__ */ import_react36.default.createElement("div", { key: day, className: "editor-calendar-weekday" }, day))), /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-calendar-days" }, calendarDays.map((day, index) => /* @__PURE__ */ import_react36.default.createElement(
+      "button",
+      {
+        key: index,
+        type: "button",
+        className: `editor-calendar-day ${day.className}`,
+        onClick: () => day.date && handleSelectDate(day.date),
+        disabled: day.disabled,
+        "aria-label": day.date ? day.date.toDateString() : ""
+      },
+      day.label
+    ))), showTime && /* @__PURE__ */ import_react36.default.createElement("div", { className: "editor-calendar-time" }, /* @__PURE__ */ import_react36.default.createElement(
+      "input",
+      {
+        type: "time",
+        className: "editor-time-input",
+        value: parsedValue ? `${String(parsedValue.getHours()).padStart(2, "0")}:${String(
+          parsedValue.getMinutes()
+        ).padStart(2, "0")}` : "00:00",
+        onChange: (e) => {
+          const [hours, minutes] = e.target.value.split(":").map(Number);
+          handleTimeChange(hours, minutes);
+        },
+        "aria-label": "Time input"
+      }
+    )))
+  );
+}
+DateEditor.displayName = "DateEditor";
+function formatDate(date, format, showTime) {
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  let formatted = format.replace("yyyy", String(year)).replace("MM", month).replace("dd", day);
+  if (showTime) {
+    formatted += ` ${hours}:${minutes}`;
+  }
+  return formatted;
+}
+function parseDate(value, format) {
+  if (!value) return null;
+  try {
+    const parts = value.split(/[-/\s:]/);
+    if (parts.length < 3) return null;
+    let year, month, day;
+    let hours = 0, minutes = 0;
+    if (format.startsWith("yyyy")) {
+      year = parseInt(parts[0], 10);
+      month = parseInt(parts[1], 10) - 1;
+      day = parseInt(parts[2], 10);
+    } else if (format.startsWith("MM")) {
+      month = parseInt(parts[0], 10) - 1;
+      day = parseInt(parts[1], 10);
+      year = parseInt(parts[2], 10);
+    } else {
+      day = parseInt(parts[0], 10);
+      month = parseInt(parts[1], 10) - 1;
+      year = parseInt(parts[2], 10);
+    }
+    if (parts.length >= 5) {
+      hours = parseInt(parts[3], 10);
+      minutes = parseInt(parts[4], 10);
+    }
+    const date = new Date(year, month, day, hours, minutes);
+    return isNaN(date.getTime()) ? null : date;
+  } catch {
+    return null;
+  }
+}
+function generateCalendarDays(viewDate, selectedDate, minDate, maxDate) {
+  const year = viewDate.getFullYear();
+  const month = viewDate.getMonth();
+  const firstDay = new Date(year, month, 1);
+  const lastDay = new Date(year, month + 1, 0);
+  const daysInMonth = lastDay.getDate();
+  const startingDayOfWeek = firstDay.getDay();
+  const days = [];
+  const prevMonth = new Date(year, month, 0);
+  const prevMonthDays = prevMonth.getDate();
+  for (let i = startingDayOfWeek - 1; i >= 0; i--) {
+    const date = new Date(year, month - 1, prevMonthDays - i);
+    days.push({
+      date,
+      label: String(prevMonthDays - i),
+      className: "other-month",
+      disabled: isDateDisabled(date, minDate, maxDate)
+    });
+  }
+  for (let i = 1; i <= daysInMonth; i++) {
+    const date = new Date(year, month, i);
+    const isSelected = selectedDate && isSameDay(date, selectedDate);
+    const isToday = isSameDay(date, /* @__PURE__ */ new Date());
+    const disabled = isDateDisabled(date, minDate, maxDate);
+    days.push({
+      date,
+      label: String(i),
+      className: `${isSelected ? "selected" : ""} ${isToday ? "today" : ""} ${disabled ? "disabled" : ""}`.trim(),
+      disabled
+    });
+  }
+  const remainingDays = 42 - days.length;
+  for (let i = 1; i <= remainingDays; i++) {
+    const date = new Date(year, month + 1, i);
+    days.push({
+      date,
+      label: String(i),
+      className: "other-month",
+      disabled: isDateDisabled(date, minDate, maxDate)
+    });
+  }
+  return days;
+}
+function isSameDay(date1, date2) {
+  return date1.getFullYear() === date2.getFullYear() && date1.getMonth() === date2.getMonth() && date1.getDate() === date2.getDate();
+}
+function isDateDisabled(date, minDate, maxDate) {
+  if (minDate && date < minDate) return true;
+  if (maxDate && date > maxDate) return true;
+  return false;
+}
+
+// src/editors/NumericEditor.tsx
+var import_react37 = __toESM(require("react"), 1);
+function NumericEditor(props) {
+  const {
+    value,
+    onChange,
+    onCommit,
+    onCancel,
+    autoFocus = true,
+    min,
+    max,
+    step = 1,
+    decimals = 0,
+    prefix = "",
+    suffix = "",
+    allowNegative = true,
+    showSteppers = true,
+    thousandsSeparator = ",",
+    decimalSeparator = "."
+  } = props;
+  const [inputValue, setInputValue] = (0, import_react37.useState)("");
+  const [isFocused, setIsFocused] = (0, import_react37.useState)(true);
+  const inputRef = useEditorAutoFocus(autoFocus, true);
+  (0, import_react37.useEffect)(() => {
+    if (value !== null && value !== void 0) {
+      if (isFocused) {
+        queueMicrotask(() => setInputValue(String(value)));
+      } else {
+        queueMicrotask(() => setInputValue(formatNumber(value, decimals, thousandsSeparator, decimalSeparator)));
+      }
+    } else {
+      queueMicrotask(() => setInputValue(""));
+    }
+  }, [value, isFocused, decimals, thousandsSeparator, decimalSeparator]);
+  const clampValue = (val) => {
+    let clamped = val;
+    if (min !== void 0 && clamped < min) clamped = min;
+    if (max !== void 0 && clamped > max) clamped = max;
+    return clamped;
+  };
+  const handleInputChange = (e) => {
+    const newValue = e.target.value;
+    setInputValue(newValue);
+    if (newValue === "" || newValue === "-") {
+      onChange(null);
+      return;
+    }
+    let cleaned = newValue;
+    if (prefix) cleaned = cleaned.replace(prefix, "");
+    if (suffix) cleaned = cleaned.replace(suffix, "");
+    const parsed = parseFormattedNumber(cleaned, thousandsSeparator, decimalSeparator);
+    if (parsed !== null && !isNaN(parsed)) {
+      if (!allowNegative && parsed < 0) {
+        return;
+      }
+      const clamped = clampValue(parsed);
+      onChange(clamped);
+    }
+  };
+  const handleIncrement = () => {
+    const currentValue = value ?? 0;
+    const newValue = clampValue(currentValue + step);
+    onChange(newValue);
+    setInputValue(String(newValue));
+  };
+  const handleDecrement = () => {
+    const currentValue = value ?? 0;
+    const newValue = clampValue(currentValue - step);
+    onChange(newValue);
+    setInputValue(String(newValue));
+  };
+  const handleFocus = () => {
+    setIsFocused(true);
+    if (value !== null && value !== void 0) {
+      setInputValue(String(value));
+    }
+  };
+  const handleBlur = () => {
+    setIsFocused(false);
+    if (value !== null && value !== void 0) {
+      const formatted = formatNumber(value, decimals, thousandsSeparator, decimalSeparator);
+      setInputValue(formatted);
+    }
+    setTimeout(() => onCommit(), 100);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      handleIncrement();
+    } else if (e.key === "ArrowDown") {
+      e.preventDefault();
+      handleDecrement();
+    }
+  };
+  const { handleKeyDown: handleEditorKeyDown } = useEditorKeyboardNavigation(
+    {
+      onEnter: onCommit,
+      onEscape: onCancel
+    },
+    {
+      commitOnTab: true,
+      commitOnBlur: false,
+      preventDefault: false
+      // Let handleKeyDown handle arrow keys
+    }
+  );
+  const handleCombinedKeyDown = (e) => {
+    handleKeyDown(e);
+    handleEditorKeyDown(e);
+  };
+  const displayValue = isFocused ? inputValue : inputValue ? `${prefix}${inputValue}${suffix}` : "";
+  return /* @__PURE__ */ import_react37.default.createElement("div", { className: "editor-container editor-numeric-container" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "editor-input-wrapper" }, prefix && !isFocused && /* @__PURE__ */ import_react37.default.createElement("span", { className: "editor-numeric-prefix" }, prefix), /* @__PURE__ */ import_react37.default.createElement(
+    "input",
+    {
+      ref: inputRef,
+      type: "text",
+      inputMode: "decimal",
+      className: "editor-input editor-numeric-input",
+      value: displayValue,
+      onChange: handleInputChange,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onKeyDown: handleCombinedKeyDown,
+      "aria-label": "Numeric input",
+      "aria-valuemin": min,
+      "aria-valuemax": max,
+      "aria-valuenow": value ?? void 0,
+      autoComplete: "off"
+    }
+  ), suffix && !isFocused && /* @__PURE__ */ import_react37.default.createElement("span", { className: "editor-numeric-suffix" }, suffix), showSteppers && /* @__PURE__ */ import_react37.default.createElement("div", { className: "editor-numeric-steppers" }, /* @__PURE__ */ import_react37.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "editor-numeric-stepper editor-numeric-increment",
+      onClick: handleIncrement,
+      onMouseDown: (e) => e.preventDefault(),
+      disabled: max !== void 0 && (value ?? 0) >= max,
+      "aria-label": "Increment",
+      tabIndex: -1
+    },
+    "\u25B2"
+  ), /* @__PURE__ */ import_react37.default.createElement(
+    "button",
+    {
+      type: "button",
+      className: "editor-numeric-stepper editor-numeric-decrement",
+      onClick: handleDecrement,
+      onMouseDown: (e) => e.preventDefault(),
+      disabled: min !== void 0 && (value ?? 0) <= min,
+      "aria-label": "Decrement",
+      tabIndex: -1
+    },
+    "\u25BC"
+  ))), (min !== void 0 || max !== void 0) && /* @__PURE__ */ import_react37.default.createElement("div", { className: "editor-numeric-range" }, min !== void 0 && /* @__PURE__ */ import_react37.default.createElement("span", null, "Min: ", min), max !== void 0 && /* @__PURE__ */ import_react37.default.createElement("span", null, "Max: ", max)));
+}
+NumericEditor.displayName = "NumericEditor";
+
+// src/editors/MultiSelectEditor.tsx
+var import_react38 = __toESM(require("react"), 1);
+function MultiSelectEditor(props) {
+  const {
+    value = [],
+    onChange,
+    onCommit,
+    onCancel,
+    autoFocus = true,
+    options,
+    placeholder = "Select...",
+    maxTagCount = 3,
+    filterable = true,
+    maxDropdownHeight = 300,
+    allowEmpty = true
+  } = props;
+  const [isOpen] = (0, import_react38.useState)(true);
+  const [searchQuery, setSearchQuery] = (0, import_react38.useState)("");
+  const [focusedIndex, setFocusedIndex] = (0, import_react38.useState)(-1);
+  const containerRef = (0, import_react38.useRef)(null);
+  const inputRef = useEditorAutoFocus(autoFocus);
+  const dropdownRef = (0, import_react38.useRef)(null);
+  const tagContainerRef = (0, import_react38.useRef)(null);
+  const selectedValues = (0, import_react38.useMemo)(
+    () => Array.isArray(value) ? value : [],
+    [value]
+  );
+  const filteredOptions = (0, import_react38.useMemo)(
+    () => filterable ? filterOptions(options, searchQuery) : options,
+    [options, searchQuery, filterable]
+  );
+  const selectedOptions = (0, import_react38.useMemo)(
+    () => options.filter((opt) => selectedValues.includes(opt.value)),
+    [options, selectedValues]
+  );
+  usePopupPosition(containerRef, dropdownRef, isOpen, "auto");
+  useEditorClickOutside(
+    containerRef,
+    () => {
+      if (isOpen) {
+        onCommit();
+      }
+    },
+    true
+  );
+  const handleToggleOption = (option) => {
+    if (option.disabled) return;
+    const isSelected = selectedValues.includes(option.value);
+    let newValues;
+    if (isSelected) {
+      if (!allowEmpty && selectedValues.length === 1) {
+        return;
+      }
+      newValues = selectedValues.filter((v) => v !== option.value);
+    } else {
+      newValues = [...selectedValues, option.value];
+    }
+    onChange(newValues);
+  };
+  const handleRemoveTag = (optionValue, e) => {
+    e.stopPropagation();
+    if (!allowEmpty && selectedValues.length === 1) {
+      return;
+    }
+    const newValues = selectedValues.filter((v) => v !== optionValue);
+    onChange(newValues);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Backspace" && searchQuery === "" && selectedValues.length > 0) {
+      e.preventDefault();
+      if (allowEmpty || selectedValues.length > 1) {
+        const newValues = selectedValues.slice(0, -1);
+        onChange(newValues);
+      }
+    }
+  };
+  const handleArrowDown = () => {
+    setFocusedIndex((prev) => {
+      var _a;
+      let next = prev + 1;
+      while (next < filteredOptions.length && ((_a = filteredOptions[next]) == null ? void 0 : _a.disabled)) {
+        next++;
+      }
+      return next < filteredOptions.length ? next : prev;
+    });
+  };
+  const handleArrowUp = () => {
+    setFocusedIndex((prev) => {
+      var _a;
+      let next = prev - 1;
+      while (next >= 0 && ((_a = filteredOptions[next]) == null ? void 0 : _a.disabled)) {
+        next--;
+      }
+      return next >= 0 ? next : prev;
+    });
+  };
+  const handleEnter = () => {
+    if (focusedIndex >= 0 && focusedIndex < filteredOptions.length) {
+      const option = filteredOptions[focusedIndex];
+      if (option && !option.disabled) {
+        handleToggleOption(option);
+      }
+    } else {
+      onCommit();
+    }
+  };
+  const { handleKeyDown: handleEditorKeyDown } = useEditorKeyboardNavigation(
+    {
+      onEnter: handleEnter,
+      onEscape: onCancel,
+      onArrowUp: handleArrowUp,
+      onArrowDown: handleArrowDown
+    },
+    {
+      commitOnTab: true,
+      commitOnBlur: false
+    }
+  );
+  const handleCombinedKeyDown = (e) => {
+    handleKeyDown(e);
+    handleEditorKeyDown(e);
+  };
+  const visibleTags = selectedOptions.slice(0, maxTagCount);
+  const collapsedCount = Math.max(0, selectedOptions.length - maxTagCount);
+  return /* @__PURE__ */ import_react38.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: "editor-container editor-multiselect-container",
+      onKeyDown: handleCombinedKeyDown
+    },
+    /* @__PURE__ */ import_react38.default.createElement(
+      "div",
+      {
+        ref: tagContainerRef,
+        className: "editor-input-wrapper editor-multiselect-wrapper"
+      },
+      /* @__PURE__ */ import_react38.default.createElement("div", { className: "editor-multiselect-tags" }, visibleTags.map((option) => /* @__PURE__ */ import_react38.default.createElement("div", { key: option.value, className: "editor-tag" }, option.icon && /* @__PURE__ */ import_react38.default.createElement("span", { className: "editor-tag-icon" }, option.icon), /* @__PURE__ */ import_react38.default.createElement("span", { className: "editor-tag-label" }, option.label), /* @__PURE__ */ import_react38.default.createElement(
+        "button",
+        {
+          type: "button",
+          className: "editor-tag-remove",
+          onClick: (e) => handleRemoveTag(option.value, e),
+          "aria-label": `Remove ${option.label}`,
+          tabIndex: -1
+        },
+        "\xD7"
+      ))), collapsedCount > 0 && /* @__PURE__ */ import_react38.default.createElement("div", { className: "editor-tag editor-tag-collapsed" }, "+", collapsedCount)),
+      /* @__PURE__ */ import_react38.default.createElement(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          className: "editor-input editor-multiselect-input",
+          value: searchQuery,
+          onChange: (e) => {
+            setSearchQuery(e.target.value);
+            setFocusedIndex(-1);
+          },
+          placeholder: selectedValues.length === 0 ? placeholder : "",
+          "aria-label": "Search options",
+          "aria-expanded": isOpen,
+          "aria-autocomplete": "list",
+          "aria-controls": "multiselect-dropdown",
+          autoComplete: "off"
+        }
+      ),
+      /* @__PURE__ */ import_react38.default.createElement("span", { className: "editor-dropdown-icon", "aria-hidden": "true" }, "\u25BC")
+    ),
+    isOpen && /* @__PURE__ */ import_react38.default.createElement(
+      "div",
+      {
+        ref: dropdownRef,
+        id: "multiselect-dropdown",
+        className: "editor-dropdown",
+        role: "listbox",
+        "aria-multiselectable": "true",
+        style: { maxHeight: maxDropdownHeight }
+      },
+      filteredOptions.length === 0 ? /* @__PURE__ */ import_react38.default.createElement("div", { className: "editor-dropdown-empty" }, "No options found") : filteredOptions.map((option, index) => {
+        const isSelected = selectedValues.includes(option.value);
+        return /* @__PURE__ */ import_react38.default.createElement(
+          "div",
+          {
+            key: option.value,
+            className: `editor-dropdown-option editor-multiselect-option ${isSelected ? "selected" : ""} ${option.disabled ? "disabled" : ""} ${index === focusedIndex ? "focused" : ""}`,
+            role: "option",
+            "aria-selected": isSelected,
+            "aria-disabled": option.disabled,
+            onClick: () => handleToggleOption(option),
+            onMouseEnter: () => !option.disabled && setFocusedIndex(index)
+          },
+          /* @__PURE__ */ import_react38.default.createElement(
+            "input",
+            {
+              type: "checkbox",
+              className: "editor-multiselect-checkbox",
+              checked: isSelected,
+              onChange: () => {
+              },
+              disabled: option.disabled,
+              tabIndex: -1,
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ import_react38.default.createElement("div", { className: "editor-option-content" }, option.icon && /* @__PURE__ */ import_react38.default.createElement("span", { className: "editor-option-icon" }, option.icon), /* @__PURE__ */ import_react38.default.createElement("span", { className: "editor-option-label" }, option.label))
+        );
+      })
+    )
+  );
+}
+MultiSelectEditor.displayName = "MultiSelectEditor";
+
+// src/editors/MarkdownEditor.tsx
+var import_react39 = __toESM(require("react"), 1);
+function MarkdownEditor(props) {
+  const {
+    value = "",
+    onChange,
+    onCommit,
+    onCancel,
+    autoFocus = true,
+    maxLength,
+    showPreview = true,
+    minHeight = 150,
+    maxHeight = 400,
+    rows = 6
+  } = props;
+  const [internalValue, setInternalValue] = (0, import_react39.useState)(value || "");
+  const [showPreviewPanel, setShowPreviewPanel] = (0, import_react39.useState)(showPreview);
+  const containerRef = (0, import_react39.useRef)(null);
+  const textareaRef = useEditorAutoFocus(autoFocus, true);
+  useEditorClickOutside(
+    containerRef,
+    () => {
+      onCommit();
+    },
+    true
+  );
+  const handleChange = (e) => {
+    const newValue = e.target.value;
+    if (maxLength && newValue.length > maxLength) {
+      return;
+    }
+    setInternalValue(newValue);
+    onChange(newValue);
+  };
+  const handleKeyDown = (e) => {
+    if ((e.ctrlKey || e.metaKey) && e.key === "Enter") {
+      e.preventDefault();
+      onCommit();
+      return;
+    }
+    if (e.key === "Escape") {
+      e.preventDefault();
+      onCancel();
+      return;
+    }
+    if (e.key === "Tab") {
+      e.preventDefault();
+      const start = e.currentTarget.selectionStart;
+      const end = e.currentTarget.selectionEnd;
+      const newValue = internalValue.substring(0, start) + "	" + internalValue.substring(end);
+      setInternalValue(newValue);
+      onChange(newValue);
+      setTimeout(() => {
+        if (textareaRef.current) {
+          textareaRef.current.selectionStart = start + 1;
+          textareaRef.current.selectionEnd = start + 1;
+        }
+      }, 0);
+      return;
+    }
+    if (e.ctrlKey || e.metaKey) {
+      let insertion = "";
+      let cursorOffset = 0;
+      switch (e.key) {
+        case "b":
+          insertion = "****";
+          cursorOffset = 2;
+          break;
+        case "i":
+          insertion = "__";
+          cursorOffset = 1;
+          break;
+        case "k":
+          insertion = "[](url)";
+          cursorOffset = 1;
+          break;
+        default:
+          return;
+      }
+      if (insertion) {
+        e.preventDefault();
+        const start = e.currentTarget.selectionStart;
+        const end = e.currentTarget.selectionEnd;
+        const selectedText = internalValue.substring(start, end);
+        let newValue;
+        let newCursorPos;
+        if (selectedText) {
+          const before = insertion.substring(0, cursorOffset);
+          const after = insertion.substring(cursorOffset);
+          newValue = internalValue.substring(0, start) + before + selectedText + after + internalValue.substring(end);
+          newCursorPos = start + before.length + selectedText.length;
+        } else {
+          newValue = internalValue.substring(0, start) + insertion + internalValue.substring(end);
+          newCursorPos = start + cursorOffset;
+        }
+        setInternalValue(newValue);
+        onChange(newValue);
+        setTimeout(() => {
+          if (textareaRef.current) {
+            textareaRef.current.selectionStart = newCursorPos;
+            textareaRef.current.selectionEnd = newCursorPos;
+            textareaRef.current.focus();
+          }
+        }, 0);
+      }
+    }
+  };
+  const charCount = internalValue.length;
+  const charCountClass = maxLength && charCount > maxLength * 0.9 ? "warning" : "";
+  const previewHtml = (0, import_react39.useMemo)(() => {
+    return renderMarkdownPreview(internalValue);
+  }, [internalValue]);
+  return /* @__PURE__ */ import_react39.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: "editor-container editor-markdown-container",
+      style: { minHeight }
+    },
+    /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-toolbar" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-toolbar-group" }, /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-toolbar-btn",
+        onClick: () => {
+          if (textareaRef.current) {
+            const start = textareaRef.current.selectionStart;
+            const end = textareaRef.current.selectionEnd;
+            const selectedText = internalValue.substring(start, end);
+            const newValue = internalValue.substring(0, start) + `**${selectedText || "bold"}**` + internalValue.substring(end);
+            setInternalValue(newValue);
+            onChange(newValue);
+            textareaRef.current.focus();
+          }
+        },
+        title: "Bold (Ctrl+B)",
+        "aria-label": "Bold"
+      },
+      /* @__PURE__ */ import_react39.default.createElement("strong", null, "B")
+    ), /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-toolbar-btn",
+        onClick: () => {
+          if (textareaRef.current) {
+            const start = textareaRef.current.selectionStart;
+            const end = textareaRef.current.selectionEnd;
+            const selectedText = internalValue.substring(start, end);
+            const newValue = internalValue.substring(0, start) + `_${selectedText || "italic"}_` + internalValue.substring(end);
+            setInternalValue(newValue);
+            onChange(newValue);
+            textareaRef.current.focus();
+          }
+        },
+        title: "Italic (Ctrl+I)",
+        "aria-label": "Italic"
+      },
+      /* @__PURE__ */ import_react39.default.createElement("em", null, "I")
+    ), /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-toolbar-btn",
+        onClick: () => {
+          if (textareaRef.current) {
+            const start = textareaRef.current.selectionStart;
+            const end = textareaRef.current.selectionEnd;
+            const selectedText = internalValue.substring(start, end);
+            const newValue = internalValue.substring(0, start) + `[${selectedText || "link text"}](url)` + internalValue.substring(end);
+            setInternalValue(newValue);
+            onChange(newValue);
+            textareaRef.current.focus();
+          }
+        },
+        title: "Link (Ctrl+K)",
+        "aria-label": "Link"
+      },
+      "\u{1F517}"
+    )), /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-toolbar-group" }, /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: `editor-toolbar-btn ${showPreviewPanel ? "active" : ""}`,
+        onClick: () => setShowPreviewPanel(!showPreviewPanel),
+        title: "Toggle preview",
+        "aria-label": "Toggle preview",
+        "aria-pressed": showPreviewPanel
+      },
+      "\u{1F441}"
+    ))),
+    /* @__PURE__ */ import_react39.default.createElement("div", { className: `editor-markdown-content ${showPreviewPanel ? "split" : ""}` }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-editor" }, /* @__PURE__ */ import_react39.default.createElement(
+      "textarea",
+      {
+        ref: textareaRef,
+        className: "editor-textarea editor-markdown-textarea",
+        value: internalValue,
+        onChange: handleChange,
+        onKeyDown: handleKeyDown,
+        rows,
+        maxLength,
+        placeholder: "Enter markdown text...",
+        "aria-label": "Markdown editor",
+        style: { maxHeight }
+      }
+    ), /* @__PURE__ */ import_react39.default.createElement("div", { className: `editor-markdown-char-count ${charCountClass}` }, charCount, maxLength && ` / ${maxLength}`)), showPreviewPanel && /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-preview" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-preview-label" }, "Preview"), /* @__PURE__ */ import_react39.default.createElement(
+      "div",
+      {
+        className: "editor-markdown-preview-content",
+        dangerouslySetInnerHTML: { __html: previewHtml }
+      }
+    ))),
+    /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-footer" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-hint" }, /* @__PURE__ */ import_react39.default.createElement("kbd", null, "Ctrl+Enter"), " to save \u2022 ", /* @__PURE__ */ import_react39.default.createElement("kbd", null, "Esc"), " to cancel"), /* @__PURE__ */ import_react39.default.createElement("div", { className: "editor-markdown-actions" }, /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-btn editor-btn-secondary",
+        onClick: onCancel
+      },
+      "Cancel"
+    ), /* @__PURE__ */ import_react39.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "editor-btn editor-btn-primary",
+        onClick: onCommit
+      },
+      "Save"
+    )))
+  );
+}
+MarkdownEditor.displayName = "MarkdownEditor";
+function renderMarkdownPreview(markdown) {
+  if (!markdown) return '<p class="editor-markdown-empty">Nothing to preview</p>';
+  let html = markdown;
+  html = html.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+  html = html.replace(/^### (.*$)/gim, "<h3>$1</h3>");
+  html = html.replace(/^## (.*$)/gim, "<h2>$1</h2>");
+  html = html.replace(/^# (.*$)/gim, "<h1>$1</h1>");
+  html = html.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
+  html = html.replace(/__(.+?)__/g, "<strong>$1</strong>");
+  html = html.replace(/\*(.+?)\*/g, "<em>$1</em>");
+  html = html.replace(/_(.+?)_/g, "<em>$1</em>");
+  html = html.replace(/`(.+?)`/g, "<code>$1</code>");
+  html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>');
+  html = html.replace(/^\* (.+)$/gim, "<li>$1</li>");
+  html = html.replace(/^- (.+)$/gim, "<li>$1</li>");
+  html = html.replace(/(<li>.*<\/li>)/s, "<ul>$1</ul>");
+  html = html.replace(/\n\n/g, "</p><p>");
+  html = html.replace(/\n/g, "<br>");
+  if (!html.startsWith("<h") && !html.startsWith("<ul") && !html.startsWith("<p")) {
+    html = "<p>" + html + "</p>";
+  }
+  return html;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AdvancedFilterBuilder,
@@ -12650,6 +13946,7 @@ var PivotToolbar = ({
   ColumnFilters,
   CurrencyCell,
   DataGrid,
+  DateEditor,
   DensityToggle,
   ExportMenu,
   FacetedSearch,
@@ -12662,12 +13959,16 @@ var PivotToolbar = ({
   LayoutPersistenceManager,
   LayoutPresetsManager,
   LocalStorageAdapter,
+  MarkdownEditor,
   MarketDataEngine,
   MarketDataGrid,
+  MultiSelectEditor,
+  NumericEditor,
   PivotToolbar,
   PriorityIndicator,
   ProgressBar,
   Rating,
+  RichSelectEditor,
   ServerAdapter,
   ServerSideDataSource,
   StatusChip,
@@ -12687,14 +13988,17 @@ var PivotToolbar = ({
   createMockWebSocket,
   createPreset,
   darkTheme,
+  debounce,
   densityConfigs,
   downloadCSV,
   expandAllNodes,
   exportPivotToCSV,
   exportToCSV,
   exportToXLSX,
+  filterOptions,
   filterTree,
   flattenTree,
+  formatNumber,
   generateDensityCSS,
   generateFilename,
   generatePresetId,
@@ -12712,10 +14016,15 @@ var PivotToolbar = ({
   isTreeNode,
   loadDensityMode,
   materialTheme,
+  parseFormattedNumber,
   quartzTheme,
   saveDensityMode,
   themes,
   toggleNodeExpansion,
   useDensityMode,
-  useMarketData
+  useEditorAutoFocus,
+  useEditorClickOutside,
+  useEditorKeyboardNavigation,
+  useMarketData,
+  usePopupPosition
 });