@angular/material 2.0.0-beta.0 → 2.0.0-beta.12

package/slider/OVERVIEW.md

@@ -1,87 +0,0 @@
-`<md-slider>` allows for the selection of a value from a range via mouse, touch, or keyboard, 
-similar to `<input type="range">`.
-
-<!-- example(slider-overview) -->
-
-_Note: the sliding behavior for this component requires that HammerJS is loaded on the page._
-
-### Selecting a value
-
-By default the minimum value of the slider is `0`, the maximum value is `100`, and the thumb moves
-in increments of `1`. These values can be changed by setting the `min`, `max`, and `step` attributes
-respectively. The initial value is set to the minimum value unless otherwise specified.
-
-```html
-<md-slider min="1" max="5" step="0.5" value="1.5"></md-slider>
-```
-
-### Orientation
-
-By default sliders are horizontal with the minimum value on the left and the maximum value on the
-right. The `vertical` attribute can be added to a slider to make it vertical with the minimum value
-on bottom and the maximum value on top.
-
-```html
-<md-slider vertical></md-slider>
-```
-
-An `invert` attribute is also available which can be specified to flip the axis that the thumb moves
-along. An inverted horizontal slider will have the minimum value on the right and the maximum value
-on the left, while an inverted vertical slider will have the minimum value on top and the  maximum
-value on bottom.
-
-```html
-<md-slider invert></md-slider>
-```
-
-### Thumb label
-By default, the exact selected value of a slider is not visible to the user. However, this value can
-be added to the thumb by adding the `thumbLabel` attribute.
-
-The [Material Design spec](https://material.google.com/components/sliders.html) recommends using the
-`thumbLabel` attribute (along with `tickInterval="1"`) only for sliders that are used to display a
-discrete value (such as a 1-5 rating).
-
-```html
-<md-slider thumbLabel tickInterval="1"></md-slider>
-```
-
-### Tick marks
-By default, sliders do not show tick marks along the thumb track. This can be enabled using the
-`tickInterval` attribute. The value of `tickInterval` should be a number representing the number
-of steps between between ticks. For example a `tickInterval` of `3` with a `step` of `4` will draw
-tick marks at every `3` steps, which is the same as every `12` values.
-
-```html
-<md-slider step="4" tickInterval="3"></md-slider>
-```
-
-The `tickInterval` can also be set to `auto` which will automatically choose the number of steps
-such that there is at least `30px` of space between ticks.
-
-```html
-<md-slider tickInterval="auto"></md-slider>
-```
-
-The slider will always show a tick at the beginning and end of the track. If the remaining space
-doesn't add up perfectly the last interval will be shortened or lengthened so that the tick can be
-shown at the end of the track.
-
-The [Material Design spec](https://material.google.com/components/sliders.html) recommends using the
-`tickInterval` attribute (set to `1` along with the `thumbLabel` attribute) only for sliders that
-are used to display a discrete value (such as a 1-5 rating).
-
-
-### Keyboard interaction
-The slider has the following keyboard bindings:
-
-| Key         | Action                                                                             |
-|-------------|------------------------------------------------------------------------------------|
-| Right arrow | Increment the slider value by one step (decrements in RTL).                        |
-| Up arrow    | Increment the slider value by one step.                                            |
-| Left arrow  | Decrement the slider value by one step (decrements in RTL).                        |
-| Down arrow  | Decrement the slider value by one step.                                            |
-| Page up     | Increment the slider value by 10 steps.                                            |
-| Page down   | Decrement the slider value by 10 steps.                                            |
-| End         | Set the value to the maximum possible.                                             |
-| Home        | Set the value to the minimum possible.                                             |

package/slider/README.md

@@ -1,150 +0,0 @@
-# md-slider
-
-`md-slider` is a component that allows users to select from a range of values by moving the slider
-thumb. It is similar in behavior to the native `<input type="range">` element. You can read more
-about the slider in the [Material Design spec](https://material.google.com/components/sliders.html).
-
-Simple example:
-```html
-<md-slider></md-slider>
-```
-
-## Usage
-
-### Changing the min, max, step, and initial value
-
-By default the minimum value of the slider is `0`, the maximum value is `100`, and the thumb moves
-in increments of `1`. These values can be changed by setting the `min`, `max`, and `step` attributes
-respectively. The initial value is set to the minimum value unless otherwise specified.
-
-```html
-<md-slider min="1" max="5" step="0.5" value="1.5"></md-slider>
-```
-
-### Setting the orientation
-
-By default sliders are horizontal with the minimum value on the left and the maximum value on the
-right. The `vertical` attribute can be added to a slider to make it vertical with the minimum value
-on bottom and the maximum value on top.
-
-```html
-<md-slider vertical></md-slider>
-```
-
-An `invert` attribute is also available which can be specified to flip the axis that the thumb moves
-along. An inverted horizontal slider will have the minimum value on the right and the maximum value
-on the left, while an inverted vertical slider will have the minimum value on top and the  maximum
-value on bottom.
-
-```html
-<md-slider invert></md-slider>
-```
-
-### Adding a thumb label
-
-By default the exact selected value of a slider is not visible to the user. However, this value can
-be added to the thumb by adding the `thumbLabel` attribute.
-
-The [material design spec](https://material.google.com/components/sliders.html) recommends using the
-`thumbLabel` attribute (along with `tickInterval="1"`) only for sliders that are used to display a
-discrete value (such as a 1-5 rating).
-
-```html
-<md-slider thumbLabel tickInterval="1"></md-slider>
-```
-
-### Adding ticks
-
-By default a sliders do not show tick marks along the thumb track. They can be enabled using the
-`tickInterval` attribute. The value of `tickInterval` should be a number representing the number
-of steps between between ticks. For example a `tickInterval` of `3` with a `step` of `4` will draw
-tick marks at every `3` steps, which is the same as every `12` values.
-
-```html
-<md-slider step="4" tickInterval="3"></md-slider>
-```
-
-The `tickInterval` can also be set to `auto` which will automatically choose the number of steps
-such that there is at least `30px` of space between ticks.
-
-```html
-<md-slider tickInterval="auto"></md-slider>
-```
-
-The slider will always show a tick at the beginning and end of the track. If the remaining space
-doesn't add up perfectly the last interval will be shortened or lengthened so that the tick can be
-shown at the end of the track.
-
-The [material design spec](https://material.google.com/components/sliders.html) recommends using the
-`tickInterval` attribute (set to `1` along with the `thumbLabel` attribute) only for sliders that
-are used to display a discrete value (such as a 1-5 rating).
-
-### Disabling the slider
-
-The `disabled` attribute can be used to disable the slider, preventing the user from changing the
-value.
-
-```html
-<md-slider disabled value="5"></md-slider>
-```
-
-### Value binding
-
-`md-slider` supports both 1-way binding and 2-way binding via `ngModel`. It also emits a `change`
-event when the value changes due to user interaction.
-
-```html
-<md-slider [value]="myValue" (change)="onChange()"></md-slider>
-```
-
-```html
-<md-slider [(ngModel)]="myValue"></md-slider>
-```
-
-## Accessibility
-
-The slider has the following keyboard bindings:
-
-| Key | Action |
-| --- | --- |
-| Right arrow | Increment the slider value by one step. (Decrement in right-to-left-languages). |
-| Up arrow | Increment the slider value by one step. |
-| Left arrow | Decrement the slider value by one step. (Increment in right-to-left-languages). |
-| Down arrow | Decrement the slider value by one step. |
-| Page up | Increment the slider value by 10 steps. |
-| Page down | Decrement the slider value by 10 steps. |
-| End | Set the value to the maximum possible. |
-| Home | Set the value to the minimum possible. |
-
-## Internationalization
-
-In right-to-left languages the horizontal slider has the minimum value on the right and the maximum
-value on the left by default. The meaning of the left and right arrow keys is also swapped in
-right-to-left languages.
-
-## API Summary
-
-### Inputs
-
-| Name | Type | Description |
-| --- | --- | --- |
-| `min` | number | Optional, the minimum number for the slider. Default = `0`. |
-| `max` | number | Optional, the maximum number for the slider. Default = `100`. |
-| `step` | number | Optional, declares where the thumb will snap to. Default = `1`. |
-| `value` | number | Optional, the value to start the slider at. |
-| `tickInterval` | `"auto"` \| number | Optional, how many steps between tick marks. |
-| `invert` | boolean | Optional, whether to invert the axis the thumb moves along. |
-| `vertical` | boolean | Optional, whether the slider should be oriented vertically. |
-| `disabled` | boolean | Optional, whether or not the slider is disabled. Default = `false`. |
-
-### Outputs
-
-| Name | Description |
-| --- | --- |
-| `change` | Emitted when the value changes due to user interaction. |
-
-
-## Future work & open questions
-
-* Update focused, disabled, and `value=min` states to match spec.
-* Should there be an option to not force the end tick to be shown?

package/slider/_slider-theme.scss

@@ -1,32 +0,0 @@
-@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 {
-    background-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/slider/index.js

@@ -1,3 +0,0 @@
-export * from './slider';
-
-//# sourceMappingURL=index.js.map

package/slider/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["slider/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC","file":"index.js","sourcesContent":["export * from './slider';\n"]}

package/slider/slider.css

@@ -1 +0,0 @@
-md-slider{display:inline-block;position:relative;box-sizing:border-box;padding:8px;outline:0;vertical-align:middle}.md-slider-track{position:absolute}.md-slider-track-fill{position:absolute;transform-origin:0 0;transition:transform .4s cubic-bezier(.25,.8,.25,1)}.md-slider-ticks-container{position:absolute;left:0;top:0;overflow:hidden}.md-slider-ticks{opacity:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.md-slider-thumb,.md-slider-thumb-container{transition:transform .4s cubic-bezier(.25,.8,.25,1);position:absolute}.md-slider-thumb-container{z-index:1}.md-slider-thumb{right:-10px;bottom:-10px;width:20px;height:20px;border-radius:50%;transform:scale(.7)}.md-slider-thumb-label{display:none;align-items:center;justify-content:center;position:absolute;width:28px;height:28px;border-radius:50%;transition:.3s cubic-bezier(.35,0,.25,1);transition-property:transform,border-radius}.md-slider-thumb-label-text{z-index:1;font-size:12px;font-weight:700;opacity:0;transition:opacity .3s cubic-bezier(.35,0,.25,1)}.md-slider-sliding .md-slider-thumb-container,.md-slider-sliding .md-slider-track-fill{transition-duration:0s}.md-slider-has-ticks .md-slider-track::after{content:'';position:absolute;border:0 solid rgba(0,0,0,.6);opacity:0;transition:opacity .3s cubic-bezier(.35,0,.25,1)}.md-slider-active .md-slider-thumb-label-text,.md-slider-has-ticks.md-slider-active .md-slider-ticks,.md-slider-has-ticks.md-slider-active .md-slider-track::after,.md-slider-has-ticks:hover .md-slider-ticks,.md-slider-has-ticks:hover .md-slider-track::after{opacity:1}.md-slider-thumb-label-showing .md-slider-thumb-label{display:flex}.md-slider-axis-inverted .md-slider-track-fill{transform-origin:100% 100%}.md-slider-active .md-slider-thumb{transform:scale(1)}.md-slider-active.md-slider-thumb-label-showing .md-slider-thumb{transform:scale(0)}.md-slider-active .md-slider-thumb-label{border-radius:50% 50% 0}.md-slider-horizontal{height:48px;min-width:128px}.md-slider-horizontal .md-slider-track{height:2px;top:23px;left:8px;right:8px}.md-slider-horizontal .md-slider-track::after{height:2px;border-left-width:2px;right:0}.md-slider-horizontal .md-slider-track-fill{height:2px;width:100%;transform:scaleX(0)}.md-slider-horizontal .md-slider-ticks-container{height:2px;width:100%}.md-slider-horizontal .md-slider-ticks{background:repeating-linear-gradient(to right,rgba(0,0,0,.6),rgba(0,0,0,.6) 2px,transparent 0,transparent);background:-moz-repeating-linear-gradient(.0001deg,rgba(0,0,0,.6),rgba(0,0,0,.6) 2px,transparent 0,transparent);height:2px;width:100%}.md-slider-horizontal .md-slider-thumb-container{width:100%;height:0;top:50%}.md-slider-horizontal .md-slider-thumb-label{right:-14px;top:-40px;transform:translateY(26px) scale(.4) rotate(45deg)}.md-slider-horizontal .md-slider-thumb-label-text{transform:rotate(-45deg)}.md-slider-horizontal.md-slider-active .md-slider-thumb-label{transform:rotate(45deg)}.md-slider-vertical{width:48px;min-height:128px}.md-slider-vertical .md-slider-track{width:2px;top:8px;bottom:8px;left:23px}.md-slider-vertical .md-slider-track::after{width:2px;border-top-width:2px;bottom:0}.md-slider-vertical .md-slider-track-fill{height:100%;width:2px;transform:scaleY(0)}.md-slider-vertical .md-slider-ticks-container{width:2px;height:100%}.md-slider-vertical .md-slider-ticks{background:repeating-linear-gradient(to bottom,rgba(0,0,0,.6),rgba(0,0,0,.6) 2px,transparent 0,transparent);width:2px;height:100%}.md-slider-vertical .md-slider-thumb-container{height:100%;width:0;left:50%}.md-slider-vertical .md-slider-thumb-label{bottom:-14px;left:-40px;transform:translateX(26px) scale(.4) rotate(-45deg)}.md-slider-vertical .md-slider-thumb-label-text{transform:rotate(45deg)}.md-slider-vertical.md-slider-active .md-slider-thumb-label{transform:rotate(-45deg)}[dir=rtl] .md-slider-track::after{left:0;right:auto}[dir=rtl] .md-slider-horizontal .md-slider-track-fill{transform-origin:100% 100%}[dir=rtl] .md-slider-horizontal.md-slider-axis-inverted .md-slider-track-fill{transform-origin:0 0}

package/slider/slider.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["slider.css"],"names":[],"mappings":"AAAA;EACE,sBAAsB;EACtB,mBAAmB;EACnB,uBAAuB;EACvB,aAAa;EACb,cAAc;EACd,uBAAuB,EAAE;;AAE3B;EACE,mBAAmB,EAAE;;AAEvB;EACE,mBAAmB;EACnB,sBAAsB;EACtB,6DAA6D,EAAE;;AAEjE;EACE,mBAAmB;EACnB,QAAQ;EACR,OAAO;EACP,iBAAiB,EAAE;;AAErB;EACE,WAAW;EACX,2DAA2D,EAAE;;AAE/D;EACE,mBAAmB;EACnB,WAAW;EACX,6DAA6D,EAAE;;AAEjE;EACE,mBAAmB;EACnB,aAAa;EACb,cAAc;EACd,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,sBAAsB;EACtB,6DAA6D,EAAE;;AAEjE;EACE,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,mBAAmB;EACnB,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,iDAAiD;EACjD,8CAA8C,EAAE;;AAElD;EACE,WAAW;EACX,gBAAgB;EAChB,kBAAkB;EAClB,WAAW;EACX,yDAAyD,EAAE;;AAE7D;;EAEE,yBAAyB,EAAE;;AAE7B;EACE,YAAY;EACZ,mBAAmB;EACnB,mCAAmC;EACnC,WAAW;EACX,yDAAyD,EAAE;;AAE7D;EACE,WAAW,EAAE;;AAEf;EACE,WAAW,EAAE;;AAEf;EACE,cAAc,EAAE;;AAElB;EACE,4BAA4B,EAAE;;AAEhC;EACE,oBAAoB,EAAE;;AAExB;EACE,oBAAoB,EAAE;;AAExB;EACE,yBAAyB,EAAE;;AAE7B;EACE,WAAW,EAAE;;AAEf;EACE,aAAa;EACb,iBAAiB,EAAE;EACnB;IACE,YAAY;IACZ,UAAU;IACV,UAAU;IACV,WAAW,EAAE;EACf;IACE,YAAY;IACZ,uBAAuB;IACvB,SAAS,EAAE;EACb;IACE,YAAY;IACZ,YAAY;IACZ,qBAAqB,EAAE;EACzB;IACE,YAAY;IACZ,YAAY,EAAE;EAChB;IACE,+HAA+H;IAC/H,qIAAqI;IACrI,YAAY;IACZ,YAAY,EAAE;EAChB;IACE,YAAY;IACZ,UAAU;IACV,SAAS,EAAE;EACb;IACE,aAAa;IACb,WAAW;IACX,qDAAqD,EAAE;EACzD;IACE,0BAA0B,EAAE;EAC9B;IACE,yBAAyB,EAAE;;AAE/B;EACE,YAAY;EACZ,kBAAkB,EAAE;EACpB;IACE,WAAW;IACX,SAAS;IACT,YAAY;IACZ,WAAW,EAAE;EACf;IACE,WAAW;IACX,sBAAsB;IACtB,UAAU,EAAE;EACd;IACE,aAAa;IACb,WAAW;IACX,qBAAqB,EAAE;EACzB;IACE,WAAW;IACX,aAAa,EAAE;EACjB;IACE,gIAAgI;IAChI,WAAW;IACX,aAAa,EAAE;EACjB;IACE,aAAa;IACb,SAAS;IACT,UAAU,EAAE;EACd;IACE,cAAc;IACd,YAAY;IACZ,sDAAsD,EAAE;EAC1D;IACE,yBAAyB,EAAE;EAC7B;IACE,0BAA0B,EAAE;;AAEhC;EACE,QAAQ;EACR,YAAY,EAAE;;AAEhB;EACE,4BAA4B,EAAE;;AAEhC;EACE,sBAAsB,EAAE","file":"slider.css","sourcesContent":["md-slider {\n  display: inline-block;\n  position: relative;\n  box-sizing: border-box;\n  padding: 8px;\n  outline: none;\n  vertical-align: middle; }\n\n.md-slider-track {\n  position: absolute; }\n\n.md-slider-track-fill {\n  position: absolute;\n  transform-origin: 0 0;\n  transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); }\n\n.md-slider-ticks-container {\n  position: absolute;\n  left: 0;\n  top: 0;\n  overflow: hidden; }\n\n.md-slider-ticks {\n  opacity: 0;\n  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1); }\n\n.md-slider-thumb-container {\n  position: absolute;\n  z-index: 1;\n  transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); }\n\n.md-slider-thumb {\n  position: absolute;\n  right: -10px;\n  bottom: -10px;\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  transform: scale(0.7);\n  transition: transform 400ms cubic-bezier(0.25, 0.8, 0.25, 1); }\n\n.md-slider-thumb-label {\n  display: none;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  width: 28px;\n  height: 28px;\n  border-radius: 50%;\n  transition: 300ms cubic-bezier(0.35, 0, 0.25, 1);\n  transition-property: transform, border-radius; }\n\n.md-slider-thumb-label-text {\n  z-index: 1;\n  font-size: 12px;\n  font-weight: bold;\n  opacity: 0;\n  transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); }\n\n.md-slider-sliding .md-slider-track-fill,\n.md-slider-sliding .md-slider-thumb-container {\n  transition-duration: 0ms; }\n\n.md-slider-has-ticks .md-slider-track::after {\n  content: '';\n  position: absolute;\n  border: 0 solid rgba(0, 0, 0, 0.6);\n  opacity: 0;\n  transition: opacity 300ms cubic-bezier(0.35, 0, 0.25, 1); }\n\n.md-slider-has-ticks.md-slider-active .md-slider-track::after, .md-slider-has-ticks:hover .md-slider-track::after {\n  opacity: 1; }\n\n.md-slider-has-ticks.md-slider-active .md-slider-ticks, .md-slider-has-ticks:hover .md-slider-ticks {\n  opacity: 1; }\n\n.md-slider-thumb-label-showing .md-slider-thumb-label {\n  display: flex; }\n\n.md-slider-axis-inverted .md-slider-track-fill {\n  transform-origin: 100% 100%; }\n\n.md-slider-active .md-slider-thumb {\n  transform: scale(1); }\n\n.md-slider-active.md-slider-thumb-label-showing .md-slider-thumb {\n  transform: scale(0); }\n\n.md-slider-active .md-slider-thumb-label {\n  border-radius: 50% 50% 0; }\n\n.md-slider-active .md-slider-thumb-label-text {\n  opacity: 1; }\n\n.md-slider-horizontal {\n  height: 48px;\n  min-width: 128px; }\n  .md-slider-horizontal .md-slider-track {\n    height: 2px;\n    top: 23px;\n    left: 8px;\n    right: 8px; }\n  .md-slider-horizontal .md-slider-track::after {\n    height: 2px;\n    border-left-width: 2px;\n    right: 0; }\n  .md-slider-horizontal .md-slider-track-fill {\n    height: 2px;\n    width: 100%;\n    transform: scaleX(0); }\n  .md-slider-horizontal .md-slider-ticks-container {\n    height: 2px;\n    width: 100%; }\n  .md-slider-horizontal .md-slider-ticks {\n    background: repeating-linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) 2px, transparent 0, transparent) repeat;\n    background: -moz-repeating-linear-gradient(0.0001deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) 2px, transparent 0, transparent) repeat;\n    height: 2px;\n    width: 100%; }\n  .md-slider-horizontal .md-slider-thumb-container {\n    width: 100%;\n    height: 0;\n    top: 50%; }\n  .md-slider-horizontal .md-slider-thumb-label {\n    right: -14px;\n    top: -40px;\n    transform: translateY(26px) scale(0.4) rotate(45deg); }\n  .md-slider-horizontal .md-slider-thumb-label-text {\n    transform: rotate(-45deg); }\n  .md-slider-horizontal.md-slider-active .md-slider-thumb-label {\n    transform: rotate(45deg); }\n\n.md-slider-vertical {\n  width: 48px;\n  min-height: 128px; }\n  .md-slider-vertical .md-slider-track {\n    width: 2px;\n    top: 8px;\n    bottom: 8px;\n    left: 23px; }\n  .md-slider-vertical .md-slider-track::after {\n    width: 2px;\n    border-top-width: 2px;\n    bottom: 0; }\n  .md-slider-vertical .md-slider-track-fill {\n    height: 100%;\n    width: 2px;\n    transform: scaleY(0); }\n  .md-slider-vertical .md-slider-ticks-container {\n    width: 2px;\n    height: 100%; }\n  .md-slider-vertical .md-slider-ticks {\n    background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6) 2px, transparent 0, transparent) repeat;\n    width: 2px;\n    height: 100%; }\n  .md-slider-vertical .md-slider-thumb-container {\n    height: 100%;\n    width: 0;\n    left: 50%; }\n  .md-slider-vertical .md-slider-thumb-label {\n    bottom: -14px;\n    left: -40px;\n    transform: translateX(26px) scale(0.4) rotate(-45deg); }\n  .md-slider-vertical .md-slider-thumb-label-text {\n    transform: rotate(45deg); }\n  .md-slider-vertical.md-slider-active .md-slider-thumb-label {\n    transform: rotate(-45deg); }\n\n[dir='rtl'] .md-slider-track::after {\n  left: 0;\n  right: auto; }\n\n[dir='rtl'] .md-slider-horizontal .md-slider-track-fill {\n  transform-origin: 100% 100%; }\n\n[dir='rtl'] .md-slider-horizontal.md-slider-axis-inverted .md-slider-track-fill {\n  transform-origin: 0 0; }\n"]}

package/slider/slider.d.ts

@@ -1,176 +0,0 @@
-import { ModuleWithProviders, ElementRef, EventEmitter } from '@angular/core';
-import { ControlValueAccessor } from '@angular/forms';
-import { HammerInput } from '../core';
-import { Dir } from '../core/rtl/dir';
-/**
- * Provider Expression that allows md-slider to register as a ControlValueAccessor.
- * This allows it to support [(ngModel)] and [formControl].
- */
-export declare const MD_SLIDER_VALUE_ACCESSOR: any;
-/** A simple change event emitted by the MdSlider component. */
-export declare class MdSliderChange {
-    source: MdSlider;
-    value: number;
-}
-/**
- * Allows users to select from a range of values by moving the slider thumb. It is similar in
- * behavior to the native `<input type="range">` element.
- */
-export declare class MdSlider implements ControlValueAccessor {
-    private _dir;
-    /** A renderer to handle updating the slider's thumb and fill track. */
-    private _renderer;
-    /** The dimensions of the slider. */
-    private _sliderDimensions;
-    private _disabled;
-    /** Whether or not the slider is disabled. */
-    disabled: boolean;
-    private _thumbLabel;
-    /** Whether or not to show the thumb label. */
-    thumbLabel: boolean;
-    /** @deprecated */
-    _thumbLabelDeprecated: boolean;
-    private _controlValueAccessorChangeFn;
-    /** The last value for which a change event was emitted. */
-    private _lastEmittedValue;
-    /** onTouch function registered via registerOnTouch (ControlValueAccessor). */
-    onTouched: () => any;
-    /**
-     * Whether or not the thumb is sliding.
-     * Used to determine if there should be a transition for the thumb and fill track.
-     */
-    _isSliding: boolean;
-    /**
-     * Whether or not the slider is active (clicked or sliding).
-     * Used to shrink and grow the thumb as according to the Material Design spec.
-     */
-    _isActive: boolean;
-    private _step;
-    /** The values at which the thumb will snap. */
-    step: number;
-    private _tickInterval;
-    /**
-     * How often to show ticks. Relative to the step so that a tick always appears on a step.
-     * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).
-     */
-    tickInterval: number | "auto";
-    /** @deprecated */
-    _tickIntervalDeprecated: number | "auto";
-    private _tickIntervalPercent;
-    /** The size of a tick interval as a percentage of the size of the track. */
-    readonly tickIntervalPercent: number;
-    private _percent;
-    /** The percentage of the slider that coincides with the value. */
-    readonly percent: number;
-    private _value;
-    /** Value of the slider. */
-    value: number;
-    private _min;
-    /** The miniumum value that the slider can have. */
-    min: number;
-    private _max;
-    /** The maximum value that the slider can have. */
-    max: number;
-    /** Whether the slider is inverted. */
-    invert: any;
-    private _invert;
-    /** Whether the slider is vertical. */
-    vertical: any;
-    private _vertical;
-    /**
-     * Whether the axis of the slider is inverted.
-     * (i.e. whether moving the thumb in the positive x or y direction decreases the slider's value).
-     */
-    readonly invertAxis: any;
-    /**
-     * Whether mouse events should be converted to a slider position by calculating their distance
-     * from the right or bottom edge of the slider as opposed to the top or left.
-     */
-    readonly invertMouseCoords: any;
-    /** CSS styles for the track fill element. */
-    readonly trackFillStyles: {
-        [key: string]: string;
-    };
-    /** CSS styles for the ticks container element. */
-    readonly ticksContainerStyles: {
-        [key: string]: string;
-    };
-    /** CSS styles for the ticks element. */
-    readonly ticksStyles: {
-        [key: string]: string;
-    };
-    readonly thumbContainerStyles: {
-        [key: string]: string;
-    };
-    /** The language direction for this slider element. */
-    readonly direction: string;
-    /** Event emitted when the slider value has changed. */
-    change: EventEmitter<MdSliderChange>;
-    constructor(_dir: Dir, elementRef: ElementRef);
-    _onMouseenter(): void;
-    _onClick(event: MouseEvent): void;
-    _onSlide(event: HammerInput): void;
-    _onSlideStart(event: HammerInput): void;
-    _onSlideEnd(): void;
-    _onBlur(): void;
-    _onKeydown(event: KeyboardEvent): void;
-    /** Increments the slider by the given number of steps (negative number decrements). */
-    private _increment(numSteps);
-    /** Calculate the new value from the new physical location. The value will always be snapped. */
-    private _updateValueFromPosition(pos);
-    /** Emits a change event if the current value is different from the last emitted value. */
-    private _emitValueIfChanged();
-    /** Updates the amount of space between ticks as a percentage of the width of the slider. */
-    private _updateTickIntervalPercent();
-    /** Calculates the percentage of the slider that a value is. */
-    private _calculatePercentage(value);
-    /** Calculates the value a percentage of the slider corresponds to. */
-    private _calculateValue(percentage);
-    /** Return a number between two numbers. */
-    private _clamp(value, min?, max?);
-    /**
-     * Sets the model value. Implemented as part of ControlValueAccessor.
-     * @param value
-     */
-    writeValue(value: any): void;
-    /**
-     * Registers a callback to eb triggered when the value has changed.
-     * Implemented as part of ControlValueAccessor.
-     * @param fn Callback to be registered.
-     */
-    registerOnChange(fn: (value: any) => void): void;
-    /**
-     * Registers a callback to be triggered when the component is touched.
-     * Implemented as part of ControlValueAccessor.
-     * @param fn Callback to be registered.
-     */
-    registerOnTouched(fn: any): void;
-    /**
-     * Sets whether the component should be disabled.
-     * Implemented as part of ControlValueAccessor.
-     * @param isDisabled
-     */
-    setDisabledState(isDisabled: boolean): void;
-}
-/**
- * Renderer class in order to keep all dom manipulation in one place and outside of the main class.
- * @docs-private
- */
-export declare class SliderRenderer {
-    private _sliderElement;
-    constructor(elementRef: ElementRef);
-    /**
-     * Get the bounding client rect of the slider track element.
-     * The track is used rather than the native element to ignore the extra space that the thumb can
-     * take up.
-     */
-    getSliderDimensions(): ClientRect;
-    /**
-     * Focuses the native element.
-     * Currently only used to allow a blur event to fire but will be used with keyboard input later.
-     */
-    addFocus(): void;
-}
-export declare class MdSliderModule {
-    static forRoot(): ModuleWithProviders;
-}

package/slider/slider.html

@@ -1 +0,0 @@
-<div class="md-slider-track"><div class="md-slider-track-fill" [ngStyle]="trackFillStyles"></div><div class="md-slider-ticks-container" [ngStyle]="ticksContainerStyles"><div class="md-slider-ticks" [ngStyle]="ticksStyles"></div></div><div class="md-slider-thumb-container" [ngStyle]="thumbContainerStyles"><div class="md-slider-thumb"></div><div class="md-slider-thumb-label"><span class="md-slider-thumb-label-text">{{value}}</span></div></div></div>