@refinitiv-ui/elements 5.11.0 → 5.12.0-alpha.0

package/lib/color-dialog/helpers/color-helpers.js

@@ -1,161 +0,0 @@
-/**
- * SVG polygons per color
- */
-export const COLOR_ITEMS = [
-    ['63,0,72,4,72,15,63,19,54,15,54,4', '#003366'],
-    ['81,0,90,4,90,15,81,19,72,15,72,4', '#336699'],
-    ['99,0,108,4,108,15,99,19,90,15,90,4', '#3366cc'],
-    ['117,0,126,4,126,15,117,19,108,15,108,4', '#003399'],
-    ['135,0,144,4,144,15,135,19,126,15,126,4', '#000099'],
-    ['153,0,162,4,162,15,153,19,144,15,144,4', '#0000cc'],
-    ['171,0,180,4,180,15,171,19,162,15,162,4', '#000066'],
-    ['54,15,63,19,63,30,54,34,45,30,45,19', '#006666'],
-    ['72,15,81,19,81,30,72,34,63,30,63,19', '#006699'],
-    ['90,15,99,19,99,30,90,34,81,30,81,19', '#0099cc'],
-    ['108,15,117,19,117,30,108,34,99,30,99,19', '#0066cc'],
-    ['126,15,135,19,135,30,126,34,117,30,117,19', '#0033cc'],
-    ['144,15,153,19,153,30,144,34,135,30,135,19', '#0000ff'],
-    ['162,15,171,19,171,30,162,34,153,30,153,19', '#3333ff'],
-    ['180,15,189,19,189,30,180,34,171,30,171,19', '#333399'],
-    ['45,30,54,34,54,45,45,49,36,45,36,34', '#669999'],
-    ['63,30,72,34,72,45,63,49,54,45,54,34', '#009999'],
-    ['81,30,90,34,90,45,81,49,72,45,72,34', '#33cccc'],
-    ['99,30,108,34,108,45,99,49,90,45,90,34', '#00ccff'],
-    ['117,30,126,34,126,45,117,49,108,45,108,34', '#0099ff'],
-    ['135,30,144,34,144,45,135,49,126,45,126,34', '#0066ff'],
-    ['153,30,162,34,162,45,153,49,144,45,144,34', '#3366ff'],
-    ['171,30,180,34,180,45,171,49,162,45,162,34', '#3333cc'],
-    ['189,30,198,34,198,45,189,49,180,45,180,34', '#666699'],
-    ['36,45,45,49,45,60,36,64,27,60,27,49', '#339966'],
-    ['54,45,63,49,63,60,54,64,45,60,45,49', '#00cc99'],
-    ['72,45,81,49,81,60,72,64,63,60,63,49', '#00ffcc'],
-    ['90,45,99,49,99,60,90,64,81,60,81,49', '#00ffff'],
-    ['108,45,117,49,117,60,108,64,99,60,99,49', '#33ccff'],
-    ['126,45,135,49,135,60,126,64,117,60,117,49', '#3399ff'],
-    ['144,45,153,49,153,60,144,64,135,60,135,49', '#6699ff'],
-    ['162,45,171,49,171,60,162,64,153,60,153,49', '#6666ff'],
-    ['180,45,189,49,189,60,180,64,171,60,171,49', '#6600ff'],
-    ['198,45,207,49,207,60,198,64,189,60,189,49', '#6600cc'],
-    ['27,60,36,64,36,75,27,79,18,75,18,64', '#339933'],
-    ['45,60,54,64,54,75,45,79,36,75,36,64', '#00cc66'],
-    ['63,60,72,64,72,75,63,79,54,75,54,64', '#00ff99'],
-    ['81,60,90,64,90,75,81,79,72,75,72,64', '#66ffcc'],
-    ['99,60,108,64,108,75,99,79,90,75,90,64', '#66ffff'],
-    ['117,60,126,64,126,75,117,79,108,75,108,64', '#66ccff'],
-    ['135,60,144,64,144,75,135,79,126,75,126,64', '#99ccff'],
-    ['153,60,162,64,162,75,153,79,144,75,144,64', '#9999ff'],
-    ['171,60,180,64,180,75,171,79,162,75,162,64', '#9966ff'],
-    ['189,60,198,64,198,75,189,79,180,75,180,64', '#9933ff'],
-    ['207,60,216,64,216,75,207,79,198,75,198,64', '#9900ff'],
-    ['18,75,27,79,27,90,18,94,9,90,9,79', '#006600'],
-    ['36,75,45,79,45,90,36,94,27,90,27,79', '#00cc00'],
-    ['54,75,63,79,63,90,54,94,45,90,45,79', '#00ff00'],
-    ['72,75,81,79,81,90,72,94,63,90,63,79', '#66ff99'],
-    ['90,75,99,79,99,90,90,94,81,90,81,79', '#99ffcc'],
-    ['108,75,117,79,117,90,108,94,99,90,99,79', '#ccffff'],
-    ['126,75,135,79,135,90,126,94,117,90,117,79', '#ccccff'],
-    ['144,75,153,79,153,90,144,94,135,90,135,79', '#cc99ff'],
-    ['162,75,171,79,171,90,162,94,153,90,153,79', '#cc66ff'],
-    ['180,75,189,79,189,90,180,94,171,90,171,79', '#cc33ff'],
-    ['198,75,207,79,207,90,198,94,189,90,189,79', '#cc00ff'],
-    ['216,75,225,79,225,90,216,94,207,90,207,79', '#9900cc'],
-    ['9,90,18,94,18,105,9,109,0,105,0,94', '#003300'],
-    ['27,90,36,94,36,105,27,109,18,105,18,94', '#009933'],
-    ['45,90,54,94,54,105,45,109,36,105,36,94', '#33cc33'],
-    ['63,90,72,94,72,105,63,109,54,105,54,94', '#66ff66'],
-    ['81,90,90,94,90,105,81,109,72,105,72,94', '#99ff99'],
-    ['99,90,108,94,108,105,99,109,90,105,90,94', '#ccffcc'],
-    ['117,90,126,94,126,105,117,109,108,105,108,94', '#ffffff'],
-    ['135,90,144,94,144,105,135,109,126,105,126,94', '#ffccff'],
-    ['153,90,162,94,162,105,153,109,144,105,144,94', '#ff99ff'],
-    ['171,90,180,94,180,105,171,109,162,105,162,94', '#ff66ff'],
-    ['189,90,198,94,198,105,189,109,180,105,180,94', '#ff00ff'],
-    ['207,90,216,94,216,105,207,109,198,105,198,94', '#cc00cc'],
-    ['225,90,234,94,234,105,225,109,216,105,216,94', '#660066'],
-    ['18,105,27,109,27,120,18,124,9,120,9,109', '#336600'],
-    ['36,105,45,109,45,120,36,124,27,120,27,109', '#009900'],
-    ['54,105,63,109,63,120,54,124,45,120,45,109', '#66ff33'],
-    ['72,105,81,109,81,120,72,124,63,120,63,109', '#99ff66'],
-    ['90,105,99,109,99,120,90,124,81,120,81,109', '#ccff99'],
-    ['108,105,117,109,117,120,108,124,99,120,99,109', '#ffffcc'],
-    ['126,105,135,109,135,120,126,124,117,120,117,109', '#ffcccc'],
-    ['144,105,153,109,153,120,144,124,135,120,135,109', '#ff99cc'],
-    ['162,105,171,109,171,120,162,124,153,120,153,109', '#ff66cc'],
-    ['180,105,189,109,189,120,180,124,171,120,171,109', '#ff33cc'],
-    ['198,105,207,109,207,120,198,124,189,120,189,109', '#cc0099'],
-    ['216,105,225,109,225,120,216,124,207,120,207,109', '#993399'],
-    ['27,120,36,124,36,135,27,139,18,135,18,124', '#333300'],
-    ['45,120,54,124,54,135,45,139,36,135,36,124', '#669900'],
-    ['63,120,72,124,72,135,63,139,54,135,54,124', '#99ff33'],
-    ['81,120,90,124,90,135,81,139,72,135,72,124', '#ccff66'],
-    ['99,120,108,124,108,135,99,139,90,135,90,124', '#ffff99'],
-    ['117,120,126,124,126,135,117,139,108,135,108,124', '#ffcc99'],
-    ['135,120,144,124,144,135,135,139,126,135,126,124', '#ff9999'],
-    ['153,120,162,124,162,135,153,139,144,135,144,124', '#ff6699'],
-    ['171,120,180,124,180,135,171,139,162,135,162,124', '#ff3399'],
-    ['189,120,198,124,198,135,189,139,180,135,180,124', '#cc3399'],
-    ['207,120,216,124,216,135,207,139,198,135,198,124', '#990099'],
-    ['36,135,45,139,45,150,36,154,27,150,27,139', '#666633'],
-    ['54,135,63,139,63,150,54,154,45,150,45,139', '#99cc00'],
-    ['72,135,81,139,81,150,72,154,63,150,63,139', '#ccff33'],
-    ['90,135,99,139,99,150,90,154,81,150,81,139', '#ffff66'],
-    ['108,135,117,139,117,150,108,154,99,150,99,139', '#ffcc66'],
-    ['126,135,135,139,135,150,126,154,117,150,117,139', '#ff9966'],
-    ['144,135,153,139,153,150,144,154,135,150,135,139', '#ff6666'],
-    ['162,135,171,139,171,150,162,154,153,150,153,139', '#ff0066'],
-    ['180,135,189,139,189,150,180,154,171,150,171,139', '#cc6699'],
-    ['198,135,207,139,207,150,198,154,189,150,189,139', '#993366'],
-    ['45,150,54,154,54,165,45,169,36,165,36,154', '#999966'],
-    ['63,150,72,154,72,165,63,169,54,165,54,154', '#cccc00'],
-    ['81,150,90,154,90,165,81,169,72,165,72,154', '#ffff00'],
-    ['99,150,108,154,108,165,99,169,90,165,90,154', '#ffcc00'],
-    ['117,150,126,154,126,165,117,169,108,165,108,154', '#ff9933'],
-    ['135,150,144,154,144,165,135,169,126,165,126,154', '#ff6600'],
-    ['153,150,162,154,162,165,153,169,144,165,144,154', '#ff5050'],
-    ['171,150,180,154,180,165,171,169,162,165,162,154', '#cc0066'],
-    ['189,150,198,154,198,165,189,169,180,165,180,154', '#660033'],
-    ['54,165,63,169,63,180,54,184,45,180,45,169', '#996633'],
-    ['72,165,81,169,81,180,72,184,63,180,63,169', '#cc9900'],
-    ['90,165,99,169,99,180,90,184,81,180,81,169', '#ff9900'],
-    ['108,165,117,169,117,180,108,184,99,180,99,169', '#cc6600'],
-    ['126,165,135,169,135,180,126,184,117,180,117,169', '#ff3300'],
-    ['144,165,153,169,153,180,144,184,135,180,135,169', '#ff0000'],
-    ['162,165,171,169,171,180,162,184,153,180,153,169', '#cc0000'],
-    ['180,165,189,169,189,180,180,184,171,180,171,169', '#990033'],
-    ['63,180,72,184,72,195,63,199,54,195,54,184', '#663300'],
-    ['81,180,90,184,90,195,81,199,72,195,72,184', '#996600'],
-    ['99,180,108,184,108,195,99,199,90,195,90,184', '#cc3300'],
-    ['117,180,126,184,126,195,117,199,108,195,108,184', '#993300'],
-    ['135,180,144,184,144,195,135,199,126,195,126,184', '#990000'],
-    ['153,180,162,184,162,195,153,199,144,195,144,184', '#800000'],
-    ['171,180,180,184,180,195,171,199,162,195,162,184', '#993333']
-];
-/**
- * SVG polygons per grayscale items
- */
-export const GRAYSCALE_ITEMS = [
-    ['29, 2, 38, 6, 38, 17, 29, 21, 20, 17, 20, 6', '#ffffff'],
-    ['47, 2, 56, 6, 56, 17, 47, 21, 38, 17, 38, 6', '#eaeaea'],
-    ['65, 2, 74, 6, 74, 17, 65, 21, 56, 17, 56, 6', '#b2b2b2'],
-    ['83, 2, 92, 6, 92, 17, 83, 21, 74, 17, 74, 6', '#777777'],
-    ['101, 2, 110, 6, 110, 17, 101, 21, 92, 17, 92, 6', '#4d4d4c'],
-    ['119, 2, 128, 6, 128, 17, 119, 21, 110, 17, 110, 6', '#323332'],
-    ['137, 2, 146, 6, 146, 17, 137, 21, 128, 17, 128, 6', '#282828'],
-    ['155, 2, 164, 6, 164, 17, 155, 21, 146, 17, 146, 6', '#000000']
-];
-export const NOCOLOR_POINTS = '6, 2, 15, 6, 15, 17, 6, 21, -3, 17, -3, 6';
-const HEX_REGEXP = /^#([0-9A-F]{3}){1,2}$/i; // used to validate HEX
-export const isHex = (value) => HEX_REGEXP.test(value);
-/**
- * Remove hash (#) sign from hex value
- * @param hex Hex to check
- * @returns hex value without # sign
- */
-export const removeHashSign = (hex) => {
-    if (hex) {
-        if (hex.startsWith('#')) {
-            hex = hex.slice(1);
-        }
-    }
-    return hex;
-};

package/lib/color-dialog/helpers/value-model.d.ts

@@ -1,75 +0,0 @@
-/**
- * A helper model in order to keep and update values between RGB and HEX
- */
-declare class ValueModel {
-    private initialValue;
-    private _hex;
-    private _red;
-    private _green;
-    private _blue;
-    /**
-     * Create the new value model
-     * @param value A valid hex value (e.g. "#ffffff") or an empty string
-     */
-    constructor(value?: string);
-    private getHexValue;
-    private isValidRGBValue;
-    private isValidHexValue;
-    private isValidRGB;
-    private isValidHex;
-    /**
-     * Check if new value is different to initial
-     * ignoring hex length
-     * @returns true if different
-     */
-    hasChanged(): boolean;
-    /**
-     * Check if RGB and Hex values are valid
-     * @returns true if both are valid
-     */
-    isValid(): boolean;
-    /**
-     * Set red color from RGB pallette.
-     * Setting this overrides hex
-     * @param red Red color, the string number from 0 - 255
-     */
-    set red(red: string);
-    /**
-     * Get red color from RGB pallette
-     */
-    get red(): string;
-    /**
-     * Set green color from RGB pallette.
-     * Setting this overrides hex
-     * @param green Green color, the string number from 0 - 255
-     */
-    set green(green: string);
-    /**
-     * Get green color from RGB pallette
-     */
-    get green(): string;
-    /**
-     * Set blue color from RGB pallette.
-     * Setting this overrides hex
-     * @param blue Blue color, the string number from 0 - 255
-     */
-    set blue(blue: string);
-    /**
-     * Get blue color from RGB pallette
-     */
-    get blue(): string;
-    /**
-     * Set hex value. Setting hex overrides RGB
-     * @param hex Hex value, e.g. "ffffff" or "#ffffff"
-     */
-    set hex(hex: string);
-    /**
-     * Get the hex value (hex without #, e.g "ffffff").
-     */
-    get hex(): string;
-    /**
-     * Get the value. Value is Hex with #, e.g. "#ffffff"
-     */
-    get value(): string;
-}
-export { ValueModel };

package/lib/color-dialog/helpers/value-model.js

@@ -1,141 +0,0 @@
-import { rgb } from '@refinitiv-ui/utils/lib/color.js';
-import { isHex } from './color-helpers.js';
-const rgbNumberToString = (value) => isNaN(value) ? '' : `${value}`; // replace NaN with empty string
-/**
- * A helper model in order to keep and update values between RGB and HEX
- */
-class ValueModel {
-    /**
-     * Create the new value model
-     * @param value A valid hex value (e.g. "#ffffff") or an empty string
-     */
-    constructor(value = '') {
-        this.initialValue = value;
-        const { r, g, b } = rgb(value);
-        this._red = rgbNumberToString(r);
-        this._green = rgbNumberToString(g);
-        this._blue = rgbNumberToString(b);
-        this._hex = value.slice(1);
-    }
-    getHexValue() {
-        if (this.red === '' && this.green === '' && this.blue === '') {
-            return '';
-        }
-        else if (!this.isValidRGB()) {
-            return '';
-        }
-        const hex = rgb(Number(this.red), Number(this.green), Number(this.blue)).formatHex();
-        return hex ? hex.slice(1) : '';
-    }
-    isValidRGBValue(value) {
-        return value === '' || Number(value) >= 0 && Number(value) <= 255;
-    }
-    isValidHexValue(value) {
-        return value === '' || isHex(`#${value}`);
-    }
-    isValidRGB() {
-        return this.isValidRGBValue(this.red)
-            && this.isValidRGBValue(this.green)
-            && this.isValidRGBValue(this.blue);
-    }
-    isValidHex() {
-        return this.isValidHexValue(this.hex);
-    }
-    /**
-     * Check if new value is different to initial
-     * ignoring hex length
-     * @returns true if different
-     */
-    hasChanged() {
-        return rgb(this.initialValue).formatHex() !== rgb(this.value).formatHex();
-    }
-    /**
-     * Check if RGB and Hex values are valid
-     * @returns true if both are valid
-     */
-    isValid() {
-        return this.isValidRGB() && this.isValidHex();
-    }
-    /**
-     * Set red color from RGB pallette.
-     * Setting this overrides hex
-     * @param red Red color, the string number from 0 - 255
-     */
-    set red(red) {
-        this._red = red;
-        this._green = this._green || '0';
-        this._blue = this._blue || '0';
-        this._hex = this.getHexValue();
-    }
-    /**
-     * Get red color from RGB pallette
-     */
-    get red() {
-        return this._red;
-    }
-    /**
-     * Set green color from RGB pallette.
-     * Setting this overrides hex
-     * @param green Green color, the string number from 0 - 255
-     */
-    set green(green) {
-        this._green = green;
-        this._red = this._red || '0';
-        this._blue = this._blue || '0';
-        this._hex = this.getHexValue();
-    }
-    /**
-     * Get green color from RGB pallette
-     */
-    get green() {
-        return this._green;
-    }
-    /**
-     * Set blue color from RGB pallette.
-     * Setting this overrides hex
-     * @param blue Blue color, the string number from 0 - 255
-     */
-    set blue(blue) {
-        this._blue = blue;
-        this._red = this._red || '0';
-        this._green = this._green || '0';
-        this._hex = this.getHexValue();
-    }
-    /**
-     * Get blue color from RGB pallette
-     */
-    get blue() {
-        return this._blue;
-    }
-    /**
-     * Set hex value. Setting hex overrides RGB
-     * @param hex Hex value, e.g. "ffffff" or "#ffffff"
-     */
-    set hex(hex) {
-        if (!this.isValidHexValue(hex)) {
-            this._red = '';
-            this._green = '';
-            this._blue = '';
-        }
-        else {
-            const { r, g, b } = rgb(`#${hex}`);
-            this._red = rgbNumberToString(r);
-            this._green = rgbNumberToString(g);
-            this._blue = rgbNumberToString(b);
-        }
-        this._hex = hex;
-    }
-    /**
-     * Get the hex value (hex without #, e.g "ffffff").
-     */
-    get hex() {
-        return this._hex;
-    }
-    /**
-     * Get the value. Value is Hex with #, e.g. "#ffffff"
-     */
-    get value() {
-        return this._hex ? `#${this._hex}` : '';
-    }
-}
-export { ValueModel };

package/lib/color-dialog/index.d.ts

@@ -1,232 +0,0 @@
-import { JSXInterface } from '../jsx';
-import { TemplateResult, CSSResultGroup, PropertyValues } from '@refinitiv-ui/core';
-import '../button/index.js';
-import '../number-field/index.js';
-import '../text-field/index.js';
-import { Dialog } from '../dialog/index.js';
-import './elements/color-palettes.js';
-import './elements/grayscale-palettes.js';
-import { Translate } from '@refinitiv-ui/translate';
-import '@refinitiv-ui/phrasebook/lib/locale/en/color-dialog.js';
-/**
- * Displays a colour picker dialog,
- * for selecting a predefined range of colours.
- *
- * @fires value-changed - Fired when the `value` property changes.
- * @fires opened-changed - Fired when the `opened` property changes.
- *
- * @attr {string | null} header - Set Header/Title of the color dialog
- * @prop {string | null} [header=null] - Set Header/Title of the color dialog
- *
- * @attr {boolean} [opened=false] - Set dialog to open
- * @prop {boolean} [opened=false] - Set dialog to open
- *
- * @attr {boolean} [no-cancel-on-esc-key=false] - Prevents dialog to close when user presses ESC key
- * @prop {boolean} [noCancelOnEscKey=false] - Prevents dialog to close when user presses ESC key
- *
- * @attr {string | undefined} x - Set a specific x coordinate of dialog
- * @prop {string | undefined} x - Set a specific x coordinate of dialog
- *
- * @attr {string | undefined} y - Set a specific y coordinate of dialog
- * @prop {string | undefined} y - Set a specific y coordinate of dialog
- *
- * @attr {string | undefined} position-target - Set position of dialog i.e. `top`, `right`, `left`, `bottom`, `center` or combination of theme e.g. `top right`.
- * @prop {string | undefined} positionTarget - Set position of dialog i.e. `top`, `right`, `left`, `bottom`, `center` or combination of theme e.g. `top right`.
- *
- * @prop {boolean} [noCancelOnOutsideClick=true] - Prevents dialog to close when user clicks outside the dialog.
- *
- * @prop {boolean} [withBackdrop=true] - False to hide backdrop.
- *
- * @prop {boolean} [draggable=true] - False to make the dialog not draggable.
- *
- * @prop {boolean} [withShadow=true] - False to remove shadow for dialog component.
- */
-export declare class ColorDialog extends Dialog {
-    /**
-     * Element version number
-     * @returns version number
-     */
-    static get version(): string;
-    /**
-     * A `CSSResultGroup` that will be used
-     * to style the host, slotted children
-     * and the internal template of the element.
-     * @return CSS template
-     */
-    static get styles(): CSSResultGroup;
-    /**
-     * speed up rendering by not populating content on page load
-     */
-    private lazyRendered;
-    /**
-     * Color dialog has commit button to update actual values
-     * Value model is used to support this functionality
-     */
-    private valueModel;
-    /**
-    * @ignore
-    */
-    draggable: boolean;
-    /**
-     * Set the palettes to activate no-color option
-     */
-    allowNocolor: boolean;
-    private _value;
-    /**
-     * Value of selected color from color dialog will be written here as hex value
-     * e.g. "#00f" or "#0000ff"
-     * @default -
-     * @param value A value to set
-     */
-    set value(value: string);
-    get value(): string;
-    /**
-     * Value of hex without # sign, supports both 3-digits shorthand hex and regular 6-digits hex
-     * @default -
-     * @param hex A hex value to set
-     */
-    set hex(hex: string);
-    get hex(): string;
-    /**
-     * Red value from 0 to 255
-     * @default -
-     * @param red Red value
-     */
-    set red(red: string);
-    get red(): string;
-    /**
-     * Green value from 0 to 255
-     * @default -
-     * @param green Green value
-     */
-    set green(green: string);
-    get green(): string;
-    /**
-     * Blue value from 0 to 255
-     * @default -
-     * @param blue Blue value
-     */
-    set blue(blue: string);
-    get blue(): string;
-    /**
-     * Used for translations
-     */
-    protected t: Translate;
-    /**
-     * A rgb color input for red spectrum
-     */
-    private redInputEl?;
-    /**
-     * A rgb color input for green spectrum
-     */
-    private greenInputEl?;
-    /**
-     * A rgb color input for blue spectrum
-     */
-    private blueInputEl?;
-    /**
-     * Check if component should be updated
-     * @param changedProperties properties changed on shouldUpdate lifecycle callback
-     * @returns boolean should component update
-     */
-    protected shouldUpdate(changedProperties: PropertyValues): boolean;
-    /**
-     * Updates the element
-     * @param changedProperties Properties that has changed
-     * @returns {void}
-     */
-    protected update(changedProperties: PropertyValues): void;
-    /**
-     * @inheritdoc
-     * Reset value model
-     * @param opened True if opened
-     * @returns {void}
-     */
-    protected setOpened(opened: boolean): void;
-    /**
-     * Reset value model always resets
-     * when either red, green, blue, hex or value are changed externally
-     * Value model is reset internally otherwise
-     * @returns {void}
-     */
-    private resetValueModel;
-    /**
-     * Check if value is valid HEX value (including #)
-     * @param value Value to check
-     * @returns true if value is valid
-     */
-    private isValidValue;
-    /**
-     * Check if value is valid HEX value (excluding #)
-     * @param value Value to check
-     * @returns true if value is valid
-     */
-    private isValidHex;
-    /**
-     * Check if value is within 0 - 255, and warn of it is not
-     * @param value Value to check
-     * @returns true if value is within 0 - 255
-     */
-    private isValidRGB;
-    /**
-     * update color value when tapping or dragging on color palettes
-     * @param event select color event
-     * @return {void}
-     */
-    private onColorChanged;
-    /**
-     * update hex value when typing on hex input
-     * @param event input event
-     * @return {void}
-     */
-    private onHexChanged;
-    /**
-     * update r,g,b value when typing on RGB inputs
-     * @param event input event
-     * @return {void}
-     */
-    private onRGBChanged;
-    /**
-     * set opened state to false
-     * @return {void}
-     */
-    private onCloseDialog;
-    /**
-     * fired value-changed event and close dialog
-     * @return {void}
-     */
-    private onConfirmValue;
-    /**
-     * Check if apply button is disabled
-     * The button is disabled if value is invalid
-     * or value has not changed
-     * @returns {boolean} true if disabled
-     */
-    private isApplyDisabled;
-    /**
-     * A `TemplateResult` that will be used
-     * to render the updated internal template.
-     * @return {TemplateResult}  Render template
-     */
-    protected get contentRegion(): TemplateResult;
-    /**
-     * A `TemplateResult` that will be used
-     * to render the updated internal template.
-     * @return {TemplateResult}  Render template
-     */
-    protected get footerRegion(): TemplateResult;
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    'ef-color-dialog': ColorDialog;
-  }
-
-  namespace JSX {
-    interface IntrinsicElements {
-      'ef-color-dialog': Partial<ColorDialog> | JSXInterface.HTMLAttributes<ColorDialog>;
-    }
-  }
-}
-
-export {};