@wavemaker/rn-codegen 11.9.2-rc.193 → 11.9.3-1.5914

rn-codegen/src/templates/project/package.json

@@ -9,71 +9,69 @@
         "postinstall": "node ./scripts/post-build.js"
     },
     "dependencies": {
-        "@wavemaker/app-rn-runtime": "11.9.2-rc.193",
-        "@wavemaker/variables": "11.9.2-rc.193",
-        "@wavemaker/rn-codegen": "11.9.2-rc.193",
+        "@wavemaker/app-rn-runtime": "11.9.3-1.5914",
+        "@wavemaker/variables": "11.9.3-1.5914",
+        "@wavemaker/rn-codegen": "11.9.3-1.5914",
         "@wavemaker/wavepulse-agent": "1.0.11",
-        "deprecated-react-native-prop-types": "4.1.0",
-        "expo": "50.0.17",
-        "expo-build-properties": "0.12.0",
-        "@expo/vector-icons": "14.0.0",
-        "@expo/metro-runtime": "3.1.3",
-        "expo-font": "11.10.3",
-        "expo-file-system": "16.0.9",
-        "expo-camera": "14.1.3",
-        "expo-av": "13.10.6",
-        "expo-barcode-scanner": "12.9.3",
-        "expo-web-browser": "12.8.2",
-        "expo-device": "5.9.4",
-        "expo-network": "5.8.0",
-        "expo-location": "16.5.5",
-        "expo-localization": "14.8.4",
-        "expo-contacts": "12.8.2",
-        "expo-calendar": "12.2.1",
-        "expo-splash-screen": "0.26.5",
-        "expo-document-picker": "11.10.1",
-        "expo-constants": "15.4.6",
-        "expo-modules-core": "1.11.13",
+        "expo": "52.0.17",
+        "expo-build-properties": "0.13.1",
+        "@expo/vector-icons": "14.0.2",
+        "@expo/metro-runtime": "4.0.0",
+        "expo-font": "13.0.1",
+        "expo-file-system": "18.0.4",
+        "expo-camera": "16.0.9",
+        "expo-av": "15.0.1",
+        "expo-web-browser": "14.0.1",
+        "expo-device": "7.0.1",
+        "expo-network": "7.0.3",
+        "expo-location": "18.0.3",
+        "expo-localization": "16.0.0",
+        "expo-contacts": "14.0.2",
+        "expo-calendar": "14.0.4",
+        "expo-splash-screen": "0.29.16",
+        "expo-document-picker": "13.0.1",
+        "expo-constants": "17.0.3",
+        "expo-modules-core": "2.1.1",
+        "expo-video": "2.0.2",
         "@react-native/assets": "1.0.0",
         "hermes-engine": "0.11.0",
-        "imask": "7.6.0",
-        "react": "18.2.0",
-        "react-dom": "18.2.0",
-        "react-native": "0.73.6",
-        "react-native-web": "0.19.6",
-        "@react-native/assets-registry": "0.74.83",
-        "@react-native-async-storage/async-storage": "1.21.0",
-        "@react-native-community/netinfo": "11.1.0",
-        "react-native-gesture-handler": "2.14.0",
-        "react-native-reanimated": "3.6.2",
-        "react-native-bundle-splitter": "2.2.3",
-        "react-native-safe-area-context": "4.8.2",
-        "@react-native-community/datetimepicker": "7.6.3",
-        "@react-native-community/slider": "4.5.2",
-        "react-native-circular-progress": "1.4.0",
-        "@react-native-masked-view/masked-view": "0.3.0",
-        "react-native-snap-carousel": "3.9.1",
-        "react-native-svg": "14.1.0",
-        "react-native-ssl-public-key-pinning": "1.2.3",
+        "imask": "7.6.1",
+        "punycode": "2.3.1",
+        "react": "18.3.1",
+        "react-dom": "18.3.1",
+        "react-native": "0.76.3",
+        "react-native-web": "0.19.13",
+        "@react-native/assets-registry": "0.76.3",
+        "@react-native-async-storage/async-storage": "1.23.1",
+        "@react-native-community/netinfo": "11.4.1",
+        "react-native-gesture-handler": "2.20.2",
+        "react-native-reanimated": "3.16.1",
+        "react-native-bundle-splitter": "3.0.1",
+        "react-native-safe-area-context": "4.12.0",
+        "@react-native-community/datetimepicker": "8.2.0",
+        "@react-native-community/slider": "4.5.5",
+        "react-native-circular-progress": "1.4.1",
+        "@react-native-masked-view/masked-view": "0.3.2",
+        "react-native-svg": "15.8.0",
+        "react-native-ssl-public-key-pinning": "1.2.4",
         "@wavemaker/react-native-ssl-publickey": "1.0.2",
-        "victory-native": "36.6.11",
+        "victory-native": "37.3.2",
         "@react-navigation/native": "6.1.7",
-        "react-native-pager-view": "6.2.3",
-        "react-native-webview": "13.6.4",
-        "react-native-vector-icons": "10.0.3",
+        "react-native-pager-view": "6.5.1",
+        "react-native-webview": "13.12.5",
+        "react-native-vector-icons": "10.2.0",
         "@react-navigation/drawer": "6.6.3",
-        "react-native-screens": "3.29.0",
-        "react-native-svg-transformer": "1.3.0",
-        "lottie-react-native": "6.5.1",
-        "react-lottie-player": "2.0.0",
+        "react-native-screens": "4.1.0",
+        "react-native-svg-transformer": "1.5.0",
+        "lottie-react-native": "7.1.0",
+        "react-lottie-player": "2.1.0",
         "react-native-mime-types": "2.5.0",
-        "expo-linear-gradient": "12.7.2",
+        "expo-linear-gradient": "14.0.1",
         "setimmediate": "1.0.5",
         "react-native-restart": "0.0.27",
-        "@expo/webpack-config": "19.0.1",
-        "@babel/core": "7.20.2",
-        "@babel/standalone": "7.23.10",
-        "@babel/plugin-syntax-jsx": "7.21.4"
+        "@babel/core": "7.25.2",
+        "@babel/standalone": "7.26.3",
+        "@babel/plugin-syntax-jsx": "7.25.9"
     },
     "devDependencies": {
         "metro-minify-terser": "0.80.10",
@@ -87,6 +85,7 @@
         "babel-plugin-transform-remove-console": "6.9.4",
         "@babel/plugin-proposal-optional-chaining": "7.21.0",
         "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
+        "@react-native-community/cli": "16.0.0",
         "@types/babel__standalone": "7.1.7"
     },
     "private": true

rn-codegen/src/templates/project/scripts/post-build.js

@@ -13,22 +13,6 @@ async function readAndReplaceFileContent(path, writeFn) {
     });
 }
 
-async function patchCarousel() {
-    const path = `${__dirname}/../node_modules/react-native-snap-carousel/src`;
-    const updateViewPropTypes = (content) => {
-        if (content.indexOf('deprecated-react-native-prop-types') < 0) {
-            return content.replace(/,\s*ViewPropTypes/, '')
-                .replace('\'react-native\';', '\'react-native\';\nimport {ViewPropTypes} from \'deprecated-react-native-prop-types\';');
-        }
-        return content;
-    };
-    await readAndReplaceFileContent(`${path}/carousel/Carousel.js`, updateViewPropTypes);
-    await readAndReplaceFileContent(`${path}/pagination/Pagination.js`, updateViewPropTypes);
-    await readAndReplaceFileContent(`${path}/pagination/PaginationDot.js`, updateViewPropTypes);
-    await readAndReplaceFileContent(`${path}/parallaximage/ParallaxImage.js`, updateViewPropTypes);
-    console.log('Patched react-native-snap-carousel');
-}
-
 async function patchFlatList(){
     const path = `${__dirname}/../node_modules/react-native/Libraries/Lists/FlatList.js`;
     const updateProps = (content) => {
@@ -42,7 +26,6 @@ async function patchFlatList(){
 }
 
 function patch() {
-    patchCarousel();
     patchFlatList()
 }
 

rn-codegen/src/templates/project/wavepulse/rn2css.json

@@ -16,6 +16,7 @@
     "app-carousel.dotSkeleton": ".app-carousel-dot-skeleton",
     "app-login.root": ".app-login",
     "app-webview.root": ".app-webview",
+    "app-webview.webview": ".app-webview-content",
     "app-network-info-toaster.root": ".app-network-info-toaster",
     "app-network-info-toaster.text": ".app-network-info-toaster-text",
     "app-network-info-toaster.action": ".app-network-info-toaster-action",

rn-codegen/src/templates/project/wavepulse/wavepulse.agent.js

@@ -3,6 +3,7 @@ import { Agent, WebSocketChannel } from '@wavemaker/wavepulse-agent/index';
 import { EVENTS, CALLS } from './constants';
 import axios from 'axios';
 import RN2CSS from './rn2css.json';
+import { Platform } from 'react-native';
 
 const MAX_WAITING_TIME_FOR_CONNECTION = 30 * 1000;
 let wavePulseAgent = new (class WavePulseAgent extends Agent {
@@ -53,13 +54,22 @@ let wavePulseAgent = new (class WavePulseAgent extends Agent {
         }
     }
 })();
+const _console = console;
+let tryWith = (fn) => {
+    return function() {
+        try {
+            return fn && fn.apply(undefined, arguments);
+        } catch(e) {
+            _console.defaultError(e);
+        }
+    }
+};
 let currentPage = null;
 let currentWidgets = {};
 let handler = null;
 function wrapConsole() {
-    const _console = console;
     const prepareLogFn = (logType, original) => {
-        return function () {
+        return tryWith(function () {
             let args = [...arguments];
             if (logType === 'error' && arguments[0].stack) {
                 args.splice(0, 1, arguments[0].stack.toString());
@@ -70,7 +80,7 @@ function wrapConsole() {
                     message: Array.from(args)
                 }]);
             original.call(_console, ...arguments);
-        };
+        });
     };
     _console.defaultLog = console.log;
     _console.log = prepareLogFn('log', _console.defaultLog);
@@ -84,7 +94,7 @@ function wrapConsole() {
     _console.info = prepareLogFn('info', _console.defaultInfo);
 }
 function listenPageEvents() {
-    handler.subscribe('pageReady', (p) => {
+    handler.subscribe('pageReady', tryWith((p) => {
         currentPage = p;
         wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
                 name: 'PAGE_READY',
@@ -94,8 +104,8 @@ function listenPageEvents() {
                 startTime: handler.appConfig.diagnostics.pageStartTime,
                 endTime: handler.appConfig.diagnostics.pageReadyTime
             }]);
-    });
-    handler.subscribe('pageAttached', (p) => {
+    }));
+    handler.subscribe('pageAttached', tryWith((p) => {
         currentPage = p;
         wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
                 name: 'PAGE_READY',
@@ -105,19 +115,19 @@ function listenPageEvents() {
                 startTime: handler.appConfig.diagnostics.pageStartTime,
                 endTime: handler.appConfig.diagnostics.pageReadyTime
             }]);
-    });
-    handler.subscribe('pageDestroyed', (p) => {
+    }));
+    handler.subscribe('pageDestroyed', tryWith((p) => {
         currentPage = null;
-    });
+    }));
 }
 function listenVariableEvents() {
-    handler.subscribe('beforeInvoke', (v) => {
+    handler.subscribe('beforeInvoke', tryWith((v) => {
         wavePulseAgent && wavePulseAgent.notify(EVENTS.VARIABLE.BEFORE_INVOKE, 'event', []);
         v.__diagnostics = v.__diagnostics || {};
         v.__diagnostics.invocationStartTime = Date.now();
         v.__diagnostics.processed = false;
-    });
-    handler.subscribe('afterInvoke', (v) => {
+    }));
+    handler.subscribe('afterInvoke', tryWith((v) => {
         wavePulseAgent && wavePulseAgent.notify(EVENTS.VARIABLE.AFTER_INVOKE, 'event', []);
         if (v.__diagnostics.processed) {
             return;
@@ -133,57 +143,66 @@ function listenVariableEvents() {
                 startTime: v.__diagnostics.invocationStartTime,
                 endTime: v.__diagnostics.invocationEndTime
             }]);
-    });
+    }));
 }
 function listenServiceCalls() {
     const _axios = global['axios'] || axios;
-    _axios.interceptors.request.use(function (config) {
-        config.__startTime = Date.now();
-        // Do something before request is sent
-        wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.BEFORE_CALL, 'event', [config]);
-        return config;
-    }, function (error) {
+    _axios.interceptors.request.use(tryWith(function (config) {
+        try {
+            config.__startTime = Date.now();
+            // Do something before request is sent
+            wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.BEFORE_CALL, 'event', [config]);
+        } finally {
+            return config;
+        }
+    }), tryWith(function (error) {
         // Do something with request error
         return Promise.reject(error);
-    });
+    }));
     // Add a response interceptor
-    _axios.interceptors.response.use(function (response) {
-        // Any status code that lie within the range of 2xx cause this function to trigger
-        // Do something with response data
-        response.config.__endTime = Date.now();
-        wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.AFTER_CALL, 'event', [response.config, response]);
-        if (!response.config.__wmVariable) {
-            const config = response.config;
-            wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
-                    name: 'NETWORK_REQUEST',
-                    data: {
-                        url: config.url,
-                        method: config.method
-                    },
-                    startTime: config.__startTime,
-                    endTime: config.__endTime
-                }]);
+    _axios.interceptors.response.use(tryWith(function (response) {
+        try {
+            // Any status code that lie within the range of 2xx cause this function to trigger
+            // Do something with response data
+            response.config.__endTime = Date.now();
+            wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.AFTER_CALL, 'event', [response.config, response]);
+            if (!response.config.__wmVariable) {
+                const config = response.config;
+                wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
+                        name: 'NETWORK_REQUEST',
+                        data: {
+                            url: config.url,
+                            method: config.method
+                        },
+                        startTime: config.__startTime,
+                        endTime: config.__endTime
+                    }]);
+            }
+        } finally {
+            return response;
         }
-        return response;
-    }, function (error) {
-        // Any status codes that falls outside the range of 2xx cause this function to trigger
-        // Do something with response error
-        error.config.__endTime = Date.now();
-        wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.AFTER_CALL, 'event', [error.config, error]);
-        if (!error.config.__wmVariable) {
-            const config = error.config;
-            wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
-                    name: 'NETWORK_REQUEST',
-                    data: {
-                        url: config.url,
-                        method: config.method
-                    },
-                    startTime: config.__startTime,
-                    endTime: config.__endTime
-                }]);
+    }), tryWith(function (error) {
+        try {
+            // Any status codes that falls outside the range of 2xx cause this function to trigger
+            // Do something with response error
+            error.config.__endTime = Date.now();
+            wavePulseAgent && wavePulseAgent.notify(EVENTS.SERVICE.AFTER_CALL, 'event', [error.config, error]);
+            if (!error.config.__wmVariable) {
+                const config = error.config;
+                wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
+                        name: 'NETWORK_REQUEST',
+                        data: {
+                            url: config.url,
+                            method: config.method
+                        },
+                        startTime: config.__startTime,
+                        endTime: config.__endTime
+                    }]);
+            }
+        } finally{
+            return Promise.reject(error);
         }
-        return Promise.reject(error);
-    });
+    }));
 }
 function buildComponentTree(componentNode) {
     if (!componentNode.instance.props.cname) {
@@ -198,7 +217,8 @@ function buildComponentTree(componentNode) {
     };
 }
 function getComponentTree() {
-    const pageIns = Object.values(currentPage.Widgets)
+    currentPage = handler.activePage;
+    const pageIns = currentPage && Object.values(currentPage.Widgets)
         .map((w) => w.componentNode)
         .find((w) => { var _a, _b; return ((_b = (_a = w === null || w === void 0 ? void 0 : w.instance) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.cname) === 'WmPage'; });
     currentWidgets = {};
@@ -209,11 +229,11 @@ function getComponentById(id) {
 }
 function bindCalls() {
     let lastHighLightedWidgetId = '';
-    wavePulseAgent.onInvoke(CALLS.WIDGET.GET, (args) => {
+    wavePulseAgent.onInvoke(CALLS.WIDGET.GET, tryWith((args) => {
         const name = args[0].name;
         return Promise.resolve(currentPage === null || currentPage === void 0 ? void 0 : currentPage.Widgets[name]);
-    });
-    wavePulseAgent.onInvoke(CALLS.WIDGET.HIGHLIGHT, (args) => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.WIDGET.HIGHLIGHT, tryWith((args) => {
         const lw = getComponentById(lastHighLightedWidgetId);
         lw === null || lw === void 0 ? void 0 : lw.setState({
             highlight: false
@@ -225,8 +245,8 @@ function bindCalls() {
         });
         lastHighLightedWidgetId = widgetIdToHighlight;
         return Promise.resolve('');
-    });
-    wavePulseAgent.onInvoke(CALLS.WIDGET.GET_PROPERTIES_N_STYLES, (args) => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.WIDGET.GET_PROPERTIES_N_STYLES, tryWith((args) => {
         const widgetId = args[0];
         const w = getComponentById(widgetId);
         const ins = w.componentNode.instance;
@@ -268,8 +288,8 @@ function bindCalls() {
             })
         });
         return Promise.resolve({ styles, properties });
-    });
-    wavePulseAgent.onInvoke(CALLS.HANDSHAKE.WISH, (args) => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.HANDSHAKE.WISH, tryWith((args) => {
         setTimeout(() => {
             wavePulseAgent.isConnected = true;
             wavePulseAgent.isClosed = false;
@@ -277,8 +297,8 @@ function bindCalls() {
             wavePulseAgent.processBuffer();
         }, 2000);
         return Promise.resolve('Hello');
-    });
-    wavePulseAgent.onInvoke(CALLS.EXPRESSION.EVAL, (args) => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.EXPRESSION.EVAL, tryWith((args) => {
         const expr = args[0].expr;
         if (expr) {
             return new Promise((resolve, reject) => {
@@ -293,11 +313,11 @@ function bindCalls() {
             });
         }
         return Promise.resolve();
-    });
-    wavePulseAgent.onInvoke(CALLS.UI.REFRESH, () => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.UI.REFRESH, tryWith(() => {
         return Promise.resolve(currentPage === null || currentPage === void 0 ? void 0 : currentPage.refresh());
-    });
-    wavePulseAgent.onInvoke(CALLS.APP.INFO, () => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.APP.INFO, tryWith(() => {
         const appConfig = handler.appConfig;
         const App = handler;
         return Promise.resolve({
@@ -315,20 +335,19 @@ function bindCalls() {
             securityEnabled: appConfig.appProperties.securityEnabled,
             serverPath: appConfig.url
         });
-    });
-    wavePulseAgent.onInvoke(CALLS.STORAGE.GET_ALL, () => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.STORAGE.GET_ALL, tryWith(() => {
         const App = handler;
         return App.getDependency('StorageService').getAll();
-    });
-    wavePulseAgent.onInvoke(CALLS.PLATFORM.INFO, () => {
-        const { Platform } = require('react-native');
+    }));
+    wavePulseAgent.onInvoke(CALLS.PLATFORM.INFO, tryWith(() => {
         return Promise.resolve({
             os: Platform.OS,
             version: (Platform.Version || '') + '',
             device: ''
         });
-    });
-    wavePulseAgent.onInvoke(CALLS.WIDGET.TREE, (args) => {
+    }));
+    wavePulseAgent.onInvoke(CALLS.WIDGET.TREE, tryWith((args) => {
         let result = null;
         try {
             result = getComponentTree();
@@ -337,7 +356,7 @@ function bindCalls() {
             console.error(e.stack.toString());
         }
         return Promise.resolve(result);
-    });
+    }));
 }
 wrapConsole();
 listenServiceCalls();
@@ -347,13 +366,13 @@ export const createWavePulseAgent = (args) => {
         wavePulseAgent = args.agent;
     }
     else {
-        handler.subscribe('appReady', (p) => {
+        handler.subscribe('appReady', tryWith((p) => {
             wavePulseAgent && wavePulseAgent.notify(EVENTS.TIMELINE.EVENT, 'event', [{
                     name: 'APP_STARTUP',
                     startTime: handler.appConfig.diagnostics.appStartTime,
                     endTime: handler.appConfig.diagnostics.appReadyTime
                 }]);
-        });
+        }));
     }
     listenPageEvents();
     listenVariableEvents();

rn-codegen/src/theme/components/advanced/webview.styledef.js

@@ -1,11 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = {
-    getStyleDefs: () => ([{
+    getStyleDefs: () => ([
+        {
             className: '.app-webview',
             rnStyleSelector: 'app-webview.root',
             studioStyleSelector: '',
             style: {}
-        }])
+        },
+        {
+            className: '.app-webview-content',
+            rnStyleSelector: 'app-webview.webview',
+            studioStyleSelector: '',
+            style: {}
+        },
+    ])
 };
 //# sourceMappingURL=webview.styledef.js.map

rn-codegen/src/theme/components/advanced/webview.styledef.js.map

@@ -1 +1 @@
-{"version":3,"file":"webview.styledef.js","sourceRoot":"","sources":["../../../../../src/theme/components/advanced/webview.styledef.ts"],"names":[],"mappings":";;AAEA,kBAAe;IACX,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;YAClB,SAAS,EAAE,cAAc;YACzB,eAAe,EAAE,kBAAkB;YACnC,mBAAmB,EAAE,EAAE;YACvB,KAAK,EAAE,EAAE;SACZ,CAAC,CAAC;CACY,CAAC"}
+{"version":3,"file":"webview.styledef.js","sourceRoot":"","sources":["../../../../../src/theme/components/advanced/webview.styledef.ts"],"names":[],"mappings":";;AAEA,kBAAe;IACX,YAAY,EAAE,GAAG,EAAE,CAAC,CAAC;QACjB;YACI,SAAS,EAAE,cAAc;YACzB,eAAe,EAAE,kBAAkB;YACnC,mBAAmB,EAAE,EAAE;YACvB,KAAK,EAAE,EAAE;SACZ;QACD;YACI,SAAS,EAAE,sBAAsB;YACjC,eAAe,EAAE,qBAAqB;YACtC,mBAAmB,EAAE,EAAE;YACvB,KAAK,EAAE,EAAE;SACZ;KACJ,CAAC;CACa,CAAC"}

rn-codegen/src/theme/variables.js

@@ -349,7 +349,7 @@ variables.set('datepickerBgColor', new ColorProp('@defaultColorF'));
 variables.set('wizardBackgroundColor', new ColorProp('@widgetBgColor'));
 variables.set('wizardStepActiveColor', new ColorProp('@primaryColor', '--md-ref-palette-secondary90'));
 variables.set('wizardStepDoneColor', new ColorProp('@successColor', '--md-ref-palette-secondary90'));
-variables.set('wizardStepIconColor', new ColorProp('@defaultColor9', '--md-ref-palette-neutral-variant30'));
+variables.set('wizardStepIconColor', new ColorProp('@defaultColorF', '--md-ref-palette-neutral10'));
 variables.set('wizardStepColor', new ColorProp('@defaultColor9', '--md-ref-palette-neutral-variant30'));
 variables.set('wizardActiveStepColor', new ColorProp('@defaultColorF', '--md-ref-palette-neutral10'));
 variables.set('wizardDoneStepColor', new ColorProp('@defaultColorF', '--md-ref-palette-neutral-variant30'));