# Angular Components

## Docs

- [date-fns Adapter](https://mintlify.wiki/angular/components/adapters/date-fns.md): Use date-fns with Angular Material date components
- [Luxon Adapter](https://mintlify.wiki/angular/components/adapters/luxon.md): Use Luxon with Angular Material date components
- [Moment.js Adapter](https://mintlify.wiki/angular/components/adapters/moment.md): Use Moment.js with Angular Material date components
- [ARIA Accordion](https://mintlify.wiki/angular/components/aria/accordion.md): Accessible accordion component for expandable content panels
- [ARIA Combobox](https://mintlify.wiki/angular/components/aria/combobox.md): Accessible combobox component with input and popup functionality
- [ARIA Grid](https://mintlify.wiki/angular/components/aria/grid.md): Accessible data grid component with keyboard navigation
- [ARIA Listbox](https://mintlify.wiki/angular/components/aria/listbox.md): Accessible listbox component for selectable lists
- [ARIA Menu](https://mintlify.wiki/angular/components/aria/menu.md): Accessible menu and menubar components
- [@angular/aria Overview](https://mintlify.wiki/angular/components/aria/overview.md): Accessible ARIA-compliant components for Angular applications
- [ARIA Tabs](https://mintlify.wiki/angular/components/aria/tabs.md): Accessible tabs component for layered content sections
- [ARIA Toolbar](https://mintlify.wiki/angular/components/aria/toolbar.md): Accessible toolbar component for grouping interactive controls
- [ARIA Tree](https://mintlify.wiki/angular/components/aria/tree.md): Accessible tree view component for hierarchical data
- [Accessibility (A11y)](https://mintlify.wiki/angular/components/cdk/a11y.md): Utilities for building accessible Angular components
- [CdkAccordion](https://mintlify.wiki/angular/components/cdk/accordion.md): Unstyled accordion component for expandable panels
- [Bidirectionality (Bidi)](https://mintlify.wiki/angular/components/cdk/bidi.md): Support for right-to-left (RTL) and left-to-right (LTR) layouts
- [Clipboard](https://mintlify.wiki/angular/components/cdk/clipboard.md): Copy text to the system clipboard
- [Coercion](https://mintlify.wiki/angular/components/cdk/coercion.md): Type coercion utilities for inputs and values
- [Collections](https://mintlify.wiki/angular/components/cdk/collections.md): Data structures and utilities for managing collections
- [CdkDialog](https://mintlify.wiki/angular/components/cdk/dialog.md): Unstyled modal dialog component
- [Drag and Drop](https://mintlify.wiki/angular/components/cdk/drag-drop.md): Create sortable lists and draggable elements
- [Keycodes](https://mintlify.wiki/angular/components/cdk/keycodes.md): Keyboard key constants and utilities
- [Layout](https://mintlify.wiki/angular/components/cdk/layout.md): Responsive breakpoint detection and media queries
- [CdkListbox](https://mintlify.wiki/angular/components/cdk/listbox.md): Accessible listbox implementation
- [CdkMenu](https://mintlify.wiki/angular/components/cdk/menu.md): Accessible menu and menubar components
- [Observers](https://mintlify.wiki/angular/components/cdk/observers.md): Observe DOM changes and mutations
- [Overlay](https://mintlify.wiki/angular/components/cdk/overlay.md): Create floating panels, tooltips, and popovers
- [CDK Overview](https://mintlify.wiki/angular/components/cdk/overview.md): Introduction to Angular Material Component Development Kit
- [Platform](https://mintlify.wiki/angular/components/cdk/platform.md): Detect browser, OS, and platform capabilities
- [Portal](https://mintlify.wiki/angular/components/cdk/portal.md): Dynamically render components and templates
- [Scrolling](https://mintlify.wiki/angular/components/cdk/scrolling.md): Virtual scrolling and scroll detection utilities
- [CdkStepper](https://mintlify.wiki/angular/components/cdk/stepper.md): Step-by-step workflow component
- [CdkTable](https://mintlify.wiki/angular/components/cdk/table.md): Data table with sorting and pagination
- [Testing](https://mintlify.wiki/angular/components/cdk/testing.md): Component test harnesses for reliable testing
- [Text Field](https://mintlify.wiki/angular/components/cdk/text-field.md): Auto-resizing textareas and text field utilities
- [CdkTree](https://mintlify.wiki/angular/components/cdk/tree.md): Hierarchical tree structure component
- [Autocomplete](https://mintlify.wiki/angular/components/components/autocomplete.md): The autocomplete is a normal text input enhanced by a panel of suggested options.
- [Badge](https://mintlify.wiki/angular/components/components/badge.md): Small status descriptors for UI elements
- [Bottom Sheet](https://mintlify.wiki/angular/components/components/bottom-sheet.md): Service to trigger Material Design bottom sheets
- [Button](https://mintlify.wiki/angular/components/components/button.md): Material Design button component for user interactions
- [Button Toggle](https://mintlify.wiki/angular/components/components/button-toggle.md): Exclusive selection button toggle group that behaves like radio buttons or checkboxes
- [MatCard](https://mintlify.wiki/angular/components/components/card.md): Card component for Angular Material - provides a content container with Material Design styling.
- [Checkbox](https://mintlify.wiki/angular/components/components/checkbox.md): Checkbox component that provides the same functionality as a native enhanced with Material Design styling and animations.
- [Chips](https://mintlify.wiki/angular/components/components/chips.md): Compact elements representing inputs, attributes, or actions
- [Datepicker](https://mintlify.wiki/angular/components/components/datepicker.md): The datepicker allows users to enter a date either through text input, or by choosing a date from the calendar.
- [Dialog](https://mintlify.wiki/angular/components/components/dialog.md): Service to open Material Design modal dialogs
- [MatDivider](https://mintlify.wiki/angular/components/components/divider.md): Divider component for Angular Material - provides visual separation between content.
- [MatExpansionPanel](https://mintlify.wiki/angular/components/components/expansion.md): Expansion panel component for Angular Material - provides expandable content with header and body.
- [Form Field](https://mintlify.wiki/angular/components/components/form-field.md): MatFormField is a wrapper for native form controls that applies Material Design styling and behavior.
- [MatGridList](https://mintlify.wiki/angular/components/components/grid-list.md): Grid list component for Angular Material - displays content in a grid layout with dynamic tile sizing.
- [Icon](https://mintlify.wiki/angular/components/components/icon.md): Display icons from icon fonts or SVG
- [Input](https://mintlify.wiki/angular/components/components/input.md): MatInput is a directive that allows native input and textarea elements to work with mat-form-field.
- [MatList](https://mintlify.wiki/angular/components/components/list.md): List component for Angular Material - displays a collection of items in a structured list format.
- [MatMenu](https://mintlify.wiki/angular/components/components/menu.md): Menu component for Angular Material - displays a contextual menu with keyboard navigation and accessibility support.
- [Paginator](https://mintlify.wiki/angular/components/components/paginator.md): Component for pagination controls
- [Progress Bar](https://mintlify.wiki/angular/components/components/progress-bar.md): Horizontal progress indicator
- [Progress Spinner](https://mintlify.wiki/angular/components/components/progress-spinner.md): Circular progress indicator
- [Radio Button](https://mintlify.wiki/angular/components/components/radio.md): Radio buttons allow users to select one option from a set.
- [Select](https://mintlify.wiki/angular/components/components/select.md): MatSelect is a form control for selecting a value from a set of options, similar to the native select element.
- [MatSidenav](https://mintlify.wiki/angular/components/components/sidenav.md): Sidenav component for Angular Material - provides side navigation drawer with multiple display modes.
- [Slide Toggle](https://mintlify.wiki/angular/components/components/slide-toggle.md): MatSlideToggle is an on/off control that can be toggled via clicking.
- [Slider](https://mintlify.wiki/angular/components/components/slider.md): MatSlider allows users to select from a range of values by moving the slider thumb.
- [Snack Bar](https://mintlify.wiki/angular/components/components/snack-bar.md): Service to display brief messages at the bottom of the screen
- [Sort](https://mintlify.wiki/angular/components/components/sort.md): Add sorting behavior to tables
- [MatStepper](https://mintlify.wiki/angular/components/components/stepper.md): Stepper component for Angular Material - provides a wizard-like workflow by dividing content into logical steps.
- [Table](https://mintlify.wiki/angular/components/components/table.md): Material Design data table component
- [MatTabs](https://mintlify.wiki/angular/components/components/tabs.md): Tabs component for Angular Material - organize content into separate views with tab navigation.
- [Timepicker](https://mintlify.wiki/angular/components/components/timepicker.md): MatTimepicker allows users to select a time of day from a dropdown list.
- [MatToolbar](https://mintlify.wiki/angular/components/components/toolbar.md): Toolbar component for Angular Material - container for headers, titles, or actions.
- [Tooltip](https://mintlify.wiki/angular/components/components/tooltip.md): Directive to display informative tooltips on hover or focus
- [MatTree](https://mintlify.wiki/angular/components/components/tree.md): Tree component for Angular Material - displays hierarchical data in an expandable tree structure.
- [Accessibility](https://mintlify.wiki/angular/components/essentials/accessibility.md): Learn about accessibility features in Angular Material and best practices for building inclusive applications
- [Schematics](https://mintlify.wiki/angular/components/essentials/schematics.md): Use Angular CLI schematics to generate pre-built Material Design components
- [Theming](https://mintlify.wiki/angular/components/essentials/theming.md): Customize the appearance of Angular Material components using the theming system
- [Typography](https://mintlify.wiki/angular/components/essentials/typography.md): Configure typography settings for Angular Material components
- [Google Maps Installation](https://mintlify.wiki/angular/components/google-maps/installation.md): Install and configure Angular Google Maps
- [GoogleMap Component](https://mintlify.wiki/angular/components/google-maps/map.md): Main Google Maps component for displaying interactive maps
- [Map Markers](https://mintlify.wiki/angular/components/google-maps/markers.md): Add markers and info windows to Google Maps
- [Map Overlays](https://mintlify.wiki/angular/components/google-maps/overlays.md): Add shapes and overlays to Google Maps
- [Angular Google Maps](https://mintlify.wiki/angular/components/google-maps/overview.md): Angular component for Google Maps JavaScript API
- [Breaking Changes](https://mintlify.wiki/angular/components/guides/breaking-changes.md): Major breaking changes across Angular Material versions
- [Coding Standards](https://mintlify.wiki/angular/components/guides/coding-standards.md): Coding standards and best practices for Angular Material development
- [Using Component Harnesses](https://mintlify.wiki/angular/components/guides/component-harnesses.md): Test Angular Material components with component harnesses for robust, maintainable tests
- [Contributing to Angular Material](https://mintlify.wiki/angular/components/guides/contributing.md): Guidelines for contributing to Angular Material and CDK
- [Creating a Custom Form Field Control](https://mintlify.wiki/angular/components/guides/custom-form-field.md): Learn how to create custom form field controls that work with mat-form-field
- [Creating a Custom Stepper](https://mintlify.wiki/angular/components/guides/custom-stepper.md): Build a custom stepper component using the CDK stepper
- [Developer Environment Setup](https://mintlify.wiki/angular/components/guides/dev-environment.md): Get your development environment ready for contributing to Angular Material
- [Migration Guides](https://mintlify.wiki/angular/components/guides/migration-guides.md): Step-by-step guides for migrating between major Angular Material versions
- [Testing Strategies and Best Practices](https://mintlify.wiki/angular/components/guides/testing-strategies.md): Comprehensive guide to testing Angular Material applications effectively
- [Theming Your Components](https://mintlify.wiki/angular/components/guides/theming-components.md): Learn how to style custom components to match your Material Design theme
- [Installation](https://mintlify.wiki/angular/components/installation.md): Learn how to install Angular Material and set up your Angular project
- [Introduction](https://mintlify.wiki/angular/components/introduction.md): Angular Material is a comprehensive UI component library for Angular applications, implementing Google's Material Design specification
- [Quick Start](https://mintlify.wiki/angular/components/quickstart.md): Build your first Angular Material application in minutes
- [YouTube Player API](https://mintlify.wiki/angular/components/youtube-player/api.md): API reference for Angular YouTube Player component
- [YouTube Player Installation](https://mintlify.wiki/angular/components/youtube-player/installation.md): Install and configure Angular YouTube Player
- [Angular YouTube Player](https://mintlify.wiki/angular/components/youtube-player/overview.md): Angular component for embedding YouTube videos