From 32d23844d6ee8e712296e89361ac554f6fe7db34 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Tue, 11 Apr 2023 16:00:33 +0300 Subject: [PATCH] UI: Updated tinycolor for version 1.6.0 --- ui-ngx/package.json | 2 +- .../home/components/widget/lib/analogue-gauge.models.ts | 4 +--- .../home/components/widget/lib/analogue-linear-gauge.ts | 5 +---- .../home/components/widget/lib/canvas-digital-gauge.ts | 4 +--- .../modules/home/components/widget/lib/digital-gauge.ts | 4 +--- .../app/modules/home/components/widget/lib/flot-widget.ts | 3 +-- .../home/components/widget/lib/rpc/knob.component.ts | 4 +--- .../components/widget/lib/rpc/led-indicator.component.ts | 4 +--- .../home/components/widget/lib/table-widget.models.ts | 4 +--- .../home/components/widget/widget-component.service.ts | 4 +--- .../shared/components/json-form/json-form.component.ts | 4 +--- .../shared/components/json-form/react/json-form-color.tsx | 4 +--- .../components/json-form/react/json-form-schema-form.tsx | 4 +--- .../shared/components/json-form/react/json-form.models.ts | 4 +--- ui-ngx/src/app/shared/components/led-light.component.ts | 4 +--- .../components/notification/notification.component.ts | 6 ++---- ui-ngx/src/app/shared/models/material.models.ts | 4 +--- ui-ngx/yarn.lock | 8 ++++---- 18 files changed, 22 insertions(+), 54 deletions(-) diff --git a/ui-ngx/package.json b/ui-ngx/package.json index de5e97f79f..f23e3f0b9a 100644 --- a/ui-ngx/package.json +++ b/ui-ngx/package.json @@ -97,7 +97,7 @@ "screenfull": "^6.0.2", "split.js": "^1.6.5", "systemjs": "6.11.0", - "tinycolor2": "~1.4.2", + "tinycolor2": "^1.6.0", "tinymce": "~5.10.7", "tooltipster": "^4.2.8", "ts-transformer-keys": "^0.4.4", diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/analogue-gauge.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/analogue-gauge.models.ts index 5229212418..31f40594ba 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/analogue-gauge.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/analogue-gauge.models.ts @@ -18,13 +18,11 @@ import * as CanvasGauges from 'canvas-gauges'; import { FontSettings, getFontFamily } from '@home/components/widget/lib/settings.models'; import { WidgetContext } from '@home/models/widget-component.models'; import { isDefined } from '@core/utils'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import Highlight = CanvasGauges.Highlight; import BaseGauge = CanvasGauges.BaseGauge; import GenericOptions = CanvasGauges.GenericOptions; -const tinycolor = tinycolor_; - export type AnimationRule = 'linear' | 'quad' | 'quint' | 'cycle' | 'bounce' | 'elastic' | 'dequad' | 'dequint' | 'decycle' | 'debounce' | 'delastic'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/analogue-linear-gauge.ts b/ui-ngx/src/app/modules/home/components/widget/lib/analogue-linear-gauge.ts index 6996155b4b..c0206f4f9b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/analogue-linear-gauge.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/analogue-linear-gauge.ts @@ -15,20 +15,17 @@ /// import * as CanvasGauges from 'canvas-gauges'; -import { JsonSettingsSchema } from '@shared/models/widget.models'; import { WidgetContext } from '@home/models/widget-component.models'; import { TbAnalogueGauge } from '@home/components/widget/lib/analogue-gauge.models'; import { AnalogueLinearGaugeSettings } from '@home/components/widget/lib/analogue-linear-gauge.models'; import { isDefined } from '@core/utils'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import LinearGaugeOptions = CanvasGauges.LinearGaugeOptions; import LinearGauge = CanvasGauges.LinearGauge; import BaseGauge = CanvasGauges.BaseGauge; -const tinycolor = tinycolor_; - // @dynamic export class TbAnalogueLinearGauge extends TbAnalogueGauge{ diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/canvas-digital-gauge.ts b/ui-ngx/src/app/modules/home/components/widget/lib/canvas-digital-gauge.ts index 903865a957..71987932a4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/canvas-digital-gauge.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/canvas-digital-gauge.ts @@ -16,14 +16,12 @@ import * as CanvasGauges from 'canvas-gauges'; import { FontStyle, FontWeight } from '@home/components/widget/lib/settings.models'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { ColorFormats } from 'tinycolor2'; import { isDefined, isDefinedAndNotNull, isString, isUndefined, padValue } from '@core/utils'; import GenericOptions = CanvasGauges.GenericOptions; import BaseGauge = CanvasGauges.BaseGauge; -const tinycolor = tinycolor_; - export type GaugeType = 'arc' | 'donut' | 'horizontalBar' | 'verticalBar'; export interface DigitalGaugeColorRange { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/digital-gauge.ts b/ui-ngx/src/app/modules/home/components/widget/lib/digital-gauge.ts index fcb90b06a4..84e99b3b80 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/digital-gauge.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/digital-gauge.ts @@ -23,7 +23,7 @@ import { DigitalGaugeSettings, FixedLevelColors } from '@home/components/widget/lib/digital-gauge.models'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { isDefined, isDefinedAndNotNull } from '@core/utils'; import { prepareFontSettings } from '@home/components/widget/lib/settings.models'; import { CanvasDigitalGauge, CanvasDigitalGaugeOptions } from '@home/components/widget/lib/canvas-digital-gauge'; @@ -41,8 +41,6 @@ import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; import { EMPTY, Observable } from 'rxjs'; import GenericOptions = CanvasGauges.GenericOptions; -const tinycolor = tinycolor_; - // @dynamic export class TbCanvasDigitalGauge { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts b/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts index aae7d2c37a..03e29769ff 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts @@ -54,14 +54,13 @@ import { TooltipValueFormatFunction } from './flot-widget.models'; import * as moment_ from 'moment'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { AggregationType } from '@shared/models/time/time.models'; import { CancelAnimationFrame } from '@core/services/raf.service'; import { UtilsService } from '@core/services/utils.service'; import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; import Timeout = NodeJS.Timeout; -const tinycolor = tinycolor_; const moment = moment_; export class TbFlot { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/knob.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/knob.component.ts index 17f46fda3c..36a2bca18d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/knob.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/knob.component.ts @@ -22,12 +22,10 @@ import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { isDefined, isNumber } from '@core/utils'; import { CanvasDigitalGaugeOptions } from '@home/components/widget/lib/canvas-digital-gauge'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { ResizeObserver } from '@juggle/resize-observer'; import GenericOptions = CanvasGauges.GenericOptions; -const tinycolor = tinycolor_; - interface KnobSettings { minValue: number; maxValue: number; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.ts index 430aafb996..8a048100d4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.ts @@ -20,7 +20,7 @@ import { WidgetContext } from '@home/models/widget-component.models'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { isDefined } from '@core/utils'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { UtilsService } from '@core/services/utils.service'; import { IWidgetSubscription, SubscriptionInfo, WidgetSubscriptionOptions } from '@core/api/widget-api.models'; import { DatasourceType, widgetType } from '@shared/models/widget.models'; @@ -28,8 +28,6 @@ import { EntityType } from '@shared/models/entity-type.models'; import { ResizeObserver } from '@juggle/resize-observer'; import Timeout = NodeJS.Timeout; -const tinycolor = tinycolor_; - const checkStatusPollingInterval = 10000; type RetrieveValueMethod = 'attribute' | 'timeseries'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts index 20cf5860b5..3cd343ea57 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts @@ -18,15 +18,13 @@ import { EntityId } from '@shared/models/id/entity-id'; import { DataKey, FormattedData, WidgetActionDescriptor, WidgetConfig } from '@shared/models/widget.models'; import { getDescendantProp, isDefined, isNotEmptyStr } from '@core/utils'; import { AlarmDataInfo, alarmFields } from '@shared/models/alarm.models'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { Direction, EntityDataSortOrder, EntityKey } from '@shared/models/query/query.models'; import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; import { WidgetContext } from '@home/models/widget-component.models'; import { UtilsService } from '@core/services/utils.service'; import { TranslateService } from '@ngx-translate/core'; -const tinycolor = tinycolor_; - type ColumnVisibilityOptions = 'visible' | 'hidden' | 'hidden-mobile'; type ColumnSelectionOptions = 'enabled' | 'disabled'; diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts b/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts index 1f946e791b..50627212ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts @@ -42,14 +42,12 @@ import { WidgetTypeId } from '@app/shared/models/id/widget-type-id'; import { TenantId } from '@app/shared/models/id/tenant-id'; import { SharedModule } from '@shared/shared.module'; import { MODULES_MAP } from '@shared/public-api'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import moment from 'moment'; import { IModulesMap } from '@modules/common/modules-map.models'; import { HOME_COMPONENTS_MODULE_TOKEN } from '@home/components/tokens'; import { widgetSettingsComponentsMap } from '@home/components/widget/lib/settings/widget-settings.module'; -const tinycolor = tinycolor_; - @Injectable() export class WidgetComponentService { diff --git a/ui-ngx/src/app/shared/components/json-form/json-form.component.ts b/ui-ngx/src/app/shared/components/json-form/json-form.component.ts index 46231bf54c..6ed1d133ae 100644 --- a/ui-ngx/src/app/shared/components/json-form/json-form.component.ts +++ b/ui-ngx/src/app/shared/components/json-form/json-form.component.ts @@ -35,7 +35,7 @@ import { deepClone, isString } from '@app/core/utils'; import { TranslateService } from '@ngx-translate/core'; import { JsonFormProps } from './react/json-form.models'; import inspector from 'schema-inspector'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { DialogService } from '@app/core/services/dialog.service'; // import * as React from 'react'; // import * as ReactDOM from 'react-dom'; @@ -48,8 +48,6 @@ import { forkJoin, from } from 'rxjs'; import { MouseEvent } from 'react'; import { TbPopoverService } from '@shared/components/popover.service'; -const tinycolor = tinycolor_; - @Component({ selector: 'tb-json-form', templateUrl: './json-form.component.html', diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx index 52d0b5df1f..0a827e6bc8 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx @@ -17,15 +17,13 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; import ThingsboardBaseComponent from './json-form-base-component'; import reactCSS from 'reactcss'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import TextField from '@material-ui/core/TextField'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; import IconButton from '@material-ui/core/IconButton'; import Clear from '@material-ui/icons/Clear'; import Tooltip from '@material-ui/core/Tooltip'; -const tinycolor = tinycolor_; - interface ThingsboardColorState extends JsonFormFieldState { color: tinycolor.ColorFormats.RGBA | null; focused: boolean; diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx index 086f4dd95e..4faa4abb01 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx @@ -43,13 +43,11 @@ import { } from './json-form.models'; import _ from 'lodash'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { GroupInfo } from '@shared/models/widget.models'; import ThingsboardMarkdown from '@shared/components/json-form/react/json-form-markdown'; import { MouseEvent } from 'react'; -const tinycolor = tinycolor_; - class ThingsboardSchemaForm extends React.Component { private hasConditions: boolean; diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form.models.ts b/ui-ngx/src/app/shared/components/json-form/react/json-form.models.ts index c8a75bcc58..88c86b2612 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form.models.ts +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form.models.ts @@ -14,12 +14,10 @@ /// limitations under the License. /// -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { GroupInfo } from '@shared/models/widget.models'; import { MouseEvent } from 'react'; -const tinycolor = tinycolor_; - export interface SchemaValidationResult { valid: boolean; error?: { diff --git a/ui-ngx/src/app/shared/components/led-light.component.ts b/ui-ngx/src/app/shared/components/led-light.component.ts index 482a8e9f92..4d62972673 100644 --- a/ui-ngx/src/app/shared/components/led-light.component.ts +++ b/ui-ngx/src/app/shared/components/led-light.component.ts @@ -17,9 +17,7 @@ import { AfterViewInit, Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core'; import { coerceBooleanProperty } from '@angular/cdk/coercion'; import { RaphaelElement, RaphaelPaper, RaphaelSet } from 'raphael'; -import * as tinycolor_ from 'tinycolor2'; - -const tinycolor = tinycolor_; +import tinycolor from 'tinycolor2'; interface CircleElement extends RaphaelElement { theGlow?: RaphaelSet; diff --git a/ui-ngx/src/app/shared/components/notification/notification.component.ts b/ui-ngx/src/app/shared/components/notification/notification.component.ts index e002cdb395..47fe65f4c6 100644 --- a/ui-ngx/src/app/shared/components/notification/notification.component.ts +++ b/ui-ngx/src/app/shared/components/notification/notification.component.ts @@ -26,7 +26,7 @@ import { import { UtilsService } from '@core/services/utils.service'; import { Router } from '@angular/router'; import { alarmSeverityTranslations } from '@shared/models/alarm.models'; -import * as tinycolor_ from 'tinycolor2'; +import tinycolor from 'tinycolor2'; import { StateObject } from '@core/api/widget-api.models'; import { objToBase64URI } from '@core/utils'; import { coerceBoolean } from '@shared/decorators/coerce-boolean'; @@ -56,8 +56,6 @@ export class NotificationComponent implements OnInit { buttonLabel = ''; hideMarkAsReadButton = false; - tinycolor = tinycolor_; - notificationType = NotificationType; notificationTypeIcons = NotificationTypeIcons; alarmSeverityTranslations = alarmSeverityTranslations; @@ -129,7 +127,7 @@ export class NotificationComponent implements OnInit { } alarmColorSeverity(alpha: number) { - return this.tinycolor(AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity)).setAlpha(alpha).toRgbString(); + return tinycolor(AlarmSeverityNotificationColors.get(this.notification.info.alarmSeverity)).setAlpha(alpha).toRgbString(); } notificationColor(): string { diff --git a/ui-ngx/src/app/shared/models/material.models.ts b/ui-ngx/src/app/shared/models/material.models.ts index ea75978f26..afeea18cfc 100644 --- a/ui-ngx/src/app/shared/models/material.models.ts +++ b/ui-ngx/src/app/shared/models/material.models.ts @@ -14,9 +14,7 @@ /// limitations under the License. /// -import * as tinycolor_ from 'tinycolor2'; - -const tinycolor = tinycolor_; +import tinycolor from 'tinycolor2'; export interface MaterialColorItem { value: string; diff --git a/ui-ngx/yarn.lock b/ui-ngx/yarn.lock index 99bb91241b..fab4c3a33b 100644 --- a/ui-ngx/yarn.lock +++ b/ui-ngx/yarn.lock @@ -10205,10 +10205,10 @@ tiny-warning@^1.0.2: resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754" integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA== -tinycolor2@~1.4.2: - version "1.4.2" - resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.4.2.tgz#3f6a4d1071ad07676d7fa472e1fac40a719d8803" - integrity sha512-vJhccZPs965sV/L2sU4oRQVAos0pQXwsvTLkWYdqJ+a8Q5kPFzJTuOFwy7UniPli44NKQGAglksjvOcpo95aZA== +tinycolor2@^1.6.0: + version "1.6.0" + resolved "https://registry.yarnpkg.com/tinycolor2/-/tinycolor2-1.6.0.tgz#f98007460169b0263b97072c5ae92484ce02d09e" + integrity sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw== "tinymce@^6.0.0 || ^5.5.0": version "6.3.1"