How to combine autocompleteInput and Selector

Hi , everyone I am making small application. I want to know how to combine autocompleteInput and Selector. Do you know this function? Because my app have many items. So sometimes user want to select item by myself and other time , they want to input item number by themselves.

Screenshot 1

Now , I don’t know how to combine. so this app have selector and autocompleteInput.

When user input in autocomplete column, change x value automatically.

Screenshot 2

Autocomplete value reflect to x columns value. on the other hand , user change x value, reflect to Autocomplete input.

Screenshot 3

I want to combine this function and want to execute in one column.

My simple code

from typing import Any
from bokeh.models.annotations import Title
import hvplot.pandas  # noqa
import numpy as np
import pandas as pd
import panel as pn
import param

INDICES = ["v1", "v2", "v3", "v4"]

# Definition ReactiveTable Class
class ReactiveTable(pn.viewable.Viewer):
    table = param.DataFrame()  # x,y table
    count = param.Integer()    # number of items
    random = param.Action(lambda x: x.param.trigger("random"), label="Random")
    x = param.ObjectSelector(INDICES[0], objects=INDICES, label="x")  # selector x
    y = param.ObjectSelector(INDICES[1], objects=INDICES, label="y")  # selector y
    Autocomplete_area = pn.widgets.AutocompleteInput(name='Autocomplete Input', options=INDICES, placeholder='Write something here')    
    table_widget = param.Parameter()  # to get table_widget.selection to work in depends
    Toggle_tf = param.Boolean() # <--- 20211220 add Toggle_tf param

    def __init__(self, **params):
        self.table_widget = pn.Param(self.param.table)[0]
        self.Toggle = pn.widgets.Toggle.from_param(self.param.Toggle_tf,name='Push Toggle', button_type='default') # <<-- 20211220 add button_widget

    def change_data(self) :
        size = np.random.randint(5, 15)
        nums = np.random.randint(10,55)                      # <--- 2021/12/06  Change nums of items 
        self.count = nums                                    # <--- 2021/12/06  Display nums of items
        INDICES = [ str('v'+str(i)) for i in range(nums) ]   # <--- 2021/12/06  Make a new indices list
        self.table = pd.DataFrame(
        {i: np.random.randint(1, 100, size) for i in INDICES}
        self.param.x.objects = INDICES   # change selector x lists
        self.param.y.objects = INDICES   # change selector y lists
        self.Autocomplete_area.options = INDICES

    # Definition click random button
    #@param.depends("random", watch=True, on_init=True)
    @param.depends('Toggle_tf',watch=True, on_init=True)
    def _fill_table_with_random_data(self):
        if hasattr(self, "tabs") : 
            if self.Toggle_tf == True :       
       = 'Finish'
                self.Toggle.button_type = 'primary'
            else :
       = 'Push Toggle'
                self.Toggle.button_type = 'default'
        else :

    # Definition click table widget
    @param.depends("table_widget.selection", watch=True)
    def _set_x_with_table_selection(self):
        OBJECT = (self.param.x.objects)
        if self.table_widget.selection:
            self.x = OBJECT[self.table_widget.selection[0]]
            if hasattr(self, "tabs") : = 0  # if it is not initial , self has tabs objects. so change active tab=0 
            self.x = OBJECT[0]
        # self.count += 1 # <--- 2021/12/06 Comment out

    # Definition select x value
    def _set_table_selection_with_x(self):
        OBJECT = (self.param.x.objects)
        self.table_widget.selection = [OBJECT.index(self.x)]
        self.Autocomplete_area.value = self.x

    def _set_table_selection_with_Autocomplete_area(self):
        OBJECT = (self.Autocomplete_area.options)
        sel = self.Autocomplete_area.value
        if (sel in OBJECT) : 
            self.table_widget.selection = [OBJECT.index(self.Autocomplete_area.value)]

    # Definition select x,y value or click random button
#    @param.depends("x", "y", "random")
    @param.depends("x", "y", "Toggle_tf")

    def plot(self):
        return self.table.T.hvplot.scatter(
            x=self.x, y=self.y, color="red", grid=True, xlim=(0, 100), ylim=(0, 100) 

    # Definition update data table
    def table_list(self):
        return pn.pane.DataFrame(self.table, sizing_mode="fixed")

    # Definition panel layout
    def __panel__(self):
        # Layout
        graph_layout = pn.Row(
                pn.pane.Markdown("## Update table"),
            pn.panel(self.plot, sizing_mode="fixed"),
        list_layout = pn.Column(self.table_widget, self.param.count, self.param.random)

        self.tabs = pn.Tabs(
            ("Graph", graph_layout),
            ("List", list_layout),
   if hasattr(self, "tabs") else 0,

        return pn.template.FastListTemplate(
            title="Panel Sample",

# run app
if __name__ == "__main__":
    app = ReactiveTable()
elif __name__.startswith("bokeh"):
    app = ReactiveTable()

I want to save space in screen . Could anyone help and teach me good solution?

Best regards,