diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index 84bd387d3d0b..b843f43451f8 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -93,6 +93,7 @@ # Note to implementer: please repossess /src/material-experimental/mdc-radio/** @mmalerba /src/material-experimental/mdc-slide-toggle/** @crisbeto +/src/material-experimental/mdc-tabs/** @crisbeto /src/material-experimental/popover-edit/** @kseamon @andrewseguin # CDK experimental package @@ -146,6 +147,7 @@ # Note to implementer: please repossess /src/dev-app/mdc-radio/** @mmalerba /src/dev-app/mdc-slide-toggle/** @crisbeto +/src/dev-app/mdc-tabs/** @crisbeto /src/dev-app/menu/** @crisbeto /src/dev-app/overlay/** @jelbourn @crisbeto /src/dev-app/paginator/** @andrewseguin @@ -196,6 +198,7 @@ # Note to implementer: please repossess /src/e2e-app/mdc-radio/** @mmalerba /src/e2e-app/mdc-slide-toggle/** @crisbeto +/src/e2e-app/mdc-tabs/** @crisbeto /src/e2e-app/menu/** @crisbeto /src/e2e-app/progress-bar/** @jelbourn @crisbeto @josephperrott /src/e2e-app/progress-spinner/** @jelbourn @crisbeto @josephperrott diff --git a/packages.bzl b/packages.bzl index ab44cad67e87..403fc04ebf77 100644 --- a/packages.bzl +++ b/packages.bzl @@ -85,6 +85,7 @@ MATERIAL_EXPERIMENTAL_PACKAGES = [ "mdc-card", "mdc-checkbox", "mdc-chips", + "mdc-tabs", "mdc-helpers", "mdc-menu", "mdc-radio", diff --git a/src/dev-app/BUILD.bazel b/src/dev-app/BUILD.bazel index 9bed24c900a2..6e10a221a7be 100644 --- a/src/dev-app/BUILD.bazel +++ b/src/dev-app/BUILD.bazel @@ -48,6 +48,7 @@ ng_module( "//src/material-experimental/mdc-menu", "//src/material-experimental/mdc-radio", "//src/material-experimental/mdc-slide-toggle", + "//src/material-experimental/mdc-tabs", "//src/material-examples:examples", ] + CDK_TARGETS + CDK_EXPERIMENTAL_TARGETS + MATERIAL_TARGETS + MATERIAL_EXPERIMENTAL_TARGETS, ) diff --git a/src/dev-app/dev-app/dev-app-layout.ts b/src/dev-app/dev-app/dev-app-layout.ts index 0955469b2711..8e8c76864cdf 100644 --- a/src/dev-app/dev-app/dev-app-layout.ts +++ b/src/dev-app/dev-app/dev-app-layout.ts @@ -75,6 +75,7 @@ export class DevAppLayout { {name: 'MDC Chips', route: '/mdc-chips'}, {name: 'MDC Menu', route: '/mdc-menu'}, {name: 'MDC Radio', route: '/mdc-radio'}, + {name: 'MDC Tabs', route: '/mdc-tabs'}, {name: 'MDC Slide Toggle', route: '/mdc-slide-toggle'}, ]; diff --git a/src/dev-app/dev-app/routes.ts b/src/dev-app/dev-app/routes.ts index d3438c20a31f..30647e711954 100644 --- a/src/dev-app/dev-app/routes.ts +++ b/src/dev-app/dev-app/routes.ts @@ -61,6 +61,7 @@ export const DEV_APP_ROUTES: Routes = [ path: 'mdc-slide-toggle', loadChildren: 'mdc-slide-toggle/mdc-slide-toggle-demo-module#MdcSlideToggleDemoModule' }, + {path: 'mdc-tabs', loadChildren: 'mdc-tabs/mdc-tabs-demo-module#MdcTabsDemoModule'}, {path: 'menu', loadChildren: 'menu/menu-demo-module#MenuDemoModule'}, {path: 'paginator', loadChildren: 'paginator/paginator-demo-module#PaginatorDemoModule'}, {path: 'platform', loadChildren: 'platform/platform-demo-module#PlatformDemoModule'}, diff --git a/src/dev-app/mdc-tabs/mdc-tabs-demo-module.ts b/src/dev-app/mdc-tabs/mdc-tabs-demo-module.ts new file mode 100644 index 000000000000..1924e402fefa --- /dev/null +++ b/src/dev-app/mdc-tabs/mdc-tabs-demo-module.ts @@ -0,0 +1,22 @@ +/** + * @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 {NgModule} from '@angular/core'; +import {MatTabsModule} from '@angular/material-experimental/mdc-tabs'; +import {RouterModule} from '@angular/router'; +import {MdcTabsDemo} from './mdc-tabs-demo'; + +@NgModule({ + imports: [ + MatTabsModule, + RouterModule.forChild([{path: '', component: MdcTabsDemo}]), + ], + declarations: [MdcTabsDemo], +}) +export class MdcTabsDemoModule { +} diff --git a/src/dev-app/mdc-tabs/mdc-tabs-demo.html b/src/dev-app/mdc-tabs/mdc-tabs-demo.html new file mode 100644 index 000000000000..b390f3f2299a --- /dev/null +++ b/src/dev-app/mdc-tabs/mdc-tabs-demo.html @@ -0,0 +1,2 @@ + +Not yet implemented. diff --git a/src/dev-app/mdc-tabs/mdc-tabs-demo.scss b/src/dev-app/mdc-tabs/mdc-tabs-demo.scss new file mode 100644 index 000000000000..2ac26e2a6f10 --- /dev/null +++ b/src/dev-app/mdc-tabs/mdc-tabs-demo.scss @@ -0,0 +1 @@ +// TODO: copy in demo styles from existing tabs demo. diff --git a/src/dev-app/mdc-tabs/mdc-tabs-demo.ts b/src/dev-app/mdc-tabs/mdc-tabs-demo.ts new file mode 100644 index 000000000000..9c5ea229aa62 --- /dev/null +++ b/src/dev-app/mdc-tabs/mdc-tabs-demo.ts @@ -0,0 +1,18 @@ +/** + * @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'; + +@Component({ + moduleId: module.id, + selector: 'mdc-tabs-demo', + templateUrl: 'mdc-tabs-demo.html', + styleUrls: ['mdc-tabs-demo.css'], +}) +export class MdcTabsDemo { +} diff --git a/src/dev-app/system-config.ts b/src/dev-app/system-config.ts index c8c9243d2967..dc4733844b21 100644 --- a/src/dev-app/system-config.ts +++ b/src/dev-app/system-config.ts @@ -148,6 +148,8 @@ System.config({ 'dist/packages/material-experimental/mdc-radio/index.js', '@angular/material-experimental/mdc-slide-toggle': 'dist/packages/material-experimental/mdc-slide-toggle/index.js', + '@angular/material-experimental/mdc-tabs': + 'dist/packages/material-experimental/mdc-tabs/index.js', '@angular/material-experimental/mdc-helpers': 'dist/packages/material-experimental/mdc-helpers/index.js', '@angular/material-experimental/popover-edit': diff --git a/src/dev-app/theme.scss b/src/dev-app/theme.scss index 16474a761269..caea3ce31050 100644 --- a/src/dev-app/theme.scss +++ b/src/dev-app/theme.scss @@ -7,6 +7,7 @@ @import '../material-experimental/mdc-menu/mdc-menu'; @import '../material-experimental/mdc-radio/mdc-radio'; @import '../material-experimental/mdc-slide-toggle/mdc-slide-toggle'; +@import '../material-experimental/mdc-tabs/mdc-tabs'; @import '../material-experimental/popover-edit/popover-edit'; // Plus imports for other components in your app. @@ -24,6 +25,7 @@ @include mat-menu-typography-mdc(mat-typography-config()); @include mat-radio-typography-mdc(mat-typography-config()); @include mat-slide-toggle-typography-mdc(mat-typography-config()); +@include mat-tabs-typography-mdc(mat-typography-config()); // Define the default theme (same as the example above). $candy-app-primary: mat-palette($mat-indigo); @@ -41,6 +43,7 @@ $candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent); @include mat-menu-theme-mdc($candy-app-theme); @include mat-radio-theme-mdc($candy-app-theme); @include mat-slide-toggle-theme-mdc($candy-app-theme); +@include mat-tabs-theme-mdc($candy-app-theme); @include mat-edit-theme($candy-app-theme); @include mat-edit-typography(mat-typography-config()); // Define an alternate dark theme. @@ -64,5 +67,6 @@ $dark-theme: mat-dark-theme($dark-primary, $dark-accent, $dark-warn); @include mat-menu-theme-mdc($dark-theme); @include mat-radio-theme-mdc($dark-theme); @include mat-slide-toggle-theme-mdc($dark-theme); + @include mat-tabs-theme-mdc($dark-theme); @include mat-edit-theme($dark-theme); } diff --git a/src/e2e-app/BUILD.bazel b/src/e2e-app/BUILD.bazel index 606b0aa0dcc5..53df62c1fc18 100644 --- a/src/e2e-app/BUILD.bazel +++ b/src/e2e-app/BUILD.bazel @@ -38,6 +38,7 @@ ng_module( "//src/material-experimental/mdc-menu", "//src/material-experimental/mdc-radio", "//src/material-experimental/mdc-slide-toggle", + "//src/material-experimental/mdc-tabs", "//src/material/button", "//src/material/checkbox", "//src/material/core", @@ -78,6 +79,7 @@ sass_binary( "//src/material-experimental/mdc-menu:mdc_menu_scss_lib", "//src/material-experimental/mdc-radio:mdc_radio_scss_lib", "//src/material-experimental/mdc-slide-toggle:mdc_slide_toggle_scss_lib", + "//src/material-experimental/mdc-tabs:mdc_tabs_scss_lib", "//src/material/core:all_themes", ], ) diff --git a/src/e2e-app/e2e-app/e2e-app-layout.html b/src/e2e-app/e2e-app/e2e-app-layout.html index 0ce5d0dc8956..5ba70098ba65 100644 --- a/src/e2e-app/e2e-app/e2e-app-layout.html +++ b/src/e2e-app/e2e-app/e2e-app-layout.html @@ -30,6 +30,7 @@ MDC Menu MDC Radio MDC Slide Toggle + MDC Tabs
diff --git a/src/e2e-app/e2e-app/routes.ts b/src/e2e-app/e2e-app/routes.ts index fe1f7b9520e1..90933cebdd3a 100644 --- a/src/e2e-app/e2e-app/routes.ts +++ b/src/e2e-app/e2e-app/routes.ts @@ -18,6 +18,7 @@ import {MdcChipsE2e} from '../mdc-chips/mdc-chips-e2e'; import {MdcMenuE2e} from '../mdc-menu/mdc-menu-e2e'; import {MdcRadioE2e} from '../mdc-radio/mdc-radio-e2e'; import {MdcSlideToggleE2e} from '../mdc-slide-toggle/mdc-slide-toggle-e2e'; +import {MdcTabsE2e} from '../mdc-tabs/mdc-tabs-e2e'; import {MenuE2E} from '../menu/menu-e2e'; import {ProgressBarE2E} from '../progress-bar/progress-bar-e2e'; import {ProgressSpinnerE2E} from '../progress-spinner/progress-spinner-e2e'; @@ -51,6 +52,7 @@ export const E2E_APP_ROUTES: Routes = [ {path: 'mdc-menu', component: MdcMenuE2e}, {path: 'mdc-radio', component: MdcRadioE2e}, {path: 'mdc-slide-toggle', component: MdcSlideToggleE2e}, + {path: 'mdc-tabs', component: MdcTabsE2e}, {path: 'menu', component: MenuE2E}, {path: 'progress-bar', component: ProgressBarE2E}, {path: 'progress-spinner', component: ProgressSpinnerE2E}, diff --git a/src/e2e-app/main-module.ts b/src/e2e-app/main-module.ts index 6a35c2866688..41fa0703b774 100644 --- a/src/e2e-app/main-module.ts +++ b/src/e2e-app/main-module.ts @@ -26,6 +26,7 @@ import {MdcChipsE2eModule} from './mdc-chips/mdc-chips-e2e-module'; import {MdcMenuE2eModule} from './mdc-menu/mdc-menu-e2e-module'; import {MdcRadioE2eModule} from './mdc-radio/mdc-radio-e2e-module'; import {MdcSlideToggleE2eModule} from './mdc-slide-toggle/mdc-slide-toggle-e2e-module'; +import {MdcTabsE2eModule} from './mdc-tabs/mdc-tabs-e2e-module'; import {MenuE2eModule} from './menu/menu-e2e-module'; import {ProgressBarE2eModule} from './progress-bar/progress-bar-e2e-module'; import {ProgressSpinnerE2eModule} from './progress-spinner/progress-spinner-e2e-module'; @@ -64,6 +65,7 @@ import {VirtualScrollE2eModule} from './virtual-scroll/virtual-scroll-e2e-module MdcMenuE2eModule, MdcRadioE2eModule, MdcSlideToggleE2eModule, + MdcTabsE2eModule, MenuE2eModule, ProgressBarE2eModule, ProgressSpinnerE2eModule, diff --git a/src/e2e-app/mdc-tabs/mdc-tabs-e2e-module.ts b/src/e2e-app/mdc-tabs/mdc-tabs-e2e-module.ts new file mode 100644 index 000000000000..b57ea1cbd09d --- /dev/null +++ b/src/e2e-app/mdc-tabs/mdc-tabs-e2e-module.ts @@ -0,0 +1,18 @@ +/** + * @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 {NgModule} from '@angular/core'; +import {MatTabsModule} from '@angular/material-experimental/mdc-tabs'; +import {MdcTabsE2e} from './mdc-tabs-e2e'; + +@NgModule({ + imports: [MatTabsModule], + declarations: [MdcTabsE2e], +}) +export class MdcTabsE2eModule { +} diff --git a/src/e2e-app/mdc-tabs/mdc-tabs-e2e.html b/src/e2e-app/mdc-tabs/mdc-tabs-e2e.html new file mode 100644 index 000000000000..6970fa69413d --- /dev/null +++ b/src/e2e-app/mdc-tabs/mdc-tabs-e2e.html @@ -0,0 +1 @@ + diff --git a/src/e2e-app/mdc-tabs/mdc-tabs-e2e.ts b/src/e2e-app/mdc-tabs/mdc-tabs-e2e.ts new file mode 100644 index 000000000000..30123d2c0c4c --- /dev/null +++ b/src/e2e-app/mdc-tabs/mdc-tabs-e2e.ts @@ -0,0 +1,18 @@ +/** + * @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'; + +@Component({ + moduleId: module.id, + selector: 'mdc-tabs-e2e', + templateUrl: 'mdc-tabs-e2e.html', +}) +export class MdcTabsE2e { + // TODO: copy implementation from existing tabs e2e page. +} diff --git a/src/e2e-app/theme.scss b/src/e2e-app/theme.scss index 9ce08a53bd8a..26082502276e 100644 --- a/src/e2e-app/theme.scss +++ b/src/e2e-app/theme.scss @@ -7,6 +7,7 @@ @import '../material-experimental/mdc-menu/mdc-menu'; @import '../material-experimental/mdc-radio/mdc-radio'; @import '../material-experimental/mdc-slide-toggle/mdc-slide-toggle'; +@import '../material-experimental/mdc-tabs/mdc-tabs'; // Plus imports for other components in your app. @@ -23,6 +24,7 @@ @include mat-menu-typography-mdc(mat-typography-config()); @include mat-radio-typography-mdc(mat-typography-config()); @include mat-slide-toggle-typography-mdc(mat-typography-config()); +@include mat-tabs-typography-mdc(mat-typography-config()); // Define the default theme (same as the example above). $candy-app-primary: mat-palette($mat-indigo); @@ -40,3 +42,4 @@ $candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent); @include mat-menu-theme-mdc($candy-app-theme); @include mat-radio-theme-mdc($candy-app-theme); @include mat-slide-toggle-theme-mdc($candy-app-theme); +@include mat-tabs-theme-mdc($candy-app-theme); diff --git a/src/material-experimental/mdc-tabs/BUILD.bazel b/src/material-experimental/mdc-tabs/BUILD.bazel new file mode 100644 index 000000000000..071271e738ce --- /dev/null +++ b/src/material-experimental/mdc-tabs/BUILD.bazel @@ -0,0 +1,67 @@ +package(default_visibility = ["//visibility:public"]) + +load("@io_bazel_rules_sass//:defs.bzl", "sass_binary", "sass_library") +load("@npm_angular_bazel//:index.bzl", "protractor_web_test_suite") +load("//tools:defaults.bzl", "ng_e2e_test_library", "ng_module") + +ng_module( + name = "mdc-tabs", + srcs = glob( + ["**/*.ts"], + exclude = ["**/*.spec.ts"], + ), + assets = [":tabs_scss"] + glob(["**/*.html"]), + module_name = "@angular/material-experimental/mdc-tabs", + deps = [ + "//src/material/core", + "@npm//@angular/common", + "@npm//@angular/core", + "@npm//material-components-web", + ], +) + +sass_library( + name = "mdc_tabs_scss_lib", + srcs = glob(["**/_*.scss"]), + deps = [ + "//src/material-experimental/mdc-helpers:mdc_helpers_scss_lib", + "//src/material-experimental/mdc-helpers:mdc_scss_deps_lib", + "//src/material/core:core_scss_lib", + ], +) + +sass_binary( + name = "tabs_scss", + src = "tabs.scss", + include_paths = [ + "external/npm/node_modules", + ], + deps = [ + "//src/material-experimental/mdc-helpers:mdc_scss_deps_lib", + "//src/material/core:all_themes", + ], +) + +ng_e2e_test_library( + name = "e2e_test_sources", + srcs = glob(["**/*.e2e.spec.ts"]), + deps = [ + "//src/cdk/testing/e2e", + ], +) + +protractor_web_test_suite( + name = "e2e_tests", + configuration = "//src/e2e-app:protractor.conf.js", + data = [ + "//tools/axe-protractor", + "@npm//@angular/bazel", + ], + on_prepare = "//src/e2e-app:start-devserver.js", + server = "//src/e2e-app:devserver", + tags = ["e2e"], + deps = [ + ":e2e_test_sources", + "//src/cdk/testing/e2e", + ], +) diff --git a/src/material-experimental/mdc-tabs/README.md b/src/material-experimental/mdc-tabs/README.md new file mode 100644 index 000000000000..ef59f40277b2 --- /dev/null +++ b/src/material-experimental/mdc-tabs/README.md @@ -0,0 +1 @@ +This is a placeholder for the MDC-based implementation of tabs. diff --git a/src/material-experimental/mdc-tabs/_mdc-tabs.scss b/src/material-experimental/mdc-tabs/_mdc-tabs.scss new file mode 100644 index 000000000000..1b909d2609c7 --- /dev/null +++ b/src/material-experimental/mdc-tabs/_mdc-tabs.scss @@ -0,0 +1,13 @@ +@import '../mdc-helpers/mdc-helpers'; + +@mixin mat-tabs-theme-mdc($theme) { + @include mat-using-mdc-theme($theme) { + // TODO: MDC theme styles here. + } +} + +@mixin mat-tabs-typography-mdc($config) { + @include mat-using-mdc-typography($config) { + // TODO: MDC typography styles here. + } +} diff --git a/src/material-experimental/mdc-tabs/index.ts b/src/material-experimental/mdc-tabs/index.ts new file mode 100644 index 000000000000..676ca90f1ffa --- /dev/null +++ b/src/material-experimental/mdc-tabs/index.ts @@ -0,0 +1,9 @@ +/** + * @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 + */ + +export * from './public-api'; diff --git a/src/material-experimental/mdc-tabs/module.ts b/src/material-experimental/mdc-tabs/module.ts new file mode 100644 index 000000000000..badb8e7d5273 --- /dev/null +++ b/src/material-experimental/mdc-tabs/module.ts @@ -0,0 +1,18 @@ +/** + * @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 {MatCommonModule} from '@angular/material/core'; + +@NgModule({ + imports: [MatCommonModule, CommonModule], + exports: [MatCommonModule], +}) +export class MatTabsModule { +} diff --git a/src/material-experimental/mdc-tabs/public-api.ts b/src/material-experimental/mdc-tabs/public-api.ts new file mode 100644 index 000000000000..508adc834fb3 --- /dev/null +++ b/src/material-experimental/mdc-tabs/public-api.ts @@ -0,0 +1,9 @@ +/** + * @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 + */ + +export * from './module'; diff --git a/src/material-experimental/mdc-tabs/tabs.e2e.spec.ts b/src/material-experimental/mdc-tabs/tabs.e2e.spec.ts new file mode 100644 index 000000000000..f98bacfad40b --- /dev/null +++ b/src/material-experimental/mdc-tabs/tabs.e2e.spec.ts @@ -0,0 +1 @@ +// TODO: copy tests from existing tabs, update as necessary to fix. diff --git a/src/material-experimental/mdc-tabs/tabs.scss b/src/material-experimental/mdc-tabs/tabs.scss new file mode 100644 index 000000000000..e69de29bb2d1 diff --git a/src/material-experimental/mdc-tabs/tabs.spec.ts b/src/material-experimental/mdc-tabs/tabs.spec.ts new file mode 100644 index 000000000000..f98bacfad40b --- /dev/null +++ b/src/material-experimental/mdc-tabs/tabs.spec.ts @@ -0,0 +1 @@ +// TODO: copy tests from existing tabs, update as necessary to fix. diff --git a/src/material-experimental/mdc-tabs/tsconfig-build.json b/src/material-experimental/mdc-tabs/tsconfig-build.json new file mode 100644 index 000000000000..448042032217 --- /dev/null +++ b/src/material-experimental/mdc-tabs/tsconfig-build.json @@ -0,0 +1,15 @@ +{ + "extends": "../tsconfig-build", + "files": [ + "public-api.ts", + "../typings.d.ts" + ], + "angularCompilerOptions": { + "annotateForClosureCompiler": true, + "strictMetadataEmit": true, + "flatModuleOutFile": "index.js", + "flatModuleId": "@angular/material-experimental/mdc-tabs", + "skipTemplateCodegen": true, + "fullTemplateTypeCheck": true + } +} diff --git a/src/universal-app/kitchen-sink-mdc/kitchen-sink-mdc.ts b/src/universal-app/kitchen-sink-mdc/kitchen-sink-mdc.ts index 64a1317cd8d9..b0f787f48b59 100644 --- a/src/universal-app/kitchen-sink-mdc/kitchen-sink-mdc.ts +++ b/src/universal-app/kitchen-sink-mdc/kitchen-sink-mdc.ts @@ -6,6 +6,7 @@ import {MatChipsModule} from '@angular/material-experimental/mdc-chips'; import {MatMenuModule} from '@angular/material-experimental/mdc-menu'; import {MatRadioModule} from '@angular/material-experimental/mdc-radio'; import {MatSlideToggleModule} from '@angular/material-experimental/mdc-slide-toggle'; +import {MatTabsModule} from '@angular/material-experimental/mdc-tabs'; @Component({ selector: 'kitchen-sink-mdc', @@ -23,6 +24,7 @@ export class KitchenSinkMdc { MatMenuModule, MatRadioModule, MatSlideToggleModule, + MatTabsModule, ], declarations: [KitchenSinkMdc], exports: [KitchenSinkMdc], diff --git a/src/universal-app/theme.scss b/src/universal-app/theme.scss index 9ce08a53bd8a..26082502276e 100644 --- a/src/universal-app/theme.scss +++ b/src/universal-app/theme.scss @@ -7,6 +7,7 @@ @import '../material-experimental/mdc-menu/mdc-menu'; @import '../material-experimental/mdc-radio/mdc-radio'; @import '../material-experimental/mdc-slide-toggle/mdc-slide-toggle'; +@import '../material-experimental/mdc-tabs/mdc-tabs'; // Plus imports for other components in your app. @@ -23,6 +24,7 @@ @include mat-menu-typography-mdc(mat-typography-config()); @include mat-radio-typography-mdc(mat-typography-config()); @include mat-slide-toggle-typography-mdc(mat-typography-config()); +@include mat-tabs-typography-mdc(mat-typography-config()); // Define the default theme (same as the example above). $candy-app-primary: mat-palette($mat-indigo); @@ -40,3 +42,4 @@ $candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent); @include mat-menu-theme-mdc($candy-app-theme); @include mat-radio-theme-mdc($candy-app-theme); @include mat-slide-toggle-theme-mdc($candy-app-theme); +@include mat-tabs-theme-mdc($candy-app-theme); diff --git a/test/karma-system-config.js b/test/karma-system-config.js index e56c6cd7792c..3239888d0545 100644 --- a/test/karma-system-config.js +++ b/test/karma-system-config.js @@ -147,6 +147,8 @@ System.config({ 'dist/packages/material-experimental/mdc-radio/index.js', '@angular/material-experimental/mdc-slide-toggle': 'dist/packages/material-experimental/mdc-slide-toggle/index.js', + '@angular/material-experimental/mdc-tabs': + 'dist/packages/material-experimental/mdc-tabs/index.js', '@angular/material-experimental/popover-edit': 'dist/packages/material-experimental/popover-edit/index.js', },