🐛 Fix a bug for npm

panoratech · Feb 2, 2024 · ee210ea · ee210ea
1 parent 59410c1
commit ee210ea
Show file tree

Hide file tree

Showing 9 changed files with 329 additions and 71 deletions.
diff --git a/.changeset/happy-feet-clap.md b/.changeset/happy-feet-clap.md
@@ -0,0 +1,5 @@
+---
+"@panora/integration-card-react": major
+---
+
+fix
diff --git a/apps/embedded-catalog/react/package.json b/apps/embedded-catalog/react/package.json
@@ -9,12 +9,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@panora/shared": "workspace:*",
     "@tanstack/react-query": "^5.12.2",
     "api": "workspace:*",
-    "@panora/shared": "workspace:*",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-loader-spinner": "^5.4.5"
+    "react-loader-spinner": "^5.4.5",
+    "vite-plugin-dts": "^3.7.2"
   },
   "devDependencies": {
     "@types/react": "^18.2.43",
@@ -31,8 +32,14 @@
     "typescript": "^5.2.2",
     "vite": "^5.0.8"
   },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "@tanstack/react-query": "^5.12.2"
+  },
   "main": "./dist/integration-card.umd.js",
   "module": "./dist/integration-card.es.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "import": "./dist/integration-card.es.js",

diff --git a/apps/embedded-catalog/react/tsconfig.json b/apps/embedded-catalog/react/tsconfig.json
@@ -6,23 +6,29 @@
     "module": "ESNext",
     "skipLibCheck": true,
     "paths": {
+      "integration-card": [ "./src/component/index.ts" ],
       "@/*": [
         "./src/*"
       ],
     },
     /* Bundler mode */
-    "moduleResolution": "bundler",
+    "moduleResolution": "Node",
     "allowImportingTsExtensions": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
     "jsx": "react-jsx",
+    "allowSyntheticDefaultImports": true,
 
     /* Linting */
     "strict": true,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
-    "noFallthroughCasesInSwitch": true
+    "noFallthroughCasesInSwitch": true,
+    "typeRoots": [
+      "node_modules/@types",
+      "src/component/index.d.ts"
+    ]
   },
   "include": ["src"],
   "references": [{ "path": "./tsconfig.node.json" }]

diff --git a/apps/embedded-catalog/react/tsconfig.node.json b/apps/embedded-catalog/react/tsconfig.node.json
@@ -3,8 +3,9 @@
     "composite": true,
     "skipLibCheck": true,
     "module": "ESNext",
-    "moduleResolution": "bundler",
+    "moduleResolution": "Node",
+    "resolveJsonModule": true,
     "allowSyntheticDefaultImports": true
   },
-  "include": ["vite.config.ts"]
+  "include": ["vite.config.ts", "package.json"]
 }
diff --git a/apps/embedded-catalog/react/vite.config.ts b/apps/embedded-catalog/react/vite.config.ts
@@ -1,28 +1,31 @@
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react-swc'
 import path from 'path'
+import dts from 'vite-plugin-dts'
+import * as packageJson from './package.json'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [
+    react(), 
+    dts({
+      include: ['src/component/'],
+    })
+  ],
   resolve: {
     alias: {
       '@': path.resolve(__dirname, './src')
     }
   }, 
   build: {
     lib: {
-      entry: path.resolve("", 'src/components/index.ts'),
+      entry: path.resolve("src", 'components/index.ts'),
       name: 'integration-card',
-      fileName: (format) => `integration-card.${format}.ts`
+      formats: ['es', 'umd'],
+      fileName: (format) => `integration-card.${format}.js`
     },
     rollupOptions: {
-      external: ['react', 'react-dom'],
-      output: {
-        globals: {
-          react: 'React'
-        }
-      }
+      external:[...Object.keys(packageJson.peerDependencies)],
     }
   },
 })
diff --git a/apps/magic-link/package.json b/apps/magic-link/package.json
@@ -14,8 +14,7 @@
     "ci": "pnpm run lint && pnpm run build"
   },
   "dependencies": {
-    "@panora/integration-card-react": "workspace:^",
-    "@panora/shared": "workspace:*",
+    "@panora/shared": "^0.0.1",
     "@panora/typescript-sdk": "^1.0.3",
     "@tanstack/react-query": "^5.12.2",
     "api": "workspace:*",

diff --git a/apps/magic-link/src/App.tsx b/apps/magic-link/src/App.tsx
@@ -2,7 +2,6 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import './App.css'
 import ProviderModal from './lib/ProviderModal'
 import { PanoraSDK } from "@panora/typescript-sdk";
-//import { PanoraIntegrationCard } from "@panora/integration-card-react";
 
 function App() {
   const sdk = new PanoraSDK({accessToken: 'YOUR_ACCESS_TOKEN'});
@@ -12,15 +11,10 @@ function App() {
     console.log(result);
   })();
 
-  const queryClient = new QueryClient();
-
   return (
-    <QueryClientProvider client={queryClient}>
       <div className="card">
-        {/*<PanoraIntegrationCard name={"1"} projectId={"1"} returnUrl={"1"} linkedUserIdOrRemoteUserInfo={"1"} />*/}
         <ProviderModal/>
       </div>
-    </QueryClientProvider>
   )
 }
 

diff --git a/apps/magic-link/src/main.tsx b/apps/magic-link/src/main.tsx
@@ -2,9 +2,14 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import App from './App.tsx'
 import './index.css'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+
+const queryClient = new QueryClient();
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
-    <App />
+    <QueryClientProvider client={queryClient}>
+      <App />
+    </QueryClientProvider>
   </React.StrictMode>,
 )