From da51b5fd2117adf443c32d755287ba388f5d7e3e Mon Sep 17 00:00:00 2001 From: GermanBluefox Date: Sat, 27 Apr 2024 22:36:14 +0800 Subject: [PATCH] Migrated palette to TS --- .../{WizardHelpers.jsx => WizardHelpers.tsx} | 98 ++++++++++++------- .../src/Palette/{Widget.jsx => Widget.tsx} | 77 ++++++++------- .../iobroker.vis-2/src/src/Palette/index.tsx | 22 +++-- .../src/Vis/Widgets/JQui/JQuiWriteState.tsx | 18 ++-- .../src/src/Vis/visWidgetsCatalog.tsx | 24 ++--- packages/types-vis-2/index.d.ts | 45 +++++---- 6 files changed, 165 insertions(+), 119 deletions(-) rename packages/iobroker.vis-2/src/src/Components/{WizardHelpers.jsx => WizardHelpers.tsx} (73%) rename packages/iobroker.vis-2/src/src/Palette/{Widget.jsx => Widget.tsx} (80%) diff --git a/packages/iobroker.vis-2/src/src/Components/WizardHelpers.jsx b/packages/iobroker.vis-2/src/src/Components/WizardHelpers.tsx similarity index 73% rename from packages/iobroker.vis-2/src/src/Components/WizardHelpers.jsx rename to packages/iobroker.vis-2/src/src/Components/WizardHelpers.tsx index 3ccede04..89741041 100644 --- a/packages/iobroker.vis-2/src/src/Components/WizardHelpers.jsx +++ b/packages/iobroker.vis-2/src/src/Components/WizardHelpers.tsx @@ -1,3 +1,4 @@ +import React from 'react'; import { Blinds, DirectionsRun, @@ -20,7 +21,8 @@ import { } from '@mui/icons-material'; import { TbVacuumCleaner } from 'react-icons/tb'; -import ChannelDetector from '@iobroker/type-detector'; +import ChannelDetector, { DetectOptions, Types } from '@iobroker/type-detector'; +import { LegacyConnection } from '@iobroker/adapter-react-v5'; import { getNewWidgetIdNumber, getNewWidgetId } from '@/Utils/utils'; const deviceIcons = { @@ -52,12 +54,12 @@ const deviceIcons = { unknown: , }; -const allObjects = async socket => { - const states = await socket.getObjectView('', '\u9999', 'state'); - const channels = await socket.getObjectView('', '\u9999', 'channel'); - const devices = await socket.getObjectView('', '\u9999', 'device'); - const folders = await socket.getObjectView('', '\u9999', 'folder'); - const enums = await socket.getObjectView('', '\u9999', 'enum'); +const allObjects = async (socket: LegacyConnection) => { + const states = await socket.getObjectViewSystem('state', '', '\u9999'); + const channels = await socket.getObjectViewSystem('channel', '', '\u9999'); + const devices = await socket.getObjectViewSystem('device', '', '\u9999'); + const folders = await socket.getObjectViewSystem('folder', '', '\u9999'); + const enums = await socket.getObjectViewSystem('enum', '', '\u9999'); return Object.values(states) .concat(Object.values(channels)) @@ -65,10 +67,10 @@ const allObjects = async socket => { .concat(Object.values(folders)) .concat(Object.values(enums)) // eslint-disable-next-line - .reduce((obj, item) => (obj[item._id] = item, obj), {}); + .reduce((obj: Record, item: ioBroker.Object) => (obj[item._id] = item, obj), {}); }; -function getObjectIcon(obj, id, imagePrefix) { +function getObjectIcon(obj: ioBroker.Object, id: string, imagePrefix?: string): string { imagePrefix = imagePrefix || '.'; // http://localhost:8081'; let src = ''; const common = obj?.common; @@ -110,22 +112,45 @@ function getObjectIcon(obj, id, imagePrefix) { return src || null; } -const detectDevices = async socket => { - const devicesObject = await allObjects(socket); +interface ObjectForDetector { + _id: string; + common: ioBroker.StateCommon | ioBroker.EnumCommon; + name?: ioBroker.StringOrTranslated; + type: ioBroker.ObjectType; +} + +interface DetectorDevice { + _id: string; + common: ioBroker.StateCommon; + type: ioBroker.ObjectType; + deviceType: Types; + states: ObjectForDetector[]; + name?: ioBroker.StringOrTranslated; + roomName?: ioBroker.StringOrTranslated; +} + +interface DetectorResult { + _id: string; + common: ioBroker.StateCommon; + devices: ObjectForDetector[]; +} + +const detectDevices = async (socket: LegacyConnection) => { + const devicesObject: Record = await allObjects(socket) as Record; const keys = Object.keys(devicesObject).sort(); const detector = new ChannelDetector(); - const usedIds = []; + const usedIds: string[] = []; const ignoreIndicators = ['UNREACH_STICKY']; // Ignore indicators by name - const excludedTypes = ['info']; - const enums = []; - const rooms = []; - const list = []; + const excludedTypes: Types[] = [Types.info]; + const enums: string[] = []; + const rooms: string[] = []; + const list: string[] = []; keys.forEach(id => { if (devicesObject[id]?.type === 'enum') { enums.push(id); - } else if (devicesObject[id]?.common?.smartName) { + } else if ((devicesObject[id]?.common as ioBroker.StateCommon)?.smartName) { list.push(id); } }); @@ -134,10 +159,10 @@ const detectDevices = async socket => { if (id.startsWith('enum.rooms.')) { rooms.push(id); } - const members = devicesObject[id].common.members; + const members = (devicesObject[id].common as ioBroker.EnumCommon).members; if (members && members.length) { - members.forEach(member => { + members.forEach((member: string) => { // if an object really exists if (devicesObject[member]) { if (!list.includes(member)) { @@ -148,15 +173,16 @@ const detectDevices = async socket => { } }); - const options = { - objects: devicesObject, + const options: DetectOptions = { + id: '', + objects: devicesObject as Record, _keysOptional: keys, _usedIdsOptional: usedIds, ignoreIndicators, excludedTypes, }; - const result = []; + const result: DetectorResult[] = []; list.forEach(id => { options.id = id; @@ -170,9 +196,9 @@ const detectDevices = async socket => { if (result.find(item => item.devices.find(st => st._id === stateId))) { return; } - const deviceObject = { + const deviceObject: DetectorDevice = { _id: stateId, - common: devicesObject[stateId].common, + common: devicesObject[stateId].common as ioBroker.StateCommon, type: devicesObject[stateId].type, deviceType: control.type, states: control.states @@ -185,8 +211,8 @@ const detectDevices = async socket => { }; const parts = stateId.split('.'); - let channelId; - let deviceId; + let channelId: string; + let deviceId: string; if (devicesObject[stateId].type === 'channel' || devicesObject[stateId].type === 'state') { parts.pop(); channelId = parts.join('.'); @@ -202,21 +228,21 @@ const detectDevices = async socket => { } // try to detect room const room = rooms.find(roomId => { - if (devicesObject[roomId].common.members.includes(stateId)) { + if ((devicesObject[roomId].common as ioBroker.EnumCommon).members.includes(stateId)) { return true; } - if (channelId && devicesObject[roomId].common.members.includes(channelId)) { + if (channelId && (devicesObject[roomId].common as ioBroker.EnumCommon).members.includes(channelId)) { return true; } - return deviceId && devicesObject[roomId].common.members.includes(deviceId); + return deviceId && (devicesObject[roomId].common as ioBroker.EnumCommon).members.includes(deviceId); }); - let roomObj; + let roomObj: DetectorResult; if (room) { roomObj = result.find(obj => obj._id === room); if (!roomObj) { roomObj = { _id: room, - common: devicesObject[room].common, + common: devicesObject[room].common as ioBroker.StateCommon, devices: [], }; result.push(roomObj); @@ -229,7 +255,7 @@ const detectDevices = async socket => { common: { name: 'unknown', icon: '?', - }, + } as ioBroker.StateCommon, devices: [], }; result.push(roomObj); @@ -254,23 +280,23 @@ const detectDevices = async socket => { if (parentObject && (parentObject.type === 'channel' || parentObject.type === 'device' || parentObject.type === 'folder')) { deviceObj.common.name = parentObject.common?.name || deviceObj.common.name; if (parentObject.common.icon) { - deviceObj.common.icon = getObjectIcon(parentObject, parentObject._id, '../..'); + deviceObj.common.icon = getObjectIcon(parentObject as ioBroker.Object, parentObject._id, '../..'); } idArray.pop(); // read device const grandParentObject = devicesObject[idArray.join('.')]; if (grandParentObject?.type === 'device' && grandParentObject.common?.icon) { deviceObj.common.name = grandParentObject.common.name || deviceObj.common.name; - deviceObj.common.icon = getObjectIcon(grandParentObject, grandParentObject._id, '../..'); + deviceObj.common.icon = getObjectIcon(grandParentObject as ioBroker.Object, grandParentObject._id, '../..'); } } else { deviceObj.common.name = parentObject?.common?.name || deviceObj.common.name; if (parentObject?.common?.icon) { - deviceObj.common.icon = getObjectIcon(parentObject, parentObject._id, '../..'); + deviceObj.common.icon = getObjectIcon(parentObject as ioBroker.Object, parentObject._id, '../..'); } } } else { - deviceObj.common.icon = getObjectIcon(deviceObj, deviceObj._id, '../..'); + deviceObj.common.icon = getObjectIcon(deviceObj as ioBroker.Object, deviceObj._id, '../..'); } } } diff --git a/packages/iobroker.vis-2/src/src/Palette/Widget.jsx b/packages/iobroker.vis-2/src/src/Palette/Widget.tsx similarity index 80% rename from packages/iobroker.vis-2/src/src/Palette/Widget.jsx rename to packages/iobroker.vis-2/src/src/Palette/Widget.tsx index 8ea880bb..2bdd492b 100644 --- a/packages/iobroker.vis-2/src/src/Palette/Widget.jsx +++ b/packages/iobroker.vis-2/src/src/Palette/Widget.tsx @@ -1,5 +1,4 @@ -import { useEffect, useRef } from 'react'; -import PropTypes from 'prop-types'; +import React, { useEffect, useRef } from 'react'; import { withStyles } from '@mui/styles'; import { useDrag } from 'react-dnd'; import { getEmptyImage } from 'react-dnd-html5-backend'; @@ -11,14 +10,17 @@ import { Block as DeletedIcon, } from '@mui/icons-material'; -import { I18n, Utils } from '@iobroker/adapter-react-v5'; +import { I18n, LegacyConnection, Utils } from '@iobroker/adapter-react-v5'; +import { ThemeType } from '@iobroker/adapter-react-v5/types'; +import { MarketplaceWidgetRevision, Project } from '@iobroker/types-vis-2'; import { store } from '@/Store'; +import { WidgetType } from '@/Vis/visWidgetsCatalog'; import helpers from '../Components/WizardHelpers'; const IMAGE_TYPES = ['.png', '.jpg', '.svg', '.gif', '.apng', '.avif', '.webp']; -const styles = () => ({ +const styles: Record = { widget: { borderStyle: 'solid', borderColor: 'gray', @@ -74,12 +76,35 @@ const styles = () => ({ marginTop: 9, color: '#F00', }, -}); +}; const WIDGET_ICON_HEIGHT = 34; -const Widget = props => { - const imageRef = useRef(); - const style = {}; + +interface WidgetProps { + classes: Record; + widgetSetProps?: Record; + widgetSet: string; + widgetType: WidgetType; + widgetTypeName: string; + socket?: LegacyConnection; + themeType: ThemeType; + changeProject?: (project: Project, ignoreHistory?: boolean) => Promise; + changeView?: (view: string) => void; + editMode: boolean; + widgetMarketplaceId?: string; + selectedView: string; + + /** Used for a marketplace */ + updateWidgets?: (widget: MarketplaceWidgetRevision) => void; + uninstallWidget?: (widgetId: string) => void; + marketplace?: MarketplaceWidgetRevision; + marketplaceUpdates?: MarketplaceWidgetRevision[]; + marketplaceDeleted?: string[]; +} + +const Widget = (props: WidgetProps) => { + const imageRef = useRef(); + const style: React.CSSProperties = {}; useEffect(() => { if (imageRef.current?.children[0]) { @@ -98,7 +123,7 @@ const Widget = props => { style.backgroundColor = window.visSets[props.widgetSet].color; } - const titleStyle = {}; + const titleStyle: React.CSSProperties = {}; if (style.backgroundColor) { if (Utils.isUseBright(style.backgroundColor)) { titleStyle.color = 'white'; @@ -111,7 +136,7 @@ const Widget = props => { if (props.widgetType.preview?.startsWith('; + img = {props.widgetType.name}; } } else if (props.widgetType.preview && ( @@ -119,7 +144,7 @@ const Widget = props => { props.widgetSet === '__marketplace' ) ) { - img = {props.widgetType.id}; + img = {props.widgetType.name}; } if (!img) { @@ -137,11 +162,11 @@ const Widget = props => { label = label.split(' u.widget_id === props.widgetType.widget_id); - marketplaceDeleted = props.marketplaceDeleted?.includes(props.widgetType.widget_id); + marketplaceUpdate = props.marketplaceUpdates?.find(u => u.widget_id === props.widgetMarketplaceId); + marketplaceDeleted = props.marketplaceDeleted?.includes(props.widgetMarketplaceId); } const result = { {props.widgetSet === '__marketplace' && <> - props.uninstallWidget(props.widgetType.id)}> + props.uninstallWidget(props.widgetType.name)}> @@ -183,13 +208,13 @@ const Widget = props => { ; - const widthRef = useRef(); + const widthRef = useRef(); const [, dragRef, preview] = useDrag({ type: 'widget', item: () => ({ widgetType: props.widgetType, widgetSet: props.widgetSet, - preview:
+ preview:
{result}
, }), @@ -225,22 +250,4 @@ const Widget = props => { ; }; -Widget.propTypes = { - classes: PropTypes.object, - widgetSetProps: PropTypes.object, - widgetSet: PropTypes.string, - widgetType: PropTypes.object, - widgetTypeName: PropTypes.string, - updateWidgets: PropTypes.func, - marketplace: PropTypes.object, - marketplaceUpdates: PropTypes.array, - marketplaceDeleted: PropTypes.array, - uninstallWidget: PropTypes.func, - socket: PropTypes.object, - themeType: PropTypes.string, - changeProject: PropTypes.func, - changeView: PropTypes.func, - editMode: PropTypes.bool, -}; - export default withStyles(styles)(Widget); diff --git a/packages/iobroker.vis-2/src/src/Palette/index.tsx b/packages/iobroker.vis-2/src/src/Palette/index.tsx index d46ba4df..a3f06755 100644 --- a/packages/iobroker.vis-2/src/src/Palette/index.tsx +++ b/packages/iobroker.vis-2/src/src/Palette/index.tsx @@ -26,13 +26,14 @@ import { Icon, LegacyConnection, } from '@iobroker/adapter-react-v5'; -import { Marketplace, Project } from '@iobroker/types-vis-2'; +import {Marketplace, MarketplaceWidgetRevision, Project} from '@iobroker/types-vis-2'; import { store } from '@/Store'; import { getWidgetTypes, WidgetType } from '@/Vis/visWidgetsCatalog'; import { loadComponent } from '@/Vis/visLoadWidgets'; import Widget from './Widget'; import MarketplacePalette from '../Marketplace/MarketplacePalette'; +import {ThemeType} from "@iobroker/adapter-react-v5/types"; // declare global { // interface Window { @@ -156,20 +157,21 @@ interface PaletteProps { classes: Record; onHide: (hide: boolean) => void; changeView: (view: string) => void; - changeProject: (project: Project) => void; + changeProject: (project: Project, ignoreHistory?: boolean) => Promise; uninstallWidget: (widgetId: string) => void; setMarketplaceDialog: (open: boolean) => void; updateWidgets: () => void; widgetsLoaded: boolean; socket: LegacyConnection; - themeType: string; + themeType: ThemeType; editMode: boolean; selectedView: string; } + interface PaletteState { filter: string; - marketplaceUpdates: any; - marketplaceDeleted: any; + marketplaceUpdates: MarketplaceWidgetRevision[] | null; + marketplaceDeleted: string[] | null; marketplaceLoading: boolean; accordionOpen: Record; widgetsList: Record; @@ -229,7 +231,7 @@ class Palette extends Component { Promise.all([tPromise, mPromise]) .then(async () => { - const updates = []; + const updates: MarketplaceWidgetRevision[] = []; const deleted = []; if (store.getState().visProject?.___settings?.marketplace && window.VisMarketplace?.api) { for (const i in store.getState().visProject.___settings.marketplace) { @@ -408,6 +410,8 @@ class Palette extends Component { { updateWidgets={this.props.updateWidgets} widgetSet="__marketplace" widgetType={{ - id: item.id, - widget_id: item.widget_id, + name: item.id, label: item.name, preview: `${window.apiUrl + window.webPrefix}/images/${item.image_id}`, + params: 'simulated', }} + widgetMarketplaceId={item.widget_id} widgetTypeName={item.name} />
)} @@ -635,7 +640,6 @@ class Palette extends Component { changeView={this.props.changeView} editMode={this.props.editMode} key={widgetItem.name} - project={store.getState().visProject} selectedView={this.props.selectedView} socket={this.props.socket} themeType={this.props.themeType} diff --git a/packages/iobroker.vis-2/src/src/Vis/Widgets/JQui/JQuiWriteState.tsx b/packages/iobroker.vis-2/src/src/Vis/Widgets/JQui/JQuiWriteState.tsx index ffaa74e9..bf4aa79c 100644 --- a/packages/iobroker.vis-2/src/src/Vis/Widgets/JQui/JQuiWriteState.tsx +++ b/packages/iobroker.vis-2/src/src/Vis/Widgets/JQui/JQuiWriteState.tsx @@ -14,29 +14,28 @@ */ import React from 'react'; -import PropTypes from 'prop-types'; import { Button, ButtonTypeMap, } from '@mui/material'; import { - type Connection, I18n, Icon, + type LegacyConnection, } from '@iobroker/adapter-react-v5'; import { GetRxDataFromWidget, RxRenderWidgetProps, RxWidgetInfo, - RxWidgetInfoAttributesField + RxWidgetInfoAttributesField, } from '@iobroker/types-vis-2'; +import VisBaseWidget from '@/Vis/visBaseWidget'; + // eslint-disable-next-line import/no-cycle -import VisRxWidget, {VisRxWidgetState} from '../../visRxWidget'; -import {CSSProperties} from "@mui/styles"; -import VisBaseWidget from "@/Vis/visBaseWidget"; +import VisRxWidget, { VisRxWidgetState } from '../../visRxWidget'; // eslint-disable-next-line no-use-before-define type RxData = GetRxDataFromWidget @@ -48,6 +47,7 @@ interface JQuiWriteStateState extends VisRxWidgetState { class JQuiWriteState extends VisRxWidget { private iterateInterval: ReturnType | null = null; + private iterateTimeout: ReturnType | null = null; constructor(props: RxRenderWidgetProps) { @@ -78,7 +78,7 @@ class JQuiWriteState extends VisRxWidget { field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, - socket: Connection, + socket: LegacyConnection, ): Promise => { if (data[field.name] && data[field.name] !== 'nothing_selected') { const obj = await socket.getObject(data[field.name]) as ioBroker.StateObject; @@ -377,7 +377,7 @@ class JQuiWriteState extends VisRxWidget { return null; } - renderText(isActive: boolean) { + renderText() { let text = this.state.rxData.text; const color = this.state.rxStyle.color; @@ -460,7 +460,7 @@ class JQuiWriteState extends VisRxWidget { buttonStyle.fontSize = VisBaseWidget.correctStylePxValue(buttonStyle.fontSize); } - const text = this.renderText(isActive); + const text = this.renderText(); buttonStyle.width = '100%'; buttonStyle.height = '100%'; diff --git a/packages/iobroker.vis-2/src/src/Vis/visWidgetsCatalog.tsx b/packages/iobroker.vis-2/src/src/Vis/visWidgetsCatalog.tsx index b83d1e70..8991b4ff 100644 --- a/packages/iobroker.vis-2/src/src/Vis/visWidgetsCatalog.tsx +++ b/packages/iobroker.vis-2/src/src/Vis/visWidgetsCatalog.tsx @@ -38,6 +38,8 @@ type RxWidgetInfoAttributesFieldAll = { type?: RxWidgetAttributeType; /** Field default value */ default?: string | number | boolean; + /** If sizes should be deleted or set to specific value. `false` - delete sizes, or {width: 100, height: 100} */ + desiredSize?: { width: number; height: number } | boolean; /** if true, no edit button will be shown. Default is true. */ readonly noButton?: boolean; /** if true, the text will not be translated */ @@ -113,13 +115,13 @@ type RxWidgetInfoAttributesFieldAll = { /** Field label (i18n) */ label?: string; /** JS Function for conditional visibility */ - hidden?: string | ((data: any) => boolean) | ((data: any, index: number) => boolean); + hidden?: string | ((data: Record) => boolean) | ((data: Record, index: number) => boolean); /** Tooltip (i18n) */ tooltip?: string; /** JS Function for conditional disability */ - disabled?: string | ((data: any) => boolean) | ((data: any, index: number) => boolean); + disabled?: string | ((data: Record) => boolean) | ((data: Record, index: number) => boolean); /** JS Function for error */ - error?: string | ((data: any) => boolean) | ((data: any, index: number) => boolean); + error?: string | ((data: Record) => boolean) | ((data: Record, index: number) => boolean); /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ @@ -242,7 +244,7 @@ class VisWidgetsCatalog { static setUsedWidgetSets(project: Project) { // provide for all widgets the widget set and set let views; - const widgetTypes = (window as any).visWidgetTypes as WidgetType[]; // getWidgetTypes(); + const widgetTypes = window.visWidgetTypes; // getWidgetTypes(); const viewKeys = Object.keys(project); for (let v = 0; v < viewKeys.length; v++) { @@ -349,8 +351,8 @@ class VisWidgetsCatalog { } export const getWidgetTypes: (_usedWidgetSets?: string[]) => WidgetType[] = (usedWidgetSets?: string[]) => { - if (!(window as any).visWidgetTypes) { - (window as any).visSets = {}; + if (!window.visWidgetTypes) { + window.visSets = {}; VisWidgetsCatalog.allWidgetsList = []; if (!VisWidgetsCatalog.rxWidgets) { @@ -358,7 +360,7 @@ export const getWidgetTypes: (_usedWidgetSets?: string[]) => WidgetType[] = (use } // Old CanJS widgets - (window as any).visWidgetTypes = Array.from(document.querySelectorAll('script[type="text/ejs"]')) + window.visWidgetTypes = Array.from(document.querySelectorAll('script[type="text/ejs"]')) .map(script => { const name: string | null = script.getAttribute('id'); if (!name || !VisWidgetsCatalog.rxWidgets) { @@ -380,11 +382,11 @@ export const getWidgetTypes: (_usedWidgetSets?: string[]) => WidgetType[] = (use } const color = script.getAttribute('data-vis-color'); - (window as any).visSets[widgetSet] = (window as any).visSets[widgetSet] || {}; + window.visSets[widgetSet] = window.visSets[widgetSet] || {}; if (color) { - (window as any).visSets[widgetSet].color = color; - } else if (!(window as any).visSets[widgetSet].color && DEFAULT_SET_COLORS[widgetSet]) { - (window as any).visSets[widgetSet].color = DEFAULT_SET_COLORS[widgetSet]; + window.visSets[widgetSet].color = color; + } else if (!window.visSets[widgetSet].color && DEFAULT_SET_COLORS[widgetSet]) { + window.visSets[widgetSet].color = DEFAULT_SET_COLORS[widgetSet]; } const widgetObj: WidgetType = { name, diff --git a/packages/types-vis-2/index.d.ts b/packages/types-vis-2/index.d.ts index c7799efc..ac6bdc07 100644 --- a/packages/types-vis-2/index.d.ts +++ b/packages/types-vis-2/index.d.ts @@ -1,7 +1,7 @@ import type React from 'react'; import type moment from 'moment'; import type { Theme } from '@mui/material'; -import type { Connection, LegacyConnection } from '@iobroker/adapter-react-v5'; +import type { LegacyConnection } from '@iobroker/adapter-react-v5'; interface VisView { getOneWidget(index: number, widget: SingleWidget | GroupWidget, options: CreateWidgetOptions): React.JSX.Element | null; @@ -28,7 +28,7 @@ export type PromiseName = `_promise_${WidgetSetName}`; export type WidgetSetName = Branded; export interface RxWidgetInfoCustomComponentContext { - readonly socket: Connection; + readonly socket: LegacyConnection; readonly projectName: string; readonly instance: number; readonly adapterName: string; @@ -65,7 +65,7 @@ export type RxWidgetInfoAttributesFieldText = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldDelimiter = { @@ -117,7 +117,7 @@ export type RxWidgetInfoAttributesFieldHTML = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldID = { @@ -165,7 +165,7 @@ export type RxWidgetInfoAttributesFieldID = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldInstance = { @@ -193,7 +193,7 @@ export type RxWidgetInfoAttributesFieldInstance = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldSelect = { @@ -221,7 +221,7 @@ export type RxWidgetInfoAttributesFieldSelect = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldCheckbox = { @@ -247,7 +247,7 @@ export type RxWidgetInfoAttributesFieldCheckbox = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldNumber = { @@ -277,7 +277,7 @@ export type RxWidgetInfoAttributesFieldNumber = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldSlider = { @@ -311,7 +311,7 @@ export type RxWidgetInfoAttributesFieldSlider = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldWidget = { @@ -347,7 +347,7 @@ export type RxWidgetInfoAttributesFieldWidget = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldSelectViews = { @@ -373,7 +373,7 @@ export type RxWidgetInfoAttributesFieldSelectViews = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldSelectCustom = { @@ -404,7 +404,7 @@ export type RxWidgetInfoAttributesFieldSelectCustom = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldSelectSimple = { @@ -428,7 +428,7 @@ export type RxWidgetInfoAttributesFieldSelectSimple = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesFieldDefault = { @@ -450,7 +450,7 @@ export type RxWidgetInfoAttributesFieldDefault = { /** Do not show binding symbol fot this field */ readonly noBinding?: boolean; /** Callback called if the field value changed */ - readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: Connection, index?: number) => Promise; + readonly onChange?: (field: RxWidgetInfoAttributesField, data: Record, changeData: (newData: Record) => void, socket: LegacyConnection, index?: number) => Promise; } export type RxWidgetInfoAttributesField = @@ -895,6 +895,12 @@ declare global { init?: (shareScope: any) => Promise; }; + visSets: Record; + + visWidgetTypes: WidgetType[]; + __widgetsLoadIndicator: (process: number, max: number) => void; _lastAppliedStyle: string; /** Marketplace API server */ @@ -1099,16 +1105,17 @@ export interface RxWidgetProps extends RxRenderWidgetProps { } export interface CustomPaletteProperties { - socket: Connection; + socket: LegacyConnection; project: Project; changeProject: (project: Project, ignoreHistory?: boolean) => Promise; selectedView: string; + changeView: (newView: string) => void; themeType: 'dark' | 'light'; helpers: { deviceIcons: Record; - detectDevices: (socket: Connection) => Promise; - getObjectIcon: (obj: ioBroker.Object, id?: string, imagePrefix?: string) => React.JSX.Element; - allObjects: (socket: Connection) => Promise>; + detectDevices: (socket: LegacyConnection) => Promise; + getObjectIcon: (obj: ioBroker.Object, id?: string, imagePrefix?: string) => string; + allObjects: (socket: LegacyConnection) => Promise>; getNewWidgetId: (project: Project, offset?: number) => SingleWidgetId; /** @deprecated use "getNewWidgetId" instead, it will give you the full wid like "w000001" */ getNewWidgetIdNumber: (isWidgetGroup: boolean, project: Project, offset?:number) => number;