@taiga-ui/kit/bundles/taiga-ui-kit-components-input-range.umd.min.js

Taiga UI Angular main components kit

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/forms"),require("@taiga-ui/cdk"),require("@taiga-ui/core"),require("@taiga-ui/kit/abstract"),require("@angular/common"),require("@taiga-ui/kit/components/range"),require("angular2-text-mask")):"function"==typeof define&&define.amd?define("@taiga-ui/kit/components/input-range",["exports","@angular/core","@angular/forms","@taiga-ui/cdk","@taiga-ui/core","@taiga-ui/kit/abstract","@angular/common","@taiga-ui/kit/components/range","angular2-text-mask"],t):t(((e=e||self)["taiga-ui"]=e["taiga-ui"]||{},e["taiga-ui"].kit=e["taiga-ui"].kit||{},e["taiga-ui"].kit.components=e["taiga-ui"].kit.components||{},e["taiga-ui"].kit.components["input-range"]={}),e.ng.core,e.ng.forms,e.cdk,e.core$1,e["taiga-ui"].kit.abstract,e.ng.common,e["taiga-ui"].kit.components.range,e.angular2TextMask)}(this,(function(e,t,i,n,a,o,r,l,s){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */var u=function(e,t){return(u=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(e,t)};function d(e,t,i,n){var a,o=arguments.length,r=o<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,n);else for(var l=e.length-1;l>=0;l--)(a=e[l])&&(r=(o<3?a(r):o>3?a(t,i,r):a(t,i))||r);return o>3&&r&&Object.defineProperty(t,i,r),r}function p(e,t){return function(i,n){t(i,n,e)}}var h=function(e){function o(t,i,n,a){var o=e.call(this,t,i)||this;return o.modeDirective=n,o.isMobile=a,o}var r;return function(e,t){function i(){this.constructor=e}u(e,t),e.prototype=null===t?Object.create(t):(i.prototype=t.prototype,new i)}(o,e),r=o,Object.defineProperty(o.prototype,"nativeFocusableElement",{get:function(){return!this.nativeLeft||this.disabled?null:this.nativeLeft.nativeElement},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"focused",{get:function(){return this.focusedLeft||this.focusedRight},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"focusedLeft",{get:function(){return!!this.nativeLeft&&n.isNativeFocused(this.nativeLeft.nativeElement)},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"focusedRight",{get:function(){return!!this.nativeRight&&n.isNativeFocused(this.nativeRight.nativeElement)},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"showMinLabel",{get:function(){return!this.focusedLeft&&!!this.minLabel&&this.value[0]===this.min},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"showMaxLabel",{get:function(){return!this.focusedRight&&!!this.maxLabel&&this.value[1]===this.max},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"inputValueLeft",{get:function(){return this.nativeLeft?this.nativeLeft.nativeElement.value:""},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"inputValueRight",{get:function(){return this.nativeRight?this.nativeRight.nativeElement.value:""},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"computedValueLeft",{get:function(){return a.formatNumber(this.value[0])},enumerable:!0,configurable:!0}),Object.defineProperty(o.prototype,"computedValueRight",{get:function(){return a.formatNumber(this.value[1])},enumerable:!0,configurable:!0}),o.prototype.onActiveZone=function(e){this.updateFocused(e)},o.prototype.onMouseDown=function(){this.nativeRight&&!this.isMobile&&n.setNativeFocused(this.nativeRight.nativeElement)},o.prototype.onKeyDownArrowUpLeft=function(e){this.readOnly||(e.preventDefault(),this.processStep(!0,!1))},o.prototype.onKeyDownArrowDownLeft=function(e){this.readOnly||(e.preventDefault(),this.processStep(!1,!1))},o.prototype.onKeyDownArrowUpRight=function(e){this.readOnly||(e.preventDefault(),this.processStep(!0,!0))},o.prototype.onKeyDownArrowDownRight=function(e){this.readOnly||(e.preventDefault(),this.processStep(!1,!0))},o.prototype.onInputLeft=function(){var e=this.inputValueLeft,t=this.capInputValue(e,this.value[1]),i=","===e.slice(-1)[0]?",":"";if(!a.maskedMoneyValueIsEmpty(e)&&null!==t){var n=a.formatNumber(t)+i;this.nativeLeft&&this.inputValueLeft!==n&&(this.nativeLeft.nativeElement.value=n),this.updateValue([t,this.value[1]])}},o.prototype.onInputRight=function(){var e=this.inputValueRight,t=this.capInputValue(e),i=","===e.slice(-1)[0]?",":"";if(!a.maskedMoneyValueIsEmpty(e)&&null!==t){var n=a.formatNumber(t)+i;this.nativeRight&&this.inputValueRight!==n&&(this.nativeRight.nativeElement.value=n),t>=this.value[0]&&this.updateValue([this.value[0],t])}},o.prototype.onRangeValue=function(e){var t=this,i=e.map((function(e){return t.valueGuard(e)}));if(this.nativeLeft&&this.nativeRight&&(i[0]!==this.value[0]||i[1]!==this.value[1])){if(!this.isMobile){var o=i[0]!==this.value[0]?this.nativeLeft.nativeElement:this.nativeRight.nativeElement;n.setNativeFocused(o)}this.updateValue(i),this.nativeLeft.nativeElement.value=a.formatNumber(i[0])}},o.prototype.onLeftFocused=function(e){if(!e&&this.nativeLeft){var t=a.maskedNumberStringToNumber(this.computedValueLeft),i=isNaN(t)?this.min:this.valueGuard(t);this.nativeLeft.nativeElement.value=a.formatNumber(i),i!==this.value[0]&&this.updateValue([i,this.value[1]])}},o.prototype.onRightFocused=function(e){if(!e&&this.nativeRight){var t=a.maskedNumberStringToNumber(this.computedValueRight),i=isNaN(t)?this.value[0]:this.valueGuard(Math.max(t,this.value[0]));this.nativeRight.nativeElement.value=a.formatNumber(i),i!==this.value[1]&&this.updateValue([this.value[0],i])}},o.prototype.getFallbackValue=function(){return[0,0]},o.prototype.processStep=function(e,t){var i=this.valueGuard(e?this.value[0]+this.step:this.value[0]-this.step),n=this.valueGuard(e?this.value[1]+this.step:this.value[1]-this.step),a=[t?this.value[0]:Math.min(i,this.value[1]),t?Math.max(n,this.value[0]):this.value[1]];a[0]===this.value[0]&&a[1]===this.value[1]||this.updateValue(a)},o.ctorParameters=function(){return[{type:i.NgControl,decorators:[{type:t.Optional},{type:t.Self},{type:t.Inject,args:[i.NgControl]}]},{type:t.ChangeDetectorRef,decorators:[{type:t.Inject,args:[t.ChangeDetectorRef]}]},{type:a.TuiModeDirective,decorators:[{type:t.Optional},{type:t.Inject,args:[a.TuiModeDirective]}]},{type:Boolean,decorators:[{type:t.Inject,args:[n.TUI_IS_MOBILE]}]}]},d([t.ViewChild("nativeLeft")],o.prototype,"nativeLeft",void 0),d([t.ViewChild("nativeRight")],o.prototype,"nativeRight",void 0),d([t.HostBinding("class._min-label")],o.prototype,"showMinLabel",null),d([t.HostBinding("class._max-label")],o.prototype,"showMaxLabel",null),o=r=d([t.Component({selector:"tui-input-range",template:'<div class="zone" (tuiActiveZoneChange)="onActiveZone($event)">\n    <tui-wrapper\n        appearance="textfield"\n        [readOnly]="readOnly"\n        [disabled]="disabled"\n        [focused]="computedFocused"\n        [hovered]="computedHovered"\n        [invalid]="computedInvalid"\n    >\n        <span\n            *ngIf="hasPlaceholder"\n            class="placeholder"\n            automation-id="tui-input-range__placeholder"\n        >\n            <ng-content></ng-content>\n        </span>\n        <div class="content">\n            <span *ngIf="!showMinLabel" class="label">\n                <span class="value">{{inputValueLeft}}</span>\n                <span\n                    *ngIf="isPluralized(pluralize)"\n                    class="pluralize"\n                    automation-id="tui-input-range__pluralize-left"\n                >\n                    {{value[0] | tuiPluralize: pluralize}}\n                </span>\n            </span>\n            <span\n                *ngIf="showMinLabel"\n                class="label"\n                automation-id="tui-input-range__min-label"\n            >\n                {{minLabel}}\n            </span>\n            <span\n                *ngIf="showMaxLabel"\n                automation-id="tui-input-range__max-label"\n                class="max"\n            >\n                {{maxLabel}}\n            </span>\n        </div>\n        <tui-range\n            class="slider"\n            [min]="min"\n            [max]="max"\n            [steps]="computedSteps"\n            [segments]="segments"\n            [keySteps]="keySteps"\n            [pluralize]="segmentsPluralize"\n            [focusable]="false"\n            [disabled]="readOnly || disabled"\n            [ngModel]="value"\n            (ngModelChange)="onRangeValue($event)"\n            (mousedown.prevent)="onMouseDown()"\n        ></tui-range>\n    </tui-wrapper>\n\n    <div class="native-wrapper" (tuiHoveredChange)="onHovered($event)">\n        <input\n            #nativeLeft\n            class="native"\n            automation-id="tui-input-range__native-left"\n            [disabled]="disabled"\n            [readOnly]="readOnly"\n            [class.native_hidden]="showMinLabel"\n            [tuiInputMode]="inputMode"\n            [tuiFocusable]="focusable"\n            [textMask]="quantum | tuiMapper: mask: min"\n            [ngModel]="computedValueLeft"\n            (ngModelChange)="onInputLeft()"\n            (tuiFocusedChange)="onLeftFocused($event)"\n            (keydown.arrowUp)="onKeyDownArrowUpLeft($event)"\n            (keydown.arrowDown)="onKeyDownArrowDownLeft($event)"\n        />\n        <input\n            #nativeRight\n            class="native native_right"\n            automation-id="tui-input-range__native-right"\n            [disabled]="disabled"\n            [readOnly]="readOnly"\n            [class.native_hidden]="showMaxLabel"\n            [tuiInputMode]="inputMode"\n            [tuiFocusable]="focusable"\n            [textMask]="quantum | tuiMapper: mask: min"\n            [ngModel]="computedValueRight"\n            (ngModelChange)="onInputRight()"\n            (tuiFocusedChange)="onRightFocused($event)"\n            (keydown.arrowUp)="onKeyDownArrowUpRight($event)"\n            (keydown.arrowDown)="onKeyDownArrowDownRight($event)"\n        />\n        <span\n            *ngIf="isPluralized(pluralize) && !showMaxLabel"\n            class="pluralize pluralize_right"\n            automation-id="tui-input-range__pluralize-right"\n            (mousedown)="onMouseDown()"\n        >\n            {{value[1] | tuiPluralize: pluralize}}\n        </span>\n    </div>\n</div>\n',changeDetection:t.ChangeDetectionStrategy.OnPush,providers:[{provide:n.TUI_FOCUSABLE_ITEM_ACCESSOR,useExisting:t.forwardRef((function(){return r}))}],styles:[":host{font:var(--tui-font-text-m);position:relative;z-index:0;display:block;border-radius:var(--tui-radius-m);color:var(--tui-text-01)}:host._segmented{border-bottom:26px solid transparent}:host[data-mode=onDark]{color:var(--tui-base-01)}.zone{border-radius:inherit}.native-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;display:flex}.pluralize{display:flex;align-items:center;padding-right:12px;margin-left:-8px}.pluralize_right{margin-left:-12px}:host[data-tui-host-size='l'] .pluralize_right{padding-top:20px}:host._disabled .pluralize_right{color:var(--tui-text-03)}:host[data-mode=onDark]._disabled .pluralize_right{color:var(--tui-text-03-night)}.native{padding:0 16px;border:0;border-radius:inherit;background:0 0;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;flex:1;min-width:0;color:var(--tui-text-01);box-sizing:border-box;outline:0}.native:-webkit-autofill,.native:-webkit-autofill:focus,.native:-webkit-autofill:hover{border-radius:inherit;-webkit-text-fill-color:inherit!important;color:inherit!important;background-color:transparent!important;-webkit-box-shadow:0 0 0 1000px var(--tui-autofill) inset!important}.native_right{text-align:right}.native_hidden{opacity:0}:host._disabled .native{color:var(--tui-text-03);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host[data-tui-host-size='l'] .native{padding:20px 16px 0}:host[data-mode=onDark] .native{color:var(--tui-text-01-night)}:host[data-mode=onDark]._disabled .native{color:var(--tui-text-03-night)}.content{display:flex;height:var(--tui-height-m);padding:0 16px;justify-content:space-between;align-items:center}:host[data-tui-host-size='l'] .content{height:var(--tui-height-l);padding:0 16px}:host[data-tui-host-size='l']._disabled .content{color:var(--tui-text-03)}:host[data-tui-host-size='l'][data-mode=onDark]._disabled .content{color:var(--tui-text-03-night)}.placeholder{transition-property:transform,min-width,color,letter-spacing;transition-duration:.3s;transition-timing-function:ease-in-out;font:var(--tui-font-text-s);color:var(--tui-text-01);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;font-size:13px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;color:var(--tui-text-02);transform-origin:left;letter-spacing:normal;text-transform:none;position:absolute;top:0;width:100%;height:100%;left:16px;transform:translateY(-10px) scale(.87);line-height:var(--tui-height-l);max-width:calc(114% - 32px)}.placeholder_raised{width:114%;transform:translateY(-10px) scale(.87)}:host[data-tui-host-size='m'] .placeholder_raised{width:118%;transform:translateY(-8px) scale(.85);letter-spacing:.4px}:host._invalid:not(._focused) .placeholder_raised,:host._invalid:not(._focused)._hovered .placeholder_raised{color:var(--tui-error-fill)}:host[data-mode=onDark]._invalid:not(._focused) .placeholder_raised,:host[data-mode=onDark]._invalid:not(._focused)._hovered .placeholder_raised{color:var(--tui-error-fill-night)}:host._focused .placeholder,:host[data-tui-host-size='l']._focused._label-outside .placeholder,:host[data-tui-host-size='m']._focused._label-outside .placeholder{color:var(--tui-text-03)}:host[data-tui-host-size='l'] .placeholder{font-size:15px}:host[data-tui-host-size='l']._focused:not(._label-outside) .placeholder,:host[data-tui-host-size='m']._focused:not(._label-outside) .placeholder{color:var(--tui-text-01)}:host[data-mode=onDark] .placeholder{color:var(--tui-text-02-night)}:host[data-tui-host-size='l'][data-mode=onDark]._focused:not(._label-outside) .placeholder,:host[data-tui-host-size='m'][data-mode=onDark]._focused:not(._label-outside) .placeholder{color:var(--tui-text-01-night)}:host[data-mode=onDark]._focused .placeholder,:host[data-tui-host-size='l'][data-mode=onDark]._focused._label-outside .placeholder,:host[data-tui-host-size='m'][data-mode=onDark]._focused._label-outside .placeholder{color:var(--tui-text-02-night)}.value{visibility:hidden;overflow:hidden;padding-right:12px}:host._disabled .value{color:var(--tui-text-03)}.label{display:flex;width:50%}:host[data-tui-host-size='l'] .label{padding-top:20px}.max{text-align:right;flex:1}:host[data-tui-host-size='l'] .max{padding-top:20px;line-height:calc(var(--tui-height-l) - 20px)}.slider{position:absolute;top:100%;left:0;right:0;z-index:1;border-top-left-radius:0;border-top-right-radius:0;margin:-9px 0 0;color:transparent}:host._disabled .slider,:host._readonly .slider{pointer-events:none}"]}),p(0,t.Optional()),p(0,t.Self()),p(0,t.Inject(i.NgControl)),p(1,t.Inject(t.ChangeDetectorRef)),p(2,t.Optional()),p(2,t.Inject(a.TuiModeDirective)),p(3,t.Inject(n.TUI_IS_MOBILE))],o)}(o.AbstractTuiInputSlider),c=function(){function e(){}return e=d([t.NgModule({imports:[r.CommonModule,i.FormsModule,i.ReactiveFormsModule,s.TextMaskModule,n.TuiFocusableModule,n.TuiFocusedModule,n.TuiHoveredModule,n.TuiPressedModule,n.TuiMapperPipeModule,n.TuiInputModeModule,n.TuiActiveZoneModule,a.TuiPluralizePipeModule,l.TuiRangeModule,a.TuiWrapperModule],declarations:[h],exports:[h]})],e)}();e.TuiInputRangeComponent=h,e.TuiInputRangeModule=c,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=taiga-ui-kit-components-input-range.umd.min.js.map