diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index 9aaca9909e76..6b3880dcc6e7 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -73,6 +73,7 @@ /src/cdk/clipboard/** @andrewseguin @xkxx /src/cdk/coercion/** @andrewseguin /src/cdk/collections/** @crisbeto @andrewseguin +/src/cdk/dialog/** @jelbourn @crisbeto /src/cdk/drag-drop/** @crisbeto /src/cdk/keycodes/** @andrewseguin /src/cdk/layout/** @andrewseguin @@ -131,7 +132,6 @@ /src/cdk-experimental/* @andrewseguin /src/cdk-experimental/column-resize/** @kseamon @andrewseguin /src/cdk-experimental/combobox/** @jelbourn -/src/cdk-experimental/dialog/** @jelbourn @crisbeto /src/cdk-experimental/menu/** @jelbourn /src/cdk-experimental/popover-edit/** @kseamon @andrewseguin /src/cdk-experimental/scrolling/** @mmalerba diff --git a/.ng-dev/commit-message.ts b/.ng-dev/commit-message.ts index 0dc62f8c0b6c..c07dbcb729ba 100644 --- a/.ng-dev/commit-message.ts +++ b/.ng-dev/commit-message.ts @@ -11,7 +11,6 @@ export const commitMessage: CommitMessageConfig = { 'multiple', // For when a commit applies to multiple components. 'cdk-experimental/column-resize', 'cdk-experimental/combobox', - 'cdk-experimental/dialog', 'cdk-experimental/listbox', 'cdk-experimental/menu', 'cdk-experimental/popover-edit', @@ -24,6 +23,7 @@ export const commitMessage: CommitMessageConfig = { 'cdk/clipboard', 'cdk/coercion', 'cdk/collections', + 'cdk/dialog', 'cdk/drag-drop', 'cdk/keycodes', 'cdk/layout', diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index e05401b77ea3..8a5b8901dffb 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -31,7 +31,7 @@ If you would like to chat about the question in real-time, you can reach out via ## Found an Issue? If you find a bug in the source code or a mistake in the documentation, you can help us by -[submitting an issue](#submit-issue) to our [GitHub Repository][github]. Including an issue +[submitting an issue](#submit-issue) to our [GitHub Repository][github]. Including an issue reproduction (via CodePen, JsBin, Plunkr, etc.) is the absolute best way to help the team quickly diagnose the problem. Screenshots are also helpful. @@ -40,7 +40,7 @@ You can help the team even more and [submit a Pull Request](#submit-pr) with a f ## Want a Feature? You can *request* a new feature by [submitting an issue](#submit-issue) to our [GitHub Repository][github]. If you would like to *implement* a new feature, please submit an issue with -a proposal for your work first, to be sure that we can use it. +a proposal for your work first, to be sure that we can use it. Please consider what kind of change it is: * For a **Major Feature**, first open an issue and outline your proposal so that it can be @@ -194,7 +194,7 @@ Fixes a bug in the Angular Material `button` component where buttons cannot be disabled through an binding. This is because the `disabled` input did not set the `.mat-button-disabled` class on the host element. -Fixes #1234 +Fixes #1234 ``` ### Revert @@ -221,7 +221,7 @@ The commit message should specify which package is affected by the change. For e ### Scope The scope specifies place of the commit change. For example -`material/datepicker`, `cdk-experimental/dialog`, etc. +`material/datepicker`, `cdk/dialog`, etc. See full list [here][commit-message-scopes]. ### Subject diff --git a/src/cdk-experimental/config.bzl b/src/cdk-experimental/config.bzl index ab32c89f144c..75c6a265d547 100644 --- a/src/cdk-experimental/config.bzl +++ b/src/cdk-experimental/config.bzl @@ -2,7 +2,6 @@ CDK_EXPERIMENTAL_ENTRYPOINTS = [ "column-resize", "combobox", - "dialog", "menu", "listbox", "popover-edit", diff --git a/src/cdk/config.bzl b/src/cdk/config.bzl index ba749f162c2d..e06687867cd3 100644 --- a/src/cdk/config.bzl +++ b/src/cdk/config.bzl @@ -6,6 +6,7 @@ CDK_ENTRYPOINTS = [ "clipboard", "coercion", "collections", + "dialog", "drag-drop", "keycodes", "layout", diff --git a/src/cdk-experimental/dialog/BUILD.bazel b/src/cdk/dialog/BUILD.bazel similarity index 79% rename from src/cdk-experimental/dialog/BUILD.bazel rename to src/cdk/dialog/BUILD.bazel index a38aef4827a5..a45bb5b7ea85 100644 --- a/src/cdk-experimental/dialog/BUILD.bazel +++ b/src/cdk/dialog/BUILD.bazel @@ -1,4 +1,10 @@ -load("//tools:defaults.bzl", "ng_module", "ng_test_library", "ng_web_test_suite") +load( + "//tools:defaults.bzl", + "markdown_to_html", + "ng_module", + "ng_test_library", + "ng_web_test_suite", +) package(default_visibility = ["//visibility:public"]) @@ -45,3 +51,13 @@ ng_web_test_suite( name = "unit_tests", deps = [":unit_test_sources"], ) + +markdown_to_html( + name = "overview", + srcs = [":dialog.md"], +) + +filegroup( + name = "source-files", + srcs = glob(["**/*.ts"]), +) diff --git a/src/cdk-experimental/dialog/dialog-config.ts b/src/cdk/dialog/dialog-config.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog-config.ts rename to src/cdk/dialog/dialog-config.ts diff --git a/src/cdk-experimental/dialog/dialog-container.html b/src/cdk/dialog/dialog-container.html similarity index 100% rename from src/cdk-experimental/dialog/dialog-container.html rename to src/cdk/dialog/dialog-container.html diff --git a/src/cdk-experimental/dialog/dialog-container.ts b/src/cdk/dialog/dialog-container.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog-container.ts rename to src/cdk/dialog/dialog-container.ts diff --git a/src/cdk-experimental/dialog/dialog-injectors.ts b/src/cdk/dialog/dialog-injectors.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog-injectors.ts rename to src/cdk/dialog/dialog-injectors.ts diff --git a/src/cdk-experimental/dialog/dialog-module.ts b/src/cdk/dialog/dialog-module.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog-module.ts rename to src/cdk/dialog/dialog-module.ts diff --git a/src/cdk-experimental/dialog/dialog-ref.ts b/src/cdk/dialog/dialog-ref.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog-ref.ts rename to src/cdk/dialog/dialog-ref.ts diff --git a/src/cdk/dialog/dialog.md b/src/cdk/dialog/dialog.md new file mode 100644 index 000000000000..cf873b4c072b --- /dev/null +++ b/src/cdk/dialog/dialog.md @@ -0,0 +1 @@ + diff --git a/src/cdk-experimental/dialog/dialog.spec.ts b/src/cdk/dialog/dialog.spec.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog.spec.ts rename to src/cdk/dialog/dialog.spec.ts diff --git a/src/cdk-experimental/dialog/dialog.ts b/src/cdk/dialog/dialog.ts similarity index 100% rename from src/cdk-experimental/dialog/dialog.ts rename to src/cdk/dialog/dialog.ts diff --git a/src/cdk-experimental/dialog/index.ts b/src/cdk/dialog/index.ts similarity index 100% rename from src/cdk-experimental/dialog/index.ts rename to src/cdk/dialog/index.ts diff --git a/src/cdk-experimental/dialog/public-api.ts b/src/cdk/dialog/public-api.ts similarity index 100% rename from src/cdk-experimental/dialog/public-api.ts rename to src/cdk/dialog/public-api.ts diff --git a/src/dev-app/cdk-dialog/BUILD.bazel b/src/dev-app/cdk-dialog/BUILD.bazel index f145415a29c2..0261e64174c5 100644 --- a/src/dev-app/cdk-dialog/BUILD.bazel +++ b/src/dev-app/cdk-dialog/BUILD.bazel @@ -10,7 +10,7 @@ ng_module( ":dialog_demo_scss", ], deps = [ - "//src/cdk-experimental/dialog", + "//src/cdk/dialog", "@npm//@angular/forms", "@npm//@angular/router", ], diff --git a/src/dev-app/cdk-dialog/dialog-demo-module.ts b/src/dev-app/cdk-dialog/dialog-demo-module.ts index bce7f21d03cd..6874328d60b4 100644 --- a/src/dev-app/cdk-dialog/dialog-demo-module.ts +++ b/src/dev-app/cdk-dialog/dialog-demo-module.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {DialogModule} from '@angular/cdk-experimental/dialog'; +import {DialogModule} from '@angular/cdk/dialog'; import {NgModule} from '@angular/core'; import {FormsModule} from '@angular/forms'; import {RouterModule} from '@angular/router'; diff --git a/src/dev-app/cdk-dialog/dialog-demo.ts b/src/dev-app/cdk-dialog/dialog-demo.ts index 33f2eee563f7..3a42807b0afe 100644 --- a/src/dev-app/cdk-dialog/dialog-demo.ts +++ b/src/dev-app/cdk-dialog/dialog-demo.ts @@ -7,7 +7,7 @@ */ import {Component, Inject, TemplateRef, ViewChild, ViewEncapsulation} from '@angular/core'; -import {DIALOG_DATA, Dialog, DialogConfig, DialogRef} from '@angular/cdk-experimental/dialog'; +import {DIALOG_DATA, Dialog, DialogConfig, DialogRef} from '@angular/cdk/dialog'; const defaultDialogConfig = new DialogConfig(); diff --git a/src/dev-app/dev-app/dev-app-layout.ts b/src/dev-app/dev-app/dev-app-layout.ts index 905cf2ae5018..b1fa09198f83 100644 --- a/src/dev-app/dev-app/dev-app-layout.ts +++ b/src/dev-app/dev-app/dev-app-layout.ts @@ -36,10 +36,10 @@ export class DevAppLayout { {name: 'Button Toggle', route: '/button-toggle'}, {name: 'Button', route: '/button'}, {name: 'Card', route: '/card'}, - {name: 'Cdk Dialog', route: '/cdk-dialog'}, - {name: 'Cdk Experimental Combobox', route: '/cdk-experimental-combobox'}, - {name: 'Cdk Experimental Listbox', route: '/cdk-experimental-listbox'}, - {name: 'Cdk Experimental Menu', route: '/cdk-experimental-menu'}, + {name: 'CDK Dialog', route: '/cdk-dialog'}, + {name: 'CDK Experimental Combobox', route: '/cdk-experimental-combobox'}, + {name: 'CDK Experimental Listbox', route: '/cdk-experimental-listbox'}, + {name: 'CDK Experimental Menu', route: '/cdk-experimental-menu'}, {name: 'Checkbox', route: '/checkbox'}, {name: 'Chips', route: '/chips'}, {name: 'Clipboard', route: '/clipboard'}, diff --git a/src/e2e-app/BUILD.bazel b/src/e2e-app/BUILD.bazel index 7bf673aa44c8..ead2f93a0821 100644 --- a/src/e2e-app/BUILD.bazel +++ b/src/e2e-app/BUILD.bazel @@ -34,8 +34,8 @@ ng_module( exclude = ["index.html"], ), deps = [ - "//src/cdk-experimental/dialog", "//src/cdk-experimental/scrolling", + "//src/cdk/dialog", "//src/cdk/drag-drop", "//src/cdk/overlay", "//src/cdk/scrolling", diff --git a/tools/public_api_guard/cdk/dialog.md b/tools/public_api_guard/cdk/dialog.md new file mode 100644 index 000000000000..9189174dab32 --- /dev/null +++ b/tools/public_api_guard/cdk/dialog.md @@ -0,0 +1,198 @@ +## API Report File for "components-srcs" + +> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/). + +```ts + +import { AfterViewInit } from '@angular/core'; +import { BasePortalOutlet } from '@angular/cdk/portal'; +import { CdkPortalOutlet } from '@angular/cdk/portal'; +import { ComponentFactoryResolver } from '@angular/core'; +import { ComponentPortal } from '@angular/cdk/portal'; +import { ComponentRef } from '@angular/core'; +import { ComponentType } from '@angular/cdk/overlay'; +import { Direction } from '@angular/cdk/bidi'; +import { DomPortal } from '@angular/cdk/portal'; +import { ElementRef } from '@angular/core'; +import { EmbeddedViewRef } from '@angular/core'; +import { FocusMonitor } from '@angular/cdk/a11y'; +import { FocusOrigin } from '@angular/cdk/a11y'; +import { FocusTrapFactory } from '@angular/cdk/a11y'; +import * as i0 from '@angular/core'; +import * as i2 from '@angular/cdk/overlay'; +import * as i3 from '@angular/cdk/portal'; +import * as i4 from '@angular/cdk/a11y'; +import { InjectionToken } from '@angular/core'; +import { Injector } from '@angular/core'; +import { InteractivityChecker } from '@angular/cdk/a11y'; +import { NgZone } from '@angular/core'; +import { Observable } from 'rxjs'; +import { OnDestroy } from '@angular/core'; +import { Overlay } from '@angular/cdk/overlay'; +import { OverlayContainer } from '@angular/cdk/overlay'; +import { OverlayRef } from '@angular/cdk/overlay'; +import { PositionStrategy } from '@angular/cdk/overlay'; +import { ScrollStrategy } from '@angular/cdk/overlay'; +import { StaticProvider } from '@angular/core'; +import { Subject } from 'rxjs'; +import { TemplatePortal } from '@angular/cdk/portal'; +import { TemplateRef } from '@angular/core'; +import { Type } from '@angular/core'; +import { ViewContainerRef } from '@angular/core'; + +// @public +export type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading'; + +// @public +export class CdkDialogContainer extends BasePortalOutlet implements AfterViewInit, OnDestroy { + constructor(_elementRef: ElementRef, _focusTrapFactory: FocusTrapFactory, _document: any, _config: C, _interactivityChecker: InteractivityChecker, _ngZone: NgZone, _overlayRef: OverlayRef, _focusMonitor?: FocusMonitor | undefined); + _ariaLabelledBy: string | null; + attachComponentPortal(portal: ComponentPortal): ComponentRef; + // @deprecated + attachDomPortal: (portal: DomPortal) => void; + attachTemplatePortal(portal: TemplatePortal): EmbeddedViewRef; + protected _captureInitialFocus(): void; + _closeInteractionType: FocusOrigin | null; + // (undocumented) + readonly _config: C; + // (undocumented) + protected _document: Document; + // (undocumented) + protected _elementRef: ElementRef; + // (undocumented) + protected _focusTrapFactory: FocusTrapFactory; + // (undocumented) + ngAfterViewInit(): void; + // (undocumented) + ngOnDestroy(): void; + _portalOutlet: CdkPortalOutlet; + protected _trapFocus(): void; + // (undocumented) + static ɵcmp: i0.ɵɵComponentDeclaration, "cdk-dialog-container", never, {}, {}, never, never>; + // (undocumented) + static ɵfac: i0.ɵɵFactoryDeclaration, [null, null, { optional: true; }, null, null, null, null, null]>; +} + +// @public +export const DEFAULT_DIALOG_CONFIG: InjectionToken>; + +// @public (undocumented) +export class Dialog implements OnDestroy { + constructor(_overlay: Overlay, _injector: Injector, _defaultOptions: DialogConfig, _parentDialog: Dialog, _overlayContainer: OverlayContainer, scrollStrategy: any); + readonly afterAllClosed: Observable; + get afterOpened(): Subject>; + closeAll(): void; + getDialogById(id: string): DialogRef | undefined; + // (undocumented) + ngOnDestroy(): void; + open(component: ComponentType, config?: DialogConfig>): DialogRef; + open(template: TemplateRef, config?: DialogConfig>): DialogRef; + // (undocumented) + open(componentOrTemplateRef: ComponentType | TemplateRef, config?: DialogConfig>): DialogRef; + get openDialogs(): DialogRef[]; + // (undocumented) + static ɵfac: i0.ɵɵFactoryDeclaration; + // (undocumented) + static ɵprov: i0.ɵɵInjectableDeclaration; +} + +// @public +export const DIALOG_DATA: InjectionToken; + +// @public +export const DIALOG_SCROLL_STRATEGY: InjectionToken<() => ScrollStrategy>; + +// @public +export const DIALOG_SCROLL_STRATEGY_PROVIDER: { + provide: InjectionToken<() => ScrollStrategy>; + deps: (typeof Overlay)[]; + useFactory: typeof DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY; +}; + +// @public +export function DIALOG_SCROLL_STRATEGY_PROVIDER_FACTORY(overlay: Overlay): () => ScrollStrategy; + +// @public +export interface DialogCloseOptions { + focusOrigin?: FocusOrigin; +} + +// @public +export class DialogConfig { + ariaDescribedBy?: string | null; + ariaLabel?: string | null; + ariaLabelledBy?: string | null; + ariaModal?: boolean; + autoFocus?: AutoFocusTarget | string | boolean; + backdropClass?: string | string[]; + closeOnNavigation?: boolean; + componentFactoryResolver?: ComponentFactoryResolver; + container?: Type | { + type: Type; + providers: (config: DialogConfig) => StaticProvider[]; + }; + data?: D | null; + direction?: Direction; + disableClose?: boolean; + hasBackdrop?: boolean; + height?: string; + id?: string; + injector?: Injector; + maxHeight?: number | string; + maxWidth?: number | string; + minHeight?: number | string; + minWidth?: number | string; + panelClass?: string | string[]; + positionStrategy?: PositionStrategy; + providers?: StaticProvider[] | ((dialogRef: R, config: DialogConfig, container: C) => StaticProvider[]); + restoreFocus?: boolean; + role?: DialogRole; + scrollStrategy?: ScrollStrategy; + templateContext?: Record | (() => Record); + viewContainerRef?: ViewContainerRef; + width?: string; +} + +// @public (undocumented) +export class DialogModule { + // (undocumented) + static ɵfac: i0.ɵɵFactoryDeclaration; + // (undocumented) + static ɵinj: i0.ɵɵInjectorDeclaration; + // (undocumented) + static ɵmod: i0.ɵɵNgModuleDeclaration; +} + +// @public +export class DialogRef { + constructor(overlayRef: OverlayRef, config: DialogConfig, BasePortalOutlet>); + addPanelClass(classes: string | string[]): this; + readonly backdropClick: Observable; + close(result?: R, options?: DialogCloseOptions): void; + readonly closed: Observable; + componentInstance: C | null; + // (undocumented) + readonly config: DialogConfig, BasePortalOutlet>; + containerInstance: BasePortalOutlet & { + _closeInteractionType?: FocusOrigin; + }; + disableClose: boolean | undefined; + readonly id: string; + readonly keydownEvents: Observable; + readonly outsidePointerEvents: Observable; + // (undocumented) + readonly overlayRef: OverlayRef; + removePanelClass(classes: string | string[]): this; + updatePosition(): this; + updateSize(width?: string, height?: string): this; +} + +// @public +export type DialogRole = 'dialog' | 'alertdialog'; + +// @public (undocumented) +export function throwDialogContentAlreadyAttachedError(): void; + +// (No @packageDocumentation comment for this package) + +```