refactor(Calendar, DatePicker, DateRangePicker, TimePicker): improve RTL support

Author: mrholek

docs/assets/scss/docs-pickers.scss

@@ -13,7 +13,5 @@ $enable-rtl: true;
 // stylelint-disable selector-no-qualifying-type
 div[dir="rtl"] {
   @import "../../../scss/calendar";
-  @import "../../../scss/date-picker";
-  @import "../../../scss/time-picker";
 }
 // stylelint-enable selector-no-qualifying-type

scss/_date-picker.scss

@@ -167,11 +167,6 @@
   }
 }
 
-// .date-picker-cleaner,
-// .date-picker-indicator {
-//   margin-inline-start: var(--#{$prefix}date-picker-padding-x);
-// }
-
 .date-picker-cleaner {
   display: none;
   width: var(--#{$prefix}date-picker-cleaner-width);
@@ -257,7 +252,7 @@
   grid-area: ranges;
   width: var(--#{$prefix}date-picker-ranges-width);
   padding: var(--#{$prefix}date-picker-ranges-padding);
-  border-right: var(--#{$prefix}date-picker-ranges-border-width) solid var(--#{$prefix}date-picker-ranges-border-color);
+  border-inline-end: var(--#{$prefix}date-picker-ranges-border-width) solid var(--#{$prefix}date-picker-ranges-border-color);
 }
 
 .date-picker-calendars {

scss/_time-picker.scss

@@ -230,7 +230,7 @@
 .time-picker-inline-select {
   padding: var(--#{$prefix}time-picker-inline-select-padding-y) var(--#{$prefix}time-picker-inline-select-padding-x);
   color: var(--#{$prefix}time-picker-inline-select-color);
-  text-align: right;
+  text-align: end;
   appearance: none;
   scrollbar-width: none;  /* Firefox */
   background-color: transparent;
@@ -283,14 +283,14 @@
   }
 
   &:not(:last-child) {
-    border-right: var(--#{$prefix}time-picker-roll-col-border-width) solid var(--#{$prefix}time-picker-roll-col-border-color);
+    border-inline-end: var(--#{$prefix}time-picker-roll-col-border-width) solid var(--#{$prefix}time-picker-roll-col-border-color);
   }
 }
 
 .time-picker-roll-cell {
   width: 50px;
   height: 32px;
-  padding: 0 $spacer 0 $spacer * .5;
+  padding-inline: $spacer * .5 $spacer;
   line-height: 32px;
 
   &.selected {

scss/mixins/_border-radius.scss

@@ -75,4 +75,18 @@
     @include ltr-rtl("border-bottom-left-radius", valid-radius($radius));
   }
 }
+
+@mixin border-start-radius-flex($radius: $border-radius) {
+  @if $enable-rounded {
+    border-start-start-radius: valid-radius($radius);
+    border-end-start-radius: valid-radius($radius);
+  }
+}
+
+@mixin border-end-radius-flex($radius: $border-radius) {
+  @if $enable-rounded {
+    border-start-end-radius: valid-radius($radius);
+    border-end-end-radius: valid-radius($radius);
+  }
+}
 // scss-docs-end border-radius-mixins

scss/themes/bootstrap/bootstrap.rtl.scss

@@ -9,6 +9,7 @@ $enable-rtl: true !default;
 
 /* rtl:begin:ignore */
 @import "../../mixins/avatar";
+@import "../../mixins/border-radius";
 @import "../../mixins/elevation";
 @import "../../mixins/icon";
 @import "../../mixins/ltr-rtl";

scss/themes/bootstrap/bootstrap.scss

@@ -6,6 +6,7 @@
 
 /* rtl:begin:ignore */
 @import "../../mixins/avatar";
+@import "../../mixins/border-radius";
 @import "../../mixins/elevation";
 @import "../../mixins/icon";
 @import "../../mixins/ltr-rtl";