I need to develop a custom control or directive that includes a dropdown list, search box, and tree view, as shown in the image below. When the dropdown list is clicked, it should display the search box and tree view. Selecting an item from the tree view should update the dropdown list with the selected value. Entering a value in the search box should filter the tree view to display matching results within the hierarchy. For example, searching for "Option 1.1.1" should show "Option 1 > Option 1.1 > Option 1.1.1" as the result.
My current implementation, obtained from Github here, is not functioning correctly.
I am also open to alternative solutions like using Kendo UI with AngularJS, provided they offer similar functionality to what I require.
Demo: demo.controller.js
// Controller code here
Directive: tree-dropdown.js
// Directive code here
CSS: tree-dropdown.css
// CSS styles go here
index.html
// HTML structure and script references