diff --git a/apps/console/src/components/DashboardView.tsx b/apps/console/src/components/DashboardView.tsx
index 92e72506a3..c27080ab46 100644
--- a/apps/console/src/components/DashboardView.tsx
+++ b/apps/console/src/components/DashboardView.tsx
@@ -51,6 +51,27 @@ function createWidgetId(): string {
   return `widget_${Date.now()}_${widgetCounter}`;
 }
 
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+/** Ensure every widget in the schema has a unique id. */
+function ensureWidgetIds(schema: DashboardSchema): DashboardSchema {
+  if (!schema.widgets?.length) return schema;
+  const needsFix = schema.widgets.some((w) => !w.id);
+  if (!needsFix) return schema;
+  return {
+    ...schema,
+    widgets: schema.widgets.map((w) => (w.id ? w : { ...w, id: createWidgetId() })),
+  };
+}
+
+/** Resolve a human-friendly default title for a new widget type. */
+function defaultWidgetTitle(type: string): string {
+  const entry = WIDGET_TYPES.find((t) => t.type === type);
+  return entry ? `New ${entry.label}` : 'New Widget';
+}
+
 // ---------------------------------------------------------------------------
 // Helpers: flatten / unflatten widget config for WidgetConfigPanel
 // ---------------------------------------------------------------------------
@@ -120,7 +141,7 @@ export function DashboardView({ dataSource }: { dataSource?: any }) {
     queueMicrotask(() => setIsLoading(false));
   }, [dashboardName]);
 
-  const { dashboards } = useMetadata();
+  const { dashboards, objects: metadataObjects } = useMetadata();
   const dashboard = dashboards?.find((d: any) => d.name === dashboardName);
 
   // Local schema state for live preview — initialized from metadata
@@ -142,7 +163,7 @@ export function DashboardView({ dataSource }: { dataSource?: any }) {
 
   // ---- Open / close config panel ------------------------------------------
   const handleOpenConfigPanel = useCallback(() => {
-    setEditSchema(dashboard as DashboardSchema);
+    setEditSchema(ensureWidgetIds(dashboard as DashboardSchema));
     setConfigPanelOpen(true);
     setConfigVersion((v) => v + 1);
   }, [dashboard]);
@@ -159,7 +180,7 @@ export function DashboardView({ dataSource }: { dataSource?: any }) {
       const id = createWidgetId();
       const newWidget: DashboardWidgetSchema = {
         id,
-        title: '',
+        title: defaultWidgetTitle(type),
         type,
         layout: {
           x: 0,
@@ -290,6 +311,33 @@ export function DashboardView({ dataSource }: { dataSource?: any }) {
     [selectedWidgetId],
   );
 
+  // ---- Metadata-driven dropdown options -----------------------------------
+  const availableObjects = useMemo(() => {
+    if (!metadataObjects?.length) return undefined;
+    return metadataObjects.map((obj: any) => ({
+      value: obj.name,
+      label: obj.label || obj.name,
+    }));
+  }, [metadataObjects]);
+
+  const availableFields = useMemo(() => {
+    const objectName = selectedWidget?.object;
+    if (!objectName || !metadataObjects?.length) return undefined;
+    const obj = metadataObjects.find((o: any) => o.name === objectName);
+    if (!obj?.fields) return undefined;
+    const fields = obj.fields;
+    if (Array.isArray(fields)) {
+      return fields
+        .filter((f: any) => f.name)
+        .map((f: any) => ({ value: f.name, label: f.label || f.name }));
+    }
+    // fields can be Record<string, FieldMetadata>
+    return Object.entries(fields).map(([key, f]: [string, any]) => ({
+      value: key,
+      label: f.label || key,
+    }));
+  }, [selectedWidget?.object, metadataObjects]);
+
   // ---- Loading / not-found guards -----------------------------------------
   if (isLoading) {
     return <SkeletonDashboard />;
@@ -377,6 +425,8 @@ export function DashboardView({ dataSource }: { dataSource?: any }) {
              config={widgetConfig}
              onSave={handleWidgetConfigSave}
              onFieldChange={handleWidgetFieldChange}
+             availableObjects={availableObjects}
+             availableFields={availableFields}
              headerExtra={
                <Button
                  size="sm"
diff --git a/packages/plugin-dashboard/src/WidgetConfigPanel.tsx b/packages/plugin-dashboard/src/WidgetConfigPanel.tsx
index 262467d201..b76af83e75 100644
--- a/packages/plugin-dashboard/src/WidgetConfigPanel.tsx
+++ b/packages/plugin-dashboard/src/WidgetConfigPanel.tsx
@@ -10,7 +10,9 @@ import * as React from 'react';
 import {
   ConfigPanelRenderer,
   useConfigDraft,
+  Combobox,
 } from '@object-ui/components';
+import { ConfigRow } from '@object-ui/components';
 import type { ConfigPanelSchema, ConfigField } from '@object-ui/components';
 
 // ---------------------------------------------------------------------------
@@ -50,117 +52,199 @@ const AGGREGATE_OPTIONS = [
 ];
 
 // ---------------------------------------------------------------------------
-// Schema — describes the WidgetConfigPanel structure
+// Schema builder — creates a ConfigPanelSchema with dynamic options for
+// object/field selectors when metadata is available.
 // ---------------------------------------------------------------------------
 
-const widgetSchema: ConfigPanelSchema = {
-  breadcrumb: ['Dashboard', 'Widget'],
-  sections: [
-    {
-      key: 'general',
-      title: 'General',
-      fields: [
-        {
-          key: 'title',
-          label: 'Title',
-          type: 'input',
-          placeholder: 'Widget title',
-        },
-        {
-          key: 'description',
-          label: 'Description',
-          type: 'input',
-          placeholder: 'Widget description',
-        },
-        {
-          key: 'type',
-          label: 'Widget type',
-          type: 'select',
-          options: WIDGET_TYPE_OPTIONS,
-          defaultValue: 'metric',
-        },
-      ],
-    },
-    {
-      key: 'data',
-      title: 'Data Binding',
-      collapsible: true,
-      fields: [
-        {
-          key: 'object',
-          label: 'Data source',
-          type: 'input',
-          placeholder: 'Object name',
-        },
-        {
-          key: 'categoryField',
-          label: 'Category field',
-          type: 'input',
-          placeholder: 'e.g. status',
-        },
-        {
-          key: 'valueField',
-          label: 'Value field',
-          type: 'input',
-          placeholder: 'e.g. amount',
-        },
-        {
-          key: 'aggregate',
-          label: 'Aggregation',
-          type: 'select',
-          options: AGGREGATE_OPTIONS,
-          defaultValue: 'count',
-        },
-      ],
-    },
-    {
-      key: 'layout',
-      title: 'Layout',
-      collapsible: true,
-      fields: [
-        {
-          key: 'layoutW',
-          label: 'Width (columns)',
-          type: 'slider',
-          min: 1,
-          max: 12,
-          step: 1,
-          defaultValue: 1,
-        },
-        {
-          key: 'layoutH',
-          label: 'Height (rows)',
-          type: 'slider',
-          min: 1,
-          max: 6,
-          step: 1,
-          defaultValue: 1,
-        },
-      ],
-    },
-    {
-      key: 'appearance',
-      title: 'Appearance',
-      collapsible: true,
-      defaultCollapsed: true,
-      fields: [
-        {
-          key: 'colorVariant',
-          label: 'Color variant',
-          type: 'select',
-          options: COLOR_VARIANT_OPTIONS,
-          defaultValue: 'default',
-        },
-        {
-          key: 'actionUrl',
-          label: 'Action URL',
-          type: 'input',
-          placeholder: 'https://...',
-        },
-      ],
-    },
-  ],
-};
+export type SelectOption = { value: string; label: string };
+
+function buildWidgetSchema(
+  availableObjects?: SelectOption[],
+  availableFields?: SelectOption[],
+): ConfigPanelSchema {
+  const hasObjects = availableObjects && availableObjects.length > 0;
+  const hasFields = availableFields && availableFields.length > 0;
+
+  const objectField: ConfigField = hasObjects
+    ? {
+        key: 'object',
+        label: 'Data source',
+        type: 'custom',
+        render: (value: any, onChange: (v: any) => void) => (
+          <ConfigRow label="Data source">
+            <div data-testid="config-field-object">
+              <Combobox
+                options={availableObjects}
+                value={value ?? ''}
+                onValueChange={onChange}
+                placeholder="Select object…"
+                searchPlaceholder="Search objects…"
+                emptyText="No objects found."
+                className="h-7 w-32 text-xs"
+              />
+            </div>
+          </ConfigRow>
+        ),
+      }
+    : {
+        key: 'object',
+        label: 'Data source',
+        type: 'input',
+        placeholder: 'Object name',
+      };
+
+  const categoryFieldDef: ConfigField = hasObjects
+    ? {
+        key: 'categoryField',
+        label: 'Category field',
+        type: 'custom',
+        render: (value: any, onChange: (v: any) => void, draft: Record<string, any>) => (
+          <ConfigRow label="Category field">
+            <div data-testid="config-field-categoryField">
+              <Combobox
+                options={hasFields ? availableFields : []}
+                value={value ?? ''}
+                onValueChange={onChange}
+                placeholder="Select field…"
+                searchPlaceholder="Search fields…"
+                emptyText="No fields found."
+                className="h-7 w-32 text-xs"
+                disabled={!draft.object}
+              />
+            </div>
+          </ConfigRow>
+        ),
+      }
+    : {
+        key: 'categoryField',
+        label: 'Category field',
+        type: 'input',
+        placeholder: 'e.g. status',
+      };
+
+  const valueFieldDef: ConfigField = hasObjects
+    ? {
+        key: 'valueField',
+        label: 'Value field',
+        type: 'custom',
+        render: (value: any, onChange: (v: any) => void, draft: Record<string, any>) => (
+          <ConfigRow label="Value field">
+            <div data-testid="config-field-valueField">
+              <Combobox
+                options={hasFields ? availableFields : []}
+                value={value ?? ''}
+                onValueChange={onChange}
+                placeholder="Select field…"
+                searchPlaceholder="Search fields…"
+                emptyText="No fields found."
+                className="h-7 w-32 text-xs"
+                disabled={!draft.object}
+              />
+            </div>
+          </ConfigRow>
+        ),
+      }
+    : {
+        key: 'valueField',
+        label: 'Value field',
+        type: 'input',
+        placeholder: 'e.g. amount',
+      };
+
+  return {
+    breadcrumb: ['Dashboard', 'Widget'],
+    sections: [
+      {
+        key: 'general',
+        title: 'General',
+        fields: [
+          {
+            key: 'title',
+            label: 'Title',
+            type: 'input',
+            placeholder: 'Widget title',
+          },
+          {
+            key: 'description',
+            label: 'Description',
+            type: 'input',
+            placeholder: 'Widget description',
+          },
+          {
+            key: 'type',
+            label: 'Widget type',
+            type: 'select',
+            options: WIDGET_TYPE_OPTIONS,
+            defaultValue: 'metric',
+          },
+        ],
+      },
+      {
+        key: 'data',
+        title: 'Data Binding',
+        collapsible: true,
+        fields: [
+          objectField,
+          categoryFieldDef,
+          valueFieldDef,
+          {
+            key: 'aggregate',
+            label: 'Aggregation',
+            type: 'select',
+            options: AGGREGATE_OPTIONS,
+            defaultValue: 'count',
+          },
+        ],
+      },
+      {
+        key: 'layout',
+        title: 'Layout',
+        collapsible: true,
+        fields: [
+          {
+            key: 'layoutW',
+            label: 'Width (columns)',
+            type: 'slider',
+            min: 1,
+            max: 12,
+            step: 1,
+            defaultValue: 1,
+          },
+          {
+            key: 'layoutH',
+            label: 'Height (rows)',
+            type: 'slider',
+            min: 1,
+            max: 6,
+            step: 1,
+            defaultValue: 1,
+          },
+        ],
+      },
+      {
+        key: 'appearance',
+        title: 'Appearance',
+        collapsible: true,
+        defaultCollapsed: true,
+        fields: [
+          {
+            key: 'colorVariant',
+            label: 'Color variant',
+            type: 'select',
+            options: COLOR_VARIANT_OPTIONS,
+            defaultValue: 'default',
+          },
+          {
+            key: 'actionUrl',
+            label: 'Action URL',
+            type: 'input',
+            placeholder: 'https://...',
+          },
+        ],
+      },
+    ],
+  };
+}
 
 // ---------------------------------------------------------------------------
 // Props
@@ -179,6 +263,10 @@ export interface WidgetConfigPanelProps {
   onFieldChange?: (field: string, value: any) => void;
   /** Extra content rendered in the header row (e.g. delete button) */
   headerExtra?: React.ReactNode;
+  /** Available data-source objects for dropdown selection */
+  availableObjects?: SelectOption[];
+  /** Available fields of the currently selected object for dropdown selection */
+  availableFields?: SelectOption[];
 }
 
 // ---------------------------------------------------------------------------
@@ -200,16 +288,23 @@ export function WidgetConfigPanel({
   onSave,
   onFieldChange,
   headerExtra,
+  availableObjects,
+  availableFields,
 }: WidgetConfigPanelProps) {
   const { draft, isDirty, updateField, discard } = useConfigDraft(config, {
     onUpdate: onFieldChange,
   });
 
+  const schema = React.useMemo(
+    () => buildWidgetSchema(availableObjects, availableFields),
+    [availableObjects, availableFields],
+  );
+
   return (
     <ConfigPanelRenderer
       open={open}
       onClose={onClose}
-      schema={widgetSchema}
+      schema={schema}
       draft={draft}
       isDirty={isDirty}
       onFieldChange={updateField}
diff --git a/packages/plugin-dashboard/src/__tests__/DashboardWithConfig.test.tsx b/packages/plugin-dashboard/src/__tests__/DashboardWithConfig.test.tsx
index 72cc3190e2..d47a501f29 100644
--- a/packages/plugin-dashboard/src/__tests__/DashboardWithConfig.test.tsx
+++ b/packages/plugin-dashboard/src/__tests__/DashboardWithConfig.test.tsx
@@ -175,4 +175,36 @@ describe('DashboardWithConfig', () => {
     const container = screen.getByTestId('dashboard-with-config');
     expect(container.className).toContain('custom-class');
   });
+
+  it('should show Dashboard > Configuration breadcrumb when no widget is selected', () => {
+    render(
+      <DashboardWithConfig
+        schema={sampleSchema}
+        config={sampleConfig}
+        onConfigSave={vi.fn()}
+        defaultConfigOpen={true}
+      />,
+    );
+    expect(screen.getByText('Dashboard')).toBeDefined();
+    expect(screen.getByText('Configuration')).toBeDefined();
+    // Widget breadcrumb should NOT be present
+    expect(screen.queryByText('Widget')).toBeNull();
+  });
+
+  it('should accept onWidgetSave prop without errors', () => {
+    const onWidgetSave = vi.fn();
+    render(
+      <DashboardWithConfig
+        schema={sampleSchema}
+        config={sampleConfig}
+        onConfigSave={vi.fn()}
+        onWidgetSave={onWidgetSave}
+        defaultConfigOpen={true}
+      />,
+    );
+    // Config panel should open showing Dashboard config by default (no widget selected)
+    expect(screen.getByText('Dashboard')).toBeDefined();
+    expect(screen.getByText('Configuration')).toBeDefined();
+    expect(screen.queryByText('Widget')).toBeNull();
+  });
 });
diff --git a/packages/plugin-dashboard/src/__tests__/WidgetConfigPanel.test.tsx b/packages/plugin-dashboard/src/__tests__/WidgetConfigPanel.test.tsx
index 7e30f304a7..f86c870103 100644
--- a/packages/plugin-dashboard/src/__tests__/WidgetConfigPanel.test.tsx
+++ b/packages/plugin-dashboard/src/__tests__/WidgetConfigPanel.test.tsx
@@ -231,4 +231,106 @@ describe('WidgetConfigPanel', () => {
     const descInput = screen.getByTestId('config-field-description') as HTMLInputElement;
     expect(descInput.value).toBe('Monthly revenue breakdown');
   });
+
+  // ---- Searchable combobox tests (availableObjects / availableFields) ------
+
+  describe('with availableObjects', () => {
+    const objects = [
+      { value: 'accounts', label: 'Accounts' },
+      { value: 'contacts', label: 'Contacts' },
+      { value: 'orders', label: 'Orders' },
+    ];
+
+    it('should render data source as a combobox when availableObjects provided', () => {
+      render(
+        <WidgetConfigPanel
+          open={true}
+          onClose={vi.fn()}
+          config={defaultWidgetConfig}
+          onSave={vi.fn()}
+          availableObjects={objects}
+        />,
+      );
+      // The data source field should be a combobox (not a text input)
+      const wrapper = screen.getByTestId('config-field-object');
+      const comboboxBtn = wrapper.querySelector('[role="combobox"]');
+      expect(comboboxBtn).toBeTruthy();
+    });
+
+    it('should render data source as an input when no availableObjects', () => {
+      render(
+        <WidgetConfigPanel
+          open={true}
+          onClose={vi.fn()}
+          config={defaultWidgetConfig}
+          onSave={vi.fn()}
+        />,
+      );
+      const objectField = screen.getByTestId('config-field-object');
+      expect(objectField.tagName).toBe('INPUT');
+    });
+
+    it('should render category/value fields as comboboxes when availableObjects provided', () => {
+      const fields = [
+        { value: 'name', label: 'Name' },
+        { value: 'status', label: 'Status' },
+      ];
+      render(
+        <WidgetConfigPanel
+          open={true}
+          onClose={vi.fn()}
+          config={defaultWidgetConfig}
+          onSave={vi.fn()}
+          availableObjects={objects}
+          availableFields={fields}
+        />,
+      );
+      const catWrapper = screen.getByTestId('config-field-categoryField');
+      expect(catWrapper.querySelector('[role="combobox"]')).toBeTruthy();
+      const valWrapper = screen.getByTestId('config-field-valueField');
+      expect(valWrapper.querySelector('[role="combobox"]')).toBeTruthy();
+    });
+
+    it('should disable field comboboxes when object is not selected', () => {
+      const configWithNoObject = { ...defaultWidgetConfig, object: '' };
+      render(
+        <WidgetConfigPanel
+          open={true}
+          onClose={vi.fn()}
+          config={configWithNoObject}
+          onSave={vi.fn()}
+          availableObjects={objects}
+        />,
+      );
+      const catWrapper = screen.getByTestId('config-field-categoryField');
+      const catBtn = catWrapper.querySelector('[role="combobox"]');
+      expect(catBtn).toHaveAttribute('disabled');
+      const valWrapper = screen.getByTestId('config-field-valueField');
+      const valBtn = valWrapper.querySelector('[role="combobox"]');
+      expect(valBtn).toHaveAttribute('disabled');
+    });
+
+    it('should not disable field comboboxes when object is selected', () => {
+      const fields = [
+        { value: 'name', label: 'Name' },
+        { value: 'amount', label: 'Amount' },
+      ];
+      render(
+        <WidgetConfigPanel
+          open={true}
+          onClose={vi.fn()}
+          config={defaultWidgetConfig}
+          onSave={vi.fn()}
+          availableObjects={objects}
+          availableFields={fields}
+        />,
+      );
+      const catWrapper = screen.getByTestId('config-field-categoryField');
+      const catBtn = catWrapper.querySelector('[role="combobox"]');
+      expect(catBtn).not.toHaveAttribute('disabled');
+      const valWrapper = screen.getByTestId('config-field-valueField');
+      const valBtn = valWrapper.querySelector('[role="combobox"]');
+      expect(valBtn).not.toHaveAttribute('disabled');
+    });
+  });
 });
diff --git a/packages/plugin-dashboard/src/__tests__/ensureWidgetIds.test.tsx b/packages/plugin-dashboard/src/__tests__/ensureWidgetIds.test.tsx
new file mode 100644
index 0000000000..b05a85514f
--- /dev/null
+++ b/packages/plugin-dashboard/src/__tests__/ensureWidgetIds.test.tsx
@@ -0,0 +1,103 @@
+/**
+ * Tests for the ensureWidgetIds helper pattern.
+ * Validates that widgets without IDs get auto-assigned unique IDs.
+ */
+
+import { describe, it, expect } from 'vitest';
+import type { DashboardSchema } from '@object-ui/types';
+
+/**
+ * Portable implementation of ensureWidgetIds — mirrors
+ * apps/console/src/components/DashboardView.tsx.
+ */
+let counter = 0;
+function createWidgetId(): string {
+  counter += 1;
+  return `widget_test_${counter}`;
+}
+
+function ensureWidgetIds(schema: DashboardSchema): DashboardSchema {
+  if (!schema.widgets?.length) return schema;
+  const needsFix = schema.widgets.some((w) => !w.id);
+  if (!needsFix) return schema;
+  return {
+    ...schema,
+    widgets: schema.widgets.map((w) => (w.id ? w : { ...w, id: createWidgetId() })),
+  };
+}
+
+describe('ensureWidgetIds', () => {
+  beforeEach(() => {
+    counter = 0;
+  });
+  it('should return same schema when all widgets have IDs', () => {
+    const schema: DashboardSchema = {
+      type: 'dashboard',
+      columns: 3,
+      widgets: [
+        { id: 'w1', title: 'A', type: 'metric' },
+        { id: 'w2', title: 'B', type: 'bar' },
+      ],
+    };
+    const result = ensureWidgetIds(schema);
+    expect(result).toBe(schema); // same reference — no mutation
+  });
+
+  it('should assign IDs to widgets missing them', () => {
+    const schema: DashboardSchema = {
+      type: 'dashboard',
+      columns: 3,
+      widgets: [
+        { title: 'No ID', type: 'metric' },
+        { id: 'w2', title: 'Has ID', type: 'bar' },
+      ],
+    };
+    const result = ensureWidgetIds(schema);
+    expect(result).not.toBe(schema);
+    expect(result.widgets[0].id).toBeTruthy();
+    expect(result.widgets[1].id).toBe('w2');
+  });
+
+  it('should handle empty widgets array', () => {
+    const schema: DashboardSchema = {
+      type: 'dashboard',
+      columns: 3,
+      widgets: [],
+    };
+    const result = ensureWidgetIds(schema);
+    expect(result).toBe(schema);
+  });
+
+  it('should generate unique IDs for multiple missing widgets', () => {
+    const schema: DashboardSchema = {
+      type: 'dashboard',
+      columns: 3,
+      widgets: [
+        { title: 'A', type: 'metric' },
+        { title: 'B', type: 'bar' },
+        { title: 'C', type: 'pie' },
+      ],
+    };
+    const result = ensureWidgetIds(schema);
+    const ids = result.widgets.map((w) => w.id);
+    // All IDs should be unique
+    expect(new Set(ids).size).toBe(ids.length);
+    // All IDs should be truthy
+    ids.forEach((id) => expect(id).toBeTruthy());
+  });
+
+  it('should preserve existing widget data', () => {
+    const schema: DashboardSchema = {
+      type: 'dashboard',
+      columns: 3,
+      widgets: [
+        { title: 'Revenue', type: 'metric', object: 'orders', layout: { x: 0, y: 0, w: 2, h: 1 } },
+      ],
+    };
+    const result = ensureWidgetIds(schema);
+    expect(result.widgets[0].title).toBe('Revenue');
+    expect(result.widgets[0].type).toBe('metric');
+    expect(result.widgets[0].object).toBe('orders');
+    expect(result.widgets[0].layout).toEqual({ x: 0, y: 0, w: 2, h: 1 });
+  });
+});