source: trip-planner-front/node_modules/primeng/fesm2020/primeng-colorpicker.mjs

Last change on this file was 59329aa, checked in by Ema <ema_spirova@…>, 3 years ago

adding photos
  • Property mode set to 100644
File size: 28.1 KB
Line 
1import * as i0 from '@angular/core';
2import { forwardRef, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, NgModule } from '@angular/core';
3import { trigger, transition, style, animate } from '@angular/animations';
4import * as i2 from '@angular/common';
5import { CommonModule } from '@angular/common';
6import { DomHandler, ConnectedOverlayScrollHandler } from 'primeng/dom';
7import { NG_VALUE_ACCESSOR } from '@angular/forms';
8import { ZIndexUtils } from 'primeng/utils';
9import * as i1 from 'primeng/api';
10
11const COLORPICKER_VALUE_ACCESSOR = {
12 provide: NG_VALUE_ACCESSOR,
13 useExisting: forwardRef(() => ColorPicker),
14 multi: true
15};
16class ColorPicker {
17 constructor(el, renderer, cd, config, overlayService) {
18 this.el = el;
19 this.renderer = renderer;
20 this.cd = cd;
21 this.config = config;
22 this.overlayService = overlayService;
23 this.format = 'hex';
24 this.autoZIndex = true;
25 this.baseZIndex = 0;
26 this.showTransitionOptions = '.12s cubic-bezier(0, 0, 0.2, 1)';
27 this.hideTransitionOptions = '.1s linear';
28 this.onChange = new EventEmitter();
29 this.onShow = new EventEmitter();
30 this.onHide = new EventEmitter();
31 this.value = { h: 0, s: 100, b: 100 };
32 this.defaultColor = 'ff0000';
33 this.onModelChange = () => { };
34 this.onModelTouched = () => { };
35 }
36 set colorSelector(element) {
37 this.colorSelectorViewChild = element;
38 }
39 set colorHandle(element) {
40 this.colorHandleViewChild = element;
41 }
42 set hue(element) {
43 this.hueViewChild = element;
44 }
45 set hueHandle(element) {
46 this.hueHandleViewChild = element;
47 }
48 onHueMousedown(event) {
49 if (this.disabled) {
50 return;
51 }
52 this.bindDocumentMousemoveListener();
53 this.bindDocumentMouseupListener();
54 this.hueDragging = true;
55 this.pickHue(event);
56 }
57 onHueTouchStart(event) {
58 if (this.disabled) {
59 return;
60 }
61 this.hueDragging = true;
62 this.pickHue(event, event.changedTouches[0]);
63 }
64 onColorTouchStart(event) {
65 if (this.disabled) {
66 return;
67 }
68 this.colorDragging = true;
69 this.pickColor(event, event.changedTouches[0]);
70 }
71 pickHue(event, position) {
72 let pageY = position ? position.pageY : event.pageY;
73 let top = this.hueViewChild.nativeElement.getBoundingClientRect().top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
74 this.value = this.validateHSB({
75 h: Math.floor(360 * (150 - Math.max(0, Math.min(150, (pageY - top)))) / 150),
76 s: this.value.s,
77 b: this.value.b
78 });
79 this.updateColorSelector();
80 this.updateUI();
81 this.updateModel();
82 this.onChange.emit({ originalEvent: event, value: this.getValueToUpdate() });
83 }
84 onColorMousedown(event) {
85 if (this.disabled) {
86 return;
87 }
88 this.bindDocumentMousemoveListener();
89 this.bindDocumentMouseupListener();
90 this.colorDragging = true;
91 this.pickColor(event);
92 }
93 onMove(event) {
94 if (this.colorDragging) {
95 this.pickColor(event, event.changedTouches[0]);
96 event.preventDefault();
97 }
98 if (this.hueDragging) {
99 this.pickHue(event, event.changedTouches[0]);
100 event.preventDefault();
101 }
102 }
103 onDragEnd() {
104 this.colorDragging = false;
105 this.hueDragging = false;
106 this.unbindDocumentMousemoveListener();
107 this.unbindDocumentMouseupListener();
108 }
109 pickColor(event, position) {
110 let pageX = position ? position.pageX : event.pageX;
111 let pageY = position ? position.pageY : event.pageY;
112 let rect = this.colorSelectorViewChild.nativeElement.getBoundingClientRect();
113 let top = rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
114 let left = rect.left + document.body.scrollLeft;
115 let saturation = Math.floor(100 * (Math.max(0, Math.min(150, ((pageX) - left)))) / 150);
116 let brightness = Math.floor(100 * (150 - Math.max(0, Math.min(150, ((pageY) - top)))) / 150);
117 this.value = this.validateHSB({
118 h: this.value.h,
119 s: saturation,
120 b: brightness
121 });
122 this.updateUI();
123 this.updateModel();
124 this.onChange.emit({ originalEvent: event, value: this.getValueToUpdate() });
125 }
126 getValueToUpdate() {
127 let val;
128 switch (this.format) {
129 case 'hex':
130 val = '#' + this.HSBtoHEX(this.value);
131 break;
132 case 'rgb':
133 val = this.HSBtoRGB(this.value);
134 break;
135 case 'hsb':
136 val = this.value;
137 break;
138 }
139 return val;
140 }
141 updateModel() {
142 this.onModelChange(this.getValueToUpdate());
143 }
144 writeValue(value) {
145 if (value) {
146 switch (this.format) {
147 case 'hex':
148 this.value = this.HEXtoHSB(value);
149 break;
150 case 'rgb':
151 this.value = this.RGBtoHSB(value);
152 break;
153 case 'hsb':
154 this.value = value;
155 break;
156 }
157 }
158 else {
159 this.value = this.HEXtoHSB(this.defaultColor);
160 }
161 this.updateColorSelector();
162 this.updateUI();
163 this.cd.markForCheck();
164 }
165 updateColorSelector() {
166 if (this.colorSelectorViewChild) {
167 const hsb = {};
168 hsb.s = 100;
169 hsb.b = 100;
170 hsb.h = this.value.h;
171 this.colorSelectorViewChild.nativeElement.style.backgroundColor = '#' + this.HSBtoHEX(hsb);
172 }
173 }
174 updateUI() {
175 if (this.colorHandleViewChild && this.hueHandleViewChild.nativeElement) {
176 this.colorHandleViewChild.nativeElement.style.left = Math.floor(150 * this.value.s / 100) + 'px';
177 this.colorHandleViewChild.nativeElement.style.top = Math.floor(150 * (100 - this.value.b) / 100) + 'px';
178 this.hueHandleViewChild.nativeElement.style.top = Math.floor(150 - (150 * this.value.h / 360)) + 'px';
179 }
180 this.inputBgColor = '#' + this.HSBtoHEX(this.value);
181 }
182 onInputFocus() {
183 this.onModelTouched();
184 }
185 show() {
186 this.overlayVisible = true;
187 }
188 onOverlayAnimationStart(event) {
189 switch (event.toState) {
190 case 'visible':
191 if (!this.inline) {
192 this.overlay = event.element;
193 this.appendOverlay();
194 if (this.autoZIndex) {
195 ZIndexUtils.set('overlay', this.overlay, this.config.zIndex.overlay);
196 }
197 this.alignOverlay();
198 this.bindDocumentClickListener();
199 this.bindDocumentResizeListener();
200 this.bindScrollListener();
201 this.updateColorSelector();
202 this.updateUI();
203 }
204 break;
205 case 'void':
206 this.onOverlayHide();
207 break;
208 }
209 }
210 onOverlayAnimationEnd(event) {
211 switch (event.toState) {
212 case 'visible':
213 if (!this.inline) {
214 this.onShow.emit({});
215 }
216 break;
217 case 'void':
218 if (this.autoZIndex) {
219 ZIndexUtils.clear(event.element);
220 }
221 this.onHide.emit({});
222 break;
223 }
224 }
225 appendOverlay() {
226 if (this.appendTo) {
227 if (this.appendTo === 'body')
228 document.body.appendChild(this.overlay);
229 else
230 DomHandler.appendChild(this.overlay, this.appendTo);
231 }
232 }
233 restoreOverlayAppend() {
234 if (this.overlay && this.appendTo) {
235 this.el.nativeElement.appendChild(this.overlay);
236 }
237 }
238 alignOverlay() {
239 if (this.appendTo)
240 DomHandler.absolutePosition(this.overlay, this.inputViewChild.nativeElement);
241 else
242 DomHandler.relativePosition(this.overlay, this.inputViewChild.nativeElement);
243 }
244 hide() {
245 this.overlayVisible = false;
246 this.cd.markForCheck();
247 }
248 onInputClick() {
249 this.selfClick = true;
250 this.togglePanel();
251 }
252 togglePanel() {
253 if (!this.overlayVisible)
254 this.show();
255 else
256 this.hide();
257 }
258 onInputKeydown(event) {
259 switch (event.which) {
260 //space
261 case 32:
262 this.togglePanel();
263 event.preventDefault();
264 break;
265 //escape and tab
266 case 27:
267 case 9:
268 this.hide();
269 break;
270 }
271 }
272 onOverlayClick(event) {
273 this.overlayService.add({
274 originalEvent: event,
275 target: this.el.nativeElement
276 });
277 this.selfClick = true;
278 }
279 registerOnChange(fn) {
280 this.onModelChange = fn;
281 }
282 registerOnTouched(fn) {
283 this.onModelTouched = fn;
284 }
285 setDisabledState(val) {
286 this.disabled = val;
287 this.cd.markForCheck();
288 }
289 bindDocumentClickListener() {
290 if (!this.documentClickListener) {
291 const documentTarget = this.el ? this.el.nativeElement.ownerDocument : 'document';
292 this.documentClickListener = this.renderer.listen(documentTarget, 'click', () => {
293 if (!this.selfClick) {
294 this.overlayVisible = false;
295 this.unbindDocumentClickListener();
296 }
297 this.selfClick = false;
298 this.cd.markForCheck();
299 });
300 }
301 }
302 unbindDocumentClickListener() {
303 if (this.documentClickListener) {
304 this.documentClickListener();
305 this.documentClickListener = null;
306 }
307 }
308 bindDocumentMousemoveListener() {
309 if (!this.documentMousemoveListener) {
310 const documentTarget = this.el ? this.el.nativeElement.ownerDocument : 'document';
311 this.documentMousemoveListener = this.renderer.listen(documentTarget, 'mousemove', (event) => {
312 if (this.colorDragging) {
313 this.pickColor(event);
314 }
315 if (this.hueDragging) {
316 this.pickHue(event);
317 }
318 });
319 }
320 }
321 unbindDocumentMousemoveListener() {
322 if (this.documentMousemoveListener) {
323 this.documentMousemoveListener();
324 this.documentMousemoveListener = null;
325 }
326 }
327 bindDocumentMouseupListener() {
328 if (!this.documentMouseupListener) {
329 const documentTarget = this.el ? this.el.nativeElement.ownerDocument : 'document';
330 this.documentMouseupListener = this.renderer.listen(documentTarget, 'mouseup', () => {
331 this.colorDragging = false;
332 this.hueDragging = false;
333 this.unbindDocumentMousemoveListener();
334 this.unbindDocumentMouseupListener();
335 });
336 }
337 }
338 unbindDocumentMouseupListener() {
339 if (this.documentMouseupListener) {
340 this.documentMouseupListener();
341 this.documentMouseupListener = null;
342 }
343 }
344 bindDocumentResizeListener() {
345 this.documentResizeListener = this.onWindowResize.bind(this);
346 window.addEventListener('resize', this.documentResizeListener);
347 }
348 unbindDocumentResizeListener() {
349 if (this.documentResizeListener) {
350 window.removeEventListener('resize', this.documentResizeListener);
351 this.documentResizeListener = null;
352 }
353 }
354 onWindowResize() {
355 this.hide();
356 }
357 bindScrollListener() {
358 if (!this.scrollHandler) {
359 this.scrollHandler = new ConnectedOverlayScrollHandler(this.containerViewChild.nativeElement, () => {
360 if (this.overlayVisible) {
361 this.hide();
362 }
363 });
364 }
365 this.scrollHandler.bindScrollListener();
366 }
367 unbindScrollListener() {
368 if (this.scrollHandler) {
369 this.scrollHandler.unbindScrollListener();
370 }
371 }
372 validateHSB(hsb) {
373 return {
374 h: Math.min(360, Math.max(0, hsb.h)),
375 s: Math.min(100, Math.max(0, hsb.s)),
376 b: Math.min(100, Math.max(0, hsb.b))
377 };
378 }
379 validateRGB(rgb) {
380 return {
381 r: Math.min(255, Math.max(0, rgb.r)),
382 g: Math.min(255, Math.max(0, rgb.g)),
383 b: Math.min(255, Math.max(0, rgb.b))
384 };
385 }
386 validateHEX(hex) {
387 var len = 6 - hex.length;
388 if (len > 0) {
389 var o = [];
390 for (var i = 0; i < len; i++) {
391 o.push('0');
392 }
393 o.push(hex);
394 hex = o.join('');
395 }
396 return hex;
397 }
398 HEXtoRGB(hex) {
399 let hexValue = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
400 return { r: hexValue >> 16, g: (hexValue & 0x00FF00) >> 8, b: (hexValue & 0x0000FF) };
401 }
402 HEXtoHSB(hex) {
403 return this.RGBtoHSB(this.HEXtoRGB(hex));
404 }
405 RGBtoHSB(rgb) {
406 var hsb = {
407 h: 0,
408 s: 0,
409 b: 0
410 };
411 var min = Math.min(rgb.r, rgb.g, rgb.b);
412 var max = Math.max(rgb.r, rgb.g, rgb.b);
413 var delta = max - min;
414 hsb.b = max;
415 hsb.s = max != 0 ? 255 * delta / max : 0;
416 if (hsb.s != 0) {
417 if (rgb.r == max) {
418 hsb.h = (rgb.g - rgb.b) / delta;
419 }
420 else if (rgb.g == max) {
421 hsb.h = 2 + (rgb.b - rgb.r) / delta;
422 }
423 else {
424 hsb.h = 4 + (rgb.r - rgb.g) / delta;
425 }
426 }
427 else {
428 hsb.h = -1;
429 }
430 hsb.h *= 60;
431 if (hsb.h < 0) {
432 hsb.h += 360;
433 }
434 hsb.s *= 100 / 255;
435 hsb.b *= 100 / 255;
436 return hsb;
437 }
438 HSBtoRGB(hsb) {
439 var rgb = {
440 r: null, g: null, b: null
441 };
442 let h = hsb.h;
443 let s = hsb.s * 255 / 100;
444 let v = hsb.b * 255 / 100;
445 if (s == 0) {
446 rgb = {
447 r: v,
448 g: v,
449 b: v
450 };
451 }
452 else {
453 let t1 = v;
454 let t2 = (255 - s) * v / 255;
455 let t3 = (t1 - t2) * (h % 60) / 60;
456 if (h == 360)
457 h = 0;
458 if (h < 60) {
459 rgb.r = t1;
460 rgb.b = t2;
461 rgb.g = t2 + t3;
462 }
463 else if (h < 120) {
464 rgb.g = t1;
465 rgb.b = t2;
466 rgb.r = t1 - t3;
467 }
468 else if (h < 180) {
469 rgb.g = t1;
470 rgb.r = t2;
471 rgb.b = t2 + t3;
472 }
473 else if (h < 240) {
474 rgb.b = t1;
475 rgb.r = t2;
476 rgb.g = t1 - t3;
477 }
478 else if (h < 300) {
479 rgb.b = t1;
480 rgb.g = t2;
481 rgb.r = t2 + t3;
482 }
483 else if (h < 360) {
484 rgb.r = t1;
485 rgb.g = t2;
486 rgb.b = t1 - t3;
487 }
488 else {
489 rgb.r = 0;
490 rgb.g = 0;
491 rgb.b = 0;
492 }
493 }
494 return { r: Math.round(rgb.r), g: Math.round(rgb.g), b: Math.round(rgb.b) };
495 }
496 RGBtoHEX(rgb) {
497 var hex = [
498 rgb.r.toString(16),
499 rgb.g.toString(16),
500 rgb.b.toString(16)
501 ];
502 for (var key in hex) {
503 if (hex[key].length == 1) {
504 hex[key] = '0' + hex[key];
505 }
506 }
507 return hex.join('');
508 }
509 HSBtoHEX(hsb) {
510 return this.RGBtoHEX(this.HSBtoRGB(hsb));
511 }
512 onOverlayHide() {
513 this.unbindScrollListener();
514 this.unbindDocumentResizeListener();
515 this.unbindDocumentClickListener();
516 this.overlay = null;
517 }
518 ngOnDestroy() {
519 if (this.scrollHandler) {
520 this.scrollHandler.destroy();
521 this.scrollHandler = null;
522 }
523 if (this.overlay && this.autoZIndex) {
524 ZIndexUtils.clear(this.overlay);
525 }
526 this.restoreOverlayAppend();
527 this.onOverlayHide();
528 }
529}
530ColorPicker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPicker, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i1.PrimeNGConfig }, { token: i1.OverlayService }], target: i0.ɵɵFactoryTarget.Component });
531ColorPicker.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: ColorPicker, selector: "p-colorPicker", inputs: { style: "style", styleClass: "styleClass", inline: "inline", format: "format", appendTo: "appendTo", disabled: "disabled", tabindex: "tabindex", inputId: "inputId", autoZIndex: "autoZIndex", baseZIndex: "baseZIndex", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onChange: "onChange", onShow: "onShow", onHide: "onHide" }, host: { classAttribute: "p-element" }, providers: [COLORPICKER_VALUE_ACCESSOR], viewQueries: [{ propertyName: "containerViewChild", first: true, predicate: ["container"], descendants: true }, { propertyName: "inputViewChild", first: true, predicate: ["input"], descendants: true }, { propertyName: "colorSelector", first: true, predicate: ["colorSelector"], descendants: true }, { propertyName: "colorHandle", first: true, predicate: ["colorHandle"], descendants: true }, { propertyName: "hue", first: true, predicate: ["hue"], descendants: true }, { propertyName: "hueHandle", first: true, predicate: ["hueHandle"], descendants: true }], ngImport: i0, template: `
532 <div #container [ngStyle]="style" [class]="styleClass" [ngClass]="{'p-colorpicker p-component':true,'p-colorpicker-overlay':!inline,'p-colorpicker-dragging':colorDragging||hueDragging}">
533 <input #input type="text" *ngIf="!inline" class="p-colorpicker-preview p-inputtext" readonly="readonly" [ngClass]="{'p-disabled': disabled}"
534 (focus)="onInputFocus()" (click)="onInputClick()" (keydown)="onInputKeydown($event)" [attr.id]="inputId" [attr.tabindex]="tabindex" [disabled]="disabled"
535 [style.backgroundColor]="inputBgColor">
536 <div *ngIf="inline || overlayVisible" [ngClass]="{'p-colorpicker-panel': true, 'p-colorpicker-overlay-panel':!inline, 'p-disabled': disabled}" (click)="onOverlayClick($event)"
537 [@overlayAnimation]="{value: 'visible', params: {showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}" [@.disabled]="inline === true"
538 (@overlayAnimation.start)="onOverlayAnimationStart($event)" (@overlayAnimation.done)="onOverlayAnimationEnd($event)">
539 <div class="p-colorpicker-content">
540 <div #colorSelector class="p-colorpicker-color-selector" (touchstart)="onColorTouchStart($event)" (touchmove)="onMove($event)" (touchend)="onDragEnd()" (mousedown)="onColorMousedown($event)">
541 <div class="p-colorpicker-color">
542 <div #colorHandle class="p-colorpicker-color-handle"></div>
543 </div>
544 </div>
545 <div #hue class="p-colorpicker-hue" (mousedown)="onHueMousedown($event)" (touchstart)="onHueTouchStart($event)" (touchmove)="onMove($event)" (touchend)="onDragEnd()">
546 <div #hueHandle class="p-colorpicker-hue-handle"></div>
547 </div>
548 </div>
549 </div>
550 </div>
551 `, isInline: true, styles: [".p-colorpicker{display:inline-block}.p-colorpicker-dragging{cursor:pointer}.p-colorpicker-overlay{position:relative}.p-colorpicker-panel{position:relative;width:193px;height:166px}.p-colorpicker-overlay-panel{position:absolute;top:0;left:0}.p-colorpicker-preview{cursor:pointer}.p-colorpicker-panel .p-colorpicker-content{position:relative}.p-colorpicker-panel .p-colorpicker-color-selector{width:150px;height:150px;top:8px;left:8px;position:absolute}.p-colorpicker-panel .p-colorpicker-color{width:150px;height:150px}.p-colorpicker-panel .p-colorpicker-color-handle{position:absolute;top:0px;left:150px;border-radius:100%;width:10px;height:10px;border-width:1px;border-style:solid;margin:-5px 0 0 -5px;cursor:pointer;opacity:.85}.p-colorpicker-panel .p-colorpicker-hue{width:17px;height:150px;top:8px;left:167px;position:absolute;opacity:.85}.p-colorpicker-panel .p-colorpicker-hue-handle{position:absolute;top:150px;left:0px;width:21px;margin-left:-2px;margin-top:-5px;height:10px;border-width:2px;border-style:solid;opacity:.85;cursor:pointer}\n"], directives: [{ type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
552 trigger('overlayAnimation', [
553 transition(':enter', [
554 style({ opacity: 0, transform: 'scaleY(0.8)' }),
555 animate('{{showTransitionParams}}')
556 ]),
557 transition(':leave', [
558 animate('{{hideTransitionParams}}', style({ opacity: 0 }))
559 ])
560 ])
561 ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
562i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPicker, decorators: [{
563 type: Component,
564 args: [{ selector: 'p-colorPicker', template: `
565 <div #container [ngStyle]="style" [class]="styleClass" [ngClass]="{'p-colorpicker p-component':true,'p-colorpicker-overlay':!inline,'p-colorpicker-dragging':colorDragging||hueDragging}">
566 <input #input type="text" *ngIf="!inline" class="p-colorpicker-preview p-inputtext" readonly="readonly" [ngClass]="{'p-disabled': disabled}"
567 (focus)="onInputFocus()" (click)="onInputClick()" (keydown)="onInputKeydown($event)" [attr.id]="inputId" [attr.tabindex]="tabindex" [disabled]="disabled"
568 [style.backgroundColor]="inputBgColor">
569 <div *ngIf="inline || overlayVisible" [ngClass]="{'p-colorpicker-panel': true, 'p-colorpicker-overlay-panel':!inline, 'p-disabled': disabled}" (click)="onOverlayClick($event)"
570 [@overlayAnimation]="{value: 'visible', params: {showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions}}" [@.disabled]="inline === true"
571 (@overlayAnimation.start)="onOverlayAnimationStart($event)" (@overlayAnimation.done)="onOverlayAnimationEnd($event)">
572 <div class="p-colorpicker-content">
573 <div #colorSelector class="p-colorpicker-color-selector" (touchstart)="onColorTouchStart($event)" (touchmove)="onMove($event)" (touchend)="onDragEnd()" (mousedown)="onColorMousedown($event)">
574 <div class="p-colorpicker-color">
575 <div #colorHandle class="p-colorpicker-color-handle"></div>
576 </div>
577 </div>
578 <div #hue class="p-colorpicker-hue" (mousedown)="onHueMousedown($event)" (touchstart)="onHueTouchStart($event)" (touchmove)="onMove($event)" (touchend)="onDragEnd()">
579 <div #hueHandle class="p-colorpicker-hue-handle"></div>
580 </div>
581 </div>
582 </div>
583 </div>
584 `, animations: [
585 trigger('overlayAnimation', [
586 transition(':enter', [
587 style({ opacity: 0, transform: 'scaleY(0.8)' }),
588 animate('{{showTransitionParams}}')
589 ]),
590 transition(':leave', [
591 animate('{{hideTransitionParams}}', style({ opacity: 0 }))
592 ])
593 ])
594 ], providers: [COLORPICKER_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
595 'class': 'p-element'
596 }, styles: [".p-colorpicker{display:inline-block}.p-colorpicker-dragging{cursor:pointer}.p-colorpicker-overlay{position:relative}.p-colorpicker-panel{position:relative;width:193px;height:166px}.p-colorpicker-overlay-panel{position:absolute;top:0;left:0}.p-colorpicker-preview{cursor:pointer}.p-colorpicker-panel .p-colorpicker-content{position:relative}.p-colorpicker-panel .p-colorpicker-color-selector{width:150px;height:150px;top:8px;left:8px;position:absolute}.p-colorpicker-panel .p-colorpicker-color{width:150px;height:150px}.p-colorpicker-panel .p-colorpicker-color-handle{position:absolute;top:0px;left:150px;border-radius:100%;width:10px;height:10px;border-width:1px;border-style:solid;margin:-5px 0 0 -5px;cursor:pointer;opacity:.85}.p-colorpicker-panel .p-colorpicker-hue{width:17px;height:150px;top:8px;left:167px;position:absolute;opacity:.85}.p-colorpicker-panel .p-colorpicker-hue-handle{position:absolute;top:150px;left:0px;width:21px;margin-left:-2px;margin-top:-5px;height:10px;border-width:2px;border-style:solid;opacity:.85;cursor:pointer}\n"] }]
597 }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i1.PrimeNGConfig }, { type: i1.OverlayService }]; }, propDecorators: { style: [{
598 type: Input
599 }], styleClass: [{
600 type: Input
601 }], inline: [{
602 type: Input
603 }], format: [{
604 type: Input
605 }], appendTo: [{
606 type: Input
607 }], disabled: [{
608 type: Input
609 }], tabindex: [{
610 type: Input
611 }], inputId: [{
612 type: Input
613 }], autoZIndex: [{
614 type: Input
615 }], baseZIndex: [{
616 type: Input
617 }], showTransitionOptions: [{
618 type: Input
619 }], hideTransitionOptions: [{
620 type: Input
621 }], onChange: [{
622 type: Output
623 }], onShow: [{
624 type: Output
625 }], onHide: [{
626 type: Output
627 }], containerViewChild: [{
628 type: ViewChild,
629 args: ['container']
630 }], inputViewChild: [{
631 type: ViewChild,
632 args: ['input']
633 }], colorSelector: [{
634 type: ViewChild,
635 args: ['colorSelector']
636 }], colorHandle: [{
637 type: ViewChild,
638 args: ['colorHandle']
639 }], hue: [{
640 type: ViewChild,
641 args: ['hue']
642 }], hueHandle: [{
643 type: ViewChild,
644 args: ['hueHandle']
645 }] } });
646class ColorPickerModule {
647}
648ColorPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
649ColorPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPickerModule, declarations: [ColorPicker], imports: [CommonModule], exports: [ColorPicker] });
650ColorPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPickerModule, imports: [[CommonModule]] });
651i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorPickerModule, decorators: [{
652 type: NgModule,
653 args: [{
654 imports: [CommonModule],
655 exports: [ColorPicker],
656 declarations: [ColorPicker]
657 }]
658 }] });
659
660/**
661 * Generated bundle index. Do not edit.
662 */
663
664export { COLORPICKER_VALUE_ACCESSOR, ColorPicker, ColorPickerModule };
Note: See TracBrowser for help on using the repository browser.