@radial-color-picker/angular-color-picker/bundles/radial-color-picker-angular-color-picker.umd.min.js

Radial Color Picker - Angular

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/cdk/coercion"),require("@angular/cdk/platform"),require("@angular/core"),require("rxjs"),require("rxjs/operators"),require("@angular/animations"),require("@angular/forms"),require("@angular/platform-browser"),require("@angular/common"),require("@angular/platform-browser/animations")):"function"==typeof define&&define.amd?define("@radial-color-picker/angular-color-picker",["exports","@angular/cdk/coercion","@angular/cdk/platform","@angular/core","rxjs","rxjs/operators","@angular/animations","@angular/forms","@angular/platform-browser","@angular/common","@angular/platform-browser/animations"],e):e(((t=t||self)["radial-color-picker"]=t["radial-color-picker"]||{},t["radial-color-picker"]["angular-color-picker"]={}),t.ng.cdk.coercion,t.ng.cdk.platform,t.ng.core,t.rxjs,t.rxjs.operators,t.ng.animations,t.ng.forms,t.ng.platformBrowser,t.ng.common,t.ng.platformBrowser.animations)}(this,(function(t,e,i,o,n,r,a,s,l,c,u){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation. All rights reserved.
    Licensed under the Apache License, Version 2.0 (the "License"); you may not use
    this file except in compliance with the License. You may obtain a copy of the
    License at http://www.apache.org/licenses/LICENSE-2.0

    THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
    KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
    WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
    MERCHANTABLITY OR NON-INFRINGEMENT.

    See the Apache Version 2.0 License for specific language governing permissions
    and limitations under the License.
    ***************************************************************************** */function p(t,e,i,o){var n,r=arguments.length,a=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,o);else for(var s=t.length-1;s>=0;s--)(n=t[s])&&(a=(r<3?n(a):r>3?n(e,i,a):n(e,i))||a);return r>3&&a&&Object.defineProperty(e,i,a),a}var h,d=function(t){var e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);return{r:parseInt(e[1],16),g:parseInt(e[2],16),b:parseInt(e[3],16)}},f=function(t){var e=/^(?:rgb\((\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\))$/i.exec(t);return{r:parseInt(e[1],10),g:parseInt(e[2],10),b:parseInt(e[3],10)}},m=function(t){var e=/^(?:hsl\((\d{1,3})\s*,\s*(\d{1,3})%\s*,\s*(\d{1,3})%\))$/i.exec(t);return{h:parseInt(e[1],10),s:parseInt(e[2],10),l:parseInt(e[3],10)}},b=function(t,e,i){return((1<<24)+(t<<16)+(e<<8)+i).toString(16).slice(1)},y=function(t,e,i){var o,n;t/=255,e/=255,i/=255;var r=Math.max(t,e,i),a=Math.min(t,e,i),s=(r+a)/2;if(r===a)o=n=0;else{var l=r-a;n=s>.5?l/(2-r-a):l/(r+a),r===t&&(o=(e-i)/l+(e<i?6:0)),r===e&&(o=(i-t)/l+2),r===i&&(o=(t-e)/l+4)}return{hue:60*o,saturation:100*n,luminosity:100*s}},g=function(t,e,i){var o=v(t,e,i);return b(o.red,o.green,o.blue)},v=function(t,e,i){var o,n,r;if(t/=360,i/=100,0===(e/=100))o=n=r=i;else{var a=i<.5?i*(1+e):i+e-i*e,s=2*i-a;o=x(s,a,t+1/3),n=x(s,a,t),r=x(s,a,t-1/3)}return{red:Math.round(255*o),green:Math.round(255*n),blue:Math.round(255*r)}},x=function(t,e,i){return i<0&&(i+=1),i>1&&(i-=1),i<1/6?t+6*(e-t)*i:i<.5?e:i<2/3?t+(e-t)*(2/3-i)*6:t},k=function(t,e,i){void 0===i&&(i=.77),t.width=t.height=e;var o=e/2,n=2*Math.PI/360,r=t.getContext("2d");r.clearRect(0,0,e,e);for(var a=0;a<360;a+=.2){var s=(a-1)*n,l=(a+.2)*n;r.beginPath(),r.arc(o,o,o/2,s,l,!1),r.strokeStyle="hsl("+a+", 100%, 50%)",r.lineWidth=o,r.closePath(),r.stroke()}return r.fillStyle="rgb(255, 255, 255)",r.beginPath(),r.arc(o,o,o*i,0,2*Math.PI,!0),r.closePath(),r.fill(),r.strokeStyle="rgb(255, 255, 255)",r.lineWidth=2,r.beginPath(),r.arc(o,o,o,0,2*Math.PI),r.stroke(),t},E={sin90:Math.sin(270*Math.PI/180),sin180:Math.sin(180*Math.PI/180),sin270:Math.sin(90*Math.PI/180),cos90:Math.cos(270*Math.PI/180),cos180:Math.cos(180*Math.PI/180),cos270:Math.cos(90*Math.PI/180)},w={I:"q1",II:"q2",III:"q3",IV:"q4"},P=function(t){return t.x>0?t.y>0?w.I:w.IV:t.y>0?w.II:w.III},I=function(t,e,i,o){return Math.sqrt((t-i)*(t-i)+(e-o)*(e-o))},S=function(t,e){var i=t.x,o=t.y,n=0;switch(e){case w.II:n=270,i=t.x*E.cos90-t.y*E.sin90,o=t.x*E.sin90+t.y*E.cos90;break;case w.III:n=180,i=t.x*E.cos180-t.y*E.sin180,o=t.x*E.sin180+t.y*E.cos180;break;case w.IV:n=90,i=t.x*E.cos270-t.y*E.sin270,o=t.x*E.sin270+t.y*E.cos270}return Math.atan(I(0,o,i,o)/I(0,o,0,0))*(180/Math.PI)+n},A=function(){function t(t,e,i){this.el=t,this.renderer=e,this.platform=i,this.dragging=!1,this.rotateStart=new o.EventEmitter,this.rotating=new o.EventEmitter,this.rotateStop=new o.EventEmitter,this.platform.IOS||this.platform.ANDROID?(this.mouseDownEv="touchstart",this.mouseUpEv="touchend",this.mouseMoveEv="touchmove",this.cancelEv="touchcancel"):(this.mouseDownEv="mousedown",this.mouseUpEv="mouseup",this.mouseMoveEv="mousemove",this.cancelEv="mouseout")}return Object.defineProperty(t.prototype,"isDisabled",{get:function(){return!!this.disable&&e.coerceBooleanProperty(this.disable)},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){},t.prototype.ngOnChanges=function(t){if(t.angle&&t.angle.currentValue){var e=t.angle.currentValue+90;this.renderer.setStyle(this.el.nativeElement,"transform","rotate("+e+"deg)")}},t.prototype.ngAfterViewInit=function(){var t=this;requestAnimationFrame(this.initialRender.bind(this)),this.rect=this.el.nativeElement.getBoundingClientRect(),this.mouseUp$=n.fromEvent(this.el.nativeElement,this.mouseUpEv,{passive:!0}),this.mouseOut$=n.fromEvent(this.el.nativeElement,this.cancelEv,{passive:!0}),this.mouseDownSub=n.fromEvent(this.el.nativeElement,this.mouseDownEv,{passive:!0}).pipe(r.filter((function(e){return t.active&&!t.isDisabled}))).subscribe((function(e){t.dragging=!0,t.rect=t.el.nativeElement.getBoundingClientRect(),t.point=t.createPoint(e),t.rotateStart.emit(t.point),t.applyRotation(),t.mouseMoveSub=n.fromEvent(t.el.nativeElement,t.mouseMoveEv).pipe(r.takeUntil(n.merge(t.mouseOut$,t.mouseUp$).pipe(r.tap((function(e){t.rect=t.el.nativeElement.getBoundingClientRect(),t.dragging=!1,t.mouseMoveSub.unsubscribe(),t.rotateStop.emit(t.point)}))))).subscribe((function(e){t.rect=t.el.nativeElement.getBoundingClientRect(),t.point=t.createPoint(e),t.applyRotation()}))}))},t.prototype.initialRender=function(){var t=this.angle+90;this.renderer.setStyle(this.el.nativeElement,"transform","rotate("+t+"deg)")},t.prototype.rotationRender=function(){this.renderer.setStyle(this.el.nativeElement,"transform","rotate("+this.rotation+"deg)")},t.prototype.ngOnDestroy=function(){this.mouseDownSub&&this.mouseDownSub.unsubscribe(),this.mouseMoveSub&&this.mouseMoveSub.unsubscribe(),this.mouseUpSub&&this.mouseUpSub.unsubscribe()},t.prototype.applyRotation=function(){var t=P(this.point),e=S(this.point,t);this.rotating.emit(e),this.rotation=e,requestAnimationFrame(this.rotationRender.bind(this))},t.prototype.createPoint=function(t){return t.targetTouches?{x:this._normalizeX(t.targetTouches[0].clientX),y:this._normalizeY(t.targetTouches[0].clientY)}:{x:this._normalizeX(t.clientX),y:this._normalizeY(t.clientY)}},t.prototype._normalizeX=function(t){return t-this.rect.left-this.rect.width/2},t.prototype._normalizeY=function(t){return-1*(t-this.rect.top)+this.rect.height/2},t.ctorParameters=function(){return[{type:o.ElementRef},{type:o.Renderer2},{type:i.Platform}]},p([o.Input()],t.prototype,"angle",void 0),p([o.Input()],t.prototype,"disable",void 0),p([o.Input()],t.prototype,"active",void 0),p([o.Output()],t.prototype,"rotateStart",void 0),p([o.Output()],t.prototype,"rotating",void 0),p([o.Output()],t.prototype,"rotateStop",void 0),t=p([o.Directive({selector:"[rcpRotatable]"})],t)}(),C={buttonAnimation:a.trigger("buttonAnimation",[a.state("void",a.style({transform:"scale3d(1, 1, 1)"})),a.state("false",a.style({transform:"scale3d(1, 1, 1)"})),a.state("true",a.style({transform:"scale3d(1, 1, 1)"})),a.transition("* => 1",[a.animate("400ms cubic-bezier(0.35, 0, 0.25, 1)",a.keyframes([a.style({transform:"scale3d(1, 1, 1)",offset:0}),a.style({transform:"scale3d(0.8, 0.8, 1)",offset:.25}),a.style({transform:"scale3d(1, 1, 1)",offset:.5}),a.style({transform:"scale3d(1, 1, 1)",offset:1})]))])]),rippleAnimation:a.trigger("rippleAnimation",[a.state("void",a.style({opacity:0,transform:"scale3d(0.8, 0.8, 1)"})),a.state("false",a.style({opacity:0,transform:"scale3d(0.8, 0.8, 1)"})),a.state("true",a.style({opacity:0,transform:"scale3d(0.8, 0.8, 1)"})),a.transition("* => 1",[a.query(":self",a.animate("400ms cubic-bezier(0.35, 0, 0.25, 1)",a.keyframes([a.style({opacity:.2,transform:"scale3d(0.8, 0.8, 1)",offset:0}),a.style({opacity:.2,transform:"scale3d(0.8, 0.8, 1)",offset:.2}),a.style({opacity:0,borderWidth:0,transform:"scale3d({{scale}}, {{scale}}, 1)",offset:1})])),{params:{scale:"3.8"}})])])},z={knobAnimationEnter:[a.style({opacity:1,transform:"scale3d(1, 1, 1)"}),a.animate("150ms cubic-bezier(0.4, 0.0, 1, 1)",a.keyframes([a.style({opacity:1,transform:"scale3d(0, 0, 1)",offset:0}),a.style({opacity:1,transform:"scale3d(1, 1, 1)",offset:1})]))],knobAnimationExit:[a.style({opacity:0,transform:"scale3d(0, 0, 1)"}),a.animate("100ms cubic-bezier(0.0, 0.0, 0.2, 1)",a.keyframes([a.style({opacity:1,transform:"scale3d(1, 1, 1)",offset:0}),a.style({opacity:1,transform:"scale3d(0, 0, 1)",offset:1})]))],gradientAnimationEnter:[a.style({opacity:1,transform:"scale3d(1, 1, 1)"}),a.animate("200ms cubic-bezier(0.4, 0.0, 1, 1)",a.keyframes([a.style({opacity:1,transform:"scale3d(0, 0, 1)",offset:0}),a.style({opacity:1,transform:"scale3d(1, 1, 1)",offset:1})]))],gradientAnimationExit:[a.style({opacity:0,transform:"scale3d(0, 0, 1)"}),a.animate("150ms cubic-bezier(0.0, 0.0, 0.2, 1)",a.keyframes([a.style({opacity:1,transform:"scale3d(1, 1, 1)",offset:0}),a.style({opacity:1,transform:"scale3d(0, 0, 1)",offset:1})]))]},M={provide:s.NG_VALUE_ACCESSOR,useExisting:o.forwardRef((function(){return R})),multi:!0},O=0;!function(t){t.show="show",t.shown="shown",t.selected="selected",t.hide="hide",t.hidden="hidden"}(h||(h={}));var R=function(){function t(t,e,i){this.el=t,this.renderer=e,this.animationBuilder=i,this._uid="rcp-"+O++,this.coefficient=.77,this.hueValue=266,this.disabled=!1,this.active=!1,this.knobState=!1,this.gradientState=!1,this._value="FF0000",this.defaultSize=300,this.colorType="hex",this.enterAnimation=!0,this.exitAnimation=!0,this.selectToChange=!1,this.collapsed=!0,this.collapsible=!0,this.selected=new o.EventEmitter,this.colorChange=new o.EventEmitter,this.lifecycle=new o.EventEmitter}return Object.defineProperty(t.prototype,"isExplicit",{get:function(){return e.coerceBooleanProperty(this.selectToChange)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"hasEnterAnimation",{get:function(){return e.coerceBooleanProperty(this.enterAnimation)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"hasExitAnimation",{get:function(){return e.coerceBooleanProperty(this.exitAnimation)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isCollapsible",{get:function(){return e.coerceBooleanProperty(this.collapsible)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isCollapsed",{get:function(){return e.coerceBooleanProperty(this.collapsed)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getSize",{get:function(){return this.size?this.size:this.defaultSize},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"value",{get:function(){this._value;return"#"+this._value},set:function(t){var e=t;if(t)if(t instanceof Object&&(e=t.value),this._value=e,e.includes("#")){this._value=e.substring(1);var i=d(this._value),o=y(i.r,i.g,i.b);this.hueValue=o.hue}else if(e.includes("rgb")){var n=f(e);o=y(n.r,n.g,n.b);this._value=b(n.r,n.g,n.b),this.hueValue=o.hue}else if(e.includes("hsl")){n=m(e);this._value=g(n.h,100,50),this.hueValue=n.h}this.isExplicit||this.notifyValueChange()},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"width",{get:function(){return this.size?this.size:this.defaultSize},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"height",{get:function(){return this.size?this.size:this.defaultSize},enumerable:!0,configurable:!0}),t.prototype.notifyValueChange=function(){if(this.onChange){var t=this.value,e=d(this._value),i=y(e.r,e.g,e.b);switch(this.colorType){case"hex":t="#"+this._value;break;case"rgb":t="rgb("+e.r+", "+e.g+", "+e.b+")";break;case"hsl":t="hsl("+i.hue+", "+i.saturation+"%, "+i.luminosity+"%)";break;default:t="#"+this._value}this.onChange(t)}},t.prototype.writeValue=function(t){this.value=t},t.prototype.registerOnChange=function(t){this.onChange=t},t.prototype.registerOnTouched=function(t){this.onTouched=t},t.prototype.setDisabledState=function(t){this.disabled=t},t.prototype.ngOnInit=function(){var t=d(this._value),e=y(t.r,t.g,t.b);this.hueValue=e.hue},t.prototype.ngOnChanges=function(t){t.color&&t.color.currentValue&&(this.value=t.color.currentValue),t.size&&t.size.currentValue&&this.recalculateKnobPosition()},t.prototype.ngAfterViewInit=function(){this.recalculateKnobPosition(),this.rect=this.el.nativeElement.getBoundingClientRect(),k(this.canvas.nativeElement,this.getSize),this.isCollapsed&&this.introAnimation()},t.prototype.open=function(){this.introAnimation()},t.prototype.close=function(){this.outroAnimation()},t.prototype.introAnimation=function(){var t=this;this.lifecycle.emit(h.show),this.gradientState=!0,this.createPlayerForGradient(this.hasEnterAnimation),this.gradientPlayer.onDone((function(){t.knobState=!0,t.createPlayerForKnob(t.hasEnterAnimation),t.knobPlayer.onDone((function(){t.active=!0,t.lifecycle.emit(h.shown)})),t.hasEnterAnimation?t.knobPlayer.play():t.knobPlayer.finish()})),this.hasEnterAnimation?this.gradientPlayer.play():this.gradientPlayer.finish()},t.prototype.outroAnimation=function(){var t=this;this.lifecycle.emit(h.hide),this.knobState=!1,this.createPlayerForKnob(),this.knobPlayer.onDone((function(){t.gradientState=!1,t.createPlayerForGradient(),t.gradientPlayer.onDone((function(){t.active=!1,t.lifecycle.emit(h.hidden)})),t.hasExitAnimation?t.gradientPlayer.play():t.gradientPlayer.finish()})),this.hasExitAnimation?this.knobPlayer.play():this.knobPlayer.finish()},t.prototype.onRotate=function(t){var e=g(this.angleToHue(t),100,50);this.value=e,this.isExplicit||this.colorChange.emit("#"+e)},t.prototype.angleToHue=function(t){return t-90},t.prototype.recalculateKnobPosition=function(){var t=this.getSize/2,e=t*this.coefficient,i=t-e;if(this.knob){var o=t-(i/2+e)-this.knob.nativeElement.getBoundingClientRect().width/2;this.renderer.setStyle(this.knob.nativeElement,"top",o+"px")}},t.prototype.confirmColor=function(t){if(!this.isCollapsible)return this.selected.emit(t.color),this.lifecycle.emit(h.selected),void this.notifyValueChange();this.knobState?(this.selected.emit(t.color),this.lifecycle.emit(h.selected),this.notifyValueChange(),this.outroAnimation()):this.introAnimation()},t.prototype.createPlayerForGradient=function(t){var e;void 0===t&&(t=!0),this.gradientPlayer&&this.gradientPlayer.destroy(),e=this.gradientState?this.animationBuilder.build(z.gradientAnimationEnter):this.animationBuilder.build(z.gradientAnimationExit),this.gradientPlayer=e.create(this.canvas.nativeElement)},t.prototype.createPlayerForKnob=function(t){var e;void 0===t&&(t=!0),this.knobPlayer&&this.knobPlayer.destroy(),e=this.knobState?this.animationBuilder.build(z.knobAnimationEnter):this.animationBuilder.build(z.knobAnimationExit),this.knobPlayer=e.create(this.knob.nativeElement)},t.prototype.ngOnDestroy=function(){this.knobPlayer&&this.knobPlayer.destroy(),this.gradientPlayer&&this.gradientPlayer.destroy()},t.ctorParameters=function(){return[{type:o.ElementRef},{type:o.Renderer2},{type:a.AnimationBuilder}]},p([o.Input()],t.prototype,"color",void 0),p([o.Input()],t.prototype,"colorType",void 0),p([o.Input()],t.prototype,"size",void 0),p([o.Input()],t.prototype,"enterAnimation",void 0),p([o.Input()],t.prototype,"exitAnimation",void 0),p([o.Input()],t.prototype,"selectToChange",void 0),p([o.Input()],t.prototype,"collapsed",void 0),p([o.Input()],t.prototype,"collapsible",void 0),p([o.Output()],t.prototype,"selected",void 0),p([o.Output()],t.prototype,"colorChange",void 0),p([o.Output()],t.prototype,"lifecycle",void 0),p([o.ViewChild("canvas",{static:!1,read:o.ElementRef})],t.prototype,"canvas",void 0),p([o.ViewChild("knob",{static:!1,read:o.ElementRef})],t.prototype,"knob",void 0),p([o.ViewChild("rotator",{static:!1,read:o.ElementRef})],t.prototype,"rotator",void 0),p([o.HostBinding("style.width.px")],t.prototype,"width",null),p([o.HostBinding("style.height.px")],t.prototype,"height",null),t=p([o.Component({selector:"rcp-radial-color-picker",template:'<div class="wrapper">\r\n  <canvas #canvas ></canvas>\r\n  <div class="rotator" #rotator rcpRotatable [disable]="disabled"  [angle]="hueValue" (rotating)="onRotate($event)" [active]="active">\r\n    <div class="knob" #knob></div>\r\n  </div>\r\n  <rcp-color-preview [color]="value" [size]="size" [coefficient]="coefficient" (confirm)="confirmColor($event)"></rcp-color-preview>\r\n</div>\r\n',providers:[M],styles:["*{box-sizing:border-box}:host{box-sizing:border-box;display:block;overflow:hidden;border-radius:50%}:host *{box-sizing:border-box}:host .wrapper{position:relative;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;width:100%;height:100%;border-radius:50%}:host .wrapper canvas{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;opacity:0;border-radius:50%;box-shadow:0 0 5px 0 rgba(0,0,0,.6)}:host .wrapper .rotator{position:absolute;z-index:2;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-flex:0;flex:0 0 100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center;width:100%;height:100%;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);border-radius:50%;-webkit-backface-visibility:hidden;backface-visibility:hidden}:host .wrapper .rotator .knob{position:absolute;z-index:11;width:20px;height:20px;pointer-events:none;opacity:0;border-radius:50%;background-color:#fff;box-shadow:0 0 3px 0 rgba(0,0,0,.6)}"]})],t)}(),B=function(){function t(t,e){this.sanitizer=t,this.el=e,this.confirm=new o.EventEmitter}return Object.defineProperty(t.prototype,"width",{get:function(){return this.size&&this.size<200?"36px":"70px"},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"height",{get:function(){return this.size&&this.size<200?"36px":"70px"},enumerable:!0,configurable:!0}),t.prototype.onClick=function(){this.buttonState={value:!0,params:{scale:this.relation}},this.rippleState={value:!0,params:{scale:this.relation}}},t.prototype.ngOnInit=function(){},t.prototype.ngAfterViewInit=function(){var t=this.el.nativeElement.getBoundingClientRect(),e=this.size*this.coefficient;this.relation=e/t.width},t.prototype.ngOnChanges=function(t){t.color&&t.color.currentValue&&(this.background=this.sanitizer.bypassSecurityTrustStyle(this.color))},t.prototype.rippleAnimationDone=function(t){t.toState&&(this.rippleState=!1,this.confirm.emit({color:this.color}))},t.prototype.buttonAnimationDone=function(t){t.toState&&(this.buttonState=!1)},t.prototype.ngOnDestroy=function(){},t.ctorParameters=function(){return[{type:l.DomSanitizer},{type:o.ElementRef}]},p([o.Input()],t.prototype,"coefficient",void 0),p([o.Input()],t.prototype,"color",void 0),p([o.Input()],t.prototype,"size",void 0),p([o.Output()],t.prototype,"confirm",void 0),p([o.HostBinding("style.width")],t.prototype,"width",null),p([o.HostBinding("style.height")],t.prototype,"height",null),p([o.HostListener("click")],t.prototype,"onClick",null),t=p([o.Component({selector:"rcp-color-preview",template:'\r\n<div class="color" [style.background-color]="background" [@buttonAnimation]="buttonState" (@buttonAnimation.done)="buttonAnimationDone($event)"></div>\r\n<div class="color-shadow" [style.border-color]="background" [@rippleAnimation]="rippleState" (@rippleAnimation.done)="rippleAnimationDone($event)"></div>\r\n',animations:[C.rippleAnimation,C.buttonAnimation],styles:["*{box-sizing:border-box}:host{box-sizing:border-box;position:relative;z-index:10}:host *{box-sizing:border-box}:host .color{position:absolute;z-index:12;display:block;width:100%;height:100%;border:6px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #b2b2b2}:host .color-shadow{position:absolute;z-index:11;width:100%;height:100%;border-width:10px;border-style:solid;border-radius:50%}:host.final-state-1{-webkit-transform:translate3d(0,0,0) scale3d(1,1,1);transform:translate3d(0,0,0) scale3d(1,1,1);box-shadow:0 0 1px 6px #fff,0 0 0 7px #b2b2b2}"]})],t)}(),V=function(){function t(){}return t=p([o.NgModule({imports:[c.CommonModule,s.FormsModule,l.BrowserModule,u.BrowserAnimationsModule],declarations:[A,B,R],exports:[A,R]})],t)}();t.Cache=E,t.ColorPreviewComponent=B,t.Quadrant=w,t.RADIAL_COLOR_PICKER_VALUE_ACCESSOR=M,t.RadialColorPickerComponent=R,t.RadialColorPickerModule=V,t.RotatableDirective=A,t._hue2rgb=x,t.bezierCurves={standard:"cubic-bezier(0.4, 0.0, 0.2, 1)",acc:"cubic-bezier(0.4, 0.0, 1, 1)",dec:"cubic-bezier(0.0, 0.0, 0.2, 1)"},t.calculateQuadrant=P,t.determineCSSRotationAngle=S,t.distanceOfSegmentByXYValues=I,t.extractHSL=m,t.extractRGB=f,t.hexToRgb=d,t.hslToHex=g,t.hslToRgb=v,t.paintColorWheelToCanvas=function(t,e){var i=e/2,o=Math.sqrt(2)*i,n=Math.PI/180,r=2*Math.PI;t.width=t.height=e;var a=t.getContext("2d"),s=.5*n+.02;a.translate(i,i),a.rotate(-Math.PI/2),a.translate(-i,-i);for(var l=0;l<360;l+=.5){a.fillStyle="hsl("+l+", 100%, 50%)",a.beginPath(),a.moveTo(i,i);var c=l*n,u=Math.min(r,c+s);a.arc(i,i,o,c,u),a.closePath(),a.fill()}return t},t.renderColorMap=k,t.rgbToHex=b,t.rgbToHsl=y,t.timings={simpleMicro:"100ms",simpleEnter:"150ms",simpleExit:"75ms",complexEnter:"250ms",complexExit:"200ms",largeEnter:"300ms",largeExit:"250ms"},t.ɵa=C,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=radial-color-picker-angular-color-picker.umd.min.js.map