@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
1 lines • 7 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"SliderComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":25,"character":1},"arguments":[{"selector":"d-slider","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":19,"character":11},"useExisting":{"__symbolic":"reference","name":"SliderComponent"},"multi":true}],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":30,"character":19},"member":"OnPush"},"template":"<div class=\"devui-slider\" #slider [ngClass]=\"{ disabled: disabled }\">\r\n <div class=\"devui-slider-rail\" #sliderRail [ngClass]=\"{ disabled: disabled }\"></div>\r\n <div class=\"devui-slider-track\" #sliderTrack [ngClass]=\"{ disabled: disabled }\"></div>\r\n <div\r\n class=\"devui-slider-handle\"\r\n #sliderHandle\r\n [ngClass]=\"{ disabled: disabled }\"\r\n dPopover\r\n position=\"top\"\r\n [content]=\"showValuePopover && tipsRenderer ? tipsRenderer(value) : ''\"\r\n [showAnimate]=\"false\"\r\n [visible]=\"tipsRenderer && showValuePopover\"\r\n ></div>\r\n</div>\r\n","styles":[":host{display:block}.devui-slider{position:relative;width:100%;padding:5px 0;margin:5px 0;cursor:pointer;box-sizing:border-box;height:15px}.devui-slider .devui-slider-rail{position:absolute;background-color:#f8f8f8;height:5px;width:100%;-webkit-transition:background-color .2s ease-in-out;transition:background-color .2s ease-in-out}.devui-slider .devui-slider-rail.disabled,.devui-slider:hover .devui-slider-rail:not(.disabled){background-color:#f8f8f8}.devui-slider:hover .devui-slider-track:not(.disabled){background-color:#344899}.devui-slider:hover .devui-slider-handle:not(.disabled){border-color:#344899}.devui-slider .devui-slider-track{position:absolute;background-color:#5e7ce0;height:5px;width:0}.devui-slider .devui-slider-handle{position:absolute;background-color:#fff;width:14px;height:14px;border-radius:50%;margin-left:-7px;margin-top:-5px;left:0;-webkit-transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out;border:2px solid #5e7ce0}.devui-slider .devui-slider-handle:not(.disabled):active,.devui-slider .devui-slider-handle:not(.disabled):hover{-webkit-transform:scale(1.3);transform:scale(1.3)}.devui-slider.disabled{cursor:not-allowed;opacity:.3}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":34,"character":27}]}],"slider":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":49,"character":3},"arguments":["slider",{"static":true}]}]}],"sliderHandle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":50,"character":3},"arguments":["sliderHandle",{"static":true}]}]}],"sliderTrack":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":51,"character":3},"arguments":["sliderTrack",{"static":true}]}]}],"sliderRail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":52,"character":3},"arguments":["sliderRail",{"static":true}]}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"tipsRenderer":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"checkRangeValues":[{"__symbolic":"method"}],"checkStepValue":[{"__symbolic":"method"}],"ratioToValue":[{"__symbolic":"method"}],"convertHandlePositionToRatio":[{"__symbolic":"method"}],"clamp":[{"__symbolic":"method"}],"updateStyle":[{"__symbolic":"method"}],"registerMouseEventsListeners":[{"__symbolic":"method"}],"getSliderPagePosition":[{"__symbolic":"method"}],"getRailLength":[{"__symbolic":"method"}],"mousePositionToAdaptiveValue":[{"__symbolic":"method"}],"getDecimals":[{"__symbolic":"method"}],"mouseStartMoving":[{"__symbolic":"method"}],"mouseMoving":[{"__symbolic":"method"}],"mouseStopMoving":[{"__symbolic":"method"}],"subscribeMouseActions":[{"__symbolic":"method"}],"unsubscribeMouseActions":[{"__symbolic":"method"}],"handleController":[{"__symbolic":"method"}],"toggleDisabled":[{"__symbolic":"method"}],"setValue":[{"__symbolic":"method"}],"ensureValueInRange":[{"__symbolic":"method"}],"updateTrackAndHandle":[{"__symbolic":"method"}],"valueMustBeValid":[{"__symbolic":"method"}],"valueToOffset":[{"__symbolic":"method"}],"registerHandleHoverPopoverListener":[{"__symbolic":"method"}],"sliderHandlePopoverOnMouseHover":[{"__symbolic":"method"}],"sliderHandlePopoverOnMouseLeave":[{"__symbolic":"method"}],"unregisterHandleHoverTooltip":[{"__symbolic":"method"}],"showValuePopoverController":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"SliderModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":7,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":10,"character":4},{"__symbolic":"reference","module":"ng-devui/popover","name":"PopoverModule","line":11,"character":4}],"exports":[{"__symbolic":"reference","name":"SliderComponent"}],"declarations":[{"__symbolic":"reference","name":"SliderComponent"}],"providers":[]}]}],"members":{}}},"origins":{"SliderComponent":"./slider.component","SliderModule":"./slider.module"},"importAs":"ng-devui/slider"}