From fffdd8e78f38e34ef32bf1c4e786b91b92db8901 Mon Sep 17 00:00:00 2001
From: Mine Starks <16928427+minestarks@users.noreply.github.com>
Date: Wed, 5 Feb 2025 20:52:24 +0000
Subject: [PATCH] move into qsharp package

---
 build.py                                      | 11 ---
 circuit_vis/package.json                      | 23 ------
 circuit_vis/tsconfig.json                     | 12 ----
 circuit_vis/webpack.config.js                 | 71 -------------------
 compiler/qsc_circuit/src/circuit.rs           |  2 +-
 npm/qsharp/src/browser.ts                     |  2 +
 npm/qsharp/src/compiler/compiler.ts           |  2 +-
 npm/qsharp/src/debug-service/debug-service.ts |  2 +-
 npm/qsharp/src/shared/README.md               |  1 +
 .../src => npm/qsharp/src/shared}/circuit.ts  |  2 +-
 .../src => npm/qsharp/src/shared}/register.ts |  0
 npm/qsharp/ux/circuit-vis/README.md           |  1 +
 npm/qsharp/ux/circuit-vis/circuit.ts          |  7 ++
 .../qsharp/ux/circuit-vis}/constants.ts       |  0
 .../ux/circuit-vis}/formatters/formatUtils.ts |  0
 .../circuit-vis}/formatters/gateFormatter.ts  |  0
 .../circuit-vis}/formatters/inputFormatter.ts |  0
 .../formatters/registerFormatter.ts           |  0
 .../qsharp/ux/circuit-vis}/index.ts           |  0
 .../qsharp/ux/circuit-vis}/metadata.ts        |  0
 .../qsharp/ux/circuit-vis}/process.ts         |  0
 npm/qsharp/ux/circuit-vis/register.ts         |  6 ++
 .../qsharp/ux/circuit-vis}/sqore.ts           |  0
 .../qsharp/ux/circuit-vis}/styles.ts          |  0
 .../qsharp/ux/circuit-vis}/utils.ts           |  0
 npm/qsharp/ux/circuit.tsx                     |  4 +-
 npm/qsharp/ux/data.ts                         |  2 +-
 package-lock.json                             |  8 +--
 package.json                                  |  3 +-
 vscode/src/circuit.ts                         |  2 +-
 30 files changed, 28 insertions(+), 133 deletions(-)
 delete mode 100644 circuit_vis/package.json
 delete mode 100644 circuit_vis/tsconfig.json
 delete mode 100644 circuit_vis/webpack.config.js
 create mode 100644 npm/qsharp/src/shared/README.md
 rename {circuit_vis/src => npm/qsharp/src/shared}/circuit.ts (97%)
 rename {circuit_vis/src => npm/qsharp/src/shared}/register.ts (100%)
 create mode 100644 npm/qsharp/ux/circuit-vis/README.md
 create mode 100644 npm/qsharp/ux/circuit-vis/circuit.ts
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/constants.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/formatters/formatUtils.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/formatters/gateFormatter.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/formatters/inputFormatter.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/formatters/registerFormatter.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/index.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/metadata.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/process.ts (100%)
 create mode 100644 npm/qsharp/ux/circuit-vis/register.ts
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/sqore.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/styles.ts (100%)
 rename {circuit_vis/src => npm/qsharp/ux/circuit-vis}/utils.ts (100%)

diff --git a/build.py b/build.py
index aefa575b6b..408ab39766 100755
--- a/build.py
+++ b/build.py
@@ -117,7 +117,6 @@
 wasm_bld = os.path.join(root_dir, "target", "wasm32", build_type)
 samples_src = os.path.join(root_dir, "samples")
 npm_src = os.path.join(root_dir, "npm", "qsharp")
-circuit_vis_src = os.path.join(root_dir, "circuit_vis")
 play_src = os.path.join(root_dir, "playground")
 pip_src = os.path.join(root_dir, "pip")
 widgets_src = os.path.join(root_dir, "widgets")
@@ -399,16 +398,6 @@ def run_ci_historic_benchmark():
     )
     step_end()
 
-if build_npm:
-    step_start("Building the circuit_vis package")
-
-    npm_args = [npm_cmd, "install"]
-    subprocess.run(npm_args, check=True, text=True, cwd=circuit_vis_src)
-
-    npm_args = [npm_cmd, "run", "build:prod"]
-    subprocess.run(npm_args, check=True, text=True, cwd=circuit_vis_src)
-    step_end()
-
 if build_npm:
     step_start("Building the npm package")
     # Copy the wasm build files over for web and node targets
diff --git a/circuit_vis/package.json b/circuit_vis/package.json
deleted file mode 100644
index 1a545134a5..0000000000
--- a/circuit_vis/package.json
+++ /dev/null
@@ -1,23 +0,0 @@
-{
-  "name": "@microsoft/quantum-viz.js",
-  "version": "1.0.6",
-  "description": "quantum-viz.js is a configurable tool for visualizing quantum circuits.",
-  "main": "dist/qviz.min.js",
-  "scripts": {
-    "build": "tsc",
-    "build:prod": "tsc && webpack",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "prepublishOnly": "npm run lint && npm run test && npm run build:prod",
-    "start": "tsc -w"
-  },
-  "files": [
-    "README.md",
-    "LICENSE.txt",
-    "lib",
-    "dist"
-  ],
-  "author": "Microsoft Quantum",
-  "license": "MIT",
-  "homepage": "https://github.com/microsoft/quantum-viz.js#readme"
-}
diff --git a/circuit_vis/tsconfig.json b/circuit_vis/tsconfig.json
deleted file mode 100644
index 85efcd2f95..0000000000
--- a/circuit_vis/tsconfig.json
+++ /dev/null
@@ -1,12 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "commonjs",
-    "lib": ["DOM", "ES2019"],
-    "declaration": true,
-    "strict": true,
-    "outDir": "lib",
-    "skipLibCheck": true
-  },
-  "include": ["src/**/*"]
-}
diff --git a/circuit_vis/webpack.config.js b/circuit_vis/webpack.config.js
deleted file mode 100644
index fafaa93ab8..0000000000
--- a/circuit_vis/webpack.config.js
+++ /dev/null
@@ -1,71 +0,0 @@
-const path = require("path");
-const TerserPlugin = require("terser-webpack-plugin");
-
-const PATHS = {
-  entryPoint: path.resolve(__dirname, "src/index.ts"),
-  bundles: path.resolve(__dirname, "dist"),
-};
-
-const config = {
-  // Enables production mode built-in optimizations
-  mode: "production",
-  // These are the entry point of our library. We tell webpack to use
-  // the name we assign later, when creating the bundle. We also use
-  // the name to filter the second entry point for applying code
-  // minification via UglifyJS
-  entry: {
-    qviz: [PATHS.entryPoint],
-    "qviz.min": [PATHS.entryPoint],
-  },
-  // The output defines how and where we want the bundles. The special
-  // value `[name]` in `filename` tell Webpack to use the name we defined above.
-  // The bundled script will be available as a global variable `qviz`.
-  output: {
-    path: PATHS.bundles,
-    filename: "[name].js",
-    library: "qviz",
-    libraryTarget: "umd",
-  },
-  // Add resolve for `tsx` and `ts` files, otherwise Webpack would
-  // only look for common JavaScript file extension (.js)
-  resolve: {
-    extensions: [".ts", ".tsx", ".js"],
-  },
-  // Activate source maps for the bundles in order to preserve the original
-  // source when the user debugs the application
-  devtool: "source-map",
-  optimization: {
-    // Apply minification only on the second bundle by
-    // using a RegEx on the name, which must end with `.min.js`
-    minimize: true,
-    minimizer: [
-      new TerserPlugin({
-        // sourceMap: true,
-        include: /\.min\.js$/,
-      }),
-    ],
-  },
-  module: {
-    // Webpack doesn't understand TypeScript files and a loader is needed.
-    // `node_modules` folder is excluded in order to prevent problems with
-    // the library dependencies, as well as `__tests__` folders that
-    // contain the tests for the library
-    rules: [
-      {
-        test: /\.tsx?$/,
-        exclude: /node_modules/,
-        use: [
-          {
-            loader: "ts-loader",
-            options: {
-              // Speeds up compilation and does not build *.d.ts files
-              transpileOnly: true,
-            },
-          },
-        ],
-      },
-    ],
-  },
-};
-
-module.exports = config;
diff --git a/compiler/qsc_circuit/src/circuit.rs b/compiler/qsc_circuit/src/circuit.rs
index 508845f3e0..9b770879ad 100644
--- a/compiler/qsc_circuit/src/circuit.rs
+++ b/compiler/qsc_circuit/src/circuit.rs
@@ -9,7 +9,7 @@ use serde::Serialize;
 use std::{fmt::Display, fmt::Write, ops::Not, vec};
 
 /// Representation of a quantum circuit.
-/// Implementation of <https://github.com/microsoft/quantum-viz.js/wiki/API-schema-reference>
+/// Implementation of `Circuit` type at npm/qsharp/shared/circuit.ts
 #[derive(Clone, Serialize, Default, Debug, PartialEq)]
 pub struct Circuit {
     pub operations: Vec<Operation>,
diff --git a/npm/qsharp/src/browser.ts b/npm/qsharp/src/browser.ts
index 607b0116df..c49647e001 100644
--- a/npm/qsharp/src/browser.ts
+++ b/npm/qsharp/src/browser.ts
@@ -191,3 +191,5 @@ export type {
 };
 
 export * as utils from "./utils.js";
+
+export type { Circuit as CircuitData } from "./shared/circuit.js";
diff --git a/npm/qsharp/src/compiler/compiler.ts b/npm/qsharp/src/compiler/compiler.ts
index 453984c7b1..4558911523 100644
--- a/npm/qsharp/src/compiler/compiler.ts
+++ b/npm/qsharp/src/compiler/compiler.ts
@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import { type Circuit as CircuitData } from "@microsoft/quantum-viz.js/lib/circuit.js";
+import { type Circuit as CircuitData } from "../shared/circuit.js";
 import {
   IDocFile,
   IOperationInfo,
diff --git a/npm/qsharp/src/debug-service/debug-service.ts b/npm/qsharp/src/debug-service/debug-service.ts
index 151d7132e0..b5ed11c1bb 100644
--- a/npm/qsharp/src/debug-service/debug-service.ts
+++ b/npm/qsharp/src/debug-service/debug-service.ts
@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import { type Circuit as CircuitData } from "@microsoft/quantum-viz.js/lib/circuit.js";
+import { type Circuit as CircuitData } from "../shared/circuit.js";
 import type {
   DebugService,
   IBreakpointSpan,
diff --git a/npm/qsharp/src/shared/README.md b/npm/qsharp/src/shared/README.md
new file mode 100644
index 0000000000..8a8ce516f4
--- /dev/null
+++ b/npm/qsharp/src/shared/README.md
@@ -0,0 +1 @@
+This directory contains shared modules to be referenced from both `src/` and `ux/`.
diff --git a/circuit_vis/src/circuit.ts b/npm/qsharp/src/shared/circuit.ts
similarity index 97%
rename from circuit_vis/src/circuit.ts
rename to npm/qsharp/src/shared/circuit.ts
index 584069a785..6b31e1926b 100644
--- a/circuit_vis/src/circuit.ts
+++ b/npm/qsharp/src/shared/circuit.ts
@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 
-import { Register } from "./register";
+import { Register } from "./register.js";
 
 /**
  * Circuit to be visualized.
diff --git a/circuit_vis/src/register.ts b/npm/qsharp/src/shared/register.ts
similarity index 100%
rename from circuit_vis/src/register.ts
rename to npm/qsharp/src/shared/register.ts
diff --git a/npm/qsharp/ux/circuit-vis/README.md b/npm/qsharp/ux/circuit-vis/README.md
new file mode 100644
index 0000000000..0a33f95dc0
--- /dev/null
+++ b/npm/qsharp/ux/circuit-vis/README.md
@@ -0,0 +1 @@
+The code in this folder was copied and adapted from `https://github.com/microsoft/quantum-viz.js`.
diff --git a/npm/qsharp/ux/circuit-vis/circuit.ts b/npm/qsharp/ux/circuit-vis/circuit.ts
new file mode 100644
index 0000000000..311a628bb8
--- /dev/null
+++ b/npm/qsharp/ux/circuit-vis/circuit.ts
@@ -0,0 +1,7 @@
+export {
+  ConditionalRender,
+  type Circuit,
+  type DataAttributes,
+  type Operation,
+  type Qubit,
+} from "../../src/shared/circuit";
diff --git a/circuit_vis/src/constants.ts b/npm/qsharp/ux/circuit-vis/constants.ts
similarity index 100%
rename from circuit_vis/src/constants.ts
rename to npm/qsharp/ux/circuit-vis/constants.ts
diff --git a/circuit_vis/src/formatters/formatUtils.ts b/npm/qsharp/ux/circuit-vis/formatters/formatUtils.ts
similarity index 100%
rename from circuit_vis/src/formatters/formatUtils.ts
rename to npm/qsharp/ux/circuit-vis/formatters/formatUtils.ts
diff --git a/circuit_vis/src/formatters/gateFormatter.ts b/npm/qsharp/ux/circuit-vis/formatters/gateFormatter.ts
similarity index 100%
rename from circuit_vis/src/formatters/gateFormatter.ts
rename to npm/qsharp/ux/circuit-vis/formatters/gateFormatter.ts
diff --git a/circuit_vis/src/formatters/inputFormatter.ts b/npm/qsharp/ux/circuit-vis/formatters/inputFormatter.ts
similarity index 100%
rename from circuit_vis/src/formatters/inputFormatter.ts
rename to npm/qsharp/ux/circuit-vis/formatters/inputFormatter.ts
diff --git a/circuit_vis/src/formatters/registerFormatter.ts b/npm/qsharp/ux/circuit-vis/formatters/registerFormatter.ts
similarity index 100%
rename from circuit_vis/src/formatters/registerFormatter.ts
rename to npm/qsharp/ux/circuit-vis/formatters/registerFormatter.ts
diff --git a/circuit_vis/src/index.ts b/npm/qsharp/ux/circuit-vis/index.ts
similarity index 100%
rename from circuit_vis/src/index.ts
rename to npm/qsharp/ux/circuit-vis/index.ts
diff --git a/circuit_vis/src/metadata.ts b/npm/qsharp/ux/circuit-vis/metadata.ts
similarity index 100%
rename from circuit_vis/src/metadata.ts
rename to npm/qsharp/ux/circuit-vis/metadata.ts
diff --git a/circuit_vis/src/process.ts b/npm/qsharp/ux/circuit-vis/process.ts
similarity index 100%
rename from circuit_vis/src/process.ts
rename to npm/qsharp/ux/circuit-vis/process.ts
diff --git a/npm/qsharp/ux/circuit-vis/register.ts b/npm/qsharp/ux/circuit-vis/register.ts
new file mode 100644
index 0000000000..0348d87115
--- /dev/null
+++ b/npm/qsharp/ux/circuit-vis/register.ts
@@ -0,0 +1,6 @@
+export {
+  RegisterType,
+  type Register,
+  type RegisterMap,
+  type RegisterMetadata,
+} from "../../src/shared/register";
diff --git a/circuit_vis/src/sqore.ts b/npm/qsharp/ux/circuit-vis/sqore.ts
similarity index 100%
rename from circuit_vis/src/sqore.ts
rename to npm/qsharp/ux/circuit-vis/sqore.ts
diff --git a/circuit_vis/src/styles.ts b/npm/qsharp/ux/circuit-vis/styles.ts
similarity index 100%
rename from circuit_vis/src/styles.ts
rename to npm/qsharp/ux/circuit-vis/styles.ts
diff --git a/circuit_vis/src/utils.ts b/npm/qsharp/ux/circuit-vis/utils.ts
similarity index 100%
rename from circuit_vis/src/utils.ts
rename to npm/qsharp/ux/circuit-vis/utils.ts
diff --git a/npm/qsharp/ux/circuit.tsx b/npm/qsharp/ux/circuit.tsx
index 6b5e0861f4..a4bab823d1 100644
--- a/npm/qsharp/ux/circuit.tsx
+++ b/npm/qsharp/ux/circuit.tsx
@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import * as qviz from "@microsoft/quantum-viz.js/lib";
+import * as qviz from "./circuit-vis";
 import { useEffect, useRef, useState } from "preact/hooks";
 import { CircuitProps } from "./data.js";
 import { Spinner } from "./spinner.js";
@@ -131,7 +131,7 @@ function ZoomableCircuit(props: { circuit: qviz.Circuit }) {
   function renderCircuit(circuit: qviz.Circuit, container: HTMLDivElement) {
     qviz.draw(circuit, container);
 
-    // quantum-viz hardcodes the styles in the SVG.
+    // circuit-vis hardcodes the styles in the SVG.
     // Remove the style elements -- we'll define the styles in our own CSS.
     const styleElements = container.querySelectorAll("style");
     styleElements?.forEach((tag) => tag.remove());
diff --git a/npm/qsharp/ux/data.ts b/npm/qsharp/ux/data.ts
index 72a3ab4be4..8f4c9f33a5 100644
--- a/npm/qsharp/ux/data.ts
+++ b/npm/qsharp/ux/data.ts
@@ -75,4 +75,4 @@ export type CircuitProps = {
   calculating: boolean;
 };
 
-export type CircuitData = import("@microsoft/quantum-viz.js/lib").Circuit;
+export type CircuitData = import("../src/shared/circuit").Circuit;
diff --git a/package-lock.json b/package-lock.json
index 5694efcf3a..24e7cceab8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,8 +9,7 @@
       "workspaces": [
         "./npm/qsharp",
         "./playground",
-        "./vscode",
-        "./circuit_vis"
+        "./vscode"
       ],
       "devDependencies": {
         "@anywidget/types": "^0.1.4",
@@ -57,6 +56,7 @@
     "circuit_vis": {
       "name": "@microsoft/quantum-viz.js",
       "version": "1.0.6",
+      "extraneous": true,
       "license": "MIT"
     },
     "node_modules/@aashutoshrathi/word-wrap": {
@@ -1527,10 +1527,6 @@
       "integrity": "sha512-gNw9z9LbqLV+WadZ6/MMrWwO3e0LuoUH1wve/1iPsBNbgqeVCiB0EZFNNj2lysxS2gkqoF9hmyVaG3MoM1BkxA==",
       "dev": true
     },
-    "node_modules/@microsoft/quantum-viz.js": {
-      "resolved": "circuit_vis",
-      "link": true
-    },
     "node_modules/@nevware21/ts-async": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/@nevware21/ts-async/-/ts-async-0.5.0.tgz",
diff --git a/package.json b/package.json
index 778066cd41..ffd2aac927 100644
--- a/package.json
+++ b/package.json
@@ -3,8 +3,7 @@
   "workspaces": [
     "./npm/qsharp",
     "./playground",
-    "./vscode",
-    "./circuit_vis"
+    "./vscode"
   ],
   "license": "MIT",
   "engines": {
diff --git a/vscode/src/circuit.ts b/vscode/src/circuit.ts
index c26e3250be..87d3086dd2 100644
--- a/vscode/src/circuit.ts
+++ b/vscode/src/circuit.ts
@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import { type Circuit as CircuitData } from "@microsoft/quantum-viz.js/lib";
+import type { CircuitData } from "qsharp-lang";
 import { escapeHtml } from "markdown-it/lib/common/utils.mjs";
 import {
   ICompilerWorker,