feat: clean up bundle, update json-schema-viewer

kickstartDS · Sep 27, 2023 · 18c75aa · 18c75aa
1 parent c7dd0c0
commit 18c75aa
Show file tree

Hide file tree

Showing 16 changed files with 3,105 additions and 4,707 deletions.
diff --git a/.babelrc.js b/.babelrc.js
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
@@ -1,17 +1,12 @@
-import { actions } from "@storybook/addon-actions";
 import { Preview } from '@storybook/react';
-import { unpackDecorator } from "@kickstartds/core/lib/storybook/helpers";
+import { unpackDecorator } from "@kickstartds/core/lib/storybook";
 
 import "@kickstartds/core/lib/design-tokens/tokens.css";
 import "@kickstartds/base/lib/global/base.js";
 import "@kickstartds/base/lib/global/base.css";
 
-const myActions = actions("radio");
-window._ks.radio.on("*", myActions.radio);
-
 const preview: Preview = {
   parameters: {
-    actions: { argTypesRegex: "^on[A-Z].*" },
     controls: {
       matchers: {
         color: /(background|color)$/i,

diff --git a/bundle.js b/bundle.js
@@ -0,0 +1,31 @@
+const esbuild = require("esbuild");
+const { nodeExternalsPlugin } = require("esbuild-node-externals");
+
+/** @type import("esbuild").BuildOptions */
+const sharedConfig = {
+  entryPoints: ["src/index.ts", "src/preset/manager.ts"],
+  bundle: true,
+  platform: "browser",
+  format: "esm",
+  outdir: "dist/esm",
+  plugins: [
+    nodeExternalsPlugin({
+      dependencies: true,
+      devDependencies: false,
+      peerDependencies: true,
+    }),
+  ],
+  logLevel: "info",
+};
+
+esbuild.build({
+  ...sharedConfig,
+  format: "esm",
+  outdir: "dist/esm",
+  splitting: true,
+});
+esbuild.build({
+  ...sharedConfig,
+  format: "cjs",
+  outdir: "dist/cjs",
+});
diff --git a/package.json b/package.json
@@ -19,78 +19,64 @@
   "module": "dist/esm/index.js",
   "types": "dist/ts/index.d.ts",
   "files": [
-    "dist/**/*",
-    "README.md",
-    "*.js",
-    "*.d.ts"
+    "dist"
   ],
   "scripts": {
     "clean": "rimraf ./dist",
-    "buildBabel": "concurrently \"yarn buildBabel:cjs\" \"yarn buildBabel:esm\"",
-    "buildBabel:cjs": "babel ./src -d ./dist/cjs --extensions \".js,.jsx,.ts,.tsx\"",
-    "buildBabel:esm": "babel ./src -d ./dist/esm --env-name esm --extensions \".js,.jsx,.ts,.tsx\"",
+    "buildJs": "node bundle.js",
     "buildTsc": "tsc --declaration --emitDeclarationOnly --outDir ./dist/ts",
     "prebuild": "yarn clean",
-    "prepare": "cp node_modules/@kickstartds/core/lib/storybook/helpers.js src/helpers.js",
-    "build": "concurrently \"yarn buildBabel\" \"yarn buildTsc\"",
-    "build:watch": "concurrently \"yarn buildBabel:esm --watch\" \"yarn buildTsc --watch\"",
+    "prepare": "patch-package",
+    "build": "yarn buildJs && yarn buildTsc",
     "test": "echo \"Error: no test specified\" && exit 1",
     "storybook": "storybook dev -p 6006",
-    "start": "concurrently \"yarn build:watch\" \"yarn storybook\"",
+    "start": "yarn build && yarn storybook",
     "build-storybook": "storybook build",
-    "prerelease": "zx scripts/prepublish-checks.mjs",
-    "release": "yarn build && auto shipit",
-    "eject-ts": "zx scripts/eject-typescript.mjs"
+    "release": "yarn build && auto shipit"
+  },
+  "dependencies": {
+    "@kickstartds/json-schema-viewer": "^1.2.0-0",
+    "@monaco-editor/react": "^4.5.1",
+    "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0",
+    "styled-components": "^3.2.6"
   },
   "devDependencies": {
-    "@babel/cli": "^7.21.0",
-    "@babel/core": "^7.21.4",
-    "@babel/preset-env": "^7.21.4",
-    "@babel/preset-react": "^7.18.6",
-    "@babel/preset-typescript": "^7.21.4",
-    "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
-    "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
-    "@kickstartds/base": "^2.0.3",
-    "@kickstartds/content": "^2.0.0",
-    "@kickstartds/core": "^2.0.3",
-    "@storybook/addon-essentials": "^7.0.5",
-    "@storybook/builder-vite": "^7.0.5",
-    "@storybook/react": "^7.0.5",
-    "@storybook/react-vite": "^7.0.5",
-    "@types/decomment": "^0.9.2",
-    "@types/js-yaml": "^4.0.5",
-    "@types/json-schema": "^7.0.11",
-    "@types/react-copy-to-clipboard": "^5.0.4",
-    "@types/react-dom": "^18.0.11",
+    "@kickstartds/base": "^2.2.0",
+    "@kickstartds/content": "^2.1.0",
+    "@kickstartds/core": "^2.2.0",
+    "@storybook/addon-essentials": "^7.4.0",
+    "@storybook/builder-vite": "^7.4.0",
+    "@storybook/components": "^7.4.0",
+    "@storybook/manager-api": "^7.4.0",
+    "@storybook/react": "^7.4.0",
+    "@storybook/react-vite": "^7.4.0",
+    "@types/decomment": "^0.9.3",
+    "@types/json-schema": "^7.0.13",
+    "@types/react-dom": "^18.2.8",
     "@types/react-router-dom": "^5.3.3",
-    "@types/styled-components": "^5.1.26",
-    "@vitejs/plugin-react": "^3.1.0",
-    "add": "^2.0.6",
-    "auto": "^10.44.0",
-    "babel-loader": "^9.1.2",
-    "boxen": "^7.0.2",
-    "concurrently": "^8.0.1",
-    "dedent": "^0.7.0",
-    "prettier": "^2.8.7",
-    "prop-types": "^15.8.1",
+    "@types/styled-components": "^3.0.6",
+    "@vitejs/plugin-react": "^4.1.0",
+    "auto": "^11.0.4",
+    "decomment": "^0.9.5",
+    "esbuild": "^0.19.3",
+    "esbuild-node-externals": "^1.9.0",
+    "patch-package": "^8.0.0",
+    "prettier": "^3.0.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "rimraf": "^5.0.0",
-    "rollup-plugin-node-polyfills": "^0.2.1",
-    "rollup-plugin-polyfill-node": "^0.12.0",
-    "storybook": "^7.0.5",
-    "typescript": "^4.9.4",
-    "vite": "^4.2.1",
-    "yarn": "^1.22.19",
-    "zx": "^7.2.1"
+    "rimraf": "^5.0.5",
+    "storybook": "^7.4.0",
+    "typescript": "^5.2.2",
+    "vite": "^4.4.9"
   },
   "peerDependencies": {
-    "@storybook/api": "^7.0.5",
-    "@storybook/components": "^7.0.5",
-    "@storybook/core-events": "^7.0.5",
-    "@storybook/manager-api": "^7.0.5",
-    "@storybook/preview-api": "^7.0.5",
-    "@storybook/theming": "^7.0.5",
+    "@storybook/api": "^7.0.0",
+    "@storybook/components": "^7.0.0",
+    "@storybook/core-events": "^7.0.0",
+    "@storybook/manager-api": "^7.0.0",
+    "@storybook/preview-api": "^7.0.0",
+    "@storybook/theming": "^7.0.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.2.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.2.0"
   },
@@ -103,7 +89,8 @@
     }
   },
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
   },
   "storybook": {
     "displayName": "JSON Schema",
@@ -113,14 +100,5 @@
       "angular"
     ],
     "icon": "https://opencollective-production.s3.us-west-1.amazonaws.com/1e445ca0-fca9-11e9-a830-c36c137aded5.png"
-  },
-  "dependencies": {
-    "@kickstartds/json-schema-viewer": "^1.1.0",
-    "@monaco-editor/react": "^4.5.0",
-    "crypto-browserify": "^3.12.0",
-    "decomment": "^0.9.5",
-    "react-router": "^5.3.4",
-    "react-router-dom": "^5.3.4",
-    "styled-components": "^5.3.9"
   }
 }
diff --git a/patches/decomment+0.9.5.patch b/patches/decomment+0.9.5.patch
@@ -0,0 +1,26 @@
+diff --git a/node_modules/decomment/lib/utils.js b/node_modules/decomment/lib/utils.js
+index bca12da..b9daf81 100644
+--- a/node_modules/decomment/lib/utils.js
++++ b/node_modules/decomment/lib/utils.js
+@@ -1,7 +1,7 @@
+ 'use strict';
+
+ const esprima = require('esprima');
+-const os = require('os');
++// const os = require('os');
+
+ ////////////////////////////////////////////////////
+ // Automatically calculates and returns End of Line,
+@@ -20,9 +20,9 @@ function getEOL(text) {
+         }
+         idx++;
+     }
+-    if (unix === windows) {
+-        return os.EOL;
+-    }
++    // if (unix === windows) {
++    //     return os.EOL;
++    // }
+     return unix > windows ? '\n' : '\r\n';
+ }
+
diff --git a/scripts/eject-typescript.mjs b/scripts/eject-typescript.mjs
diff --git a/scripts/prepublish-checks.mjs b/scripts/prepublish-checks.mjs
diff --git a/src/Panel.tsx b/src/Panel.tsx
@@ -9,23 +9,18 @@ interface PanelProps {
 }
 
 const PanelContainer = styled.div`
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 0;
-
   > div {
     height: 100%;
   }
 `;
 
-export const Panel: React.FC<PanelProps> = (props) => (
-  <PanelContainer hidden={!props.active}>
-    <AddonPanel {...props}>
-      <MemoryRouter initialEntries={["/base"]}>
-        <SchemaView />
-      </MemoryRouter>
-    </AddonPanel>
-  </PanelContainer>
-);
+export const Panel: React.FC<PanelProps> = (props) =>
+  props.active ? (
+    <PanelContainer>
+      <AddonPanel {...props}>
+        <MemoryRouter initialEntries={["/base"]}>
+          <SchemaView />
+        </MemoryRouter>
+      </AddonPanel>
+    </PanelContainer>
+  ) : null;
diff --git a/src/components/SchemaDoc.tsx b/src/components/SchemaDoc.tsx
@@ -107,6 +107,8 @@ export const SchemaDoc: React.FC<SchemaDocProps> = ({ schema }) => {
     lookup,
     schema: currentSchema,
     stage: "both",
+    onSelectValidationRange(range) {},
+    validationResults: [],
   };
 
   return <SchemaExplorer {...explorerArgs} />;

diff --git a/src/components/SchemaEditor.tsx b/src/components/SchemaEditor.tsx
@@ -6,7 +6,7 @@ import Editor, {
   OnChange,
 } from "@monaco-editor/react";
 import { JsonSchema } from "@kickstartds/json-schema-viewer";
-import { pack, unpack } from "../helpers.js";
+import { pack, unpack } from "@kickstartds/core/lib/storybook";
 import { useArgs } from "@storybook/manager-api";
 import decomment from "decomment";
 
@@ -61,7 +61,6 @@ export const SchemaEditor: React.FC<SchemaEditorProps> = ({ schema }) => {
 
   return (
     <Editor
-      height="97vh"
       defaultLanguage="json"
       value={editorPreamble + "\n" + JSON.stringify(initialContent, null, 2)}
       path="a://b/example.json"

diff --git a/src/helpers.d.ts b/src/helpers.d.ts
diff --git a/src/helpers.js b/src/helpers.js