{"__symbolic":"module","version":4,"metadata":{"FarrisColorpickerPlusComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"farris-colorpicker-plus","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":13,"character":11},"useExisting":{"__symbolic":"reference","name":"FarrisColorpickerPlusComponent"},"multi":true}],"template":"
\n \n
\n \n \n
\n \n\n
\n -1\" style=\"width:40px;margin-right:10px;\">\n {{presetColorType[currentColorTypeIndex]['text']}}\n \n \n
-1\">\n \n \n
\n
\n
\n \n \n
\n 0\">\n \n
\n
\n \n
\n
\n
\n
\n
\n
","styles":[":host{position:relative;line-height:normal}:host .color-picker-wrapper{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}:host .color-picker-wrapper .color-picker-input{border-top-right-radius:0;border-bottom-right-radius:0;flex:1 1 auto;width:1%;min-width:140px}:host .color-picker-wrapper .color-picker-trigger{display:inline-block;box-sizing:border-box;height:calc(1.62503rem + 2px);width:calc(1.62503rem + 2px);padding:.1875rem;border:1px solid #e6e6e6;border-left:none;border-top-right-radius:4px;border-bottom-right-radius:4px;font-size:0;position:relative;cursor:pointer}:host .color-picker-wrapper .color-picker-trigger .color-picker-trigger-inner{position:relative;display:block;box-sizing:border-box;border:1px solid #999;border-radius:2px;width:100%;height:100%;text-align:center}:host .color-picker-wrapper .color-picker-trigger .color-picker-trigger-inner.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}:host .color-picker-wrapper .color-picker-trigger .color-picker-trigger-inner div{width:100%;height:100%}.color-picker-panel{display:block;position:absolute;width:300px;z-index:3000;padding:6px;box-sizing:content-box;background-color:#fff;border:1px solid #ebeef5;border-radius:4px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.color-picker-panel.disabled{visibility:hidden}.color-picker-panel .color-picker-main{padding-bottom:6px}.color-picker-panel .input-btn{margin-top:6px;text-align:right;clear:both;overflow:hidden}.color-picker-panel .input-btn input{flex:1 1 0;height:28px;line-height:28px;cursor:pointer;-webkit-appearance:none;background-color:#fff;border-radius:4px;border:1px solid #dcdfe6;box-sizing:border-box;color:#606266;font-size:inherit;outline:0;padding:0 7px;transition:border-color .2s cubic-bezier(.645,.045,.355,1)}.color-picker-panel .input-btn input:focus{border-color:#409eff}.color-picker-panel .input-btn .btn-clear{background-color:#fff;border:none;outline:0;color:#409eff;box-shadow:none}.color-picker-panel .type-icon-btn-wrapper{width:26px;display:flex;flex-direction:column;align-items:center}.color-picker-panel .type-icon-btn-wrapper .type-icon-btn{color:#c5c8cb;font-size:13px;cursor:pointer}.color-picker-panel .type-icon-btn-wrapper .type-icon-btn:hover{color:#409eff}"]}]}],"members":{"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"elementConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"showAlpha":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"colorFormat":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"presets":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":3}}]}],"control":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":87,"character":3}}]}],"activeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":90,"character":3}}]}],"trigger":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":93,"character":3},"arguments":["trigger"]}]}],"pickerPanel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":96,"character":3},"arguments":["pickerPanel"]}]}],"valueChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":99,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":158,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":158,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":154,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":155,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":156,"character":35},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":154,"character":26},null]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"onBlur":[{"__symbolic":"method"}],"closeColorPanel":[{"__symbolic":"method"}],"clear":[{"__symbolic":"method"}],"commit":[{"__symbolic":"method"}],"toggleShowPanel":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"findColorType":[{"__symbolic":"method"}],"changeColorFormatByIcon":[{"__symbolic":"method"}]}},"FarrisColorpickerPlusModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":9,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"FarrisColorpickerPlusComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":17,"character":4}],"exports":[{"__symbolic":"reference","name":"FarrisColorpickerPlusComponent"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵb"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"sv-panel","template":"
\n
\n
\n
\n
\n","styles":[":host{display:block;position:relative;width:280px;height:180px}:host .color-svpanel__white{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}:host .color-svpanel__black{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(0deg,#000,transparent)}:host .color-svpanel__cursor{position:absolute}:host .color-svpanel__cursor div{cursor:pointer;width:6px;height:6px;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px rgba(0,0,0,.3),0 0 1px 2px rgba(0,0,0,.4);border-radius:50%;transform:translate(-3px,-3px)}"]}]}],"members":{"hue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"editorParams":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"colorChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":30,"character":5}}]}],"cursor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":33,"character":5},"arguments":["cursor"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":38,"character":9},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":38,"character":16}]}],null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":37,"character":18},null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":39,"character":20}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":44,"character":5},"arguments":["style.backgroundColor"]}]}],"onClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":49,"character":5},"arguments":["mousedown",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":50,"character":5},"arguments":["touchstart",["$event"]]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"movePointer":[{"__symbolic":"method"}],"changePointerPosition":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":15,"character":39},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":16,"character":37}]}],"movePointer":[{"__symbolic":"method"}],"onEventChange":[{"__symbolic":"method"}],"calculateCoordinates":[{"__symbolic":"method"}],"calculate":[{"__symbolic":"method"}],"getRequestAnimationFrame":[{"__symbolic":"method"}],"removeListeners":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵb"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"hue","template":"
\n
\n","styles":[":host{position:relative;box-sizing:border-box;width:12px;height:180px;background-color:red;padding:2px 0;float:right}:host .color-hue-slider__bar{position:relative;background:linear-gradient(red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red);height:100%}:host .color-hue-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;top:10px;left:0;width:100%;height:4px;border-radius:1px;background:#fff;border:1px solid #f0f0f0;box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}"]}]}],"members":{"hue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5}}]}],"editorParams":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5}}]}],"vertical":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":5}}]}],"hueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":5}}]}],"colorChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":37,"character":5}}]}],"thumb":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":40,"character":5},"arguments":["thumb"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":45,"character":9},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":45,"character":16}]}],null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":44,"character":18},null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":46,"character":20}]}],"onClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":51,"character":5},"arguments":["mousedown",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":52,"character":5},"arguments":["touchstart",["$event"]]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"movePointer":[{"__symbolic":"method"}],"changePointerPosition":[{"__symbolic":"method"}]}},"ɵd":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵb"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"alpha","template":"
\n
\n","styles":[":host{display:block;position:relative;box-sizing:border-box;width:280px;height:12px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}:host .color-alpha-slider__bar{position:relative;background:linear-gradient(to right,rgba(255,69,0,0) 0,#ff4500 100%);height:100%}:host .color-alpha-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:189px;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid #f0f0f0;box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}"]}]}],"members":{"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"editorParams":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":5}}]}],"vertical":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"colorChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":5}}]}],"thumb":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":36,"character":5},"arguments":["thumb"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":41,"character":9},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":41,"character":16}]}],null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":40,"character":18},null,{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":42,"character":20}]}],"onClick":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":47,"character":5},"arguments":["mousedown",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":48,"character":5},"arguments":["touchstart",["$event"]]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"movePointer":[{"__symbolic":"method"}],"changePointerPosition":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"preset","template":"
\n \n
\n \n\n","styles":[":host{display:flex;font-size:12px;border-top:1px solid #dcdfe6;margin:12px -6px 0;padding:12px 6px 0}:host .color-preset__colors{display:flex;flex:1;flex-wrap:wrap}:host .color-preset__colors .color-preset__color-selector{margin:0 0 8px 8px;width:20px;height:20px;border-radius:4px;cursor:pointer}:host .color-preset__colors .color-preset__color-selector.selected{box-shadow:0 0 3px 2px #409eff}:host .color-preset__colors .color-preset__color-selector div{display:flex;height:100%;border-radius:3px}"]}]}],"members":{"colorPresets":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":5}}]}],"hue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":5}}]}],"editorParams":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":5}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5}}]}],"colorChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":5}}]}],"hueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":5}}]}],"selectors":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":31,"character":5},"arguments":["selectors"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":34,"character":33}]}],"onSelectionChange":[{"__symbolic":"method"}]}}},"origins":{"FarrisColorpickerPlusComponent":"./lib/farris-colorpicker-plus.component","FarrisColorpickerPlusModule":"./lib/farris-colorpicker-plus.module","ɵa":"./lib/components/sv-panel/sv-panel.component","ɵb":"./lib/components/base-component","ɵc":"./lib/components/hue/hue.component","ɵd":"./lib/components/alpha/alpha.component","ɵe":"./lib/components/preset/preset.component"},"importAs":"farris-colorpicker-plus"}