@skyux/colorpicker 7.1.0 → 7.1.2

package/fesm2015/skyux-colorpicker-testing.mjs

@@ -1,22 +1,25 @@
-import { __awaiter } from 'tslib';
+import { __classPrivateFieldSet, __classPrivateFieldGet, __awaiter } from 'tslib';
 import { By } from '@angular/platform-browser';
 import { SkyAppTestUtility } from '@skyux-sdk/testing';
 
+var _SkyColorpickerFixture_instances, _SkyColorpickerFixture_debugEl, _SkyColorpickerFixture_fixture, _SkyColorpickerFixture_clickColorpickerButtonEl, _SkyColorpickerFixture_clickColorpickerApplyButtonEl, _SkyColorpickerFixture_getColorpickerInputEl;
 /**
  * Allows interaction with a SKY UX colorpicker component.
  * @internal
  */
 class SkyColorpickerFixture {
     constructor(fixture, skyTestId) {
-        this.fixture = fixture;
-        this.skyTestId = skyTestId;
-        this.debugEl = SkyAppTestUtility.getDebugElementByTestId(this.fixture, this.skyTestId, 'sky-colorpicker');
+        _SkyColorpickerFixture_instances.add(this);
+        _SkyColorpickerFixture_debugEl.set(this, void 0);
+        _SkyColorpickerFixture_fixture.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyColorpickerFixture_fixture, fixture, "f");
+        __classPrivateFieldSet(this, _SkyColorpickerFixture_debugEl, SkyAppTestUtility.getDebugElementByTestId(fixture, skyTestId, 'sky-colorpicker'), "f");
     }
     /**
      * The colorpicker's currently selected color formatted to the `outputFormat`.
      */
     get value() {
-        return this.getColorpickerInputEl().nativeElement.value;
+        return __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_getColorpickerInputEl).call(this).nativeElement.value;
     }
     /**
      * Set the colorpicker's color hex code.
@@ -24,12 +27,12 @@ class SkyColorpickerFixture {
      */
     setValueFromHex(hexValue) {
         return __awaiter(this, void 0, void 0, function* () {
-            yield this.clickColorpickerButtonEl();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerButtonEl).call(this);
             const hexInput = document.querySelector('input[id^=sky-colorpicker-hex-]');
             hexInput.value = hexValue;
             SkyAppTestUtility.fireDomEvent(hexInput, 'input');
-            yield this.clickColorpickerApplyButtonEl();
-            return this.fixture.whenStable();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerApplyButtonEl).call(this);
+            return __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").whenStable();
         });
     }
     /**
@@ -41,7 +44,7 @@ class SkyColorpickerFixture {
      */
     setValueFromRGBA(red, green, blue, alpha) {
         return __awaiter(this, void 0, void 0, function* () {
-            yield this.clickColorpickerButtonEl();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerButtonEl).call(this);
             const rInput = document.querySelector('input[id^=sky-colorpicker-red-]');
             const gInput = document.querySelector('input[id^=sky-colorpicker-green-]');
             const bInput = document.querySelector('input[id^=sky-colorpicker-blue-]');
@@ -54,8 +57,8 @@ class SkyColorpickerFixture {
             SkyAppTestUtility.fireDomEvent(gInput, 'input');
             SkyAppTestUtility.fireDomEvent(bInput, 'input');
             SkyAppTestUtility.fireDomEvent(aInput, 'input');
-            yield this.clickColorpickerApplyButtonEl();
-            return this.fixture.whenStable();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerApplyButtonEl).call(this);
+            return __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").whenStable();
         });
     }
     /**
@@ -64,37 +67,35 @@ class SkyColorpickerFixture {
      */
     setValueFromPresets(presetIndex) {
         return __awaiter(this, void 0, void 0, function* () {
-            yield this.clickColorpickerButtonEl();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerButtonEl).call(this);
             const presetColors = document.querySelectorAll('.sky-colorpicker-preset-color-area button');
             const presetColor = presetColors && presetColors[presetIndex];
             if (presetColor) {
                 presetColor.click();
-                this.fixture.detectChanges();
+                __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").detectChanges();
             }
-            yield this.clickColorpickerApplyButtonEl();
-            return this.fixture.whenStable();
+            yield __classPrivateFieldGet(this, _SkyColorpickerFixture_instances, "m", _SkyColorpickerFixture_clickColorpickerApplyButtonEl).call(this);
+            return __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").whenStable();
         });
     }
-    clickColorpickerButtonEl() {
-        return __awaiter(this, void 0, void 0, function* () {
-            const colorpickerButton = this.debugEl.query(By.css('sky-colorpicker button')).nativeElement;
-            colorpickerButton.click();
-            this.fixture.detectChanges();
-            return this.fixture.whenStable();
-        });
-    }
-    clickColorpickerApplyButtonEl() {
-        return __awaiter(this, void 0, void 0, function* () {
-            const applyButton = document.querySelector('.sky-btn-colorpicker-apply');
-            applyButton.click();
-            this.fixture.detectChanges();
-            return this.fixture.whenStable();
-        });
-    }
-    getColorpickerInputEl() {
-        return this.debugEl.query(By.css('sky-colorpicker input'));
-    }
 }
+_SkyColorpickerFixture_debugEl = new WeakMap(), _SkyColorpickerFixture_fixture = new WeakMap(), _SkyColorpickerFixture_instances = new WeakSet(), _SkyColorpickerFixture_clickColorpickerButtonEl = function _SkyColorpickerFixture_clickColorpickerButtonEl() {
+    return __awaiter(this, void 0, void 0, function* () {
+        const colorpickerButton = __classPrivateFieldGet(this, _SkyColorpickerFixture_debugEl, "f").query(By.css('sky-colorpicker button')).nativeElement;
+        colorpickerButton.click();
+        __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").detectChanges();
+        return __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").whenStable();
+    });
+}, _SkyColorpickerFixture_clickColorpickerApplyButtonEl = function _SkyColorpickerFixture_clickColorpickerApplyButtonEl() {
+    return __awaiter(this, void 0, void 0, function* () {
+        const applyButton = document.querySelector('.sky-btn-colorpicker-apply');
+        applyButton.click();
+        __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").detectChanges();
+        return __classPrivateFieldGet(this, _SkyColorpickerFixture_fixture, "f").whenStable();
+    });
+}, _SkyColorpickerFixture_getColorpickerInputEl = function _SkyColorpickerFixture_getColorpickerInputEl() {
+    return __classPrivateFieldGet(this, _SkyColorpickerFixture_debugEl, "f").query(By.css('sky-colorpicker input'));
+};
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2015/skyux-colorpicker-testing.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skyux-colorpicker-testing.mjs","sources":["../../../../../libs/components/colorpicker/testing/src/colorpicker-fixture.ts","../../../../../libs/components/colorpicker/testing/src/skyux-colorpicker-testing.ts"],"sourcesContent":["import { DebugElement } from '@angular/core';\nimport { ComponentFixture } from '@angular/core/testing';\nimport { By } from '@angular/platform-browser';\nimport { SkyAppTestUtility } from '@skyux-sdk/testing';\n\n/**\n * Allows interaction with a SKY UX colorpicker component.\n * @internal\n */\nexport class SkyColorpickerFixture {\n  private debugEl: DebugElement;\n\n  constructor(\n    private fixture: ComponentFixture<unknown>,\n    private skyTestId: string\n  ) {\n    this.debugEl = SkyAppTestUtility.getDebugElementByTestId(\n      this.fixture,\n      this.skyTestId,\n      'sky-colorpicker'\n    );\n  }\n\n  /**\n   * The colorpicker's currently selected color formatted to the `outputFormat`.\n   */\n  public get value(): string {\n    return this.getColorpickerInputEl().nativeElement.value;\n  }\n\n  /**\n   * Set the colorpicker's color hex code.\n   * @param hexValue The new color hex code. Must inculde '#'.\n   */\n  public async setValueFromHex(hexValue: string): Promise<void> {\n    await this.clickColorpickerButtonEl();\n\n    const hexInput = document.querySelector(\n      'input[id^=sky-colorpicker-hex-]'\n    ) as HTMLInputElement;\n\n    hexInput.value = hexValue;\n    SkyAppTestUtility.fireDomEvent(hexInput, 'input');\n\n    await this.clickColorpickerApplyButtonEl();\n\n    return this.fixture.whenStable();\n  }\n\n  /**\n   * Set the colorpicker's color RGB values.\n   * @param red The red color value.\n   * @param green The green color value.\n   * @param blue The blue color value.\n   * @param alpha The alpha channel value.\n   */\n  public async setValueFromRGBA(\n    red: number,\n    green: number,\n    blue: number,\n    alpha: number\n  ): Promise<void> {\n    await this.clickColorpickerButtonEl();\n\n    const rInput = document.querySelector(\n      'input[id^=sky-colorpicker-red-]'\n    ) as HTMLInputElement;\n    const gInput = document.querySelector(\n      'input[id^=sky-colorpicker-green-]'\n    ) as HTMLInputElement;\n    const bInput = document.querySelector(\n      'input[id^=sky-colorpicker-blue-]'\n    ) as HTMLInputElement;\n    const aInput = document.querySelector(\n      'input[id^=sky-colorpicker-alpha-]'\n    ) as HTMLInputElement;\n\n    rInput.value = red.toString();\n    gInput.value = green.toString();\n    bInput.value = blue.toString();\n    aInput.value = alpha.toString();\n\n    SkyAppTestUtility.fireDomEvent(rInput, 'input');\n    SkyAppTestUtility.fireDomEvent(gInput, 'input');\n    SkyAppTestUtility.fireDomEvent(bInput, 'input');\n    SkyAppTestUtility.fireDomEvent(aInput, 'input');\n\n    await this.clickColorpickerApplyButtonEl();\n\n    return this.fixture.whenStable();\n  }\n\n  /**\n   * Set the colorpicker's color to the provided preset color at the given index.\n   * @param presetIndex The index of the color in the `presetColors` list to select.\n   */\n  public async setValueFromPresets(presetIndex: number): Promise<void> {\n    await this.clickColorpickerButtonEl();\n\n    const presetColors = document.querySelectorAll(\n      '.sky-colorpicker-preset-color-area button'\n    );\n    const presetColor =\n      presetColors && (presetColors[presetIndex] as HTMLButtonElement);\n\n    if (presetColor) {\n      presetColor.click();\n      this.fixture.detectChanges();\n    }\n\n    await this.clickColorpickerApplyButtonEl();\n\n    return this.fixture.whenStable();\n  }\n\n  private async clickColorpickerButtonEl(): Promise<void> {\n    const colorpickerButton = this.debugEl.query(\n      By.css('sky-colorpicker button')\n    ).nativeElement;\n\n    colorpickerButton.click();\n\n    this.fixture.detectChanges();\n\n    return this.fixture.whenStable();\n  }\n\n  private async clickColorpickerApplyButtonEl(): Promise<void> {\n    const applyButton = document.querySelector(\n      '.sky-btn-colorpicker-apply'\n    ) as HTMLButtonElement;\n\n    applyButton.click();\n\n    this.fixture.detectChanges();\n\n    return this.fixture.whenStable();\n  }\n\n  private getColorpickerInputEl(): DebugElement {\n    return this.debugEl.query(By.css('sky-colorpicker input'));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"skyux-colorpicker-testing.mjs","sources":["../../../../../libs/components/colorpicker/testing/src/colorpicker-fixture.ts","../../../../../libs/components/colorpicker/testing/src/skyux-colorpicker-testing.ts"],"sourcesContent":["import { DebugElement } from '@angular/core';\nimport { ComponentFixture } from '@angular/core/testing';\nimport { By } from '@angular/platform-browser';\nimport { SkyAppTestUtility } from '@skyux-sdk/testing';\n\n/**\n * Allows interaction with a SKY UX colorpicker component.\n * @internal\n */\nexport class SkyColorpickerFixture {\n  #debugEl: DebugElement;\n  #fixture: ComponentFixture<unknown>;\n\n  constructor(fixture: ComponentFixture<unknown>, skyTestId: string) {\n    this.#fixture = fixture;\n    this.#debugEl = SkyAppTestUtility.getDebugElementByTestId(\n      fixture,\n      skyTestId,\n      'sky-colorpicker'\n    );\n  }\n\n  /**\n   * The colorpicker's currently selected color formatted to the `outputFormat`.\n   */\n  public get value(): string {\n    return this.#getColorpickerInputEl().nativeElement.value;\n  }\n\n  /**\n   * Set the colorpicker's color hex code.\n   * @param hexValue The new color hex code. Must inculde '#'.\n   */\n  public async setValueFromHex(hexValue: string): Promise<void> {\n    await this.#clickColorpickerButtonEl();\n\n    const hexInput = document.querySelector(\n      'input[id^=sky-colorpicker-hex-]'\n    ) as HTMLInputElement;\n\n    hexInput.value = hexValue;\n    SkyAppTestUtility.fireDomEvent(hexInput, 'input');\n\n    await this.#clickColorpickerApplyButtonEl();\n\n    return this.#fixture.whenStable();\n  }\n\n  /**\n   * Set the colorpicker's color RGB values.\n   * @param red The red color value.\n   * @param green The green color value.\n   * @param blue The blue color value.\n   * @param alpha The alpha channel value.\n   */\n  public async setValueFromRGBA(\n    red: number,\n    green: number,\n    blue: number,\n    alpha: number\n  ): Promise<void> {\n    await this.#clickColorpickerButtonEl();\n\n    const rInput = document.querySelector(\n      'input[id^=sky-colorpicker-red-]'\n    ) as HTMLInputElement;\n    const gInput = document.querySelector(\n      'input[id^=sky-colorpicker-green-]'\n    ) as HTMLInputElement;\n    const bInput = document.querySelector(\n      'input[id^=sky-colorpicker-blue-]'\n    ) as HTMLInputElement;\n    const aInput = document.querySelector(\n      'input[id^=sky-colorpicker-alpha-]'\n    ) as HTMLInputElement;\n\n    rInput.value = red.toString();\n    gInput.value = green.toString();\n    bInput.value = blue.toString();\n    aInput.value = alpha.toString();\n\n    SkyAppTestUtility.fireDomEvent(rInput, 'input');\n    SkyAppTestUtility.fireDomEvent(gInput, 'input');\n    SkyAppTestUtility.fireDomEvent(bInput, 'input');\n    SkyAppTestUtility.fireDomEvent(aInput, 'input');\n\n    await this.#clickColorpickerApplyButtonEl();\n\n    return this.#fixture.whenStable();\n  }\n\n  /**\n   * Set the colorpicker's color to the provided preset color at the given index.\n   * @param presetIndex The index of the color in the `presetColors` list to select.\n   */\n  public async setValueFromPresets(presetIndex: number): Promise<void> {\n    await this.#clickColorpickerButtonEl();\n\n    const presetColors = document.querySelectorAll(\n      '.sky-colorpicker-preset-color-area button'\n    );\n    const presetColor =\n      presetColors && (presetColors[presetIndex] as HTMLButtonElement);\n\n    if (presetColor) {\n      presetColor.click();\n      this.#fixture.detectChanges();\n    }\n\n    await this.#clickColorpickerApplyButtonEl();\n\n    return this.#fixture.whenStable();\n  }\n\n  async #clickColorpickerButtonEl(): Promise<void> {\n    const colorpickerButton = this.#debugEl.query(\n      By.css('sky-colorpicker button')\n    ).nativeElement;\n\n    colorpickerButton.click();\n\n    this.#fixture.detectChanges();\n\n    return this.#fixture.whenStable();\n  }\n\n  async #clickColorpickerApplyButtonEl(): Promise<void> {\n    const applyButton = document.querySelector(\n      '.sky-btn-colorpicker-apply'\n    ) as HTMLButtonElement;\n\n    applyButton.click();\n\n    this.#fixture.detectChanges();\n\n    return this.#fixture.whenStable();\n  }\n\n  #getColorpickerInputEl(): DebugElement {\n    return this.#debugEl.query(By.css('sky-colorpicker input'));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/skyux-colorpicker.mjs

@@ -667,17 +667,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImpo
                 args: ['change']
             }] } });
 
-var _SkyColorpickerSliderDirective_instances, _SkyColorpickerSliderDirective_listenerMove, _SkyColorpickerSliderDirective_listenerStop, _SkyColorpickerSliderDirective_setCursor;
+var _SkyColorpickerSliderDirective_instances, _SkyColorpickerSliderDirective_listenerMove, _SkyColorpickerSliderDirective_listenerStop, _SkyColorpickerSliderDirective_el, _SkyColorpickerSliderDirective_setCursor;
 /**
  * @internal
  */
 class SkyColorpickerSliderDirective {
     constructor(el) {
-        this.el = el;
         _SkyColorpickerSliderDirective_instances.add(this);
         this.newColorContrast = new EventEmitter();
         _SkyColorpickerSliderDirective_listenerMove.set(this, void 0);
         _SkyColorpickerSliderDirective_listenerStop.set(this, void 0);
+        _SkyColorpickerSliderDirective_el.set(this, void 0);
+        __classPrivateFieldSet(this, _SkyColorpickerSliderDirective_el, el, "f");
         __classPrivateFieldSet(this, _SkyColorpickerSliderDirective_listenerMove, (event) => {
             this.move(event);
         }, "f");
@@ -706,20 +707,20 @@ class SkyColorpickerSliderDirective {
         /* Ignoring event.touches as tests are not run on a touch device. */
         /* istanbul ignore next */
         return (('pageX' in event ? event.pageX : event.touches[0].pageX) -
-            this.el.nativeElement.getBoundingClientRect().left -
+            __classPrivateFieldGet(this, _SkyColorpickerSliderDirective_el, "f").nativeElement.getBoundingClientRect().left -
             window.pageXOffset);
     }
     getY(event) {
         /* Ignoring event.touches as tests are not run on a touch device. */
         /* istanbul ignore next */
         return (('pageY' in event ? event.pageY : event.touches[0].pageY) -
-            this.el.nativeElement.getBoundingClientRect().top -
+            __classPrivateFieldGet(this, _SkyColorpickerSliderDirective_el, "f").nativeElement.getBoundingClientRect().top -
             window.pageYOffset);
     }
 }
-_SkyColorpickerSliderDirective_listenerMove = new WeakMap(), _SkyColorpickerSliderDirective_listenerStop = new WeakMap(), _SkyColorpickerSliderDirective_instances = new WeakSet(), _SkyColorpickerSliderDirective_setCursor = function _SkyColorpickerSliderDirective_setCursor(event) {
-    const height = this.el.nativeElement.offsetHeight;
-    const width = this.el.nativeElement.offsetWidth;
+_SkyColorpickerSliderDirective_listenerMove = new WeakMap(), _SkyColorpickerSliderDirective_listenerStop = new WeakMap(), _SkyColorpickerSliderDirective_el = new WeakMap(), _SkyColorpickerSliderDirective_instances = new WeakSet(), _SkyColorpickerSliderDirective_setCursor = function _SkyColorpickerSliderDirective_setCursor(event) {
+    const height = __classPrivateFieldGet(this, _SkyColorpickerSliderDirective_el, "f").nativeElement.offsetHeight;
+    const width = __classPrivateFieldGet(this, _SkyColorpickerSliderDirective_el, "f").nativeElement.offsetWidth;
     const xAxis = Math.max(0, Math.min(this.getX(event), width));
     const yAxis = Math.max(0, Math.min(this.getY(event), height));
     if (this.xAxis !== undefined && this.yAxis !== undefined) {
@@ -865,7 +866,7 @@ var SkyColorpickerMessageType;
     SkyColorpickerMessageType[SkyColorpickerMessageType["Close"] = 3] = "Close";
 })(SkyColorpickerMessageType || (SkyColorpickerMessageType = {}));
 
-var _SkyColorpickerComponent_instances, _SkyColorpickerComponent_idIndex, _SkyColorpickerComponent_alphaChannel, _SkyColorpickerComponent_format, _SkyColorpickerComponent_outputFormat, _SkyColorpickerComponent_hsva, _SkyColorpickerComponent_sliderDimMax, _SkyColorpickerComponent_ngUnsubscribe, _SkyColorpickerComponent_affixer, _SkyColorpickerComponent_overlay, _SkyColorpickerComponent_pickerUnsubscribe, _SkyColorpickerComponent_affixSvc, _SkyColorpickerComponent_changeDetector, _SkyColorpickerComponent_coreAdapter, _SkyColorpickerComponent_overlaySvc, _SkyColorpickerComponent_svc, _SkyColorpickerComponent_themeSvc, _SkyColorpickerComponent__backgroundColorForDisplay, _SkyColorpickerComponent__colorpickerRef, _SkyColorpickerComponent__disabled, _SkyColorpickerComponent_update, _SkyColorpickerComponent_updateSlider, _SkyColorpickerComponent_openPicker, _SkyColorpickerComponent_sendMessage, _SkyColorpickerComponent_handleIncomingMessages, _SkyColorpickerComponent_createAffixer, _SkyColorpickerComponent_destroyAffixer, _SkyColorpickerComponent_addTriggerButtonEventListeners, _SkyColorpickerComponent_removePickerEventListeners, _SkyColorpickerComponent_getHsvaValue, _SkyColorpickerComponent_getAccessibleIconColor;
+var _SkyColorpickerComponent_instances, _SkyColorpickerComponent_idIndex, _SkyColorpickerComponent_alphaChannel, _SkyColorpickerComponent_format, _SkyColorpickerComponent_outputFormat, _SkyColorpickerComponent_hsva, _SkyColorpickerComponent_sliderDimMax, _SkyColorpickerComponent_ngUnsubscribe, _SkyColorpickerComponent_affixer, _SkyColorpickerComponent_overlay, _SkyColorpickerComponent_pickerUnsubscribe, _SkyColorpickerComponent_affixSvc, _SkyColorpickerComponent_changeDetector, _SkyColorpickerComponent_coreAdapter, _SkyColorpickerComponent_overlaySvc, _SkyColorpickerComponent_svc, _SkyColorpickerComponent_themeSvc, _SkyColorpickerComponent__backgroundColorForDisplay, _SkyColorpickerComponent__colorpickerRef, _SkyColorpickerComponent__disabled, _SkyColorpickerComponent_update, _SkyColorpickerComponent_updateSlider, _SkyColorpickerComponent_openPicker, _SkyColorpickerComponent_sendMessage, _SkyColorpickerComponent_handleIncomingMessages, _SkyColorpickerComponent_createAffixer, _SkyColorpickerComponent_destroyAffixer, _SkyColorpickerComponent_createOverlay, _SkyColorpickerComponent_destroyOverlay, _SkyColorpickerComponent_addTriggerButtonEventListeners, _SkyColorpickerComponent_removePickerEventListeners, _SkyColorpickerComponent_getHsvaValue, _SkyColorpickerComponent_getAccessibleIconColor;
 let componentIdIndex = 0;
 /**
  * Provides a SKY UX-themed replacement for the HTML `input` element with `type="color"`.
@@ -1089,7 +1090,7 @@ class SkyColorpickerComponent {
         __classPrivateFieldGet(this, _SkyColorpickerComponent_ngUnsubscribe, "f").complete();
         __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_removePickerEventListeners).call(this);
         __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_destroyAffixer).call(this);
-        this.destroyOverlay();
+        __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_destroyOverlay).call(this);
     }
     onTriggerButtonClick() {
         __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_sendMessage).call(this, SkyColorpickerMessageType.Open);
@@ -1097,7 +1098,7 @@ class SkyColorpickerComponent {
     closePicker() {
         var _b;
         __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_destroyAffixer).call(this);
-        this.destroyOverlay();
+        __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_destroyOverlay).call(this);
         __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_removePickerEventListeners).call(this);
         (_b = this.triggerButtonRef) === null || _b === void 0 ? void 0 : _b.nativeElement.focus();
         this.isOpen = false;
@@ -1130,24 +1131,6 @@ class SkyColorpickerComponent {
             __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_update).call(this);
         }
     }
-    createOverlay() {
-        if (this.colorpickerTemplateRef) {
-            const overlay = __classPrivateFieldGet(this, _SkyColorpickerComponent_overlaySvc, "f").create({
-                enableClose: false,
-                enablePointerEvents: false,
-                enableScroll: true,
-            });
-            overlay.attachTemplate(this.colorpickerTemplateRef);
-            __classPrivateFieldSet(this, _SkyColorpickerComponent_overlay, overlay, "f");
-        }
-    }
-    destroyOverlay() {
-        /*istanbul ignore else*/
-        if (__classPrivateFieldGet(this, _SkyColorpickerComponent_overlay, "f")) {
-            __classPrivateFieldGet(this, _SkyColorpickerComponent_overlaySvc, "f").close(__classPrivateFieldGet(this, _SkyColorpickerComponent_overlay, "f"));
-            __classPrivateFieldSet(this, _SkyColorpickerComponent_overlay, undefined, "f");
-        }
-    }
 }
 _SkyColorpickerComponent_idIndex = new WeakMap(), _SkyColorpickerComponent_alphaChannel = new WeakMap(), _SkyColorpickerComponent_format = new WeakMap(), _SkyColorpickerComponent_outputFormat = new WeakMap(), _SkyColorpickerComponent_hsva = new WeakMap(), _SkyColorpickerComponent_sliderDimMax = new WeakMap(), _SkyColorpickerComponent_ngUnsubscribe = new WeakMap(), _SkyColorpickerComponent_affixer = new WeakMap(), _SkyColorpickerComponent_overlay = new WeakMap(), _SkyColorpickerComponent_pickerUnsubscribe = new WeakMap(), _SkyColorpickerComponent_affixSvc = new WeakMap(), _SkyColorpickerComponent_changeDetector = new WeakMap(), _SkyColorpickerComponent_coreAdapter = new WeakMap(), _SkyColorpickerComponent_overlaySvc = new WeakMap(), _SkyColorpickerComponent_svc = new WeakMap(), _SkyColorpickerComponent_themeSvc = new WeakMap(), _SkyColorpickerComponent__backgroundColorForDisplay = new WeakMap(), _SkyColorpickerComponent__colorpickerRef = new WeakMap(), _SkyColorpickerComponent__disabled = new WeakMap(), _SkyColorpickerComponent_instances = new WeakSet(), _SkyColorpickerComponent_update = function _SkyColorpickerComponent_update() {
     var _a;
@@ -1180,8 +1163,8 @@ _SkyColorpickerComponent_idIndex = new WeakMap(), _SkyColorpickerComponent_alpha
 }, _SkyColorpickerComponent_openPicker = function _SkyColorpickerComponent_openPicker() {
     this.isPickerVisible = false;
     __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_removePickerEventListeners).call(this);
-    this.destroyOverlay();
-    this.createOverlay();
+    __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_destroyOverlay).call(this);
+    __classPrivateFieldGet(this, _SkyColorpickerComponent_instances, "m", _SkyColorpickerComponent_createOverlay).call(this);
     this.isOpen = true;
 }, _SkyColorpickerComponent_sendMessage = function _SkyColorpickerComponent_sendMessage(type) {
     this.messageStream.next({ type });
@@ -1234,6 +1217,22 @@ _SkyColorpickerComponent_idIndex = new WeakMap(), _SkyColorpickerComponent_alpha
         __classPrivateFieldGet(this, _SkyColorpickerComponent_affixer, "f").destroy();
         __classPrivateFieldSet(this, _SkyColorpickerComponent_affixer, undefined, "f");
     }
+}, _SkyColorpickerComponent_createOverlay = function _SkyColorpickerComponent_createOverlay() {
+    if (this.colorpickerTemplateRef) {
+        const overlay = __classPrivateFieldGet(this, _SkyColorpickerComponent_overlaySvc, "f").create({
+            enableClose: false,
+            enablePointerEvents: false,
+            enableScroll: true,
+        });
+        overlay.attachTemplate(this.colorpickerTemplateRef);
+        __classPrivateFieldSet(this, _SkyColorpickerComponent_overlay, overlay, "f");
+    }
+}, _SkyColorpickerComponent_destroyOverlay = function _SkyColorpickerComponent_destroyOverlay() {
+    /*istanbul ignore else*/
+    if (__classPrivateFieldGet(this, _SkyColorpickerComponent_overlay, "f")) {
+        __classPrivateFieldGet(this, _SkyColorpickerComponent_overlaySvc, "f").close(__classPrivateFieldGet(this, _SkyColorpickerComponent_overlay, "f"));
+        __classPrivateFieldSet(this, _SkyColorpickerComponent_overlay, undefined, "f");
+    }
 }, _SkyColorpickerComponent_addTriggerButtonEventListeners = function _SkyColorpickerComponent_addTriggerButtonEventListeners() {
     fromEvent(window.document, 'keydown')
         .pipe(takeUntil(__classPrivateFieldGet(this, _SkyColorpickerComponent_ngUnsubscribe, "f")))