mirror of
https://github.com/johndoe6345789/snippet-pastebin.git
synced 2026-04-24 13:34:55 +00:00
johndoe6345789
b920414fe2
TSX
Basic state management in React functional components
Last updated: 17/01/2026, 17:24:26
Hide Preview
Copy
Edit
123456789101112
Unexpected token '<'
Ask AI for Helpimport { useState } from 'react'
function Counter() {
const [count, setCount] = useState(0)
return (
<div>
<p>Count: {count}</p>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
)
}Preview Configuration
Add Parameter
Counter
The name of the function or component to render. Leave empty to use the default export.
101 lines
3.4 KiB
JSON
101 lines
3.4 KiB
JSON
{
|
|
"name": "spark-template",
|
|
"private": true,
|
|
"version": "0.0.0",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"kill": "fuser -k 5000/tcp",
|
|
"build": "tsc -b --noCheck && vite build",
|
|
"lint": "eslint .",
|
|
"optimize": "vite optimize",
|
|
"preview": "vite preview"
|
|
},
|
|
"dependencies": {
|
|
"@babel/standalone": "^7.28.6",
|
|
"@github/spark": ">=0.43.1 <1",
|
|
"@heroicons/react": "^2.2.0",
|
|
"@hookform/resolvers": "^4.1.3",
|
|
"@monaco-editor/react": "^4.7.0",
|
|
"@octokit/core": "^6.1.4",
|
|
"@phosphor-icons/react": "^2.1.7",
|
|
"@radix-ui/colors": "^3.0.0",
|
|
"@radix-ui/react-accordion": "^1.2.3",
|
|
"@radix-ui/react-alert-dialog": "^1.1.6",
|
|
"@radix-ui/react-aspect-ratio": "^1.1.2",
|
|
"@radix-ui/react-avatar": "^1.1.3",
|
|
"@radix-ui/react-checkbox": "^1.1.4",
|
|
"@radix-ui/react-collapsible": "^1.1.3",
|
|
"@radix-ui/react-context-menu": "^2.2.6",
|
|
"@radix-ui/react-dialog": "^1.1.6",
|
|
"@radix-ui/react-dropdown-menu": "^2.1.6",
|
|
"@radix-ui/react-hover-card": "^1.1.6",
|
|
"@radix-ui/react-label": "^2.1.2",
|
|
"@radix-ui/react-menubar": "^1.1.6",
|
|
"@radix-ui/react-navigation-menu": "^1.2.5",
|
|
"@radix-ui/react-popover": "^1.1.6",
|
|
"@radix-ui/react-progress": "^1.1.2",
|
|
"@radix-ui/react-radio-group": "^1.2.3",
|
|
"@radix-ui/react-scroll-area": "^1.2.9",
|
|
"@radix-ui/react-select": "^2.1.6",
|
|
"@radix-ui/react-separator": "^1.1.2",
|
|
"@radix-ui/react-slider": "^1.3.6",
|
|
"@radix-ui/react-slot": "^1.1.2",
|
|
"@radix-ui/react-switch": "^1.1.3",
|
|
"@radix-ui/react-tabs": "^1.1.3",
|
|
"@radix-ui/react-toggle": "^1.1.2",
|
|
"@radix-ui/react-toggle-group": "^1.1.2",
|
|
"@radix-ui/react-tooltip": "^1.1.8",
|
|
"@tailwindcss/container-queries": "^0.1.1",
|
|
"@tailwindcss/vite": "^4.1.11",
|
|
"@tanstack/react-query": "^5.83.1",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "^1.1.1",
|
|
"d3": "^7.9.0",
|
|
"date-fns": "^3.6.0",
|
|
"embla-carousel-react": "^8.5.2",
|
|
"framer-motion": "^12.6.2",
|
|
"input-otp": "^1.4.2",
|
|
"lucide-react": "^0.484.0",
|
|
"marked": "^15.0.7",
|
|
"next-themes": "^0.4.6",
|
|
"octokit": "^4.1.2",
|
|
"react": "^19.0.0",
|
|
"react-day-picker": "^9.6.7",
|
|
"react-dom": "^19.0.0",
|
|
"react-error-boundary": "^6.0.0",
|
|
"react-hook-form": "^7.54.2",
|
|
"react-resizable-panels": "^2.1.7",
|
|
"react-router-dom": "^7.12.0",
|
|
"recharts": "^2.15.1",
|
|
"sonner": "^2.0.1",
|
|
"tailwind-merge": "^3.0.2",
|
|
"three": "^0.175.0",
|
|
"tw-animate-css": "^1.2.4",
|
|
"uuid": "^11.1.0",
|
|
"vaul": "^1.1.2",
|
|
"zod": "^3.25.76"
|
|
},
|
|
"devDependencies": {
|
|
"@eslint/js": "^9.21.0",
|
|
"@tailwindcss/postcss": "^4.1.8",
|
|
"@types/react": "^19.0.10",
|
|
"@types/react-dom": "^19.0.4",
|
|
"@vitejs/plugin-react-swc": "^4.2.2",
|
|
"eslint": "^9.28.0",
|
|
"eslint-plugin-react-hooks": "^5.2.0",
|
|
"eslint-plugin-react-refresh": "^0.4.19",
|
|
"globals": "^16.0.0",
|
|
"tailwindcss": "^4.1.11",
|
|
"typescript": "~5.7.2",
|
|
"typescript-eslint": "^8.38.0",
|
|
"vite": "^7.2.6"
|
|
},
|
|
"workspaces": {
|
|
"packages": [
|
|
"packages/*"
|
|
]
|
|
}
|
|
}
|