In Joint-JS, inspector to only open properties of the column from table when clicked on that specific column?

Question

I am using a table in which when clicked on a column should only open the properties of that column, not the whole table

const HIGHLIGHTER_ID = 'table-selected',
            table = tableView.model as Table,
            tableName = table.getName();

        TableHighlighter.add(tableView, 'root', HIGHLIGHTER_ID);
        const columnDetails = table.clone();

        if (columnClickEvt) {
            const itemId = columnClickEvt.target.attributes['item-id'].value,
                selectedColumn = table.getColumnByName(itemId);
            columnDetails.setColumns([selectedColumn]);
        }

        const inspector = new ui.Inspector({
            cell: (columnClickEvt ? columnDetails : table),
            theme: 'default',
            inputs: {
                'attrs/headerLabel/text': {
                    label: 'Name',
                    type: 'text'
                },
                'columns': {
                    label: 'Columns',
                    type: 'list',
                    addButtonLabel: 'Add Column',
                    removeButtonLabel: 'Remove Column',
                    item: {
                        type: 'object',
                        properties: {
                            name: {
                                label: 'Name',
                                type: 'text'
                            },
                            type: {
                                label: 'Type',
                                type: 'select',
                                options: AllowedDataTypes
                            }
                        }
                    }
                }
            }

Isolated the selected column from a click event but cloning the table would never render the changed values in the properties.

Answer 1

JointJS has no feature like this as of yet. Seems like you need write custom code regarding this.