feat(cdk-experimental/combobox): introduce new signals-based combobox

[wagnermaciel]

• Create the Combobox UI Pattern class
• Create the CdkCombobox, CdkComboboxInput, CdkComboboxPopupContainer, and CdkComboboxPopup directives
• Create 6 component examples.

[github-actions]

Deployed dev-app for ea2d807 to: https://ng-dev-previews-comp--pr-angular-components-31872-dev-jwmz3vug.web.app

Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt.

[ok7sai]

Maybe adding an inputEl property to CdkCombobox and assign that value instead of deep assignment?

[ok7sai]

I kinda feel the filtering should be a business logic not handled by Angular Aria. The combobox with filtering can be achieved like

<div cdkCombobox>
  <input cdkCombobox [(ngModel)]="inputValue" />

  <div popover>
    <ng-template cdkComboboxPopupContainer>
      <ul cdkListbox [(value)]="selection">
        @for (item of items; track item) {
           if (match(inputValue, item)) {
             <li cdkOption>{{ item }}</li>
           }
         }
      </ul>
    </ng-template>
  </div>
</div>

so that Combobox only takes care of what's been rendered in the popup, and we also don't need to use inert to implicitly tell what's being filtered out.

[ok7sai]

I am trying to understand the logic here (and the same logic in the tree). The logic seems to unset an active item if the active item is no longer in the list, but in what situation this applies? Removing it doesn't seem to affect the local build to me.

[ok7sai]

Probably should pass selected value back to combobox via popup controls instead of implementing them in both listbox and tree.

[ok7sai]

nit: maybe worth adding this to the TreePattern and also use this property for host binding? [attr.role]="pattern.role()"

[ok7sai]

Originally I wanted to make the Controls/Actions interface to only contain callback functions so 3p developers can embed non-Angular components (in different component life-cycle), and all the states/props are done via template inputs. Now it seems like we would need developers to implement states using Signals.

I am fine with the decision, but just want to mention what was the intention of the Controls/Actions interface.

[wagnermaciel]

Ah, that's a great point. We should discuss whether the Controls should avoid using signals. A simple workaround would be to change this to just getActiveId so it is communicated as more of a "read" than a "binding"

[ok7sai]

It's fairly difficult to track where changes the inert value. I found combobox-tree and combobox-listbox control this value, but unsure how it's working within tree alone. Should we add a comment of how this attribute is used and how it's different from expansion visibility.