(
- (groups, state) => {
- let group = groups.find(g => g.letter === state.name[0]);
-
- if (!group) {
- group = {letter: state.name[0], states: []};
- groups.push(group);
- }
-
- group.states.push({code: state.code, name: state.name});
-
- return groups;
- },
- [],
- );
- }
-
- displayFn(value: any): string {
- return value && typeof value === 'object' ? value.name : value;
- }
-
- filterStates(val: string) {
- return val ? this._filter(this.states, val) : this.states;
- }
-
- filterStateGroups(val: string) {
- if (val) {
- return this.groupedStates
- .map(group => ({letter: group.letter, states: this._filter(group.states, val)}))
- .filter(group => group.states.length > 0);
- }
-
- return this.groupedStates;
- }
-
- private _filter(states: State[], val: string) {
- const filterValue = val.toLowerCase();
- return states.filter(state => state.name.toLowerCase().startsWith(filterValue));
- }
-}
diff --git a/src/dev-app/legacy-baseline/BUILD.bazel b/src/dev-app/legacy-baseline/BUILD.bazel
deleted file mode 100644
index 0774db617378..000000000000
--- a/src/dev-app/legacy-baseline/BUILD.bazel
+++ /dev/null
@@ -1,26 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-baseline",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-baseline-demo.html",
- ":legacy_baseline_demo_scss",
- ],
- deps = [
- "//src/material/legacy-card",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-radio",
- "//src/material/legacy-select",
- "//src/material/toolbar",
- ],
-)
-
-sass_binary(
- name = "legacy_baseline_demo_scss",
- src = "legacy-baseline-demo.scss",
-)
diff --git a/src/dev-app/legacy-baseline/legacy-baseline-demo.html b/src/dev-app/legacy-baseline/legacy-baseline-demo.html
deleted file mode 100644
index c021f9d37fbe..000000000000
--- a/src/dev-app/legacy-baseline/legacy-baseline-demo.html
+++ /dev/null
@@ -1,67 +0,0 @@
-
- Basic Forms
-
- Text Before |
- Checkbox Label
- | Text 1 |
- Radio 1
- | Text 2 |
- Radio 2
- | Text 3 |
- Radio 3
- | Text 4 |
-
- Input
-
- | Text 5 |
-
- This label is really really really long
-
- Option
- This option is really really really long
-
-
- | Text 6 |
-
- Input
-
-
- | Text After
-
-
-
-
- Headers
-
-
- Text Before |
- Checkbox Label
- | Text 1 |
- Radio 1
- | Text 2 |
- Radio 2
- | Text 3 |
- Radio 3
- | Text 4 |
-
- Input
-
- | Text 5 |
-
- This label is really really really long
-
- Option
- This option is really really really long
-
-
- | Text 6 |
-
- Input
-
-
- | Text After
-
-
-
diff --git a/src/dev-app/legacy-baseline/legacy-baseline-demo.scss b/src/dev-app/legacy-baseline/legacy-baseline-demo.scss
deleted file mode 100644
index d3e1cb36abe5..000000000000
--- a/src/dev-app/legacy-baseline/legacy-baseline-demo.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-.demo-basic {
- padding: 0;
-}
-
-.demo-basic .mat-card-content {
- padding: 16px;
-}
-
-.demo-full-width {
- width: 100%;
-}
-
-.demo-card {
- margin: 16px;
-}
diff --git a/src/dev-app/legacy-baseline/legacy-baseline-demo.ts b/src/dev-app/legacy-baseline/legacy-baseline-demo.ts
deleted file mode 100644
index ba521805f760..000000000000
--- a/src/dev-app/legacy-baseline/legacy-baseline-demo.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {MatLegacyCardModule} from '@angular/material/legacy-card';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacyRadioModule} from '@angular/material/legacy-radio';
-import {MatLegacySelectModule} from '@angular/material/legacy-select';
-import {MatToolbarModule} from '@angular/material/toolbar';
-
-@Component({
- selector: 'legacy-baseline-demo',
- templateUrl: 'legacy-baseline-demo.html',
- styleUrls: ['legacy-baseline-demo.css'],
- standalone: true,
- imports: [
- CommonModule,
- MatLegacyCardModule,
- MatLegacyCheckboxModule,
- MatLegacyFormFieldModule,
- MatLegacyInputModule,
- MatLegacyRadioModule,
- MatLegacySelectModule,
- MatToolbarModule,
- ],
-})
-export class LegacyBaselineDemo {
- name: string;
-}
diff --git a/src/dev-app/legacy-button/BUILD.bazel b/src/dev-app/legacy-button/BUILD.bazel
deleted file mode 100644
index c5e354a05588..000000000000
--- a/src/dev-app/legacy-button/BUILD.bazel
+++ /dev/null
@@ -1,21 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-button",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-button-demo.html",
- ":legacy_button_demo_scss",
- ],
- deps = [
- "//src/material/icon",
- "//src/material/legacy-button",
- ],
-)
-
-sass_binary(
- name = "legacy_button_demo_scss",
- src = "legacy-button-demo.scss",
-)
diff --git a/src/dev-app/legacy-button/legacy-button-demo.html b/src/dev-app/legacy-button/legacy-button-demo.html
deleted file mode 100644
index 094025d925ce..000000000000
--- a/src/dev-app/legacy-button/legacy-button-demo.html
+++ /dev/null
@@ -1,142 +0,0 @@
-
diff --git a/src/dev-app/legacy-button/legacy-button-demo.scss b/src/dev-app/legacy-button/legacy-button-demo.scss
deleted file mode 100644
index 74bd52e8046a..000000000000
--- a/src/dev-app/legacy-button/legacy-button-demo.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-.demo-button {
- button, a {
- margin: 8px;
- text-transform: uppercase;
- }
-
- section {
- display: flex;
- align-items: center;
- margin: 8px;
- }
-
- p {
- padding: 5px 15px;
- }
-
- .demo-section-header {
- font-weight: 500;
- margin: 0;
- }
-
- .demo-no-flex {
- display: block;
- }
-}
diff --git a/src/dev-app/legacy-button/legacy-button-demo.ts b/src/dev-app/legacy-button/legacy-button-demo.ts
deleted file mode 100644
index e676349483da..000000000000
--- a/src/dev-app/legacy-button/legacy-button-demo.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatIconModule} from '@angular/material/icon';
-
-@Component({
- selector: 'legacy-button-demo',
- templateUrl: 'legacy-button-demo.html',
- styleUrls: ['legacy-button-demo.css'],
- standalone: true,
- imports: [MatLegacyButtonModule, MatIconModule],
-})
-export class LegacyButtonDemo {
- isDisabled: boolean = false;
- clickCounter: number = 0;
- toggleDisable: boolean = false;
-}
diff --git a/src/dev-app/legacy-card/BUILD.bazel b/src/dev-app/legacy-card/BUILD.bazel
deleted file mode 100644
index 8ffe625e1ce5..000000000000
--- a/src/dev-app/legacy-card/BUILD.bazel
+++ /dev/null
@@ -1,23 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-card",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-card-demo.html",
- ":legacy_card_demo_scss",
- ],
- deps = [
- "//src/material/divider",
- "//src/material/legacy-button",
- "//src/material/legacy-card",
- "//src/material/legacy-progress-bar",
- ],
-)
-
-sass_binary(
- name = "legacy_card_demo_scss",
- src = "legacy-card-demo.scss",
-)
diff --git a/src/dev-app/legacy-card/legacy-card-demo.html b/src/dev-app/legacy-card/legacy-card-demo.html
deleted file mode 100644
index 4c5c31e62053..000000000000
--- a/src/dev-app/legacy-card/legacy-card-demo.html
+++ /dev/null
@@ -1,117 +0,0 @@
-
-
- Hello
-
-
-
- Subtitle
- Card with title and footer
-
- This is supporting text.
- {{longText}}
-
-
- LIKE
- SHARE
-
-
-
-
-
-
- Subtitle
- Card with title, footer, and inset-divider
-
- This is supporting text.
- {{longText}}
-
-
- LIKE
- SHARE
-
-
-
-
-
-
- Content Title
-
- Here is some content
-
-
- LIKE
- SHARE
-
-
-
-
-
- Header title
- Header subtitle
-
-
- Here is some content
-
-
-
-
- Easily customizable
-
- First
- Second
-
-
-
-
-
Cards with media area
-
-
-
- Card
- Small
-
-
- {{longText}}
-
-
-
-
-
- Card
- Medium
-
-
- {{longText}}
-
-
-
-
-
- Card
- Large
-
-
- {{longText}}
-
-
-
-
-
- Card
- Extra large
-
-
- {{longText}}
-
-
-
mat-checkbox: Basic Example
-
-
- Toggle Indeterminate
- Toggle Disabled
- Toggle Color
-
-
-
Label position:
-
- After
-
-
- Before
-
-
Pseudo checkboxes
-Nested Checklist
-
-
Configuration
-
required?
-
label after?
-
checked?
-
disabled?
-
indeterminate?
-
disable ripple?
-
hide label?
-
- aria-label
-
-
- aria-labelledby
-
- None
- My Label
-
- My Label
-
- id
-
-
- name
-
-
- value
-
-
- color
-
- primary
- accent
- warn
-
-
-
-
-
Result
-
-
Click action: check-indeterminate
-
- Checkbox w/ [checked] & (change)
-
-
- Checkbox w/ [(ngModel)]
-
-
-
-
Click action: check
-
- Checkbox w/ [checked] & (change)
-
-
- Checkbox w/ [(ngModel)]
-
-
-
-
Click action: noop
-
- Checkbox w/ [checked] & (change)
-
-
- Checkbox w/ [(ngModel)]
-
-
-
-
No animations
-
- Checkbox w/ [checked] & (change)
-
-
- Checkbox w/ [(ngModel)]
-
-
-
Tasks
-
-
-
- {{task.name}}
-
-
-
-
- {{subtask.name}}
-
-
-
-
-
diff --git a/src/dev-app/legacy-chips/BUILD.bazel b/src/dev-app/legacy-chips/BUILD.bazel
deleted file mode 100644
index 2e30414f5227..000000000000
--- a/src/dev-app/legacy-chips/BUILD.bazel
+++ /dev/null
@@ -1,26 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-chips",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-chips-demo.html",
- ":legacy_chips_demo_scss",
- ],
- deps = [
- "//src/material/icon",
- "//src/material/legacy-button",
- "//src/material/legacy-card",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-chips",
- "//src/material/legacy-form-field",
- "//src/material/toolbar",
- ],
-)
-
-sass_binary(
- name = "legacy_chips_demo_scss",
- src = "legacy-chips-demo.scss",
-)
diff --git a/src/dev-app/legacy-chips/legacy-chips-demo.html b/src/dev-app/legacy-chips/legacy-chips-demo.html
deleted file mode 100644
index b5ebf78d29b4..000000000000
--- a/src/dev-app/legacy-chips/legacy-chips-demo.html
+++ /dev/null
@@ -1,226 +0,0 @@
-
-
- Static Chips
-
-
- Simple
-
-
- Chip 1
- Chip 2
- Chip 3
-
-
- Unstyled
-
-
- Basic Chip 1
- Basic Chip 2
- Basic Chip 3
-
-
- Advanced
-
-
- Selected/Colored
-
-
- With Events
-
- cancel
-
-
-
- {{message}}
-
- With avatar and icons
-
-
-
-
- home
- Home
-
- cancel
-
-
-
- P
- Portel
-
- cancel
-
-
-
-
- M
- Molly
-
-
-
- Koby
-
- cancel
-
-
-
-
- Razzle
-
-
-
-
-
-
-
- cancel
-
-
-
-
- Good
- star
-
-
- Bad
- star_border
-
-
-
-
-
-
- Dynamic Chips
-
-
- Form Field
-
-
- You can easily put the <mat-chip-list> inside of an
- <mat-form-field>.
-
-
-
- Set tabIndex to {{tabIndex === 0 ? -1 : 0}}
-
-
- Contributors
-
-
- {{person.name}}
-
- cancel
-
-
-
-
-
-
-
-
- You can also put <mat-form-field> outside of an mat-chip-list.
- With matChipInput the input work with chip-list
-
-
-
- Contributors
-
-
- {{person.name}}
-
- cancel
-
-
-
-
-
-
- Chips list without input
-
-
-
-
- Contributors
-
-
- {{person.name}}
-
- cancel
-
-
-
-
-
-
-
- The example above has overridden the [separatorKeys] input to allow for
- ENTER, COMMA and SEMI COLON keys.
-
-
- Options
-
- Selectable
- Removable
- Add on Blur
-
-
- Stacked Chips
-
-
- You can also stack the chips if you want them on top of each other and/or use the
- (focus) event to run custom code.
-
-
-
-
- {{aColor.name}}
-
-
-
- NgModel with chip list
-
-
- {{aColor.name}}
-
- cancel
-
-
-
-
- The selected colors are {{color}} .
-
- NgModel with single selection chip list
-
-
- {{aColor.name}}
-
- cancel
-
-
-
-
- The selected color is {{selectedColor}}.
-
-
-
Options
-
- Use touch UI
- Filter odd years, months and dates
- Start in year view
- Disable datepicker
- Disable input
- Show action buttons
-
-
- Primary
- Accent
- Warn
-
-
-
-
-
- Min date
-
-
- Cancel
- Apply
-
-
-
-
- Max date
-
-
- Cancel
- Apply
-
-
-
-
-
-
- Start at date
-
-
- Cancel
- Apply
-
-
-
-
-
-Result
-
-
-
- Pick a date
-
-
- Cancel
- Apply
-
-
-
- "{{resultPickerModel.getError('matDatepickerParse').text}}" is not a valid date!
-
- Too early!
- Too late!
- Date unavailable!
-
-
-Last input: {{lastDateInput}}
-Last change: {{lastDateChange}}
-
-
-
- Cancel
- Apply
-
-
-
-
-Input disabled datepicker
-
-
- Input disabled
-
-
-
-Input disabled via FormControl
-
-
- FormControl disabled
-
-
-
- {{dateCtrl.disabled ? 'Enable' : 'Disable'}} FormControl
-
-
-
-Input disabled, datepicker popup enabled
-
-
- Input disabled, datepicker enabled
-
-
-
-Datepicker with value property binding
-
-
- Value binding
-
-
-
-
-Datepicker with custom header
-
-
- Custom calendar header
-
-
-
-Datepicker with custom header extending the default header
-
-
- Custom calendar header extending default
-
-
-
-Range picker
-
-
-
-
-
-
-
-
-Range picker with custom selection strategy
-
-
- Enter a date range
-
-
-
-
- Cancel
- Apply
-
-
-
-
-
-With custom icon
-
-
- Custom icon
-
- add
-
-
-
- Custom icon
-
- add
-
-
-
- Custom icon
-
-
- add
-
-
- Custom icon
-
- add
-
-
-
- Custom icon
-
- add
-
-
-
diff --git a/src/dev-app/legacy-datepicker/datepicker-demo.scss b/src/dev-app/legacy-datepicker/datepicker-demo.scss
deleted file mode 100644
index b2f4bbb00177..000000000000
--- a/src/dev-app/legacy-datepicker/datepicker-demo.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-@use '@angular/material' as mat;
-
-mat-calendar {
- width: 300px;
-}
-
-.demo-range-group {
- margin-bottom: 30px;
-}
-
-.demo-custom-range {
- @include mat.datepicker-date-range-colors(
- hotpink, teal, yellow, purple);
-}
diff --git a/src/dev-app/legacy-datepicker/datepicker-demo.ts b/src/dev-app/legacy-datepicker/datepicker-demo.ts
deleted file mode 100644
index 59e957852d78..000000000000
--- a/src/dev-app/legacy-datepicker/datepicker-demo.ts
+++ /dev/null
@@ -1,254 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {
- ChangeDetectionStrategy,
- ChangeDetectorRef,
- Component,
- Inject,
- OnDestroy,
- Optional,
- ViewChild,
- ViewEncapsulation,
- Directive,
- Injectable,
-} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {
- DateAdapter,
- MAT_DATE_FORMATS,
- MatDateFormats,
- ThemePalette,
- MatNativeDateModule,
-} from '@angular/material/core';
-import {
- MatCalendar,
- MatCalendarHeader,
- MatDatepickerInputEvent,
- MAT_DATE_RANGE_SELECTION_STRATEGY,
- MatDateRangeSelectionStrategy,
- DateRange,
- MatDatepickerModule,
-} from '@angular/material/datepicker';
-import {MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySelectModule} from '@angular/material/legacy-select';
-import {Subject} from 'rxjs';
-import {takeUntil} from 'rxjs/operators';
-
-/** Range selection strategy that preserves the current range. */
-@Injectable()
-export class PreserveRangeStrategy implements MatDateRangeSelectionStrategy {
- constructor(private _dateAdapter: DateAdapter) {}
-
- selectionFinished(date: D, currentRange: DateRange) {
- let {start, end} = currentRange;
-
- if (start && end) {
- return this._getRangeRelativeToDate(date, start, end);
- }
-
- if (start == null) {
- start = date;
- } else if (end == null) {
- end = date;
- }
-
- return new DateRange(start, end);
- }
-
- createPreview(activeDate: D | null, currentRange: DateRange): DateRange {
- if (activeDate) {
- if (currentRange.start && currentRange.end) {
- return this._getRangeRelativeToDate(activeDate, currentRange.start, currentRange.end);
- } else if (currentRange.start && !currentRange.end) {
- return new DateRange(currentRange.start, activeDate);
- }
- }
-
- return new DateRange(null, null);
- }
-
- private _getRangeRelativeToDate(date: D | null, start: D, end: D): DateRange {
- let rangeStart: D | null = null;
- let rangeEnd: D | null = null;
-
- if (date) {
- const delta = Math.round(Math.abs(this._dateAdapter.compareDate(start, end)) / 2);
- rangeStart = this._dateAdapter.addCalendarDays(date, -delta);
- rangeEnd = this._dateAdapter.addCalendarDays(date, delta);
- }
-
- return new DateRange(rangeStart, rangeEnd);
- }
-}
-
-@Directive({
- selector: '[customRangeStrategy]',
- standalone: true,
- providers: [
- {
- provide: MAT_DATE_RANGE_SELECTION_STRATEGY,
- useClass: PreserveRangeStrategy,
- },
- ],
-})
-export class CustomRangeStrategy {}
-
-// Custom header component for datepicker
-@Component({
- selector: 'custom-header',
- templateUrl: 'custom-header.html',
- styleUrls: ['custom-header.css'],
- changeDetection: ChangeDetectionStrategy.OnPush,
- standalone: true,
- imports: [MatIconModule],
-})
-export class CustomHeader implements OnDestroy {
- private readonly _destroyed = new Subject();
-
- constructor(
- private _calendar: MatCalendar,
- private _dateAdapter: DateAdapter,
- @Inject(MAT_DATE_FORMATS) private _dateFormats: MatDateFormats,
- cdr: ChangeDetectorRef,
- ) {
- _calendar.stateChanges.pipe(takeUntil(this._destroyed)).subscribe(() => cdr.markForCheck());
- }
-
- ngOnDestroy() {
- this._destroyed.next();
- this._destroyed.complete();
- }
-
- get periodLabel() {
- return this._dateAdapter
- .format(this._calendar.activeDate, this._dateFormats.display.monthYearLabel)
- .toLocaleUpperCase();
- }
-
- previousClicked(mode: 'month' | 'year') {
- this._calendar.activeDate =
- mode === 'month'
- ? this._dateAdapter.addCalendarMonths(this._calendar.activeDate, -1)
- : this._dateAdapter.addCalendarYears(this._calendar.activeDate, -1);
- }
-
- nextClicked(mode: 'month' | 'year') {
- this._calendar.activeDate =
- mode === 'month'
- ? this._dateAdapter.addCalendarMonths(this._calendar.activeDate, 1)
- : this._dateAdapter.addCalendarYears(this._calendar.activeDate, 1);
- }
-}
-
-@Component({
- selector: 'customer-header-ng-content',
- template: `
-
- TODAY
-
- `,
- standalone: true,
- imports: [MatDatepickerModule],
-})
-export class CustomHeaderNgContent {
- @ViewChild(MatCalendarHeader)
- header: MatCalendarHeader;
-
- constructor(@Optional() private _dateAdapter: DateAdapter) {}
-
- todayClicked() {
- let calendar = this.header.calendar;
-
- calendar.activeDate = this._dateAdapter.today();
- calendar.currentView = 'month';
- }
-}
-
-@Component({
- selector: 'legacy-datepicker-demo',
- templateUrl: 'datepicker-demo.html',
- styleUrls: ['datepicker-demo.css'],
- encapsulation: ViewEncapsulation.None,
- changeDetection: ChangeDetectionStrategy.OnPush,
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyButtonModule,
- MatLegacyCheckboxModule,
- MatDatepickerModule,
- MatLegacyFormFieldModule,
- MatIconModule,
- MatLegacyInputModule,
- MatNativeDateModule,
- MatLegacySelectModule,
- ReactiveFormsModule,
- CustomHeader,
- CustomHeaderNgContent,
- CustomRangeStrategy,
- ],
-})
-export class LegacyDatepickerDemo {
- touch: boolean;
- filterOdd: boolean;
- yearView: boolean;
- inputDisabled: boolean;
- datepickerDisabled: boolean;
- minDate: Date;
- maxDate: Date;
- startAt: Date;
- date: any;
- lastDateInput: Date | null;
- lastDateChange: Date | null;
- color: ThemePalette;
- showActions = false;
-
- dateCtrl = new FormControl(null);
- range1 = new FormGroup({
- start: new FormControl(null),
- end: new FormControl(null),
- });
- range2 = new FormGroup({
- start: new FormControl(null),
- end: new FormControl(null),
- });
- range3 = new FormGroup({
- start: new FormControl(null),
- end: new FormControl(null),
- });
- comparisonStart: Date;
- comparisonEnd: Date;
-
- constructor() {
- const today = new Date();
- const year = today.getFullYear();
- const month = today.getMonth();
- this.comparisonStart = new Date(year, month, 9);
- this.comparisonEnd = new Date(year, month, 13);
- }
-
- dateFilter: (date: Date | null) => boolean = (date: Date | null) => {
- if (date === null) {
- return true;
- }
- return !(date.getFullYear() % 2) && Boolean(date.getMonth() % 2) && !(date.getDate() % 2);
- };
-
- onDateInput = (e: MatDatepickerInputEvent) => (this.lastDateInput = e.value);
- onDateChange = (e: MatDatepickerInputEvent) => (this.lastDateChange = e.value);
-
- // pass custom header component type as input
- customHeader = CustomHeader;
- customHeaderNgContent = CustomHeaderNgContent;
-}
diff --git a/src/dev-app/legacy-dialog/BUILD.bazel b/src/dev-app/legacy-dialog/BUILD.bazel
deleted file mode 100644
index 14f2221555fa..000000000000
--- a/src/dev-app/legacy-dialog/BUILD.bazel
+++ /dev/null
@@ -1,27 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-dialog",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-dialog-demo.html",
- ":legacy_dialog_demo_scss",
- ],
- deps = [
- "//src/cdk/drag-drop",
- "//src/material/legacy-button",
- "//src/material/legacy-card",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-dialog",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-select",
- ],
-)
-
-sass_binary(
- name = "legacy_dialog_demo_scss",
- src = "legacy-dialog-demo.scss",
-)
diff --git a/src/dev-app/legacy-dialog/legacy-dialog-demo.html b/src/dev-app/legacy-dialog/legacy-dialog-demo.html
deleted file mode 100644
index 49ad140ae1de..000000000000
--- a/src/dev-app/legacy-dialog/legacy-dialog-demo.html
+++ /dev/null
@@ -1,138 +0,0 @@
-Dialog demo
-
-
- Open dialog
-
-
- Open dialog with content elements
-
-
- Open dialog with template content
-
-
-
-
- Dialog dimensions
-
-
-
- Width
-
-
- Height
-
-
-
-
-
- Min width
-
-
- Min height
-
-
-
-
-
- Max width
-
-
- Max height
-
-
-
- Dialog position
-
-
-
- Top
-
-
- Bottom
-
-
-
-
-
- Left
-
-
- Right
-
-
-
- Dialog backdrop
-
-
-
- Backdrop class
-
-
-
- Has backdrop
-
- Other options
-
-
-
- Button alignment
-
- Start
- End
- Center
-
-
-
-
-
-
- Dialog message
-
-
-
-
-
- Enter duration
-
-
- Exit duration
-
-
-
-
- Disable close
-
-
-
-
-Last afterClosed result: {{lastAfterClosedResult}}
-Last beforeClose result: {{lastBeforeCloseResult}}
-
-
- I'm a template dialog. I've been opened {{numTemplateOpens}} times!
-
- It's Jazz!
-
-
- How much?
-
-
- {{ data.message }}
- Close dialog
- Change dimensions
-
diff --git a/src/dev-app/legacy-dialog/legacy-dialog-demo.scss b/src/dev-app/legacy-dialog/legacy-dialog-demo.scss
deleted file mode 100644
index c57cae78b6b3..000000000000
--- a/src/dev-app/legacy-dialog/legacy-dialog-demo.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.demo-dialog-card {
- max-width: 405px;
- margin: 20px 0;
-}
-
-button {
- margin-right: 8px;
-
- [dir='rtl'] & {
- margin-left: 8px;
- margin-right: 0;
- }
-}
diff --git a/src/dev-app/legacy-dialog/legacy-dialog-demo.ts b/src/dev-app/legacy-dialog/legacy-dialog-demo.ts
deleted file mode 100644
index 1cc904ac662d..000000000000
--- a/src/dev-app/legacy-dialog/legacy-dialog-demo.ts
+++ /dev/null
@@ -1,246 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component, Inject, TemplateRef, ViewChild, ViewEncapsulation} from '@angular/core';
-import {DOCUMENT} from '@angular/common';
-import {DragDropModule} from '@angular/cdk/drag-drop';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatLegacyCardModule} from '@angular/material/legacy-card';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {
- MAT_LEGACY_DIALOG_DATA,
- MatLegacyDialog,
- MatLegacyDialogConfig,
- MatLegacyDialogModule,
- MatLegacyDialogRef,
-} from '@angular/material/legacy-dialog';
-import {MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySelectModule} from '@angular/material/legacy-select';
-
-const defaultDialogConfig = new MatLegacyDialogConfig();
-
-@Component({
- selector: 'legacy-dialog-demo',
- templateUrl: 'legacy-dialog-demo.html',
- styleUrls: ['legacy-dialog-demo.css'],
- standalone: true,
- imports: [
- FormsModule,
- MatLegacyButtonModule,
- MatLegacyCardModule,
- MatLegacyCheckboxModule,
- MatLegacyDialogModule,
- MatLegacyFormFieldModule,
- MatLegacyInputModule,
- MatLegacySelectModule,
- ],
-})
-export class LegacyDialogDemo {
- dialogRef: MatLegacyDialogRef | null;
- lastAfterClosedResult: string;
- lastBeforeCloseResult: string;
- actionsAlignment: 'start' | 'center' | 'end';
- config = {
- disableClose: false,
- panelClass: 'custom-overlay-pane-class',
- hasBackdrop: true,
- backdropClass: '',
- width: '',
- height: '',
- minWidth: '',
- minHeight: '',
- enterAnimationDuration: defaultDialogConfig.enterAnimationDuration,
- exitAnimationDuration: defaultDialogConfig.exitAnimationDuration,
- maxWidth: defaultDialogConfig.maxWidth,
- maxHeight: '',
- position: {
- top: '',
- bottom: '',
- left: '',
- right: '',
- },
- data: {
- message: 'Jazzy jazz jazz',
- },
- };
- numTemplateOpens = 0;
-
- @ViewChild(TemplateRef) template: TemplateRef;
-
- constructor(public dialog: MatLegacyDialog, @Inject(DOCUMENT) doc: any) {
- // Possible useful example for the open and closeAll events.
- // Adding a class to the body if a dialog opens and
- // removing it after all open dialogs are closed
- dialog.afterOpened.subscribe(() => {
- if (!doc.body.classList.contains('no-scroll')) {
- doc.body.classList.add('no-scroll');
- }
- });
- dialog.afterAllClosed.subscribe(() => {
- doc.body.classList.remove('no-scroll');
- });
- }
-
- openJazz() {
- this.dialogRef = this.dialog.open(LegacyJazzDialog, this.config);
-
- this.dialogRef.beforeClosed().subscribe((result: string) => {
- this.lastBeforeCloseResult = result;
- });
- this.dialogRef.afterClosed().subscribe((result: string) => {
- this.lastAfterClosedResult = result;
- this.dialogRef = null;
- });
- }
-
- openContentElement() {
- const dialogRef = this.dialog.open(LegacyContentElementDialog, this.config);
- dialogRef.componentInstance.actionsAlignment = this.actionsAlignment;
- }
-
- openTemplate() {
- this.numTemplateOpens++;
- this.dialog.open(this.template, this.config);
- }
-}
-
-@Component({
- selector: 'demo-legacy-jazz-dialog',
- template: `
-
-
It's Jazz!
-
-
- How much?
-
-
-
{{ data.message }} (use this message to drag the dialog)
-
Close dialog
-
Change dimensions
-
Hide for 2 seconds
-
,
- @Inject(MAT_LEGACY_DIALOG_DATA) public data: any,
- ) {}
-
- togglePosition(): void {
- this._dimensionToggle = !this._dimensionToggle;
-
- if (this._dimensionToggle) {
- this.dialogRef.updateSize('500px', '500px').updatePosition({top: '25px', left: '25px'});
- } else {
- this.dialogRef.updateSize().updatePosition();
- }
- }
-
- temporarilyHide(): void {
- this.dialogRef.addPanelClass('hidden-dialog');
- setTimeout(() => {
- this.dialogRef.removePanelClass('hidden-dialog');
- }, 2000);
- }
-}
-
-@Component({
- selector: 'demo-legacy-content-element-dialog',
- styles: [
- `
- img {
- max-width: 100%;
- }
- `,
- ],
- template: `
- Neptune
-
-
-
- Neptune is the eighth and farthest known planet from the Sun in the Solar System. In the
- Solar System, it is the fourth-largest planet by diameter, the third-most-massive planet,
- and the densest giant planet. Neptune is 17 times the mass of Earth and is slightly more
- massive than its near-twin Uranus, which is 15 times the mass of Earth and slightly larger
- than Neptune. Neptune orbits the Sun once every 164.8 years at an average distance of 30.1
- astronomical units (4.50×109 km). It is named after the Roman god of the sea and has the
- astronomical symbol ♆, a stylised version of the god Neptune's trident.
-
-
-
-
- Close
-
- Read more on Wikipedia
-
-
- Show in Dialog
-
- `,
- standalone: true,
- imports: [MatLegacyDialogModule, MatLegacyButtonModule],
-})
-export class LegacyContentElementDialog {
- actionsAlignment: 'start' | 'center' | 'end';
-
- constructor(public dialog: MatLegacyDialog) {}
-
- showInStackedDialog() {
- this.dialog.open(LegacyIFrameDialog);
- }
-}
-
-@Component({
- selector: 'demo-legacy-iframe-dialog',
- styles: [
- `
- iframe {
- width: 800px;
- }
- `,
- ],
- standalone: true,
- imports: [MatLegacyDialogModule, MatLegacyButtonModule],
- template: `
- Neptune
-
-
-
-
-
-
- Close
-
- `,
-})
-export class LegacyIFrameDialog {}
diff --git a/src/dev-app/legacy-input/BUILD.bazel b/src/dev-app/legacy-input/BUILD.bazel
deleted file mode 100644
index e405fd556af0..000000000000
--- a/src/dev-app/legacy-input/BUILD.bazel
+++ /dev/null
@@ -1,31 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-input",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-input-demo.html",
- ":legacy_input_demo_scss",
- ],
- deps = [
- "//src/material/button-toggle",
- "//src/material/icon",
- "//src/material/legacy-button",
- "//src/material/legacy-card",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-select",
- "//src/material/legacy-tabs",
- "//src/material/toolbar",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_input_demo_scss",
- src = "legacy-input-demo.scss",
- deps = ["//src/cdk:sass_lib"],
-)
diff --git a/src/dev-app/legacy-input/legacy-input-demo.html b/src/dev-app/legacy-input/legacy-input-demo.html
deleted file mode 100644
index ce2184b6af44..000000000000
--- a/src/dev-app/legacy-input/legacy-input-demo.html
+++ /dev/null
@@ -1,686 +0,0 @@
-
- Basic
-
-
-
-
-
-
- Error messages
-
- Regular
-
-
-
- Example
- This field is required
-
-
-
- Email
-
- This field is required
-
-
- Please enter a valid email address
-
-
-
-
- With hint
-
-
- Example
- This field is required
- Please type something here
-
-
-
-
-
- With a custom error function
-
- Example
- This field is required
-
-
-
-
-
-
- Prefix + Suffix
-
- Text
-
- Amount
- $
- .00
-
-
- Icons
-
- Amount
- attach_money
- mode_edit
-
-
- Icon buttons
-
- Amount
- attach_money mode_edit
-
-
-
-
- Divider Colors
-
- Input
-
- Default color
-
-
- Accent color
-
-
- Warn color
-
-
- Textarea
-
- Default color
-
-
-
- Accent color
-
-
-
- Warn color
-
-
-
- With error
-
- Default color
- This field is required
-
-
- Accent color
- This field is required
-
-
- Warn color
- This field is required
-
-
-
-
-
- Hints
-
- Input
-
-
- Character count (100 max)
-
- {{characterCountInputHintExample.value.length}} / 100
-
-
-
-
- Textarea
-
-
- Character count (100 max)
-
-
- {{characterCountTextareaHintExample.value.length}} / 100
-
-
-
-
-
-
-
-
-
- Hello
-
- First name
- ,
- how are you?
-
-
-
-
-
- Disabled field
-
-
- Required field
-
-
-
-
- 100% width label
-
-
-
-
- Character count (100 max)
- {{input.value.length}} / 100
-
-
-
-
- Show hint label
-
-
-
-
-
-
- I favorite bold label
-
-
- I also home italic hint labels
-
-
-
-
-
- Show hint label with character count
- {{hintLabelWithCharCount.value.length}}
-
-
-
-
- Enter text to count
-
-
- Enter some text to count how many characters are in it. The character count is shown on
- the right.
-
-
- Length: {{longHint.value.length}}
-
-
-
-
- Check to change the color:
-
-
-
-
- Check to make required:
-
-
-
-
- Check to hide the required marker:
-
-
-
-
-
- Auto Float
- Always Float
- Never Float
-
-
-
-
-
- Label
-
-
-
-
-
- What is your favorite color?
-
-
-
-
-
- Prefixed
- Example:
-
-
- Suffixed
- .00 €
-
-
- Email address
- email @gmail.com
-
-
-
-
- Empty: Label:
-
-
-
-
-
- Number Inputs
-
-
-
-
-
-
- Forms
-
-
- Reactive
-
-
- Template
-
-
- DISABLE REACTIVE CTRL
-
-
- DISABLE TD CTRL
-
-
-
- Delayed value
-
-
-
-
-
-
-
- Floating labels
-
-
-
-
-
-
-
-
-
-
- Only label
-
-
-
- Label and placeholder
-
-
-
- Always float
-
-
-
- Never float
-
-
-
- Label and placeholder element
- The placeholder element
-
-
-
-
-
-
- Value
-
-
-
-
-
- Value
-
-
-
-
- Only label
-
- Value
-
-
-
-
- Label and placeholder
-
- Value
-
-
-
-
- Always float
-
- Value
-
-
-
-
- Never float
-
- Value
-
-
-
-
- Label and placeholder element
- The placeholder element
-
- Value
-
-
-
-
- Toggle value
-
- Toggle touched
-
-
-
-
- Textarea Autosize
-
- Regular <textarea>
-
-
- Regular <textarea> with maxRows and minRows
-
- minRows
- maxRows
-
-
- Decrement minRows
-
- <textarea> with mat-form-field
-
-
- Autosized textarea
-
-
-
-
- <textarea> with ngModel
-
- Input with same ngModel
-
-
- Plain textarea with auto size
-
-
-
- <textarea> with bindable autosize
-
- Autosize enabled
-
-
-
-
-
-
- Appearance
-
-
- Legacy appearance
- This field is required
- Please type something here
-
-
-
- Standard appearance
- This field is required
- Please type something here
-
-
-
- Fill appearance
- This field is required
- Please type something here
-
-
-
- Outline appearance
- This field is required
- Please type something here
-
-
-
-
-
-
-
- Autofill
-
-
-
-
-
-
- Outline form field in a tab
-
-
-
-
- Tab 1 input
-
-
-
-
- Tab 2 input
-
-
-
-
-
diff --git a/src/dev-app/legacy-input/legacy-input-demo.scss b/src/dev-app/legacy-input/legacy-input-demo.scss
deleted file mode 100644
index a546ee3f6604..000000000000
--- a/src/dev-app/legacy-input/legacy-input-demo.scss
+++ /dev/null
@@ -1,41 +0,0 @@
-@use '@angular/cdk';
-
-.demo-basic {
- padding: 0;
-}
-
-.demo-basic .mat-card-content {
- padding: 16px;
-}
-
-.demo-full-width {
- width: 100%;
-}
-
-.demo-card {
- margin: 16px;
-
- mat-card-content {
- font-size: 16px;
- }
-}
-
-.demo-text-align-end {
- text-align: end;
-}
-
-.demo-textarea {
- resize: none;
- border: none;
- overflow: auto;
- padding: 0;
- background: lightblue;
-}
-
-.demo-custom-autofill-style {
- @include cdk.text-field-autofill-color(transparent, red);
-}
-
-.demo-rows {
- width: 30px;
-}
diff --git a/src/dev-app/legacy-input/legacy-input-demo.ts b/src/dev-app/legacy-input/legacy-input-demo.ts
deleted file mode 100644
index 8b3144c6c032..000000000000
--- a/src/dev-app/legacy-input/legacy-input-demo.ts
+++ /dev/null
@@ -1,118 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {FormControl, FormsModule, ReactiveFormsModule, Validators} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatButtonToggleModule} from '@angular/material/button-toggle';
-import {MatLegacyCardModule} from '@angular/material/legacy-card';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {ErrorStateMatcher} from '@angular/material/core';
-import {LegacyFloatLabelType, MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySelectModule} from '@angular/material/legacy-select';
-import {MatLegacyTabsModule} from '@angular/material/legacy-tabs';
-import {MatToolbarModule} from '@angular/material/toolbar';
-
-let max = 5;
-
-const EMAIL_REGEX = /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
-
-@Component({
- selector: 'legacy-input-demo',
- templateUrl: 'legacy-input-demo.html',
- styleUrls: ['legacy-input-demo.css'],
- changeDetection: ChangeDetectionStrategy.OnPush,
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyButtonModule,
- MatButtonToggleModule,
- MatLegacyCardModule,
- MatLegacyCheckboxModule,
- MatLegacyFormFieldModule,
- MatIconModule,
- MatLegacyInputModule,
- MatLegacySelectModule,
- MatLegacyTabsModule,
- MatToolbarModule,
- ReactiveFormsModule,
- ],
-})
-export class LegacyInputDemo {
- floatingLabel: LegacyFloatLabelType = 'auto';
- color: boolean;
- requiredField: boolean;
- hideRequiredMarker: boolean;
- ctrlDisabled = false;
- textareaNgModelValue: string;
- textareaAutosizeEnabled = false;
- placeholderTestControl = new FormControl('', Validators.required);
-
- name: string;
- errorMessageExample1: string;
- errorMessageExample2: string;
- errorMessageExample3: string;
- errorMessageExample4: string;
- dividerColorExample1: string;
- dividerColorExample2: string;
- dividerColorExample3: string;
- items: {value: number}[] = [{value: 10}, {value: 20}, {value: 30}, {value: 40}, {value: 50}];
- rows = 8;
- formControl = new FormControl('hello', Validators.required);
- emailFormControl = new FormControl('', [Validators.required, Validators.pattern(EMAIL_REGEX)]);
- delayedFormControl = new FormControl('');
- model = 'hello';
- isAutofilled = false;
- customAutofillStyle = true;
-
- legacyAppearance: string;
- standardAppearance: string;
- fillAppearance: string;
- outlineAppearance: string;
-
- constructor() {
- setTimeout(() => this.delayedFormControl.setValue('hello'), 100);
- }
-
- addABunch(n: number) {
- for (let x = 0; x < n; x++) {
- this.items.push({value: ++max});
- }
- }
-
- customErrorStateMatcher: ErrorStateMatcher = {
- isErrorState: (control: FormControl | null) => {
- if (control) {
- const hasInteraction = control.dirty || control.touched;
- const isInvalid = control.invalid;
-
- return !!(hasInteraction && isInvalid);
- }
-
- return false;
- },
- };
-
- togglePlaceholderTestValue() {
- this.placeholderTestControl.setValue(this.placeholderTestControl.value === '' ? 'Value' : '');
- }
-
- togglePlaceholderTestTouched() {
- this.placeholderTestControl.touched
- ? this.placeholderTestControl.markAsUntouched()
- : this.placeholderTestControl.markAsTouched();
- }
-
- parseNumber(value: string): number {
- return Number(value);
- }
-}
diff --git a/src/dev-app/legacy-list/BUILD.bazel b/src/dev-app/legacy-list/BUILD.bazel
deleted file mode 100644
index cbf21127903c..000000000000
--- a/src/dev-app/legacy-list/BUILD.bazel
+++ /dev/null
@@ -1,23 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-list",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-list-demo.html",
- ":legacy_list_demo_scss",
- ],
- deps = [
- "//src/material/icon",
- "//src/material/legacy-button",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-list",
- ],
-)
-
-sass_binary(
- name = "legacy_list_demo_scss",
- src = "legacy-list-demo.scss",
-)
diff --git a/src/dev-app/legacy-list/legacy-list-demo.html b/src/dev-app/legacy-list/legacy-list-demo.html
deleted file mode 100644
index a97ec3aebfa7..000000000000
--- a/src/dev-app/legacy-list/legacy-list-demo.html
+++ /dev/null
@@ -1,229 +0,0 @@
-
-mat-list demo
-
-Show third line
-
-
-
-
Normal lists
-
-
- Items
-
- {{item}}
-
-
-
-
-
- {{contact.name}}
- extra line
- {{contact.headline}}
-
-
-
-
- Today
-
- {{message.from}}
-
- {{message.subject}} --
- {{message.message}}
-
-
-
- {{message.from}}
- {{message.subject}}
- {{message.message}}
-
-
-
-
-
- {{ link.name }}
-
- info
-
-
-
-
-
-
-
Dense lists
-
- Items
-
- {{item}}
-
-
-
-
-
- {{contact.name}}
- {{contact.headline}}
-
-
-
-
- Today
-
- {{message.from}}
- {{message.subject}}
- {{message.message}}
-
-
-
-
-
- {{ link.name }}
-
- info
-
-
-
-
-
-
-
-
Action list
-
-
- {{link.name}}
-
-
-
-
-
-
Selection list
-
-
- Groceries
-
- Bananas
- Oranges
- Apples
- Strawberries
-
-
-
- Dogs
-
-
- Shiba Inu
-
-
-
- Other Shiba Inu
-
-
-
-
Selected: {{selectedOptions | json}}
-
Change Event Count {{changeEventCount}}
-
Model Change Event Count {{modelChangeEventCount}}
-
-
- Disable Selection List
-
-
-
-
- Disable Selection List ripples
-
-
-
- Select all
- Deselect all
-
-
-
-
-
Single Selection list
-
-
- Favorite Grocery
-
- Bananas
- Oranges
- Apples
- Strawberries
-
-
-
Selected: {{favoriteOptions | json}}
-
-
-
-
Line alignment
-
-
-
- {{ link.name }}
- Not in an matLine
-
-
-
-
- First
-
- Second
- Not in an matLine
-
-
-
-
-
-
Icon alignment in selection list
-
-
-
- info
- Bananas
-
-
- info
- Oranges
-
-
- info
- Cake
-
-
- info
- Fries
-
-
-
-
- Toggle checkbox position
-
-
-
This div is for testing scrolled menus.
diff --git a/src/dev-app/legacy-menu/legacy-menu-demo.scss b/src/dev-app/legacy-menu/legacy-menu-demo.scss
deleted file mode 100644
index a3559edd5d40..000000000000
--- a/src/dev-app/legacy-menu/legacy-menu-demo.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.demo-menu {
- display: flex;
- flex-flow: row wrap;
-
- .demo-menu-section {
- width: 300px;
- margin: 20px;
- }
-
- .demo-end-icon {
- justify-content: flex-end;
- }
-}
diff --git a/src/dev-app/legacy-menu/legacy-menu-demo.ts b/src/dev-app/legacy-menu/legacy-menu-demo.ts
deleted file mode 100644
index 654a7ca717c7..000000000000
--- a/src/dev-app/legacy-menu/legacy-menu-demo.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatDividerModule} from '@angular/material/divider';
-import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyMenuModule} from '@angular/material/legacy-menu';
-import {MatToolbarModule} from '@angular/material/toolbar';
-
-@Component({
- selector: 'legacy-menu-demo',
- templateUrl: 'legacy-menu-demo.html',
- styleUrls: ['legacy-menu-demo.css'],
- standalone: true,
- imports: [
- CommonModule,
- MatLegacyButtonModule,
- MatDividerModule,
- MatIconModule,
- MatLegacyMenuModule,
- MatToolbarModule,
- ],
-})
-export class LegacyMenuDemo {
- selected = '';
- items = [
- {text: 'Refresh'},
- {text: 'Settings'},
- {text: 'Help', disabled: true},
- {text: 'Sign Out'},
- ];
-
- iconItems = [
- {text: 'Redial', icon: 'dialpad'},
- {text: 'Check voicemail', icon: 'voicemail', disabled: true},
- {text: 'Disable alerts', icon: 'notifications_off'},
- ];
-
- select(text: string) {
- this.selected = text;
- }
-}
diff --git a/src/dev-app/legacy-paginator/BUILD.bazel b/src/dev-app/legacy-paginator/BUILD.bazel
deleted file mode 100644
index c8ca4d019fdb..000000000000
--- a/src/dev-app/legacy-paginator/BUILD.bazel
+++ /dev/null
@@ -1,25 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-paginator",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-paginator-demo.html",
- ":legacy_paginator_demo_scss",
- ],
- deps = [
- "//src/material/legacy-card",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-paginator",
- "//src/material/legacy-slide-toggle",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_paginator_demo_scss",
- src = "legacy-paginator-demo.scss",
-)
diff --git a/src/dev-app/legacy-paginator/legacy-paginator-demo.html b/src/dev-app/legacy-paginator/legacy-paginator-demo.html
deleted file mode 100644
index 77bb73ea92b0..000000000000
--- a/src/dev-app/legacy-paginator/legacy-paginator-demo.html
+++ /dev/null
@@ -1,40 +0,0 @@
-
- No inputs
-
-
-
-
-
-
-
-
-
-
-
-
-
- Hide page size
- Show multiple page size options
- Show first/last buttons
- Disabled
-
-
-
-
-
- Output event: {{pageEvent | json}}
- getNumberOfPages: {{paginator.getNumberOfPages()}}
-
diff --git a/src/dev-app/legacy-paginator/legacy-paginator-demo.scss b/src/dev-app/legacy-paginator/legacy-paginator-demo.scss
deleted file mode 100644
index f0804fe3547e..000000000000
--- a/src/dev-app/legacy-paginator/legacy-paginator-demo.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-.demo-section {
- max-width: 500px;
- margin-bottom: 24px;
- background: #efefef !important;
-
- & > * {
- margin: 0 0 32px;
- }
-}
-
-.demo-options {
- display: flex;
- flex-direction: column;
- max-width: 300px;
-}
diff --git a/src/dev-app/legacy-paginator/legacy-paginator-demo.ts b/src/dev-app/legacy-paginator/legacy-paginator-demo.ts
deleted file mode 100644
index f4b72abdf1f5..000000000000
--- a/src/dev-app/legacy-paginator/legacy-paginator-demo.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatLegacyPaginatorModule, LegacyPageEvent} from '@angular/material/legacy-paginator';
-import {CommonModule} from '@angular/common';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyCardModule} from '@angular/material/legacy-card';
-import {MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySlideToggleModule} from '@angular/material/legacy-slide-toggle';
-
-@Component({
- selector: 'legacy-paginator-demo',
- templateUrl: 'legacy-paginator-demo.html',
- styleUrls: ['legacy-paginator-demo.css'],
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyCardModule,
- MatLegacyFormFieldModule,
- MatLegacyInputModule,
- MatLegacyPaginatorModule,
- MatLegacySlideToggleModule,
- ],
-})
-export class LegacyPaginatorDemo {
- length = 50;
- pageSize = 10;
- pageIndex = 0;
- pageSizeOptions = [5, 10, 25];
-
- hidePageSize = false;
- showPageSizeOptions = true;
- showFirstLastButtons = true;
- disabled = false;
-
- pageEvent: LegacyPageEvent;
-
- handlePageEvent(e: LegacyPageEvent) {
- this.pageEvent = e;
- this.length = e.length;
- this.pageSize = e.pageSize;
- this.pageIndex = e.pageIndex;
- }
-}
diff --git a/src/dev-app/legacy-progress-bar/BUILD.bazel b/src/dev-app/legacy-progress-bar/BUILD.bazel
deleted file mode 100644
index 8e53e3b1fe4f..000000000000
--- a/src/dev-app/legacy-progress-bar/BUILD.bazel
+++ /dev/null
@@ -1,23 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-progress-bar",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-progress-bar-demo.html",
- ":legacy_progress_bar_demo_scss",
- ],
- deps = [
- "//src/material/button-toggle",
- "//src/material/legacy-button",
- "//src/material/legacy-progress-bar",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_progress_bar_demo_scss",
- src = "legacy-progress-bar-demo.scss",
-)
diff --git a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.html b/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.html
deleted file mode 100644
index 0aec6d4166fc..000000000000
--- a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.html
+++ /dev/null
@@ -1,51 +0,0 @@
-
- Primary Color
- Accent Color
- Warn Color
-
-
-Determinate
-
-
- Value: {{determinateProgressValue}}
- Last animation complete value: {{determinateAnimationEndValue}}
- Increase
- Decrease
-
-
-
-
-
-
-
-Buffer
-
-
- Value: {{bufferProgressValue}}
- Last animation complete value: {{bufferAnimationEndValue}}
- Increase
- Decrease
- Buffer Value: {{bufferBufferValue}}
- Increase
- Decrease
-
-
-
-
-
-
-
-Indeterminate
-
-
-
-Query
-
-
diff --git a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.scss b/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.scss
deleted file mode 100644
index b83828a6417e..000000000000
--- a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-.demo-progress-bar-container {
- width: 100%;
-
- mat-progress-bar {
- margin: 20px 0;
- }
-}
-
-.demo-progress-bar-spacer {
- display: inline-block;
- width: 50px;
-}
-
-.demo-progress-bar-controls {
- margin: 10px 0;
-}
diff --git a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.ts b/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.ts
deleted file mode 100644
index 2c388ba24fe3..000000000000
--- a/src/dev-app/legacy-progress-bar/legacy-progress-bar-demo.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {ThemePalette} from '@angular/material/core';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatButtonToggleModule} from '@angular/material/button-toggle';
-import {MatLegacyProgressBarModule} from '@angular/material/legacy-progress-bar';
-
-// TODO(josephperrott): Add an automatically filling example progress bar.
-
-@Component({
- selector: 'legacy-progress-bar-demo',
- templateUrl: 'legacy-progress-bar-demo.html',
- styleUrls: ['legacy-progress-bar-demo.css'],
- standalone: true,
- imports: [FormsModule, MatLegacyButtonModule, MatButtonToggleModule, MatLegacyProgressBarModule],
-})
-export class LegacyProgressBarDemo {
- color: ThemePalette = 'primary';
- determinateProgressValue: number = 30;
- determinateAnimationEndValue: number;
- bufferAnimationEndValue: number;
- bufferProgressValue: number = 30;
- bufferBufferValue: number = 40;
-
- stepDeterminateProgressVal(val: number) {
- this.determinateProgressValue = this._clampValue(val + this.determinateProgressValue);
- }
-
- stepBufferProgressVal(val: number) {
- this.bufferProgressValue = this._clampValue(val + this.bufferProgressValue);
- }
-
- stepBufferBufferVal(val: number) {
- this.bufferBufferValue = this._clampValue(val + this.bufferBufferValue);
- }
-
- private _clampValue(value: number) {
- return Math.max(0, Math.min(100, value));
- }
-}
diff --git a/src/dev-app/legacy-progress-spinner/BUILD.bazel b/src/dev-app/legacy-progress-spinner/BUILD.bazel
deleted file mode 100644
index 971076383e1e..000000000000
--- a/src/dev-app/legacy-progress-spinner/BUILD.bazel
+++ /dev/null
@@ -1,24 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-progress-spinner",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-progress-spinner-demo.html",
- ":legacy_progress_spinner_demo_scss",
- ],
- deps = [
- "//src/material/button-toggle",
- "//src/material/legacy-button",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-progress-spinner",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_progress_spinner_demo_scss",
- src = "legacy-progress-spinner-demo.scss",
-)
diff --git a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.html b/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.html
deleted file mode 100644
index eedb490dd4d1..000000000000
--- a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.html
+++ /dev/null
@@ -1,32 +0,0 @@
-Determinate
-
-
-
Value: {{progressValue}}
-
Increase
-
Decrease
-
Is determinate
-
-
-
-Indeterminate
-
-
- Primary Color
- Accent Color
- Warn Color
-
-
-
-
-
diff --git a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.scss b/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.scss
deleted file mode 100644
index c17e2dfe23a0..000000000000
--- a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.demo-progress-spinner {
- width: 100%;
-
- .mat-progress-spinner,
- .mat-spinner {
- display: inline-block;
- }
-
-}
-
-.demo-progress-spinner-controls {
- margin: 10px 0;
-}
diff --git a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.ts b/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.ts
deleted file mode 100644
index 8d929850bae5..000000000000
--- a/src/dev-app/legacy-progress-spinner/legacy-progress-spinner-demo.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {ThemePalette} from '@angular/material/core';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatButtonToggleModule} from '@angular/material/button-toggle';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {MatLegacyProgressSpinnerModule} from '@angular/material/legacy-progress-spinner';
-
-@Component({
- selector: 'legacy-progress-spinner-demo',
- templateUrl: 'legacy-progress-spinner-demo.html',
- styleUrls: ['legacy-progress-spinner-demo.css'],
- standalone: true,
- imports: [
- FormsModule,
- MatLegacyButtonModule,
- MatButtonToggleModule,
- MatLegacyCheckboxModule,
- MatLegacyProgressSpinnerModule,
- ],
-})
-export class LegacyProgressSpinnerDemo {
- progressValue = 60;
- color: ThemePalette = 'primary';
- isDeterminate = true;
-
- step(val: number) {
- this.progressValue = Math.max(0, Math.min(100, val + this.progressValue));
- }
-}
diff --git a/src/dev-app/legacy-radio/BUILD.bazel b/src/dev-app/legacy-radio/BUILD.bazel
deleted file mode 100644
index 6e08a49f423e..000000000000
--- a/src/dev-app/legacy-radio/BUILD.bazel
+++ /dev/null
@@ -1,23 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-radio",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-radio-demo.html",
- ":legacy_radio_demo_scss",
- ],
- deps = [
- "//src/material/legacy-button",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-radio",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_radio_demo_scss",
- src = "legacy-radio-demo.scss",
-)
diff --git a/src/dev-app/legacy-radio/legacy-radio-demo.html b/src/dev-app/legacy-radio/legacy-radio-demo.html
deleted file mode 100644
index 19b51db6abd1..000000000000
--- a/src/dev-app/legacy-radio/legacy-radio-demo.html
+++ /dev/null
@@ -1,62 +0,0 @@
-Basic Example
-
- Option 1
- Option 2
- Option 3 (disabled)
-
-
-Color Example
-
- Default (accent)
- Primary
- Accent
- Warn
-
-
-Group Color Example
-
-
- Option 1
- Option 2
- Option 3
- Option with color override
-
-
-
-Dynamic Example
-
-
- isDisabled: {{isDisabled}}
-
- Disable buttons
-
-
-
- isRequired: {{isRequired}}
-
- Require buttons
-
-
-
- Align end
-
- Option 1
- Option 2
- Option 3
-
-
-Favorite Season Example
-Dynamic Example with two-way data-binding
-
-
-
- {{season}}
-
-
- Your favorite season is: {{favoriteSeason}}
-
diff --git a/src/dev-app/legacy-radio/legacy-radio-demo.scss b/src/dev-app/legacy-radio/legacy-radio-demo.scss
deleted file mode 100644
index ee738628af6a..000000000000
--- a/src/dev-app/legacy-radio/legacy-radio-demo.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.demo-button {
- margin: 8px;
- text-transform: uppercase;
-}
-
-.demo-section {
- margin: 8px;
- padding: 16px;
-
- .mat-radio-button {
- margin: 8px;
- }
-}
diff --git a/src/dev-app/legacy-radio/legacy-radio-demo.ts b/src/dev-app/legacy-radio/legacy-radio-demo.ts
deleted file mode 100644
index 80e2621064e7..000000000000
--- a/src/dev-app/legacy-radio/legacy-radio-demo.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {MatLegacyRadioModule} from '@angular/material/legacy-radio';
-
-@Component({
- selector: 'legacy-radio-demo',
- templateUrl: 'legacy-radio-demo.html',
- styleUrls: ['legacy-radio-demo.css'],
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyButtonModule,
- MatLegacyCheckboxModule,
- MatLegacyRadioModule,
- ],
-})
-export class LegacyRadioDemo {
- isAlignEnd: boolean = false;
- isDisabled: boolean = false;
- isRequired: boolean = false;
- favoriteSeason: string = 'Autumn';
- seasonOptions = ['Winter', 'Spring', 'Summer', 'Autumn'];
-}
diff --git a/src/dev-app/legacy-select/BUILD.bazel b/src/dev-app/legacy-select/BUILD.bazel
deleted file mode 100644
index efcbef09b2ea..000000000000
--- a/src/dev-app/legacy-select/BUILD.bazel
+++ /dev/null
@@ -1,27 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-select",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-select-demo.html",
- ":legacy_select_demo_scss",
- ],
- deps = [
- "//src/material/icon",
- "//src/material/legacy-button",
- "//src/material/legacy-card",
- "//src/material/legacy-dialog",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-select",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_select_demo_scss",
- src = "legacy-select-demo.scss",
-)
diff --git a/src/dev-app/legacy-select/legacy-select-demo.html b/src/dev-app/legacy-select/legacy-select-demo.html
deleted file mode 100644
index 2b5910d91c87..000000000000
--- a/src/dev-app/legacy-select/legacy-select-demo.html
+++ /dev/null
@@ -1,433 +0,0 @@
-Space above cards: SHOW SELECT
-
-
-
-
- ngModel
-
-
- Drink
-
- None
-
- {{ drink.viewValue }}
-
-
- local_drink
- Pick a drink!
- You must make a selection
-
- Value: {{ currentDrink }}
- Touched: {{ drinkControl.touched }}
- Dirty: {{ drinkControl.dirty }}
- Status: {{ drinkControl.status }}
-
- Floating placeholder:
-
- Auto
- Always
- Never
-
-
-
- Width:
-
- Default
- 400px
-
-
-
- Theme:
-
-
- {{theme.name}}
-
-
-
-
- SET VALUE
- TOGGLE REQUIRED
- TOGGLE DISABLED
- RESET
-
-
-
- Multiple selection
-
-
-
- Pokemon
-
-
- {{ creature.viewValue }}
-
-
-
- Value: {{ currentPokemon }}
- Touched: {{ pokemonControl.touched }}
- Dirty: {{ pokemonControl.dirty }}
- Status: {{ pokemonControl.status }}
-
- Theme:
-
- {{ theme.name }}
-
-
- SET VALUE
- TOGGLE REQUIRED
- TOGGLE DISABLED
- RESET
-
-
-
-
- Without Angular forms
-
-
- Digimon
-
- None
-
- {{ creature.viewValue }}
-
-
-
-
- Value: {{ currentDigimon }}
-
- SET VALUE
- RESET
-
-
-
- Option groups
-
-
-
- Pokemon
-
-
-
- {{ creature.viewValue }}
-
-
-
-
-
-
-
-
-
- compareWith
-
-
- Drink
-
-
- {{ drink.viewValue }}
-
-
-
- Value: {{ currentDrinkObject | json }}
- Touched: {{ drinkObjectControl.touched }}
- Dirty: {{ drinkObjectControl.dirty }}
- Status: {{ drinkObjectControl.status }}
- Comparison Mode: {{ compareByValue ? 'VALUE' : 'REFERENCE' }}
-
-
- REASSIGN DRINK BY COPY
-
- TOGGLE REQUIRED
- TOGGLE COMPARE BY VALUE
- RESET
-
-
-
-
- Appearance comparison
-
-
-
- Legacy
-
- None
-
- {{ creature.viewValue }}
-
-
-
-
-
-
-
- Standard
-
- None
-
- {{ creature.viewValue }}
-
-
-
-
-
-
-
- Fill
-
- None
-
- {{ creature.viewValue }}
-
-
-
-
-
-
-
- Outline
-
- None
-
- {{ creature.viewValue }}
-
-
-
-
-
- TOGGLE SELECTED
-
-
-
-
-
- formControl
-
-
-
- Food I would like to eat
-
- {{ food.viewValue }}
-
-
- Value: {{ foodControl.value }}
- Touched: {{ foodControl.touched }}
- Dirty: {{ foodControl.dirty }}
- Status: {{ foodControl.status }}
- SET VALUE
- TOGGLE DISABLED
- RESET
-
-
-
-
-
-
- Change event
-
-
-
- Starter pokemon
-
- {{ creature.viewValue }}
-
-
-
- Change event value: {{ latestChangeEvent.value }}
-
-
-
-
-
- MatSelect inside a dialog
-
-
- Open dialog
-
-
-
- Your name
-
-
-
- Select a topping
-
- Cheese
- Onion
- Pepper
-
-
-
- Done
-
-
-
-
-
-
-
-
-
-
diff --git a/src/dev-app/legacy-select/legacy-select-demo.scss b/src/dev-app/legacy-select/legacy-select-demo.scss
deleted file mode 100644
index 0f9f40f25c08..000000000000
--- a/src/dev-app/legacy-select/legacy-select-demo.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-.demo-select {
- display: flex;
- flex-flow: row wrap;
-
- .mat-card {
- width: 450px;
- margin: 24px 24px 0 0;
-
- [dir='rtl'] :host & {
- margin: 24px 0 0 24px;
- }
- }
-
- .demo-drink-icon {
- vertical-align: bottom;
- padding-right: 0.25em;
- }
-
- .demo-drinks-width-large {
- width: 400px;
- }
-}
-
-.demo-card {
- margin: 30px 0;
-}
diff --git a/src/dev-app/legacy-select/legacy-select-demo.ts b/src/dev-app/legacy-select/legacy-select-demo.ts
deleted file mode 100644
index 952594ebe47e..000000000000
--- a/src/dev-app/legacy-select/legacy-select-demo.ts
+++ /dev/null
@@ -1,186 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component, TemplateRef} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {FormControl, FormsModule, ReactiveFormsModule, Validators} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatLegacyCardModule} from '@angular/material/legacy-card';
-import {ErrorStateMatcher, ThemePalette} from '@angular/material/core';
-import {MatLegacyDialog, MatLegacyDialogModule} from '@angular/material/legacy-dialog';
-import {LegacyFloatLabelType, MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySelectChange, MatLegacySelectModule} from '@angular/material/legacy-select';
-
-/** Error any time control is invalid */
-export class MyErrorStateMatcher implements ErrorStateMatcher {
- isErrorState(control: FormControl | null): boolean {
- if (control) {
- return control.invalid;
- }
- return false;
- }
-}
-
-@Component({
- selector: 'legacy-select-demo',
- templateUrl: 'legacy-select-demo.html',
- styleUrls: ['legacy-select-demo.css'],
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyButtonModule,
- MatLegacyCardModule,
- MatLegacyDialogModule,
- MatLegacyFormFieldModule,
- MatIconModule,
- MatLegacyInputModule,
- MatLegacySelectModule,
- ReactiveFormsModule,
- ],
-})
-export class LegacySelectDemo {
- drinksRequired = false;
- drinkObjectRequired = false;
- pokemonRequired = false;
- drinksDisabled = false;
- pokemonDisabled = false;
- showSelect = false;
- currentDrink: string;
- currentDrinkObject: {} | undefined = {value: 'tea-5', viewValue: 'Tea'};
- currentPokemon: string[];
- currentPokemonFromGroup: string;
- currentDigimon: string;
- currentAppearanceValue: string | null;
- latestChangeEvent: MatLegacySelectChange;
- floatLabel: LegacyFloatLabelType = 'auto';
- drinksWidth = 'default';
- foodControl = new FormControl('pizza-1');
- topHeightCtrl = new FormControl(0);
- drinksTheme: ThemePalette = 'primary';
- pokemonTheme: ThemePalette = 'primary';
- compareByValue = true;
- selectFormControl = new FormControl('', Validators.required);
-
- foods = [
- {value: null, viewValue: 'None'},
- {value: 'steak-0', viewValue: 'Steak'},
- {value: 'pizza-1', viewValue: 'Pizza'},
- {value: 'tacos-2', viewValue: 'Tacos'},
- ];
-
- drinks = [
- {value: 'coke-0', viewValue: 'Coke', disabled: false},
- {
- value: 'long-name-1',
- viewValue: 'Decaf Chocolate Brownie Vanilla Gingerbread Frappuccino',
- disabled: false,
- },
- {value: 'water-2', viewValue: 'Water', disabled: false},
- {value: 'pepper-3', viewValue: 'Dr. Pepper', disabled: false},
- {value: 'coffee-4', viewValue: 'Coffee', disabled: false},
- {value: 'tea-5', viewValue: 'Tea', disabled: false},
- {value: 'juice-6', viewValue: 'Orange juice', disabled: false},
- {value: 'wine-7', viewValue: 'Wine', disabled: false},
- {value: 'milk-8', viewValue: 'Milk', disabled: true},
- ];
-
- pokemon = [
- {value: 'bulbasaur-0', viewValue: 'Bulbasaur'},
- {value: 'charizard-1', viewValue: 'Charizard'},
- {value: 'squirtle-2', viewValue: 'Squirtle'},
- {value: 'pikachu-3', viewValue: 'Pikachu'},
- {value: 'jigglypuff-4', viewValue: 'Jigglypuff with a really long name that will truncate'},
- {value: 'ditto-5', viewValue: 'Ditto'},
- {value: 'psyduck-6', viewValue: 'Psyduck'},
- ];
-
- availableThemes = [
- {value: 'primary', name: 'Primary'},
- {value: 'accent', name: 'Accent'},
- {value: 'warn', name: 'Warn'},
- ];
-
- pokemonGroups = [
- {
- name: 'Grass',
- pokemon: [
- {value: 'bulbasaur-0', viewValue: 'Bulbasaur'},
- {value: 'oddish-1', viewValue: 'Oddish'},
- {value: 'bellsprout-2', viewValue: 'Bellsprout'},
- ],
- },
- {
- name: 'Water',
- pokemon: [
- {value: 'squirtle-3', viewValue: 'Squirtle'},
- {value: 'psyduck-4', viewValue: 'Psyduck'},
- {value: 'horsea-5', viewValue: 'Horsea'},
- ],
- },
- {
- name: 'Fire',
- disabled: true,
- pokemon: [
- {value: 'charmander-6', viewValue: 'Charmander'},
- {value: 'vulpix-7', viewValue: 'Vulpix'},
- {value: 'flareon-8', viewValue: 'Flareon'},
- ],
- },
- {
- name: 'Psychic',
- pokemon: [
- {value: 'mew-9', viewValue: 'Mew'},
- {value: 'mewtwo-10', viewValue: 'Mewtwo'},
- ],
- },
- ];
-
- digimon = [
- {value: 'mihiramon-0', viewValue: 'Mihiramon'},
- {value: 'sandiramon-1', viewValue: 'Sandiramon'},
- {value: 'sinduramon-2', viewValue: 'Sinduramon'},
- {value: 'pajiramon-3', viewValue: 'Pajiramon'},
- {value: 'vajiramon-4', viewValue: 'Vajiramon'},
- {value: 'indramon-5', viewValue: 'Indramon'},
- ];
-
- constructor(private _dialog: MatLegacyDialog) {}
-
- toggleDisabled() {
- this.foodControl.enabled ? this.foodControl.disable() : this.foodControl.enable();
- }
-
- setPokemonValue() {
- this.currentPokemon = ['jigglypuff-4', 'psyduck-6'];
- }
-
- reassignDrinkByCopy() {
- this.currentDrinkObject = {...this.currentDrinkObject};
- }
-
- compareDrinkObjectsByValue(d1: {value: string}, d2: {value: string}) {
- return d1 && d2 && d1.value === d2.value;
- }
-
- compareByReference(o1: any, o2: any) {
- return o1 === o2;
- }
-
- matcher = new MyErrorStateMatcher();
-
- toggleSelected() {
- this.currentAppearanceValue = this.currentAppearanceValue ? null : this.digimon[0].value;
- }
-
- openDialogWithSelectInside(dialogTemplate: TemplateRef) {
- this._dialog.open(dialogTemplate);
- }
-}
diff --git a/src/dev-app/legacy-slide-toggle/BUILD.bazel b/src/dev-app/legacy-slide-toggle/BUILD.bazel
deleted file mode 100644
index 042dcca2654d..000000000000
--- a/src/dev-app/legacy-slide-toggle/BUILD.bazel
+++ /dev/null
@@ -1,22 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-slide-toggle",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-slide-toggle-demo.html",
- ":legacy_slide_toggle_demo_scss",
- ],
- deps = [
- "//src/material/legacy-button",
- "//src/material/legacy-slide-toggle",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_slide_toggle_demo_scss",
- src = "legacy-slide-toggle-demo.scss",
-)
diff --git a/src/dev-app/legacy-slide-toggle/legacy-slide-toggle-demo.html b/src/dev-app/legacy-slide-toggle/legacy-slide-toggle-demo.html
deleted file mode 100644
index 105158669f29..000000000000
--- a/src/dev-app/legacy-slide-toggle/legacy-slide-toggle-demo.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-
-
- Default Slide Toggle
-
-
-
- Disabled Slide Toggle
-
-
-
- Disable Bound
-
-
-
Example where the slide toggle is required inside of a form.
-
-
-
-
Default Slider
-Label Colors
-Slider with Min and Max
-
-
-{{slider2.value}}
-Disabled Slider
-
-
-Slider with set value
-Slider with step defined
-Slider with set tick interval
-Slider with Thumb Label
-Slider with one-way binding
-Slider with two-way binding
-Inverted slider
-Vertical slider
-
-
-
-Inverted vertical slider
-
-
-
-Set/lost focus to show thumblabel programmatically
-Focus Slider
-Blur Slider
-
-
-
-
-
diff --git a/src/dev-app/legacy-slider/legacy-slider-demo.ts b/src/dev-app/legacy-slider/legacy-slider-demo.ts
deleted file mode 100644
index 2ba0cae88c46..000000000000
--- a/src/dev-app/legacy-slider/legacy-slider-demo.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormsModule} from '@angular/forms';
-import {MatLegacySliderModule} from '@angular/material/legacy-slider';
-import {MatLegacyTabsModule} from '@angular/material/legacy-tabs';
-
-@Component({
- selector: 'legacy-slider-demo',
- templateUrl: 'legacy-slider-demo.html',
- standalone: true,
- imports: [FormsModule, MatLegacySliderModule, MatLegacyTabsModule],
-})
-export class LegacySliderDemo {
- demo: number;
- val: number = 50;
- min: number = 0;
- max: number = 100;
- disabledValue = 0;
-}
diff --git a/src/dev-app/legacy-snack-bar/BUILD.bazel b/src/dev-app/legacy-snack-bar/BUILD.bazel
deleted file mode 100644
index ca46afc2bc0a..000000000000
--- a/src/dev-app/legacy-snack-bar/BUILD.bazel
+++ /dev/null
@@ -1,27 +0,0 @@
-load("//tools:defaults.bzl", "ng_module", "sass_binary")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-snack-bar",
- srcs = glob(["**/*.ts"]),
- assets = [
- "legacy-snack-bar-demo.html",
- ":legacy_snack_bar_demo_scss",
- ],
- deps = [
- "//src/cdk/bidi",
- "//src/material/legacy-button",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-form-field",
- "//src/material/legacy-input",
- "//src/material/legacy-select",
- "//src/material/legacy-snack-bar",
- "@npm//@angular/forms",
- ],
-)
-
-sass_binary(
- name = "legacy_snack_bar_demo_scss",
- src = "legacy-snack-bar-demo.scss",
-)
diff --git a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.html b/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.html
deleted file mode 100644
index e8ef3ca05cc0..000000000000
--- a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.html
+++ /dev/null
@@ -1,59 +0,0 @@
-SnackBar demo
-
-
- Message:
-
-
Position in page:
-
-
- Start
- End
- Left
- Right
- Center
-
-
-
-
- Top
- Bottom
-
-
-
-
-
- Show button on snack bar
-
- Snack bar action label
-
-
-
-
-
- Auto hide after duration
-
- Auto hide duration in ms
-
-
-
-
- Add extra class to container
-
-
- OPEN
-
-
-OPEN TEMPLATE
-
-
- Template snack bar: {{message}}
-
diff --git a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.scss b/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.scss
deleted file mode 100644
index 65c4fd50d754..000000000000
--- a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-.demo-party {
- animation: demo-party 5000ms infinite;
-}
-
-@keyframes demo-party {
- 0% { background: #00f; }
- 10% { background: #8e44ad; }
- 20% { background: #1abc9c; }
- 30% { background: #d35400; }
- 40% { background: #00f; }
- 50% { background: #34495e; }
- 60% { background: #00f; }
- 70% { background: #2980b9; }
- 80% { background: #f1c40f; }
- 90% { background: #2980b9; }
- 100% { background: #0ff; }
-}
diff --git a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.ts b/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.ts
deleted file mode 100644
index af96c3a97a17..000000000000
--- a/src/dev-app/legacy-snack-bar/legacy-snack-bar-demo.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component, TemplateRef, ViewChild, ViewEncapsulation} from '@angular/core';
-import {Directionality} from '@angular/cdk/bidi';
-import {CommonModule} from '@angular/common';
-import {FormsModule} from '@angular/forms';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {MatLegacyFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacySelectModule} from '@angular/material/legacy-select';
-import {
- MatLegacySnackBar,
- MatLegacySnackBarConfig,
- MatLegacySnackBarHorizontalPosition,
- MatLegacySnackBarModule,
- MatLegacySnackBarVerticalPosition,
-} from '@angular/material/legacy-snack-bar';
-
-@Component({
- selector: 'legacy-snack-bar-demo',
- styleUrls: ['legacy-snack-bar-demo.css'],
- templateUrl: 'legacy-snack-bar-demo.html',
- encapsulation: ViewEncapsulation.None,
- standalone: true,
- imports: [
- CommonModule,
- FormsModule,
- MatLegacyButtonModule,
- MatLegacyCheckboxModule,
- MatLegacyFormFieldModule,
- MatLegacyInputModule,
- MatLegacySelectModule,
- MatLegacySnackBarModule,
- ],
-})
-export class LegacySnackBarDemo {
- @ViewChild('template') template: TemplateRef;
- message = 'Snack Bar opened.';
- actionButtonLabel = 'Retry';
- action = false;
- setAutoHide = true;
- autoHide = 10000;
- addExtraClass = false;
- horizontalPosition: MatLegacySnackBarHorizontalPosition = 'center';
- verticalPosition: MatLegacySnackBarVerticalPosition = 'bottom';
-
- constructor(public snackBar: MatLegacySnackBar, private _dir: Directionality) {}
-
- open() {
- const config = this._createConfig();
- this.snackBar.open(this.message, this.action ? this.actionButtonLabel : undefined, config);
- }
-
- openTemplate() {
- const config = this._createConfig();
- this.snackBar.openFromTemplate(this.template, config);
- }
-
- private _createConfig() {
- const config = new MatLegacySnackBarConfig();
- config.verticalPosition = this.verticalPosition;
- config.horizontalPosition = this.horizontalPosition;
- config.duration = this.setAutoHide ? this.autoHide : 0;
- config.panelClass = this.addExtraClass ? ['demo-party'] : undefined;
- config.direction = this._dir.value;
- return config;
- }
-}
diff --git a/src/dev-app/legacy-table/BUILD.bazel b/src/dev-app/legacy-table/BUILD.bazel
deleted file mode 100644
index 7d56748d6961..000000000000
--- a/src/dev-app/legacy-table/BUILD.bazel
+++ /dev/null
@@ -1,14 +0,0 @@
-load("//tools:defaults.bzl", "ng_module")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "legacy-table",
- srcs = glob(["**/*.ts"]),
- assets = ["legacy-table-demo.html"],
- deps = [
- "//src/components-examples/cdk/table",
- "//src/dev-app/example",
- "//src/dev-app/legacy-table/examples",
- ],
-)
diff --git a/src/dev-app/legacy-table/examples/BUILD.bazel b/src/dev-app/legacy-table/examples/BUILD.bazel
deleted file mode 100644
index 779827ea5563..000000000000
--- a/src/dev-app/legacy-table/examples/BUILD.bazel
+++ /dev/null
@@ -1,38 +0,0 @@
-load("//tools:defaults.bzl", "ng_module")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "examples",
- srcs = glob(["**/*.ts"]),
- assets = glob([
- "**/*.html",
- "**/*.css",
- ]),
- deps = [
- "//src/cdk/drag-drop",
- "//src/cdk/table",
- "//src/material/button-toggle",
- "//src/material/core",
- "//src/material/icon",
- "//src/material/legacy-button",
- "//src/material/legacy-checkbox",
- "//src/material/legacy-input",
- "//src/material/legacy-paginator",
- "//src/material/legacy-progress-spinner",
- "//src/material/legacy-table",
- "//src/material/sort",
- "@npm//@angular/platform-browser",
- "@npm//@angular/platform-browser-dynamic",
- "@npm//@types/jasmine",
- ],
-)
-
-filegroup(
- name = "source-files",
- srcs = glob([
- "**/*.html",
- "**/*.css",
- "**/*.ts",
- ]),
-)
diff --git a/src/dev-app/legacy-table/examples/index.ts b/src/dev-app/legacy-table/examples/index.ts
deleted file mode 100644
index 9f8ffdcfc199..000000000000
--- a/src/dev-app/legacy-table/examples/index.ts
+++ /dev/null
@@ -1,142 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {CommonModule} from '@angular/common';
-import {NgModule} from '@angular/core';
-import {MatRippleModule} from '@angular/material/core';
-import {MatLegacyButtonModule} from '@angular/material/legacy-button';
-import {MatButtonToggleModule} from '@angular/material/button-toggle';
-import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
-import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyInputModule} from '@angular/material/legacy-input';
-import {MatLegacyPaginatorModule} from '@angular/material/legacy-paginator';
-import {MatLegacyProgressSpinnerModule} from '@angular/material/legacy-progress-spinner';
-import {MatSortModule} from '@angular/material/sort';
-import {MatLegacyTableModule} from '@angular/material/legacy-table';
-import {DragDropModule} from '@angular/cdk/drag-drop';
-import {CdkTableModule} from '@angular/cdk/table';
-
-import {LegacyTableFlexBasicExample} from './legacy-table-flex-basic/legacy-table-flex-basic-example';
-import {LegacyTableBasicExample} from './legacy-table-basic/legacy-table-basic-example';
-import {LegacyTableDynamicColumnsExample} from './legacy-table-dynamic-columns/legacy-table-dynamic-columns-example';
-import {LegacyTableExpandableRowsExample} from './legacy-table-expandable-rows/legacy-table-expandable-rows-example';
-import {LegacyTableFilteringExample} from './legacy-table-filtering/legacy-table-filtering-example';
-import {LegacyTableFooterRowExample} from './legacy-table-footer-row/legacy-table-footer-row-example';
-import {LegacyTableHttpExample} from './legacy-table-http/legacy-table-http-example';
-import {LegacyTableMultipleHeaderFooterExample} from './legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example';
-import {LegacyTableOverviewExample} from './legacy-table-overview/legacy-table-overview-example';
-import {LegacyTablePaginationExample} from './legacy-table-pagination/legacy-table-pagination-example';
-import {LegacyTableRowContextExample} from './legacy-table-row-context/legacy-table-row-context-example';
-import {LegacyTableSelectionExample} from './legacy-table-selection/legacy-table-selection-example';
-import {LegacyTableSortingExample} from './legacy-table-sorting/legacy-table-sorting-example';
-import {LegacyTableStickyColumnsExample} from './legacy-table-sticky-columns/legacy-table-sticky-columns-example';
-import {LegacyTableStickyComplexFlexExample} from './legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example';
-import {LegacyTableStickyComplexExample} from './legacy-table-sticky-complex/legacy-table-sticky-complex-example';
-import {LegacyTableStickyFooterExample} from './legacy-table-sticky-footer/legacy-table-sticky-footer-example';
-import {LegacyTableStickyHeaderExample} from './legacy-table-sticky-header/legacy-table-sticky-header-example';
-import {LegacyTableTextColumnAdvancedExample} from './legacy-table-text-column-advanced/legacy-table-text-column-advanced-example';
-import {LegacyTableTextColumnExample} from './legacy-table-text-column/legacy-table-text-column-example';
-import {
- LegacyTableWrappedExample,
- WrapperTable,
-} from './legacy-table-wrapped/legacy-table-wrapped-example';
-import {LegacyTableReorderableExample} from './legacy-table-reorderable/legacy-table-reorderable-example';
-import {LegacyTableRecycleRowsExample} from './legacy-table-recycle-rows/legacy-table-recycle-rows-example';
-import {LegacyTableWithRipplesExample} from './legacy-table-with-ripples/legacy-table-with-ripples-example';
-import {LegacyTableColumnStylingExample} from './legacy-table-column-styling/legacy-table-column-styling-example';
-import {LegacyTableRowBindingExample} from './legacy-table-row-binding/legacy-table-row-binding-example';
-import {LegacyTableDynamicArrayDataExample} from './legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example';
-import {LegacyTableDynamicObservableDataExample} from './legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example';
-import {LegacyTableGeneratedColumnsExample} from './legacy-table-generated-columns/legacy-table-generated-columns-example';
-
-export {
- LegacyTableBasicExample,
- LegacyTableColumnStylingExample,
- LegacyTableDynamicArrayDataExample,
- LegacyTableDynamicColumnsExample,
- LegacyTableDynamicObservableDataExample,
- LegacyTableExpandableRowsExample,
- LegacyTableFilteringExample,
- LegacyTableFlexBasicExample,
- LegacyTableFooterRowExample,
- LegacyTableGeneratedColumnsExample,
- LegacyTableHttpExample,
- LegacyTableMultipleHeaderFooterExample,
- LegacyTableOverviewExample,
- LegacyTablePaginationExample,
- LegacyTableRecycleRowsExample,
- LegacyTableReorderableExample,
- LegacyTableRowBindingExample,
- LegacyTableRowContextExample,
- LegacyTableSelectionExample,
- LegacyTableSortingExample,
- LegacyTableStickyColumnsExample,
- LegacyTableStickyComplexExample,
- LegacyTableStickyComplexFlexExample,
- LegacyTableStickyFooterExample,
- LegacyTableStickyHeaderExample,
- LegacyTableTextColumnAdvancedExample,
- LegacyTableTextColumnExample,
- LegacyTableWithRipplesExample,
- LegacyTableWrappedExample,
- WrapperTable,
-};
-
-const EXAMPLES = [
- LegacyTableBasicExample,
- LegacyTableColumnStylingExample,
- LegacyTableDynamicArrayDataExample,
- LegacyTableDynamicColumnsExample,
- LegacyTableDynamicObservableDataExample,
- LegacyTableExpandableRowsExample,
- LegacyTableFilteringExample,
- LegacyTableFlexBasicExample,
- LegacyTableFooterRowExample,
- LegacyTableGeneratedColumnsExample,
- LegacyTableHttpExample,
- LegacyTableMultipleHeaderFooterExample,
- LegacyTableOverviewExample,
- LegacyTablePaginationExample,
- LegacyTableRecycleRowsExample,
- LegacyTableReorderableExample,
- LegacyTableRowBindingExample,
- LegacyTableRowContextExample,
- LegacyTableSelectionExample,
- LegacyTableSortingExample,
- LegacyTableStickyColumnsExample,
- LegacyTableStickyComplexExample,
- LegacyTableStickyComplexFlexExample,
- LegacyTableStickyFooterExample,
- LegacyTableStickyHeaderExample,
- LegacyTableTextColumnAdvancedExample,
- LegacyTableTextColumnExample,
- LegacyTableWithRipplesExample,
- LegacyTableWrappedExample,
- WrapperTable,
-];
-
-@NgModule({
- imports: [
- CommonModule,
- MatLegacyButtonModule,
- MatButtonToggleModule,
- MatLegacyCheckboxModule,
- MatIconModule,
- MatLegacyInputModule,
- MatLegacyPaginatorModule,
- MatLegacyProgressSpinnerModule,
- MatRippleModule,
- MatSortModule,
- MatLegacyTableModule,
- CdkTableModule,
- DragDropModule,
- ],
- declarations: EXAMPLES,
- exports: EXAMPLES,
-})
-export class LegacyTableExamplesModule {}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.css b/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.html b/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.html
deleted file mode 100644
index 054cb0c6ae41..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.html
+++ /dev/null
@@ -1,33 +0,0 @@
-
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.ts b/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.ts
deleted file mode 100644
index 483508bb7eb2..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-basic/legacy-table-basic-example.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Basic use of ``
- */
-@Component({
- selector: 'legacy-table-basic-example',
- styleUrls: ['legacy-table-basic-example.css'],
- templateUrl: 'legacy-table-basic-example.html',
-})
-export class LegacyTableBasicExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.css b/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.css
deleted file mode 100644
index 92a61946af0c..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.css
+++ /dev/null
@@ -1,25 +0,0 @@
-.demo-table {
- width: 100%;
-}
-
-.mat-column-demo-position {
- width: 32px;
- border-right: 1px solid currentColor;
- padding-right: 24px;
- text-align: center;
-}
-
-.mat-column-demo-name {
- padding-left: 16px;
- font-size: 20px;
-}
-
-.mat-column-demo-weight {
- font-style: italic;
-}
-
-.mat-column-demo-symbol {
- width: 32px;
- text-align: center;
- font-weight: bold;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.html b/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.html
deleted file mode 100644
index db278dd04306..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.ts b/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.ts
deleted file mode 100644
index 0ef19427610d..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-column-styling/legacy-table-column-styling-example.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Styling columns using their auto-generated column names
- */
-@Component({
- selector: 'legacy-table-column-styling-example',
- styleUrls: ['legacy-table-column-styling-example.css'],
- templateUrl: 'legacy-table-column-styling-example.html',
-})
-export class LegacyTableColumnStylingExample {
- displayedColumns: string[] = ['demo-position', 'demo-name', 'demo-weight', 'demo-symbol'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.css b/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.css
deleted file mode 100644
index bf32694f2ff1..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.css
+++ /dev/null
@@ -1,11 +0,0 @@
-.demo-table {
- width: 100%;
-}
-
-.demo-button-container {
- padding-bottom: 16px;
-}
-
-.demo-button + .demo-button {
- margin-left: 8px;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.html b/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.html
deleted file mode 100644
index 9e0cf9a588b7..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.html
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
- Add data
-
-
- Remove data
-
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.ts b/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.ts
deleted file mode 100644
index 938395e0e011..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-array-data/legacy-table-dynamic-array-data-example.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component, ViewChild} from '@angular/core';
-import {MatLegacyTable} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Adding and removing data when using an array-based datasource.
- */
-@Component({
- selector: 'legacy-table-dynamic-array-data-example',
- styleUrls: ['legacy-table-dynamic-array-data-example.css'],
- templateUrl: 'legacy-table-dynamic-array-data-example.html',
-})
-export class LegacyTableDynamicArrayDataExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = [...ELEMENT_DATA];
-
- @ViewChild(MatLegacyTable) table: MatLegacyTable;
-
- addData() {
- const randomElementIndex = Math.floor(Math.random() * ELEMENT_DATA.length);
- this.dataSource.push(ELEMENT_DATA[randomElementIndex]);
- this.table.renderRows();
- }
-
- removeData() {
- this.dataSource.pop();
- this.table.renderRows();
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.css b/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.css
deleted file mode 100644
index 879b4295bb15..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.css
+++ /dev/null
@@ -1,7 +0,0 @@
-table {
- width: 100%;
-}
-
-button {
- margin: 16px 8px;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.html b/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.html
deleted file mode 100644
index 9d2fcac7ac34..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.html
+++ /dev/null
@@ -1,13 +0,0 @@
- Add column
- Remove column
- Shuffle
-
-
-
- {{column}}
- {{element[column]}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.ts b/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.ts
deleted file mode 100644
index d1957e7ffc71..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-columns/legacy-table-dynamic-columns-example.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table dynamically changing the columns displayed
- */
-@Component({
- selector: 'legacy-table-dynamic-columns-example',
- styleUrls: ['legacy-table-dynamic-columns-example.css'],
- templateUrl: 'legacy-table-dynamic-columns-example.html',
-})
-export class LegacyTableDynamicColumnsExample {
- displayedColumns: string[] = ['name', 'weight', 'symbol', 'position'];
- columnsToDisplay: string[] = this.displayedColumns.slice();
- data: PeriodicElement[] = ELEMENT_DATA;
-
- addColumn() {
- const randomColumn = Math.floor(Math.random() * this.displayedColumns.length);
- this.columnsToDisplay.push(this.displayedColumns[randomColumn]);
- }
-
- removeColumn() {
- if (this.columnsToDisplay.length) {
- this.columnsToDisplay.pop();
- }
- }
-
- shuffle() {
- let currentIndex = this.columnsToDisplay.length;
- while (0 !== currentIndex) {
- let randomIndex = Math.floor(Math.random() * currentIndex);
- currentIndex -= 1;
-
- // Swap
- let temp = this.columnsToDisplay[currentIndex];
- this.columnsToDisplay[currentIndex] = this.columnsToDisplay[randomIndex];
- this.columnsToDisplay[randomIndex] = temp;
- }
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.css b/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.css
deleted file mode 100644
index bf32694f2ff1..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.css
+++ /dev/null
@@ -1,11 +0,0 @@
-.demo-table {
- width: 100%;
-}
-
-.demo-button-container {
- padding-bottom: 16px;
-}
-
-.demo-button + .demo-button {
- margin-left: 8px;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.html b/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.html
deleted file mode 100644
index b3388c5cc5b0..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.html
+++ /dev/null
@@ -1,41 +0,0 @@
-
-
- Add data
-
-
- Remove data
-
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.ts b/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.ts
deleted file mode 100644
index 6f47a55ca2b7..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-dynamic-observable-data/legacy-table-dynamic-observable-data-example.ts
+++ /dev/null
@@ -1,76 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {DataSource} from '@angular/cdk/collections';
-import {Observable, ReplaySubject} from 'rxjs';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Adding and removing data when using an observable-based datasource.
- */
-@Component({
- selector: 'legacy-table-dynamic-observable-data-example',
- styleUrls: ['legacy-table-dynamic-observable-data-example.css'],
- templateUrl: 'legacy-table-dynamic-observable-data-example.html',
-})
-export class LegacyTableDynamicObservableDataExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataToDisplay = [...ELEMENT_DATA];
-
- dataSource = new ExampleDataSource(this.dataToDisplay);
-
- addData() {
- const randomElementIndex = Math.floor(Math.random() * ELEMENT_DATA.length);
- this.dataToDisplay = [...this.dataToDisplay, ELEMENT_DATA[randomElementIndex]];
- this.dataSource.setData(this.dataToDisplay);
- }
-
- removeData() {
- this.dataToDisplay = this.dataToDisplay.slice(0, -1);
- this.dataSource.setData(this.dataToDisplay);
- }
-}
-
-class ExampleDataSource extends DataSource {
- private _dataStream = new ReplaySubject();
-
- constructor(initialData: PeriodicElement[]) {
- super();
- this.setData(initialData);
- }
-
- connect(): Observable {
- return this._dataStream;
- }
-
- disconnect() {}
-
- setData(data: PeriodicElement[]) {
- this._dataStream.next(data);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.css b/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.css
deleted file mode 100644
index a3cc2d66194c..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.css
+++ /dev/null
@@ -1,47 +0,0 @@
-table {
- width: 100%;
-}
-
-tr.example-detail-row {
- height: 0;
-}
-
-tr.example-element-row:not(.example-expanded-row):hover {
- background: whitesmoke;
-}
-
-tr.example-element-row:not(.example-expanded-row):active {
- background: #efefef;
-}
-
-.example-element-row td {
- border-bottom-width: 0;
-}
-
-.example-element-detail {
- overflow: hidden;
- display: flex;
-}
-
-.example-element-diagram {
- min-width: 80px;
- border: 2px solid black;
- padding: 8px;
- font-weight: lighter;
- margin: 8px 0;
- height: 104px;
-}
-
-.example-element-symbol {
- font-weight: bold;
- font-size: 40px;
- line-height: normal;
-}
-
-.example-element-description {
- padding: 16px;
-}
-
-.example-element-description-attribution {
- opacity: 0.5;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.html b/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.html
deleted file mode 100644
index 132dcd9f3f2f..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.html
+++ /dev/null
@@ -1,44 +0,0 @@
-
-
- {{column}}
- {{element[column]}}
-
-
-
-
-
- keyboard_arrow_down
- keyboard_arrow_up
-
-
-
-
-
-
-
-
-
-
{{element.position}}
-
{{element.symbol}}
-
{{element.name}}
-
{{element.weight}}
-
-
- {{element.description}}
- -- Wikipedia
-
-
-
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.ts b/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.ts
deleted file mode 100644
index b9f34e381354..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-expandable-rows/legacy-table-expandable-rows-example.ts
+++ /dev/null
@@ -1,131 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {animate, state, style, transition, trigger} from '@angular/animations';
-
-/**
- * @title Table with expandable rows
- */
-@Component({
- selector: 'legacy-table-expandable-rows-example',
- styleUrls: ['legacy-table-expandable-rows-example.css'],
- templateUrl: 'legacy-table-expandable-rows-example.html',
- animations: [
- trigger('detailExpand', [
- state('collapsed', style({height: '0px', minHeight: '0'})),
- state('expanded', style({height: '*'})),
- transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
- ]),
- ],
-})
-export class LegacyTableExpandableRowsExample {
- dataSource = ELEMENT_DATA;
- columnsToDisplay = ['name', 'weight', 'symbol', 'position'];
- columnsToDisplayWithExpand = [...this.columnsToDisplay, 'expand'];
- expandedElement: PeriodicElement | null;
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
- description: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {
- position: 1,
- name: 'Hydrogen',
- weight: 1.0079,
- symbol: 'H',
- description: `Hydrogen is a chemical element with symbol H and atomic number 1. With a standard
- atomic weight of 1.008, hydrogen is the lightest element on the periodic table.`,
- },
- {
- position: 2,
- name: 'Helium',
- weight: 4.0026,
- symbol: 'He',
- description: `Helium is a chemical element with symbol He and atomic number 2. It is a
- colorless, odorless, tasteless, non-toxic, inert, monatomic gas, the first in the noble gas
- group in the periodic table. Its boiling point is the lowest among all the elements.`,
- },
- {
- position: 3,
- name: 'Lithium',
- weight: 6.941,
- symbol: 'Li',
- description: `Lithium is a chemical element with symbol Li and atomic number 3. It is a soft,
- silvery-white alkali metal. Under standard conditions, it is the lightest metal and the
- lightest solid element.`,
- },
- {
- position: 4,
- name: 'Beryllium',
- weight: 9.0122,
- symbol: 'Be',
- description: `Beryllium is a chemical element with symbol Be and atomic number 4. It is a
- relatively rare element in the universe, usually occurring as a product of the spallation of
- larger atomic nuclei that have collided with cosmic rays.`,
- },
- {
- position: 5,
- name: 'Boron',
- weight: 10.811,
- symbol: 'B',
- description: `Boron is a chemical element with symbol B and atomic number 5. Produced entirely
- by cosmic ray spallation and supernovae and not by stellar nucleosynthesis, it is a
- low-abundance element in the Solar system and in the Earth's crust.`,
- },
- {
- position: 6,
- name: 'Carbon',
- weight: 12.0107,
- symbol: 'C',
- description: `Carbon is a chemical element with symbol C and atomic number 6. It is nonmetallic
- and tetravalent—making four electrons available to form covalent chemical bonds. It belongs
- to group 14 of the periodic table.`,
- },
- {
- position: 7,
- name: 'Nitrogen',
- weight: 14.0067,
- symbol: 'N',
- description: `Nitrogen is a chemical element with symbol N and atomic number 7. It was first
- discovered and isolated by Scottish physician Daniel Rutherford in 1772.`,
- },
- {
- position: 8,
- name: 'Oxygen',
- weight: 15.9994,
- symbol: 'O',
- description: `Oxygen is a chemical element with symbol O and atomic number 8. It is a member of
- the chalcogen group on the periodic table, a highly reactive nonmetal, and an oxidizing
- agent that readily forms oxides with most elements as well as with other compounds.`,
- },
- {
- position: 9,
- name: 'Fluorine',
- weight: 18.9984,
- symbol: 'F',
- description: `Fluorine is a chemical element with symbol F and atomic number 9. It is the
- lightest halogen and exists as a highly toxic pale yellow diatomic gas at standard
- conditions.`,
- },
- {
- position: 10,
- name: 'Neon',
- weight: 20.1797,
- symbol: 'Ne',
- description: `Neon is a chemical element with symbol Ne and atomic number 10. It is a noble gas.
- Neon is a colorless, odorless, inert monatomic gas under standard conditions, with about
- two-thirds the density of air.`,
- },
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.css b/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.css
deleted file mode 100644
index 2d9da9228009..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.css
+++ /dev/null
@@ -1,9 +0,0 @@
-/* Structure */
-table {
- width: 100%;
-}
-
-.mat-form-field {
- font-size: 14px;
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.html b/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.html
deleted file mode 100644
index dba75eb82e81..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
- Filter
-
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
- No data matching the filter "{{input.value}}"
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.ts b/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.ts
deleted file mode 100644
index 1397aab93aa5..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-filtering/legacy-table-filtering-example.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table with filtering
- */
-@Component({
- selector: 'legacy-table-filtering-example',
- styleUrls: ['legacy-table-filtering-example.css'],
- templateUrl: 'legacy-table-filtering-example.html',
-})
-export class LegacyTableFilteringExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
-
- applyFilter(event: Event) {
- const filterValue = (event.target as HTMLInputElement).value;
- this.dataSource.filter = filterValue.trim().toLowerCase();
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.css b/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.html b/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.html
deleted file mode 100644
index 09bb2c212897..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.html
+++ /dev/null
@@ -1,28 +0,0 @@
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
\ No newline at end of file
diff --git a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.ts b/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.ts
deleted file mode 100644
index 139a6fdf053b..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-flex-basic/legacy-table-flex-basic-example.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Basic use of `` (uses display flex)
- */
-@Component({
- selector: 'legacy-table-flex-basic-example',
- styleUrls: ['legacy-table-flex-basic-example.css'],
- templateUrl: 'legacy-table-flex-basic-example.html',
-})
-export class LegacyTableFlexBasicExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.css b/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.css
deleted file mode 100644
index de64c6e53694..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.css
+++ /dev/null
@@ -1,7 +0,0 @@
-table {
- width: 100%;
-}
-
-tr.mat-footer-row {
- font-weight: bold;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.html b/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.html
deleted file mode 100644
index c5faed4ef69d..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.html
+++ /dev/null
@@ -1,19 +0,0 @@
-
-
-
- Item
- {{transaction.item}}
- Total
-
-
-
-
- Cost
- {{transaction.cost | currency}}
- {{getTotalCost() | currency}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.ts b/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.ts
deleted file mode 100644
index fc5a7d07266b..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-footer-row/legacy-table-footer-row-example.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-interface Transaction {
- item: string;
- cost: number;
-}
-
-/**
- * @title Footer row table
- */
-@Component({
- selector: 'legacy-table-footer-row-example',
- styleUrls: ['legacy-table-footer-row-example.css'],
- templateUrl: 'legacy-table-footer-row-example.html',
-})
-export class LegacyTableFooterRowExample {
- displayedColumns: string[] = ['item', 'cost'];
- transactions: Transaction[] = [
- {item: 'Beach ball', cost: 4},
- {item: 'Towel', cost: 5},
- {item: 'Frisbee', cost: 2},
- {item: 'Sunscreen', cost: 4},
- {item: 'Cooler', cost: 25},
- {item: 'Swim suit', cost: 15},
- ];
-
- /** Gets the total cost of all transactions. */
- getTotalCost() {
- return this.transactions.map(t => t.cost).reduce((acc, value) => acc + value, 0);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.css b/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.css
deleted file mode 100644
index 9ec1ae70cedc..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.demo-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.html b/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.html
deleted file mode 100644
index c1b5fa29128f..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.html
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
-
- {{column.header}}
-
-
- {{column.cell(row)}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.ts b/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.ts
deleted file mode 100644
index 1ff84e23a72b..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-generated-columns/legacy-table-generated-columns-example.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table with columns defined using ngFor instead of statically written in the template.
- */
-@Component({
- selector: 'legacy-table-generated-columns-example',
- styleUrls: ['legacy-table-generated-columns-example.css'],
- templateUrl: 'legacy-table-generated-columns-example.html',
-})
-export class LegacyTableGeneratedColumnsExample {
- columns = [
- {
- columnDef: 'position',
- header: 'No.',
- cell: (element: PeriodicElement) => `${element.position}`,
- },
- {
- columnDef: 'name',
- header: 'Name',
- cell: (element: PeriodicElement) => `${element.name}`,
- },
- {
- columnDef: 'weight',
- header: 'Weight',
- cell: (element: PeriodicElement) => `${element.weight}`,
- },
- {
- columnDef: 'symbol',
- header: 'Symbol',
- cell: (element: PeriodicElement) => `${element.symbol}`,
- },
- ];
- dataSource = ELEMENT_DATA;
- displayedColumns = this.columns.map(c => c.columnDef);
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.css b/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.css
deleted file mode 100644
index 1ecd1a098c1d..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.css
+++ /dev/null
@@ -1,43 +0,0 @@
-/* Structure */
-.example-container {
- position: relative;
-}
-
-.example-table-container {
- position: relative;
- min-height: 200px;
- max-height: 400px;
- overflow: auto;
-}
-
-table {
- width: 100%;
-}
-
-.example-loading-shade {
- position: absolute;
- top: 0;
- left: 0;
- bottom: 56px;
- right: 0;
- background: rgba(0, 0, 0, 0.15);
- z-index: 1;
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.example-rate-limit-reached {
- max-width: 360px;
- text-align: center;
-}
-
-/* Column Widths */
-.mat-column-number,
-.mat-column-state {
- max-width: 64px;
-}
-
-.mat-column-created {
- max-width: 124px;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.html b/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.html
deleted file mode 100644
index 355ae60b0ff2..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-http/legacy-table-http-example.html
+++ /dev/null
@@ -1,46 +0,0 @@
-
-
-
-
- GitHub's API rate limit has been reached. It will be reset in one minute.
-
-
-
-
-
-
-
-
- #
- {{row.number}}
-
-
-
-
- Title
- {{row.title}}
-
-
-
-
- State
- {{row.state}}
-
-
-
-
-
- Created
-
- {{row.created_at | date}}
-
-
-
-
-
-
-
{
- const href = 'https://api.github.com/search/issues';
- const requestUrl = `${href}?q=repo:angular/components&sort=${sort}&order=${order}&page=${
- page + 1
- }`;
-
- return this._httpClient.get(requestUrl);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.css b/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.css
deleted file mode 100644
index d5753bd38c61..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.css
+++ /dev/null
@@ -1,19 +0,0 @@
-table {
- width: 100%;
-}
-
-.example-first-header-row th {
- border-bottom: none;
-}
-
-.example-second-header-row {
- font-style: italic;
-}
-
-.example-first-footer-row {
- font-weight: bold;
-}
-
-.example-second-footer-row td {
- font-style: italic;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.html b/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.html
deleted file mode 100644
index 04b5b162bbb2..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.html
+++ /dev/null
@@ -1,45 +0,0 @@
-
-
-
- Item
- {{transaction.item}}
- Total
-
-
-
-
- Cost
- {{transaction.cost | currency}}
- {{getTotalCost() | currency}}
-
-
-
-
- Name of the item purchased
-
-
-
-
- Cost of the item in USD
-
-
-
-
-
- Please note that the cost of items displayed are completely and totally made up.
-
-
-
-
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.ts b/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.ts
deleted file mode 100644
index 26db7a3b1070..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-multiple-header-footer/legacy-table-multiple-header-footer-example.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-interface Transaction {
- item: string;
- cost: number;
-}
-
-/**
- * @title Table with multiple header and footer rows
- */
-@Component({
- selector: 'legacy-table-multiple-header-footer-example',
- styleUrls: ['legacy-table-multiple-header-footer-example.css'],
- templateUrl: 'legacy-table-multiple-header-footer-example.html',
-})
-export class LegacyTableMultipleHeaderFooterExample {
- displayedColumns: string[] = ['item', 'cost'];
- transactions: Transaction[] = [
- {item: 'Beach ball', cost: 4},
- {item: 'Towel', cost: 5},
- {item: 'Frisbee', cost: 2},
- {item: 'Sunscreen', cost: 4},
- {item: 'Cooler', cost: 25},
- {item: 'Swim suit', cost: 15},
- ];
-
- /** Gets the total cost of all transactions. */
- getTotalCost() {
- return this.transactions.map(t => t.cost).reduce((acc, value) => acc + value, 0);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.css b/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.css
deleted file mode 100644
index 369cbec26d5e..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.css
+++ /dev/null
@@ -1,12 +0,0 @@
-table {
- width: 100%;
-}
-
-.mat-form-field {
- font-size: 14px;
- width: 100%;
-}
-
-td, th {
- width: 25%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.html b/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.html
deleted file mode 100644
index 880c07608504..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-overview/legacy-table-overview-example.html
+++ /dev/null
@@ -1,43 +0,0 @@
-
- Filter
-
-
-
-
-
-
-
- ID
- {{row.id}}
-
-
-
-
- Progress
- {{row.progress}}%
-
-
-
-
- Name
- {{row.name}}
-
-
-
-
- Fruit
- {{row.fruit}}
-
-
-
- No data matching the filter "{{input.value}}"
-
-
-
-
-
;
-
- @ViewChild(MatLegacyPaginator) paginator: MatLegacyPaginator;
- @ViewChild(MatSort) sort: MatSort;
-
- constructor() {
- // Create 100 users
- const users = Array.from({length: 100}, (_, k) => createNewUser(k + 1));
-
- // Assign the data to the data source for the table to render
- this.dataSource = new MatLegacyTableDataSource(users);
- }
-
- ngAfterViewInit() {
- this.dataSource.paginator = this.paginator;
- this.dataSource.sort = this.sort;
- }
-
- applyFilter(event: Event) {
- const filterValue = (event.target as HTMLInputElement).value;
- this.dataSource.filter = filterValue.trim().toLowerCase();
-
- if (this.dataSource.paginator) {
- this.dataSource.paginator.firstPage();
- }
- }
-}
-
-/** Builds and returns a new User. */
-function createNewUser(id: number): UserData {
- const name =
- NAMES[Math.round(Math.random() * (NAMES.length - 1))] +
- ' ' +
- NAMES[Math.round(Math.random() * (NAMES.length - 1))].charAt(0) +
- '.';
-
- return {
- id: id.toString(),
- name: name,
- progress: Math.round(Math.random() * 100).toString(),
- fruit: FRUITS[Math.round(Math.random() * (FRUITS.length - 1))],
- };
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.css b/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.html b/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.html
deleted file mode 100644
index c7c5e005baa5..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-pagination/legacy-table-pagination-example.html
+++ /dev/null
@@ -1,36 +0,0 @@
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
-
-
-
(ELEMENT_DATA);
-
- @ViewChild(MatLegacyPaginator) paginator: MatLegacyPaginator;
-
- ngAfterViewInit() {
- this.dataSource.paginator = this.paginator;
- }
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
- {position: 11, name: 'Sodium', weight: 22.9897, symbol: 'Na'},
- {position: 12, name: 'Magnesium', weight: 24.305, symbol: 'Mg'},
- {position: 13, name: 'Aluminum', weight: 26.9815, symbol: 'Al'},
- {position: 14, name: 'Silicon', weight: 28.0855, symbol: 'Si'},
- {position: 15, name: 'Phosphorus', weight: 30.9738, symbol: 'P'},
- {position: 16, name: 'Sulfur', weight: 32.065, symbol: 'S'},
- {position: 17, name: 'Chlorine', weight: 35.453, symbol: 'Cl'},
- {position: 18, name: 'Argon', weight: 39.948, symbol: 'Ar'},
- {position: 19, name: 'Potassium', weight: 39.0983, symbol: 'K'},
- {position: 20, name: 'Calcium', weight: 40.078, symbol: 'Ca'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.css b/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.css
deleted file mode 100644
index cedd44731369..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.example-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.html b/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.html
deleted file mode 100644
index d35381653f3a..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.ts b/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.ts
deleted file mode 100644
index 8d96790e9943..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-recycle-rows/legacy-table-recycle-rows-example.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table that uses the recycle view repeater strategy.
- */
-@Component({
- selector: 'legacy-table-recycle-rows-example',
- styleUrls: ['legacy-table-recycle-rows-example.css'],
- templateUrl: 'legacy-table-recycle-rows-example.html',
-})
-export class LegacyTableRecycleRowsExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.css b/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.html b/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.html
deleted file mode 100644
index c60ec7dc4a50..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-
-
- No.
- {{element.position}}
-
-
-
- Name
- {{element.name}}
-
-
-
- Weight
- {{element.weight}}
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.ts b/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.ts
deleted file mode 100644
index 78a042349b93..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-reorderable/legacy-table-reorderable-example.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {CdkDragDrop, moveItemInArray} from '@angular/cdk/drag-drop';
-
-/**
- * @title Table with re-orderable columns
- */
-@Component({
- selector: 'legacy-table-reorderable-example',
- templateUrl: './legacy-table-reorderable-example.html',
- styleUrls: ['./legacy-table-reorderable-example.css'],
-})
-export class LegacyTableReorderableExample {
- columns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-
- drop(event: CdkDragDrop) {
- moveItemInArray(this.columns, event.previousIndex, event.currentIndex);
- }
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.css b/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.css
deleted file mode 100644
index 76a479d66d07..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.css
+++ /dev/null
@@ -1,17 +0,0 @@
-.demo-table {
- width: 100%;
-}
-
-.mat-row .mat-cell {
- border-bottom: 1px solid transparent;
- border-top: 1px solid transparent;
- cursor: pointer;
-}
-
-.mat-row:hover .mat-cell {
- border-color: currentColor;
-}
-
-.demo-row-is-clicked {
- font-weight: bold;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.html b/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.html
deleted file mode 100644
index d8ecfda58fd4..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.html
+++ /dev/null
@@ -1,49 +0,0 @@
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
-
-
- Click Log
-
-
-
-
- Clicked rows will be logged here
-
-
-
-
- Clicked on {{clickedRow.name}}
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.ts b/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.ts
deleted file mode 100644
index 4f005d8756e2..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-binding/legacy-table-row-binding-example.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Binding event handlers and properties to the table rows.
- */
-@Component({
- selector: 'legacy-table-row-binding-example',
- styleUrls: ['legacy-table-row-binding-example.css'],
- templateUrl: 'legacy-table-row-binding-example.html',
-})
-export class LegacyTableRowBindingExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
- clickedRows = new Set();
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.css b/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.html b/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.html
deleted file mode 100644
index 970f6fa5fb87..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.html
+++ /dev/null
@@ -1,46 +0,0 @@
-
-
-
- $implicit
- {{data}}
-
-
-
-
- index
- {{index}}
-
-
-
-
- count
- {{count}}
-
-
-
-
- first
- {{first}}
-
-
-
-
- last
- {{last}}
-
-
-
-
- even
- {{even}}
-
-
-
-
- odd
- {{odd}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.ts b/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.ts
deleted file mode 100644
index 06981a738c6f..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-row-context/legacy-table-row-context-example.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-/**
- * @title Table showing each row context properties.
- */
-@Component({
- selector: 'legacy-table-row-context-example',
- styleUrls: ['legacy-table-row-context-example.css'],
- templateUrl: 'legacy-table-row-context-example.html',
-})
-export class LegacyTableRowContextExample {
- displayedColumns: string[] = ['$implicit', 'index', 'count', 'first', 'last', 'even', 'odd'];
- data: string[] = ['one', 'two', 'three', 'four', 'five'];
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.css b/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.html b/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.html
deleted file mode 100644
index 1a7b2d3e3867..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.html
+++ /dev/null
@@ -1,49 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.ts b/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.ts
deleted file mode 100644
index 24d5592ea213..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-selection/legacy-table-selection-example.ts
+++ /dev/null
@@ -1,70 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {SelectionModel} from '@angular/cdk/collections';
-import {Component} from '@angular/core';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table with selection
- */
-@Component({
- selector: 'legacy-table-selection-example',
- styleUrls: ['legacy-table-selection-example.css'],
- templateUrl: 'legacy-table-selection-example.html',
-})
-export class LegacyTableSelectionExample {
- displayedColumns: string[] = ['select', 'position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
- selection = new SelectionModel(true, []);
-
- /** Whether the number of selected elements matches the total number of rows. */
- isAllSelected() {
- const numSelected = this.selection.selected.length;
- const numRows = this.dataSource.data.length;
- return numSelected === numRows;
- }
-
- /** Selects all rows if they are not all selected; otherwise clear selection. */
- toggleAllRows() {
- if (this.isAllSelected()) {
- this.selection.clear();
- return;
- }
-
- this.selection.select(...this.dataSource.data);
- }
-
- /** The label for the checkbox on the passed row */
- checkboxLabel(row?: PeriodicElement): string {
- if (!row) {
- return `${this.isAllSelected() ? 'deselect' : 'select'} all`;
- }
- return `${this.selection.isSelected(row) ? 'deselect' : 'select'} row ${row.position + 1}`;
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.css b/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.css
deleted file mode 100644
index 11b40820cb5b..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.css
+++ /dev/null
@@ -1,7 +0,0 @@
-table {
- width: 100%;
-}
-
-th.mat-sort-header-sorted {
- color: black;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.html b/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.html
deleted file mode 100644
index e11776461d7a..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.html
+++ /dev/null
@@ -1,38 +0,0 @@
-
-
-
-
-
- No.
-
- {{element.position}}
-
-
-
-
-
- Name
-
- {{element.name}}
-
-
-
-
-
- Weight
-
- {{element.weight}}
-
-
-
-
-
- Symbol
-
- {{element.symbol}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.ts
deleted file mode 100644
index 58e55652693c..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sorting/legacy-table-sorting-example.ts
+++ /dev/null
@@ -1,66 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {LiveAnnouncer} from '@angular/cdk/a11y';
-import {AfterViewInit, Component, ViewChild} from '@angular/core';
-import {MatSort, Sort} from '@angular/material/sort';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table with sorting
- */
-@Component({
- selector: 'legacy-table-sorting-example',
- styleUrls: ['legacy-table-sorting-example.css'],
- templateUrl: 'legacy-table-sorting-example.html',
-})
-export class LegacyTableSortingExample implements AfterViewInit {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
-
- constructor(private _liveAnnouncer: LiveAnnouncer) {}
-
- @ViewChild(MatSort) sort: MatSort;
-
- ngAfterViewInit() {
- this.dataSource.sort = this.sort;
- }
-
- /** Announce the change in sort state for assistive technology. */
- announceSortChange(sortState: Sort) {
- // This example uses English messages. If your application supports
- // multiple language, you would internationalize these strings.
- // Furthermore, you can customize the message to add additional
- // details about the values being sorted.
- if (sortState.direction) {
- this._liveAnnouncer.announce(`Sorted ${sortState.direction}ending`);
- } else {
- this._liveAnnouncer.announce('Sorting cleared');
- }
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.css b/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.css
deleted file mode 100644
index 52262aad13cf..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.css
+++ /dev/null
@@ -1,27 +0,0 @@
-.example-container {
- height: 400px;
- width: 550px;
- max-width: 100%;
- overflow: auto;
-}
-
-table {
- width: 800px;
-}
-
-td.mat-column-star {
- width: 20px;
- padding-right: 8px;
-}
-
-th.mat-column-position, td.mat-column-position {
- padding-left: 8px;
-}
-
-.mat-table-sticky-border-elem-right {
- border-left: 1px solid #e0e0e0;
-}
-
-.mat-table-sticky-border-elem-left {
- border-right: 1px solid #e0e0e0;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.html b/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.html
deleted file mode 100644
index 904579979451..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
-
-
- more_vert
-
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.ts
deleted file mode 100644
index a6c6f1b0a5ff..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-columns/legacy-table-sticky-columns-example.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-/**
- * @title Table with sticky columns
- */
-@Component({
- selector: 'legacy-table-sticky-columns-example',
- styleUrls: ['legacy-table-sticky-columns-example.css'],
- templateUrl: 'legacy-table-sticky-columns-example.html',
-})
-export class LegacyTableStickyColumnsExample {
- displayedColumns = [
- 'name',
- 'position',
- 'weight',
- 'symbol',
- 'position',
- 'weight',
- 'symbol',
- 'star',
- ];
- dataSource = ELEMENT_DATA;
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.css b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.css
deleted file mode 100644
index 32cefbf61d4a..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.css
+++ /dev/null
@@ -1,44 +0,0 @@
-.example-container {
- height: 400px;
- overflow: auto;
-}
-
-.mat-table-sticky {
- background: #59abfd;
- opacity: 1;
-}
-
-.example-sticky-toggle-group {
- margin: 8px;
-}
-
-.mat-column-filler {
- padding: 0 8px;
- font-size: 10px;
- text-align: center;
-}
-
-.mat-header-cell, .mat-footer-cell, .mat-cell {
- min-width: 80px;
- box-sizing: border-box;
-}
-
-.mat-header-row, .mat-footer-row, .mat-row {
- min-width: 1920px; /* 24 columns, 80px each */
-}
-
-.mat-table-sticky-border-elem-top {
- border-bottom: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-right {
- border-left: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-bottom {
- border-top: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-left {
- border-right: 2px solid midnightblue;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.html b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.html
deleted file mode 100644
index 2914a3087f20..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.html
+++ /dev/null
@@ -1,78 +0,0 @@
-
- Add table
- Remove table
-
-
-
- Sticky Headers:
-
- Row 1
- Row 2
-
-
-
-
- Sticky Footers:
-
- Row 1
- Row 2
-
-
-
-
- Sticky Columns:
-
- Position
- Name
- Weight
- Symbol
-
-
-
-
-
-
- Position
- {{element.position}}
- Position Footer
-
-
-
- Name
- {{element.name}}
- Name Footer
-
-
-
- Weight
- {{element.weight}}
- Weight Footer
-
-
-
- Symbol
- {{element.symbol}}
- Symbol Footer
-
-
-
- Filler header cell
- Filler data cell
- Filler footer cell
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.ts
deleted file mode 100644
index 5e617277a031..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex-flex/legacy-table-sticky-complex-flex-example.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatButtonToggleGroup} from '@angular/material/button-toggle';
-
-/**
- * @title Flex-layout tables with toggle-able sticky headers, footers, and columns
- */
-@Component({
- selector: 'legacy-table-sticky-complex-flex-example',
- styleUrls: ['legacy-table-sticky-complex-flex-example.css'],
- templateUrl: 'legacy-table-sticky-complex-flex-example.html',
-})
-export class LegacyTableStickyComplexFlexExample {
- displayedColumns: string[] = [];
- dataSource = ELEMENT_DATA;
-
- tables = [0];
-
- constructor() {
- this.displayedColumns.length = 24;
- this.displayedColumns.fill('filler');
-
- // The first two columns should be position and name; the last two columns: weight, symbol
- this.displayedColumns[0] = 'position';
- this.displayedColumns[1] = 'name';
- this.displayedColumns[22] = 'weight';
- this.displayedColumns[23] = 'symbol';
- }
-
- /** Whether the button toggle group contains the id as an active value. */
- isSticky(buttonToggleGroup: MatButtonToggleGroup, id: string) {
- return (buttonToggleGroup.value || []).indexOf(id) !== -1;
- }
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.css b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.css
deleted file mode 100644
index 155ce9ef09ec..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.css
+++ /dev/null
@@ -1,40 +0,0 @@
-.example-container {
- height: 400px;
- overflow: auto;
-}
-
-.mat-table-sticky {
- background: #59abfd;
- opacity: 1;
-}
-
-.example-sticky-toggle-group {
- margin: 8px;
-}
-
-.mat-column-filler {
- padding: 0 8px;
- font-size: 10px;
- text-align: center;
-}
-
-.mat-header-cell, .mat-footer-cell, .mat-cell {
- min-width: 80px;
- box-sizing: border-box;
-}
-
-.mat-table-sticky-border-elem-top {
- border-bottom: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-right {
- border-left: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-bottom {
- border-top: 2px solid midnightblue;
-}
-
-.mat-table-sticky-border-elem-left {
- border-right: 2px solid midnightblue;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.html b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.html
deleted file mode 100644
index 2f5c1e7260f6..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.html
+++ /dev/null
@@ -1,78 +0,0 @@
-
- Add table
- Remove table
-
-
-
- Sticky Headers:
-
- Row 1
- Row 2
-
-
-
-
- Sticky Footers:
-
- Row 1
- Row 2
-
-
-
-
- Sticky Columns:
-
- Position
- Name
- Weight
- Symbol
-
-
-
-
-
-
- Position
- {{element.position}}
- Position Footer
-
-
-
- Name
- {{element.name}}
- Name Footer
-
-
-
- Weight
- {{element.weight}}
- Weight Footer
-
-
-
- Symbol
- {{element.symbol}}
- Symbol Footer
-
-
-
- Filler header cell
- Filler data cell
- Filler footer cell
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.ts
deleted file mode 100644
index df95a27ee491..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-complex/legacy-table-sticky-complex-example.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatButtonToggleGroup} from '@angular/material/button-toggle';
-
-/**
- * @title Tables with toggle-able sticky headers, footers, and columns
- */
-@Component({
- selector: 'legacy-table-sticky-complex-example',
- styleUrls: ['legacy-table-sticky-complex-example.css'],
- templateUrl: 'legacy-table-sticky-complex-example.html',
-})
-export class LegacyTableStickyComplexExample {
- displayedColumns: string[] = [];
- dataSource = ELEMENT_DATA;
-
- tables = [0];
-
- constructor() {
- this.displayedColumns.length = 24;
- this.displayedColumns.fill('filler');
-
- // The first two columns should be position and name; the last two columns: weight, symbol
- this.displayedColumns[0] = 'position';
- this.displayedColumns[1] = 'name';
- this.displayedColumns[22] = 'weight';
- this.displayedColumns[23] = 'symbol';
- }
-
- /** Whether the button toggle group contains the id as an active value. */
- isSticky(buttonToggleGroup: MatButtonToggleGroup, id: string) {
- return (buttonToggleGroup.value || []).indexOf(id) !== -1;
- }
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.css b/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.css
deleted file mode 100644
index 6b5869e7c72b..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.css
+++ /dev/null
@@ -1,16 +0,0 @@
-.example-container {
- height: 270px;
- overflow: auto;
-}
-
-table {
- width: 100%;
-}
-
-tr.mat-footer-row {
- font-weight: bold;
-}
-
-.mat-table-sticky {
- border-top: 1px solid #e0e0e0;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.html b/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.html
deleted file mode 100644
index 48de652e8b71..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.html
+++ /dev/null
@@ -1,21 +0,0 @@
-
-
-
-
- Item
- {{transaction.item}}
- Total
-
-
-
-
- Cost
- {{transaction.cost | currency}}
- {{getTotalCost() | currency}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.ts
deleted file mode 100644
index 3a8cccbc5a2e..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-footer/legacy-table-sticky-footer-example.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface Transaction {
- item: string;
- cost: number;
-}
-
-/**
- * @title Table with a sticky footer
- */
-@Component({
- selector: 'legacy-table-sticky-footer-example',
- styleUrls: ['legacy-table-sticky-footer-example.css'],
- templateUrl: 'legacy-table-sticky-footer-example.html',
-})
-export class LegacyTableStickyFooterExample {
- displayedColumns = ['item', 'cost'];
- transactions: Transaction[] = [
- {item: 'Beach ball', cost: 4},
- {item: 'Towel', cost: 5},
- {item: 'Frisbee', cost: 2},
- {item: 'Sunscreen', cost: 4},
- {item: 'Cooler', cost: 25},
- {item: 'Swim suit', cost: 15},
- ];
-
- /** Gets the total cost of all transactions. */
- getTotalCost() {
- return this.transactions.map(t => t.cost).reduce((acc, value) => acc + value, 0);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.css b/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.css
deleted file mode 100644
index 4eca688d9b47..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.example-container {
- height: 400px;
- overflow: auto;
-}
-
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.html b/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.html
deleted file mode 100644
index 633706d39229..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.html
+++ /dev/null
@@ -1,31 +0,0 @@
-
-
-
-
-
- No.
- {{element.position}}
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.ts b/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.ts
deleted file mode 100644
index 22edc259d61a..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-sticky-header/legacy-table-sticky-header-example.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-/**
- * @title Table with sticky header
- */
-@Component({
- selector: 'legacy-table-sticky-header-example',
- styleUrls: ['legacy-table-sticky-header-example.css'],
- templateUrl: 'legacy-table-sticky-header-example.html',
-})
-export class LegacyTableStickyHeaderExample {
- displayedColumns = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-}
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.css b/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.html b/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.html
deleted file mode 100644
index a609db477db1..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.html
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.ts b/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.ts
deleted file mode 100644
index a20d58e2de0d..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column-advanced/legacy-table-text-column-advanced-example.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {DecimalPipe} from '@angular/common';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Use of 'mat-text-column' with various configurations of the interface.
- */
-@Component({
- selector: 'legacy-table-text-column-advanced-example',
- styleUrls: ['legacy-table-text-column-advanced-example.css'],
- templateUrl: 'legacy-table-text-column-advanced-example.html',
-})
-export class LegacyTableTextColumnAdvancedExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
-
- headerText: string;
-
- decimalPipe = new DecimalPipe('en-US');
-
- /** Data accessor function that transforms the weight value to have at most 2 decimal digits. */
- getWeight = (data: PeriodicElement): string => {
- const result = this.decimalPipe.transform(data.weight, '1.0-2');
- return result === null ? '' : result;
- };
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.css b/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.css
deleted file mode 100644
index 1922e7ffa3ad..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-table {
- width: 100%;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.html b/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.html
deleted file mode 100644
index 427692975ad0..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.html
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.ts b/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.ts
deleted file mode 100644
index 39c0d4bbbb16..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-text-column/legacy-table-text-column-example.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Use of `mat-text-column` which can be used for simple columns that only need to display
- * a text value for the header and cells.
- */
-@Component({
- selector: 'legacy-table-text-column-example',
- styleUrls: ['legacy-table-text-column-example.css'],
- templateUrl: 'legacy-table-text-column-example.html',
-})
-export class LegacyTableTextColumnExample {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.css b/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.css
deleted file mode 100644
index e69de29bb2d1..000000000000
diff --git a/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.html b/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.html
deleted file mode 100644
index 0a2704e8a7b2..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.html
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
- Name
- {{element.name}}
-
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.ts b/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.ts
deleted file mode 100644
index af43de06e5d3..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-with-ripples/legacy-table-with-ripples-example.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-const ELEMENT_DATA = [
- {name: 'Hydrogen'},
- {name: 'Helium'},
- {name: 'Lithium'},
- {name: 'Beryllium'},
- {name: 'Boron'},
- {name: 'Carbon'},
- {name: 'Nitrogen'},
- {name: 'Oxygen'},
- {name: 'Fluorine'},
- {name: 'Neon'},
-];
-
-/**
- * @title Tables with Material Design ripples.
- */
-@Component({
- selector: 'legacy-table-with-ripples-example',
- styleUrls: ['legacy-table-with-ripples-example.css'],
- templateUrl: 'legacy-table-with-ripples-example.html',
-})
-export class LegacyTableWithRipplesExample {
- displayedColumns: string[] = ['name'];
- dataSource = ELEMENT_DATA;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.css b/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.css
deleted file mode 100644
index 24c1e1546291..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.css
+++ /dev/null
@@ -1,7 +0,0 @@
-table {
- width: 100%;
-}
-
-button {
- margin: 0 8px 8px 0;
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.html b/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.html
deleted file mode 100644
index 540d3fcba236..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.html
+++ /dev/null
@@ -1,22 +0,0 @@
-
- Clear table
- Add data
-
-
-
-
-
- Name
- {{element.name}}
-
-
-
-
- No data
-
-
diff --git a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.ts b/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.ts
deleted file mode 100644
index 7c324c70aa4a..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-wrapped/legacy-table-wrapped-example.ts
+++ /dev/null
@@ -1,110 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {DataSource} from '@angular/cdk/collections';
-import {
- AfterContentInit,
- Component,
- ContentChildren,
- Input,
- AfterViewInit,
- QueryList,
- ViewChild,
- ContentChild,
-} from '@angular/core';
-import {MatSort} from '@angular/material/sort';
-import {
- MatLegacyColumnDef,
- MatLegacyHeaderRowDef,
- MatLegacyNoDataRow,
- MatLegacyRowDef,
- MatLegacyTable,
- MatLegacyTableDataSource,
-} from '@angular/material/legacy-table';
-
-export interface PeriodicElement {
- name: string;
- position: number;
- weight: number;
- symbol: string;
-}
-
-const ELEMENT_DATA: PeriodicElement[] = [
- {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
- {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
- {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
- {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
- {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'},
- {position: 6, name: 'Carbon', weight: 12.0107, symbol: 'C'},
- {position: 7, name: 'Nitrogen', weight: 14.0067, symbol: 'N'},
- {position: 8, name: 'Oxygen', weight: 15.9994, symbol: 'O'},
- {position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
- {position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
-];
-
-/**
- * @title Table example that shows how to wrap a table component for definition and behavior reuse.
- */
-@Component({
- selector: 'legacy-table-wrapped-example',
- styleUrls: ['legacy-table-wrapped-example.css'],
- templateUrl: 'legacy-table-wrapped-example.html',
-})
-export class LegacyTableWrappedExample implements AfterViewInit {
- displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
-
- @ViewChild('sort') sort: MatSort;
-
- ngAfterViewInit() {
- this.dataSource.sort = this.sort;
- }
-
- clearTable() {
- this.dataSource.data = [];
- }
-
- addData() {
- this.dataSource.data = ELEMENT_DATA;
- }
-}
-
-/**
- * Table component that accepts column and row definitions in its content to be registered to the
- * table.
- */
-@Component({
- selector: 'wrapper-table',
- templateUrl: 'wrapper-table.html',
- styles: [
- `
- table {
- width: 100%;
- }
- `,
- ],
-})
-export class WrapperTable implements AfterContentInit {
- @ContentChildren(MatLegacyHeaderRowDef) headerRowDefs: QueryList;
- @ContentChildren(MatLegacyRowDef) rowDefs: QueryList>;
- @ContentChildren(MatLegacyColumnDef) columnDefs: QueryList;
- @ContentChild(MatLegacyNoDataRow) noDataRow: MatLegacyNoDataRow;
-
- @ViewChild(MatLegacyTable, {static: true}) table: MatLegacyTable;
-
- @Input() columns: string[];
-
- @Input() dataSource: DataSource;
-
- ngAfterContentInit() {
- this.columnDefs.forEach(columnDef => this.table.addColumnDef(columnDef));
- this.rowDefs.forEach(rowDef => this.table.addRowDef(rowDef));
- this.headerRowDefs.forEach(headerRowDef => this.table.addHeaderRowDef(headerRowDef));
- this.table.setNoDataRow(this.noDataRow);
- }
-}
diff --git a/src/dev-app/legacy-table/examples/legacy-table-wrapped/wrapper-table.html b/src/dev-app/legacy-table/examples/legacy-table-wrapped/wrapper-table.html
deleted file mode 100644
index ad3946e88557..000000000000
--- a/src/dev-app/legacy-table/examples/legacy-table-wrapped/wrapper-table.html
+++ /dev/null
@@ -1,21 +0,0 @@
-
-
- No.
- {{element.position}}
-
-
-
-
- Weight
- {{element.weight}}
-
-
-
-
- Symbol
- {{element.symbol}}
-
-
diff --git a/src/dev-app/legacy-table/legacy-table-demo.html b/src/dev-app/legacy-table/legacy-table-demo.html
deleted file mode 100644
index 7d0d85d11d5f..000000000000
--- a/src/dev-app/legacy-table/legacy-table-demo.html
+++ /dev/null
@@ -1,80 +0,0 @@
-Cdk table basic
-Cdk table with recycled rows
-Cdk table basic with fixed column widths
-Cdk table basic flex
-Table basic
-Table basic with recycled rows
-Table basic flex
-Table dynamic columns
-Table expandable rows
-Table filtering
-Table footer row
-Table with http
-Table with multiple headers and footers
-Table overview
-Table row context
-Table with pagination
-Table with selection
-Table with sorting
-Table with sticky columns
-Table with sticky headers, footers and columns
-Table flex with sticky headers, footers and columns
-Table with sticky footer
-Table with sticky header
-Table with mat-text-column
-Table with mat-text-column advanced
-Table wrapped in reusable component
-Table wrapped re-orderable columns
-
-
Paginated tabs
-
- Content
-
-
-
Themed tabs
-
- Content 1
- Content 2
- Content 3
- Content 4
-
-
-
- Content 1
- Content 2
- Content 3
- Content 4
-
-
-
- Content 1
- Content 2
- Content 3
- Content 4
-
-
-
Non-Stretched tabs
-
- Content 1
- Content 2
- Content 3
-
-
-
Aligned tabs
-
- Content 1
- Content 2
- Content 3
-
-
-
- Content 1
- Content 2
- Content 3
-
-
-
- Content 1
- Content 2
- Content 3
-
-
-
Inverted tabs
-
- Content 1
- Content 2
- Content 3
-
-
-
Tabs with background color
-
-
- Primary
- Accent
- Warn
-
-
-
-
- Content
-
-
-
Template labels
-
-
-
- One
- First tab's content
-
-
- Two
- Second tab's content
-
-
- Three
- Third tab's content
-
-
-
-
Lazy tabs
-
-
- Eager
-
-
-
- Lazy
-
-
-
-
-
Tab nav bar
-
- {{link}}
- Disabled Link
-
-
-
- Tooltip position
-
-
- {{positionOption}}
-
-
-
-
-
-
- Action
-
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-auto-hide/legacy-tooltip-auto-hide-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-auto-hide/legacy-tooltip-auto-hide-example.ts
deleted file mode 100644
index 50b803aad840..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-auto-hide/legacy-tooltip-auto-hide-example.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-import {LegacyTooltipPosition} from '@angular/material/legacy-tooltip';
-
-/**
- * @title Tooltip that demonstrates auto-hiding when it clips out of its scrolling container.
- */
-@Component({
- selector: 'legacy-tooltip-auto-hide-example',
- templateUrl: 'legacy-tooltip-auto-hide-example.html',
- styleUrls: ['legacy-tooltip-auto-hide-example.css'],
-})
-export class LegacyTooltipAutoHideExample {
- positionOptions: LegacyTooltipPosition[] = ['below', 'above', 'left', 'right'];
- position = new FormControl(this.positionOptions[0]);
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.css
deleted file mode 100644
index 4e2b6d47d30e..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.example-button {
- margin-top: 16px;
-}
-
-.example-tooltip-uppercase {
- text-transform: uppercase;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.html
deleted file mode 100644
index a75e3ed07405..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.html
+++ /dev/null
@@ -1,7 +0,0 @@
-
- Uppercase-tooltip Action
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.ts
deleted file mode 100644
index f098a141150b..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-custom-class/legacy-tooltip-custom-class-example.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component, ViewEncapsulation} from '@angular/core';
-
-/**
- * @title Tooltip that can have a custom class applied.
- */
-@Component({
- selector: 'legacy-tooltip-custom-class-example',
- templateUrl: 'legacy-tooltip-custom-class-example.html',
- styleUrls: ['legacy-tooltip-custom-class-example.css'],
- // Need to remove view encapsulation so that the custom tooltip style defined in
- // `tooltip-custom-class-example.css` will not be scoped to this component's view.
- encapsulation: ViewEncapsulation.None,
-})
-export class LegacyTooltipCustomClassExample {}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.css
deleted file mode 100644
index 5a5b8845b187..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.mat-form-field + .mat-form-field,
-.mat-raised-button {
- margin-left: 8px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.html
deleted file mode 100644
index 73434f105365..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.html
+++ /dev/null
@@ -1,20 +0,0 @@
-
- Show delay
- milliseconds
-
-
-
- Hide delay
- milliseconds
-
-
-
- Action
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.ts
deleted file mode 100644
index c63992045702..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-delay/legacy-tooltip-delay-example.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-
-/**
- * @title Tooltip with a show and hide delay
- */
-@Component({
- selector: 'legacy-tooltip-delay-example',
- templateUrl: 'legacy-tooltip-delay-example.html',
- styleUrls: ['legacy-tooltip-delay-example.css'],
-})
-export class LegacyTooltipDelayExample {
- showDelay = new FormControl(1000);
- hideDelay = new FormControl(2000);
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.css
deleted file mode 100644
index c3abf0f1c0b3..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.example-disabled-checkbox {
- margin-left: 8px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.html
deleted file mode 100644
index c2b7a15a326a..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.html
+++ /dev/null
@@ -1,10 +0,0 @@
-
- Action
-
-
-
- Tooltip disabled
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.ts
deleted file mode 100644
index 7178afeca1a1..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-disabled/legacy-tooltip-disabled-example.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-
-/**
- * @title Tooltip that can be disabled
- */
-@Component({
- selector: 'legacy-tooltip-disabled-example',
- templateUrl: 'legacy-tooltip-disabled-example.html',
- styleUrls: ['legacy-tooltip-disabled-example.css'],
-})
-export class LegacyTooltipDisabledExample {
- disabled = new FormControl(false);
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.css
deleted file mode 100644
index 09f648019a32..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.example-action-button {
- margin-top: 16px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.html
deleted file mode 100644
index 4a0791a6a9fb..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.html
+++ /dev/null
@@ -1,28 +0,0 @@
-
- Click the following buttons to...
-
- show
-
-
- hide
-
-
- toggle show/hide
-
-
-
-
- Action
-
\ No newline at end of file
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.ts
deleted file mode 100644
index 0395e7fe514c..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-manual/legacy-tooltip-manual-example.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-/**
- * @title Tooltip that can be manually shown/hidden.
- */
-@Component({
- selector: 'legacy-tooltip-manual-example',
- templateUrl: 'legacy-tooltip-manual-example.html',
- styleUrls: ['legacy-tooltip-manual-example.css'],
-})
-export class LegacyTooltipManualExample {}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.css
deleted file mode 100644
index 87914e3a5c6a..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.example-user-input {
- margin-right: 8px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.html
deleted file mode 100644
index 6138cac9b40a..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.html
+++ /dev/null
@@ -1,10 +0,0 @@
-
- Tooltip message
-
-
-
- Action
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.ts
deleted file mode 100644
index 505a8d9ab074..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-message/legacy-tooltip-message-example.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-
-/**
- * @title Tooltip with a changing message
- */
-@Component({
- selector: 'legacy-tooltip-message-example',
- templateUrl: 'legacy-tooltip-message-example.html',
- styleUrls: ['legacy-tooltip-message-example.css'],
-})
-export class LegacyTooltipMessageExample {
- message = new FormControl('Info about the action');
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.html
deleted file mode 100644
index dd2f299e4ff8..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.html
+++ /dev/null
@@ -1,5 +0,0 @@
-
- Button with delay-default tooltip
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.ts
deleted file mode 100644
index 90bb8955aa7a..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-modified-defaults/legacy-tooltip-modified-defaults-example.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {
- MAT_LEGACY_TOOLTIP_DEFAULT_OPTIONS,
- MatLegacyTooltipDefaultOptions,
-} from '@angular/material/legacy-tooltip';
-
-/** Custom options the configure the tooltip's default show/hide delays. */
-export const myCustomTooltipDefaults: MatLegacyTooltipDefaultOptions = {
- showDelay: 1000,
- hideDelay: 1000,
- touchendHideDelay: 1000,
-};
-
-/**
- * @title Tooltip with a show and hide delay
- */
-@Component({
- selector: 'legacy-tooltip-modified-defaults-example',
- templateUrl: 'legacy-tooltip-modified-defaults-example.html',
- providers: [{provide: MAT_LEGACY_TOOLTIP_DEFAULT_OPTIONS, useValue: myCustomTooltipDefaults}],
-})
-export class LegacyTooltipModifiedDefaultsExample {}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.html
deleted file mode 100644
index 29978afbe869..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.html
+++ /dev/null
@@ -1,5 +0,0 @@
-
- Action
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.ts
deleted file mode 100644
index 6c201be6a995..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-overview/legacy-tooltip-overview-example.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-
-/**
- * @title Basic tooltip
- */
-@Component({
- selector: 'legacy-tooltip-overview-example',
- templateUrl: 'legacy-tooltip-overview-example.html',
-})
-export class LegacyTooltipOverviewExample {}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.css
deleted file mode 100644
index 82d14164d994..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-button {
- width: 500px;
- height: 500px;
-}
-
-.example-enabled-checkbox {
- margin-left: 8px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.html
deleted file mode 100644
index e1aee7f8f4b7..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.html
+++ /dev/null
@@ -1,10 +0,0 @@
-
- Action
-
-
-
- Position at origin enabled
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.ts
deleted file mode 100644
index 062103ce8ae4..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position-at-origin/legacy-tooltip-position-at-origin-example.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-
-/**
- * @title Basic tooltip
- */
-@Component({
- selector: 'legacy-tooltip-position-at-origin-example',
- templateUrl: 'legacy-tooltip-position-at-origin-example.html',
- styleUrls: ['legacy-tooltip-position-at-origin-example.css'],
-})
-export class LegacyTooltipPositionAtOriginExample {
- enabled = new FormControl(false);
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.css b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.css
deleted file mode 100644
index 87914e3a5c6a..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.example-user-input {
- margin-right: 8px;
-}
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.html b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.html
deleted file mode 100644
index bafe9614ccb3..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.html
+++ /dev/null
@@ -1,15 +0,0 @@
-
- Tooltip position
-
-
- {{positionOption}}
-
-
-
-
-
- Action
-
diff --git a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.ts b/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.ts
deleted file mode 100644
index 81b38cd56071..000000000000
--- a/src/dev-app/legacy-tooltip/examples/legacy-tooltip-position/legacy-tooltip-position-example.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {FormControl} from '@angular/forms';
-import {LegacyTooltipPosition} from '@angular/material/legacy-tooltip';
-
-/**
- * @title Tooltip with a custom position
- */
-@Component({
- selector: 'legacy-tooltip-position-example',
- templateUrl: 'legacy-tooltip-position-example.html',
- styleUrls: ['legacy-tooltip-position-example.css'],
-})
-export class LegacyTooltipPositionExample {
- positionOptions: LegacyTooltipPosition[] = ['after', 'before', 'above', 'below', 'left', 'right'];
- position = new FormControl(this.positionOptions[0]);
-}
diff --git a/src/dev-app/legacy-tooltip/legacy-tooltip-demo.html b/src/dev-app/legacy-tooltip/legacy-tooltip-demo.html
deleted file mode 100644
index ece951f9d580..000000000000
--- a/src/dev-app/legacy-tooltip/legacy-tooltip-demo.html
+++ /dev/null
@@ -1,29 +0,0 @@
-Tooltip auto hide
-Tooltip custom class
-Tooltip with delay
-Tooltip disabled
-Tooltip manual
-Tooltip message
-Tooltip modified defaults
-Tooltip overview
-Tooltip positioning
-Tooltip with position at origin
-Is Legacy
-
-
-
How vexingly quick daft zebras jump!
-
The wizard quickly jinxed the gnomes before they vaporized.
-
The quick brown fox jumps over the lazy dog.
-
Grumpy wizards make toxic brew for the evil queen and jack.
+
+
How vexingly quick daft zebras jump!
+ The wizard quickly jinxed the gnomes before they vaporized.
+ The quick brown fox jumps over the lazy dog.
+ Grumpy wizards make toxic brew for the evil queen and jack.
Jackdaws love my big sphinx of quartz.
The five boxing wizards jump quickly.
Pack my box with five dozen liquor jugs.
diff --git a/src/dev-app/typography/typography-demo.ts b/src/dev-app/typography/typography-demo.ts
index ca62554a68d7..42fee4a233fe 100644
--- a/src/dev-app/typography/typography-demo.ts
+++ b/src/dev-app/typography/typography-demo.ts
@@ -17,6 +17,4 @@ import {FormsModule} from '@angular/forms';
imports: [MatCheckboxModule, FormsModule],
standalone: true,
})
-export class TypographyDemo {
- isLegacy = false;
-}
+export class TypographyDemo {}
diff --git a/src/material-experimental/column-resize/BUILD.bazel b/src/material-experimental/column-resize/BUILD.bazel
index b30b09cd6b97..9ba3b4bed00d 100644
--- a/src/material-experimental/column-resize/BUILD.bazel
+++ b/src/material-experimental/column-resize/BUILD.bazel
@@ -12,7 +12,7 @@ ng_module(
"//src/cdk-experimental/column-resize",
"//src/cdk/overlay",
"//src/cdk/table",
- "//src/material/legacy-table",
+ "//src/material/table",
"@npm//@angular/core",
],
)
@@ -36,7 +36,7 @@ ng_test_library(
"//src/cdk/keycodes",
"//src/cdk/overlay",
"//src/cdk/testing/private",
- "//src/material/legacy-table",
+ "//src/material/table",
"@npm//rxjs",
],
)
diff --git a/src/material-experimental/column-resize/column-resize.spec.ts b/src/material-experimental/column-resize/column-resize.spec.ts
index 07a7cbdddc2b..45f6dbe16413 100644
--- a/src/material-experimental/column-resize/column-resize.spec.ts
+++ b/src/material-experimental/column-resize/column-resize.spec.ts
@@ -4,7 +4,7 @@ import {BidiModule} from '@angular/cdk/bidi';
import {DataSource} from '@angular/cdk/collections';
import {dispatchKeyboardEvent} from '../../cdk/testing/private';
import {ESCAPE} from '@angular/cdk/keycodes';
-import {MatLegacyTableModule} from '@angular/material/legacy-table';
+import {MatTableModule} from '@angular/material/table';
import {BehaviorSubject} from 'rxjs';
import {ColumnSize} from '@angular/cdk-experimental/column-resize';
@@ -41,10 +41,10 @@ function getTableTemplate(defaultEnabled: boolean) {
return `
- 
- Mal
- 
-
- 
- Shiba Inu
-