@bit.rhplus/ag-grid 0.0.123 → 0.0.124

package/Editors/ModuleLookupEditor.jsx

@@ -62,6 +62,7 @@ const ModuleLookupEditor = React.forwardRef(({
   moduleDefinition,
   allowFreeText = false,
   rowHeight = 42,
+  autoOpen = true,
 }, _ref) => {
 
   // ─── Hooks (vždy voláno) ──────────────────────────────────────────────────────
@@ -109,6 +110,12 @@ const ModuleLookupEditor = React.forwardRef(({
 
   const [inputText, setInputText] = useState(initialText);
   const [dropdownOpen, setDropdownOpen] = useState(false);
+
+  useEffect(() => {
+    if (autoOpen) {
+      setDropdownOpen(true);
+    }
+  }, [autoOpen]);
   const [multiMatchData, setMultiMatchData] = useState([]);
   const [multiMatchModalOpen, setMultiMatchModalOpen] = useState(false);
   const catalogModalOpenRef = useRef(false);
@@ -117,7 +124,7 @@ const ModuleLookupEditor = React.forwardRef(({
   multiMatchModalOpenRef.current = multiMatchModalOpen;
   const currentTextRef = useRef(initialText);
   const inputTextRef = useRef(initialText);   // vždy aktuální inputText pro native handler
-  const freeTextWrapperRef = useRef(null);    // ref na wrapper div → querySelector('input')
+  const editorWrapperRef = useRef(null);      // ref na wrapper div → querySelector('input')
   const isStoppedRef = useRef(false);
   const justSelectedRef = useRef(false);
   // Nastaven synchronně před každým stopEditing() voláním.
@@ -133,6 +140,7 @@ const ModuleLookupEditor = React.forwardRef(({
   // Ref na suggestions a handleAutoCompleteSelect — přístupné v capture handleru bez stale closure
   const suggestionsRef = useRef([]);
   const handleAutoCompleteSelectRef = useRef(null);
+  const handleCatalogSelectChangeRef = useRef(null);
 
   // ─── Lokální filtrování návrhů (bez API volání) ───────────────────────────────
   const suggestions = React.useMemo(() => {
@@ -143,12 +151,22 @@ const ModuleLookupEditor = React.forwardRef(({
           const label = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || '';
           return label.toLowerCase().includes(inputText.toLowerCase());
         });
-    return source.slice(0, 15).map(item => ({
-      value: String(item[vf]),
-      label: moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || '',
-      item,
-    }));
-  }, [allItems, inputText, moduleDefinition]);
+    const result = source.map(item => {
+      const displayText = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf] || '');
+      const originalLabel = moduleDefinition?.renderOption ? moduleDefinition.renderOption(item, displayText) : displayText;
+      return {
+        value: String(item[vf]),
+        label: (
+          <div data-mle-value={String(item[vf])} style={{ display: 'contents' }}>
+            {originalLabel}
+          </div>
+        ),
+        displayText,
+        item,
+      };
+    });
+    return allowFreeText ? result.slice(0, 50) : result;
+  }, [allItems, inputText, moduleDefinition, allowFreeText]);
   suggestionsRef.current = suggestions;
 
   // ─── AG Grid useGridCellEditor ───────────────────────────────────────────────
@@ -215,6 +233,7 @@ const ModuleLookupEditor = React.forwardRef(({
     if (onValueChange) onValueChange(item);
     setTimeout(() => stopEditing(), 0);
   }, [allItems, moduleDefinition, onValueChange, stopEditing]);
+  handleCatalogSelectChangeRef.current = handleCatalogSelectChange;
 
   const catalogCurrentId = React.useMemo(() => {
     if (allowFreeText || !value) return null;
@@ -358,8 +377,7 @@ const ModuleLookupEditor = React.forwardRef(({
   // rc-select volá stopPropagation() na Enter v bubble fázi → náš React onKeyDown
   // na wrapperu ho nikdy nedostane. Capture-phase native listener se spustí jako první.
   useEffect(() => {
-    if (!allowFreeText) return;
-    const el = freeTextWrapperRef.current;
+    const el = editorWrapperRef.current;
     if (!el) return;
     const input = el.querySelector('input');
     if (!input) return;
@@ -383,17 +401,41 @@ const ModuleLookupEditor = React.forwardRef(({
       if (activeOptionEl) {
         e.stopImmediatePropagation();
         e.preventDefault();
-        const labelText = activeOptionEl.querySelector('.ant-select-item-option-content')?.textContent?.trim();
-        if (labelText) {
-          const matched = suggestionsRef.current.find((s) => s.label === labelText);
-          if (matched) {
-            handleAutoCompleteSelectRef.current?.(matched.value, matched);
-            return;
+        const contentEl = activeOptionEl.querySelector('.ant-select-item-option-content');
+        if (contentEl) {
+          const mleValue = contentEl.querySelector('[data-mle-value]')?.getAttribute('data-mle-value');
+          if (mleValue) {
+            const matched = suggestionsRef.current.find((s) => s.value === mleValue);
+            if (matched) {
+              if (allowFreeText) {
+                handleAutoCompleteSelectRef.current?.(matched.value, matched);
+              } else {
+                handleCatalogSelectChangeRef.current?.(matched.value);
+              }
+              return;
+            }
+          }
+          
+          const spanText = contentEl.querySelector('span')?.textContent?.trim();
+          const fullText = contentEl.textContent?.trim();
+          const labelText = spanText || fullText;
+          if (labelText) {
+            const matched = suggestionsRef.current.find((s) => s.displayText === labelText || String(s.label) === labelText);
+            if (matched) {
+              if (allowFreeText) {
+                handleAutoCompleteSelectRef.current?.(matched.value, matched);
+              } else {
+                handleCatalogSelectChangeRef.current?.(matched.value);
+              }
+              return;
+            }
           }
         }
         return;
       }
 
+      if (!allowFreeText) return;
+
       const text = inputTextRef.current || '';
       // Prázdný input bez předchozí hodnoty → nechat AG Grid zpracovat (cancel)
       if (!text.trim() && pendingValueRef.current === null && !initialText) return;
@@ -442,27 +484,39 @@ const ModuleLookupEditor = React.forwardRef(({
   // ─── Render: catalog-only mód ─────────────────────────────────────────────────
   if (!allowFreeText) {
     const vf = moduleDefinition?.valueField || 'id';
-    const selectOptions = allItems.map(item => ({
-      value: item[vf],
-      label: moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf]),
-    }));
+    const selectOptions = allItems.map(item => {
+      const displayText = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf] || '');
+      const originalLabel = moduleDefinition?.renderOption ? moduleDefinition.renderOption(item, displayText) : displayText;
+      return {
+        value: item[vf],
+        label: (
+          <div data-mle-value={String(item[vf])} style={{ display: 'contents' }}>
+            {originalLabel}
+          </div>
+        ),
+        displayText,
+      };
+    });
 
     return (
-      <div style={{ width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }}>
+      <div style={{ width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }} ref={editorWrapperRef}>
         <div style={{ display: 'flex', flex: 1, height: '100%' }}>
           <Select
             style={{ flex: 1, height: '100%' }}
             value={catalogCurrentId}
             options={selectOptions}
+            optionLabelProp="displayText"
             loading={allItemsLoading}
             showSearch
             filterOption={(input, option) =>
-              String(option?.label || '').toLowerCase().includes(input.toLowerCase())
+              String(option?.displayText || option?.label || '').toLowerCase().includes(input.toLowerCase())
             }
             onChange={handleCatalogSelectChange}
+            onSearch={handleInputChange}
             getPopupContainer={() => document.body}
             dropdownStyle={{ zIndex: 9999 }}
             placeholder={moduleDefinition?.placeholder || 'Vyberte...'}
+            defaultOpen={autoOpen}
             autoFocus
           />
           <Button icon={<SearchOutlined />} onMouseDown={e => e.preventDefault()} onClick={() => setCatalogModalOpen(true)} type="primary" style={{ height: '100%', borderRadius: 0 }} />
@@ -475,7 +529,7 @@ const ModuleLookupEditor = React.forwardRef(({
   // ─── Render: free-text mód ────────────────────────────────────────────────────
   return (
     <div style={{ width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }}>
-      <div ref={freeTextWrapperRef} style={{ display: 'flex', flex: 1, height: '100%' }}>
+      <div ref={editorWrapperRef} style={{ display: 'flex', flex: 1, height: '100%' }}>
         <AutoComplete
           style={{ flex: 1 }}
           value={inputText}

package/Editors/RouteCellEditor.jsx

@@ -0,0 +1,124 @@
+/* eslint-disable */
+import React, { useState, useRef, useCallback, useEffect } from 'react';
+import { useGridCellEditor } from 'ag-grid-react';
+import DraggableModal from '@bit.rhplus/draggable-modal';
+import { useSharedGridItems } from '@bit.rhplus/shared-grid-form';
+
+/**
+ * Vnitřní komponenta editoru — přístup k Jotai SharedGridForm kontextu.
+ */
+const RouteEditorInner = ({
+  instanceId,
+  initialData,
+  gridComponent: GridComponent,
+  onCancel,
+  onSave,
+}) => {
+  const { effectiveItems, setItems } = useSharedGridItems(instanceId);
+  const distanceKmRef = useRef(null);
+
+  // Inicializace dat při mountu
+  useEffect(() => {
+    if (Array.isArray(initialData)) {
+      setItems(initialData);
+    }
+  }, []); // Pouze při mountu
+
+  const handleRouteCalculated = useCallback((info) => {
+    if (info?.distance != null && info.distance > 0) {
+      distanceKmRef.current = Math.round(info.distance / 1000);
+    }
+  }, []);
+
+  const handleOk = useCallback(() => {
+    onSave(effectiveItems, distanceKmRef.current);
+  }, [effectiveItems, onSave]);
+
+  return (
+    <DraggableModal
+      title="Editace trasy"
+      open={true}
+      onOk={handleOk}
+      onCancel={onCancel}
+      width={1100}
+      height="80vh"
+      resizable={true}
+      getContainer={() => document.body}
+      destroyOnClose
+      styles={{ body: { height: '100%', overflow: 'hidden', padding: 0 } }}
+      centered
+      maskClosable={false}
+    >
+      <div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
+        <GridComponent instanceId={instanceId} showAddButton={true} onRouteCalculated={handleRouteCalculated} />
+      </div>
+    </DraggableModal>
+  );
+};
+
+/**
+ * RouteCellEditor — AG Grid 35 Cell Editor pro správu tras.
+ *
+ * Používá useGridCellEditor hook (povinné v AG Grid 31+).
+ * Props jsou předány přímo z AG Grid (value, onValueChange, stopEditing + cellEditorParams).
+ */
+/**
+ * RouteCellEditor — AG Grid 35 Cell Editor pro správu tras.
+ *
+ * Používá useGridCellEditor hook (povinné v AG Grid 31+).
+ * Props jsou předány přímo z AG Grid (value, onValueChange, stopEditing + cellEditorParams).
+ *
+ * @param {Function} transformValue - volitelná funkce z cellEditorParams pro transformaci
+ *   effectiveItems před uložením (např. pro převod temp ID na null a type string na transportTypeId).
+ *   Pokud není zadána, data se uloží bez transformace.
+ */
+const RouteCellEditor = ({ value, onValueChange, stopEditing, data, gridComponent: GridComponent, transformValue }) => {
+  const [visible, setVisible] = useState(true);
+
+  // Ref pro synchronní přístup z getValue() — AG Grid 35 volá getValue() při stopEditing()
+  const valueRef = useRef(value);
+
+  // AG Grid 35: useGridCellEditor je povinné pro správné getValue() při stopEditing()
+  useGridCellEditor({
+    getValue: () => valueRef.current,
+  });
+
+  // Stabilní instanceId pro celý editační proces
+  const [instanceId] = useState(() => `route-editor-${data?.id || Date.now()}`);
+
+  const handleSave = useCallback((items, distanceKm) => {
+    // Transformace dat před uložením — připraví formát kompatibilní s backendem
+    const prepared = transformValue ? transformValue(items) : items;
+    const payload = distanceKm != null ? { routes: prepared, destination: distanceKm } : prepared;
+    valueRef.current = payload;
+    if (onValueChange) onValueChange(payload);
+    setVisible(false);
+    stopEditing();
+  }, [transformValue, onValueChange, stopEditing]);
+
+  const handleCancel = useCallback(() => {
+    setVisible(false);
+    setTimeout(() => stopEditing(true), 0); // true = cancel, necommitovat
+  }, [stopEditing]);
+
+  if (!visible) return null;
+
+  if (!GridComponent) {
+    console.error('RouteCellEditor: gridComponent missing in cellEditorParams');
+    return null;
+  }
+
+  return (
+    <RouteEditorInner
+      instanceId={instanceId}
+      initialData={value}
+      gridComponent={GridComponent}
+      onSave={handleSave}
+      onCancel={handleCancel}
+    />
+  );
+};
+
+RouteCellEditor.displayName = 'RouteCellEditor';
+
+export default RouteCellEditor;

package/Editors/index.jsx

@@ -1,3 +1,4 @@
 export {default as DatePickerEditor} from './DatePickerEditor';
 export {default as ModuleLookupEditor} from './ModuleLookupEditor';
 export {default as AddressLookupEditor} from './AddressLookupEditor';
+export {default as RouteCellEditor} from './RouteCellEditor';

package/OnCellValueChanged.js

@@ -1,5 +1,4 @@
-
-/* eslint-disable no-param-reassign */
+/* eslint-disable */
 export const RhPlusOnCellValueChanged = (event, options) => 
 {
   console.log("onCellValueChanged");

package/Renderers/RouteCellRenderer.jsx

@@ -0,0 +1,76 @@
+/* eslint-disable */
+import React from 'react';
+import { MapPin, Flag, ChevronRight } from 'lucide-react';
+
+/**
+ * RouteCellRenderer — zobrazuje trasu se šipkami a ikonami pro nakládku/vykládku.
+ * Bucovice => slavkov u Brna => brno => praha
+ */
+const RouteCellRenderer = (params) => {
+  const routes = params.value || params.data?.routes || [];
+  if (!Array.isArray(routes) || routes.length === 0) {
+    return <span style={{ color: '#bfbfbf', fontStyle: 'italic' }}>Nezadána</span>;
+  }
+
+
+  return (
+    <div style={{ 
+      display: 'flex', 
+      alignItems: 'center', 
+      gap: '4px', 
+      overflow: 'hidden', 
+      height: '100%',
+      padding: '0 4px'
+    }}>
+      {routes.map((route, index) => {
+        const isLast = index === routes.length - 1;
+        const isFirst = index === 0;
+        
+        // Typ: 1 = loading (nakládka), 2 = unloading (vykládka)
+        const transportTypeId = route.transportTypeId || (route.type === 'loading' ? 1 : 2);
+        
+        const isLoading = transportTypeId === 1;
+        const color = isLoading ? '#1890ff' : '#52c41a';
+        const Icon = isLoading ? MapPin : Flag;
+        
+        const name = route.project?.name || route.name || route.address || '???';
+
+        return (
+          <React.Fragment key={route.id || index}>
+            <div style={{ 
+              display: 'flex', 
+              alignItems: 'center', 
+              gap: '2px', 
+              flexShrink: 0,
+              maxWidth: '120px'
+            }}>
+              <Icon 
+                size={14} 
+                color={color} 
+                fill={isFirst || isLast ? `${color}33` : 'none'} 
+                style={{ flexShrink: 0 }}
+              />
+              <span style={{ 
+                fontSize: '12px', 
+                fontWeight: isFirst || isLast ? '500' : '400',
+                overflow: 'hidden',
+                textOverflow: 'ellipsis',
+                whiteSpace: 'nowrap',
+                color: '#262626'
+              }}>
+                {name}
+              </span>
+            </div>
+            {!isLast && (
+              <ChevronRight size={12} color="#bfbfbf" style={{ flexShrink: 0 }} />
+            )}
+          </React.Fragment>
+        );
+      })}
+    </div>
+  );
+};
+
+RouteCellRenderer.displayName = 'RouteCellRenderer';
+
+export default RouteCellRenderer;

package/Renderers/SelectCellRenderer.jsx

@@ -2,16 +2,37 @@
 import React from 'react';
 import * as LucideIcons from 'lucide-react';
 
-export default ({value, displayField = 'name', imageField = null}) => {
+export default (params) => {
+    const { value, data, displayField = 'name', imageField = null, icon, iconColor } = params;
     if (value == null) return null;
+
     const displayText = typeof value === 'object'
         ? (value[displayField] ?? value.name ?? '')
         : String(value);
-    const icon = value?.icon;
+
     const imageUrl = imageField && typeof value === 'object' ? value[imageField] : null;
 
-    // Přímý přístup ke komponentě ikony
-    const Icon = icon && LucideIcons[icon] ? LucideIcons[icon] : null;
+    // Lucide ikona z hodnoty (hodnota má pole icon s názvem Lucide komponenty)
+    const lucideIconName = value?.icon;
+    const LucideIcon = !imageUrl && !icon && lucideIconName && LucideIcons[lucideIconName]
+        ? LucideIcons[lucideIconName]
+        : null;
+
+    // Custom ikona předaná přes cellRendererParams.icon — může být element, funkce nebo komponenta
+    let iconElement = null;
+    if (!imageUrl && icon) {
+        const resolvedColor = typeof iconColor === 'function' ? iconColor({ data, value }) : iconColor;
+        const colorStyle = resolvedColor ? { color: resolvedColor } : {};
+
+        if (React.isValidElement(icon)) {
+            iconElement = React.cloneElement(icon, { style: { ...colorStyle, ...icon.props.style } });
+        } else if (typeof icon === 'function') {
+            const rendered = icon({ data, value });
+            iconElement = resolvedColor && React.isValidElement(rendered)
+                ? React.cloneElement(rendered, { style: { ...colorStyle, ...rendered.props?.style } })
+                : rendered;
+        }
+    }
 
     return (
         <div style={{
@@ -29,14 +50,19 @@ export default ({value, displayField = 'name', imageField = null}) => {
                     onError={(e) => { e.currentTarget.style.display = 'none'; }}
                 />
             )}
-            {!imageUrl && Icon && (
+            {iconElement && (
+                <span style={{ flexShrink: 0, display: 'flex', alignItems: 'center' }}>
+                    {iconElement}
+                </span>
+            )}
+            {!iconElement && LucideIcon && (
                 <span style={{ flexShrink: 0, display: 'flex', alignItems: 'center' }}>
-                    <Icon size={16} />
+                    <LucideIcon size={16} />
                 </span>
             )}
             <span style={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>
                 {displayText}
             </span>
         </div>
-    )
+    );
 }

package/Renderers/index.jsx

@@ -2,3 +2,4 @@ export {default as SelectCellRenderer} from './SelectCellRenderer';
 export {default as ModuleLookupRenderer} from './ModuleLookupRenderer';
 export {default as AddressLookupRenderer} from './AddressLookupRenderer';
 export {default as NumberedListRenderer} from './NumberedListRenderer';
+export {default as RouteCellRenderer} from './RouteCellRenderer';

package/dist/Editors/ModuleLookupEditor.js

@@ -53,7 +53,7 @@ document.addEventListener('focusin', (e) => {
  *   1 shoda → auto-výběr + ikona 🔗
  *   2+ shody → multi-match modal → uživatel vybere → 🔗
  */
-const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing, moduleDefinition, allowFreeText = false, rowHeight = 42, }, _ref) => {
+const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing, moduleDefinition, allowFreeText = false, rowHeight = 42, autoOpen = true, }, _ref) => {
     // ─── Hooks (vždy voláno) ──────────────────────────────────────────────────────
     const { fetchDataUIAsync } = useData();
     const { accessToken } = useOidcAccessToken();
@@ -97,6 +97,11 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
     }, []); // jen při mount
     const [inputText, setInputText] = useState(initialText);
     const [dropdownOpen, setDropdownOpen] = useState(false);
+    useEffect(() => {
+        if (autoOpen) {
+            setDropdownOpen(true);
+        }
+    }, [autoOpen]);
     const [multiMatchData, setMultiMatchData] = useState([]);
     const [multiMatchModalOpen, setMultiMatchModalOpen] = useState(false);
     const catalogModalOpenRef = useRef(false);
@@ -105,7 +110,7 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
     multiMatchModalOpenRef.current = multiMatchModalOpen;
     const currentTextRef = useRef(initialText);
     const inputTextRef = useRef(initialText); // vždy aktuální inputText pro native handler
-    const freeTextWrapperRef = useRef(null); // ref na wrapper div → querySelector('input')
+    const editorWrapperRef = useRef(null); // ref na wrapper div → querySelector('input')
     const isStoppedRef = useRef(false);
     const justSelectedRef = useRef(false);
     // Nastaven synchronně před každým stopEditing() voláním.
@@ -119,6 +124,7 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
     // Ref na suggestions a handleAutoCompleteSelect — přístupné v capture handleru bez stale closure
     const suggestionsRef = useRef([]);
     const handleAutoCompleteSelectRef = useRef(null);
+    const handleCatalogSelectChangeRef = useRef(null);
     // ─── Lokální filtrování návrhů (bez API volání) ───────────────────────────────
     const suggestions = React.useMemo(() => {
         const vf = moduleDefinition?.valueField || 'id';
@@ -128,12 +134,18 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
                 const label = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || '';
                 return label.toLowerCase().includes(inputText.toLowerCase());
             });
-        return source.slice(0, 15).map(item => ({
-            value: String(item[vf]),
-            label: moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || '',
-            item,
-        }));
-    }, [allItems, inputText, moduleDefinition]);
+        const result = source.map(item => {
+            const displayText = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf] || '');
+            const originalLabel = moduleDefinition?.renderOption ? moduleDefinition.renderOption(item, displayText) : displayText;
+            return {
+                value: String(item[vf]),
+                label: (_jsx("div", { "data-mle-value": String(item[vf]), style: { display: 'contents' }, children: originalLabel })),
+                displayText,
+                item,
+            };
+        });
+        return allowFreeText ? result.slice(0, 50) : result;
+    }, [allItems, inputText, moduleDefinition, allowFreeText]);
     suggestionsRef.current = suggestions;
     // ─── AG Grid useGridCellEditor ───────────────────────────────────────────────
     // AG Grid 35 vyžaduje getValue() pro získání výsledné hodnoty při stopEditing().
@@ -195,6 +207,7 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
             onValueChange(item);
         setTimeout(() => stopEditing(), 0);
     }, [allItems, moduleDefinition, onValueChange, stopEditing]);
+    handleCatalogSelectChangeRef.current = handleCatalogSelectChange;
     const catalogCurrentId = React.useMemo(() => {
         if (allowFreeText || !value)
             return null;
@@ -343,9 +356,7 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
     // rc-select volá stopPropagation() na Enter v bubble fázi → náš React onKeyDown
     // na wrapperu ho nikdy nedostane. Capture-phase native listener se spustí jako první.
     useEffect(() => {
-        if (!allowFreeText)
-            return;
-        const el = freeTextWrapperRef.current;
+        const el = editorWrapperRef.current;
         if (!el)
             return;
         const input = el.querySelector('input');
@@ -369,16 +380,41 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
             if (activeOptionEl) {
                 e.stopImmediatePropagation();
                 e.preventDefault();
-                const labelText = activeOptionEl.querySelector('.ant-select-item-option-content')?.textContent?.trim();
-                if (labelText) {
-                    const matched = suggestionsRef.current.find((s) => s.label === labelText);
-                    if (matched) {
-                        handleAutoCompleteSelectRef.current?.(matched.value, matched);
-                        return;
+                const contentEl = activeOptionEl.querySelector('.ant-select-item-option-content');
+                if (contentEl) {
+                    const mleValue = contentEl.querySelector('[data-mle-value]')?.getAttribute('data-mle-value');
+                    if (mleValue) {
+                        const matched = suggestionsRef.current.find((s) => s.value === mleValue);
+                        if (matched) {
+                            if (allowFreeText) {
+                                handleAutoCompleteSelectRef.current?.(matched.value, matched);
+                            }
+                            else {
+                                handleCatalogSelectChangeRef.current?.(matched.value);
+                            }
+                            return;
+                        }
+                    }
+                    const spanText = contentEl.querySelector('span')?.textContent?.trim();
+                    const fullText = contentEl.textContent?.trim();
+                    const labelText = spanText || fullText;
+                    if (labelText) {
+                        const matched = suggestionsRef.current.find((s) => s.displayText === labelText || String(s.label) === labelText);
+                        if (matched) {
+                            if (allowFreeText) {
+                                handleAutoCompleteSelectRef.current?.(matched.value, matched);
+                            }
+                            else {
+                                handleCatalogSelectChangeRef.current?.(matched.value);
+                            }
+                            return;
+                        }
                     }
                 }
                 return;
             }
+            if (!allowFreeText)
+                return;
             const text = inputTextRef.current || '';
             // Prázdný input bez předchozí hodnoty → nechat AG Grid zpracovat (cancel)
             if (!text.trim() && pendingValueRef.current === null && !initialText)
@@ -402,14 +438,19 @@ const ModuleLookupEditor = React.forwardRef(({ value, onValueChange, stopEditing
     // ─── Render: catalog-only mód ─────────────────────────────────────────────────
     if (!allowFreeText) {
         const vf = moduleDefinition?.valueField || 'id';
-        const selectOptions = allItems.map(item => ({
-            value: item[vf],
-            label: moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf]),
-        }));
-        return (_jsxs("div", { style: { width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }, children: [_jsxs("div", { style: { display: 'flex', flex: 1, height: '100%' }, children: [_jsx(Select, { style: { flex: 1, height: '100%' }, value: catalogCurrentId, options: selectOptions, loading: allItemsLoading, showSearch: true, filterOption: (input, option) => String(option?.label || '').toLowerCase().includes(input.toLowerCase()), onChange: handleCatalogSelectChange, getPopupContainer: () => document.body, dropdownStyle: { zIndex: 9999 }, placeholder: moduleDefinition?.placeholder || 'Vyberte...', autoFocus: true }), _jsx(Button, { icon: _jsx(SearchOutlined, {}), onMouseDown: e => e.preventDefault(), onClick: () => setCatalogModalOpen(true), type: "primary", style: { height: '100%', borderRadius: 0 } })] }), catalogModalContent] }));
+        const selectOptions = allItems.map(item => {
+            const displayText = moduleDefinition?.getDisplayValue?.(item) || item.code || item.name || String(item[vf] || '');
+            const originalLabel = moduleDefinition?.renderOption ? moduleDefinition.renderOption(item, displayText) : displayText;
+            return {
+                value: item[vf],
+                label: (_jsx("div", { "data-mle-value": String(item[vf]), style: { display: 'contents' }, children: originalLabel })),
+                displayText,
+            };
+        });
+        return (_jsxs("div", { style: { width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }, ref: editorWrapperRef, children: [_jsxs("div", { style: { display: 'flex', flex: 1, height: '100%' }, children: [_jsx(Select, { style: { flex: 1, height: '100%' }, value: catalogCurrentId, options: selectOptions, optionLabelProp: "displayText", loading: allItemsLoading, showSearch: true, filterOption: (input, option) => String(option?.displayText || option?.label || '').toLowerCase().includes(input.toLowerCase()), onChange: handleCatalogSelectChange, onSearch: handleInputChange, getPopupContainer: () => document.body, dropdownStyle: { zIndex: 9999 }, placeholder: moduleDefinition?.placeholder || 'Vyberte...', defaultOpen: autoOpen, autoFocus: true }), _jsx(Button, { icon: _jsx(SearchOutlined, {}), onMouseDown: e => e.preventDefault(), onClick: () => setCatalogModalOpen(true), type: "primary", style: { height: '100%', borderRadius: 0 } })] }), catalogModalContent] }));
     }
     // ─── Render: free-text mód ────────────────────────────────────────────────────
-    return (_jsxs("div", { style: { width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }, children: [_jsxs("div", { ref: freeTextWrapperRef, style: { display: 'flex', flex: 1, height: '100%' }, children: [_jsx(AutoComplete, { style: { flex: 1 }, value: inputText, options: suggestions, open: dropdownOpen && suggestions.length > 0, defaultActiveFirstOption: false, allowClear: true, onChange: handleInputChange, onClear: handleClear, onSelect: handleAutoCompleteSelect, onFocus: () => setDropdownOpen(true), onBlur: () => {
+    return (_jsxs("div", { style: { width: '100%', minWidth: 250, height: rowHeight, display: 'flex', alignItems: 'stretch' }, children: [_jsxs("div", { ref: editorWrapperRef, style: { display: 'flex', flex: 1, height: '100%' }, children: [_jsx(AutoComplete, { style: { flex: 1 }, value: inputText, options: suggestions, open: dropdownOpen && suggestions.length > 0, defaultActiveFirstOption: false, allowClear: true, onChange: handleInputChange, onClear: handleClear, onSelect: handleAutoCompleteSelect, onFocus: () => setDropdownOpen(true), onBlur: () => {
                             setTimeout(() => setDropdownOpen(false), 150);
                             handleBlur();
                         }, notFoundContent: allItemsLoading ? 'Načítání...' : null, placeholder: moduleDefinition?.placeholder || 'Zadejte nebo vyberte...', autoFocus: true }), _jsx(Button, { icon: _jsx(SearchOutlined, {}), onMouseDown: e => e.preventDefault(), onClick: () => {