From 175dc929a5245bdcf3f392a2baa156674b06079b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pedro=20Louren=C3=A7o?= <pedro.lourenco@outsystems.com>
Date: Tue, 5 Nov 2024 13:03:11 +0000
Subject: [PATCH] feat(range): adding custom styling for ionic theme (#29979)

Issue number: internal

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
No ionic theme custom implementation existed for the ion-range
component.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Added ionic theme specific styling (based on the ios styling) for the
range according to UX requirements.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->


## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

![image](https://github.com/user-attachments/assets/1b78cba4-0f0f-45d4-abdc-d48cdb917ea2)
---
 .../range/{range.scss => range.common.scss}   |  61 +----
 core/src/components/range/range.ionic.scss    | 217 ++++++++++++++++++
 core/src/components/range/range.ios.scss      |   2 +-
 core/src/components/range/range.md.scss       |   2 +-
 core/src/components/range/range.native.scss   |  83 +++++++
 core/src/components/range/range.tsx           |   2 +-
 .../components/range/test/basic/range.e2e.ts  |   2 +-
 ...ionic-md-ltr-light-Mobile-Chrome-linux.png | Bin 0 -> 2067 bytes
 ...onic-md-ltr-light-Mobile-Firefox-linux.png | Bin 0 -> 2821 bytes
 ...ionic-md-ltr-light-Mobile-Safari-linux.png | Bin 0 -> 2077 bytes
 ...ionic-md-ltr-light-Mobile-Chrome-linux.png | Bin 0 -> 2192 bytes
 ...onic-md-ltr-light-Mobile-Firefox-linux.png | Bin 0 -> 2947 bytes
 ...ionic-md-ltr-light-Mobile-Safari-linux.png | Bin 0 -> 2612 bytes
 ...ionic-md-ltr-light-Mobile-Chrome-linux.png | Bin 0 -> 2271 bytes
 ...onic-md-ltr-light-Mobile-Firefox-linux.png | Bin 0 -> 3185 bytes
 ...ionic-md-ltr-light-Mobile-Safari-linux.png | Bin 0 -> 2339 bytes
 ...ionic-md-ltr-light-Mobile-Chrome-linux.png | Bin 0 -> 2011 bytes
 ...onic-md-ltr-light-Mobile-Firefox-linux.png | Bin 0 -> 2861 bytes
 ...ionic-md-ltr-light-Mobile-Safari-linux.png | Bin 0 -> 2082 bytes
 19 files changed, 305 insertions(+), 64 deletions(-)
 rename core/src/components/range/{range.scss => range.common.scss} (77%)
 create mode 100644 core/src/components/range/range.ionic.scss
 create mode 100644 core/src/components/range/range.native.scss
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Chrome-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Firefox-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Safari-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Chrome-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Firefox-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Safari-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Chrome-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Firefox-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Safari-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Chrome-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Firefox-linux.png
 create mode 100644 core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Safari-linux.png

diff --git a/core/src/components/range/range.scss b/core/src/components/range/range.common.scss
similarity index 77%
rename from core/src/components/range/range.scss
rename to core/src/components/range/range.common.scss
index a6e67940f5..8a914c77e4 100644
--- a/core/src/components/range/range.scss
+++ b/core/src/components/range/range.common.scss
@@ -1,4 +1,4 @@
-@import "../../themes/native/native.globals";
+@import "../../themes/mixins";
 @import "./range.vars.scss";
 
 // Range
@@ -18,7 +18,6 @@
    * @prop --pin-background: Background of the range pin (only available in MD mode)
    * @prop --pin-color: Color of the range pin (only available in MD mode)
    */
-  --knob-handle-size: calc(var(--knob-size) * 2);
 
   display: flex;
   position: relative;
@@ -26,10 +25,7 @@
   flex: 3;
   align-items: center;
 
-  font-family: $font-family-base;
-
   user-select: none;
-  z-index: $z-index-item-input;
 }
 
 :host(.range-disabled) {
@@ -40,10 +36,6 @@
   flex: initial;
 }
 
-::slotted(ion-icon[slot]) {
-  font-size: 24px;
-}
-
 .range-slider {
   position: relative;
 
@@ -214,8 +206,6 @@
    * only the label would show and users
    * would not be able to see the range.
    */
-  max-width: 200px;
-
   text-overflow: ellipsis;
 
   white-space: nowrap;
@@ -254,15 +244,6 @@
   flex-direction: row;
 }
 
-:host(.range-label-placement-start) .label-text-wrapper {
-  /**
-   * The margin between the label and
-   * the range should be on the end
-   * when the label sits at the start.
-   */
-  @include margin(0, $form-control-label-margin, 0, 0);
-}
-
 // Range Label Placement - End
 // ----------------------------------------------------------------
 
@@ -274,27 +255,9 @@
   flex-direction: row-reverse;
 }
 
-/**
- * The margin between the label and
- * the range should be on the start
- * when the label sits at the end.
- */
-:host(.range-label-placement-end) .label-text-wrapper {
-  @include margin(0, 0, 0, $form-control-label-margin);
-}
-
 // Range Label Placement - Fixed
 // ----------------------------------------------------------------
 
-:host(.range-label-placement-fixed) .label-text-wrapper {
-  /**
-   * The margin between the label and
-   * the range should be on the end
-   * when the label sits at the start.
-   */
-  @include margin(0, $form-control-label-margin, 0, 0);
-}
-
 /**
  * Label is on the left of the range in LTR and
  * on the right in RTL. Label also has a fixed width.
@@ -321,26 +284,4 @@
 
 :host(.range-label-placement-stacked) .label-text-wrapper {
   @include transform-origin(start, top);
-  @include transform(scale(#{$form-control-label-stacked-scale}));
-
-  /**
-  * The margin between the label and
-  * the range should be on the bottom
-  * when the label sits on top.
-  */
-  @include margin(null, 0, $form-control-label-margin, 0);
-
-  /**
-   * Label text should not extend
-   * beyond the bounds of the range.
-   */
-  max-width: calc(100% / #{$form-control-label-stacked-scale});
-}
-
-:host(.in-item.range-label-placement-stacked) .label-text-wrapper {
-  @include margin($range-item-label-margin-top, null, $form-control-label-margin, null);
-}
-
-:host(.in-item.range-label-placement-stacked) .native-wrapper {
-  @include margin(null, null, $range-item-label-margin-bottom, null);
 }
diff --git a/core/src/components/range/range.ionic.scss b/core/src/components/range/range.ionic.scss
new file mode 100644
index 0000000000..8d75a8ff4c
--- /dev/null
+++ b/core/src/components/range/range.ionic.scss
@@ -0,0 +1,217 @@
+@use "../../themes/ionic/ionic.globals.scss" as globals;
+@import "./range.common";
+
+// Ionic Range
+// --------------------------------------------------
+
+:host {
+  --knob-border-radius: #{globals.$ion-border-radius-full};
+  --knob-background: #{globals.$ion-primitives-base-white};
+  --knob-box-shadow: none;
+  --knob-size: #{globals.$ion-scale-600};
+  --knob-handle-size: #{globals.$ion-scale-1000};
+  --bar-height: #{globals.$ion-scale-200};
+  --bar-background: #{globals.$ion-primitives-neutral-100};
+  --bar-background-active: #{globals.ion-color(primary, base)};
+  --bar-border-radius: #{globals.$ion-border-radius-400};
+  --height: #{globals.$ion-scale-1000};
+
+  @include globals.typography(globals.$ion-body-md-regular);
+
+  z-index: globals.$ion-z-index-100;
+}
+
+:host(.range-item-start-adjustment) {
+  @include padding(null, null, null, globals.$ion-space-600);
+}
+
+:host(.range-item-end-adjustment) {
+  @include padding(null, globals.$ion-space-600, null, null);
+}
+
+:host(.ion-color) .range-bar-active,
+:host(.ion-color) .range-tick-active {
+  background: globals.current-color(base);
+}
+
+::slotted(ion-icon[slot]) {
+  font-size: globals.$ion-font-size-600;
+}
+
+::slotted([slot="start"]) {
+  @include margin(0, globals.$ion-space-400, 0, 0);
+}
+
+::slotted([slot="end"]) {
+  @include margin(0, 0, 0, globals.$ion-space-400);
+}
+
+::slotted([slot="label"]) {
+  max-width: globals.$ion-scale-5000;
+}
+
+:host(.range-has-pin:not(.range-label-placement-stacked)) {
+  /**
+  * The pin should not overlap any elements that are
+  * above the range. By adding padding to the top of the
+  * range, it provides a buffer for the pin to move into
+  * when it is pressed.
+  *
+  * The padding is not included when the label is stacked
+  * because the pin is below the label.
+  * It still requires a buffer to prevent the pin from
+  * overlapping the range. The buffer is added to the
+  * bottom of the range label instead of the host.
+  */
+  @include padding(calc(globals.$ion-space-200 + globals.dynamic-font(12px)), null, null, null);
+}
+
+:host(.range-has-pin.range-label-placement-stacked) .label-text-wrapper {
+  /**
+  * The pin should not overlap the stacked label. By adding
+  * margin to the bottom of the label, it provides a buffer
+  * for the pin to move into when it is pressed.
+  */
+  @include margin(null, null, calc(globals.$ion-space-200 + globals.dynamic-font(12px)), null);
+}
+
+.range-bar-active {
+  bottom: 0;
+
+  width: auto;
+
+  background: var(--bar-background-active);
+
+  &.has-ticks {
+    @include border-radius(0);
+    @include margin(null, calc(-1 * globals.$ion-scale-100 * 0.5), null, calc(-1 * globals.$ion-scale-100 * 0.5));
+  }
+}
+
+.range-tick {
+  @include margin-horizontal(calc(globals.$ion-scale-100 * -0.5), null);
+  @include border-radius(globals.$ion-border-radius-0);
+
+  position: absolute;
+  top: calc((var(--height) * 0.5) - (globals.$ion-scale-300 * 0.5));
+
+  width: globals.$ion-scale-100;
+  height: globals.$ion-scale-300;
+
+  background: globals.$ion-primitives-neutral-100;
+  pointer-events: none;
+}
+
+.range-tick-active {
+  background: var(--bar-background-active);
+}
+
+.range-pin {
+  @include transform(translate3d(0, 100%, 0), scale(0.01));
+  @include padding(globals.$ion-space-200, globals.$ion-space-200, globals.$ion-space-200, globals.$ion-space-200);
+
+  min-width: globals.$ion-scale-700;
+
+  transition: transform 120ms ease;
+
+  background: transparent;
+
+  font-size: globals.dynamic-font(12px);
+
+  text-align: center;
+}
+
+.range-knob {
+  border-width: globals.$ion-border-size-025;
+  border-style: globals.$ion-border-style-solid;
+  border-color: globals.ion-color(primary, base);
+  box-sizing: border-box;
+}
+
+/**
+ * The -100% ensures the pin sits on top
+ * of the range-knob-handle container.
+ * We apply 11px so that the pin
+ * text is closer to the knob inside of the container.
+ * We also apply the 11px here instead of using "top"
+ * otherwise the pin text will translate below the knob
+ * when the text is scaled.
+ */
+.range-knob-pressed .range-pin,
+.range-knob-handle.ion-focused .range-pin {
+  transform: translate3d(0, calc(-100% + 11px), 0) scale(1);
+}
+
+// Ionic Range: Disabled (based on iOS Range)
+// --------------------------------------------------
+// When the range is disabled, the entire range,
+// range label, any slotted labels, and any slotted
+// icons need to receive the same opacity.
+
+:host(.range-disabled) {
+  opacity: 0.3;
+}
+
+// Range Label Placement - Start
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-start) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the end
+   * when the label sits at the start.
+   */
+  @include margin(0, globals.$ion-space-400, 0, 0);
+}
+
+// Range Label Placement - End
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-end) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the start
+   * when the label sits at the end.
+   */
+  @include margin(0, 0, 0, globals.$ion-space-400);
+}
+
+// Range Label Placement - Fixed
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-fixed) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the end
+   * when the label sits at the start.
+   */
+  @include margin(0, globals.$ion-space-400, 0, 0);
+}
+
+// Range Label Placement - Stacked
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-stacked) .label-text-wrapper {
+  @include transform(scale(0.75));
+
+  /**
+  * The margin between the label and
+  * the range should be on the bottom
+  * when the label sits on top.
+  */
+  @include margin(null, 0, globals.$ion-space-400, 0);
+
+  /**
+   * Label text should not extend
+   * beyond the bounds of the range.
+   */
+  max-width: calc(100% / 0.75);
+}
+
+:host(.in-item.range-label-placement-stacked) .label-text-wrapper {
+  @include margin(globals.$ion-space-250, null, globals.$ion-space-400, null);
+}
+
+:host(.in-item.range-label-placement-stacked) .native-wrapper {
+  @include margin(null, null, globals.$ion-space-0, null);
+}
diff --git a/core/src/components/range/range.ios.scss b/core/src/components/range/range.ios.scss
index ad715ded78..06a678a97e 100644
--- a/core/src/components/range/range.ios.scss
+++ b/core/src/components/range/range.ios.scss
@@ -1,4 +1,4 @@
-@import "./range";
+@import "./range.native";
 @import "./range.ios.vars";
 
 // iOS Range
diff --git a/core/src/components/range/range.md.scss b/core/src/components/range/range.md.scss
index df6bea3754..a929830031 100644
--- a/core/src/components/range/range.md.scss
+++ b/core/src/components/range/range.md.scss
@@ -1,4 +1,4 @@
-@import "./range";
+@import "./range.native";
 @import "./range.md.vars";
 
 // Material Design Range
diff --git a/core/src/components/range/range.native.scss b/core/src/components/range/range.native.scss
new file mode 100644
index 0000000000..f7bb517230
--- /dev/null
+++ b/core/src/components/range/range.native.scss
@@ -0,0 +1,83 @@
+@import "range.common";
+@import "../../themes/native/native.globals";
+@import "./range.vars.scss";
+
+:host {
+  --knob-handle-size: calc(var(--knob-size) * 2);
+
+  font-family: $font-family-base;
+
+  z-index: $z-index-item-input;
+}
+
+::slotted(ion-icon[slot]) {
+  font-size: 24px;
+}
+
+::slotted([slot="label"]) {
+  max-width: 200px;
+}
+
+// Range Label Placement - Start
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-start) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the end
+   * when the label sits at the start.
+   */
+  @include margin(0, $form-control-label-margin, 0, 0);
+}
+
+// Range Label Placement - End
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-end) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the start
+   * when the label sits at the end.
+   */
+  @include margin(0, 0, 0, $form-control-label-margin);
+}
+
+// Range Label Placement - Fixed
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-fixed) .label-text-wrapper {
+  /**
+   * The margin between the label and
+   * the range should be on the end
+   * when the label sits at the start.
+   */
+  @include margin(0, $form-control-label-margin, 0, 0);
+}
+
+// Range Label Placement - Stacked
+// ----------------------------------------------------------------
+
+:host(.range-label-placement-stacked) .label-text-wrapper {
+  @include transform(scale(#{$form-control-label-stacked-scale}));
+
+  /**
+  * The margin between the label and
+  * the range should be on the bottom
+  * when the label sits on top.
+  */
+  @include margin(null, 0, $form-control-label-margin, 0);
+
+  /**
+   * Label text should not extend
+   * beyond the bounds of the range.
+   */
+  max-width: calc(100% / #{$form-control-label-stacked-scale});
+}
+
+:host(.in-item.range-label-placement-stacked) .label-text-wrapper {
+  @include margin($range-item-label-margin-top, null, $form-control-label-margin, null);
+}
+
+:host(.in-item.range-label-placement-stacked) .native-wrapper {
+  @include margin(null, null, $range-item-label-margin-bottom, null);
+}
diff --git a/core/src/components/range/range.tsx b/core/src/components/range/range.tsx
index af2f251943..9b74994191 100644
--- a/core/src/components/range/range.tsx
+++ b/core/src/components/range/range.tsx
@@ -43,7 +43,7 @@ import type {
   styleUrls: {
     ios: 'range.ios.scss',
     md: 'range.md.scss',
-    ionic: 'range.md.scss',
+    ionic: 'range.ionic.scss',
   },
   shadow: true,
 })
diff --git a/core/src/components/range/test/basic/range.e2e.ts b/core/src/components/range/test/basic/range.e2e.ts
index f864f2d049..dcd8627241 100644
--- a/core/src/components/range/test/basic/range.e2e.ts
+++ b/core/src/components/range/test/basic/range.e2e.ts
@@ -1,7 +1,7 @@
 import { expect } from '@playwright/test';
 import { configs, test } from '@utils/test/playwright';
 
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+configs({ modes: ['ios', 'md', 'ionic-md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
   test.describe(title('range: basic'), () => {
     test.beforeEach(async ({ page }) => {
       await page.goto('/src/components/range/test/basic', config);
diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..dd38b5d296fe055aa18aefb47e639cee6f56cdc5
GIT binary patch
literal 2067
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

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..23bdef180b97d1fa4ae0238c9a7aafcbe471b070
GIT binary patch
literal 2821
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
X<nQ-lk)RxD00000NkvXXu0mjfD#=V3

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-default-ionic-md-ltr-light-Mobile-Safari-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..2084b203b43b287b48220f4cb70920e498030c6f
GIT binary patch
literal 2077
zcmV+&2;%pNP)<h;3K|Lk000e1NJLTq00CwI001cn0ssI2i9Hld00006VoOIv0RI60
z0RN!9r;`8x2hvGIK~#90?cIA!Q&}Dd@N;fox22_x&~d4N(S#|r7<a>jab;P^W+jRc
z*921@jckMkhfIPa5_dwQFv9kaRcH1!1~HRW#@z&j$-o+8Ho7~pp-%9@Q&|%yy3pVZ
zg|yI?zV1EyN8N@U3-kh|-I?F#ua@5PyXQ9W?diGaUN9j90RTXFsAzWp0Pz0=A_D-x
z0YnA>fCGpO000LN82|tdATj^|96)3M062ii003~nk9G$D2w}lX{yyZt`Or7~f|<6n
zb{9#Er?zaOvNikznS#viJdC5=#qTQ&t3N?Z@%qsxw>=;Bxp!{mAIRiqrSad8Q*sHm
z&ap41**hct-T|LXjG9Zt+3E0s7X=U*AcjoNuw@@QRhy_L9i6^~7jhdy&}U!z&UP*2
z|4`6cCgz9U3PcJ-28b1-|7H%Ka~>}g)#Qs-+<1P0RDJC7GvqHPq#_t?Y#@jX5EH(!
zlf6yz&86aBWC_A-!mz0NqEpDn7i%OD?HgDO&X|Ch@J^dkpDPSMFAzdJ3jOI<l5q?3
z=@;I}bqst9Ra{(*Lvg#^(e4}gzPLT?o0uW*713N9(n9=)D#>rU-7XIdmNy8tSS)jM
za|ogK_V&KMzTV#6zzb@%8pq6utYgQHS*_OV*RMyrBOoI7oprpsUsU)OhatvdNB`*D
z{U*OUj2RHHc6^merBbO7LQ17lC={lrr$?n948!nv>o)hjj@2ft%=;a#FCMcFH++so
z3dZQ?r=+WHuFK~C?r$FbPndP=5?BmlOi`3TAfPB}$+--d%T--ntxzaZQ&XFoniz(0
zI2;(`^XJd2)oPli^Yinkrlu+@E2UCta&mHedpklXuuV%#i(0J~i^YY7g;uL|`GWQJ
z^~uS}jg5^6q4DwY{rmSzBodWMb^7$_KtqK>(bm@1-QA5bb~qe1n+;<;I5-%1)nG8>
z<>du;y|~)zd*u2~O<I|s8s=|2WFRjhDkYJkg{yC#n;{&XVCNUsuS4K}5keS-@pwFh
zkR?w~Ra8{W&CQuiCacw|*Xxs#lFG}=5kkGay&WALcDuczqC%t5)YaAX_xJbo^wieY
z78Df7<#L43qeqWSCX>x(D=scRapJ_)t5=sPc<<i5&d$#5+qW|elb@eoP*CvX$&+W#
zo*g=LNUPQAbUKU0Qdd_uGc(iC(IJ&eZ8qC7#}=#>a*s7NHJsk5_dj*noSa&K)ksTP
z(=<FSz$ppT<Sfx_iIuO?-${fJuh$zoGM+zw-re18u~?Flk`O}2j~~Bw?ONb3ytTD8
zD=P~jR9aek<Hn8V=4OOYMn;CwXdE6M&dJF^2sJb`D3wa3QfV|A4<0;t>C&Z_FJCTI
z&}cO7*|P^B<oEk~dU|&3*ddWfwr<^;mzUSy->=i@;^N}?d_IrIlS)?}y9TR;JOr+h
z@y{`q)AnF>RGZd%=5DhBe{F-vh&YyILr2Eo;2<F+EiEnZ)bICi-n=>Rn9qOJL?)9Z
zCME_RQxqi@i=EDIe<JVNwaf4KPfSdVjg2i;P$(1zD~rYAva+&)fdPlZv9Pdk^ypEp
zhZL-~%prhSvkq&62tgQD3~YoYznF+bqTqZ1T9g!=c)ebPP++y#iUr+n_ujpGtE#H5
zT)85b%ZrPPSFy*%)_w>%8tUdFm{g0nN$Xlib1&`a2l9343s??CQKA2eG#ZV^<FVWA
znVFdgA%<bRUT^r*hb;T*H{ij82Lgd0H8qtGvSPu<j~`D>P1V=e2PQ<EPG@iwv-osx
zTwEMQQ4WVA@HCK0VID%5{SP{$6ZikiVRvzD2e^6m&6*;^?IV*jY;ppu8;>lEu}~-s
zJ(g3e)kQ@`6%`eC@7^6BA1^5>X=rE&zqG+%7#$ronM|inozm;|G);$7FeN2LBoei>
zv<wUk7z~D6w{Cenp1?~92?;|(L-+6B_xXGRfk3O(Ubt{!WMrhXv-9%h%aJ&QS4Fn)
zO|7z`w|Fu!d`XU=Nh|AG!vfBK410H`Vkzf^U?5x=V;+x3(=^5yk^eFpjascX_;hx5
zR<GB`$H&WLvXYV#tJOL`KaUVHo6Ug@&YU@uot+)rUM`n+b#(={X>4rNXf!lU7Zw)I
z&d!EekPy<<)wONgHibfQ<j9eeCr_4_mj{0S^y$;Iw6ys6`043sLWtRH&dA7+N~L*u
zd6kuwxw*N7kk_ldzDELL(!LModk4I$ZvM;PJKAo!*Relf8S8vmn#19c$z*1;dH3$!
z>sS_ix7``>|GLA~Z;W5XmFy3{V)P$5ADokkg)kD_2r$VEqVH!r`Ke0Yxz9OY*0kUy
z?|tGj9Ht>JHVi}thzS>KB!9i@{p?F$_)QoV)wa1ZQh8-LYgjr8ID-3SfLJj$!5sdr
z^W6eb?Y@;SFq?Cc%8y-yCD-5<I~xlk1H=%^3|sz@Qz@sKb@YyuC2!={ZT6n+au;L@
z&X&TB{5Bdy28b;_2L1Vt=iKKWZ3=ZDQ}Fhi{5Ry3A`Va6*%#C7?Gb<9eV<%{KPaJp
ztcKA=6hLHvShV0Jw}<^VANq!#Gt+ad%}JDUDmj75PUj!U6#Qr#{8NIcfye*=Z~$ja
z00107WB>p-fXDy<Z~&130N?;30|3AQL<RtW1BeU&00;j8Yz+W&rl4Uc00000NkvXX
Hu0mjfdT8l4

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..70d9ed4e920c6931ef89a184b959fba48f293bb2
GIT binary patch
literal 2192
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
SwhVdz0000<MNUMnLSTXi!ZghQ

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..1e27e871beafd00e4e37c49c4154e8ef9e0014ea
GIT binary patch
literal 2947
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
UyF<}~4A&I;C}U)umTTPq0G4`q+5i9m

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-dual-knobs-ionic-md-ltr-light-Mobile-Safari-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..82611b46e80cbed62e836a2c1d5887952371b7a1
GIT binary patch
literal 2612
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
WvIo>8_JN!L0000<MNUMnLSTY2Y2q*d

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..b32c6748093e78bcb12f0f0230f2f9ec76f751a4
GIT binary patch
literal 2271
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
S%NBGjfR%-vc@_Lx^1lF?%1{UZ

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..9023918ae96965756eec43a779238e4215d4af0a
GIT binary patch
literal 3185
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
E0dflGuK)l5

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-pin-ionic-md-ltr-light-Mobile-Safari-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..6415db4bfcb5e98fc908dd68b6b65ad628f66871
GIT binary patch
literal 2339
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

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..745736714d0afbacfbe1fd059cca14a406d0bba2
GIT binary patch
literal 2011
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

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..a8b3025458c154021e06b1e75aaa7dce8d437b41
GIT binary patch
literal 2861
zcmV+|3)1w7P)<h;3K|Lk000e1NJLTq00C(L001cn1^@s6_f*)H000W~Nkl<ZcwX(D
zcTiQ?9ml^kl`7Z*quAC4Dqu<M&a6c27!_T0?25#ObsP(<6@^#`_TJV7-L;EEi21`<
zNCsmkiXC^17<Z+2c;x*~0(m&fd+&O^-pBi$8OPCk&pE&IJ(th@@jd6>Yf+{x;KB;9
z0;~Wlph^WS7}Bbo7Y>RQU<FtKp#VdgF9cSA6<`HatN=q=#goIKu>!0BE5MNEYk(DC
z1y}(UE5MLe@#Ju5tN<&(3NWPk8ej!j0aif83NWNqJUJX1E5Hh{0t{)s23P@BfE7@&
z0t{&tPY#Dxy%k8$DZ|;MV#NKU2+!VVke03y19o+>L<?6d4D4hB|6kj{+1{dh3&EqS
zQUQiEUm&c2!V0{6t3kw>0wkuCpudj|y0@`Lb1jq`*RvFny!=^%XKAIl`k(}VzEg~z
z9@bbq%oYvnFsv1xDphpHkXFSsa1iFAz?r`n<M+FBG4;1K5jxTqwQQ;$d43V_ZA?C*
zuM}ecEPM3tpr?Yl2x&&+WJsIQWb;tJtO8N7h1hbT00-yTqqnEEQNbkKE<xaq9IW`p
z4pV$<7*&@~Hf;qM(xyFs9KDGs@Z<F&tUXbHi=mEibCG6Sy!f{U{Z?mVTcADqdK(9M
z6OoC-{D1-$BSwrUJ9+ZtN5#p{&qu9VwOBk>fEAFaz;o@Q;DEK+hzoH<^I!efca~c2
zzbwV@h#Vw_JE5+lG}ue+o9lfU1uR~@dR3N{l_h%LyLT_npFfXt=gw6`)4FwQSXh|u
z#n7fr8_b?PTl`T=aT%XcDU|f@oIhJ=O7*2wKO~e=eaY3&_^4cT{>mD22iKHko<pMZ
zkzZ7XO_S^-wU?KdSE-(zowRoJb*@xD6o*oMDb<hem@3&F;o;#pdh{sn-@mU<e^ngU
zXf&|2tU5FK6iAnrmcq))O7^kJ^}}ySU`q9+R6nK$>6CwIv*<P1NRFxvTbZonpR>x)
zVPPijM%IRlgYgNJQlL?)ABMD6fu~QOV#bUaxPJXQ8aHl?HEY&DYm*=+CkKv>j@Y<y
zBlhgsgVfYi^zPjohYue{NJt2dA3qLfXJ@Qfu>ygCfr2TWJ9kExE?scz)-Bw*a|bP2
zw7`J_2hgcgrwZmoMn+=OrcEHLrGNka*t&Hq>eQ)&*w|Q%88b$-MRkrHJBFrBn_~X_
z`M7-fvgm8tv}stqdNpp}zKsqYI#jet?cca@13o@Jm^5h;=FOWYj$OKR34Qza1%3OV
zd^`&lED*7e8#fMg<4Q<Kz@kNq@cj96(dLdFJJ7COJ3|=x!E@dRn&gJKqUsgs*4i3v
z-L0@;qOGj4j{9RS{Jbp@(1pL*A*-+|X^fIXN)oB)&7^a4bJ4bKTZ|et3e%@g$F*zM
z#NPy20yaUKz`S9@24rStV&cS!;#ZHkbLR?>pE`94VPRo-@!|y<Hf$&$O)xxt`ZVg-
zuP*>gZ9abdSY)l+w{I8FKXm92>eZ_!YzkLbSH#4`2uKeZGDJXn=FFJ_&|Y3%7&ves
zmM&c?ZYINq4HGwvkt0WnI0()`K|$gsV{2<`5Tv_z?=HsEym@oHdGiK6di21qUAxe=
zYgcUBwhd>_oWY|<k5HqAwA6?pt&*Pv1;X%XWQmCJcIai~ZVr8+9lKhD_*+HTKK0W)
zZhigm@h__YS<QMOO|XoJh`@sf4=SP^Ja{lVcI=47ix&$>U%7GxJ$v>P#}_VKhzl1k
z;NioE;@@OR5F80?0|pEbkPZk4z>+0P#PRg>bOGVGxH$Ow`l4C0W>~*|Jw}fnEsj(6
zOK_yDIzB!g!-o$S@U^zKMoCGD$e2AnJyGtf4IMgEz&k1`O4NVf?l2^irmUQ9JX9#_
zriD|2G!?qLQC3eknLd5`NSZ;0v?SR~vXYy#B@$LTqETJrZHcM|d@r>Wv-afS;&S=z
zIFl5*8V9Wx(qs!z_NcqVqp+|LW5<paSua64F)>kql*-DLD}{w{_3G6M*~o_2w{M?-
z^ZSsdlUlZHDS%JeuZxR|fO@&tOg02T`Ps8)NKQ@`Z4?v~RJ2Y1w|x0>Bqb$@44q&;
zWy+Kas7isf?sy35bc3?7`Ts)%6wm(s`!RX)WJ#9>Lt2t-CRvFdR!QCCj2bfUn9Iy7
zgZKO_{4<gtZZXLV!@!`4e+EICtPO&aZXr0^+uO?m=_XB@2+)$HLXbXj;sm_Cy({%c
z=TIiC3u%HiSrX(!QwCqVc5QK-Y?AWKR}M(~`S}TpN4GR+&;U+OP6kR{`80;KB-u=|
zlAU%#N6I#5ILN$<HCvmfc+Aegqb<@bH<J|841+cZ(z|!>MrdfLSQMlTmkMR94h{|#
z3vI?`(qvgITeeKJm6n!<MvWSY#W}JM+}zy6A{{}uykuu*i<<#?(z=kodGn_5oHH^q
z1fZ#qr9wb2hqQ->2WHKhRj~!HSFc{^*RP*g*rY->%b-DnDlHu9j)xX1X}q*G@%?zD
zUNa17smhsNy@quyadwFVzH*h<JAV9HgE5<P@Yhu`r|709akY<FZzfHEqP^1Hx^)v)
z1}!9#ov>=vDzWoIirqnraYv3E0cE3PbI>AON=k~bI5uzIEOuuQWN8;jbab@XX+b+d
z$m`aH^xL;@;qLB^IdkTSEd1=*vskxoomjj)c<`W@Jo3uP^Ip4lt?;LVgM&pzPW_WL
zLJODVYwPar(1kR4;uHssoq&D!?p?7ENp)x;R7zn;OHs`<>v%P>!jciSFhJ&aZp7Xw
z#(}>S;OHFoq)qe6Ff3|=77nSYd-v`MxDmX_jv#x1phb|A0_pbc+l%dN<Rg<GO+YQ*
zE=LQE1XP0byLaz|hfSV1dBg8#(i9t6BLsR{fb{qG7vO*W`nA~aO@$WtDBf1BT8a4S
z1~Fm61hJ!p78nWobi?@=q^S*hB9nfbc=F_luvcj8<qMmJNnQCYhO`vbOtVfe4;#4G
zx4`y5c^?>=zB3PAje#j&o2D)tb=3-dbPJvm!hLArP>Fuk)CWKK@oBT6lzwvbL+^?H
zIy4K(TjcYlY0=O#I1_)<J{s=+zt@`@qo`63nJCo{ja{j}l<G%!Op3o?i6O1rW6d<t
za)8DV04UXuDUNC4mRz*g+8&FB%Cma7`iBC%)_x#hXOOh)Tq)2f)el43ke^T^&S6L!
zAr_xnEfk=)*ZHl=#-Frr!28q%#N?k!@w@OGTnTf6tFyd&ud9XF)o>7sXVTSBLmm<<
zpjUw(w67`+`>_D=D;y=mwft43k(2Gjr?t44hXM>~^O$EIr3w_-p#5aluJ}S64z?Gc
z#4@H_yj6^#ow@k-8(U2EmFI1G#`MqUemMmg(qB${?%50#h|#`tWB!3W1o_p(@&H@C
zPa@_P0wLe$fim%fvmM~)V;tPgP~vJgWQKILn^GQ-+7+OW0Q^ClRVO_uK|k&O=^ok-
z(Kc(K{Sa+^OYOU1%J9=K8az$Yh!4>w+%AT%mo*mn^M`2FKChoEK8Ez?QkL6g1@tKJ
zOLiIPp_Fq;MIgU9EkgrZ3UqU^L<=`7`2WTRgF4#4$&MEY&G}+tNSpKQ^VnGdRzUR%
zFr-yKMI0b2zzUeN0t{($o_!uWE5Hh<UIB)*>ZgbUWCd6Ob5?*MZO*gLV`l|e0o5zO
zkXHQ^ae%A<D`3tFFr>|S_Id2A04tz+1sKw*pCS&B6<`I-S%Lom=#f@w*p@Dm00000
LNkvXXu0mjf<`Qc(

literal 0
HcmV?d00001

diff --git a/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/range/test/basic/range.e2e.ts-snapshots/range-ticks-ionic-md-ltr-light-Mobile-Safari-linux.png
new file mode 100644
index 0000000000000000000000000000000000000000..74a3f734d2ae576f6a5716e8865480672e152c60
GIT binary patch
literal 2082
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
M07*qoM6N<$g6#eE&j0`b

literal 0
HcmV?d00001