@openg2p/registry-widgets 1.1.6-dev.2 → 1.1.6-dev.4

package/dist/index.js

@@ -1688,12 +1688,13 @@ function useWidgetTheme() {
 const WidgetContext = React.createContext({
     dataSourceRequestHandler: undefined,
     schemaData: undefined,
+    hostContext: undefined,
     t: undefined,
 });
 const useWidgetContext = () => {
     return React.useContext(WidgetContext);
 };
-const WidgetProvider = ({ store, dataSourceRequestHandler, schemaData, t, theme, children, }) => {
+const WidgetProvider = ({ store, dataSourceRequestHandler, schemaData, hostContext, t, theme, children, }) => {
     const widgetStore = React.useMemo(() => store || createWidgetStore(), [store]);
     const eventBus = React.useMemo(() => new WidgetEventBus(), []);
     const resolvedTheme = React.useMemo(() => resolveTheme(theme), [theme]);
@@ -1701,8 +1702,9 @@ const WidgetProvider = ({ store, dataSourceRequestHandler, schemaData, t, theme,
     const contextValue = React.useMemo(() => ({
         dataSourceRequestHandler,
         schemaData,
+        hostContext,
         t,
-    }), [dataSourceRequestHandler, schemaData, t]);
+    }), [dataSourceRequestHandler, schemaData, hostContext, t]);
     React.useEffect(() => {
         if (!dataSourceRequestHandler) {
             console.warn('[WidgetProvider] dataSourceRequestHandler is not provided. ' +
@@ -1850,7 +1852,7 @@ const useBaseWidget = (options) => {
         // This prevents data disappearance when switching to Edit mode and components 
         // incorrectly clear values before options load or if handler is temporarily missing.
         if (newValue === '' || newValue === null || newValue === undefined) {
-            const allowEmptyClear = config.widget === 'register-lookup';
+            const allowEmptyClear = config.widget === 'register-lookup' || config.widget === 'parent-lookup';
             if (!allowEmptyClear) {
                 if (loadingRef.current) {
                     console.warn(`[useBaseWidget] Ignoring empty value for ${widgetId} because data source is loading`);
@@ -3051,11 +3053,15 @@ const useCrViewData = (mode, currentSchemaData, storeValues) => React.useMemo(()
         return null;
     const dataSource = { ...storeValues, ...currentSchemaData };
     const recordPath = Object.keys(dataSource)[0];
+    const records = dataSource[recordPath]?.records;
+    const auditPath = Array.isArray(records) && records.length > 0
+        ? `${recordPath}.records.${records.length - 1}`
+        : recordPath;
     return {
-        createdBy: getValueByPath(dataSource, `${recordPath}.created_by`),
-        createdDate: getValueByPath(dataSource, `${recordPath}.created_at`),
-        approvedBy: getValueByPath(dataSource, `${recordPath}.last_approved_by`),
-        approvedDate: getValueByPath(dataSource, `${recordPath}.last_approved_at`),
+        createdBy: getValueByPath(dataSource, `${auditPath}.created_by`),
+        createdDate: getValueByPath(dataSource, `${auditPath}.created_at`),
+        approvedBy: getValueByPath(dataSource, `${auditPath}.last_approved_by`),
+        approvedDate: getValueByPath(dataSource, `${auditPath}.last_approved_at`),
     };
 }, [mode, currentSchemaData, storeValues]);
 
@@ -4273,6 +4279,7 @@ const SectionsContainer = ({ sections, dataSourceRequestHandler: propDataSourceR
                 }
                 return results;
             },
+            hasUnsavedChanges: () => Object.values(sectionDirtyMapRef.current).some(Boolean),
         };
     }, [store, dispatch, safeSections]);
     React.useEffect(() => {
@@ -4384,6 +4391,8 @@ const WIDGET_TYPES = [
     'display',
     'profile',
     'geo-hierarchy',
+    'register-lookup',
+    'parent-lookup',
 ];
 const ORIENTATIONS = ['horizontal', 'vertical'];
 const CONDITION_OPERATORS = [
@@ -7007,7 +7016,18 @@ const SelectWidget = ({ config }) => {
                 : (value != null && value !== '' ? tSchema(t, String(value)) : '-');
         return (jsxRuntimeExports.jsxs("div", { className: "mb-[10px] SelectDisplayWidget flex flex-col sm:flex-row sm:items-start", children: [label && (jsxRuntimeExports.jsxs("div", { className: "text-base text-gray-600 font-medium md:min-w-[120px] sm:pr-4 mb-1 sm:mb-0", style: { fontFamily: 'Roboto, sans-serif' }, title: label, children: [label, ":"] })), jsxRuntimeExports.jsx("div", { className: "flex-1", children: jsxRuntimeExports.jsx("div", { className: "text-base text-gray-900 font-medium", title: String(displayValue ?? ''), children: displayValue }) })] }));
     }
-    return (jsxRuntimeExports.jsx("div", { className: "mb-[10px]", children: jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row sm:items-start", children: [jsxRuntimeExports.jsx(WidgetFieldLabel, { className: "text-base font-medium text-gray-700 md:min-w-[120px] sm:pr-4 sm:pt-1 mb-1 sm:mb-0", label: tSchema(t, widgetConfig['widget-label']), required: isRequired }), jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntimeExports.jsxs("select", { value: value || '', onChange: (e) => onChange(e.target.value === '' ? undefined : e.target.value), onBlur: onBlur, disabled: !isEnabled || loading || widgetConfig['widget-readonly'], className: `w-full sm:w-[180px] max-w-full h-[30px] px-3 border shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 ${(touched && error.length > 0) || (widgetConfig['widget-required'] && (!value || value === ''))
+    return (jsxRuntimeExports.jsx("div", { className: "mb-[10px]", children: jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row sm:items-start", children: [jsxRuntimeExports.jsx(WidgetFieldLabel, { className: "text-base font-medium text-gray-700 md:min-w-[120px] sm:pr-4 sm:pt-1 mb-1 sm:mb-0", label: tSchema(t, widgetConfig['widget-label']), required: isRequired }), jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntimeExports.jsxs("select", { 
+                            // value={value || ''}
+                            // onChange={(e) => onChange(e.target.value === '' ? undefined : e.target.value)}
+                            value: value === undefined || value === null ? '' : String(value), onChange: (e) => {
+                                const rawValue = e.target.value;
+                                if (rawValue === '') {
+                                    onChange(undefined);
+                                    return;
+                                }
+                                const selectedOption = dataSourceOptions.find((option) => String(option.value) === rawValue);
+                                onChange(selectedOption ? selectedOption.value : rawValue);
+                            }, onBlur: onBlur, disabled: !isEnabled || loading || widgetConfig['widget-readonly'], className: `w-full sm:w-[180px] max-w-full h-[30px] px-3 border shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 ${(touched && error.length > 0) || (widgetConfig['widget-required'] && (!value || value === ''))
                                 ? 'border-red-500 focus:ring-red-500 focus:border-red-500'
                                 : 'border-gray-300'} ${!isEnabled || loading || widgetConfig['widget-readonly'] ? 'bg-gray-100 cursor-not-allowed' : 'bg-white'}`, style: { borderRadius: '10px' }, title: tSchema(t, widgetConfig['widget-data-tooltip']), children: [jsxRuntimeExports.jsx("option", { value: "", children: t?.('common.select') }), dataSourceOptions.map((option) => (jsxRuntimeExports.jsx("option", { value: option.value, children: tSchema(t, option.label) }, option.value)))] }), loading && (jsxRuntimeExports.jsx("p", { className: "text-sm text-gray-500 mt-1", children: t?.('common.loadingOptions') })), touched && error.length > 0 && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1", children: error[0] }))] })] }) }));
 };
@@ -7394,18 +7414,46 @@ const TableWidget = ({ config }) => {
     const [originalRows, setOriginalRows] = React.useState(null);
     const isSectionEditMode = !isReadonly && operations.edit;
     const isAnyRowEditing = editingState !== null || isAdding;
+    const resolveEditingRowData = React.useCallback(() => {
+        if (!editingState)
+            return null;
+        const row = { ...editingState.currentValue };
+        columns.forEach((col) => {
+            const key = col['column-key'];
+            const cellWidgetId = `${widgetConfig['widget-id']}-row-${editingState.rowIndex}-col-${key}`;
+            if (storeValues[cellWidgetId] !== undefined) {
+                row[key] = storeValues[cellWidgetId];
+            }
+        });
+        return row;
+    }, [editingState, columns, widgetConfig, storeValues]);
+    const resolveNewRowData = React.useCallback(() => {
+        if (!isAdding || !newRowData)
+            return null;
+        const row = { ...newRowData };
+        columns.forEach((col) => {
+            const key = col['column-key'];
+            const cellWidgetId = `${widgetConfig['widget-id']}-row-${rows.length}-col-${key}`;
+            if (storeValues[cellWidgetId] !== undefined) {
+                row[key] = storeValues[cellWidgetId];
+            }
+        });
+        return row;
+    }, [isAdding, newRowData, columns, widgetConfig, rows.length, storeValues]);
     const canSaveEditingRow = React.useMemo(() => {
-        if (!editingState) {
+        const rowData = resolveEditingRowData();
+        if (!rowData) {
             return false;
         }
-        return isTableRowDataValid(editingState.currentValue, columns, isReadonly, resolveSchemaLabel);
-    }, [editingState, columns, isReadonly, resolveSchemaLabel]);
+        return isTableRowDataValid(rowData, columns, isReadonly, resolveSchemaLabel);
+    }, [resolveEditingRowData, columns, isReadonly, resolveSchemaLabel]);
     const canSaveNewRow = React.useMemo(() => {
-        if (!isAdding || !newRowData) {
+        const rowData = resolveNewRowData();
+        if (!rowData) {
             return false;
         }
-        return isTableRowDataValid(newRowData, columns, isReadonly, resolveSchemaLabel);
-    }, [isAdding, newRowData, columns, isReadonly, resolveSchemaLabel]);
+        return isTableRowDataValid(rowData, columns, isReadonly, resolveSchemaLabel);
+    }, [resolveNewRowData, columns, isReadonly, resolveSchemaLabel]);
     const showConfirmation = React.useCallback((message, onConfirm, onCancel) => {
         setConfirmationState({
             show: true,
@@ -7464,29 +7512,41 @@ const TableWidget = ({ config }) => {
     }, [isAnyRowEditing, rows, showConfirmation, cancelEdit, t]);
     const updateCellValue = React.useCallback((columnKey, newValue, rowIndex) => {
         if (editingState && rowIndex !== undefined) {
-            setEditingState({
-                ...editingState,
-                currentValue: {
-                    ...editingState.currentValue,
-                    [columnKey]: newValue,
-                },
+            setEditingState((prev) => {
+                if (!prev || prev.rowIndex !== rowIndex)
+                    return prev;
+                return {
+                    ...prev,
+                    currentValue: {
+                        ...prev.currentValue,
+                        [columnKey]: newValue,
+                    },
+                };
             });
             const cellWidgetId = `${widgetConfig['widget-id']}-row-${rowIndex}-col-${columnKey}`;
             dispatch(setValue({ widgetId: cellWidgetId, value: newValue }));
         }
-        else if (isAdding && newRowData) {
-            setNewRowData({
-                ...newRowData,
-                [columnKey]: newValue,
+        else if (isAdding) {
+            setNewRowData((prev) => {
+                if (!prev)
+                    return prev;
+                return {
+                    ...prev,
+                    [columnKey]: newValue,
+                };
             });
+            if (rowIndex !== undefined) {
+                const cellWidgetId = `${widgetConfig['widget-id']}-row-${rowIndex}-col-${columnKey}`;
+                dispatch(setValue({ widgetId: cellWidgetId, value: newValue }));
+            }
         }
-    }, [editingState, isAdding, newRowData, widgetConfig, dispatch]);
+    }, [editingState, isAdding, widgetConfig, dispatch]);
     const saveEdit = React.useCallback(async () => {
-        if (!editingState)
+        const rowData = resolveEditingRowData();
+        if (!editingState || !rowData)
             return;
         if (!canSaveEditingRow)
             return;
-        const rowData = editingState.currentValue;
         const rowIndex = editingState.rowIndex;
         setLoadingRowIndex(rowIndex);
         try {
@@ -7545,7 +7605,7 @@ const TableWidget = ({ config }) => {
         finally {
             setLoadingRowIndex(null);
         }
-    }, [editingState, canSaveEditingRow, rows, onChange, dataSourceRequestHandler, apiConfig, t, isSectionEditMode, originalRows, columns, widgetConfig, dispatch]);
+    }, [editingState, canSaveEditingRow, resolveEditingRowData, rows, onChange, dataSourceRequestHandler, apiConfig, t, isSectionEditMode, originalRows, columns, widgetConfig, dispatch]);
     const startAdd = React.useCallback(() => {
         if (isAnyRowEditing) {
             cancelEdit();
@@ -7558,23 +7618,26 @@ const TableWidget = ({ config }) => {
         setNewRowData(emptyRow);
     }, [isAnyRowEditing, columns, cancelEdit]);
     const saveAdd = React.useCallback(async () => {
-        if (!isAdding || !newRowData)
+        const rowData = resolveNewRowData();
+        if (!isAdding || !rowData)
             return;
         if (!canSaveNewRow)
             return;
-        setLoadingRowIndex(-1); // Use -1 to indicate new row
+        setLoadingRowIndex(-1);
         try {
-            let savedRow = { ...newRowData };
-            // TODO: Update to use dataSourceRequestHandler pattern
+            let savedRow = { ...rowData };
             if (dataSourceRequestHandler && apiConfig.add) {
                 console.warn('[TableWidget] API add operations require migration to dataSourceRequestHandler pattern');
-                const response = newRowData;
-                if (response && typeof response === 'object') {
-                    savedRow = { ...savedRow, ...response };
+                if (rowData && typeof rowData === 'object') {
+                    savedRow = { ...savedRow, ...rowData };
                 }
             }
             savedRow = { ...savedRow, edit_action: 'ADD' };
             onChange([...rows, savedRow]);
+            columns.forEach((col) => {
+                const cellWidgetId = `${widgetConfig['widget-id']}-row-${rows.length}-col-${col['column-key']}`;
+                dispatch(resetWidget(cellWidgetId));
+            });
             setIsAdding(false);
             setNewRowData(null);
         }
@@ -7585,7 +7648,7 @@ const TableWidget = ({ config }) => {
         finally {
             setLoadingRowIndex(null);
         }
-    }, [isAdding, newRowData, canSaveNewRow, rows, onChange, dataSourceRequestHandler, apiConfig, t, isSectionEditMode]);
+    }, [isAdding, resolveNewRowData, canSaveNewRow, rows, onChange, dataSourceRequestHandler, apiConfig, t, columns, widgetConfig, dispatch]);
     const deleteRow = React.useCallback(async (rowIndex) => {
         if (isAnyRowEditing) {
             showConfirmation(t?.('table.unsavedChanges') || 'You have unsaved changes. Do you want to discard them?', () => {
@@ -7636,6 +7699,11 @@ const TableWidget = ({ config }) => {
             return editingState.currentValue[columnKey];
         }
         if (isAdding && rowIndex === rows.length) {
+            const cellWidgetId = `${widgetConfig['widget-id']}-row-${rowIndex}-col-${columnKey}`;
+            const storeValue = storeValues[cellWidgetId];
+            if (storeValue !== undefined) {
+                return storeValue;
+            }
             return newRowData?.[columnKey];
         }
         return rows[rowIndex]?.[columnKey];
@@ -7650,6 +7718,9 @@ const TableWidget = ({ config }) => {
         if (widgetType === 'select') {
             return null; // Will be handled by SelectDisplayValue component
         }
+        if (widgetType === 'parent-lookup') {
+            return null;
+        }
         if (column['widget-data-format']) {
             return formatValue(cellValue, column['widget-data-format'], column.widget);
         }
@@ -7666,7 +7737,14 @@ const TableWidget = ({ config }) => {
             setOriginalRows(null);
         }
     }, [isSectionEditMode, rows, originalRows]);
+    const editSessionKey = editingState
+        ? `edit-${editingState.rowIndex}`
+        : isAdding
+            ? `add-${rows.length}`
+            : null;
     React.useEffect(() => {
+        if (!editSessionKey)
+            return;
         if (editingState) {
             columns.forEach((col) => {
                 const columnKey = col['column-key'];
@@ -7675,9 +7753,8 @@ const TableWidget = ({ config }) => {
                 const defaultValue = cellValue !== undefined ? cellValue : (col['widget-data-default'] ?? '');
                 dispatch(setValue({ widgetId: cellWidgetId, value: defaultValue }));
             });
+            return;
         }
-    }, [editingState, columns, widgetConfig, dispatch]);
-    React.useEffect(() => {
         if (isAdding && newRowData) {
             columns.forEach((col) => {
                 const columnKey = col['column-key'];
@@ -7687,7 +7764,9 @@ const TableWidget = ({ config }) => {
                 dispatch(setValue({ widgetId: cellWidgetId, value: defaultValue }));
             });
         }
-    }, [isAdding, newRowData, columns, widgetConfig, rows.length, dispatch]);
+        // Seed only when add/edit session starts — not on every cell change.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [editSessionKey]);
     const getRowValuesForEdit = React.useCallback((rowIndex) => {
         if (editingState && editingState.rowIndex === rowIndex) {
             return editingState.currentValue ?? {};
@@ -7767,6 +7846,20 @@ const TableWidget = ({ config }) => {
                 };
                 return (jsxRuntimeExports.jsx("div", { className: "text-sm", style: getCellStyle(), children: jsxRuntimeExports.jsx(SelectDisplayValue$1, { config: cellConfig, value: cellValue }) }));
             }
+            if (widgetType === 'parent-lookup' && displayValue === null) {
+                const cellWidgetId = `${widgetConfig['widget-id']}-row-${rowIndex}-col-${columnKey}`;
+                const cellConfig = {
+                    ...column,
+                    'widget-id': cellWidgetId,
+                    'widget-label': '',
+                    'widget-readonly': true,
+                    'widget-data-path': undefined,
+                    'widget-data-default': cellValue !== undefined ? cellValue : '',
+                };
+                return (jsxRuntimeExports.jsx("div", { className: "text-sm table-cell-widget", style: getCellStyle(), children: jsxRuntimeExports.jsx(WidgetRenderer, { config: cellConfig, schemaData: {
+                            [cellWidgetId]: cellValue !== undefined ? cellValue : '',
+                        } }) }));
+            }
             return (jsxRuntimeExports.jsx("div", { className: "text-sm", style: getCellStyle(), children: displayValue }));
         }
     }, [isRowEditing, getCellValue, getDisplayValue, renderTableCell]);
@@ -7862,7 +7955,7 @@ const TableWidget = ({ config }) => {
                                 border: '1px solid var(--owt-btn-primary-border, #F07B1A)',
                                 backgroundColor: 'var(--owt-color-primary, #F5BB1A)',
                                 color: 'var(--owt-color-bg, #FFFFFF)',
-                            }, children: t?.('table.addRecord') || 'Add New Record' }) })), jsxRuntimeExports.jsx("div", { className: "overflow-x-auto border", style: { borderRadius: 'var(--owt-widget-table-border-radius, 15px)', borderColor: 'var(--owt-widget-table-border-color, #C4C4C4)' }, children: jsxRuntimeExports.jsxs("table", { className: "min-w-full", style: { borderCollapse: 'separate', borderSpacing: 0 }, children: [jsxRuntimeExports.jsx("thead", { style: { backgroundColor: 'var(--owt-widget-table-header-bg, #F6F6F6)' }, children: jsxRuntimeExports.jsxs("tr", { style: { borderBottom: '1px solid var(--owt-widget-table-row-divider, #E4E4E4)' }, children: [columns.map((col) => (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: tSchema(t, col['widget-label']) }, col['column-key']))), ((operations.edit || operations.remove) && !isReadonly) || isAnyRowEditing || isSectionEditMode ? (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: t?.('common.actions') || 'Actions' })) : null] }) }), jsxRuntimeExports.jsxs("tbody", { style: { backgroundColor: 'var(--owt-widget-table-body-bg, #FFFFFF)' }, children: [rows.length === 0 && !isAdding && (jsxRuntimeExports.jsx("tr", { children: jsxRuntimeExports.jsxs("td", { colSpan: columns.length + (((operations.edit || operations.remove) && !isReadonly) || isSectionEditMode ? 1 : 0), className: "px-4 py-6 text-center text-sm", style: { color: 'var(--owt-widget-table-empty-color, #727474)' }, children: [t?.('table.noData') || 'No records available.', operations.add && !isReadonly && ` ${t?.('table.clickToAdd') || 'Click "Add New Record" to add one.'}`] }) })), rows.map((row, rowIndex) => {
+                            }, children: t?.('table.addRecord') || 'Add New Record' }) })), jsxRuntimeExports.jsx("div", { className: "overflow-x-auto border", style: { borderRadius: 'var(--owt-widget-table-border-radius, 15px)', borderColor: 'var(--owt-widget-table-border-color, #C4C4C4)' }, children: jsxRuntimeExports.jsxs("table", { className: "min-w-full", style: { borderCollapse: 'separate', borderSpacing: 0 }, children: [jsxRuntimeExports.jsx("thead", { style: { backgroundColor: 'var(--owt-widget-table-header-bg, #F6F6F6)' }, children: jsxRuntimeExports.jsxs("tr", { style: { borderBottom: '1px solid var(--owt-widget-table-row-divider, #E4E4E4)' }, children: [columns.map((col) => (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: tSchema(t, col['column-label'] || col['widget-label'] || col['column-key']) }, col['column-key']))), ((operations.edit || operations.remove) && !isReadonly) || isAnyRowEditing || isSectionEditMode ? (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: t?.('common.actions') || 'Actions' })) : null] }) }), jsxRuntimeExports.jsxs("tbody", { style: { backgroundColor: 'var(--owt-widget-table-body-bg, #FFFFFF)' }, children: [rows.length === 0 && !isAdding && (jsxRuntimeExports.jsx("tr", { children: jsxRuntimeExports.jsxs("td", { colSpan: columns.length + (((operations.edit || operations.remove) && !isReadonly) || isSectionEditMode ? 1 : 0), className: "px-4 py-6 text-center text-sm", style: { color: 'var(--owt-widget-table-empty-color, #727474)' }, children: [t?.('table.noData') || 'No records available.', operations.add && !isReadonly && ` ${t?.('table.clickToAdd') || 'Click "Add New Record" to add one.'}`] }) })), rows.map((row, rowIndex) => {
                                             const isEditing = isRowEditing(rowIndex);
                                             const isLoading = loadingRowIndex === rowIndex;
                                             return (jsxRuntimeExports.jsxs("tr", { className: `${isLoading ? 'opacity-50' : ''}${isEditing ? ' table-row-editing' : ''}`, style: {
@@ -7984,7 +8077,7 @@ const DialogTableField = React.memo(function DialogTableField({ col, cellWidgetI
             widget: widgetType,
             'widget-type': col['widget-type'] || 'input',
             'widget-id': cellWidgetId,
-            'widget-label': col['widget-label'],
+            'widget-label': col['widget-label'] || col['column-label'] || col['column-key'] || '',
             'widget-readonly': isReadonly || col['widget-readonly'] === true,
             'widget-data-path': undefined,
             'widget-data-default': col['widget-data-default'],
@@ -8229,6 +8322,8 @@ const DialogTableWidget = ({ config }) => {
             return '-';
         if (widgetType === 'select')
             return null;
+        if (widgetType === 'parent-lookup')
+            return null;
         if (column['widget-data-format'])
             return formatValue(cellValue, column['widget-data-format'], column.widget);
         return String(cellValue);
@@ -8282,7 +8377,7 @@ const DialogTableWidget = ({ config }) => {
                             }, children: t?.('table.addRecord') || 'Add New Record' }) })), jsxRuntimeExports.jsx("div", { className: "overflow-x-auto border", style: {
                             borderRadius: 'var(--owt-widget-table-border-radius, 15px)',
                             borderColor: 'var(--owt-widget-table-border-color, #C4C4C4)',
-                        }, children: jsxRuntimeExports.jsxs("table", { className: "min-w-full", style: { borderCollapse: 'separate', borderSpacing: 0 }, children: [jsxRuntimeExports.jsx("thead", { style: { backgroundColor: 'var(--owt-widget-table-header-bg, #F6F6F6)' }, children: jsxRuntimeExports.jsxs("tr", { style: { borderBottom: '1px solid var(--owt-widget-table-row-divider, #E4E4E4)' }, children: [visibleColumns.map((col) => (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: tSchema(t, col['widget-label']) }, col['column-key']))), ((operations.edit || operations.remove) && !isReadonly) && (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: t?.('common.actions') || 'Actions' }))] }) }), jsxRuntimeExports.jsxs("tbody", { style: { backgroundColor: 'var(--owt-widget-table-body-bg, #FFFFFF)' }, children: [rows.length === 0 && (jsxRuntimeExports.jsx("tr", { children: jsxRuntimeExports.jsxs("td", { colSpan: visibleColumns.length + (((operations.edit || operations.remove) && !isReadonly) ? 1 : 0), className: "px-4 py-6 text-center text-sm", style: { color: 'var(--owt-widget-table-empty-color, #727474)' }, children: [t?.('table.noData') || 'No records available.', operations.add && !isReadonly && ` ${t?.('table.clickToAdd') || 'Click "Add New Record" to add one.'}`] }) })), rows.map((row, rowIndex) => {
+                        }, children: jsxRuntimeExports.jsxs("table", { className: "min-w-full", style: { borderCollapse: 'separate', borderSpacing: 0 }, children: [jsxRuntimeExports.jsx("thead", { style: { backgroundColor: 'var(--owt-widget-table-header-bg, #F6F6F6)' }, children: jsxRuntimeExports.jsxs("tr", { style: { borderBottom: '1px solid var(--owt-widget-table-row-divider, #E4E4E4)' }, children: [visibleColumns.map((col) => (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: tSchema(t, col['column-label'] || col['widget-label'] || col['column-key']) }, col['column-key']))), ((operations.edit || operations.remove) && !isReadonly) && (jsxRuntimeExports.jsx("th", { className: "px-4 py-3 text-left text-xs font-medium uppercase tracking-wider", style: { color: 'var(--owt-widget-table-header-color, #727474)' }, children: t?.('common.actions') || 'Actions' }))] }) }), jsxRuntimeExports.jsxs("tbody", { style: { backgroundColor: 'var(--owt-widget-table-body-bg, #FFFFFF)' }, children: [rows.length === 0 && (jsxRuntimeExports.jsx("tr", { children: jsxRuntimeExports.jsxs("td", { colSpan: visibleColumns.length + (((operations.edit || operations.remove) && !isReadonly) ? 1 : 0), className: "px-4 py-6 text-center text-sm", style: { color: 'var(--owt-widget-table-empty-color, #727474)' }, children: [t?.('table.noData') || 'No records available.', operations.add && !isReadonly && ` ${t?.('table.clickToAdd') || 'Click "Add New Record" to add one.'}`] }) })), rows.map((row, rowIndex) => {
                                             const cellStyle = getRowCellStyle(row?.edit_action);
                                             return (jsxRuntimeExports.jsxs("tr", { style: {
                                                     borderBottom: '1px solid var(--owt-widget-table-row-divider, #E4E4E4)',
@@ -8303,6 +8398,18 @@ const DialogTableWidget = ({ config }) => {
                                                             };
                                                             return (jsxRuntimeExports.jsx("td", { className: "px-4 py-3 whitespace-nowrap", children: jsxRuntimeExports.jsx("div", { className: "text-sm", style: cellStyle, children: jsxRuntimeExports.jsx(SelectDisplayValue, { config: displayConfig, value: row?.[key] }) }) }, key));
                                                         }
+                                                        if (widgetType === 'parent-lookup' && displayValue === null) {
+                                                            const cellWidgetId = `${widgetConfig['widget-id']}-view-row-${rowIndex}-col-${key}`;
+                                                            const displayConfig = {
+                                                                ...col,
+                                                                'widget-id': cellWidgetId,
+                                                                'widget-label': '',
+                                                                'widget-readonly': true,
+                                                                'widget-data-path': undefined,
+                                                                'widget-data-default': row?.[key] ?? '',
+                                                            };
+                                                            return (jsxRuntimeExports.jsx("td", { className: "px-4 py-3 whitespace-nowrap", children: jsxRuntimeExports.jsx("div", { className: "text-sm table-cell-widget", style: cellStyle, children: jsxRuntimeExports.jsx(WidgetRenderer, { config: displayConfig, schemaData: { [cellWidgetId]: row?.[key] ?? '' } }) }) }, key));
+                                                        }
                                                         return (jsxRuntimeExports.jsx("td", { className: "px-4 py-3 whitespace-nowrap", children: jsxRuntimeExports.jsx("div", { className: "text-sm", style: cellStyle, children: displayValue }) }, key));
                                                     }), ((operations.edit || operations.remove) && !isReadonly) && (jsxRuntimeExports.jsx("td", { className: "px-4 py-3 whitespace-nowrap", style: { minWidth: '120px' }, children: jsxRuntimeExports.jsxs("div", { className: "flex gap-2", children: [operations.edit && (jsxRuntimeExports.jsx("button", { type: "button", onClick: () => openEditDialog(rowIndex), disabled: !isEnabled, className: "px-3 py-1 text-xs disabled:opacity-50 disabled:cursor-not-allowed", style: {
                                                                         borderRadius: 'var(--owt-btn-border-radius, 10px)',
@@ -9877,7 +9984,7 @@ const normalizeDisplayFields = (row) => {
         value: f.value !== null && f.value !== undefined ? String(f.value) : '-',
     }));
 };
-const parsePagination = (pagination, rowCount, size, fallbackPage = 1) => {
+const parsePagination$1 = (pagination, rowCount, size, fallbackPage = 1) => {
     const totalItems = typeof pagination.number_of_items === 'number' ? pagination.number_of_items : rowCount;
     const totalPages = typeof pagination.number_of_pages === 'number'
         ? Math.max(1, pagination.number_of_pages)
@@ -10028,7 +10135,7 @@ const RegisterLookupWidget = ({ config }) => {
             const match = rows.find((row) => String(row.internal_record_id ?? '').trim() === target);
             if (match)
                 return match;
-            totalPages = parsePagination(pagination, rows.length, hydratePageSize).totalPages;
+            totalPages = parsePagination$1(pagination, rows.length, hydratePageSize).totalPages;
             if (page >= totalPages)
                 break;
             page += 1;
@@ -10038,7 +10145,7 @@ const RegisterLookupWidget = ({ config }) => {
     const runSearch = React.useCallback(async (text, page = 1) => {
         try {
             const { rows, pagination } = await fetchRecords(text, page, pageSize);
-            const parsed = parsePagination(pagination, rows.length, pageSize, page);
+            const parsed = parsePagination$1(pagination, rows.length, pageSize, page);
             setSearchResults(rows);
             setTotalCount(parsed.totalItems);
             setTotalPages(parsed.totalPages);
@@ -10171,6 +10278,361 @@ const RegisterLookupWidget = ({ config }) => {
                                         : t?.('common.searchHint', { defaultValue: 'Type and press Enter or click search' }) })) : (jsxRuntimeExports.jsx(ResultsTable, { rows: searchResults, selectedRowKey: pendingRow?.internal_record_id ?? null, onRowClick: setPendingRow, onRowDoubleClick: applySelection })) }), jsxRuntimeExports.jsxs("div", { className: `flex-shrink-0 flex flex-wrap items-center gap-3 px-5 py-3 border-t border-gray-200 ${totalCount !== null ? 'justify-between' : 'justify-end'}`, children: [totalCount !== null && (jsxRuntimeExports.jsx(PaginationFooter, { embedded: true, currentPage: currentPage, totalPages: totalPages, totalCount: totalCount, pageSize: pageSize, onPageChange: (page) => runSearch(searchText, page), onPrev: () => currentPage > 1 && runSearch(searchText, currentPage - 1), onNext: () => currentPage < totalPages && runSearch(searchText, currentPage + 1) })), jsxRuntimeExports.jsx("button", { type: "button", onClick: () => pendingRow && applySelection(pendingRow), disabled: !pendingRow, className: "px-4 h-9 text-sm font-medium rounded-[10px] text-white disabled:opacity-40 disabled:cursor-not-allowed flex-shrink-0", style: { backgroundColor: 'var(--owt-color-info, #2563eb)' }, children: selectRecordLabel })] })] })] }))] }));
 };
 
+const parentLookupPageCache = new Map();
+const parentLookupPageInflight = new Map();
+const parentLookupRecordCache = new Map();
+const parsePagination = (pagination, rowCount, size, fallbackPage = 1) => {
+    const totalItems = typeof pagination.number_of_items === 'number' ? pagination.number_of_items : rowCount;
+    const totalPages = typeof pagination.number_of_pages === 'number'
+        ? Math.max(1, pagination.number_of_pages)
+        : totalItems > 0
+            ? Math.max(1, Math.ceil(totalItems / size))
+            : 1;
+    return { totalItems, totalPages, currentPage: pagination.current_page ?? fallbackPage };
+};
+const parentLabel = (row) => {
+    if (!row)
+        return '';
+    if (row.record_name != null && String(row.record_name).trim() !== '') {
+        return String(row.record_name);
+    }
+    return String(row.internal_record_id ?? '');
+};
+const indexParentRecords = (rows) => {
+    for (const row of rows) {
+        const id = String(row.internal_record_id ?? '').trim();
+        if (id) {
+            parentLookupRecordCache.set(id, row);
+        }
+    }
+};
+const buildParentLookupCacheKey = (service, endpoint, method, params) => `${service}|${endpoint}|${method}|${JSON.stringify(params)}`;
+const fetchParentLookupPage = async (handler, service, endpoint, method, params, headers) => {
+    const resolvedMethod = method || 'POST';
+    const cacheKey = buildParentLookupCacheKey(service, endpoint, resolvedMethod, params);
+    const cached = parentLookupPageCache.get(cacheKey);
+    if (cached) {
+        return cached;
+    }
+    const inflight = parentLookupPageInflight.get(cacheKey);
+    if (inflight) {
+        return inflight;
+    }
+    const fetchPromise = (async () => {
+        const result = await handler(service, endpoint, resolvedMethod, params, { headers });
+        const parsed = {
+            rows: (result?.records ?? []),
+            pagination: (result?.pagination ?? {}),
+        };
+        indexParentRecords(parsed.rows);
+        parentLookupPageCache.set(cacheKey, parsed);
+        return parsed;
+    })();
+    parentLookupPageInflight.set(cacheKey, fetchPromise);
+    try {
+        return await fetchPromise;
+    }
+    finally {
+        parentLookupPageInflight.delete(cacheKey);
+    }
+};
+const ParentLookupWidget = ({ config, value: valueProp, error: errorProp, touched: touchedProp, isEnabled: isEnabledProp, isRequired: isRequiredProp, onChange: onChangeProp, onBlur: onBlurProp, }) => {
+    const hook = useBaseWidget({ config });
+    // WidgetRenderer spreads its hook result as props (includes table onValueChange).
+    // Prefer those so parent selection updates the table row / form state.
+    const useInjected = typeof onChangeProp === 'function';
+    const value = useInjected ? valueProp : hook.value;
+    const error = useInjected ? (errorProp ?? hook.error) : hook.error;
+    const touched = useInjected ? !!touchedProp : hook.touched;
+    const isEnabled = useInjected ? (isEnabledProp ?? hook.isEnabled) : hook.isEnabled;
+    const isRequired = useInjected ? !!isRequiredProp : hook.isRequired;
+    const onChange = useInjected ? onChangeProp : hook.onChange;
+    const onBlur = useInjected ? (onBlurProp ?? hook.onBlur) : hook.onBlur;
+    const widgetConfig = config;
+    const { t, dataSourceRequestHandler, hostContext } = useWidgetContext();
+    const dataSource = widgetConfig['widget-data-source'];
+    const lookupConfig = widgetConfig['widget-lookup-config'];
+    const pageSize = lookupConfig?.page_size ?? 10;
+    const isCompact = !widgetConfig['widget-label'];
+    const requestParams = React.useMemo(() => {
+        const merged = { ...(hostContext || {}) };
+        const schemaParams = dataSource?.params || {};
+        for (const [key, paramValue] of Object.entries(schemaParams)) {
+            if (paramValue !== null && paramValue !== undefined && paramValue !== '') {
+                merged[key] = paramValue;
+            }
+        }
+        return merged;
+    }, [hostContext, dataSource?.params]);
+    const [isOpen, setIsOpen] = React.useState(false);
+    const [searchText, setSearchText] = React.useState('');
+    const [searchResults, setSearchResults] = React.useState([]);
+    const [currentPage, setCurrentPage] = React.useState(1);
+    const [totalPages, setTotalPages] = React.useState(1);
+    const [totalCount, setTotalCount] = React.useState(null);
+    const [pendingRow, setPendingRow] = React.useState(null);
+    const [appliedRecord, setAppliedRecord] = React.useState(null);
+    const [isHydrating, setIsHydrating] = React.useState(false);
+    const [modalPos, setModalPos] = React.useState({ x: 80, y: 80 });
+    const [modalSize, setModalSize] = React.useState({ w: 860, h: 520 });
+    const isDragging = React.useRef(false);
+    const dragOrigin = React.useRef({ mouseX: 0, mouseY: 0, posX: 0, posY: 0 });
+    const searchInputRef = React.useRef(null);
+    const hydratedValueRef = React.useRef(null);
+    const fetchRecords = React.useCallback(async (text, page, size) => {
+        if (!dataSource?.service || !dataSource?.endpoint || !dataSourceRequestHandler) {
+            return { rows: [], pagination: {} };
+        }
+        return fetchParentLookupPage(dataSourceRequestHandler, dataSource.service, dataSource.endpoint, dataSource.method, {
+            ...requestParams,
+            search_text: text,
+            current_page: page,
+            page_size: size,
+        }, dataSource.headers);
+    }, [dataSource, dataSourceRequestHandler, requestParams]);
+    const findRecordByValue = React.useCallback(async (recordValue) => {
+        const target = String(recordValue).trim();
+        if (!target)
+            return null;
+        const cachedRecord = parentLookupRecordCache.get(target);
+        if (cachedRecord) {
+            return cachedRecord;
+        }
+        const hydratePageSize = lookupConfig?.hydrate_page_size ?? 50;
+        let page = 1;
+        let pages = 1;
+        while (page <= pages) {
+            const { rows, pagination } = await fetchRecords('', page, hydratePageSize);
+            const match = rows.find((row) => String(row.internal_record_id ?? '').trim() === target);
+            if (match)
+                return match;
+            pages = parsePagination(pagination, rows.length, hydratePageSize).totalPages;
+            if (page >= pages)
+                break;
+            page += 1;
+        }
+        return null;
+    }, [fetchRecords, lookupConfig?.hydrate_page_size]);
+    const runSearch = React.useCallback(async (text, page = 1) => {
+        try {
+            const { rows, pagination } = await fetchRecords(text, page, pageSize);
+            const parsed = parsePagination(pagination, rows.length, pageSize, page);
+            setSearchResults(rows);
+            setTotalCount(parsed.totalItems);
+            setTotalPages(parsed.totalPages);
+            setCurrentPage(parsed.currentPage);
+        }
+        catch {
+            setSearchResults([]);
+            setTotalCount(null);
+            setTotalPages(1);
+            setCurrentPage(1);
+        }
+    }, [fetchRecords, pageSize]);
+    React.useEffect(() => {
+        const onMove = (e) => {
+            if (!isDragging.current)
+                return;
+            setModalPos({
+                x: dragOrigin.current.posX + (e.clientX - dragOrigin.current.mouseX),
+                y: dragOrigin.current.posY + (e.clientY - dragOrigin.current.mouseY),
+            });
+        };
+        const onUp = () => {
+            isDragging.current = false;
+        };
+        document.addEventListener('mousemove', onMove);
+        document.addEventListener('mouseup', onUp);
+        return () => {
+            document.removeEventListener('mousemove', onMove);
+            document.removeEventListener('mouseup', onUp);
+        };
+    }, []);
+    const hasValue = value !== null && value !== undefined && value !== '';
+    const applySelection = (row) => {
+        indexParentRecords([row]);
+        hydratedValueRef.current = row.internal_record_id;
+        onChange(row.internal_record_id);
+        setAppliedRecord(row);
+        setIsOpen(false);
+    };
+    const clearSelection = () => {
+        hydratedValueRef.current = null;
+        onChange(null);
+        setAppliedRecord(null);
+        setPendingRow(null);
+    };
+    const openLookup = () => {
+        const w = Math.min(Math.round(window.innerWidth * 0.82), 940);
+        const h = Math.min(Math.round(window.innerHeight * 0.72), 560);
+        setModalPos({
+            x: Math.round((window.innerWidth - w) / 2),
+            y: Math.round((window.innerHeight - h) / 2),
+        });
+        setModalSize({ w, h });
+        setIsOpen(true);
+        setSearchText('');
+        setSearchResults([]);
+        setTotalCount(null);
+        setCurrentPage(1);
+        setTotalPages(1);
+        setPendingRow(appliedRecord);
+        setTimeout(() => searchInputRef.current?.focus(), 50);
+        runSearch('', 1);
+    };
+    React.useEffect(() => {
+        if (!hasValue) {
+            hydratedValueRef.current = null;
+            setAppliedRecord(null);
+            setIsHydrating(false);
+            return;
+        }
+        if (!dataSource?.service || !dataSource?.endpoint || !dataSourceRequestHandler)
+            return;
+        if (hydratedValueRef.current === value)
+            return;
+        let cancelled = false;
+        setIsHydrating(true);
+        setAppliedRecord(null);
+        (async () => {
+            try {
+                const match = await findRecordByValue(value);
+                if (cancelled)
+                    return;
+                hydratedValueRef.current = value;
+                setAppliedRecord(match ?? { internal_record_id: String(value) });
+            }
+            catch {
+                if (!cancelled) {
+                    hydratedValueRef.current = value;
+                    setAppliedRecord({ internal_record_id: String(value) });
+                }
+            }
+            finally {
+                if (!cancelled)
+                    setIsHydrating(false);
+            }
+        })();
+        return () => {
+            cancelled = true;
+            setIsHydrating(false);
+        };
+    }, [hasValue, value, dataSource, dataSourceRequestHandler, findRecordByValue]);
+    const isReadonly = !!widgetConfig['widget-readonly'];
+    const rawLabel = widgetConfig['widget-label'];
+    const label = tSchema(t, rawLabel || 'Parent');
+    const hasError = (touched && error.length > 0) || (!!widgetConfig['widget-required'] && !hasValue);
+    const placeholder = tSchema(t, String(lookupConfig?.action_label ?? t?.('common.select') ?? 'Select'));
+    const searchPlaceholder = tSchema(t, String(lookupConfig?.search_placeholder ?? 'Search parent...'));
+    const selectRecordLabel = tSchema(t, String(lookupConfig?.select_record_label ?? 'Select Parent'));
+    const displayName = isHydrating
+        ? t?.('common.loading', { defaultValue: 'Loading...' })
+        : parentLabel(appliedRecord) || (hasValue ? String(value) : '');
+    const selectTrigger = isCompact ? (jsxRuntimeExports.jsxs("select", { value: hasValue ? '__selected__' : '', disabled: !isEnabled || isReadonly, onMouseDown: (e) => {
+            if (!isEnabled || isReadonly)
+                return;
+            e.preventDefault();
+            openLookup();
+        }, onKeyDown: (e) => {
+            if (!isEnabled || isReadonly)
+                return;
+            if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {
+                e.preventDefault();
+                openLookup();
+            }
+        }, onChange: () => undefined, onBlur: onBlur, className: `w-full h-[28px] px-2 text-sm border focus:outline-none table-cell-input ${!isEnabled || isReadonly ? 'cursor-not-allowed' : 'cursor-pointer'}`, style: {
+            borderRadius: '10px',
+            borderColor: hasError
+                ? 'var(--owt-color-error, #B91C1C)'
+                : 'var(--owt-widget-input-border, #C4C4C4)',
+            backgroundColor: !isEnabled || isReadonly
+                ? 'var(--owt-color-bg-alt, #F6F6F6)'
+                : 'var(--owt-color-bg, #FFFFFF)',
+        }, title: hasValue ? displayName : placeholder, children: [jsxRuntimeExports.jsx("option", { value: "", children: placeholder }), hasValue && jsxRuntimeExports.jsx("option", { value: "__selected__", children: displayName })] })) : (jsxRuntimeExports.jsxs("select", { value: hasValue ? '__selected__' : '', disabled: !isEnabled || isReadonly, onMouseDown: (e) => {
+            if (!isEnabled || isReadonly)
+                return;
+            e.preventDefault();
+            openLookup();
+        }, onKeyDown: (e) => {
+            if (!isEnabled || isReadonly)
+                return;
+            if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {
+                e.preventDefault();
+                openLookup();
+            }
+        }, onChange: () => undefined, onBlur: onBlur, className: `w-full sm:w-[180px] max-w-full h-[30px] px-3 border shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 ${hasError
+            ? 'border-red-500 focus:ring-red-500 focus:border-red-500'
+            : 'border-gray-300'} ${!isEnabled || isReadonly
+            ? 'bg-gray-100 cursor-not-allowed'
+            : 'bg-white cursor-pointer'}`, style: { borderRadius: '10px' }, title: hasValue ? displayName : placeholder, children: [jsxRuntimeExports.jsx("option", { value: "", children: placeholder }), hasValue && jsxRuntimeExports.jsx("option", { value: "__selected__", children: displayName })] }));
+    if (isReadonly && !isCompact) {
+        return (jsxRuntimeExports.jsxs("div", { className: "mb-[10px] flex flex-col sm:flex-row sm:items-start", children: [rawLabel && (jsxRuntimeExports.jsxs("div", { className: "text-base text-gray-600 font-medium md:min-w-[120px] sm:pr-4 mb-1 sm:mb-0", style: { fontFamily: 'Roboto, sans-serif' }, title: label, children: [label, ":"] })), jsxRuntimeExports.jsx("div", { className: "flex-1 text-base text-gray-900 font-medium", children: hasValue ? displayName : '-' })] }));
+    }
+    if (isReadonly && isCompact) {
+        return (jsxRuntimeExports.jsx("span", { className: "text-sm text-gray-900 truncate block", children: hasValue ? displayName : '-' }));
+    }
+    return (jsxRuntimeExports.jsxs("div", { className: isCompact ? 'table-cell-field w-full' : 'mb-[10px]', children: [isCompact ? (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [selectTrigger, jsxRuntimeExports.jsx("p", { className: "table-cell-field-error", "aria-hidden": "true", children: '\u00a0' })] })) : (jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row sm:items-start", children: [rawLabel && (jsxRuntimeExports.jsx(WidgetFieldLabel, { className: "text-base font-medium text-gray-700 md:min-w-[120px] sm:pr-4 sm:pt-1 mb-1 sm:mb-0", label: rawLabel, required: isRequired })), jsxRuntimeExports.jsxs("div", { className: "flex-1 min-w-0", children: [selectTrigger, touched && error.length > 0 && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1", children: error[0] }))] })] })), isOpen && (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx("div", { className: "fixed inset-0 z-[100]", style: { backgroundColor: 'rgba(0,0,0,0.5)' }, onClick: () => {
+                            setIsOpen(false);
+                            onBlur();
+                        } }), jsxRuntimeExports.jsxs("div", { className: "flex flex-col overflow-hidden", style: {
+                            position: 'fixed',
+                            top: modalPos.y,
+                            left: modalPos.x,
+                            width: modalSize.w,
+                            height: modalSize.h,
+                            zIndex: 101,
+                            resize: 'both',
+                            minWidth: 340,
+                            minHeight: 260,
+                            maxWidth: '96vw',
+                            maxHeight: '92vh',
+                            backgroundColor: 'var(--owt-color-bg, #FFFFFF)',
+                            borderRadius: 'var(--owt-widget-card-border-radius, 20px)',
+                            boxShadow: '0 24px 64px rgba(0,0,0,0.28)',
+                        }, onClick: (e) => e.stopPropagation(), children: [jsxRuntimeExports.jsxs("div", { onMouseDown: (e) => {
+                                    e.preventDefault();
+                                    isDragging.current = true;
+                                    dragOrigin.current = {
+                                        mouseX: e.clientX,
+                                        mouseY: e.clientY,
+                                        posX: modalPos.x,
+                                        posY: modalPos.y,
+                                    };
+                                }, className: "flex items-center justify-between px-5 py-4 flex-shrink-0 select-none border-b border-gray-200 cursor-grab", children: [jsxRuntimeExports.jsx("h3", { className: "text-lg font-semibold text-gray-900", children: t?.('common.selectTitle', { label, defaultValue: `Select ${label}` }) }), jsxRuntimeExports.jsx("button", { type: "button", onClick: () => {
+                                            setIsOpen(false);
+                                            onBlur();
+                                        }, onMouseDown: (e) => e.stopPropagation(), className: "p-0 border-0 bg-transparent cursor-pointer", "aria-label": t?.('common.close', { defaultValue: 'Close' }), children: jsxRuntimeExports.jsx("img", { src: img$f, alt: "", className: "w-5 h-5 opacity-60" }) })] }), jsxRuntimeExports.jsx("div", { className: "px-5 py-3 flex-shrink-0 border-b border-gray-200", children: jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 px-3 h-[30px] border border-gray-300 rounded-[10px] bg-white", children: [jsxRuntimeExports.jsx("input", { ref: searchInputRef, type: "text", value: searchText, onChange: (e) => setSearchText(e.target.value), onKeyDown: (e) => {
+                                                if (e.key === 'Enter') {
+                                                    e.preventDefault();
+                                                    runSearch(searchText, 1);
+                                                }
+                                            }, placeholder: searchPlaceholder, className: "flex-1 outline-none text-sm text-gray-900 bg-transparent" }), jsxRuntimeExports.jsx("button", { type: "button", onClick: () => runSearch(searchText, 1), "aria-label": t?.('common.search', { defaultValue: 'Search' }), className: "flex-shrink-0 p-0 border-0 bg-transparent cursor-pointer", children: jsxRuntimeExports.jsx("img", { src: img$g, alt: "", className: "w-4 h-4 opacity-40" }) })] }) }), jsxRuntimeExports.jsx("div", { className: "overflow-auto flex-1", children: searchResults.length === 0 ? (jsxRuntimeExports.jsx("p", { className: "text-center text-sm text-gray-500 py-10", children: searchText
+                                        ? t?.('common.noResults', { defaultValue: 'No results found' })
+                                        : t?.('common.searchHint', {
+                                            defaultValue: 'Type and press Enter or click search',
+                                        }) })) : (jsxRuntimeExports.jsx("div", { className: "overflow-auto h-full", children: jsxRuntimeExports.jsxs("table", { className: "w-full text-sm border-collapse", children: [jsxRuntimeExports.jsx("thead", { className: "sticky top-0 z-[1] bg-gray-50", children: jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsx("th", { className: "text-left px-4 py-2 text-sm font-medium text-gray-600 whitespace-nowrap border-b border-gray-200 bg-gray-50", children: tSchema(t, 'record_name') }), jsxRuntimeExports.jsx("th", { className: "text-left px-4 py-2 text-sm font-medium text-gray-600 whitespace-nowrap border-b border-gray-200 bg-gray-50", children: tSchema(t, 'internal_record_id') })] }) }), jsxRuntimeExports.jsx("tbody", { children: searchResults.map((row, idx) => {
+                                                    const rowKey = row.internal_record_id ?? idx;
+                                                    const isSelected = pendingRow?.internal_record_id != null &&
+                                                        rowKey === pendingRow.internal_record_id;
+                                                    return (jsxRuntimeExports.jsxs("tr", { onClick: () => setPendingRow(row), onDoubleClick: () => applySelection(row), className: `cursor-pointer border-b border-gray-100 transition-colors ${isSelected ? 'bg-blue-100' : 'hover:bg-blue-50'}`, children: [jsxRuntimeExports.jsx("td", { className: "px-4 py-2 text-sm text-gray-900 whitespace-nowrap", children: parentLabel(row) || '-' }), jsxRuntimeExports.jsx("td", { className: "px-4 py-2 text-sm text-gray-900 whitespace-nowrap", children: row.internal_record_id != null
+                                                                    ? String(row.internal_record_id)
+                                                                    : '-' })] }, rowKey));
+                                                }) })] }) })) }), jsxRuntimeExports.jsxs("div", { className: `flex-shrink-0 flex flex-wrap items-center gap-3 px-5 py-3 border-t border-gray-200 ${totalCount !== null ? 'justify-between' : 'justify-end'}`, children: [totalCount !== null && (jsxRuntimeExports.jsxs("span", { className: "text-sm text-gray-600", children: [totalCount === 1
+                                                ? t?.('common.record', {
+                                                    count: totalCount,
+                                                    defaultValue: `${totalCount} record`,
+                                                })
+                                                : t?.('common.records', {
+                                                    count: totalCount,
+                                                    defaultValue: `${totalCount} records`,
+                                                }), totalCount > 0 &&
+                                                ` · ${(currentPage - 1) * pageSize + 1}-${Math.min(currentPage * pageSize, totalCount)}`] })), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [totalCount !== null && (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx("button", { type: "button", onClick: () => currentPage > 1 && runSearch(searchText, currentPage - 1), disabled: currentPage <= 1, className: "px-3 h-8 text-sm font-medium rounded-[10px] bg-gray-100 text-gray-700 disabled:opacity-40 disabled:cursor-not-allowed", children: t?.('common.previous', { defaultValue: 'Prev' }) }), jsxRuntimeExports.jsx("button", { type: "button", onClick: () => currentPage < totalPages && runSearch(searchText, currentPage + 1), disabled: currentPage >= totalPages, className: "px-3 h-8 text-sm font-medium rounded-[10px] bg-gray-100 text-gray-700 disabled:opacity-40 disabled:cursor-not-allowed", children: t?.('common.next', { defaultValue: 'Next' }) })] })), hasValue && (jsxRuntimeExports.jsx("button", { type: "button", onClick: () => {
+                                                    clearSelection();
+                                                    setIsOpen(false);
+                                                    onBlur();
+                                                }, className: "px-4 h-9 text-sm font-medium rounded-[10px] bg-gray-100 text-gray-700 flex-shrink-0", children: t?.('common.remove', { defaultValue: 'Clear' }) })), jsxRuntimeExports.jsx("button", { type: "button", onClick: () => pendingRow && applySelection(pendingRow), disabled: !pendingRow, className: "px-4 h-9 text-sm font-medium rounded-[10px] text-white disabled:opacity-40 disabled:cursor-not-allowed flex-shrink-0", style: { backgroundColor: 'var(--owt-color-info, #2563eb)' }, children: selectRecordLabel })] })] })] })] }))] }));
+};
+
 const MultiSelectWidget = ({ config }) => {
     const { value, error, touched, isEnabled, isRequired, onChange, onBlur, dataSourceOptions, loading, config: widgetConfig, } = useBaseWidget({ config });
     const { t } = useWidgetContext();
@@ -11375,6 +11837,7 @@ const registerDefaultWidgets = () => {
     widgetRegistry.register({ widget: 'scores-display', component: ScoresDisplayWidget });
     widgetRegistry.register({ widget: 'id-authentication', component: IdAuthenticationWidget });
     widgetRegistry.register({ widget: 'register-lookup', component: RegisterLookupWidget });
+    widgetRegistry.register({ widget: 'parent-lookup', component: ParentLookupWidget });
     widgetRegistry.register({ widget: 'multi-select', component: MultiSelectWidget });
     widgetRegistry.register({ widget: 'geo-hierarchy', component: GeoHierarchyWidget });
     widgetRegistry.register({ widget: 'docs', component: DocsWidget });
@@ -11499,6 +11962,7 @@ exports.JSONEditorPanel = JSONEditorPanel;
 exports.MultiSelectWidget = MultiSelectWidget;
 exports.NumberInputWidget = NumberInputWidget;
 exports.PanelRenderer = PanelRenderer;
+exports.ParentLookupWidget = ParentLookupWidget;
 exports.PhoneInputWidget = PhoneInputWidget;
 exports.ProfileWidget = ProfileWidget;
 exports.PropertyEditor = PropertyEditor;