@angular2-material/slider - npm Package Compare versions

Comparing version 2.0.0-alpha.8-1 to 2.0.0-alpha.8-experimental1

_slider-theme.scss

+@import '../core/theming/palette';
+@import '../core/theming/theming';
+
+
+@mixin md-slider-theme($theme) {
+  $accent: map-get($theme, accent);
+
+  // TODO(iveysaur): Find an implementation to hide the track under a disabled thumb.
+  $md-slider-off-color: rgba(black, 0.26);
+  $md-slider-focused-color: rgba(black, 0.38);
+  $md-slider-disabled-color: rgba(black, 0.26);
+
+  .md-slider-track {
+    background-color: $md-slider-off-color;
+  }
+
+  .md-slider-track-fill {
+    background-color: md-color($accent);
+  }
+
+  .md-slider-thumb::after {
+    background-color: md-color($accent);
+    border-color: md-color($accent);
+  }
+
+  .md-slider-thumb-label {
+    background-color: md-color($accent);
+  }
+
+  .md-slider-thumb-label-text {
+    color: md-color($accent, default-contrast);
+  }
+}

package.json

 {
   "name": "@angular2-material/slider",
-  "version": "2.0.0-alpha.8-1",
+  "version": "2.0.0-alpha.8-experimental1",
   "description": "Angular 2 Material Slider",
@@ -25,4 +25,4 @@ "main": "./slider.umd.js",
   "peerDependencies": {
-    "@angular2-material/core": "2.0.0-alpha.8-1"
+    "@angular2-material/core": "2.0.0-alpha.8-experimental1"
   }
 }

slider.css

@@ -1,7 +0,1 @@
-/**
- * Uses a container height and an item height to center an item vertically within the container.
- */
-/**
- * Positions the thumb based on its width and height.
- */
 md-slider {
@@ -20,6 +14,2 @@ height: 48px;
 
-/**
- * Exists in order to pad the slider and keep everything positioned correctly.
- * Cannot be merged with the .md-slider-container.
- */
 .md-slider-wrapper {
@@ -31,6 +21,2 @@ width: 100%;
 
-/**
- * Holds the isActive and isSliding classes as well as helps with positioning the children.
- * Cannot be merged with .md-slider-wrapper.
- */
 .md-slider-container {
@@ -49,4 +35,3 @@ position: relative; }
   right: 0;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.26); }
+  height: 100%; }
 
@@ -56,4 +41,3 @@ .md-slider-track-fill {
   transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
-  transition-property: width, height;
-  background-color: #9c27b0; }
+  transition-property: width, height; }
 
@@ -97,5 +81,3 @@ .md-slider-tick-container, .md-slider-last-tick-container {
   border-style: solid;
-  transition: inherit;
-  background-color: #9c27b0;
-  border-color: #9c27b0; }
+  transition: inherit; }
 
@@ -114,4 +96,3 @@ .md-slider-thumb-label {
   transition: 300ms cubic-bezier(0.35, 0, 0.25, 1);
-  transition-property: transform, border-radius;
-  background-color: #9c27b0; }
+  transition-property: transform, border-radius; }
 
@@ -124,4 +105,3 @@ .md-slider-thumb-label-text {
   transform: rotate(-45deg);
-  transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1);
-  color: white; }
+  transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); }
 
@@ -128,0 +108,0 @@ .md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label {

slider.css.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"slider/slider.css","sources":["slider/slider.scss","core/style/_default-theme.scss","core/style/_theme-functions.scss","core/style/_palette.scss","core/style/_variables.scss"],"sourcesContent":["@import 'default-theme';\n@import '_variables';\n\n// This refers to the thickness of the slider. On a horizontal slider this is the height, on a\n// vertical slider this is the width.\n$md-slider-thickness: 48px !default;\n$md-slider-min-size: 128px !default;\n$md-slider-padding: 8px !default;\n\n$md-slider-track-height: 2px !default;\n$md-slider-thumb-size: 20px !default;\n\n$md-slider-thumb-default-scale: 0.7 !default;\n$md-slider-thumb-focus-scale: 1 !default;\n\n// TODO(iveysaur): Find an implementation to hide the track under a disabled thumb.\n$md-slider-off-color: rgba(black, 0.26);\n$md-slider-focused-color: rgba(black, 0.38);\n$md-slider-disabled-color: rgba(black, 0.26);\n\n$md-slider-thumb-arrow-height: 16px !default;\n$md-slider-thumb-arrow-width: 28px !default;\n\n$md-slider-thumb-label-size: 28px !default;\n// The thumb has to be moved down so that it appears right over the slider track when visible and\n// on the slider track when not.\n$md-slider-thumb-label-top: ($md-slider-thickness / 2) -\n    ($md-slider-thumb-default-scale * $md-slider-thumb-size / 2) - $md-slider-thumb-label-size -\n    $md-slider-thumb-arrow-height + 10px !default;\n\n/**\n * Uses a container height and an item height to center an item vertically within the container.\n */\n@function center-vertically($containerHeight, $itemHeight) {\n  @return ($containerHeight / 2) - ($itemHeight / 2);\n}\n\n/**\n * Positions the thumb based on its width and height.\n */\n@mixin slider-thumb-position($width: $md-slider-thumb-size, $height: $md-slider-thumb-size) {\n  position: absolute;\n  top: center-vertically($md-slider-thickness, $height);\n  // This makes it so that the center of the thumb aligns with where the click was.\n  // This is not affected by the movement of the thumb.\n  left: (-$width / 2);\n  width: $width;\n  height: $height;\n  border-radius: max($width, $height);\n}\n\nmd-slider {\n  height: $md-slider-thickness;\n  min-width: $md-slider-min-size;\n  position: relative;\n  padding: 0;\n  display: inline-block;\n  outline: none;\n  vertical-align: middle;\n}\n\nmd-slider *,\nmd-slider *::after {\n  box-sizing: border-box;\n}\n\n/**\n * Exists in order to pad the slider and keep everything positioned correctly.\n * Cannot be merged with the .md-slider-container.\n */\n.md-slider-wrapper {\n  width: 100%;\n  height: 100%;\n  padding-left: $md-slider-padding;\n  padding-right: $md-slider-padding;\n}\n\n/**\n * Holds the isActive and isSliding classes as well as helps with positioning the children.\n * Cannot be merged with .md-slider-wrapper.\n */\n.md-slider-container {\n  position: relative;\n}\n\n.md-slider-track-container {\n  width: 100%;\n  position: absolute;\n  top: center-vertically($md-slider-thickness, $md-slider-track-height);\n  height: $md-slider-track-height;\n}\n\n.md-slider-track {\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 100%;\n  background-color: $md-slider-off-color;\n}\n\n.md-slider-track-fill {\n  transition-duration: $swift-ease-out-duration;\n  transition-timing-function: $swift-ease-out-timing-function;\n  transition-property: width, height;\n  background-color: md-color($md-accent);\n}\n\n.md-slider-tick-container, .md-slider-last-tick-container {\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 100%;\n}\n\n.md-slider-thumb-container {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translate3d(-50%, -50%, 0);\n  transition-duration: $swift-ease-out-duration;\n  transition-timing-function: $swift-ease-out-timing-function;\n  transition-property: left, bottom;\n}\n\n.md-slider-thumb-position {\n  transition: transform $swift-ease-out-duration $swift-ease-out-timing-function;\n}\n\n.md-slider-thumb {\n  z-index: 1;\n\n  @include slider-thumb-position($md-slider-thumb-size, $md-slider-thumb-size);\n  transform: scale($md-slider-thumb-default-scale);\n  transition: transform $swift-ease-out-duration $swift-ease-out-timing-function;\n}\n\n.md-slider-thumb::after {\n  content: '';\n  position: absolute;\n  width: $md-slider-thumb-size;\n  height: $md-slider-thumb-size;\n  border-radius: max($md-slider-thumb-size, $md-slider-thumb-size);\n  border-width: 3px;\n  border-style: solid;\n  transition: inherit;\n  background-color: md-color($md-accent);\n  border-color: md-color($md-accent);\n}\n\n.md-slider-thumb-label {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  position: absolute;\n  left: -($md-slider-thumb-label-size / 2);\n  top: $md-slider-thumb-label-top;\n  width: $md-slider-thumb-label-size;\n  height: $md-slider-thumb-label-size;\n  border-radius: 50%;\n\n  transform: scale(0.4) translate3d(0, (-$md-slider-thumb-label-top + 10) / 0.4, 0) rotate(45deg);\n  transition: 300ms $swift-ease-in-out-timing-function;\n  transition-property: transform, border-radius;\n\n  background-color: md-color($md-accent);\n}\n\n.md-slider-thumb-label-text {\n  z-index: 1;\n  font-size: 12px;\n  font-weight: bold;\n  opacity: 0;\n  transform: rotate(-45deg);\n  transition: opacity 300ms $swift-ease-in-out-timing-function;\n  color: white;\n}\n\n.md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label {\n  display: none;\n}\n\n.md-slider-active.md-slider-thumb-label-showing .md-slider-thumb {\n  transform: scale(0);\n}\n\n.md-slider-sliding .md-slider-thumb-position,\n.md-slider-sliding .md-slider-track-fill {\n  transition: none;\n  cursor: default;\n}\n\n.md-slider-active .md-slider-thumb {\n  transform: scale($md-slider-thumb-focus-scale);\n}\n\n.md-slider-active .md-slider-thumb-label {\n  border-radius: 50% 50% 0;\n  transform: rotate(45deg);\n}\n\n.md-slider-active .md-slider-thumb-label-text {\n  opacity: 1;\n}\n","@import 'theme-functions';\n@import 'palette';\n\n\n// Person creating a theme writes variables like this:\n$md-is-dark-theme: false;\n\n\n$md-primary: md-palette($md-teal, 500, 100, 700, $md-contrast-palettes);\n$md-accent: md-palette($md-purple, 500, 300, 800, $md-contrast-palettes);\n$md-warn: md-palette($md-red, 500, 300, 900, $md-contrast-palettes);\n$md-foreground: if($md-is-dark-theme, $md-dark-theme-foreground, $md-light-theme-foreground);\n$md-background: if($md-is-dark-theme, $md-dark-theme-background, $md-light-theme-background);\n","// ** Two main functions for users **\n// md-palette: used for defining your theme in terms of Material hues.\n// md-color: apply colors to components from the palette. Consumes the output of md-palette\n\n// Implement the rem unit with SCSS so we don't have to actually set a font-size on\n// the user's body element.\n@function rem($multiplier) {\n  $font-size: 10px;\n  @return $multiplier * $font-size;\n}\n\n// For a given hue in a palette, return the contrast color from the map of contrast palettes.\n@function md-contrast($color-map, $hue, $contrast-color-map) {\n  @return map-get(map-get($contrast-color-map, $color-map), $hue);\n}\n\n\n// Creates a map of hues to colors for a theme.\n// $color-map\n// $primary\n// $lighter\n// $darker\n@function md-palette($color-map, $primary, $lighter, $darker, $contrast-color-map) {\n  $result: map_merge($color-map, (\n    default: map-get($color-map, $primary),\n    lighter: map-get($color-map, $lighter),\n    darker: map-get($color-map, $darker),\n\n    default-contrast: md-contrast($color-map, $primary, $contrast-color-map),\n    lighter-contrast: md-contrast($color-map, $lighter, $contrast-color-map),\n    darker-contrast: md-contrast($color-map, $darker, $contrast-color-map)\n  ));\n\n  // For each hue in the palette, add a \"-contrast\" color to the map.\n  @each $hue, $color in $color-map {\n    $result: map_merge($result, (\n      '#{$hue}-contrast': md-contrast($color-map, $hue, $contrast-color-map)\n    ));\n  }\n\n  @return $result;\n}\n\n// Gets a color for a material design component.\n// $color-map: a map of {key: color}.\n// $hue-key: key used to lookup the color in $colorMap. Defaults to 'default'\n//     If $hue-key is a number between 0 and 1, it will be treated as $opacity.\n// $opacity: the opacity to apply to the color.\n@function md-color($color-map, $hue-key: default, $opacity: 1) {\n  // If hueKey is a number between zero and one, then it actually contains an\n  // opacity value, so recall this function with the default hue and that given opacity.\n  @if type-of($hue-key) == number and $hue-key >= 0 and $hue-key <= 1 {\n    @return md-color($color-map, default, $hue-key);\n  }\n\n  $color: map-get($color-map, $hue-key);\n  $opacity: if(opacity($color) < 1, opacity($color), $opacity);\n\n  @return rgba($color, $opacity);\n}\n\n\n","// Color palettes from the Material Design spec.\n// See https://www.google.com/design/spec/style/color.html\n\n$md-red: (\n  50: #ffebee,\n  100: #ffcdd2,\n  200: #ef9a9a,\n  300: #e57373,\n  400: #ef5350,\n  500: #f44336,\n  600: #e53935,\n  700: #d32f2f,\n  800: #c62828,\n  900: #b71c1c,\n  A100: #ff8a80,\n  A200: #ff5252,\n  A400: #ff1744,\n  A700: #d50000,\n);\n\n$md-pink: (\n  50: #fce4ec,\n  100: #f8bbd0,\n  200: #f48fb1,\n  300: #f06292,\n  400: #ec407a,\n  500: #e91e63,\n  600: #d81b60,\n  700: #c2185b,\n  800: #ad1457,\n  900: #880e4f,\n  A100: #ff80ab,\n  A200: #ff4081,\n  A400: #f50057,\n  A700: #c51162,\n);\n\n$md-purple: (\n  50: #f3e5f5,\n  100: #e1bee7,\n  200: #ce93d8,\n  300: #ba68c8,\n  400: #ab47bc,\n  500: #9c27b0,\n  600: #8e24aa,\n  700: #7b1fa2,\n  800: #6a1b9a,\n  900: #4a148c,\n  A100: #ea80fc,\n  A200: #e040fb,\n  A400: #d500f9,\n  A700: #aa00ff,\n);\n\n$md-deep-purple: (\n  50: #ede7f6,\n  100: #d1c4e9,\n  200: #b39ddb,\n  300: #9575cd,\n  400: #7e57c2,\n  500: #673ab7,\n  600: #5e35b1,\n  700: #512da8,\n  800: #4527a0,\n  900: #311b92,\n  A100: #b388ff,\n  A200: #7c4dff,\n  A400: #651fff,\n  A700: #6200ea,\n);\n\n$md-indigo: (\n  50: #e8eaf6,\n  100: #c5cae9,\n  200: #9fa8da,\n  300: #7986cb,\n  400: #5c6bc0,\n  500: #3f51b5,\n  600: #3949ab,\n  700: #303f9f,\n  800: #283593,\n  900: #1a237e,\n  A100: #8c9eff,\n  A200: #536dfe,\n  A400: #3d5afe,\n  A700: #304ffe,\n);\n\n$md-blue: (\n  50: #e3f2fd,\n  100: #bbdefb,\n  200: #90caf9,\n  300: #64b5f6,\n  400: #42a5f5,\n  500: #2196f3,\n  600: #1e88e5,\n  700: #1976d2,\n  800: #1565c0,\n  900: #0d47a1,\n  A100: #82b1ff,\n  A200: #448aff,\n  A400: #2979ff,\n  A700: #2962ff,\n);\n\n$md-light-blue: (\n  50: #e1f5fe,\n  100: #b3e5fc,\n  200: #81d4fa,\n  300: #4fc3f7,\n  400: #29b6f6,\n  500: #03a9f4,\n  600: #039be5,\n  700: #0288d1,\n  800: #0277bd,\n  900: #01579b,\n  A100: #80d8ff,\n  A200: #40c4ff,\n  A400: #00b0ff,\n  A700: #0091ea,\n);\n\n$md-cyan: (\n  50: #e0f7fa,\n  100: #b2ebf2,\n  200: #80deea,\n  300: #4dd0e1,\n  400: #26c6da,\n  500: #00bcd4,\n  600: #00acc1,\n  700: #0097a7,\n  800: #00838f,\n  900: #006064,\n  A100: #84ffff,\n  A200: #18ffff,\n  A400: #00e5ff,\n  A700: #00b8d4,\n);\n\n$md-teal: (\n  50: #e0f2f1,\n  100: #b2dfdb,\n  200: #80cbc4,\n  300: #4db6ac,\n  400: #26a69a,\n  500: #009688,\n  600: #00897b,\n  700: #00796b,\n  800: #00695c,\n  900: #004d40,\n  A100: #a7ffeb,\n  A200: #64ffda,\n  A400: #1de9b6,\n  A700: #00bfa5,\n);\n\n$md-green: (\n  50: #e8f5e9,\n  100: #c8e6c9,\n  200: #a5d6a7,\n  300: #81c784,\n  400: #66bb6a,\n  500: #4caf50,\n  600: #43a047,\n  700: #388e3c,\n  800: #2e7d32,\n  900: #1b5e20,\n  A100: #b9f6ca,\n  A200: #69f0ae,\n  A400: #00e676,\n  A700: #00c853,\n);\n\n$md-light-green: (\n  50: #f1f8e9,\n  100: #dcedc8,\n  200: #c5e1a5,\n  300: #aed581,\n  400: #9ccc65,\n  500: #8bc34a,\n  600: #7cb342,\n  700: #689f38,\n  800: #558b2f,\n  900: #33691e,\n  A100: #ccff90,\n  A200: #b2ff59,\n  A400: #76ff03,\n  A700: #64dd17,\n);\n\n$md-lime: (\n  50: #f9fbe7,\n  100: #f0f4c3,\n  200: #e6ee9c,\n  300: #dce775,\n  400: #d4e157,\n  500: #cddc39,\n  600: #c0ca33,\n  700: #afb42b,\n  800: #9e9d24,\n  900: #827717,\n  A100: #f4ff81,\n  A200: #eeff41,\n  A400: #c6ff00,\n  A700: #aeea00,\n);\n\n$md-yellow: (\n  50: #fffde7,\n  100: #fff9c4,\n  200: #fff59d,\n  300: #fff176,\n  400: #ffee58,\n  500: #ffeb3b,\n  600: #fdd835,\n  700: #fbc02d,\n  800: #f9a825,\n  900: #f57f17,\n  A100: #ffff8d,\n  A200: #ffff00,\n  A400: #ffea00,\n  A700: #ffd600,\n);\n\n$md-amber: (\n  50: #fff8e1,\n  100: #ffecb3,\n  200: #ffe082,\n  300: #ffd54f,\n  400: #ffca28,\n  500: #ffc107,\n  600: #ffb300,\n  700: #ffa000,\n  800: #ff8f00,\n  900: #ff6f00,\n  A100: #ffe57f,\n  A200: #ffd740,\n  A400: #ffc400,\n  A700: #ffab00,\n);\n\n$md-orange: (\n  50: #fff3e0,\n  100: #ffe0b2,\n  200: #ffcc80,\n  300: #ffb74d,\n  400: #ffa726,\n  500: #ff9800,\n  600: #fb8c00,\n  700: #f57c00,\n  800: #ef6c00,\n  900: #e65100,\n  A100: #ffd180,\n  A200: #ffab40,\n  A400: #ff9100,\n  A700: #ff6d00,\n);\n\n$md-deep-orange: (\n  50: #fbe9e7,\n  100: #ffccbc,\n  200: #ffab91,\n  300: #ff8a65,\n  400: #ff7043,\n  500: #ff5722,\n  600: #f4511e,\n  700: #e64a19,\n  800: #d84315,\n  900: #bf360c,\n  A100: #ff9e80,\n  A200: #ff6e40,\n  A400: #ff3d00,\n  A700: #dd2c00,\n);\n\n$md-brown: (\n  50: #efebe9,\n  100: #d7ccc8,\n  200: #bcaaa4,\n  300: #a1887f,\n  400: #8d6e63,\n  500: #795548,\n  600: #6d4c41,\n  700: #5d4037,\n  800: #4e342e,\n  900: #3e2723,\n  A100: #d7ccc8,\n  A200: #bcaaa4,\n  A400: #8d6e63,\n  A700: #5d4037,\n);\n\n$md-grey: (\n  0: #ffffff,\n  50: #fafafa,\n  100: #f5f5f5,\n  200: #eeeeee,\n  300: #e0e0e0,\n  400: #bdbdbd,\n  500: #9e9e9e,\n  600: #757575,\n  700: #616161,\n  800: #424242,\n  900: #212121,\n  1000: #000000,\n  A100: #ffffff,\n  A200: #eeeeee,\n  A400: #bdbdbd,\n  A700: #616161,\n);\n\n$md-blue-grey: (\n  50: #eceff1,\n  100: #cfd8dc,\n  200: #b0bec5,\n  300: #90a4ae,\n  400: #78909c,\n  500: #607d8b,\n  600: #546e7a,\n  700: #455a64,\n  800: #37474f,\n  900: #263238,\n  A100: #cfd8dc,\n  A200: #b0bec5,\n  A400: #78909c,\n  A700: #455a64,\n);\n\n\n// Background palette for light themes.\n$md-light-theme-background: (\n  status-bar: map_get($md-grey, 300),\n  app-bar:    map_get($md-grey, 100),\n  background: map_get($md-grey, 50),\n  hover:      rgba(black, 0.04), // TODO(kara): check style with Material Design UX\n  card:       white,\n  dialog:     white,\n  disabled-button:   rgba(black, 0.12)\n);\n\n// Background palette for dark themes.\n$md-dark-theme-background: (\n  status-bar: black,\n  app-bar:    map_get($md-grey, 900),\n  background: #303030,\n  hover:      rgba(white, 0.04), // TODO(kara): check style with Material Design UX\n  card:       map_get($md-grey, 800),\n  dialog:     map_get($md-grey, 800),\n  disabled-button: rgba(white, 0.12)\n);\n\n// Foreground palette for light themes.\n$md-light-theme-foreground: (\n  base:            black,\n  divider:         rgba(black, 0.12),\n  dividers:        rgba(black, 0.12),\n  disabled:        rgba(black, 0.38),\n  disabled-button: rgba(black, 0.38),\n  disabled-text:   rgba(black, 0.38),\n  hint-text:       rgba(black, 0.38),\n  secondary-text:  rgba(black, 0.54),\n  icon:            rgba(black, 0.54),\n  icons:           rgba(black, 0.54),\n  text:            rgba(black, 0.87)\n);\n\n// Foreground palette for dark themes.\n$md-dark-theme-foreground: (\n  base:            white,\n  divider:         rgba(white, 0.12),\n  dividers:        rgba(white, 0.12),\n  disabled:        rgba(white, 0.3),\n  disabled-button: rgba(white, 0.3),\n  disabled-text:   rgba(white, 0.3),\n  hint-text:       rgba(white, 0.3),\n  secondary-text:  rgba(white, 0.7),\n  icon:            white,\n  icons:           white,\n  text:            white\n);\n\n\n\n// TODO(jelbourn): Do we actually need these any more? Updates to the spec about how foreground\n// colors are used may have made this obsolete.\n\n// Contrast colors. These are hard-coded because it is too difficult (probably impossible) to\n// calculate them. These contrast colors are pulled from the public Material Design spec swatches.\n// While the contrast colors in the spec are not perscriptive, we will use them for convenience.\n$black-87-opacity: rgba(black, 0.870588);\n$white-87-opacity: rgba(white, 0.870588);\n\n$md-contrast-palettes: (\n  $md-red: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\n  ),\n  $md-pink: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\n  ),\n  $md-purple: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\n  ),\n  $md-deep-purple: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: $white-87-opacity,\n    A700: $white-87-opacity,\n  ),\n  $md-indigo: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: $white-87-opacity,\n  ),\n  $md-blue: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\n  ),\n  $md-light-blue: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: white,\n  ),\n  $md-cyan: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-teal: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-green: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-light-green: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-lime: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-yellow: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-amber: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\n  ),\n  $md-orange: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: black,\n  ),\n  $md-deep-orange: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: white,\n  ),\n  $md-brown: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  ),\n  $md-grey: (\n    0: $black-87-opacity,\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    1000: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $white-87-opacity,\n  ),\n  $md-blue-grey: (\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: white,\n    500: white,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  ),\n);\n","@import 'theme-functions';\n\n\n// Typography\n$md-body-font-size-base: rem(1.4) !default;\n$md-font-family: Roboto, 'Helvetica Neue', sans-serif !default;\n\n// Media queries\n$md-xsmall: 'max-width: 600px';\n\n// TODO: Revisit all z-indices before beta\n// z-index master list\n$z-index-fab: 20 !default;\n$z-index-drawer: 100 !default;\n$z-index-overlay: 1000 !default;\n\n// Global constants\n$pi: 3.14159265;\n\n// Padding between input toggles and their labels\n$md-toggle-padding: 8px !default;\n// Width and height of input toggles\n$md-toggle-size: 20px !default;\n\n// Easing Curves\n// TODO(jelbourn): all of these need to be revisited\n\n// The default animation curves used by material design.\n$md-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;\n$md-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;\n$md-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;\n\n$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;\n\n$swift-ease-out-duration: 400ms !default;\n$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;\n\n$swift-ease-in-duration: 300ms !default;\n$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;\n$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;\n\n$swift-ease-in-out-duration: 500ms !default;\n$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;\n$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;\n\n$swift-linear-duration: 80ms !default;\n$swift-linear-timing-function: linear !default;\n$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;\n"],"mappings":"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","names":[],"sourceRoot":"/source/"}
+{"version":3,"file":"slider/slider.css","sources":["slider/slider.scss","core/style/_variables.scss","core/typography/_typography.scss"],"sourcesContent":["@import '../core/style/variables';\n\n\n// This refers to the thickness of the slider. On a horizontal slider this is the height, on a\n// vertical slider this is the width.\n$md-slider-thickness: 48px !default;\n$md-slider-min-size: 128px !default;\n$md-slider-padding: 8px !default;\n\n$md-slider-track-height: 2px !default;\n$md-slider-thumb-size: 20px !default;\n\n$md-slider-thumb-default-scale: 0.7 !default;\n$md-slider-thumb-focus-scale: 1 !default;\n\n$md-slider-thumb-arrow-height: 16px !default;\n$md-slider-thumb-arrow-width: 28px !default;\n\n$md-slider-thumb-label-size: 28px !default;\n// The thumb has to be moved down so that it appears right over the slider track when visible and\n// on the slider track when not.\n$md-slider-thumb-label-top: ($md-slider-thickness / 2) -\n    ($md-slider-thumb-default-scale * $md-slider-thumb-size / 2) - $md-slider-thumb-label-size -\n    $md-slider-thumb-arrow-height + 10px !default;\n\n// Uses a container height and an item height to center an item vertically within the container.\n@function center-vertically($containerHeight, $itemHeight) {\n  @return ($containerHeight / 2) - ($itemHeight / 2);\n}\n\n// Positions the thumb based on its width and height.\n@mixin slider-thumb-position($width: $md-slider-thumb-size, $height: $md-slider-thumb-size) {\n  position: absolute;\n  top: center-vertically($md-slider-thickness, $height);\n  // This makes it so that the center of the thumb aligns with where the click was.\n  // This is not affected by the movement of the thumb.\n  left: (-$width / 2);\n  width: $width;\n  height: $height;\n  border-radius: max($width, $height);\n}\n\nmd-slider {\n  height: $md-slider-thickness;\n  min-width: $md-slider-min-size;\n  position: relative;\n  padding: 0;\n  display: inline-block;\n  outline: none;\n  vertical-align: middle;\n}\n\nmd-slider *,\nmd-slider *::after {\n  box-sizing: border-box;\n}\n\n// Exists in order to pad the slider and keep everything positioned correctly.\n// Cannot be merged with the .md-slider-container.\n.md-slider-wrapper {\n  width: 100%;\n  height: 100%;\n  padding-left: $md-slider-padding;\n  padding-right: $md-slider-padding;\n}\n\n\n// Holds the isActive and isSliding classes as well as helps with positioning the children.\n// Cannot be merged with .md-slider-wrapper.\n.md-slider-container {\n  position: relative;\n}\n\n.md-slider-track-container {\n  width: 100%;\n  position: absolute;\n  top: center-vertically($md-slider-thickness, $md-slider-track-height);\n  height: $md-slider-track-height;\n}\n\n.md-slider-track {\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 100%;\n}\n\n.md-slider-track-fill {\n  transition-duration: $swift-ease-out-duration;\n  transition-timing-function: $swift-ease-out-timing-function;\n  transition-property: width, height;\n}\n\n.md-slider-tick-container, .md-slider-last-tick-container {\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 100%;\n}\n\n.md-slider-thumb-container {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translate3d(-50%, -50%, 0);\n  transition-duration: $swift-ease-out-duration;\n  transition-timing-function: $swift-ease-out-timing-function;\n  transition-property: left, bottom;\n}\n\n.md-slider-thumb-position {\n  transition: transform $swift-ease-out-duration $swift-ease-out-timing-function;\n}\n\n.md-slider-thumb {\n  z-index: 1;\n\n  @include slider-thumb-position($md-slider-thumb-size, $md-slider-thumb-size);\n  transform: scale($md-slider-thumb-default-scale);\n  transition: transform $swift-ease-out-duration $swift-ease-out-timing-function;\n}\n\n.md-slider-thumb::after {\n  content: '';\n  position: absolute;\n  width: $md-slider-thumb-size;\n  height: $md-slider-thumb-size;\n  border-radius: max($md-slider-thumb-size, $md-slider-thumb-size);\n  // Separate border properties because, if you combine them into \"border\", it defaults to 'black'.\n  border-width: 3px;\n  border-style: solid;\n  transition: inherit;\n}\n\n.md-slider-thumb-label {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  position: absolute;\n  left: -($md-slider-thumb-label-size / 2);\n  top: $md-slider-thumb-label-top;\n  width: $md-slider-thumb-label-size;\n  height: $md-slider-thumb-label-size;\n  border-radius: 50%;\n\n  transform: scale(0.4) translate3d(0, (-$md-slider-thumb-label-top + 10) / 0.4, 0) rotate(45deg);\n  transition: 300ms $swift-ease-in-out-timing-function;\n  transition-property: transform, border-radius;\n}\n\n.md-slider-thumb-label-text {\n  z-index: 1;\n  font-size: 12px;\n  font-weight: bold;\n  opacity: 0;\n  transform: rotate(-45deg);\n  transition: opacity 300ms $swift-ease-in-out-timing-function;\n}\n\n.md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label {\n  display: none;\n}\n\n.md-slider-active.md-slider-thumb-label-showing .md-slider-thumb {\n  transform: scale(0);\n}\n\n.md-slider-sliding .md-slider-thumb-position,\n.md-slider-sliding .md-slider-track-fill {\n  transition: none;\n  cursor: default;\n}\n\n.md-slider-active .md-slider-thumb {\n  transform: scale($md-slider-thumb-focus-scale);\n}\n\n.md-slider-active .md-slider-thumb-label {\n  border-radius: 50% 50% 0;\n  transform: rotate(45deg);\n}\n\n.md-slider-active .md-slider-thumb-label-text {\n  opacity: 1;\n}\n","@import '../typography/typography';\n\n\n// Typography\n$md-body-font-size-base: rem(1.4) !default;\n$md-font-family: Roboto, 'Helvetica Neue', sans-serif !default;\n\n// Media queries\n$md-xsmall: 'max-width: 600px';\n\n// TODO: Revisit all z-indices before beta\n// z-index master list\n\n$z-index-fab: 20 !default;\n$z-index-drawer: 100 !default;\n\n// Overlay z indices.\n$md-z-index-overlay: 1000;\n$md-z-index-overlay-container: 1;\n$md-z-index-overlay-backdrop: 1;\n\n\n// Global constants\n$pi: 3.14159265;\n\n// Padding between input toggles and their labels\n$md-toggle-padding: 8px !default;\n// Width and height of input toggles\n$md-toggle-size: 20px !default;\n\n// Easing Curves\n// TODO(jelbourn): all of these need to be revisited\n\n// The default animation curves used by material design.\n$md-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;\n$md-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;\n$md-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;\n\n$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;\n\n$swift-ease-out-duration: 400ms !default;\n$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;\n\n$swift-ease-in-duration: 300ms !default;\n$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;\n$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;\n\n$swift-ease-in-out-duration: 500ms !default;\n$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;\n$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;\n\n$swift-linear-duration: 80ms !default;\n$swift-linear-timing-function: linear !default;\n$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;\n","// Implement the rem unit with SCSS so we don't have to actually set a font-size on\n// the user's body element.\n@function rem($multiplier) {\n  $font-size: 10px;\n  @return $multiplier * $font-size;\n}\n"],"mappings":"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","names":[],"sourceRoot":"/source/"}

slider.d.ts

@@ -31,3 +31,3 @@ import { ModuleWithProviders, ElementRef, AfterContentInit } from '@angular/core';
      */
-    private _tickInterval;
+    _tickInterval: 'auto' | number;
     /**
@@ -34,0 +34,0 @@ * Whether or not the thumb is sliding.

slider.js

@@ -344,3 +344,3 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
             template: "<div class=\"md-slider-wrapper\"> <div class=\"md-slider-container\" [class.md-slider-sliding]=\"isSliding\" [class.md-slider-active]=\"isActive\" [class.md-slider-thumb-label-showing]=\"thumbLabel\"> <div class=\"md-slider-track-container\"> <div class=\"md-slider-track\"></div> <div class=\"md-slider-track md-slider-track-fill\"></div> <div class=\"md-slider-tick-container\"></div> <div class=\"md-slider-last-tick-container\"></div> </div> <div class=\"md-slider-thumb-container\"> <div class=\"md-slider-thumb-position\"> <div class=\"md-slider-thumb\"></div> <div class=\"md-slider-thumb-label\"> <span class=\"md-slider-thumb-label-text\">{{value}}</span> </div> </div> </div> </div> </div> ",
-            styles: ["/** * Uses a container height and an item height to center an item vertically within the container. */ /** * Positions the thumb based on its width and height. */ md-slider { height: 48px; min-width: 128px; position: relative; padding: 0; display: inline-block; outline: none; vertical-align: middle; } md-slider *, md-slider *::after { box-sizing: border-box; } /** * Exists in order to pad the slider and keep everything positioned correctly. * Cannot be merged with the .md-slider-container. */ .md-slider-wrapper { width: 100%; height: 100%; padding-left: 8px; padding-right: 8px; } /** * Holds the isActive and isSliding classes as well as helps with positioning the children. * Cannot be merged with .md-slider-wrapper. */ .md-slider-container { position: relative; } .md-slider-track-container { width: 100%; position: absolute; top: 23px; height: 2px; } .md-slider-track { position: absolute; left: 0; right: 0; height: 100%; background-color: rgba(0, 0, 0, 0.26); } .md-slider-track-fill { transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: width, height; background-color: #9c27b0; } .md-slider-tick-container, .md-slider-last-tick-container { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-thumb-container { position: absolute; left: 0; top: 50%; transform: translate3d(-50%, -50%, 0); transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: left, bottom; } .md-slider-thumb-position { transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb { z-index: 1; position: absolute; top: 14px; left: -10px; width: 20px; height: 20px; border-radius: 20px; transform: scale(0.7); transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb::after { content: ''; position: absolute; width: 20px; height: 20px; border-radius: 20px; border-width: 3px; border-style: solid; transition: inherit; background-color: #9c27b0; border-color: #9c27b0; } .md-slider-thumb-label { display: flex; align-items: center; justify-content: center; position: absolute; left: -14px; top: -17px; width: 28px; height: 28px; border-radius: 50%; transform: scale(0.4) translate3d(0, 67.5px, 0) rotate(45deg); transition: 300ms cubic-bezier(0.35, 0, 0.25, 1); transition-property: transform, border-radius; background-color: #9c27b0; } .md-slider-thumb-label-text { z-index: 1; font-size: 12px; font-weight: bold; opacity: 0; transform: rotate(-45deg); transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); color: white; } .md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label { display: none; } .md-slider-active.md-slider-thumb-label-showing .md-slider-thumb { transform: scale(0); } .md-slider-sliding .md-slider-thumb-position, .md-slider-sliding .md-slider-track-fill { transition: none; cursor: default; } .md-slider-active .md-slider-thumb { transform: scale(1); } .md-slider-active .md-slider-thumb-label { border-radius: 50% 50% 0; transform: rotate(45deg); } .md-slider-active .md-slider-thumb-label-text { opacity: 1; } /*# sourceMappingURL=slider.css.map */ "],
+            styles: ["md-slider { height: 48px; min-width: 128px; position: relative; padding: 0; display: inline-block; outline: none; vertical-align: middle; } md-slider *, md-slider *::after { box-sizing: border-box; } .md-slider-wrapper { width: 100%; height: 100%; padding-left: 8px; padding-right: 8px; } .md-slider-container { position: relative; } .md-slider-track-container { width: 100%; position: absolute; top: 23px; height: 2px; } .md-slider-track { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-track-fill { transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: width, height; } .md-slider-tick-container, .md-slider-last-tick-container { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-thumb-container { position: absolute; left: 0; top: 50%; transform: translate3d(-50%, -50%, 0); transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: left, bottom; } .md-slider-thumb-position { transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb { z-index: 1; position: absolute; top: 14px; left: -10px; width: 20px; height: 20px; border-radius: 20px; transform: scale(0.7); transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb::after { content: ''; position: absolute; width: 20px; height: 20px; border-radius: 20px; border-width: 3px; border-style: solid; transition: inherit; } .md-slider-thumb-label { display: flex; align-items: center; justify-content: center; position: absolute; left: -14px; top: -17px; width: 28px; height: 28px; border-radius: 50%; transform: scale(0.4) translate3d(0, 67.5px, 0) rotate(45deg); transition: 300ms cubic-bezier(0.35, 0, 0.25, 1); transition-property: transform, border-radius; } .md-slider-thumb-label-text { z-index: 1; font-size: 12px; font-weight: bold; opacity: 0; transform: rotate(-45deg); transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); } .md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label { display: none; } .md-slider-active.md-slider-thumb-label-showing .md-slider-thumb { transform: scale(0); } .md-slider-sliding .md-slider-thumb-position, .md-slider-sliding .md-slider-track-fill { transition: none; cursor: default; } .md-slider-active .md-slider-thumb { transform: scale(1); } .md-slider-active .md-slider-thumb-label { border-radius: 50% 50% 0; transform: rotate(45deg); } .md-slider-active .md-slider-thumb-label-text { opacity: 1; } /*# sourceMappingURL=slider.css.map */ "],
             encapsulation: ViewEncapsulation.None,
@@ -347,0 +347,0 @@ }),

slider.js.map

@@ -1,1 +0,1 @@
-{"version":3,"sources":["slider/slider.ts"],"names":[],"mappings":"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","file":"slider/slider.js","sourcesContent":["import {\n  NgModule,\n  ModuleWithProviders,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  ViewEncapsulation,\n  AfterContentInit,\n  forwardRef,\n} from '@angular/core';\nimport {\n  NG_VALUE_ACCESSOR,\n  ControlValueAccessor,\n  FormsModule,\n} from '@angular/forms';\nimport {HAMMER_GESTURE_CONFIG} from '@angular/platform-browser';\nimport {BooleanFieldValue, MdGestureConfig, applyCssTransform} from '@angular2-material/core';\nimport {Input as HammerInput} from 'hammerjs';\n\n/**\n * Visually, a 30px separation between tick marks looks best. This is very subjective but it is\n * the default separation we chose.\n */\nconst MIN_AUTO_TICK_SEPARATION = 30;\n\n/**\n * Provider Expression that allows md-slider to register as a ControlValueAccessor.\n * This allows it to support [(ngModel)] and [formControl].\n */\nexport const MD_SLIDER_VALUE_ACCESSOR: any = {\n  provide: NG_VALUE_ACCESSOR,\n  useExisting: forwardRef(() => MdSlider),\n  multi: true\n};\n\n@Component({\n  moduleId: module.id,\n  selector: 'md-slider',\n  providers: [MD_SLIDER_VALUE_ACCESSOR],\n  host: {\n    'tabindex': '0',\n    '(click)': 'onClick($event)',\n    '(slide)': 'onSlide($event)',\n    '(slidestart)': 'onSlideStart($event)',\n    '(slideend)': 'onSlideEnd()',\n    '(window:resize)': 'onResize()',\n    '(blur)': 'onBlur()',\n  },\n  templateUrl: 'slider.html',\n  styleUrls: ['slider.css'],\n  encapsulation: ViewEncapsulation.None,\n})\nexport class MdSlider implements AfterContentInit, ControlValueAccessor {\n  /** A renderer to handle updating the slider's thumb and fill track. */\n  private _renderer: SliderRenderer = null;\n\n  /** The dimensions of the slider. */\n  private _sliderDimensions: ClientRect = null;\n\n  @Input()\n  @BooleanFieldValue()\n  @HostBinding('class.md-slider-disabled')\n  @HostBinding('attr.aria-disabled')\n  disabled: boolean = false;\n\n  /** Whether or not to show the thumb label. */\n  @Input('thumb-label')\n  @BooleanFieldValue()\n  thumbLabel: boolean = false;\n\n  /** The miniumum value that the slider can have. */\n  private _min: number = 0;\n\n  /** The maximum value that the slider can have. */\n  private _max: number = 100;\n\n  /** The percentage of the slider that coincides with the value. */\n  private _percent: number = 0;\n\n  private _controlValueAccessorChangeFn: (value: any) => void = (value) => {};\n\n  /** onTouch function registered via registerOnTouch (ControlValueAccessor). */\n  onTouched: () => any = () => {};\n\n  /** The values at which the thumb will snap. */\n  @Input() step: number = 1;\n\n  /**\n   * How often to show ticks. Relative to the step so that a tick always appears on a step.\n   * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).\n   */\n  @Input('tick-interval') private _tickInterval: 'auto' | number;\n\n  /**\n   * Whether or not the thumb is sliding.\n   * Used to determine if there should be a transition for the thumb and fill track.\n   * TODO: internal\n   */\n  isSliding: boolean = false;\n\n  /**\n   * Whether or not the slider is active (clicked or sliding).\n   * Used to shrink and grow the thumb as according to the Material Design spec.\n   * TODO: internal\n   */\n  isActive: boolean = false;\n\n  /** Indicator for if the value has been set or not. */\n  private _isInitialized: boolean = false;\n\n  /** Value of the slider. */\n  private _value: number = 0;\n\n  @Input()\n  @HostBinding('attr.aria-valuemin')\n  get min() {\n    return this._min;\n  }\n\n  set min(v: number) {\n    // This has to be forced as a number to handle the math later.\n    this._min = Number(v);\n\n    // If the value wasn't explicitly set by the user, set it to the min.\n    if (!this._isInitialized) {\n      this.value = this._min;\n    }\n  }\n\n  @Input()\n  @HostBinding('attr.aria-valuemax')\n  get max() {\n    return this._max;\n  }\n\n  set max(v: number) {\n    this._max = Number(v);\n  }\n\n  @Input()\n  @HostBinding('attr.aria-valuenow')\n  get value() {\n    return this._value;\n  }\n\n  set value(v: number) {\n    // Only set the value to a valid number. v is casted to an any as we know it will come in as a\n    // string but it is labeled as a number which causes parseFloat to not accept it.\n    if (isNaN(parseFloat(<any> v))) {\n      return;\n    }\n\n    this._value = Number(v);\n    this._isInitialized = true;\n    this._controlValueAccessorChangeFn(this._value);\n  }\n\n  constructor(elementRef: ElementRef) {\n    this._renderer = new SliderRenderer(elementRef);\n  }\n\n  /**\n   * Once the slider has rendered, grab the dimensions and update the position of the thumb and\n   * fill track.\n   * TODO: internal\n   */\n  ngAfterContentInit() {\n    this._sliderDimensions = this._renderer.getSliderDimensions();\n    // This needs to be called after content init because the value can be set to the min if the\n    // value itself isn't set. If this happens, the control value accessor needs to be updated.\n    this._controlValueAccessorChangeFn(this.value);\n    this.snapThumbToValue();\n    this._updateTickSeparation();\n  }\n\n  /** TODO: internal */\n  onClick(event: MouseEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    this.isActive = true;\n    this.isSliding = false;\n    this._renderer.addFocus();\n    this.updateValueFromPosition(event.clientX);\n    this.snapThumbToValue();\n  }\n\n  /** TODO: internal */\n  onSlide(event: HammerInput) {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent the slide from selecting anything else.\n    event.preventDefault();\n    this.updateValueFromPosition(event.center.x);\n  }\n\n  /** TODO: internal */\n  onSlideStart(event: HammerInput) {\n    if (this.disabled) {\n      return;\n    }\n\n    event.preventDefault();\n    this.isSliding = true;\n    this.isActive = true;\n    this._renderer.addFocus();\n    this.updateValueFromPosition(event.center.x);\n  }\n\n  /** TODO: internal */\n  onSlideEnd() {\n    this.isSliding = false;\n    this.snapThumbToValue();\n  }\n\n  /** TODO: internal */\n  onResize() {\n    this.isSliding = true;\n    this._sliderDimensions = this._renderer.getSliderDimensions();\n    // Skip updating the value and position as there is no new placement.\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /** TODO: internal */\n  onBlur() {\n    this.isActive = false;\n    this.onTouched();\n  }\n\n  /**\n   * When the value changes without a physical position, the percentage needs to be recalculated\n   * independent of the physical location.\n   * This is also used to move the thumb to a snapped value once sliding is done.\n   */\n  updatePercentFromValue() {\n    this._percent = this.calculatePercentage(this.value);\n  }\n\n  /**\n   * Calculate the new value from the new physical location. The value will always be snapped.\n   */\n  updateValueFromPosition(pos: number) {\n    let offset = this._sliderDimensions.left;\n    let size = this._sliderDimensions.width;\n\n    // The exact value is calculated from the event and used to find the closest snap value.\n    this._percent = this.clamp((pos - offset) / size);\n    let exactValue = this.calculateValue(this._percent);\n\n    // This calculation finds the closest step by finding the closest whole number divisible by the\n    // step relative to the min.\n    let closestValue = Math.round((exactValue - this.min) / this.step) * this.step + this.min;\n    // The value needs to snap to the min and max.\n    this.value = this.clamp(closestValue, this.min, this.max);\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /**\n   * Snaps the thumb to the current value.\n   * Called after a click or drag event is over.\n   */\n  snapThumbToValue() {\n    this.updatePercentFromValue();\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /**\n   * Calculates the separation in pixels of tick marks. If there is no tick interval or the interval\n   * is set to something other than a number or 'auto', nothing happens.\n   */\n  private _updateTickSeparation() {\n    if (this._tickInterval == 'auto') {\n      this._updateAutoTickSeparation();\n    } else if (Number(this._tickInterval)) {\n      this._updateTickSeparationFromInterval();\n    }\n  }\n\n  /**\n   * Calculates the optimal separation in pixels of tick marks based on the minimum auto tick\n   * separation constant.\n   */\n  private _updateAutoTickSeparation() {\n    // We're looking for the multiple of step for which the separation between is greater than the\n    // minimum tick separation.\n    let sliderWidth = this._sliderDimensions.width;\n\n    // This is the total \"width\" of the slider in terms of values.\n    let valueWidth = this.max - this.min;\n\n    // Calculate how many values exist within 1px on the slider.\n    let valuePerPixel = valueWidth / sliderWidth;\n\n    // Calculate how many values exist in the minimum tick separation (px).\n    let valuePerSeparation = valuePerPixel  * MIN_AUTO_TICK_SEPARATION;\n\n    // Calculate how many steps exist in this separation. This will be the lowest value you can\n    // multiply step by to get a separation that is greater than or equal to the minimum tick\n    // separation.\n    let stepsPerSeparation = Math.ceil(valuePerSeparation / this.step);\n\n    // Get the percentage of the slider for which this tick would be located so we can then draw\n    // it on the slider.\n    let tickPercentage = this.calculatePercentage((this.step * stepsPerSeparation) + this.min);\n\n    // The pixel value of the tick is the percentage * the width of the slider. Use this to draw\n    // the ticks on the slider.\n    this._renderer.drawTicks(sliderWidth * tickPercentage);\n  }\n\n  /**\n   * Calculates the separation of tick marks by finding the pixel value of the tickInterval.\n   */\n  private _updateTickSeparationFromInterval() {\n    // Force tickInterval to be a number so it can be used in calculations.\n    let interval: number = <number> this._tickInterval;\n    // Calculate the first value a tick will be located at by getting the step at which the interval\n    // lands and adding that to the min.\n    let tickValue = (this.step * interval) + this.min;\n\n    // The percentage of the step on the slider is needed in order to calculate the pixel offset\n    // from the beginning of the slider. This offset is the tick separation.\n    let tickPercentage = this.calculatePercentage(tickValue);\n    this._renderer.drawTicks(this._sliderDimensions.width * tickPercentage);\n  }\n\n  /**\n   * Calculates the percentage of the slider that a value is.\n   */\n  calculatePercentage(value: number) {\n    return (value - this.min) / (this.max - this.min);\n  }\n\n  /**\n   * Calculates the value a percentage of the slider corresponds to.\n   */\n  calculateValue(percentage: number) {\n    return this.min + (percentage * (this.max - this.min));\n  }\n\n  /**\n   * Return a number between two numbers.\n   */\n  clamp(value: number, min = 0, max = 1) {\n    return Math.max(min, Math.min(value, max));\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  writeValue(value: any) {\n    this.value = value;\n\n    if (this._sliderDimensions) {\n      this.snapThumbToValue();\n    }\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  registerOnChange(fn: (value: any) => void) {\n    this._controlValueAccessorChangeFn = fn;\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  registerOnTouched(fn: any) {\n    this.onTouched = fn;\n  }\n}\n\n/**\n * Renderer class in order to keep all dom manipulation in one place and outside of the main class.\n */\nexport class SliderRenderer {\n  private _sliderElement: HTMLElement;\n\n  constructor(elementRef: ElementRef) {\n    this._sliderElement = elementRef.nativeElement;\n  }\n\n  /**\n   * Get the bounding client rect of the slider track element.\n   * The track is used rather than the native element to ignore the extra space that the thumb can\n   * take up.\n   */\n  getSliderDimensions() {\n    let trackElement = this._sliderElement.querySelector('.md-slider-track');\n    return trackElement.getBoundingClientRect();\n  }\n\n  /**\n   * Update the physical position of the thumb and fill track on the slider.\n   */\n  updateThumbAndFillPosition(percent: number, width: number) {\n    // A container element that is used to avoid overwriting the transform on the thumb itself.\n    let thumbPositionElement =\n        <HTMLElement>this._sliderElement.querySelector('.md-slider-thumb-position');\n    let fillTrackElement = <HTMLElement>this._sliderElement.querySelector('.md-slider-track-fill');\n\n    let position = Math.round(percent * width);\n\n    fillTrackElement.style.width = `${position}px`;\n    applyCssTransform(thumbPositionElement, `translateX(${position}px)`);\n  }\n\n  /**\n   * Focuses the native element.\n   * Currently only used to allow a blur event to fire but will be used with keyboard input later.\n   */\n  addFocus() {\n    this._sliderElement.focus();\n  }\n\n  /**\n   * Draws ticks onto the tick container.\n   */\n  drawTicks(tickSeparation: number) {\n    let tickContainer = <HTMLElement>this._sliderElement.querySelector('.md-slider-tick-container');\n    let tickContainerWidth = tickContainer.getBoundingClientRect().width;\n    // An extra element for the last tick is needed because the linear gradient cannot be told to\n    // always draw a tick at the end of the gradient. To get around this, there is a second\n    // container for ticks that has a single tick mark on the very right edge.\n    let lastTickContainer =\n        <HTMLElement>this._sliderElement.querySelector('.md-slider-last-tick-container');\n    // Subtract 1 from the tick separation to center the tick.\n    // TODO: Evaluate the rendering performance of using repeating background gradients.\n    tickContainer.style.background = `repeating-linear-gradient(to right, black, black 2px, ` +\n        `transparent 2px, transparent ${tickSeparation - 1}px)`;\n    // Add a tick to the very end by starting on the right side and adding a 2px black line.\n    lastTickContainer.style.background = `linear-gradient(to left, black, black 2px, transparent ` +\n        `2px, transparent)`;\n\n    // If the second to last tick is too close (a separation of less than half the normal\n    // separation), don't show it by decreasing the width of the tick container element.\n    if (tickContainerWidth % tickSeparation < (tickSeparation / 2)) {\n      tickContainer.style.width = tickContainerWidth - tickSeparation + 'px';\n    }\n  }\n}\n\n\n@NgModule({\n  imports: [FormsModule],\n  exports: [MdSlider],\n  declarations: [MdSlider],\n  providers: [\n    {provide: HAMMER_GESTURE_CONFIG, useClass: MdGestureConfig},\n  ],\n})\nexport class MdSliderModule {\n  static forRoot(): ModuleWithProviders {\n    return {\n      ngModule: MdSliderModule,\n      providers: [{provide: HAMMER_GESTURE_CONFIG, useClass: MdGestureConfig}]\n    };\n  }\n}\n"],"sourceRoot":"/source/"}
+{"version":3,"sources":["slider/slider.ts"],"names":[],"mappings":"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","file":"slider/slider.js","sourcesContent":["import {\n  NgModule,\n  ModuleWithProviders,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  ViewEncapsulation,\n  AfterContentInit,\n  forwardRef,\n} from '@angular/core';\nimport {\n  NG_VALUE_ACCESSOR,\n  ControlValueAccessor,\n  FormsModule,\n} from '@angular/forms';\nimport {HAMMER_GESTURE_CONFIG} from '@angular/platform-browser';\nimport {BooleanFieldValue, MdGestureConfig, applyCssTransform} from '@angular2-material/core';\nimport {Input as HammerInput} from 'hammerjs';\n\n/**\n * Visually, a 30px separation between tick marks looks best. This is very subjective but it is\n * the default separation we chose.\n */\nconst MIN_AUTO_TICK_SEPARATION = 30;\n\n/**\n * Provider Expression that allows md-slider to register as a ControlValueAccessor.\n * This allows it to support [(ngModel)] and [formControl].\n */\nexport const MD_SLIDER_VALUE_ACCESSOR: any = {\n  provide: NG_VALUE_ACCESSOR,\n  useExisting: forwardRef(() => MdSlider),\n  multi: true\n};\n\n@Component({\n  moduleId: module.id,\n  selector: 'md-slider',\n  providers: [MD_SLIDER_VALUE_ACCESSOR],\n  host: {\n    'tabindex': '0',\n    '(click)': 'onClick($event)',\n    '(slide)': 'onSlide($event)',\n    '(slidestart)': 'onSlideStart($event)',\n    '(slideend)': 'onSlideEnd()',\n    '(window:resize)': 'onResize()',\n    '(blur)': 'onBlur()',\n  },\n  templateUrl: 'slider.html',\n  styleUrls: ['slider.css'],\n  encapsulation: ViewEncapsulation.None,\n})\nexport class MdSlider implements AfterContentInit, ControlValueAccessor {\n  /** A renderer to handle updating the slider's thumb and fill track. */\n  private _renderer: SliderRenderer = null;\n\n  /** The dimensions of the slider. */\n  private _sliderDimensions: ClientRect = null;\n\n  @Input()\n  @BooleanFieldValue()\n  @HostBinding('class.md-slider-disabled')\n  @HostBinding('attr.aria-disabled')\n  disabled: boolean = false;\n\n  /** Whether or not to show the thumb label. */\n  @Input('thumb-label')\n  @BooleanFieldValue()\n  thumbLabel: boolean = false;\n\n  /** The miniumum value that the slider can have. */\n  private _min: number = 0;\n\n  /** The maximum value that the slider can have. */\n  private _max: number = 100;\n\n  /** The percentage of the slider that coincides with the value. */\n  private _percent: number = 0;\n\n  private _controlValueAccessorChangeFn: (value: any) => void = (value) => {};\n\n  /** onTouch function registered via registerOnTouch (ControlValueAccessor). */\n  onTouched: () => any = () => {};\n\n  /** The values at which the thumb will snap. */\n  @Input() step: number = 1;\n\n  /**\n   * How often to show ticks. Relative to the step so that a tick always appears on a step.\n   * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).\n   */\n  @Input('tick-interval') _tickInterval: 'auto' | number;\n\n  /**\n   * Whether or not the thumb is sliding.\n   * Used to determine if there should be a transition for the thumb and fill track.\n   * TODO: internal\n   */\n  isSliding: boolean = false;\n\n  /**\n   * Whether or not the slider is active (clicked or sliding).\n   * Used to shrink and grow the thumb as according to the Material Design spec.\n   * TODO: internal\n   */\n  isActive: boolean = false;\n\n  /** Indicator for if the value has been set or not. */\n  private _isInitialized: boolean = false;\n\n  /** Value of the slider. */\n  private _value: number = 0;\n\n  @Input()\n  @HostBinding('attr.aria-valuemin')\n  get min() {\n    return this._min;\n  }\n\n  set min(v: number) {\n    // This has to be forced as a number to handle the math later.\n    this._min = Number(v);\n\n    // If the value wasn't explicitly set by the user, set it to the min.\n    if (!this._isInitialized) {\n      this.value = this._min;\n    }\n  }\n\n  @Input()\n  @HostBinding('attr.aria-valuemax')\n  get max() {\n    return this._max;\n  }\n\n  set max(v: number) {\n    this._max = Number(v);\n  }\n\n  @Input()\n  @HostBinding('attr.aria-valuenow')\n  get value() {\n    return this._value;\n  }\n\n  set value(v: number) {\n    // Only set the value to a valid number. v is casted to an any as we know it will come in as a\n    // string but it is labeled as a number which causes parseFloat to not accept it.\n    if (isNaN(parseFloat(<any> v))) {\n      return;\n    }\n\n    this._value = Number(v);\n    this._isInitialized = true;\n    this._controlValueAccessorChangeFn(this._value);\n  }\n\n  constructor(elementRef: ElementRef) {\n    this._renderer = new SliderRenderer(elementRef);\n  }\n\n  /**\n   * Once the slider has rendered, grab the dimensions and update the position of the thumb and\n   * fill track.\n   * TODO: internal\n   */\n  ngAfterContentInit() {\n    this._sliderDimensions = this._renderer.getSliderDimensions();\n    // This needs to be called after content init because the value can be set to the min if the\n    // value itself isn't set. If this happens, the control value accessor needs to be updated.\n    this._controlValueAccessorChangeFn(this.value);\n    this.snapThumbToValue();\n    this._updateTickSeparation();\n  }\n\n  /** TODO: internal */\n  onClick(event: MouseEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    this.isActive = true;\n    this.isSliding = false;\n    this._renderer.addFocus();\n    this.updateValueFromPosition(event.clientX);\n    this.snapThumbToValue();\n  }\n\n  /** TODO: internal */\n  onSlide(event: HammerInput) {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent the slide from selecting anything else.\n    event.preventDefault();\n    this.updateValueFromPosition(event.center.x);\n  }\n\n  /** TODO: internal */\n  onSlideStart(event: HammerInput) {\n    if (this.disabled) {\n      return;\n    }\n\n    event.preventDefault();\n    this.isSliding = true;\n    this.isActive = true;\n    this._renderer.addFocus();\n    this.updateValueFromPosition(event.center.x);\n  }\n\n  /** TODO: internal */\n  onSlideEnd() {\n    this.isSliding = false;\n    this.snapThumbToValue();\n  }\n\n  /** TODO: internal */\n  onResize() {\n    this.isSliding = true;\n    this._sliderDimensions = this._renderer.getSliderDimensions();\n    // Skip updating the value and position as there is no new placement.\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /** TODO: internal */\n  onBlur() {\n    this.isActive = false;\n    this.onTouched();\n  }\n\n  /**\n   * When the value changes without a physical position, the percentage needs to be recalculated\n   * independent of the physical location.\n   * This is also used to move the thumb to a snapped value once sliding is done.\n   */\n  updatePercentFromValue() {\n    this._percent = this.calculatePercentage(this.value);\n  }\n\n  /**\n   * Calculate the new value from the new physical location. The value will always be snapped.\n   */\n  updateValueFromPosition(pos: number) {\n    let offset = this._sliderDimensions.left;\n    let size = this._sliderDimensions.width;\n\n    // The exact value is calculated from the event and used to find the closest snap value.\n    this._percent = this.clamp((pos - offset) / size);\n    let exactValue = this.calculateValue(this._percent);\n\n    // This calculation finds the closest step by finding the closest whole number divisible by the\n    // step relative to the min.\n    let closestValue = Math.round((exactValue - this.min) / this.step) * this.step + this.min;\n    // The value needs to snap to the min and max.\n    this.value = this.clamp(closestValue, this.min, this.max);\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /**\n   * Snaps the thumb to the current value.\n   * Called after a click or drag event is over.\n   */\n  snapThumbToValue() {\n    this.updatePercentFromValue();\n    this._renderer.updateThumbAndFillPosition(this._percent, this._sliderDimensions.width);\n  }\n\n  /**\n   * Calculates the separation in pixels of tick marks. If there is no tick interval or the interval\n   * is set to something other than a number or 'auto', nothing happens.\n   */\n  private _updateTickSeparation() {\n    if (this._tickInterval == 'auto') {\n      this._updateAutoTickSeparation();\n    } else if (Number(this._tickInterval)) {\n      this._updateTickSeparationFromInterval();\n    }\n  }\n\n  /**\n   * Calculates the optimal separation in pixels of tick marks based on the minimum auto tick\n   * separation constant.\n   */\n  private _updateAutoTickSeparation() {\n    // We're looking for the multiple of step for which the separation between is greater than the\n    // minimum tick separation.\n    let sliderWidth = this._sliderDimensions.width;\n\n    // This is the total \"width\" of the slider in terms of values.\n    let valueWidth = this.max - this.min;\n\n    // Calculate how many values exist within 1px on the slider.\n    let valuePerPixel = valueWidth / sliderWidth;\n\n    // Calculate how many values exist in the minimum tick separation (px).\n    let valuePerSeparation = valuePerPixel  * MIN_AUTO_TICK_SEPARATION;\n\n    // Calculate how many steps exist in this separation. This will be the lowest value you can\n    // multiply step by to get a separation that is greater than or equal to the minimum tick\n    // separation.\n    let stepsPerSeparation = Math.ceil(valuePerSeparation / this.step);\n\n    // Get the percentage of the slider for which this tick would be located so we can then draw\n    // it on the slider.\n    let tickPercentage = this.calculatePercentage((this.step * stepsPerSeparation) + this.min);\n\n    // The pixel value of the tick is the percentage * the width of the slider. Use this to draw\n    // the ticks on the slider.\n    this._renderer.drawTicks(sliderWidth * tickPercentage);\n  }\n\n  /**\n   * Calculates the separation of tick marks by finding the pixel value of the tickInterval.\n   */\n  private _updateTickSeparationFromInterval() {\n    // Force tickInterval to be a number so it can be used in calculations.\n    let interval: number = <number> this._tickInterval;\n    // Calculate the first value a tick will be located at by getting the step at which the interval\n    // lands and adding that to the min.\n    let tickValue = (this.step * interval) + this.min;\n\n    // The percentage of the step on the slider is needed in order to calculate the pixel offset\n    // from the beginning of the slider. This offset is the tick separation.\n    let tickPercentage = this.calculatePercentage(tickValue);\n    this._renderer.drawTicks(this._sliderDimensions.width * tickPercentage);\n  }\n\n  /**\n   * Calculates the percentage of the slider that a value is.\n   */\n  calculatePercentage(value: number) {\n    return (value - this.min) / (this.max - this.min);\n  }\n\n  /**\n   * Calculates the value a percentage of the slider corresponds to.\n   */\n  calculateValue(percentage: number) {\n    return this.min + (percentage * (this.max - this.min));\n  }\n\n  /**\n   * Return a number between two numbers.\n   */\n  clamp(value: number, min = 0, max = 1) {\n    return Math.max(min, Math.min(value, max));\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  writeValue(value: any) {\n    this.value = value;\n\n    if (this._sliderDimensions) {\n      this.snapThumbToValue();\n    }\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  registerOnChange(fn: (value: any) => void) {\n    this._controlValueAccessorChangeFn = fn;\n  }\n\n  /**\n   * Implemented as part of ControlValueAccessor.\n   * TODO: internal\n   */\n  registerOnTouched(fn: any) {\n    this.onTouched = fn;\n  }\n}\n\n/**\n * Renderer class in order to keep all dom manipulation in one place and outside of the main class.\n */\nexport class SliderRenderer {\n  private _sliderElement: HTMLElement;\n\n  constructor(elementRef: ElementRef) {\n    this._sliderElement = elementRef.nativeElement;\n  }\n\n  /**\n   * Get the bounding client rect of the slider track element.\n   * The track is used rather than the native element to ignore the extra space that the thumb can\n   * take up.\n   */\n  getSliderDimensions() {\n    let trackElement = this._sliderElement.querySelector('.md-slider-track');\n    return trackElement.getBoundingClientRect();\n  }\n\n  /**\n   * Update the physical position of the thumb and fill track on the slider.\n   */\n  updateThumbAndFillPosition(percent: number, width: number) {\n    // A container element that is used to avoid overwriting the transform on the thumb itself.\n    let thumbPositionElement =\n        <HTMLElement>this._sliderElement.querySelector('.md-slider-thumb-position');\n    let fillTrackElement = <HTMLElement>this._sliderElement.querySelector('.md-slider-track-fill');\n\n    let position = Math.round(percent * width);\n\n    fillTrackElement.style.width = `${position}px`;\n    applyCssTransform(thumbPositionElement, `translateX(${position}px)`);\n  }\n\n  /**\n   * Focuses the native element.\n   * Currently only used to allow a blur event to fire but will be used with keyboard input later.\n   */\n  addFocus() {\n    this._sliderElement.focus();\n  }\n\n  /**\n   * Draws ticks onto the tick container.\n   */\n  drawTicks(tickSeparation: number) {\n    let tickContainer = <HTMLElement>this._sliderElement.querySelector('.md-slider-tick-container');\n    let tickContainerWidth = tickContainer.getBoundingClientRect().width;\n    // An extra element for the last tick is needed because the linear gradient cannot be told to\n    // always draw a tick at the end of the gradient. To get around this, there is a second\n    // container for ticks that has a single tick mark on the very right edge.\n    let lastTickContainer =\n        <HTMLElement>this._sliderElement.querySelector('.md-slider-last-tick-container');\n    // Subtract 1 from the tick separation to center the tick.\n    // TODO: Evaluate the rendering performance of using repeating background gradients.\n    tickContainer.style.background = `repeating-linear-gradient(to right, black, black 2px, ` +\n        `transparent 2px, transparent ${tickSeparation - 1}px)`;\n    // Add a tick to the very end by starting on the right side and adding a 2px black line.\n    lastTickContainer.style.background = `linear-gradient(to left, black, black 2px, transparent ` +\n        `2px, transparent)`;\n\n    // If the second to last tick is too close (a separation of less than half the normal\n    // separation), don't show it by decreasing the width of the tick container element.\n    if (tickContainerWidth % tickSeparation < (tickSeparation / 2)) {\n      tickContainer.style.width = tickContainerWidth - tickSeparation + 'px';\n    }\n  }\n}\n\n\n@NgModule({\n  imports: [FormsModule],\n  exports: [MdSlider],\n  declarations: [MdSlider],\n  providers: [\n    {provide: HAMMER_GESTURE_CONFIG, useClass: MdGestureConfig},\n  ],\n})\nexport class MdSliderModule {\n  static forRoot(): ModuleWithProviders {\n    return {\n      ngModule: MdSliderModule,\n      providers: [{provide: HAMMER_GESTURE_CONFIG, useClass: MdGestureConfig}]\n    };\n  }\n}\n"],"sourceRoot":"/source/"}

slider.scss

@@ -1,4 +0,4 @@
-@import 'default-theme';
-@import '_variables';
+@import '../core/style/variables';
 
+
 // This refers to the thickness of the slider. On a horizontal slider this is the height, on a
@@ -16,7 +16,2 @@ // vertical slider this is the width.
 
-// TODO(iveysaur): Find an implementation to hide the track under a disabled thumb.
-$md-slider-off-color: rgba(black, 0.26);
-$md-slider-focused-color: rgba(black, 0.38);
-$md-slider-disabled-color: rgba(black, 0.26);
-
 $md-slider-thumb-arrow-height: 16px !default;
@@ -32,5 +27,3 @@ $md-slider-thumb-arrow-width: 28px !default;
 
-/**
- * Uses a container height and an item height to center an item vertically within the container.
- */
+// Uses a container height and an item height to center an item vertically within the container.
 @function center-vertically($containerHeight, $itemHeight) {
@@ -40,5 +33,3 @@ @return ($containerHeight / 2) - ($itemHeight / 2);
 
-/**
- * Positions the thumb based on its width and height.
- */
+// Positions the thumb based on its width and height.
 @mixin slider-thumb-position($width: $md-slider-thumb-size, $height: $md-slider-thumb-size) {
@@ -70,6 +61,4 @@ position: absolute;
 
-/**
- * Exists in order to pad the slider and keep everything positioned correctly.
- * Cannot be merged with the .md-slider-container.
- */
+// Exists in order to pad the slider and keep everything positioned correctly.
+// Cannot be merged with the .md-slider-container.
 .md-slider-wrapper {
@@ -82,6 +71,5 @@ width: 100%;
 
-/**
- * Holds the isActive and isSliding classes as well as helps with positioning the children.
- * Cannot be merged with .md-slider-wrapper.
- */
+
+// Holds the isActive and isSliding classes as well as helps with positioning the children.
+// Cannot be merged with .md-slider-wrapper.
 .md-slider-container {
@@ -103,3 +91,2 @@ position: relative;
   height: 100%;
-  background-color: $md-slider-off-color;
 }
@@ -111,3 +98,2 @@
   transition-property: width, height;
-  background-color: md-color($md-accent);
 }
@@ -150,7 +136,6 @@
   border-radius: max($md-slider-thumb-size, $md-slider-thumb-size);
+  // Separate border properties because, if you combine them into "border", it defaults to 'black'.
   border-width: 3px;
   border-style: solid;
   transition: inherit;
-  background-color: md-color($md-accent);
-  border-color: md-color($md-accent);
 }
@@ -173,4 +158,2 @@
   transition-property: transform, border-radius;
-
-  background-color: md-color($md-accent);
 }
@@ -185,3 +168,2 @@
   transition: opacity 300ms $swift-ease-in-out-timing-function;
-  color: white;
 }
@@ -188,0 +170,0 @@

slider.umd.js

@@ -346,3 +346,3 @@ (function (global, factory) {
             template: "<div class=\"md-slider-wrapper\"> <div class=\"md-slider-container\" [class.md-slider-sliding]=\"isSliding\" [class.md-slider-active]=\"isActive\" [class.md-slider-thumb-label-showing]=\"thumbLabel\"> <div class=\"md-slider-track-container\"> <div class=\"md-slider-track\"></div> <div class=\"md-slider-track md-slider-track-fill\"></div> <div class=\"md-slider-tick-container\"></div> <div class=\"md-slider-last-tick-container\"></div> </div> <div class=\"md-slider-thumb-container\"> <div class=\"md-slider-thumb-position\"> <div class=\"md-slider-thumb\"></div> <div class=\"md-slider-thumb-label\"> <span class=\"md-slider-thumb-label-text\">{{value}}</span> </div> </div> </div> </div> </div> ",
-            styles: ["/** * Uses a container height and an item height to center an item vertically within the container. */ /** * Positions the thumb based on its width and height. */ md-slider { height: 48px; min-width: 128px; position: relative; padding: 0; display: inline-block; outline: none; vertical-align: middle; } md-slider *, md-slider *::after { box-sizing: border-box; } /** * Exists in order to pad the slider and keep everything positioned correctly. * Cannot be merged with the .md-slider-container. */ .md-slider-wrapper { width: 100%; height: 100%; padding-left: 8px; padding-right: 8px; } /** * Holds the isActive and isSliding classes as well as helps with positioning the children. * Cannot be merged with .md-slider-wrapper. */ .md-slider-container { position: relative; } .md-slider-track-container { width: 100%; position: absolute; top: 23px; height: 2px; } .md-slider-track { position: absolute; left: 0; right: 0; height: 100%; background-color: rgba(0, 0, 0, 0.26); } .md-slider-track-fill { transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: width, height; background-color: #9c27b0; } .md-slider-tick-container, .md-slider-last-tick-container { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-thumb-container { position: absolute; left: 0; top: 50%; transform: translate3d(-50%, -50%, 0); transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: left, bottom; } .md-slider-thumb-position { transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb { z-index: 1; position: absolute; top: 14px; left: -10px; width: 20px; height: 20px; border-radius: 20px; transform: scale(0.7); transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb::after { content: ''; position: absolute; width: 20px; height: 20px; border-radius: 20px; border-width: 3px; border-style: solid; transition: inherit; background-color: #9c27b0; border-color: #9c27b0; } .md-slider-thumb-label { display: flex; align-items: center; justify-content: center; position: absolute; left: -14px; top: -17px; width: 28px; height: 28px; border-radius: 50%; transform: scale(0.4) translate3d(0, 67.5px, 0) rotate(45deg); transition: 300ms cubic-bezier(0.35, 0, 0.25, 1); transition-property: transform, border-radius; background-color: #9c27b0; } .md-slider-thumb-label-text { z-index: 1; font-size: 12px; font-weight: bold; opacity: 0; transform: rotate(-45deg); transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); color: white; } .md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label { display: none; } .md-slider-active.md-slider-thumb-label-showing .md-slider-thumb { transform: scale(0); } .md-slider-sliding .md-slider-thumb-position, .md-slider-sliding .md-slider-track-fill { transition: none; cursor: default; } .md-slider-active .md-slider-thumb { transform: scale(1); } .md-slider-active .md-slider-thumb-label { border-radius: 50% 50% 0; transform: rotate(45deg); } .md-slider-active .md-slider-thumb-label-text { opacity: 1; } /*# sourceMappingURL=slider.css.map */ "],
+            styles: ["md-slider { height: 48px; min-width: 128px; position: relative; padding: 0; display: inline-block; outline: none; vertical-align: middle; } md-slider *, md-slider *::after { box-sizing: border-box; } .md-slider-wrapper { width: 100%; height: 100%; padding-left: 8px; padding-right: 8px; } .md-slider-container { position: relative; } .md-slider-track-container { width: 100%; position: absolute; top: 23px; height: 2px; } .md-slider-track { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-track-fill { transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: width, height; } .md-slider-tick-container, .md-slider-last-tick-container { position: absolute; left: 0; right: 0; height: 100%; } .md-slider-thumb-container { position: absolute; left: 0; top: 50%; transform: translate3d(-50%, -50%, 0); transition-duration: 400ms; transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1); transition-property: left, bottom; } .md-slider-thumb-position { transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb { z-index: 1; position: absolute; top: 14px; left: -10px; width: 20px; height: 20px; border-radius: 20px; transform: scale(0.7); transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); } .md-slider-thumb::after { content: ''; position: absolute; width: 20px; height: 20px; border-radius: 20px; border-width: 3px; border-style: solid; transition: inherit; } .md-slider-thumb-label { display: flex; align-items: center; justify-content: center; position: absolute; left: -14px; top: -17px; width: 28px; height: 28px; border-radius: 50%; transform: scale(0.4) translate3d(0, 67.5px, 0) rotate(45deg); transition: 300ms cubic-bezier(0.35, 0, 0.25, 1); transition-property: transform, border-radius; } .md-slider-thumb-label-text { z-index: 1; font-size: 12px; font-weight: bold; opacity: 0; transform: rotate(-45deg); transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); } .md-slider-container:not(.md-slider-thumb-label-showing) .md-slider-thumb-label { display: none; } .md-slider-active.md-slider-thumb-label-showing .md-slider-thumb { transform: scale(0); } .md-slider-sliding .md-slider-thumb-position, .md-slider-sliding .md-slider-track-fill { transition: none; cursor: default; } .md-slider-active .md-slider-thumb { transform: scale(1); } .md-slider-active .md-slider-thumb-label { border-radius: 50% 50% 0; transform: rotate(45deg); } .md-slider-active .md-slider-thumb-label-text { opacity: 1; } /*# sourceMappingURL=slider.css.map */ "],
             encapsulation: _angular_core.ViewEncapsulation.None,
@@ -349,0 +349,0 @@ }),

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of package files

20

5.26%

Worsened metrics

Total package byte prevSize

109242

-15.14%

Lines of code

1228

-1.92%

No dependency changes