From 2794a9dde51893dd03072ac0dbbd5b2930c58e24 Mon Sep 17 00:00:00 2001 From: yunji Date: Fri, 15 Nov 2024 13:10:01 +0800 Subject: [PATCH] chore: front end project --- bindings/streamlit-gpt-vis/MANIFEST.in | 2 +- bindings/streamlit-gpt-vis/README.md | 19 ++- bindings/streamlit-gpt-vis/example/basic.py | 8 +- .../streamlit_gpt_vis/__init__.py | 6 +- .../streamlit_gpt_vis/frontend/.gitignore | 24 ++++ .../streamlit_gpt_vis/frontend/.prettierrc | 5 - .../streamlit_gpt_vis/frontend/README.md | 50 +++++++ .../frontend/eslint.config.js | 25 ++++ .../streamlit_gpt_vis/frontend/index.html | 16 +++ .../streamlit_gpt_vis/frontend/package.json | 54 ++++---- .../frontend/public/index.html | 25 ---- .../frontend/src/MyComponent.tsx | 130 +++++++----------- .../streamlit_gpt_vis/frontend/src/Render.tsx | 59 -------- .../streamlit_gpt_vis/frontend/src/index.css | 0 .../streamlit_gpt_vis/frontend/src/index.tsx | 11 -- .../streamlit_gpt_vis/frontend/src/main.tsx | 13 ++ .../frontend/src/react-app-env.d.ts | 1 - .../frontend/src/vite-env.d.ts | 1 + .../frontend/tsconfig.app.json | 26 ++++ .../streamlit_gpt_vis/frontend/tsconfig.json | 19 +-- .../frontend/tsconfig.node.json | 24 ++++ .../streamlit_gpt_vis/frontend/vite.config.ts | 15 ++ 22 files changed, 295 insertions(+), 238 deletions(-) create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.gitignore delete mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.prettierrc create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/README.md create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/eslint.config.js create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/index.html delete mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/public/index.html delete mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/Render.tsx create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.css delete mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.tsx create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/main.tsx delete mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/react-app-env.d.ts create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/vite-env.d.ts create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.app.json create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.node.json create mode 100644 bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/vite.config.ts diff --git a/bindings/streamlit-gpt-vis/MANIFEST.in b/bindings/streamlit-gpt-vis/MANIFEST.in index 1719d91..d083bf3 100644 --- a/bindings/streamlit-gpt-vis/MANIFEST.in +++ b/bindings/streamlit-gpt-vis/MANIFEST.in @@ -1 +1 @@ -recursive-include streamlit_gpt_vis/frontend/build * +recursive-include streamlit_gpt_vis/frontend/dist * diff --git a/bindings/streamlit-gpt-vis/README.md b/bindings/streamlit-gpt-vis/README.md index 8be3fe6..327b06b 100644 --- a/bindings/streamlit-gpt-vis/README.md +++ b/bindings/streamlit-gpt-vis/README.md @@ -1,14 +1,16 @@ # streamlit-gpt-vis -Components for GPTs, generative AI, and LLM projects. Not only UI Components. +[![Latest Stable Version](https://img.shields.io/pypi/v/streamlit-gpt-vis.svg)](https://pypi.python.org/pypi/streamlit-gpt-vis) [![Pypi Download](https://img.shields.io/pypi/dm/streamlit-gpt-vis)](https://pypi.python.org/pypi/streamlit-gpt-vis) -## Installation instructions +Streamlit binding for [`@AntV/GPT-Vis`](https://github.com/antvis/GPT-Vis) Components for GPTs, generative AI, and LLM projects. Not only UI Components. + +## Installation ```sh pip install streamlit-gpt-vis ``` -## Usage instructions +## Usage ```python import streamlit as st @@ -27,3 +29,14 @@ Here’s a visualization of Haidilao's food delivery revenue from 2013 to 2022. gpt_vis_renderer(content, config=None) ``` + +## API + +### gpt_vis_renderer(content: str, config: dict = None) + +- content： Markdown content +- config: GPT-Vis [ConfigProvider](https://github.com/antvis/GPT-Vis/blob/main/src/ConfigProvider/index.md) config + +## License + +[MIT](./LICENSE) diff --git a/bindings/streamlit-gpt-vis/example/basic.py b/bindings/streamlit-gpt-vis/example/basic.py index 8b8bc2f..b5d2642 100644 --- a/bindings/streamlit-gpt-vis/example/basic.py +++ b/bindings/streamlit-gpt-vis/example/basic.py @@ -16,7 +16,11 @@ ```vis-chart { "type": "line","data": [{"time":2013,"value":59.3},{"time":2014,"value":64.4},{"time":2015,"value":68.9},{"time":2016,"value":74.4},{"time":2017,"value":82.7},{"time":2018,"value":91.9},{"time":2019,"value":99.1},{"time":2020,"value":101.6},{"time":2021,"value":114.4},{"time":2022,"value":121}] } -``` +``` + +```vis-chart +{ "type":"network-graph","data":{"nodes":[{"name":"哈利·波特"},{"name":"赫敏·格兰杰"},{"name":"罗恩·韦斯莱"},{"name":"伏地魔"}],"edges":[{"source":"哈利·波特","target":"赫敏·格兰杰","name":"朋友"},{"source":"哈利·波特","target":"罗恩·韦斯莱","name":"朋友"},{"source":"哈利·波特","target":"伏地魔","name":"敌人"},{"source":"伏地魔","target":"哈利·波特","name":"试图杀死"}]} } +``` ''') st.markdown("---") @@ -40,6 +44,6 @@ # it is considered a new instance and will be re-mounted on the frontend # and lose its current state. In this case, we want to vary the component's # "content" argument without having it get recreated. -content_input = st.text_input("Enter render content", value="# GPT-VIS \n\nComponents for GPTs, generative AI, and LLM projects. Not only UI Components.") +content_input = st.text_input("Enter render content", value="#### GPT-VIS \n\n Components for GPTs, generative AI, and LLM projects. Not only UI Components.") gpt_vis_renderer(content_input, config={'plot': { 'theme': { 'type': 'academy' }}}) diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/__init__.py b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/__init__.py index 06ac0ac..37c3fcc 100644 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/__init__.py +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/__init__.py @@ -5,7 +5,7 @@ # the component, and True when we're ready to package and distribute it. # (This is, of course, optional - there are innumerable ways to manage your # release process.) -_RELEASE = False +_RELEASE = True # Declare a Streamlit component. `declare_component` returns a function # that is used to create instances of the component. We're naming this @@ -27,14 +27,14 @@ # Pass `url` here to tell Streamlit that the component will be served # by the local dev server that you run via `npm run start`. # (This is useful while your component is in development.) - url="http://localhost:3001", + url="http://localhost:5173", ) else: # When we're distributing a production version of the component, we'll # replace the `url` param with `path`, and point it to the component's # build directory: parent_dir = os.path.dirname(os.path.abspath(__file__)) - build_dir = os.path.join(parent_dir, "frontend/build") + build_dir = os.path.join(parent_dir, "frontend/dist") _component_func = components.declare_component("gpt_vis_renderer", path=build_dir) diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.gitignore b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.prettierrc b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.prettierrc deleted file mode 100644 index 0735a42..0000000 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/.prettierrc +++ /dev/null @@ -1,5 +0,0 @@ -{ - "endOfLine": "lf", - "semi": false, - "trailingComma": "es5" -} diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/README.md b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/README.md new file mode 100644 index 0000000..1e5a46b --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/README.md @@ -0,0 +1,50 @@ +# React + TypeScript + Vite + +This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. + +Currently, two official plugins are available: + +- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh +- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh + +## Expanding the ESLint configuration + +If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: + +- Configure the top-level `parserOptions` property like this: + +```js +export default tseslint.config({ + languageOptions: { + // other options... + parserOptions: { + project: ['./tsconfig.node.json', './tsconfig.app.json'], + tsconfigRootDir: import.meta.dirname, + }, + }, +}); +``` + +- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked` +- Optionally add `...tseslint.configs.stylisticTypeChecked` +- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config: + +```js +// eslint.config.js +import react from 'eslint-plugin-react'; + +export default tseslint.config({ + // Set the react version + settings: { react: { version: '18.3' } }, + plugins: { + // Add the react plugin + react, + }, + rules: { + // other rules... + // Enable its recommended rules + ...react.configs.recommended.rules, + ...react.configs['jsx-runtime'].rules, + }, +}); +``` diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/eslint.config.js b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/eslint.config.js new file mode 100644 index 0000000..33c02ac --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/eslint.config.js @@ -0,0 +1,25 @@ +import js from '@eslint/js'; +import reactHooks from 'eslint-plugin-react-hooks'; +import reactRefresh from 'eslint-plugin-react-refresh'; +import globals from 'globals'; +import tseslint from 'typescript-eslint'; + +export default tseslint.config( + { ignores: ['dist'] }, + { + extends: [js.configs.recommended, ...tseslint.configs.recommended], + files: ['**/*.{ts,tsx}'], + languageOptions: { + ecmaVersion: 2020, + globals: globals.browser, + }, + plugins: { + 'react-hooks': reactHooks, + 'react-refresh': reactRefresh, + }, + rules: { + ...reactHooks.configs.recommended.rules, + 'react-refresh/only-export-components': ['warn', { allowConstantExport: true }], + }, + }, +); diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/index.html b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/index.html new file mode 100644 index 0000000..f21f8ff --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/index.html @@ -0,0 +1,16 @@ + + + + Streamlit Component + + + + + + + + +
+ + + diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/package.json b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/package.json index f6301dc..cf1a300 100644 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/package.json +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/package.json @@ -1,42 +1,34 @@ { "name": "streamlit-gpt-vis", - "version": "0.1.0", "private": true, + "version": "0.0.0", "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc -b && vite build", + "lint": "eslint .", + "preview": "vite preview" + }, "dependencies": { "@antv/gpt-vis": "^0.1.0", "antd": "^5.22.1", - "react": "^16.13.1", - "react-dom": "^16.13.1", - "streamlit-component-lib": "^2.0.0" - }, - "scripts": { - "start": "react-scripts start", - "build": "react-scripts build", - "test": "react-scripts test", - "eject": "react-scripts eject" - }, - "eslintConfig": { - "extends": "react-app" - }, - "browserslist": { - "production": [ - ">0.2%", - "not dead", - "not op_mini all" - ], - "development": [ - "last 1 chrome version", - "last 1 firefox version", - "last 1 safari version" - ] + "react": "^18.3.1", + "react-dom": "^18.3.1", + "streamlit-component-lib": "^2.0.0", + "streamlit-component-lib-react-hooks": "^1.1.1" }, - "homepage": ".", "devDependencies": { - "@types/node": "^12.0.0", - "@types/react": "^18", - "@types/react-dom": "^18", - "react-scripts": "^5.0.1", - "typescript": "^5.0.0" + "@eslint/js": "^9.13.0", + "@types/react": "^18.3.12", + "@types/react-dom": "^18.3.1", + "@vitejs/plugin-react": "^4.3.3", + "eslint": "^9.13.0", + "eslint-plugin-react-hooks": "^5.0.0", + "eslint-plugin-react-refresh": "^0.4.14", + "globals": "^15.11.0", + "typescript": "~5.6.2", + "typescript-eslint": "^8.11.0", + "vite": "^5.4.10", + "vite-plugin-externals": "^0.6.2" } } diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/public/index.html b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/public/index.html deleted file mode 100644 index 125902c..0000000 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/public/index.html +++ /dev/null @@ -1,25 +0,0 @@ - - - - Streamlit Component - - - - - - - - -
- - - diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/MyComponent.tsx b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/MyComponent.tsx index a19cff2..91ade5c 100644 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/MyComponent.tsx +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/MyComponent.tsx @@ -1,97 +1,67 @@ import { - Streamlit, - StreamlitComponentBase, - withStreamlitConnection, -} from "streamlit-component-lib" -import React, { ReactNode } from "react" -import { - ConfigProvider, - GPTVis, - VisText, - withDefaultChartCode, ChartType, + ConfigProvider, DualAxes, - Radar, + GPTVis, Histogram, + Radar, Treemap, + VisText, + withDefaultChartCode, WordCloud, -} from "@antv/gpt-vis" +} from '@antv/gpt-vis'; +import { ConfigProvider as AntdConfigProvider, theme as AntdTheme } from 'antd'; +// import { Streamlit } from 'streamlit-component-lib'; +import { useRenderData } from 'streamlit-component-lib-react-hooks'; -interface State { - numClicks: number -} +const components = { + 'vis-text': VisText, + code: withDefaultChartCode({ + components: { + [ChartType.DualAxes]: DualAxes, + [ChartType.Radar]: Radar, + [ChartType.Histogram]: Histogram, + [ChartType.Treemap]: Treemap, + [ChartType.WordCloud]: WordCloud, + }, + loadingTimeout: 5, + debug: false, + }), +}; -/** - * This is a React-based component template. The `render()` function is called - * automatically when your component should be re-rendered. - */ -class MyComponent extends StreamlitComponentBase { - public state = { numClicks: 0 } +function MyComponent() { + const renderData = useRenderData(); + const { args, theme } = renderData; + const { config, content } = args; - private components = { - "vis-text": VisText, - code: withDefaultChartCode({ - components: { - [ChartType.DualAxes]: DualAxes, - [ChartType.Radar]: Radar, - [ChartType.Histogram]: Histogram, - [ChartType.Treemap]: Treemap, - [ChartType.WordCloud]: WordCloud, - }, - loadingTimeout: 5, - debug: false, - }), + const style: React.CSSProperties = {}; + + if (theme) { + // Use the theme object to style our button border. Alternatively, the + // theme style is defined in CSS vars. + // style.font = theme.font; } - public render = (): ReactNode => { - // Arguments that are passed to the plugin in Python are accessible - // via `this.props.args`. Here, we access the "content" arg. - const content = this.props.args["content"] - const config = this.props.args["config"] + const plotTheme = { type: theme?.base === 'dark' ? 'dark' : 'light' }; + const antdTheme = { + algorithm: theme?.base === 'dark' ? AntdTheme.darkAlgorithm : AntdTheme.defaultAlgorithm, + }; - // Streamlit sends us a theme object via props that we can use to ensure - // that our component has visuals that match the active theme in a - // streamlit app. - const { theme } = this.props - const style: React.CSSProperties = {} + const plotConfig = { theme: plotTheme }; - // Maintain compatibility with older versions of Streamlit that don't send - // a theme object. - if (theme) { - // Use the theme object to style our button border. Alternatively, the - // theme style is defined in CSS vars. - style.color = theme.textColor - style.font = theme.font - style.backgroundColor = theme.backgroundColor - } + // const onClicked = useCallback(() => { + // Streamlit.setComponentValue({}); + // }, []); - // Show a button and some text. - // When the button is clicked, we'll increment our "numClicks" state - // variable, and send its new value back to Streamlit, where it'll - // be available to the Python program. - return ( -
- - {content} + return ( +
+ + + {content} -
- ) - } - - /** Click handler for our "Click Me!" button. */ - private onClicked = (): void => { - // Increment state.numClicks, and pass the new value back to - // Streamlit via `Streamlit.setComponentValue`. - this.setState( - (prevState) => ({ numClicks: prevState.numClicks + 1 }) - // () => Streamlit.setComponentValue(this.state.numClicks) - ) - } + +
+ ); } -// "withStreamlitConnection" is a wrapper function. It bootstraps the -// connection between your component and the Streamlit app, and handles -// passing arguments from Python -> Component. -// -// You don't need to edit withStreamlitConnection (but you're welcome to!). -export default withStreamlitConnection(MyComponent) +export default MyComponent; diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/Render.tsx b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/Render.tsx deleted file mode 100644 index f219708..0000000 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/Render.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import React from "react" -import { - Streamlit, - withStreamlitConnection, - ComponentProps, - Theme, -} from "streamlit-component-lib" -import { - ConfigProvider, - GPTVis, - VisText, - withDefaultChartCode, - ChartType, - DualAxes, - Radar, - Histogram, - Treemap, - WordCloud, -} from "@antv/gpt-vis" - -const components = { - "vis-text": VisText, - code: withDefaultChartCode({ - components: { - [ChartType.DualAxes]: DualAxes, - [ChartType.Radar]: Radar, - [ChartType.Histogram]: Histogram, - [ChartType.Treemap]: Treemap, - [ChartType.WordCloud]: WordCloud, - }, - loadingTimeout: 5, - debug: false, - }), -} - -const GPTVisRender: React.FC = (props) => { - const { theme, args } = props - const { config, content } = args - - const style: React.CSSProperties = {} - - if (theme) { - // Use the theme object to style our button border. Alternatively, the - // theme style is defined in CSS vars. - style.color = theme.textColor - style.font = theme.font - style.backgroundColor = theme.backgroundColor - } - - return ( -
- - {content} - -
- ) -} - -export const GPTVisRenderWrapper = withStreamlitConnection(GPTVisRender) diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.css b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.css new file mode 100644 index 0000000..e69de29 diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.tsx b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.tsx deleted file mode 100644 index ca4f783..0000000 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/index.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React from "react" -import ReactDOM from "react-dom" -// import MyComponent from "./MyComponent" -import { GPTVisRenderWrapper } from "./Render" - -ReactDOM.render( - - - , - document.getElementById("root") -) diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/main.tsx b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/main.tsx new file mode 100644 index 0000000..78d2c08 --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/main.tsx @@ -0,0 +1,13 @@ +import { StrictMode } from 'react'; +import { createRoot } from 'react-dom/client'; +import { StreamlitProvider } from 'streamlit-component-lib-react-hooks'; +import './index.css'; +import MyComponent from './MyComponent'; + +createRoot(document.getElementById('root')!).render( + + + + + , +); diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/react-app-env.d.ts b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/react-app-env.d.ts deleted file mode 100644 index 6431bc5..0000000 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/react-app-env.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/vite-env.d.ts b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/vite-env.d.ts new file mode 100644 index 0000000..11f02fe --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.app.json b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.app.json new file mode 100644 index 0000000..f867de0 --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.app.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", + "target": "ES2020", + "useDefineForClassFields": true, + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "Bundler", + "allowImportingTsExtensions": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true, + "noUncheckedSideEffectImports": true + }, + "include": ["src"] +} diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.json b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.json index af10394..d32ff68 100644 --- a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.json +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.json @@ -1,19 +1,4 @@ { - "compilerOptions": { - "target": "es5", - "lib": ["dom", "dom.iterable", "esnext"], - "allowJs": true, - "skipLibCheck": true, - "esModuleInterop": true, - "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "module": "esnext", - "moduleResolution": "node", - "resolveJsonModule": true, - "isolatedModules": true, - "noEmit": true, - "jsx": "react" - }, - "include": ["src"] + "files": [], + "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }] } diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.node.json b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.node.json new file mode 100644 index 0000000..abcd7f0 --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/tsconfig.node.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo", + "target": "ES2022", + "lib": ["ES2023"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "Bundler", + "allowImportingTsExtensions": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true, + "noUncheckedSideEffectImports": true + }, + "include": ["vite.config.ts"] +} diff --git a/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/vite.config.ts b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/vite.config.ts new file mode 100644 index 0000000..8697776 --- /dev/null +++ b/bindings/streamlit-gpt-vis/streamlit_gpt_vis/frontend/vite.config.ts @@ -0,0 +1,15 @@ +import react from '@vitejs/plugin-react'; +import { defineConfig } from 'vite'; +import { viteExternalsPlugin } from 'vite-plugin-externals'; + +// https://vite.dev/config/ +export default defineConfig({ + base: './', + plugins: [ + react(), + viteExternalsPlugin({ + 'mapbox-gl': 'mapboxgl', + 'maplibre-gl': 'maplibregl', + }), + ], +});