Add vue-widget - work in progress

vue-widget/.eslintignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+coverage
+**/*.d.ts
+ui-tests

vue-widget/.eslintrc.js

@@ -0,0 +1,50 @@
+module.exports = {
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:jsdoc/recommended',
+    'plugin:prettier/recommended',
+    'plugin:vue/vue3-recommended',
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: 'tsconfig.json',
+    sourceType: 'module',
+  },
+  plugins: ['@typescript-eslint', 'jsdoc'],
+  rules: {
+    '@typescript-eslint/naming-convention': [
+      'error',
+      {
+        selector: 'interface',
+        format: ['PascalCase'],
+        custom: {
+          regex: '^I[A-Z]',
+          match: true,
+        },
+      },
+    ],
+    '@typescript-eslint/no-unused-vars': ['warn', { args: 'none' }],
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-namespace': 'off',
+    '@typescript-eslint/no-use-before-define': 'off',
+    '@typescript-eslint/quotes': [
+      'error',
+      'single',
+      { avoidEscape: true, allowTemplateLiterals: false },
+    ],
+    curly: ['error', 'all'],
+    eqeqeq: 'error',
+    'jsdoc/require-param-type': 'off',
+    'jsdoc/require-property-type': 'off',
+    'jsdoc/require-returns-type': 'off',
+    'jsdoc/no-types': 'warn',
+    'prefer-arrow-callback': 'error',
+  },
+  settings: {
+    jsdoc: {
+      mode: 'typescript',
+    },
+  },
+};

vue-widget/.gitignore

@@ -0,0 +1,6 @@
+*.bundle.*
+lib/
+node_modules/
+*.egg-info/
+.ipynb_checkpoints
+*.tsbuildinfo

vue-widget/MANIFEST.in

@@ -0,0 +1,22 @@
+include LICENSE
+include README.md
+include pyproject.toml
+include jupyter-config/jupyterlab_examples_vue_widget.json
+
+include package.json
+include ts*.json
+
+graft jupyterlab_examples_vue_widget/labextension
+
+# Javascript files
+graft src
+graft style
+prune **/node_modules
+prune lib
+
+# Patterns to exclude from any directory
+global-exclude *~
+global-exclude *.pyc
+global-exclude *.pyo
+global-exclude .git
+global-exclude .ipynb_checkpoints

vue-widget/README.md

@@ -0,0 +1,35 @@
+# Vue Widget
+
+> Create a Vue.js Widget in JupyterLab.
+
+This extension shows how to use the `ReactWidget` wrapper from `@jupyterlab/apputils` to use React in a JupyterLab extension.
+
+![vue-widget](preview2.gif)
+
+## Install
+
+```bash
+jlpm
+jlpm build
+jupyter labextension install .
+
+# Rebuild Typescript source after making changes
+jlpm build
+# Rebuild JupyterLab after making any changes
+jupyter lab build
+```
+
+You can watch the source directory and run JupyterLab in watch mode to watch for changes in the extension's source and automatically rebuild the extension and application.
+
+```bash
+# Watch the source directory in another terminal tab
+jlpm watch
+# Run jupyterlab in watch mode in one terminal tab
+jupyter lab --watch
+```
+
+## React Developer Tools
+
+It is possible to use the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=de) Chrome extension to inspect React components.
+
+![react-dev-tools](preview.gif)

vue-widget/RELEASE.md

@@ -0,0 +1,25 @@
+# Making a new release of jupyterlab_examples_vue_widget
+
+The extension can be published to `PyPI` and `npm` using the [Jupyter Releaser](https://github.com/jupyter-server/jupyter_releaser).
+
+## Automated releases with the Jupyter Releaser
+
+The extension repository should already be compatible with the Jupyter Releaser.
+
+Check out the [workflow documentation](https://github.com/jupyter-server/jupyter_releaser#typical-workflow) for more information.
+
+Here is a summary of the steps to cut a new release:
+
+- Fork the [`jupyter-releaser` repo](https://github.com/jupyter-server/jupyter_releaser)
+- Add `ADMIN_GITHUB_TOKEN`, `PYPI_TOKEN` and `NPM_TOKEN` to the Github Secrets in the fork
+- Go to the Actions panel
+- Run the "Draft Changelog" workflow
+- Merge the Changelog PR
+- Run the "Draft Release" workflow
+- Run the "Publish Release" workflow
+
+## Publishing to `conda-forge`
+
+If the package is not on conda forge yet, check the documentation to learn how to add it: https://conda-forge.org/docs/maintainer/adding_pkgs.html
+
+Otherwise a bot should pick up the new version publish to PyPI, and open a new PR on the feedstock repository automatically.

vue-widget/install.json

@@ -0,0 +1,5 @@
+{
+  "packageManager": "python",
+  "packageName": "jupyterlab_examples_vue_widget",
+  "uninstallInstructions": "Use your Python package manager (pip, conda, etc.) to uninstall the package jupyterlab_examples_vue_widget"
+}

vue-widget/jupyterlab_examples_vue_widget/__init__.py

@@ -0,0 +1,19 @@
+
+import json
+import os.path as osp
+
+from ._version import __version__
+
+HERE = osp.abspath(osp.dirname(__file__))
+
+with open(osp.join(HERE, 'labextension', 'package.json')) as fid:
+    data = json.load(fid)
+
+def _jupyter_labextension_paths():
+    return [{
+        'src': 'labextension',
+        'dest': data['name']
+    }]
+
+
+

vue-widget/jupyterlab_examples_vue_widget/_version.py

@@ -0,0 +1,2 @@
+version_info = (0, 1, 0)
+__version__ = ".".join(map(str, version_info))