Export App from optuna_dashboard as pkg successfully

optuna_dashboard/package-lock.json

@@ -1,11 +1,11 @@
 {
-  "name": "optuna-dashboard",
+  "name": "@optuna/optuna-dashboard",
   "version": "0.0.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "optuna-dashboard",
+      "name": "@optuna/optuna-dashboard",
       "version": "0.0.1",
       "license": "MIT",
       "dependencies": {

optuna_dashboard/package.json

@@ -3,8 +3,8 @@
   "private": true,
   "version": "0.0.1",
   "description": "Dashboard for Optuna",
-  "main": "pkg/components/App.js",
-  "types": "types/components/App.d.ts",
+  "main": "pkg/pkg_index.js",
+  "types": "types/pkg_index.d.ts",
   "scripts": {
     "watch": "NODE_ENV=development TYPESCRIPT_LOADER=esbuild-loader webpack --watch",
     "build": "webpack",

optuna_dashboard/ts/components/App.tsx

@@ -28,20 +28,6 @@ const queryClient = new QueryClient({
   },
 })
 
-const URL_PREFIX = "/dashboard"
-
-export const Ex: FC = () => {
-  const [ex, setEx] = useState<string>("loading...")
-
-  useEffect(() => {
-    setTimeout(() => {
-      setEx("Hello, World!")
-    }, 1000)
-  }, [])
-
-  return <div>{ex}</div>
-}
-
 export const App: FC = () => {
   const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)")
   const [colorMode, setColorMode] = useState<"light" | "dark">("light")

optuna_dashboard/ts/pkg_index.tsx

@@ -0,0 +1,5 @@
+import { APIClientProvider } from "./apiClientProvider"
+import { AxiosClient } from "./axiosClient"
+import { App } from "./components/App"
+
+export { AxiosClient, APIClientProvider, App}

optuna_dashboard/tsconfig.pkg.json

@@ -1,24 +1,31 @@
-{ 
+{
   "compilerOptions": {
     "isolatedModules": true,
     "skipLibCheck": true,
-    "strictNullChecks": true,
-    "moduleResolution": "Node",
+    "baseUrl": ".",
+    "moduleResolution": "node",
     "noImplicitThis": true,
     "alwaysStrict": true,
-    "noImplicitAny": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "esModuleInterop": true,
     "rootDir": "./ts",
     "outDir": "./pkg",
+    "paths": {
+      "plotly.js-dist-min": ["node_modules/@types/plotly.js"]
+    },
+    "lib": ["dom", "esnext"],
+    "module": "esnext",
+    "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "target": "ES2020",
+    "target": "es6",
+    "jsx": "react",
     "sourceMap": true,
+    "strict": true,
     "declaration": true,
     "declarationDir": "./types",
-    "strict": true,
-    "jsx": "react-jsx"
   },
-  "include": ["ts/components/App.tsx"],
+  "files": [
+    "./ts/pkg_index.tsx",
+  ],
+  "include": [
+    "./ts/types/**/*",
+  ],
 }