Skip to content

Conversation

@bencodezen
Copy link
Contributor

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • angular.dev application / infrastructure changes
  • Other... Please describe:

What is the current behavior?

Issue Number: N/A

What is the new behavior?

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

@ngbot ngbot bot modified the milestone: Backlog Nov 3, 2025
@bencodezen bencodezen changed the base branch from main to 21.0.x November 3, 2025 17:11
@angular-robot angular-robot bot added detected: feature PR contains a feature commit area: build & ci Related the build and CI infrastructure of the project area: common/http Issues related to HTTP and HTTP Client area: compiler Issues related to `ngc`, Angular's template compiler area: core Issues related to the framework runtime area: zones Issues related to zone.js area: router area: forms area: docs-infra Angular.dev application and infrastructure area: common Issues related to APIs in the @angular/common package area: devtools area: migrations Issues related to `ng update`/`ng generate` migrations labels Nov 3, 2025
@bencodezen bencodezen changed the title Docs/aria autocomplete guide (WIP) docs: aria autocomplete component guide Nov 3, 2025
@bencodezen bencodezen changed the title (WIP) docs: aria autocomplete component guide docs: aria autocomplete component guide (WIP) Nov 3, 2025
@bencodezen bencodezen removed area: build & ci Related the build and CI infrastructure of the project area: common Issues related to APIs in the @angular/common package area: router area: core Issues related to the framework runtime area: forms area: zones Issues related to zone.js area: common/http Issues related to HTTP and HTTP Client area: compiler Issues related to `ngc`, Angular's template compiler area: migrations Issues related to `ng update`/`ng generate` migrations area: devtools labels Nov 3, 2025
@bencodezen bencodezen removed detected: feature PR contains a feature commit area: docs-infra Angular.dev application and infrastructure labels Nov 3, 2025
@bencodezen bencodezen force-pushed the docs/aria-autocomplete-guide branch from f24be59 to 92417e9 Compare November 3, 2025 18:25
@github-actions
Copy link

github-actions bot commented Nov 3, 2025

Deployed adev-preview for 56941bd to: https://ng-dev-previews-fw--pr-angular-angular-64864-adev-prev-xlucaspn.web.app

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

@bencodezen bencodezen force-pushed the docs/aria-autocomplete-guide branch from 92417e9 to 56941bd Compare November 3, 2025 18:48
: []),
: [
{
label: 'Angular Aria',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We'll want to have the status: 'new'

@@ -0,0 +1,14 @@
<!doctype html>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we need that index.html

changeDetection: ChangeDetectionStrategy.OnPush,
})
export class App {
popover = viewChild<ElementRef>('popover');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
popover = viewChild<ElementRef>('popover');
popover = viewChild<ElementRef<HTMLDivElement>>.required('popover');

Using required will allow us to remove the type assertion

Comment on lines +25 to +26
listbox = viewChild<Listbox<any>>(Listbox);
combobox = viewChild<Combobox<any>>(Combobox);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
listbox = viewChild<Listbox<any>>(Listbox);
combobox = viewChild<Combobox<any>>(Combobox);
listbox = viewChild.required<Listbox<unknown>>(Listbox);
combobox = viewChild.required<Combobox<unknown>>(Combobox);

Comment on lines +1 to +14
<!doctype html>
<html lang="en">
<head>
<base href="/" />

<title>Autocomplete - Auto-Select Mode</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>

<body>
<app-root></app-root>
</body>
</html>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

iirc we don't need that index.html file if we don't those e2e tests.
Same for the main.ts below

For the context, we don't compile a new file but just the component itself.


Autocomplete combines a text input with a dynamic suggestion list that narrows down options based on user input. Users can type to filter options, navigate suggestions with keyboard arrows, and select values from the list. This pattern is particularly useful for forms with many predefined options, such as state selection, product search, or user lookup.

<docs-code-multifile preview hideCode path="adev/src/content/examples/aria/autocomplete/src/basic/app/app.component.ts">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The current behavior with hideCode is weird. I just want to confirm that we indeed want hideCode (and I can take care of fixing it)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants