diff --git a/src/components-examples/cdk-experimental/listbox/cdk-listbox-rtl-horizontal/cdk-listbox-rtl-horizontal-example.ts b/src/components-examples/cdk-experimental/listbox/cdk-listbox-rtl-horizontal/cdk-listbox-rtl-horizontal-example.ts index 2f6e890cb851..1cb26c672da3 100644 --- a/src/components-examples/cdk-experimental/listbox/cdk-listbox-rtl-horizontal/cdk-listbox-rtl-horizontal-example.ts +++ b/src/components-examples/cdk-experimental/listbox/cdk-listbox-rtl-horizontal/cdk-listbox-rtl-horizontal-example.ts @@ -1,4 +1,5 @@ import {Component} from '@angular/core'; +import {Dir} from '@angular/cdk/bidi'; import {CdkListbox, CdkOption} from '@angular/cdk-experimental/listbox'; import {MatPseudoCheckbox} from '@angular/material/core'; @@ -11,7 +12,7 @@ import {MatPseudoCheckbox} from '@angular/material/core'; templateUrl: 'cdk-listbox-rtl-horizontal-example.html', styleUrl: '../cdk-listbox-configurable/cdk-listbox-configurable-example.css', standalone: true, - imports: [CdkListbox, CdkOption, MatPseudoCheckbox], + imports: [CdkListbox, CdkOption, Dir, MatPseudoCheckbox], }) export class CdkListboxRtlHorizontalExample { fruits = [ diff --git a/src/components-examples/cdk-experimental/radio-group/cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example.html b/src/components-examples/cdk-experimental/radio-group/cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example.html similarity index 100% rename from src/components-examples/cdk-experimental/radio-group/cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example.html rename to src/components-examples/cdk-experimental/radio-group/cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example.html diff --git a/src/components-examples/cdk-experimental/radio-group/cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example.ts b/src/components-examples/cdk-experimental/radio-group/cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example.ts similarity index 90% rename from src/components-examples/cdk-experimental/radio-group/cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example.ts rename to src/components-examples/cdk-experimental/radio-group/cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example.ts index 46cba8f6a37a..74e945258850 100644 --- a/src/components-examples/cdk-experimental/radio-group/cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example.ts +++ b/src/components-examples/cdk-experimental/radio-group/cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example.ts @@ -1,4 +1,5 @@ import {Component} from '@angular/core'; +import {Dir} from '@angular/cdk/bidi'; import {FormsModule} from '@angular/forms'; import {CdkRadioGroup, CdkRadioButton} from '@angular/cdk-experimental/radio-group'; @@ -9,7 +10,7 @@ import {CdkRadioGroup, CdkRadioButton} from '@angular/cdk-experimental/radio-gro templateUrl: 'cdk-radio-group-rtl-horizontal-example.html', styleUrl: '../radio-common.css', standalone: true, - imports: [CdkRadioGroup, CdkRadioButton, FormsModule], + imports: [CdkRadioGroup, CdkRadioButton, Dir, FormsModule], }) export class CdkRadioGroupRtlHorizontalExample { fruits = [ diff --git a/src/components-examples/cdk-experimental/radio-group/index.ts b/src/components-examples/cdk-experimental/radio-group/index.ts index 3e6f0947f13e..21416f7d797c 100644 --- a/src/components-examples/cdk-experimental/radio-group/index.ts +++ b/src/components-examples/cdk-experimental/radio-group/index.ts @@ -1,6 +1,6 @@ export {CdkRadioGroupStandardExample} from './cdk-radio-group-standard/cdk-radio-group-standard-example'; export {CdkRadioGroupHorizontalExample} from './cdk-radio-group-horizontal/cdk-radio-group-horizontal-example'; -export {CdkRadioGroupRtlHorizontalExample} from './cdk-radio-rtl-group-horizontal/cdk-radio-group-rtl-horizontal-example'; +export {CdkRadioGroupRtlHorizontalExample} from './cdk-radio-group-rtl-horizontal/cdk-radio-group-rtl-horizontal-example'; export {CdkRadioGroupActiveDescendantExample} from './cdk-radio-group-active-descendant/cdk-radio-group-active-descendant-example'; export {CdkRadioGroupDisabledFocusableExample} from './cdk-radio-group-disabled-focusable/cdk-radio-group-disabled-focusable-example'; export {CdkRadioGroupDisabledSkippedExample} from './cdk-radio-group-disabled-skipped/cdk-radio-group-disabled-skipped-example'; diff --git a/src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.html b/src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.html deleted file mode 100644 index a409d56e66fa..000000000000 --- a/src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.html +++ /dev/null @@ -1,29 +0,0 @@ -
- - -
- Tabpanel 1 -
- -
- Tabpanel 2 -
- -
- Tabpanel 3 -
- -
- Tabpanel 4 -
- -
- Tabpanel 5 -
-
diff --git a/src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.html b/src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.html new file mode 100644 index 000000000000..2f48082a8cf8 --- /dev/null +++ b/src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.html @@ -0,0 +1,31 @@ +
+
+ + +
+ Tabpanel 1 +
+ +
+ Tabpanel 2 +
+ +
+ Tabpanel 3 +
+ +
+ Tabpanel 4 +
+ +
+ Tabpanel 5 +
+
+
diff --git a/src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.ts b/src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.ts similarity index 59% rename from src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.ts rename to src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.ts index 19cac48ffc8e..59f7056c122a 100644 --- a/src/components-examples/cdk-experimental/tabs/cdk-rtl-vertical/cdk-tabs-rtl-vertical-example.ts +++ b/src/components-examples/cdk-experimental/tabs/cdk-rtl/cdk-tabs-rtl-example.ts @@ -1,4 +1,5 @@ import {Component} from '@angular/core'; +import {Dir} from '@angular/cdk/bidi'; import { CdkTab, CdkTabs, @@ -7,15 +8,15 @@ import { CdkTabContent, } from '@angular/cdk-experimental/tabs'; -/** * @title RTL & Vertical */ +/** * @title RTL */ @Component({ - selector: 'cdk-tabs-rtl-vertical-example', - exportAs: 'cdkTabsRtlVerticalExample', - templateUrl: 'cdk-tabs-rtl-vertical-example.html', + selector: 'cdk-tabs-rtl-example', + exportAs: 'cdkTabsRtlExample', + templateUrl: 'cdk-tabs-rtl-example.html', styleUrls: ['../cdk-tabs-common.css'], standalone: true, - imports: [CdkTabList, CdkTab, CdkTabs, CdkTabPanel, CdkTabContent], + imports: [CdkTabList, CdkTab, CdkTabs, CdkTabPanel, CdkTabContent, Dir], }) -export class CdkTabsRtlVerticalExample { +export class CdkTabsRtlExample { selectedIndex = 0; } diff --git a/src/components-examples/cdk-experimental/tabs/index.ts b/src/components-examples/cdk-experimental/tabs/index.ts index cbd4adba90e6..177ed8e5d478 100644 --- a/src/components-examples/cdk-experimental/tabs/index.ts +++ b/src/components-examples/cdk-experimental/tabs/index.ts @@ -2,7 +2,7 @@ export {CdkTabsConfigurableExample} from './cdk-tabs-configurable/cdk-tabs-confi export {CdkTabsExplicitSelectionExample} from './cdk-explicit-selection/cdk-tabs-explicit-selection-example'; export {CdkTabsSelectionFollowsFocusExample} from './cdk-selection-follows-focus/cdk-tabs-selection-follows-focus-example'; export {CdkTabsVerticalExample} from './cdk-vertical-orientation/cdk-tabs-vertical-example'; -export {CdkTabsRtlVerticalExample} from './cdk-rtl-vertical/cdk-tabs-rtl-vertical-example'; +export {CdkTabsRtlExample} from './cdk-rtl/cdk-tabs-rtl-example'; export {CdkTabsActiveDescendantExample} from './cdk-active-descendant/cdk-tabs-active-descendant-example'; export {CdkTabsDisabledFocusableExample} from './cdk-disabled-focusable/cdk-tabs-disabled-focusable-example'; export {CdkTabsDisabledSkippedExample} from './cdk-disabled-skipped/cdk-tabs-disabled-skipped-example'; diff --git a/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.html b/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.html index f0d5aea2de8f..34f6755fa711 100644 --- a/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.html +++ b/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.html @@ -10,13 +10,13 @@

Selection Follows Focus

-

Horizontal Orientation

+

Vertical Orientation

-

RTL & Horizontal Orientation

- +

RTL

+
diff --git a/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.ts b/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.ts index 1f82baa58411..67d350382cba 100644 --- a/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.ts +++ b/src/dev-app/cdk-experimental-tabs/cdk-tabs-demo.ts @@ -12,7 +12,7 @@ import { CdkTabsExplicitSelectionExample, CdkTabsSelectionFollowsFocusExample, CdkTabsVerticalExample, - CdkTabsRtlVerticalExample, + CdkTabsRtlExample, CdkTabsActiveDescendantExample, CdkTabsDisabledFocusableExample, CdkTabsDisabledSkippedExample, @@ -28,7 +28,7 @@ import { CdkTabsExplicitSelectionExample, CdkTabsSelectionFollowsFocusExample, CdkTabsVerticalExample, - CdkTabsRtlVerticalExample, + CdkTabsRtlExample, CdkTabsActiveDescendantExample, CdkTabsDisabledFocusableExample, CdkTabsDisabledSkippedExample,