@maestro_io/maestro-web-sdk 5.0.0 → 5.1.0

package/dist/src/view-models/PanelManagerViewModel.js

@@ -0,0 +1,195 @@
+import { Observable } from '../helpers/Observable';
+import { MaestroPanelType } from '../models/IPanel';
+import { UserSettingsManager } from '../services/UserSettingsManager';
+import SDK from '../index';
+export class PanelManagerViewModel {
+    getAvailablePanelsFromConfig() {
+        const config = SDK.getPageConfig();
+        if (config && Array.isArray(config.panels) && config.panels.length > 0) {
+            // Map config.panel types to MaestroPanelType, filter out unknowns
+            return config.panels
+                .filter((p) => p.renderer?.supported_platforms?.bbd !== false)
+                .map((panel) => {
+                const panelType = panel.panel_type;
+                if (!panelType ||
+                    !Object.values(MaestroPanelType).includes(panelType)) {
+                    return null;
+                }
+                return {
+                    type: panelType,
+                    title: panel.panel_name || '',
+                };
+            })
+                .filter((panelType) => panelType !== null);
+        }
+        return [];
+    }
+    constructor() {
+        Object.defineProperty(this, "_panels", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable([])
+        });
+        Object.defineProperty(this, "_currentPanel", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(null)
+        });
+        Object.defineProperty(this, "settingsManager", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "settingsUnsubscribe", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: null
+        });
+        this.settingsManager = UserSettingsManager.getInstance();
+        this.initializePanels();
+        this.subscribeToSettingsChanges();
+    }
+    /**
+     * Initialize panels based on current settings
+     */
+    initializePanels() {
+        const filteredPanels = this.filterPanels();
+        const isProdEnv = SDK.getIsProdEnv();
+        if (!filteredPanels.length && !isProdEnv) {
+            this._panels.value = [
+                {
+                    type: 'helloWorld',
+                    title: 'HELLO WORLD',
+                },
+            ];
+        }
+        else {
+            this._panels.value = filteredPanels;
+        }
+        this.updateActivePanel();
+    }
+    /**
+     * Subscribe to settings changes to update panels dynamically
+     */
+    subscribeToSettingsChanges() {
+        this.settingsUnsubscribe = this.settingsManager.settings.subscribe(() => {
+            this.updatePanelsBasedOnSettings();
+        });
+    }
+    /**
+     * Filter panels based on user settings and page config
+     */
+    filterPanels() {
+        const availablePanels = this.getAvailablePanelsFromConfig();
+        return availablePanels.filter((panel) => {
+            return !this.settingsManager.isPanelHidden(panel.type);
+        });
+    }
+    updateActivePanel() {
+        if (!this.currentPanel && this.panels[0]) {
+            this.currentPanel = this.panels[0].type;
+        }
+        // If current panel is now hidden, switch to first visible panel
+        if (this.panels.length > 0 &&
+            this._currentPanel.value &&
+            !this.panels.find((p) => p.type === this._currentPanel.value)) {
+            this._currentPanel.value = this.panels[0].type;
+        }
+    }
+    /**
+     * Update panels when settings change
+     */
+    updatePanelsBasedOnSettings() {
+        const filteredPanels = this.filterPanels();
+        this._panels.value = filteredPanels;
+        this.updateActivePanel();
+    }
+    /**
+     * Cleanup subscriptions
+     */
+    cleanup() {
+        if (this.settingsUnsubscribe) {
+            this.settingsUnsubscribe();
+            this.settingsUnsubscribe = null;
+        }
+    }
+    // Getter for panels
+    get panels() {
+        return this._panels.value;
+    }
+    // Getter for panels observable
+    get panelsObservable() {
+        return this._panels;
+    }
+    // Getter for currentPanel
+    get currentPanel() {
+        return this._currentPanel.value;
+    }
+    // Setter for currentPanel
+    set currentPanel(value) {
+        this._currentPanel.value = value;
+    }
+    // Getter for currentPanel as Observable
+    get currentPanelObservable() {
+        return this._currentPanel;
+    }
+    setActivePanel(panelType) {
+        if (panelType === this.currentPanel ||
+            this.panels.find((p) => p.type === panelType) === undefined) {
+            return;
+        }
+        this.currentPanel = panelType;
+        this.updateActivePanel();
+    }
+    // Get the index of a specific panel type
+    getIndex(forPanelType) {
+        const index = this.panels.findIndex((p) => p.type === forPanelType);
+        return index !== -1 ? index : null;
+    }
+    // Get the panel type at a specific index
+    getPanelType(atIndex) {
+        return this.panels[atIndex]?.type || null;
+    }
+    // Computed property for panel to the left
+    get panelTypeToLeft() {
+        if (!this.currentPanel)
+            return null;
+        const currentIndex = this.getIndex(this.currentPanel);
+        if (currentIndex === null || currentIndex === 0)
+            return null;
+        return this.getPanelType(currentIndex - 1);
+    }
+    // Computed property for panel to the right
+    get panelTypeToRight() {
+        if (!this.currentPanel)
+            return null;
+        const currentIndex = this.getIndex(this.currentPanel);
+        if (currentIndex === null || currentIndex === this.panels.length - 1)
+            return null;
+        return this.getPanelType(currentIndex + 1);
+    }
+    /**
+     * @returns Array of PanelInfo for panels defined in config but not listed in MaestroPanelType
+     */
+    getUnlistedPanels() {
+        const config = SDK.getPageConfig();
+        if (!config || !Array.isArray(config.panels)) {
+            return [];
+        }
+        return config.panels
+            .filter((panel) => {
+            return (!!panel.panel_type &&
+                !Object.values(MaestroPanelType).includes(panel.panel_type));
+        })
+            .map((panel) => {
+            return {
+                type: panel.panel_type,
+                title: panel.panel_name || '',
+            };
+        });
+    }
+}

package/dist/src/view-models/ViewModel.d.ts

@@ -0,0 +1,12 @@
+import { Observable } from '../helpers/Observable';
+/**
+ * Base view model that implements reactive properties
+ */
+export declare abstract class ViewModel {
+    private _isLoading;
+    private _error;
+    get isLoading(): Observable<boolean>;
+    get error(): Observable<string | null>;
+    protected setLoading(loading: boolean): void;
+    protected setError(error: string | null): void;
+}

package/dist/src/view-models/ViewModel.js

@@ -0,0 +1,32 @@
+import { Observable } from '../helpers/Observable';
+/**
+ * Base view model that implements reactive properties
+ */
+export class ViewModel {
+    constructor() {
+        Object.defineProperty(this, "_isLoading", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(false)
+        });
+        Object.defineProperty(this, "_error", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Observable(null)
+        });
+    }
+    get isLoading() {
+        return this._isLoading;
+    }
+    get error() {
+        return this._error;
+    }
+    setLoading(loading) {
+        this._isLoading.value = loading;
+    }
+    setError(error) {
+        this._error.value = error;
+    }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maestro_io/maestro-web-sdk",
   "private": false,
-  "version": "5.0.0",
+  "version": "5.1.0",
   "type": "commonjs",
   "license": "MIT",
   "main": "dist/maestro-web-sdk.umd.js",
@@ -29,10 +29,12 @@
     "lint": "eslint src --ext .ts,.tsx --ignore-pattern '**/*.test.*'",
     "test": "jest",
     "build": "webpack --config webpack/webpack.prod.js && tsc --emitDeclarationOnly --declarationDir dist/types && dts-bundle --name @maestro_io/maestro-web-sdk --main dist/types/src/index.d.ts --out ../../index.d.ts && rm -rf dist/types",
-    "types": "tsc -b"
+    "types": "tsc -b",
+    "analyze": "ANALYZE=true webpack --config webpack/webpack.prod.js",
+    "format": "prettier --write .",
+    "format:check": "prettier --check ."
   },
   "devDependencies": {
-    "dts-bundle": "^0.7.3",
     "@babel/core": "7.12.3",
     "@babel/plugin-proposal-class-properties": "7.12.1",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
@@ -50,6 +52,7 @@
     "babel-jest": "26.6.3",
     "babel-loader": "8",
     "css-loader": "5",
+    "dts-bundle": "^0.7.3",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.7",
     "eslint": "6.8.0",
@@ -68,14 +71,13 @@
     "tsconfig-paths-webpack-plugin": "^4.2.0",
     "typescript": "^4",
     "webpack": "4",
+    "webpack-bundle-analyzer": "3.9.0",
     "webpack-cli": "3.3.12",
     "webpack-dev-server": "3.11.2"
   },
   "dependencies": {
-    "@rive-app/canvas": "^2.27.3",
     "@sentry/browser": "7.68.0",
     "axios": "^0.27.2",
-    "flexibility": "^2.0.1",
     "prop-types": "15.8.1",
     "react": "16.14.0",
     "react-dom": "16.14.0"