Skip to content

Commit e2ebd2a

Browse files
sarikesarike
committed
inital commit
0 parents  commit e2ebd2a

24 files changed

+13112
-0
lines changed

‎.gitignore

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist-ssr
12+
*.local
13+
14+
# Editor directories and files
15+
.vscode/*
16+
!.vscode/extensions.json
17+
.idea
18+
.DS_Store
19+
*.suo
20+
*.ntvs*
21+
*.njsproj
22+
*.sln
23+
*.sw?

‎.prettierrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# openblocks-sdk demo
2+
3+
- use openblocks-sdk to embed Openblocks app into existing app

‎dist/assets/03a4f916.d36e97ee.js

Lines changed: 137 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/2339a7b4.2630a7f4.js

Lines changed: 116 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/30600498.71e68f83.js

Lines changed: 41 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/33676d45.ccedfaf4.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/681f7b87.c341a4d2.js

Lines changed: 105 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/a1e9b5ba.fa051302.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/a86ad214.2cf7482a.js

Lines changed: 1331 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/d939848f.1db7ce55.js

Lines changed: 27 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/index.0e9a40a2.css

Lines changed: 15 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/assets/index.b96e7f21.js

Lines changed: 10259 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/index.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>OpenblocksAppView Demo</title>
8+
<script type="module" crossorigin src="/assets/index.b96e7f21.js"></script>
9+
<link rel="stylesheet" href="/assets/index.0e9a40a2.css">
10+
</head>
11+
<body>
12+
<div id="root"></div>
13+
14+
</body>
15+
</html>

‎index.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>OpenblocksAppView Demo</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/main.tsx"></script>
12+
</body>
13+
</html>

‎package.json

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "app-view-demo",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "tsc && vite build",
9+
"preview": "vite preview"
10+
},
11+
"dependencies": {
12+
"history": "^5.3.0",
13+
"openblocks-sdk": "^0.0.17",
14+
"react": "17",
15+
"react-dom": "17",
16+
"react-router": "^6.4.3",
17+
"react-router-dom": "^6.4.3"
18+
},
19+
"devDependencies": {
20+
"@types/react": "^18.0.24",
21+
"@types/react-dom": "^18.0.8",
22+
"@vitejs/plugin-react": "^2.2.0",
23+
"typescript": "^4.6.4",
24+
"vite": "^3.2.3"
25+
}
26+
}

‎src/App.tsx

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
import { OpenblocksAppView } from "openblocks-sdk";
2+
import { useEffect } from "react";
3+
import {
4+
createHashRouter,
5+
NavLink,
6+
Outlet,
7+
RouteObject,
8+
RouterProvider,
9+
useLocation,
10+
useNavigate,
11+
} from "react-router-dom";
12+
13+
const demos = [
14+
{
15+
title: "basic crud",
16+
appId: "6374b8dbc23a1103804cc23e",
17+
},
18+
{
19+
title: "Simple table horizontal scroll and pagination demo",
20+
appId: "6377695dc54c5224c70e9770",
21+
},
22+
{
23+
title: "Pagination with temporary state demo",
24+
appId: "6379cdd9f02c6e6ecc1d37ff",
25+
},
26+
];
27+
28+
function titleToPath(title: string) {
29+
return title.toLowerCase().replace(/\s+/g, "-");
30+
}
31+
32+
function Root() {
33+
const nav = useNavigate();
34+
const location = useLocation();
35+
36+
useEffect(() => {
37+
if (location.pathname === "/") {
38+
nav(titleToPath(demos[0].title));
39+
}
40+
}, [nav, location]);
41+
42+
return (
43+
<div>
44+
<div className="nav">
45+
{demos.map((i) => (
46+
<NavLink key={i.appId} to={titleToPath(i.title)}>
47+
{i.title}
48+
</NavLink>
49+
))}
50+
</div>
51+
<div>
52+
<Outlet />
53+
</div>
54+
</div>
55+
);
56+
}
57+
58+
function AppDemo(props: { appId: string }) {
59+
return <OpenblocksAppView className="ob-app" appId={props.appId} />;
60+
}
61+
62+
const routes: RouteObject[] = [
63+
{
64+
path: "/",
65+
element: <Root />,
66+
children: demos.map((i) => ({
67+
path: titleToPath(i.title),
68+
element: <AppDemo appId={i.appId} />,
69+
})),
70+
},
71+
];
72+
73+
const router = createHashRouter(routes);
74+
75+
function App() {
76+
return (
77+
<div className="container">
78+
<RouterProvider router={router} />
79+
</div>
80+
);
81+
}
82+
83+
export default App;

‎src/index.css

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
:root {
2+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
3+
font-size: 16px;
4+
line-height: 24px;
5+
font-weight: 400;
6+
7+
font-synthesis: none;
8+
text-rendering: optimizeLegibility;
9+
-webkit-font-smoothing: antialiased;
10+
-moz-osx-font-smoothing: grayscale;
11+
-webkit-text-size-adjust: 100%;
12+
}
13+
14+
a {
15+
font-weight: 500;
16+
color: #646cff;
17+
text-decoration: inherit;
18+
}
19+
a:hover {
20+
color: #535bf2;
21+
}
22+
23+
body {
24+
margin: 0;
25+
display: flex;
26+
min-width: 320px;
27+
min-height: 100vh;
28+
}
29+
30+
h1 {
31+
font-size: 3.2em;
32+
line-height: 1.1;
33+
}
34+
35+
button {
36+
border-radius: 8px;
37+
border: 1px solid transparent;
38+
padding: 0.6em 1.2em;
39+
font-size: 1em;
40+
font-weight: 500;
41+
font-family: inherit;
42+
background-color: #1a1a1a;
43+
cursor: pointer;
44+
transition: border-color 0.25s;
45+
}
46+
47+
button:hover {
48+
border-color: #646cff;
49+
}
50+
51+
button:focus,
52+
button:focus-visible {
53+
outline: 4px auto -webkit-focus-ring-color;
54+
}
55+
56+
.ob-app {
57+
width: 100%;
58+
}
59+
60+
#root {
61+
width: 100%;
62+
}
63+
64+
.nav {
65+
padding: 16px;
66+
text-align: center;
67+
position: sticky;
68+
top: 0;
69+
z-index: 99999;
70+
background-color: #fff;
71+
}
72+
73+
.nav a {
74+
margin-right: 18px;
75+
}

‎src/main.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from "react";
2+
import ReactDOM from "react-dom";
3+
import App from "./App";
4+
5+
import "openblocks-sdk/dist/style.css";
6+
import "./index.css";
7+
8+
ReactDOM.render(
9+
<React.StrictMode>
10+
<App />
11+
</React.StrictMode>,
12+
document.getElementById("root") as HTMLElement
13+
);

‎src/vite-env.d.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/// <reference types="vite/client" />
2+
3+
declare module "openblocks-sdk";

‎tsconfig.json

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ESNext",
4+
"useDefineForClassFields": true,
5+
"lib": ["DOM", "DOM.Iterable", "ESNext"],
6+
"allowJs": false,
7+
"skipLibCheck": true,
8+
"esModuleInterop": false,
9+
"allowSyntheticDefaultImports": true,
10+
"strict": true,
11+
"forceConsistentCasingInFileNames": true,
12+
"module": "ESNext",
13+
"moduleResolution": "Node",
14+
"resolveJsonModule": true,
15+
"isolatedModules": true,
16+
"noEmit": true,
17+
"jsx": "react-jsx",
18+
},
19+
"include": ["src"],
20+
"references": [{ "path": "./tsconfig.node.json" }]
21+
}

‎tsconfig.node.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"module": "ESNext",
5+
"moduleResolution": "Node",
6+
"allowSyntheticDefaultImports": true
7+
},
8+
"include": ["vite.config.ts"]
9+
}

‎vite.config.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { defineConfig } from 'vite'
2+
import react from '@vitejs/plugin-react'
3+
4+
// https://vitejs.dev/config/
5+
export default defineConfig({
6+
plugins: [react()]
7+
})

0 commit comments

Comments
 (0)