## 1.5.1

.gitignore

@@ -264,3 +264,9 @@ __pycache__/
 type-script-helper-1.1.6.vsix
 type-script-helper-1.1.7.vsix
 type-script-helper-1.1.8.vsix
+
+.kanbn
+*.exe
+*.pdb
+
+.vscode/helper/**

.vscode/settings.json

@@ -1,5 +1,23 @@
 {
+  "[markdown]": {
+    "editor.wordWrap": "off"
+  },
   "cSpell.words": [
+    "initialise",
+    "Kanban",
     "VSIX"
-    ]
+  ],
+  "files.eol": "\n",
+  "files.exclude": {
+    "**/dist": false,
+    "**/node_modules": true,
+    "**/out": false
+  },
+  "files.watcherExclude": {
+    "**/node_modules": true
+  },
+  "search.exclude": {
+    "**/dist": true,
+    "**/out": true
+  }
 }

type-script-helper/.gitignore

@@ -1,5 +1,6 @@
-out
+.vscode-test/
+.vscode/helper/**
+*.vsix
 dist
 node_modules
-.vscode-test/
+out
-*.vsix

type-script-helper/.vscode/launch.json

@@ -14,22 +14,16 @@
 			],
 			"outFiles": [
 				"${workspaceFolder}/dist/**/*.js"
-			],
+			]
-			"preLaunchTask": "${defaultBuildTask}"
 		},
 		{
-			"name": "Extension Tests",
+			"type": "node",
-			"type": "extensionHost",
 			"request": "launch",
-			"args": [
+			"name": "Launch Program",
-				"--extensionDevelopmentPath=${workspaceFolder}",
+			"program": "${workspaceFolder}/src/extension.ts",
-				"--extensionTestsPath=${workspaceFolder}/out/test/suite/index"
-			],
 			"outFiles": [
-				"${workspaceFolder}/out/**/*.js",
+				"${workspaceFolder}/out/**/*.js"
-				"${workspaceFolder}/dist/**/*.js"
+			]
-			],
-			"preLaunchTask": "tasks: watch-tests"
 		}
 	]
 }

type-script-helper/.vscode/settings.json

@@ -1,13 +1,23 @@
-// Place your settings in this file to overwrite default and user settings.
 {
+  "[markdown]": {
+    "editor.wordWrap": "off"
+  },
+  "cSpell.words": [
+    "initialise",
+    "Kanban",
+    "VSIX"
+  ],
+  "files.eol": "\n",
   "files.exclude": {
-        "out": false, // set this to true to hide the "out" folder with the compiled JS files
+    "**/dist": false,
-        "dist": false // set this to true to hide the "dist" folder with the compiled JS files
+    "**/node_modules": true,
+    "**/out": false
+  },
+  "files.watcherExclude": {
+    "**/node_modules": true
   },
   "search.exclude": {
-        "out": true, // set this to false to include "out" folder in search results
+    "**/dist": true,
-        "dist": true // set this to false to include "dist" folder in search results
+    "**/out": true
-    },
+  }
-    // Turn off tsc task auto detection since we have the necessary tasks as npm scripts
-    "typescript.tsc.autoDetect": "off"
 }

type-script-helper/.vscode/tasks.json

@@ -1,40 +0,0 @@
-// See https://go.microsoft.com/fwlink/?LinkId=733558
-// for the documentation about the tasks.json format
-{
-	"version": "2.0.0",
-	"tasks": [
-		{
-			"type": "npm",
-			"script": "watch",
-			"problemMatcher": "$ts-webpack-watch",
-			"isBackground": true,
-			"presentation": {
-				"reveal": "never",
-				"group": "watchers"
-			},
-			"group": {
-				"kind": "build",
-				"isDefault": true
-			}
-		},
-		{
-			"type": "npm",
-			"script": "watch-tests",
-			"problemMatcher": "$tsc-watch",
-			"isBackground": true,
-			"presentation": {
-				"reveal": "never",
-				"group": "watchers"
-			},
-			"group": "build"
-		},
-		{
-			"label": "tasks: watch-tests",
-			"dependsOn": [
-				"npm: watch",
-				"npm: watch-tests"
-			],
-			"problemMatcher": []
-		}
-	]
-}

type-script-helper/.vscodeignore

@@ -1,13 +1,14 @@
-.vscode/**
-.vscode-test/**
-out/**
-node_modules/**
-src/**
 .gitignore
+.vscode-test/**
+.vscode/**
 .yarnrc
-webpack.config.js
-vsc-extension-quickstart.md
-**/tsconfig.json
 **/.eslintrc.json
 **/*.map
 **/*.ts
+**/tsconfig.json
+build/**
+node_modules/**
+src/**
+webviews/**
+vsc-extension-quickstart.md
+webpack.config.js

type-script-helper/CHANGELOG.md

@@ -1,9 +0,0 @@
-# Change Log
-
-All notable changes to the "type-script-helper" extension will be documented in this file.
-
-Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
-
-## [Unreleased]
-
-- Initial release

type-script-helper/LICENSE.md

@@ -1,3 +1,11 @@
+---
+type: "note"
+created: "2022-03-10T21:18:17.054Z"
+updated: "2022-03-10T21:18:17.054Z"
+---
+
+# LICENSE
+
 Copyright (c) Twitter Inc
 
 Permission is hereby granted, free of charge, to any person obtaining a copy

type-script-helper/README.md

@@ -1,3 +1,9 @@
+---
+type: "read-me"
+created: "2023-09-30T01:47:18.241Z"
+updated: "2023-09-30T01:47:18.242Z"
+---
+
 # type-script-helper README
 
 ## Features
@@ -16,10 +22,10 @@ yo code
 # ? What's the name of your extension? HelloWorld
 ### Press <Enter> to choose default for all options below ###
 
-# ? What's the identifier of your extension? helloworld
+# ? What's the identifier of your extension? hello-world
 # ? What's the description of your extension? LEAVE BLANK
 # ? Initialize a git repository? Yes
-# ? Bundle the source code with webpack? No
+# ? Bundle the source code with webpack? No (should be yes?)
 # ? Which package manager to use? npm
 
 # ? Do you want to open the new folder with Visual Studio Code? Open with `code`
@@ -104,3 +110,10 @@ None
 -----------------------------------------------------------------------------------------------------------
 
 - Transform to Param Case
+
+## 1.5.1
+-----------------------------------------------------------------------------------------------------------
+
+- columns-to-cards-webview-view-provider
+- file-folder-helper-exe
+- clickable list

type-script-helper/build/node-extension.webpack.config.js

@@ -4,24 +4,21 @@
 
 const path = require('path');
 
-//@ts-check
+/**@type {import('webpack').Configuration}*/
-/** @typedef {import('webpack').Configuration} WebpackConfig **/
+const config = {
-
+  target: 'node', // vscode extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
-/** @type WebpackConfig */
-const extensionConfig = {
-  target: 'node', // VS Code extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
 	mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
 
   entry: './src/extension.ts', // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
   output: {
     // the bundle is stored in the 'dist' folder (check package.json), 📖 -> https://webpack.js.org/configuration/output/
-    path: path.resolve(__dirname, 'dist'),
+    path: path.resolve(__dirname, '..', 'dist'),
     filename: 'extension.js',
     libraryTarget: 'commonjs2'
   },
+  devtool: 'nosources-source-map',
   externals: {
     vscode: 'commonjs vscode' // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot be webpack'ed, 📖 -> https://webpack.js.org/configuration/externals/
-    // modules added here also need to be added in the .vscodeignore file
   },
   resolve: {
     // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
@@ -39,10 +36,6 @@ const extensionConfig = {
         ]
       }
     ]
-  },
+  }
-  devtool: 'nosources-source-map',
-  infrastructureLogging: {
-    level: "log", // enables logging required for problem matchers
-  },
 };
-module.exports = [ extensionConfig ];
+module.exports = config;

type-script-helper/media/checklist.svg

@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.75 4.48h-.71L2 3.43l.71-.7.69.68L4.81 2l.71.71-1.77 1.77zM6.99 3h8v1h-8V3zm0 3h8v1h-8V6zm8 3h-8v1h8V9zm-8 3h8v1h-8v-1zM3.04 7.48h.71l1.77-1.77-.71-.7L3.4 6.42l-.69-.69-.71.71 1.04 1.04zm.71 3.01h-.71L2 9.45l.71-.71.69.69 1.41-1.42.71.71-1.77 1.77zm-.71 3.01h.71l1.77-1.77-.71-.71-1.41 1.42-.69-.69-.71.7 1.04 1.05z"/></svg>

type-script-helper/media/main.js

@@ -0,0 +1,7 @@
+// This script will be run within the webview itself
+// It cannot access the main VS Code APIs directly.
+(function () {
+  const vscode = acquireVsCodeApi();
+
+  console.log("hello there from javascript");
+})();

type-script-helper/media/reset.css

@@ -0,0 +1,30 @@
+html {
+  box-sizing: border-box;
+  font-size: 13px;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+ol,
+ul {
+  margin: 0;
+  padding: 0;
+  font-weight: normal;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+}

type-script-helper/media/vscode.css

@@ -0,0 +1,91 @@
+:root {
+  --container-paddding: 20px;
+  --input-padding-vertical: 6px;
+  --input-padding-horizontal: 4px;
+  --input-margin-vertical: 4px;
+  --input-margin-horizontal: 0;
+}
+
+body {
+  padding: 0 var(--container-paddding);
+  color: var(--vscode-foreground);
+  font-size: var(--vscode-font-size);
+  font-weight: var(--vscode-font-weight);
+  font-family: var(--vscode-font-family);
+  background-color: var(--vscode-editor-background);
+}
+
+ol,
+ul {
+  padding-left: var(--container-paddding);
+}
+
+body > *,
+form > * {
+  margin-block-start: var(--input-margin-vertical);
+  margin-block-end: var(--input-margin-vertical);
+}
+
+*:focus {
+  outline-color: var(--vscode-focusBorder) !important;
+}
+
+a {
+  color: var(--vscode-textLink-foreground);
+}
+
+a:hover,
+a:active {
+  color: var(--vscode-textLink-activeForeground);
+}
+
+code {
+  font-size: var(--vscode-editor-font-size);
+  font-family: var(--vscode-editor-font-family);
+}
+
+button {
+  border: none;
+  padding: var(--input-padding-vertical) var(--input-padding-horizontal);
+  width: 100%;
+  text-align: center;
+  outline: 1px solid transparent;
+  outline-offset: 2px !important;
+  color: var(--vscode-button-foreground);
+  background: var(--vscode-button-background);
+}
+
+button:hover {
+  cursor: pointer;
+  background: var(--vscode-button-hoverBackground);
+}
+
+button:focus {
+  outline-color: var(--vscode-focusBorder);
+}
+
+button.secondary {
+  color: var(--vscode-button-secondaryForeground);
+  background: var(--vscode-button-secondaryBackground);
+}
+
+button.secondary:hover {
+  background: var(--vscode-button-secondaryHoverBackground);
+}
+
+input:not([type="checkbox"]),
+textarea {
+  display: block;
+  width: 100%;
+  border: none;
+  font-family: var(--vscode-font-family);
+  padding: var(--input-padding-vertical) var(--input-padding-horizontal);
+  color: var(--vscode-input-foreground);
+  outline-color: var(--vscode-input-border);
+  background-color: var(--vscode-input-background);
+}
+
+input::placeholder,
+textarea::placeholder {
+  color: var(--vscode-input-placeholderForeground);
+}

type-script-helper/package.json

@@ -1,158 +1,264 @@
 {
-  "name": "type-script-helper",
+  "activationEvents": [],
-  "displayName": "Type Script Helper",
-  "description": "Helper for VS Code in TypeScript",
-  "publisher": "IFX",
-  "repository": "https://github.com/mikepharesjr/YO-VSCode/tree/master/type-script-helper",
-  "version": "1.4.4",
-  "engines": {
-    "vscode": "^1.79.0"
-  },
   "categories": [
     "Other"
   ],
-  "activationEvents": [],
-  "main": "./dist/extension.js",
   "contributes": {
+    "configuration": {
+      "type": "object",
+      "title": "Type Script Helper Configuration",
+      "properties": {
+        "fileTemplates.author": {
+          "type": [
+            "string",
+            "null"
+          ],
+          "default": null,
+          "description": "Value to use to replace #{author} variable."
+        },
+        "fileTemplates.company": {
+          "type": [
+            "string",
+            "null"
+          ],
+          "default": null,
+          "description": "Value to use to replace #{company} variable."
+        }
+      }
+    },
     "commands": [
       {
+        "category": "Helper",
         "command": "open-in-new-window.open",
         "title": "Open in New Window"
       },
       {
+        "category": "Helper",
         "command": "promiseLinesHelper.codeGeneratorQuickPick",
         "title": "Code Generator - Quick Pick"
       },
       {
+        "category": "Helper",
         "command": "promiseLinesHelper.insertDateTime",
         "title": "Insert DateTime"
       },
       {
-        "command": "promiseLinesHelper.transformToPopperCase",
+        "category": "Helper",
-        "title": "Transform to Popper Case"
-      },
-      {
         "command": "promiseLinesHelper.transformToParamCase",
         "title": "Transform to Param Case"
       },
       {
+        "category": "Helper",
+        "command": "promiseLinesHelper.transformToPopperCase",
+        "title": "Transform to Popper Case"
+      },
+      {
+        "category": "Helper",
         "command": "readOnlyLinesHelper.searchGoogle",
         "title": "Search Google"
       },
       {
+        "category": "Kanban",
+        "command": "kanban.refreshBoth",
+        "title": "Refresh Kanban Both"
+      },
+      {
+        "category": "Kanban",
+        "command": "kanban.refreshSidebar",
+        "title": "Refresh Kanban Sidebar"
+      },
+      {
+        "category": "Kanban",
+        "command": "kanban.refreshWebView",
+        "title": "Refresh Kanban WebView"
+      },
+      {
+        "category": "Kanban",
+        "command": "kanban.debugReload",
+        "title": "Debug Reload Kanban"
+      },
+      {
+        "category": "Markdown",
+        "command": "markdown.newMarkdownFile",
+        "title": "New Markdown File"
+      },
+      {
+        "category": "Quick Fix",
+        "command": "replaceLinesHelper.quickFixCamelCaseProperties",
+        "title": "Camel Case Properties"
+      },
+      {
+        "category": "Quick Fix",
+        "command": "replaceLinesHelper.quickFixCS0108",
+        "title": " CS0108 (Data Annotations)"
+      },
+      {
+        "category": "Quick Fix",
+        "command": "replaceLinesHelper.quickFixInstanceFieldToCalisthenics",
+        "title": "Instance Field to Calisthenics"
+      },
+      {
+        "category": "Quick Fix",
+        "command": "replaceLinesHelper.quickFixProperCaseProperties",
+        "title": "Proper Case Properties"
+      },
+      {
+        "category": "Quick Fix",
+        "command": "replaceLinesHelper.quickFixPublic",
+        "title": "Public (Expression Body)"
+      },
+      {
+        "category": "Replace",
         "command": "replaceLinesHelper.addCSharpComment",
         "title": "Add C# Comment"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.addVBComment",
         "title": "Add VB Comment"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.convertToRegularExpression",
         "title": "Convert to Regular Expression"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.cutEachLine",
         "title": "Cut each line after |||"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.distinctLines",
         "title": "Distinct Lines"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.expandSql",
         "title": "Expand Sql"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.listToListFamily",
         "title": "List to list family (Kristy, Mike ...)"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.listToListWrappedComma",
         "title": "List to list wrapped comma"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.prettySql",
         "title": "Pretty Sql"
       },
       {
-        "command": "replaceLinesHelper.quickFixCamelCaseProperties",
+        "category": "Replace",
-        "title": "Quick Fix - Camel Case Properties"
-      },
-      {
-        "command": "replaceLinesHelper.quickFixCS0108",
-        "title": "Quick Fix -  CS0108 (Data Annotations)"
-      },
-      {
-        "command": "replaceLinesHelper.quickFixInstanceFieldToCalisthenics",
-        "title": "Quick Fix - Instance Field to Calisthenics"
-      },
-      {
-        "command": "replaceLinesHelper.quickFixProperCaseProperties",
-        "title": "Quick Fix - Proper Case Properties"
-      },
-      {
-        "command": "replaceLinesHelper.quickFixPublic",
-        "title": "Quick Fix - Public (Expression Body)"
-      },
-      {
         "command": "replaceLinesHelper.removeComment",
         "title": "Remove comment"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.sortLength",
         "title": "Sort by Length"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.sortNormal",
         "title": "My Sort lines (ascending, case sensitive)"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.splitBySpaceReverseJoinSort",
         "title": "Split by Space Reverse Join Sort lines (ascending, case sensitive)"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.unwrapSql",
         "title": "Un-wrap Sql"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.wrapSqlCSharp",
         "title": "Wrap Sql for C#"
       },
       {
+        "category": "Replace",
         "command": "replaceLinesHelper.wrapSqlVB",
         "title": "Wrap Sql for VB"
+      },
+      {
+        "category": "WebView",
+        "command": "webView.webView",
+        "title": "Web View"
+      }
+    ],
+    "views": {
+      "columns-to-cards-webview-view-provider-view": [
+        {
+          "contextualTitle": "Kanban",
+          "icon": "media/checklist.svg",
+          "id": "columns-to-cards-webview-view-provider",
+          "name": "Kanban",
+          "type": "webview"
         }
       ]
     },
-  "scripts": {
+    "viewsContainers": {
-    "vscode:prepublish": "npm run package",
+      "activitybar": [
-    "compile": "webpack",
+        {
-    "watch": "webpack --watch",
+          "icon": "media/checklist.svg",
-    "package": "webpack --mode production --devtool hidden-source-map",
+          "id": "columns-to-cards-webview-view-provider-view",
-    "compile-tests": "tsc -p . --outDir out",
+          "title": "Kanban"
-    "watch-tests": "tsc -p . -w --outDir out",
+        }
-    "pretest": "npm run compile-tests && npm run compile && npm run lint",
+      ]
-    "lint": "eslint src --ext ts",
+    }
-    "test": "node ./out/test/runTest.js"
   },
+  "dependencies": {
+    "@vscode/vsce": "^2.19.0",
+    "polka": "^0.5.2"
+  },
+  "description": "Helper for VS Code in TypeScript",
   "devDependencies": {
+    "@nodelib/fs.stat": "^3.0.0",
+    "@rollup/plugin-commonjs": "^25.0.4",
+    "@rollup/plugin-node-resolve": "^15.2.1",
+    "@rollup/plugin-typescript": "^11.1.4",
+    "@tsconfig/svelte": "^1.0.10",
     "@types/glob": "^8.1.0",
     "@types/mocha": "^10.0.1",
     "@types/node": "20.2.5",
+    "@types/polka": "^0.5.1",
     "@types/vscode": "^1.79.0",
     "@typescript-eslint/eslint-plugin": "^5.59.8",
     "@typescript-eslint/parser": "^5.59.8",
     "@vscode/test-electron": "^2.3.2",
+    "concurrently": "^8.2.1",
     "eslint": "^8.41.0",
     "glob": "^8.1.0",
     "mocha": "^10.2.0",
+    "rollup": "^2.3.4",
+    "rollup-plugin-svelte": "^6.1.1",
+    "rollup-plugin-terser": "^7.0.2",
+    "svelte": "^3.31.0",
+    "svelte-check": "^1.1.23",
+    "svelte-preprocess": "^5.0.4",
     "ts-loader": "^9.4.3",
     "typescript": "^5.1.3",
     "webpack": "^5.85.0",
     "webpack-cli": "^5.1.1"
   },
-  "dependencies": {
+  "displayName": "Type Script Helper",
-    "@vscode/vsce": "^2.19.0"
+  "engines": {
-  }
+    "vscode": "^1.79.0"
+  },
+  "main": "./dist/extension.js",
+  "name": "type-script-helper",
+  "publisher": "IFX",
+  "repository": "https://github.com/mikepharesjr/YO-VSCode/tree/master/type-script-helper",
+  "scripts": {
+    "vscode:publish": "node node_modules/@vscode/vsce/vsce package",
+    "watch": "concurrently \"rollup -c -w\" \"webpack --watch --config ./build/node-extension.webpack.config.js\""
+  },
+  "version": "1.5.2"
 }

type-script-helper/rollup.config.js

@@ -0,0 +1,68 @@
+import svelte from "rollup-plugin-svelte";
+import resolve from "@rollup/plugin-node-resolve";
+import commonjs from "@rollup/plugin-commonjs";
+import { terser } from "rollup-plugin-terser";
+import sveltePreprocess from "svelte-preprocess";
+import typescript from "@rollup/plugin-typescript";
+import path from "path";
+import fs from "fs";
+
+const production = !process.env.ROLLUP_WATCH;
+
+export default fs
+  .readdirSync(path.join(__dirname, "webviews", "pages"))
+  .map((input) => {
+    const name = input.split(".")[0];
+    return {
+      input: "webviews/pages/" + input,
+      output: {
+        sourcemap: true,
+        format: "iife",
+        name: "app",
+        file: "out/compiled/" + name + ".js",
+      },
+      plugins: [
+        svelte({
+          // enable run-time checks when not in production
+          dev: !production,
+          // we'll extract any component CSS out into
+          // a separate file - better for performance
+          css: (css) => {
+            css.write(name + ".css");
+          },
+          preprocess: sveltePreprocess(),
+        }),
+
+        // If you have external dependencies installed from
+        // npm, you'll most likely need these plugins. In
+        // some cases you'll need additional configuration -
+        // consult the documentation for details:
+        // https://github.com/rollup/plugins/tree/master/packages/commonjs
+        resolve({
+          browser: true,
+          dedupe: ["svelte"],
+        }),
+        commonjs(),
+        typescript({
+          tsconfig: "webviews/tsconfig.json",
+          sourceMap: !production,
+          inlineSources: !production,
+        }),
+
+        // In dev mode, call `npm run start` once
+        // the bundle has been generated
+        // !production && serve(),
+
+        // Watch the `public` directory and refresh the
+        // browser on changes when not in production
+        // !production && livereload("public"),
+
+        // If we're building for production (npm run build
+        // instead of npm run dev), minify
+        production && terser(),
+      ],
+      watch: {
+        clearScreen: false,
+      },
+    };
+  });

type-script-helper/src/Card.ts

@@ -0,0 +1,22 @@
+import { H2HexColor } from "./H2HexColor";
+import { LineNumber } from "./LineNumber";
+import { H2NoCheckboxes } from "./H2NoCheckboxes";
+import { H2WithCheckboxes } from "./H2WithCheckboxes";
+
+export type Card = {
+  Assignees: Array<string>;
+  CreationDateTime: Date;
+  Directory: string;
+  Extension: string;
+  File: string;
+  FileName: string;
+  FileNameWithoutExtension: string;
+  H1: string;
+  H2HexColorCollection: Array<H2HexColor>;
+  H2NoCheckboxesCollection: Array<H2NoCheckboxes>;
+  H2WithCheckboxesCollection: Array<H2WithCheckboxes>;
+  LastWriteDateTime: Date;
+  LineNumber: LineNumber;
+  RequestedDateTime: string;
+  Type: string;
+};

type-script-helper/src/ColumnsToCardsWebviewViewProvider.ts

@@ -0,0 +1,188 @@
+import { Card } from "./Card";
+import { readFile } from "fs";
+import * as vscode from "vscode";
+import { getNonce } from "./getNonce";
+import { PostMessage } from "./PostMessage";
+import { apiBaseUrl, key } from "./constants";
+import { ExecException, exec } from 'child_process';
+
+export function refreshSidebarLogic(): undefined {
+  vscode.commands.executeCommand("workbench.action.closeSidebar").then(_ => {
+    vscode.commands.executeCommand("workbench.view.extension.columns-to-cards-sidebar-view");
+  });
+}
+
+function columnsToCardsRead(webviewView: vscode.WebviewView, columnsToCardsUri: vscode.Uri, err: NodeJS.ErrnoException | null, data: string | Buffer) {
+  if (err)
+    vscode.window.showInformationMessage(`<${columnsToCardsUri.fsPath}> doesn't exist! ${err.message}`);
+  const columnsToCards: Record<string, Array<Card>> = {};
+  const jsonObject: any = JSON.parse(data.toString('utf8'));
+  for (const property in jsonObject) {
+    columnsToCards[property] = jsonObject[property];
+  }
+  const postMessage: PostMessage = { type: "columns-to-cards", value: columnsToCards };
+  webviewView.webview.postMessage(postMessage);
+}
+
+function execCallback(webviewView: vscode.WebviewView, destination: vscode.Uri, error: ExecException | null, stdout: string, stderr: string) {
+  if (error) {
+    vscode.window.showInformationMessage(error.message);
+    return;
+  }
+  if (stderr) {
+    vscode.window.showInformationMessage(stderr);
+    return;
+  }
+  console.log(`stdout: ${stdout}`);
+  const columnsToCards = vscode.Uri.joinPath(destination, "columnsToCards.json");
+  readFile(columnsToCards.fsPath, (err, data) =>
+    columnsToCardsRead(webviewView, columnsToCards, err, data));
+};
+
+async function postColumnsToCards(extensionUri: vscode.Uri, webviewView: vscode.WebviewView) {
+  if (vscode.workspace.workspaceFolders === undefined)
+    vscode.window.showInformationMessage("Open workspace first!");
+  else {
+    const workspaceFoldersZero = vscode.workspace.workspaceFolders[0].uri;
+    const destination: vscode.Uri = vscode.Uri.joinPath(workspaceFoldersZero, ".vscode", "helper");
+    const fileFolderHelper: vscode.Uri = vscode.Uri.joinPath(extensionUri, "net7.0", "win-x64", "publish", "File-Folder-Helper.exe");
+    const command: string = `${fileFolderHelper.fsPath} s M ${workspaceFoldersZero.fsPath} -s ${workspaceFoldersZero.fsPath} -d ${destination.fsPath}`;
+    exec(command, (error, stdout, stderr) =>
+      execCallback(webviewView, destination, error, stdout, stderr));
+  }
+}
+
+function getToken(workspaceState: vscode.Memento, webviewView: vscode.WebviewView) {
+  webviewView.webview.postMessage({
+    type: "token",
+    value: workspaceState.get(key),
+  });
+}
+
+function authenticate(workspaceState: vscode.Memento, webviewView: vscode.WebviewView) {
+  webviewView.webview.postMessage({
+    type: "token",
+    value: workspaceState.get(key),
+  });
+}
+
+function logout(workspaceState: vscode.Memento) {
+  workspaceState.update(key, "");
+}
+
+async function openCard(value: any) {
+  if (vscode.workspace.workspaceFolders === undefined)
+    vscode.window.showInformationMessage("Open workspace first!");
+  else {
+    if (!value.File)
+      vscode.window.showInformationMessage("File wasn't passed!");
+    else {
+      const textDocument: vscode.TextDocument = await vscode.workspace.openTextDocument(value.File);
+      vscode.window.showTextDocument(textDocument);
+    }
+  }
+}
+
+export class ColumnsToCardsWebviewViewProvider implements vscode.WebviewViewProvider {
+  _view?: vscode.WebviewView;
+
+  constructor(private readonly _extensionContext: vscode.ExtensionContext) {
+  }
+
+  public revive(panel: vscode.WebviewView) {
+    this._view = panel;
+  }
+
+  public resolveWebviewView(webviewView: vscode.WebviewView) {
+    this._view = webviewView;
+
+    webviewView.webview.options = {
+      // Allow scripts in the webview
+      enableScripts: true,
+
+      localResourceRoots: [this._extensionContext.extensionUri],
+    };
+
+    webviewView.webview.html = this._getHtmlForWebview(webviewView.webview);
+
+    webviewView.webview.onDidReceiveMessage(async (postMessage: PostMessage) => {
+      switch (postMessage.type) {
+        case "logout":
+          logout(this._extensionContext.workspaceState);
+          break;
+        case "authenticate":
+          authenticate(this._extensionContext.workspaceState, webviewView);
+          break;
+        case "get-token":
+          getToken(this._extensionContext.workspaceState, webviewView);
+          break;
+        case "get-columns-to-cards":
+          postColumnsToCards(this._extensionContext.extensionUri, webviewView);
+          break;
+        case "open-card":
+          openCard(postMessage.value);
+          break;
+        case "on-info":
+          if (!postMessage.value)
+            return;
+          vscode.window.showInformationMessage(postMessage.value);
+          break;
+        case "on-error":
+          if (!postMessage.value)
+            return;
+          vscode.window.showErrorMessage(postMessage.value);
+          break;
+        default:
+          vscode.window.showErrorMessage(postMessage.type);
+          break;
+      }
+    });
+  }
+
+  private _getHtmlForWebview(webview: vscode.Webview) {
+    const styleResetUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "media", "reset.css")
+    );
+    const styleVSCodeUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "media", "vscode.css")
+    );
+
+    const scriptUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "out", "compiled/ColumnsToCards.js")
+    );
+    const styleMainUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "out", "compiled/ColumnsToCards.css")
+    );
+
+    // Use a nonce to only allow a specific script to be run.
+    const nonce = getNonce();
+
+    return `<!DOCTYPE html>
+			<html lang="en">
+			<head>
+				<meta charset="UTF-8">
+				<!--
+					Use a content security policy to only allow loading images from https or from our extension directory,
+					and only allow scripts that have a specific nonce.
+        -->
+        <meta http-equiv="Content-Security-Policy"
+          content="img-src https: data:;
+          style-src 'unsafe-inline' ${webview.cspSource};
+          script-src 'nonce-${nonce}';">
+				<meta name="viewport" content="width=device-width, initial-scale=1.0">
+				<link href="${styleResetUri}" rel="stylesheet">
+				<link href="${styleVSCodeUri}" rel="stylesheet">
+        <link href="${styleMainUri}" rel="stylesheet">
+        <script nonce="${nonce}">
+          const acquiredVsCodeApi = acquireVsCodeApi();
+          const apiBaseUrl = ${JSON.stringify(apiBaseUrl)}
+        </script>
+			</head>
+      <body>
+				<script nonce="${nonce}" src="${scriptUri}"></script>
+			</body>
+			</html>`;
+  }
+}
+
+export const refreshSidebar = () => refreshSidebarLogic();

type-script-helper/src/H2HexColor.ts

@@ -0,0 +1,4 @@
+export type H2HexColor = {
+  H2: string;
+  HexColor: string;
+};

type-script-helper/src/H2NoCheckboxes.ts

@@ -0,0 +1,5 @@
+
+export type H2NoCheckboxes = {
+  H2: string;
+  Lines: Array<string>;
+};

type-script-helper/src/H2WithCheckboxes.ts

@@ -0,0 +1,7 @@
+
+export type H2WithCheckboxes = {
+  Completed: number;
+  H2: string;
+  NotCompleted: number;
+  Total: number;
+};

type-script-helper/src/LineNumber.ts

@@ -0,0 +1,9 @@
+
+export type LineNumber = {
+  Created: number;
+  H1: number;
+  FrontMatterYamlEnd: number;
+  Status: number;
+  Type: number;
+  Updated: number;
+};

type-script-helper/src/PostMessage.ts

@@ -0,0 +1,5 @@
+
+export type PostMessage = {
+  type: string;
+  value: any;
+};

type-script-helper/src/WebViewPanel.ts

@@ -0,0 +1,166 @@
+import * as vscode from "vscode";
+import { getNonce } from "./getNonce";
+import { apiBaseUrl } from "./constants";
+import { PostMessage } from "./PostMessage";
+
+export function refreshWebView(extensionContext: vscode.ExtensionContext): undefined {
+  WebViewPanel.kill();
+  WebViewPanel.createOrShow(extensionContext);
+}
+
+export class WebViewPanel {
+  /**
+   * Track the currently panel. Only allow a single panel to exist at a time.
+   */
+  public static currentPanel: WebViewPanel | undefined;
+
+  public static readonly viewType = "web-view-panel";
+
+  private _disposables: vscode.Disposable[] = [];
+
+  public static createOrShow(extensionContext: vscode.ExtensionContext) {
+    const column = vscode.window.activeTextEditor
+      ? vscode.window.activeTextEditor.viewColumn
+      : undefined;
+
+    // If we already have a panel, show it.
+    if (WebViewPanel.currentPanel) {
+      WebViewPanel.currentPanel._panel.reveal(column);
+      WebViewPanel.currentPanel._update();
+      return;
+    }
+
+    // Otherwise, create a new panel.
+    const panel = vscode.window.createWebviewPanel(
+      WebViewPanel.viewType,
+      "Web-View-Panel",
+      column || vscode.ViewColumn.One,
+      {
+        // Enable javascript in the webview
+        enableScripts: true,
+
+        // And restrict the webview to only loading content from our extension's `media` directory.
+        localResourceRoots: [
+          vscode.Uri.joinPath(extensionContext.extensionUri, "media"),
+          vscode.Uri.joinPath(extensionContext.extensionUri, "out/compiled"),
+        ],
+      }
+    );
+
+    WebViewPanel.currentPanel = new WebViewPanel(panel, extensionContext);
+  }
+
+  public static kill() {
+    WebViewPanel.currentPanel?.dispose();
+    WebViewPanel.currentPanel = undefined;
+  }
+
+  public static revive(panel: vscode.WebviewPanel, extensionContext: vscode.ExtensionContext) {
+    WebViewPanel.currentPanel = new WebViewPanel(panel, extensionContext);
+  }
+
+  private constructor(private readonly _panel: vscode.WebviewPanel, private readonly _extensionContext: vscode.ExtensionContext) {
+
+    // Set the webview's initial html content
+    this._update();
+
+    // Listen for when the panel is disposed
+    // This happens when the user closes the panel or when the panel is closed programmatically
+    this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
+
+    // // Handle messages from the webview
+    // this._panel.webview.onDidReceiveMessage(
+    //   (message) => {
+    //     switch (message.command) {
+    //       case "alert":
+    //         vscode.window.showErrorMessage(message.text);
+    //         return;
+    //     }
+    //   },
+    //   null,
+    //   this._disposables
+    // );
+  }
+
+  public dispose() {
+    WebViewPanel.currentPanel = undefined;
+
+    // Clean up our resources
+    this._panel.dispose();
+
+    while (this._disposables.length) {
+      const x = this._disposables.pop();
+      if (x) {
+        x.dispose();
+      }
+    }
+  }
+
+  private async _update() {
+    const webview = this._panel.webview;
+
+    this._panel.webview.html = this._getHtmlForWebview(webview);
+    webview.onDidReceiveMessage(async (postMessage: PostMessage) => {
+      switch (postMessage.type) {        
+        case "on-info":
+          if (!postMessage.value)
+            return;
+          vscode.window.showInformationMessage(postMessage.value);
+          break;
+        case "on-error":
+          if (!postMessage.value)
+            return;
+          vscode.window.showErrorMessage(postMessage.value);
+          break;
+        default:
+          vscode.window.showErrorMessage(postMessage.type);
+          break;
+      }
+    });
+  }
+
+  private _getHtmlForWebview(webview: vscode.Webview) {
+    const styleResetUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "media", "reset.css")
+    );
+    const styleVSCodeUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "media", "vscode.css")
+    );
+
+    const scriptUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "out", "compiled/DisplayDate.js")
+    );
+    const styleMainUri = webview.asWebviewUri(
+      vscode.Uri.joinPath(this._extensionContext.extensionUri, "out", "compiled/DisplayDate.css")
+    );
+
+    // Use a nonce to only allow a specific script to be run.
+    const nonce = getNonce();
+
+    return `<!DOCTYPE html>
+			<html lang="en">
+			<head>
+				<meta charset="UTF-8">
+				<!--
+					Use a content security policy to only allow loading images from https or from our extension directory,
+					and only allow scripts that have a specific nonce.
+        -->
+        <meta http-equiv="Content-Security-Policy"
+          content="img-src https: data:;
+          style-src 'unsafe-inline' ${webview.cspSource};
+          script-src 'nonce-${nonce}';">
+				<meta name="viewport" content="width=device-width, initial-scale=1.0">
+				<link href="${styleResetUri}" rel="stylesheet">
+				<link href="${styleVSCodeUri}" rel="stylesheet">
+        <link href="${styleMainUri}" rel="stylesheet">
+        <script nonce="${nonce}">
+          const acquiredVsCodeApi = acquireVsCodeApi();
+          const apiBaseUrl = ${JSON.stringify(apiBaseUrl)}
+        </script>
+			</head>
+      <body>
+				<script nonce="${nonce}" src="${scriptUri}"></script>
+			</body>
+			</html>`;
+  }
+}

type-script-helper/src/constants.ts

@@ -0,0 +1,2 @@
+export const apiBaseUrl: string = "http://localhost:3002";
+export const key: string = "type-script-helper";

type-script-helper/src/extension.ts

@@ -1,13 +1,25 @@
 // The module 'vscode' contains the VS Code extensibility API
 // Import the module and reference it with the alias vscode in your code below
 import * as vscode from 'vscode';
+import * as kanbanHelper from './kanbanHelper';
+import * as markdownHelper from './markdownHelper';
+import * as promiseLinesHelper from './promiseLinesHelper';
 import * as replaceLinesHelper from './replaceLinesHelper';
 import * as readOnlyLinesHelper from './readOnlyLinesHelper';
-import * as promiseLinesHelper from './promiseLinesHelper';
+import { WebViewPanel, refreshWebView } from "./WebViewPanel";
+import { ColumnsToCardsWebviewViewProvider, refreshSidebar } from "./ColumnsToCardsWebviewViewProvider";
 
 // This method is called when your extension is activated
 // Your extension is activated the very first time the command is executed
-export function activate(context: vscode.ExtensionContext) {
+export async function activate(extensionContext: vscode.ExtensionContext) {
+
+	const columnsToCardsWebviewViewProvider = new ColumnsToCardsWebviewViewProvider(extensionContext);
+
+	const item = vscode.window.createStatusBarItem(vscode.StatusBarAlignment.Right);
+	item.text = "$(beaker) Show Kanban";
+	// item.command = "kanban.show";
+	item.show();
+	extensionContext.subscriptions.push(vscode.window.registerWebviewViewProvider("columns-to-cards-webview-view-provider", columnsToCardsWebviewViewProvider));
 
 	// Use the console to output diagnostic information (console.log) and errors (console.error)
 	// This line of code will only be executed once when your extension is activated
@@ -25,6 +37,10 @@ export function activate(context: vscode.ExtensionContext) {
 	// context.subscriptions.push(disposable);
 
 	const commands = [
+		vscode.commands.registerCommand("kanban.refreshBoth", () => { kanbanHelper.refreshBoth(extensionContext); }),
+		vscode.commands.registerCommand("kanban.refreshSidebar", refreshSidebar),
+		vscode.commands.registerCommand("kanban.refreshWebView", () => { refreshWebView(extensionContext); }),
+		vscode.commands.registerCommand("markdown.newMarkdownFile", markdownHelper.newMarkdownFile),
 		vscode.commands.registerCommand('promiseLinesHelper.codeGeneratorQuickPick', promiseLinesHelper.codeGeneratorQuickPick),
 		vscode.commands.registerCommand('promiseLinesHelper.insertDateTime', promiseLinesHelper.insertDateTime),
 		vscode.commands.registerCommand('promiseLinesHelper.transformToPopperCase', promiseLinesHelper.transformToPopperCase),
@@ -50,10 +66,11 @@ export function activate(context: vscode.ExtensionContext) {
 		vscode.commands.registerCommand('replaceLinesHelper.splitBySpaceReverseJoinSort', replaceLinesHelper.splitBySpaceReverseJoinSort),
 		vscode.commands.registerCommand('replaceLinesHelper.unwrapSql', replaceLinesHelper.unwrapSql),
 		vscode.commands.registerCommand('replaceLinesHelper.wrapSqlCSharp', replaceLinesHelper.wrapSqlCSharp),
-		vscode.commands.registerCommand('replaceLinesHelper.wrapSqlVB', replaceLinesHelper.wrapSqlVB)
+		vscode.commands.registerCommand('replaceLinesHelper.wrapSqlVB', replaceLinesHelper.wrapSqlVB),
+		vscode.commands.registerCommand("webView.webView", () => { WebViewPanel.createOrShow(extensionContext); })
 	];
 
-	commands.forEach(command => context.subscriptions.push(command));
+	commands.forEach(command => extensionContext.subscriptions.push(command));
 }
 
 // This method is called when your extension is deactivated

type-script-helper/src/getNonce.ts

@@ -0,0 +1,9 @@
+export function getNonce() {
+  let text = "";
+  const possible =
+    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  for (let i = 0; i < 32; i++) {
+    text += possible.charAt(Math.floor(Math.random() * possible.length));
+  }
+  return text;
+}

type-script-helper/src/kanbanHelper.ts

@@ -0,0 +1,9 @@
+import * as vscode from 'vscode';
+import { refreshWebView } from './WebViewPanel';
+import { refreshSidebar } from './ColumnsToCardsWebviewViewProvider';
+
+export function refreshBoth(extensionContext: vscode.ExtensionContext): undefined {
+    refreshSidebar();
+    refreshWebView(extensionContext);
+    setTimeout(() => { vscode.commands.executeCommand("workbench.action.webview.openDeveloperTools"); }, 500);
+}

type-script-helper/src/markdownHelper.ts

@@ -0,0 +1,21 @@
+import * as vscode from 'vscode';
+import { paramCase } from './promiseLinesHelper';
+
+async function newMarkdownFileLogic(): Promise<undefined> {
+    if (vscode.workspace.workspaceFolders === undefined) {
+        vscode.window.showInformationMessage("Open workspace first!");
+        return;
+    }
+    const workspaceFoldersZero = vscode.workspace.workspaceFolders[0].uri;
+    const cardTitle = await vscode.window.showInputBox({ prompt: 'Provide title for card.' });
+    if (cardTitle === undefined)
+        return;
+    const paramCaseCardTitle: string = paramCase(cardTitle);
+    const fileUri: vscode.Uri = vscode.Uri.joinPath(workspaceFoldersZero, `${paramCaseCardTitle}.md`);
+    const buffer: Buffer = Buffer.from(`# ${cardTitle}`, 'utf8');
+    await vscode.workspace.fs.writeFile(fileUri, buffer);
+    const textDocument: vscode.TextDocument = await vscode.workspace.openTextDocument(fileUri);
+    vscode.window.showTextDocument(textDocument);
+}
+
+export const newMarkdownFile = () => newMarkdownFileLogic();

type-script-helper/src/promiseLinesHelper.ts

@@ -177,7 +177,7 @@ function transformToPopperCaseLogic(): undefined {
     return undefined;
 }
 
-function paramCase(str: string) {
+export function paramCase(str: string) {
     return str
         .replace(
             /([A-Z]+(.))/g,

type-script-helper/tsconfig.json

@@ -1,16 +1,18 @@
 {
 	"compilerOptions": {
-		"module": "commonjs",
+		"allowSyntheticDefaultImports": true,
-		"target": "ES2020",
 		"lib": [
 			"ES2020"
 		],
-		"sourceMap": true,
+		"module": "commonjs",
 		"rootDir": "src",
-		"strict": true   /* enable all strict type-checking options */
+		"sourceMap": true,
-		/* Additional Checks */
+		"strict": true,
-		// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
+		"target": "ES2020"
-		// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
+	},
-		// "noUnusedParameters": true,  /* Report errors on unused parameters. */
+	"exclude": [
-	}
+		"node_modules",
+		".vscode-test",
+		"webviews"
+	]
 }

type-script-helper/vsc-extension-quickstart.md

@@ -1,3 +1,11 @@
+---
+type: "note"
+created: "2023-07-07T16:15:27.822Z"
+updated: "2023-07-07T16:15:27.822Z"
+---
+
+# vsc-extension-quickstart
+
 # Welcome to your VS Code Extension
 
 ## What's in the folder

type-script-helper/webviews/components/CardComponent.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+  import type { Card } from "../../src/Card";
+
+  export let key: string;
+  export let card: Card;
+  export let index: number;
+</script>
+
+<!-- svelte-ignore a11y-click-events-have-key-events -->
+<!-- svelte-ignore missing-declaration -->
+<li id={index.toString()}>
+  <!-- svelte-ignore a11y-invalid-attribute -->
+  <a
+    href="#{index.toString()}"
+    title="{key}"
+    on:click={async () => {
+      acquiredVsCodeApi.postMessage({
+        type: "open-card",
+        value: { File: card.File },
+      });
+    }}
+  >
+    {card.H1}
+  </a>
+</li>

type-script-helper/webviews/components/Cards.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import type { Card } from "../../src/Card";
+  import CardComponent from "./CardComponent.svelte";
+
+  export let key: string = "";
+  export let value: Array<Card> = [];
+</script>
+
+{#if !value}
+  <div>loading...</div>
+{:else}
+  <hr>
+  <h1>{key}</h1>
+  <ul>
+    {#each value as card, index}
+      <CardComponent {key} {card} {index} />
+    {/each}
+  </ul>
+{/if}

type-script-helper/webviews/components/ColumnsToCards.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import { onMount } from "svelte";
+  import Cards from "./Cards.svelte";
+  import type { Card } from "../../src/Card";
+  import type { PostMessage } from "../../src/PostMessage";
+
+  let columnsToCards: Record<string, Array<Card>> = {};
+
+  onMount(async () => {
+    window.addEventListener("message", async (event) => {
+      const postMessage: PostMessage = event.data;
+      switch (postMessage.type) {
+        case "columns-to-cards": {
+          columnsToCards = postMessage.value;
+          break;
+        }
+      }
+    });
+    const postMessage: PostMessage = {
+      type: "get-columns-to-cards",
+      value: undefined,
+    };
+    acquiredVsCodeApi.postMessage(postMessage);
+  });
+</script>
+
+{#if Object.entries(columnsToCards).length == 0}
+  <div>loading...</div>
+{:else}
+  {#each Object.entries(columnsToCards) as [key, value], index (key)}
+    <Cards {key} {value} />
+  {/each}
+{/if}

type-script-helper/webviews/components/DisplayDate.svelte

@@ -0,0 +1,4 @@
+<script lang="ts">
+</script>
+
+<h1>2023-09-23-15-20</h1>

type-script-helper/webviews/globals.d.ts

@@ -0,0 +1,10 @@
+import * as _vscode from "vscode";
+import type { PostMessage } from "../types";
+
+declare global {
+  const acquiredVsCodeApi: {
+    postMessage: (PostMessage) => void;
+    getState: () => any;
+    setState: (state: any) => void;
+  };
+}

type-script-helper/webviews/pages/ColumnsToCards.ts

@@ -0,0 +1,7 @@
+import App from "../components/ColumnsToCards.svelte";
+
+const app = new App({
+  target: document.body,
+});
+
+export default app;

type-script-helper/webviews/pages/DisplayDate.ts

@@ -0,0 +1,7 @@
+import App from "../components/DisplayDate.svelte";
+
+const app = new App({
+  target: document.body,
+});
+
+export default app;

type-script-helper/webviews/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "ignoreDeprecations": "5.0",
+    "strict": true
+  },
+  "exclude": [
+    "../node_modules/*"
+  ],
+  "extends": "@tsconfig/svelte/tsconfig.json",
+  "include": [
+    "./**/*"
+  ]
+}