@abi-software/simulationvuer 0.6.5 → 0.7.0-vue-3-alpha.0

package/src/components/ui.js

@@ -1,77 +1,75 @@
-import { evaluateValue } from "./common.js";
-
-export function initialiseUi(parent) {
-  // Initialise some output-related data.
-
-  parent.simulationUiInfo.output.data.forEach((data) => {
-    parent.simulationDataId[data.id] = data.name;
-  });
-
-  let index = -1;
-
-  parent.simulationUiInfo.output.plots.forEach((outputPlot) => {
-    ++index;
-
-    parent.layout[index] = {
-      margin: {
-        t: 5,
-        l: 55,
-        r: 55,
-        b: 90,
-        pad: 4
-      },
-      dragmode: "pan",
-      xaxis: {
-        title: {
-          text: outputPlot.xAxisTitle,
-          font: {
-            size: 10,
-          },
-        },
-      },
-      yaxis: {
-        title: {
-          text: outputPlot.yAxisTitle,
-          font: {
-            size: 10,
-          },
-        }
-      },
-    };
-
-    parent.simulationData[index] = [{}];
-  });
-}
-
-export function finaliseUi(parent) {
-  // Finalise our UI, but only if we haven't already done so, we are mounted,
-  // and we have some valid simulation UI information.
-
-  if (!parent.hasFinalisedUi && parent.isMounted && parent.hasValidSimulationUiInfo) {
-    // Configure the PlotVuer's.
-
-    parent.$refs.output.classList.add("x" + parent.simulationUiInfo.output.plots.length);
-
-    // Make sure that our UI is up to date.
-
-    updateUi(parent);
-
-    parent.hasFinalisedUi = true;
-  }
-}
-
-export function updateUi(parent) {
-  // Show/hide and enable/disable all the elements.
-  // Note: we do this using $nextTick() to ensure that the UI has been fully
-  //       mounted.
-
-  parent.$nextTick(() => {
-    let index = -1;
-
-    parent.simulationUiInfo.input.forEach((input) => {
-      ++index;
-
-      parent.$children[index].visible = (input.visible === undefined)?true:evaluateValue(parent, input.visible);
-    });
-  });
-}
+import { evaluateValue } from "./common.js";
+
+export function initialiseUi(parent) {
+  // Initialise some output-related data.
+
+  parent.simulationUiInfo.output.data.forEach((data) => {
+    parent.simulationDataId[data.id] = data.name;
+  });
+
+  let index = -1;
+
+  parent.simulationUiInfo.output.plots.forEach((outputPlot) => {
+    ++index;
+
+    parent.layout[index] = {
+      margin: {
+        t: 5,
+        l: 55,
+        r: 55,
+        b: 90,
+        pad: 4
+      },
+      dragmode: "pan",
+      xaxis: {
+        title: {
+          text: outputPlot.xAxisTitle,
+          font: {
+            size: 10,
+          },
+        },
+      },
+      yaxis: {
+        title: {
+          text: outputPlot.yAxisTitle,
+          font: {
+            size: 10,
+          },
+        }
+      },
+    };
+
+    parent.simulationData[index] = [{}];
+  });
+}
+
+export function finaliseUi(parent) {
+  // Finalise our UI, but only if we haven't already done so, we are mounted,
+  // and we have some valid simulation UI information.
+
+  if (!parent.hasFinalisedUi && parent.isMounted && parent.hasValidSimulationUiInfo) {
+    // Configure the PlotVuer's.
+
+    parent.$refs.output.classList.add("x" + parent.simulationUiInfo.output.plots.length);
+
+    // Make sure that our UI is up to date.
+
+    updateUi(parent);
+
+    parent.hasFinalisedUi = true;
+  }
+}
+
+export function updateUi(parent) {
+  // Show/hide and enable/disable all the elements.
+  // Note: we do this using $nextTick() to ensure that the UI has been fully
+  //       mounted.
+  parent.$nextTick(() => {
+    let index = -1;
+
+    parent.simulationUiInfo.input.forEach((input) => {
+      ++index;
+      parent.$refs.simInput[index].visible = (input.visible === undefined)?true:evaluateValue(parent, input.visible);
+    });
+  });
+}

package/src/components.d.ts

@@ -0,0 +1,24 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+export {}
+
+declare module 'vue' {
+  export interface GlobalComponents {
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
+    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
+    ElOption: typeof import('element-plus/es')['ElOption']
+    ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSlider: typeof import('element-plus/es')['ElSlider']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    SimulationVuer: typeof import('./components/SimulationVuer.vue')['default']
+    SimulationVuerInput: typeof import('./components/SimulationVuerInput.vue')['default']
+  }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
+}

package/src/main.js

@@ -1,8 +1,20 @@
-import Vue from 'vue'
-import App from './App.vue'
-
-Vue.config.productionTip = false
-
-new Vue({
-  render: h => h(App),
-}).$mount('#app')
+import { createApp } from 'vue'
+import * as VueRouter from 'vue-router'
+import App from './App.vue'
+import ElementPlus from 'element-plus'
+
+
+const routes = [
+  { path: '/'},
+]
+
+const router = VueRouter.createRouter({
+  // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
+  history: VueRouter.createWebHashHistory(),
+  routes,
+})
+
+const app = createApp(App)
+app.use(router)
+app.use(ElementPlus)
+app.mount('#app')

package/vite.config.js

@@ -0,0 +1,71 @@
+import path from "path";
+import { resolve } from "node:path";
+const pathSrc = path.resolve(__dirname, "./src");
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import Components from 'unplugin-vue-components/vite'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
+
+// https://vitejs.dev/config/
+export default defineConfig(({ command, mode }) => {
+  const config = {
+    // css: {
+    //     preprocessorOptions: {
+    //       scss: {
+    //         additionalData: `@use '${pathSrc}\\assets\\styles' as *;`
+    //       },
+    //     },
+    // },
+    plugins: [
+        vue(),
+        Components({
+          // allow auto load markdown components under `./src/components/`
+          extensions: ['vue', 'md'],
+          // allow auto import and register components used in markdown
+          include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+          resolvers: [
+            ElementPlusResolver({
+              importStyle: 'sass',
+            }),
+          ],
+          dts: 'src/components.d.ts',
+        }),
+    
+        // https://github.com/antfu/unocss
+        // see unocss.config.ts for config
+    ],
+    build: {
+      lib: {
+        entry: path.resolve(__dirname, "./src/components/index.js"),
+        name: "SimulationVuer",
+        fileName: "simulationvuer",
+      },
+      rollupOptions: {
+        external: ["vue"],
+        output: {
+          globals: {
+            vue: "Vue",
+          },
+        },
+      },
+    },
+    resolve: {
+      alias: {
+        '~/': `${pathSrc}/`,
+      },
+    },
+  };
+
+  if (command === 'serve') {
+    config.server =  {
+      port: 8081,
+    };
+    config.define = {
+      'process.env.HTTP_PROXY': 8081,
+      global: 'globalThis',
+      // If you want to exposes all env variables, which is not recommended
+      // 'process.env': env
+    };
+  };
+  return config;
+})

package/vue.config.js

@@ -1,31 +1,31 @@
-const nodeExternals = require('webpack-node-externals');
-
-module.exports = {
-  configureWebpack: config => {
-      if (process.env.NODE_ENV === 'production') {
-        config.externals =  [ nodeExternals({allowlist: [/^element-ui/, "@abi-software/plotvuer"]}) ];
-      }
-  },
-  chainWebpack: config => {
-    const fontsRule = config.module.rule('fonts')
-    fontsRule.uses.clear()
-    config.module
-      .rule('fonts')
-      .test(/\.(ttf|otf|eot|woff|woff2)$/)
-      .use('base64-inline-loader')
-      .loader('base64-inline-loader')
-      .tap(options => {
-        // modify the options...
-        return options
-      })
-      .end()
-  },
-  css: {
-    //Import variables into all stylesheets.
-    loaderOptions: {
-      sass: {
-        prependData: `@import '@/assets/styles';`
-      }
-    }
-  }
-}
+const nodeExternals = require('webpack-node-externals');
+
+module.exports = {
+  configureWebpack: config => {
+      if (process.env.NODE_ENV === 'production') {
+        config.externals =  [ nodeExternals({allowlist: [/^element-plus/, "@abi-software/plotvuer"]}) ];
+      }
+  },
+  chainWebpack: config => {
+    const fontsRule = config.module.rule('fonts')
+    fontsRule.uses.clear()
+    config.module
+      .rule('fonts')
+      .test(/\.(ttf|otf|eot|woff|woff2)$/)
+      .use('base64-inline-loader')
+      .loader('base64-inline-loader')
+      .tap(options => {
+        // modify the options...
+        return options
+      })
+      .end()
+  },
+  css: {
+    //Import variables into all stylesheets.
+    loaderOptions: {
+      sass: {
+        prependData: `@import '@/assets/styles';`
+      }
+    }
+  }
+}

package/dist/demo.html

@@ -1,10 +0,0 @@
-<meta charset="utf-8">
-<title>simulationvuer demo</title>
-<script src="./simulationvuer.umd.js"></script>
-
-<link rel="stylesheet" href="./simulationvuer.css">
-
-
-<script>
-console.log(simulationvuer)
-</script>