Skip to content

Commit 19fdf32

Browse files
harry-whorlowharry-whorlow
committed
feat(devtools-ui): json tree handles dates
1 parent 8d4dd51 commit 19fdf32

File tree

13 files changed

+239
-4
lines changed

13 files changed

+239
-4
lines changed

‎examples/solid/devtools-ui/.eslintrc.cjs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// @ts-check
2+
3+
/** @type {import('eslint').Linter.Config} */
4+
const config = {
5+
settings: {
6+
extends: [],
7+
rules: {},
8+
},
9+
}
10+
11+
module.exports = config

‎examples/solid/devtools-ui/.gitignore‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
pnpm-lock.yaml
15+
yarn.lock
16+
package-lock.json
17+
18+
# misc
19+
.DS_Store
20+
.env.local
21+
.env.development.local
22+
.env.test.local
23+
.env.production.local
24+
25+
npm-debug.log*
26+
yarn-debug.log*
27+
yarn-error.log*

‎examples/solid/devtools-ui/README.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
# Example
2+
3+
To run this example:
4+
5+
- `npm install`
6+
- `npm run dev`

‎examples/solid/devtools-ui/index.html‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="icon" type="image/svg+xml" href="/emblem-light.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="theme-color" content="#000000" />
8+
9+
<title>TanStack Devtools Example</title>
10+
</head>
11+
<body>
12+
<noscript>You need to enable JavaScript to run this app.</noscript>
13+
<div id="root"></div>
14+
<script type="module" src="/src/index.tsx"></script>
15+
</body>
16+
</html>

‎examples/solid/devtools-ui/package.json‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "@tanstack/devtools-example-devtools-ui",
3+
"private": true,
4+
"type": "module",
5+
"scripts": {
6+
"dev": "vite --port=3005",
7+
"build": "vite build",
8+
"preview": "vite preview",
9+
"test:types": "tsc"
10+
},
11+
"dependencies": {
12+
"@tanstack/devtools-ui": "^0.4.4",
13+
"@tanstack/solid-devtools": "^0.7.9",
14+
"solid-js": "^1.9.9"
15+
},
16+
"devDependencies": {
17+
"@tanstack/devtools-vite": "0.3.10",
18+
"vite": "^7.1.7",
19+
"vite-plugin-inspect": "11.3.3",
20+
"vite-plugin-solid": "^2.11.8"
21+
},
22+
"browserslist": {
23+
"production": [
24+
">0.2%",
25+
"not dead",
26+
"not op_mini all"
27+
],
28+
"development": [
29+
"last 1 chrome version",
30+
"last 1 firefox version",
31+
"last 1 safari version"
32+
]
33+
}
34+
}

‎examples/solid/devtools-ui/public/emblem-light.svg‎

Lines changed: 13 additions & 0 deletions
Loading

‎examples/solid/devtools-ui/src/index.tsx‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { JsonTree, ThemeContextProvider } from '@tanstack/devtools-ui'
2+
import { render } from 'solid-js/web'
3+
4+
function App() {
5+
const JsonTreeData = {
6+
name: 'date format',
7+
value: { period: 'past', data: new Date() },
8+
}
9+
10+
const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)')
11+
12+
return (
13+
<div>
14+
<ThemeContextProvider theme={darkThemeMq.matches ? 'dark' : 'light'}>
15+
<JsonTree value={JsonTreeData} config={{ dateFormat: 'DD-MM-YYYY' }} />
16+
</ThemeContextProvider>
17+
</div>
18+
)
19+
}
20+
21+
render(() => <App />, document.getElementById('root')!)

‎examples/solid/devtools-ui/tsconfig.json‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ESNext",
4+
"lib": ["DOM", "DOM.Iterable", "ESNext"],
5+
"module": "ESNext",
6+
"skipLibCheck": true,
7+
8+
/* Bundler mode */
9+
"moduleResolution": "Bundler",
10+
"allowImportingTsExtensions": true,
11+
"resolveJsonModule": true,
12+
"isolatedModules": true,
13+
"noEmit": true,
14+
"jsx": "preserve",
15+
"jsxImportSource": "solid-js",
16+
17+
/* Linting */
18+
"strict": true,
19+
"noUnusedLocals": true,
20+
"noUnusedParameters": true,
21+
"noFallthroughCasesInSwitch": true
22+
},
23+
"include": ["src", "vite.config.ts"]
24+
}

‎examples/solid/devtools-ui/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 solid from 'vite-plugin-solid'
3+
import { devtools } from '@tanstack/devtools-vite'
4+
// https://vite.dev/config/
5+
export default defineConfig({
6+
plugins: [devtools(), solid({})],
7+
})

‎packages/devtools-ui/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@
5555
},
5656
"dependencies": {
5757
"clsx": "^2.1.1",
58+
"dayjs": "^1.11.19",
5859
"goober": "^2.1.16",
5960
"solid-js": "^1.9.9"
6061
},

0 commit comments

Comments
 (0)