@undp/create-app 0.2.1 → 0.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -21
- package/bin/generateFiles/generateEnv.js +21 -0
- package/bin/generateFiles/generateLayoutForNext.js +40 -0
- package/bin/generateFiles/generateNextEnvTypes.js +9 -0
- package/bin/generateFiles/generatePackageJson.js +10 -11
- package/bin/generateFiles/generatePageForNext.js +102 -0
- package/bin/generateFiles/generateStylesCss.js +8 -0
- package/bin/generateFiles/index.js +5 -0
- package/bin/index.js +25 -9
- package/bin/promptUser.js +22 -26
- package/bin/templates/next/auth/app/about/page.tsx +51 -0
- package/bin/templates/next/{withDataViz/auth → auth}/app/layout.tsx +2 -1
- package/bin/templates/next/{withDataViz/auth → auth}/app/login/page.tsx +20 -2
- package/bin/templates/next/auth/app/page.tsx +75 -0
- package/bin/templates/next/auth/app/user/page.tsx +84 -0
- package/bin/templates/next/auth/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/next/auth/stores/counter.ts +23 -0
- package/bin/templates/next/basic/app/about/page.tsx +51 -0
- package/bin/templates/next/{withDataViz/basic → basic}/app/layout.tsx +2 -1
- package/bin/templates/next/basic/app/page.tsx +75 -0
- package/bin/templates/next/basic/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/next/basic/stores/counter.ts +23 -0
- package/bin/templates/queryIntegrationForNext/integration/tanstack-query.tsx +27 -0
- package/bin/templates/vite/basic/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/vite/{withDataViz/query → basic}/src/App.tsx +30 -31
- package/bin/templates/vite/{withDataViz/basic → basic}/src/main.tsx +1 -1
- package/bin/templates/vite/basic/src/stores/counter.ts +23 -0
- package/bin/templates/vite/query/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/vite/{withoutDataViz/query → query}/src/App.tsx +39 -10
- package/bin/templates/vite/{withDataViz/query → query}/src/integration/tanstack-query.tsx +2 -1
- package/bin/templates/vite/query/src/stores/counter.ts +23 -0
- package/bin/templates/vite/query+router/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/vite/query+router/src/App.tsx +73 -0
- package/bin/templates/vite/{withDataViz/query+router → query+router}/src/integration/tanstack-query.tsx +2 -1
- package/bin/templates/vite/{withDataViz/query+router → query+router}/src/routes/queryDemo.tsx +12 -8
- package/bin/templates/vite/query+router/src/stores/counter.ts +23 -0
- package/bin/templates/vite/router/public/imgs/Zustand-logo.svg +266 -0
- package/bin/templates/vite/router/src/App.tsx +73 -0
- package/bin/templates/vite/{withDataViz/router → router}/src/main.tsx +2 -2
- package/bin/templates/vite/{withoutDataViz/router/src/App.tsx → router/src/routes/about.tsx} +14 -7
- package/bin/templates/vite/router/src/stores/counter.ts +23 -0
- package/bin/templates/vite/{withoutDataViz/router → router}/src/styles/style.css +0 -1
- package/package.json +1 -1
- package/bin/templates/next/withDataViz/auth/README.md +0 -108
- package/bin/templates/next/withDataViz/auth/app/about/page.tsx +0 -33
- package/bin/templates/next/withDataViz/auth/app/page.tsx +0 -33
- package/bin/templates/next/withDataViz/auth/app/user/page.tsx +0 -86
- package/bin/templates/next/withDataViz/basic/README.md +0 -56
- package/bin/templates/next/withDataViz/basic/app/about/page.tsx +0 -33
- package/bin/templates/next/withDataViz/basic/app/page.tsx +0 -33
- package/bin/templates/next/withoutDataViz/auth/app/about/page.tsx +0 -33
- package/bin/templates/next/withoutDataViz/auth/app/api/auth/[...all]/route.ts +0 -5
- package/bin/templates/next/withoutDataViz/auth/app/globals.css +0 -3
- package/bin/templates/next/withoutDataViz/auth/app/layout.tsx +0 -30
- package/bin/templates/next/withoutDataViz/auth/app/login/page.tsx +0 -45
- package/bin/templates/next/withoutDataViz/auth/app/page.tsx +0 -33
- package/bin/templates/next/withoutDataViz/auth/app/user/page.tsx +0 -86
- package/bin/templates/next/withoutDataViz/auth/components/Footer.tsx +0 -16
- package/bin/templates/next/withoutDataViz/auth/components/Header.tsx +0 -56
- package/bin/templates/next/withoutDataViz/auth/eslint.config.mjs +0 -103
- package/bin/templates/next/withoutDataViz/auth/lib/auth-client.ts +0 -7
- package/bin/templates/next/withoutDataViz/auth/lib/auth.ts +0 -30
- package/bin/templates/next/withoutDataViz/auth/next.config.ts +0 -10
- package/bin/templates/next/withoutDataViz/auth/postcss.config.mjs +0 -7
- package/bin/templates/next/withoutDataViz/auth/public/next.svg +0 -1
- package/bin/templates/next/withoutDataViz/auth/tsconfig.json +0 -34
- package/bin/templates/next/withoutDataViz/basic/app/about/page.tsx +0 -33
- package/bin/templates/next/withoutDataViz/basic/app/globals.css +0 -3
- package/bin/templates/next/withoutDataViz/basic/app/layout.tsx +0 -31
- package/bin/templates/next/withoutDataViz/basic/app/page.tsx +0 -33
- package/bin/templates/next/withoutDataViz/basic/components/Footer.tsx +0 -16
- package/bin/templates/next/withoutDataViz/basic/components/Header.tsx +0 -27
- package/bin/templates/next/withoutDataViz/basic/eslint.config.mjs +0 -103
- package/bin/templates/next/withoutDataViz/basic/next.config.ts +0 -7
- package/bin/templates/next/withoutDataViz/basic/postcss.config.mjs +0 -7
- package/bin/templates/next/withoutDataViz/basic/public/next.svg +0 -1
- package/bin/templates/next/withoutDataViz/basic/tsconfig.json +0 -34
- package/bin/templates/vite/withDataViz/basic/README.md +0 -76
- package/bin/templates/vite/withDataViz/basic/src/App.tsx +0 -38
- package/bin/templates/vite/withDataViz/basic/src/styles/style.css +0 -4
- package/bin/templates/vite/withDataViz/basic/vite.config.ts +0 -74
- package/bin/templates/vite/withDataViz/query/.prettierrc +0 -10
- package/bin/templates/vite/withDataViz/query/README.md +0 -80
- package/bin/templates/vite/withDataViz/query/public/favicon.ico +0 -0
- package/bin/templates/vite/withDataViz/query/src/styles/style.css +0 -4
- package/bin/templates/vite/withDataViz/query/tailwind.config.js +0 -7
- package/bin/templates/vite/withDataViz/query+router/README.md +0 -112
- package/bin/templates/vite/withDataViz/query+router/src/App.tsx +0 -42
- package/bin/templates/vite/withDataViz/query+router/src/styles/style.css +0 -4
- package/bin/templates/vite/withDataViz/router/.prettierrc +0 -10
- package/bin/templates/vite/withDataViz/router/README.md +0 -107
- package/bin/templates/vite/withDataViz/router/public/favicon.ico +0 -0
- package/bin/templates/vite/withDataViz/router/public/imgs/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withDataViz/router/src/App.tsx +0 -51
- package/bin/templates/vite/withDataViz/router/src/assets/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withDataViz/router/src/routes/about.tsx +0 -73
- package/bin/templates/vite/withDataViz/router/src/styles/style.css +0 -4
- package/bin/templates/vite/withDataViz/router/tailwind.config.js +0 -7
- package/bin/templates/vite/withoutDataViz/basic/.prettierrc +0 -10
- package/bin/templates/vite/withoutDataViz/basic/eslint.config.mjs +0 -97
- package/bin/templates/vite/withoutDataViz/basic/index.html +0 -13
- package/bin/templates/vite/withoutDataViz/basic/public/favicon.ico +0 -0
- package/bin/templates/vite/withoutDataViz/basic/public/imgs/Vitejs-logo.svg +0 -15
- package/bin/templates/vite/withoutDataViz/basic/public/imgs/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/basic/src/App.tsx +0 -38
- package/bin/templates/vite/withoutDataViz/basic/src/assets/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/basic/src/components/Footer.tsx +0 -14
- package/bin/templates/vite/withoutDataViz/basic/src/components/Header.tsx +0 -25
- package/bin/templates/vite/withoutDataViz/basic/src/main.tsx +0 -10
- package/bin/templates/vite/withoutDataViz/basic/src/styles/fonts.css +0 -213
- package/bin/templates/vite/withoutDataViz/basic/src/vite-env.d.ts +0 -1
- package/bin/templates/vite/withoutDataViz/basic/tailwind.config.js +0 -7
- package/bin/templates/vite/withoutDataViz/basic/tsconfig.json +0 -29
- package/bin/templates/vite/withoutDataViz/basic/tsconfig.node.json +0 -9
- package/bin/templates/vite/withoutDataViz/query/.prettierrc +0 -10
- package/bin/templates/vite/withoutDataViz/query/eslint.config.mjs +0 -97
- package/bin/templates/vite/withoutDataViz/query/index.html +0 -13
- package/bin/templates/vite/withoutDataViz/query/public/favicon.ico +0 -0
- package/bin/templates/vite/withoutDataViz/query/public/imgs/Tailwind_CSS_Logo.svg +0 -1
- package/bin/templates/vite/withoutDataViz/query/public/imgs/Vitejs-logo.svg +0 -15
- package/bin/templates/vite/withoutDataViz/query/public/imgs/logo-color-600.png +0 -0
- package/bin/templates/vite/withoutDataViz/query/public/imgs/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/query/src/assets/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/query/src/components/Footer.tsx +0 -14
- package/bin/templates/vite/withoutDataViz/query/src/components/Header.tsx +0 -25
- package/bin/templates/vite/withoutDataViz/query/src/integration/tanstack-query.tsx +0 -27
- package/bin/templates/vite/withoutDataViz/query/src/main.tsx +0 -21
- package/bin/templates/vite/withoutDataViz/query/src/styles/fonts.css +0 -213
- package/bin/templates/vite/withoutDataViz/query/src/vite-env.d.ts +0 -1
- package/bin/templates/vite/withoutDataViz/query/tailwind.config.js +0 -7
- package/bin/templates/vite/withoutDataViz/query/tsconfig.json +0 -29
- package/bin/templates/vite/withoutDataViz/query/tsconfig.node.json +0 -9
- package/bin/templates/vite/withoutDataViz/query/vite.config.ts +0 -75
- package/bin/templates/vite/withoutDataViz/query+router/.prettierrc +0 -10
- package/bin/templates/vite/withoutDataViz/query+router/eslint.config.mjs +0 -97
- package/bin/templates/vite/withoutDataViz/query+router/index.html +0 -13
- package/bin/templates/vite/withoutDataViz/query+router/public/favicon.ico +0 -0
- package/bin/templates/vite/withoutDataViz/query+router/public/imgs/Vitejs-logo.svg +0 -15
- package/bin/templates/vite/withoutDataViz/query+router/public/imgs/logo-color-600.png +0 -0
- package/bin/templates/vite/withoutDataViz/query+router/public/imgs/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/query+router/src/App.tsx +0 -42
- package/bin/templates/vite/withoutDataViz/query+router/src/assets/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/query+router/src/components/Footer.tsx +0 -14
- package/bin/templates/vite/withoutDataViz/query+router/src/components/Header.tsx +0 -25
- package/bin/templates/vite/withoutDataViz/query+router/src/integration/tanstack-query.tsx +0 -27
- package/bin/templates/vite/withoutDataViz/query+router/src/main.tsx +0 -73
- package/bin/templates/vite/withoutDataViz/query+router/src/routes/queryDemo.tsx +0 -73
- package/bin/templates/vite/withoutDataViz/query+router/src/styles/fonts.css +0 -213
- package/bin/templates/vite/withoutDataViz/query+router/src/vite-env.d.ts +0 -1
- package/bin/templates/vite/withoutDataViz/query+router/tailwind.config.js +0 -7
- package/bin/templates/vite/withoutDataViz/query+router/tsconfig.json +0 -29
- package/bin/templates/vite/withoutDataViz/query+router/tsconfig.node.json +0 -9
- package/bin/templates/vite/withoutDataViz/query+router/vite.config.ts +0 -75
- package/bin/templates/vite/withoutDataViz/router/.prettierrc +0 -10
- package/bin/templates/vite/withoutDataViz/router/eslint.config.mjs +0 -97
- package/bin/templates/vite/withoutDataViz/router/index.html +0 -13
- package/bin/templates/vite/withoutDataViz/router/public/favicon.ico +0 -0
- package/bin/templates/vite/withoutDataViz/router/public/imgs/Tailwind_CSS_Logo.svg +0 -1
- package/bin/templates/vite/withoutDataViz/router/public/imgs/Vitejs-logo.svg +0 -15
- package/bin/templates/vite/withoutDataViz/router/public/imgs/logo-color-600.png +0 -0
- package/bin/templates/vite/withoutDataViz/router/public/imgs/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/router/src/assets/undp-logo-blue.svg +0 -1
- package/bin/templates/vite/withoutDataViz/router/src/components/Footer.tsx +0 -14
- package/bin/templates/vite/withoutDataViz/router/src/components/Header.tsx +0 -25
- package/bin/templates/vite/withoutDataViz/router/src/main.tsx +0 -66
- package/bin/templates/vite/withoutDataViz/router/src/routes/about.tsx +0 -73
- package/bin/templates/vite/withoutDataViz/router/src/styles/fonts.css +0 -213
- package/bin/templates/vite/withoutDataViz/router/src/vite-env.d.ts +0 -1
- package/bin/templates/vite/withoutDataViz/router/tailwind.config.js +0 -7
- package/bin/templates/vite/withoutDataViz/router/tsconfig.json +0 -29
- package/bin/templates/vite/withoutDataViz/router/tsconfig.node.json +0 -9
- package/bin/templates/vite/withoutDataViz/router/vite.config.ts +0 -75
- /package/bin/templates/next/{withDataViz/auth → auth}/.prettierrc +0 -0
- /package/bin/templates/next/{withoutDataViz/auth → auth}/README.md +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/app/api/auth/[...all]/route.ts +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/app/favicon.ico +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/app/globals.css +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/components/Footer.tsx +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/components/Header.tsx +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/eslint.config.mjs +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/lib/auth-client.ts +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/lib/auth.ts +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/next.config.ts +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/postcss.config.mjs +0 -0
- /package/bin/templates/{vite/withDataViz/basic → next/auth}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/next/{withDataViz/auth/public → auth/public/imgs}/next.svg +0 -0
- /package/bin/templates/next/{withDataViz/auth/public → auth/public/imgs}/undp-logo-blue.svg +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/tailwind.config.js +0 -0
- /package/bin/templates/next/{withDataViz/auth → auth}/tsconfig.json +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/.prettierrc +0 -0
- /package/bin/templates/next/{withoutDataViz/basic → basic}/README.md +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/app/favicon.ico +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/app/globals.css +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/components/Footer.tsx +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/components/Header.tsx +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/eslint.config.mjs +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/next.config.ts +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/postcss.config.mjs +0 -0
- /package/bin/templates/{vite/withDataViz/query+router → next/basic}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/next/{withDataViz/basic/public → basic/public/imgs}/next.svg +0 -0
- /package/bin/templates/next/{withDataViz/basic/public → basic/public/imgs}/undp-logo-blue.svg +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/tailwind.config.js +0 -0
- /package/bin/templates/next/{withDataViz/basic → basic}/tsconfig.json +0 -0
- /package/bin/templates/{next/withoutDataViz/auth → vite/basic}/.prettierrc +0 -0
- /package/bin/templates/vite/{withoutDataViz/basic → basic}/README.md +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/eslint.config.mjs +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/index.html +0 -0
- /package/bin/templates/{next/withoutDataViz/auth/app → vite/basic/public}/favicon.ico +0 -0
- /package/bin/templates/vite/{withDataViz/query → basic}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/public/imgs/Vitejs-logo.svg +0 -0
- /package/bin/templates/{next/withoutDataViz/auth/public → vite/basic/public/imgs}/undp-logo-blue.svg +0 -0
- /package/bin/templates/{next/withoutDataViz/basic/public → vite/basic/src/assets}/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/src/components/Footer.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/src/components/Header.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/src/styles/fonts.css +0 -0
- /package/bin/templates/vite/{withoutDataViz/basic → basic}/src/styles/style.css +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/src/vite-env.d.ts +0 -0
- /package/bin/templates/{next/withoutDataViz/auth → vite/basic}/tailwind.config.js +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/tsconfig.json +0 -0
- /package/bin/templates/vite/{withDataViz/basic → basic}/tsconfig.node.json +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → basic}/vite.config.ts +0 -0
- /package/bin/templates/vite/{withDataViz/basic → query}/.prettierrc +0 -0
- /package/bin/templates/vite/{withoutDataViz/query → query}/README.md +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/eslint.config.mjs +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/index.html +0 -0
- /package/bin/templates/vite/{withDataViz/basic → query}/public/favicon.ico +0 -0
- /package/bin/templates/vite/{withoutDataViz/basic → query}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query/public/imgs/logo-color-600.png → query/public/imgs/Tanstack-logo.png} +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/public/imgs/Vitejs-logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query}/public/imgs/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query}/src/assets/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/src/components/Footer.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/src/components/Header.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/src/main.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/src/styles/fonts.css +0 -0
- /package/bin/templates/vite/{withoutDataViz/query → query}/src/styles/style.css +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/src/vite-env.d.ts +0 -0
- /package/bin/templates/vite/{withDataViz/basic → query}/tailwind.config.js +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/tsconfig.json +0 -0
- /package/bin/templates/vite/{withDataViz/query → query}/tsconfig.node.json +0 -0
- /package/bin/templates/vite/{withDataViz/router → query}/vite.config.ts +0 -0
- /package/bin/templates/{next/withoutDataViz/basic → vite/query+router}/.prettierrc +0 -0
- /package/bin/templates/vite/{withoutDataViz/query+router → query+router}/README.md +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/eslint.config.mjs +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/index.html +0 -0
- /package/bin/templates/{next/withoutDataViz/basic/app → vite/query+router/public}/favicon.ico +0 -0
- /package/bin/templates/vite/{withDataViz/router → query+router}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query+router/public/imgs/logo-color-600.png → query+router/public/imgs/Tanstack-logo.png} +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/public/imgs/Vitejs-logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/basic → query+router}/public/imgs/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/basic → query+router}/src/assets/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/src/components/Footer.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/src/components/Header.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/src/main.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/src/styles/fonts.css +0 -0
- /package/bin/templates/vite/{withoutDataViz/query+router → query+router}/src/styles/style.css +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/src/vite-env.d.ts +0 -0
- /package/bin/templates/{next/withoutDataViz/basic → vite/query+router}/tailwind.config.js +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/tsconfig.json +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → query+router}/tsconfig.node.json +0 -0
- /package/bin/templates/vite/{withDataViz/query → query+router}/vite.config.ts +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → router}/.prettierrc +0 -0
- /package/bin/templates/vite/{withoutDataViz/router → router}/README.md +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/eslint.config.mjs +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/index.html +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → router}/public/favicon.ico +0 -0
- /package/bin/templates/vite/{withoutDataViz/query+router → router}/public/imgs/Tailwind_CSS_Logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/router/public/imgs/logo-color-600.png → router/public/imgs/Tanstack-logo.png} +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/public/imgs/Vitejs-logo.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query → router}/public/imgs/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/query → router}/src/assets/undp-logo-blue.svg +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/src/components/Footer.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/src/components/Header.tsx +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/src/styles/fonts.css +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/src/vite-env.d.ts +0 -0
- /package/bin/templates/vite/{withDataViz/query+router → router}/tailwind.config.js +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/tsconfig.json +0 -0
- /package/bin/templates/vite/{withDataViz/router → router}/tsconfig.node.json +0 -0
- /package/bin/templates/vite/{withoutDataViz/basic → router}/vite.config.ts +0 -0
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import nextVitals from 'eslint-config-next/core-web-vitals';
|
|
2
|
-
import nextTs from 'eslint-config-next/typescript';
|
|
3
|
-
import js from '@eslint/js';
|
|
4
|
-
import tseslint from 'typescript-eslint';
|
|
5
|
-
import pluginReact from 'eslint-plugin-react';
|
|
6
|
-
import reactHooks from 'eslint-plugin-react-hooks';
|
|
7
|
-
import importPlugin from 'eslint-plugin-import';
|
|
8
|
-
import { defineConfig } from 'eslint/config';
|
|
9
|
-
import prettierConfig from 'eslint-config-prettier';
|
|
10
|
-
import prettierPlugin from 'eslint-plugin-prettier';
|
|
11
|
-
|
|
12
|
-
export default defineConfig([
|
|
13
|
-
{
|
|
14
|
-
ignores: [
|
|
15
|
-
'node_modules/**',
|
|
16
|
-
'build/**',
|
|
17
|
-
'public/**',
|
|
18
|
-
'dist/**',
|
|
19
|
-
'storybook-static/**',
|
|
20
|
-
'dist-ssr/**',
|
|
21
|
-
'coverage/**',
|
|
22
|
-
'**/*.test.js',
|
|
23
|
-
'**/__snapshots__/**',
|
|
24
|
-
'.next/**',
|
|
25
|
-
'out/**',
|
|
26
|
-
'next-env.d.ts',
|
|
27
|
-
],
|
|
28
|
-
},
|
|
29
|
-
...nextVitals,
|
|
30
|
-
...nextTs,
|
|
31
|
-
js.configs.recommended,
|
|
32
|
-
reactHooks.configs.flat.recommended,
|
|
33
|
-
...tseslint.configs.recommended,
|
|
34
|
-
{
|
|
35
|
-
files: ['**/*.{js,mjs,cjs,ts,jsx,tsx,ts}'],
|
|
36
|
-
plugins: {
|
|
37
|
-
react: pluginReact,
|
|
38
|
-
'react-hooks': reactHooks,
|
|
39
|
-
import: importPlugin,
|
|
40
|
-
prettier: prettierPlugin,
|
|
41
|
-
},
|
|
42
|
-
settings: {
|
|
43
|
-
react: {
|
|
44
|
-
version: 'detect',
|
|
45
|
-
},
|
|
46
|
-
},
|
|
47
|
-
rules: {
|
|
48
|
-
// React rules
|
|
49
|
-
'react/self-closing-comp': ['error', { component: true, html: true }],
|
|
50
|
-
'react/react-in-jsx-scope': 'off',
|
|
51
|
-
'react/jsx-uses-react': 'off',
|
|
52
|
-
'react/jsx-uses-vars': 'warn',
|
|
53
|
-
'react/jsx-no-undef': 'error',
|
|
54
|
-
'react/jsx-curly-brace-presence': 'error',
|
|
55
|
-
'react/prop-types': 'off',
|
|
56
|
-
'react/require-default-props': 0,
|
|
57
|
-
'react/jsx-filename-extension': 0,
|
|
58
|
-
'react/no-array-index-key': 0,
|
|
59
|
-
'react/jsx-props-no-spreading': 0,
|
|
60
|
-
|
|
61
|
-
// TypeScript rules
|
|
62
|
-
'no-unused-vars': 'off',
|
|
63
|
-
'@typescript-eslint/no-unused-vars': [
|
|
64
|
-
'error',
|
|
65
|
-
{ argsIgnorePattern: '^_' },
|
|
66
|
-
],
|
|
67
|
-
'@typescript-eslint/no-explicit-any': 'warn',
|
|
68
|
-
|
|
69
|
-
// Import rules
|
|
70
|
-
'import/order': [
|
|
71
|
-
'warn',
|
|
72
|
-
{
|
|
73
|
-
groups: [
|
|
74
|
-
'builtin',
|
|
75
|
-
'external',
|
|
76
|
-
'internal',
|
|
77
|
-
'parent',
|
|
78
|
-
'sibling',
|
|
79
|
-
'index',
|
|
80
|
-
],
|
|
81
|
-
'newlines-between': 'always',
|
|
82
|
-
},
|
|
83
|
-
],
|
|
84
|
-
'import/no-unresolved': 0,
|
|
85
|
-
'import/no-extraneous-dependencies': ['warn', { devDependencies: true }],
|
|
86
|
-
'import/extensions': 0,
|
|
87
|
-
'import/prefer-default-export': 0,
|
|
88
|
-
'import/no-anonymous-default-export': 0,
|
|
89
|
-
|
|
90
|
-
// A11y rules
|
|
91
|
-
'jsx-a11y/alt-text': 'warn',
|
|
92
|
-
'jsx-a11y/anchor-is-valid': 'warn',
|
|
93
|
-
|
|
94
|
-
// General rules
|
|
95
|
-
'prefer-const': 'error',
|
|
96
|
-
'no-console': ['warn', { allow: ['warn', 'error'] }],
|
|
97
|
-
'no-debugger': 'warn',
|
|
98
|
-
'no-nested-ternary': 0,
|
|
99
|
-
'prettier/prettier': 'error',
|
|
100
|
-
},
|
|
101
|
-
},
|
|
102
|
-
prettierConfig,
|
|
103
|
-
]);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
"target": "ES2017",
|
|
4
|
-
"lib": ["dom", "dom.iterable", "esnext"],
|
|
5
|
-
"allowJs": true,
|
|
6
|
-
"skipLibCheck": true,
|
|
7
|
-
"strict": true,
|
|
8
|
-
"noEmit": true,
|
|
9
|
-
"esModuleInterop": true,
|
|
10
|
-
"module": "esnext",
|
|
11
|
-
"moduleResolution": "bundler",
|
|
12
|
-
"resolveJsonModule": true,
|
|
13
|
-
"isolatedModules": true,
|
|
14
|
-
"jsx": "react-jsx",
|
|
15
|
-
"incremental": true,
|
|
16
|
-
"plugins": [
|
|
17
|
-
{
|
|
18
|
-
"name": "next"
|
|
19
|
-
}
|
|
20
|
-
],
|
|
21
|
-
"paths": {
|
|
22
|
-
"@/*": ["./*"]
|
|
23
|
-
}
|
|
24
|
-
},
|
|
25
|
-
"include": [
|
|
26
|
-
"next-env.d.ts",
|
|
27
|
-
"**/*.ts",
|
|
28
|
-
"**/*.tsx",
|
|
29
|
-
".next/types/**/*.ts",
|
|
30
|
-
".next/dev/types/**/*.ts",
|
|
31
|
-
"**/*.mts"
|
|
32
|
-
],
|
|
33
|
-
"exclude": ["node_modules"]
|
|
34
|
-
}
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
This is a React + TypeScript + Vite project powered by Tailwind CSS, the UNDP Design System, and the UNDP Data Visualization Library, bootstrapped with [@undp/create-app](https://www.npmjs.com/package/@undp/create-app).
|
|
2
|
-
|
|
3
|
-
It includes:
|
|
4
|
-
* React 19.x with React compiler
|
|
5
|
-
* UNDP Design System
|
|
6
|
-
* UNDP Data Visualization library
|
|
7
|
-
* TailwindCSS
|
|
8
|
-
* Code linting and formatting via ESLint and Prettier
|
|
9
|
-
|
|
10
|
-
## 🧩 Installation
|
|
11
|
-
|
|
12
|
-
This project uses `npm`.
|
|
13
|
-
|
|
14
|
-
For installation you will need to install `node` and `npm`, if you don't already have it. `node` and `npm` can be installed from [here](https://nodejs.org/en/download/).
|
|
15
|
-
|
|
16
|
-
To install the project, simply run `npm install` in the project folder in the terminal on Mac or Command Prompt on Windows.
|
|
17
|
-
|
|
18
|
-
## 🚀 Local Development
|
|
19
|
-
|
|
20
|
-
To start the project locally:
|
|
21
|
-
|
|
22
|
-
```bash
|
|
23
|
-
npm run dev
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
This is run the app in development mode. Open [http://localhost:5173/](http://localhost:5173/) to view it in the browser.
|
|
27
|
-
|
|
28
|
-
The page will reload if you make edits. You will also see any lint errors in the console.
|
|
29
|
-
|
|
30
|
-
## 📜 Available Scripts
|
|
31
|
-
|
|
32
|
-
- `npm run dev`: Executes `vite` and start the local server for local deployment.
|
|
33
|
-
- `npm run build`: Executes `tsc && vite build` and builds the app for production and deployment.
|
|
34
|
-
- `npm run preview`: Executes `vite preview` and serves the static build output (from vite build) locally.
|
|
35
|
-
- `npm run clean`: Executes `rimraf node_modules && rimraf dist && rimraf package-lock.json` and remove node_modules folder, dist folder and package-lock.json.
|
|
36
|
-
- `npm run lint`: Executes `npx eslint --fix && npx prettier . --write` and resolve all the linting and prettier errors.
|
|
37
|
-
|
|
38
|
-
## 🧰 Tooling Setup
|
|
39
|
-
|
|
40
|
-
This project uses ESLint integrated with Prettier to automatically format and lint your code.
|
|
41
|
-
|
|
42
|
-
If you’re using Visual Studio Code, install:
|
|
43
|
-
* [ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
|
|
44
|
-
* [Prettier extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
|
|
45
|
-
|
|
46
|
-
Your editor should now show linting errors and automatically fix issues where possible.
|
|
47
|
-
|
|
48
|
-
More info: [ESLint Integrations](http://eslint.org/docs/user-guide/integrations)
|
|
49
|
-
|
|
50
|
-
## 🎨 Styling
|
|
51
|
-
|
|
52
|
-
This project uses [Tailwind CSS](https://tailwindcss.com/) for styling and and includes pre-configured design tokens from the UNDP Design System.
|
|
53
|
-
|
|
54
|
-
## 🌐 Embedding the Visualization
|
|
55
|
-
|
|
56
|
-
To embed the visualization on an external page, include:
|
|
57
|
-
|
|
58
|
-
**HTML Placeholder**
|
|
59
|
-
|
|
60
|
-
```html
|
|
61
|
-
<div id="root"></div>
|
|
62
|
-
```
|
|
63
|
-
|
|
64
|
-
**Required `<script>` and `<link>` tags**
|
|
65
|
-
|
|
66
|
-
```
|
|
67
|
-
<link rel="dns-prefetch" href="{{Visualization URL}}">
|
|
68
|
-
<script defer="defer" type="module" src="{{Visualization URL}}/index.js"></script>
|
|
69
|
-
<link rel="modulepreload" crossorigin href="{{Visualization URL}}/react-{{hash}}.js">
|
|
70
|
-
<link rel="modulepreload" crossorigin href="{{Visualization URL}}/undp-{{hash}}.js">
|
|
71
|
-
<link rel="stylesheet" href="{{Visualization URL}}/style.css"></link>
|
|
72
|
-
```
|
|
73
|
-
|
|
74
|
-
## 📬 Contact us
|
|
75
|
-
|
|
76
|
-
For questions or feedback, contact us at [data@undp.org](mailto:data@undp.org).
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { H6, P } from '@undp/design-system-react/Typography';
|
|
2
|
-
|
|
3
|
-
import '@/styles/fonts.css';
|
|
4
|
-
import '@/styles/style.css';
|
|
5
|
-
|
|
6
|
-
function App() {
|
|
7
|
-
return (
|
|
8
|
-
<div className=' min-h-screen flex flex-col justify-center'>
|
|
9
|
-
<div className='flex gap-4 items-center justify-center my-8 mx-auto'>
|
|
10
|
-
<img
|
|
11
|
-
src='./imgs/Vitejs-logo.svg'
|
|
12
|
-
alt='vite logo'
|
|
13
|
-
width='72px'
|
|
14
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
15
|
-
/>
|
|
16
|
-
<P marginBottom='none'>&</P>
|
|
17
|
-
<img
|
|
18
|
-
src='./imgs/Tailwind_CSS_Logo.svg'
|
|
19
|
-
alt='tailwind logo'
|
|
20
|
-
width='72px'
|
|
21
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
22
|
-
/>
|
|
23
|
-
<P marginBottom='none'>&</P>
|
|
24
|
-
<img
|
|
25
|
-
src='./imgs/undp-logo-blue.svg'
|
|
26
|
-
alt='UNDP logo'
|
|
27
|
-
width='72px'
|
|
28
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
29
|
-
/>
|
|
30
|
-
</div>
|
|
31
|
-
<H6 marginBottom='xl' className='text-center'>
|
|
32
|
-
To get started, edit the App.tsx file.
|
|
33
|
-
</H6>
|
|
34
|
-
</div>
|
|
35
|
-
);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
export default App;
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
import path from 'path';
|
|
2
|
-
import { defineConfig } from 'vite';
|
|
3
|
-
import react from '@vitejs/plugin-react';
|
|
4
|
-
import eslint from '@nabla/vite-plugin-eslint';
|
|
5
|
-
import { visualizer } from 'rollup-plugin-visualizer';
|
|
6
|
-
import postcssNested from 'postcss-nested';
|
|
7
|
-
import tailwindcss from '@tailwindcss/postcss';
|
|
8
|
-
import { viteStaticCopy } from 'vite-plugin-static-copy';
|
|
9
|
-
|
|
10
|
-
export default defineConfig({
|
|
11
|
-
plugins: [
|
|
12
|
-
react({
|
|
13
|
-
babel: {
|
|
14
|
-
plugins: ['babel-plugin-react-compiler'],
|
|
15
|
-
},
|
|
16
|
-
}),
|
|
17
|
-
eslint(),
|
|
18
|
-
visualizer({ filename: 'stats.html', open: true }),
|
|
19
|
-
viteStaticCopy({
|
|
20
|
-
targets: [{ src: 'staticwebapp.config.json', dest: '' }],
|
|
21
|
-
}),
|
|
22
|
-
],
|
|
23
|
-
css: {
|
|
24
|
-
postcss: {
|
|
25
|
-
plugins: [
|
|
26
|
-
postcssNested(),
|
|
27
|
-
tailwindcss(),
|
|
28
|
-
{
|
|
29
|
-
postcssPlugin: 'move-media-queries-last', // If you want to reorder media queries to the end
|
|
30
|
-
OnceExit(root) {
|
|
31
|
-
const mediaQueries = [];
|
|
32
|
-
|
|
33
|
-
// Collect all media queries
|
|
34
|
-
root.walkAtRules('media', mediaRule => {
|
|
35
|
-
mediaQueries.push(mediaRule.clone());
|
|
36
|
-
mediaRule.remove();
|
|
37
|
-
});
|
|
38
|
-
|
|
39
|
-
// Append them at the end
|
|
40
|
-
mediaQueries.forEach(mediaQuery => {
|
|
41
|
-
root.append(mediaQuery);
|
|
42
|
-
});
|
|
43
|
-
},
|
|
44
|
-
},
|
|
45
|
-
],
|
|
46
|
-
},
|
|
47
|
-
},
|
|
48
|
-
build: {
|
|
49
|
-
manifest: true,
|
|
50
|
-
cssCodeSplit: false,
|
|
51
|
-
rollupOptions: {
|
|
52
|
-
output: {
|
|
53
|
-
manualChunks(id) {
|
|
54
|
-
if (id.includes('node_modules/react')) return 'react';
|
|
55
|
-
if (id.includes('@undp/design-system-react')) return 'undp';
|
|
56
|
-
if (id.includes('@undp/data-viz')) return 'undp';
|
|
57
|
-
},
|
|
58
|
-
chunkFileNames: '[name]-[hash].js',
|
|
59
|
-
assetFileNames: '[name].[ext]',
|
|
60
|
-
entryFileNames: '[name].js',
|
|
61
|
-
},
|
|
62
|
-
treeshake: true,
|
|
63
|
-
},
|
|
64
|
-
},
|
|
65
|
-
server: {
|
|
66
|
-
cors: {
|
|
67
|
-
origin: '*',
|
|
68
|
-
methods: ['GET'],
|
|
69
|
-
preflightContinue: false,
|
|
70
|
-
optionsSuccessStatus: 204,
|
|
71
|
-
},
|
|
72
|
-
},
|
|
73
|
-
resolve: { alias: { '@': path.resolve(__dirname, './src') } },
|
|
74
|
-
});
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
This is a React + TypeScript + Vite project powered by Tailwind CSS, the UNDP Design System, and the UNDP Data Visualization Library, bootstrapped with [@undp/create-app](https://www.npmjs.com/package/@undp/create-app).
|
|
2
|
-
|
|
3
|
-
It includes:
|
|
4
|
-
* React 19.x with React compiler
|
|
5
|
-
* UNDP Design System
|
|
6
|
-
* UNDP Data Visualization library
|
|
7
|
-
* Data fetching with [TanStack Query](https://tanstack.com/query)
|
|
8
|
-
* TailwindCSS
|
|
9
|
-
* Code linting and formatting via ESLint and Prettier
|
|
10
|
-
|
|
11
|
-
## 🧩 Installation
|
|
12
|
-
|
|
13
|
-
This project uses `npm`.
|
|
14
|
-
|
|
15
|
-
For installation you will need to install `node` and `npm`, if you don't already have it. `node` and `npm` can be installed from [here](https://nodejs.org/en/download/).
|
|
16
|
-
|
|
17
|
-
To install the project, simply run `npm install` in the project folder in the terminal on Mac or Command Prompt on Windows.
|
|
18
|
-
|
|
19
|
-
## 🚀 Local Development
|
|
20
|
-
|
|
21
|
-
To start the project locally:
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
npm run dev
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
This is run the app in development mode. Open [http://localhost:5173/](http://localhost:5173/) to view it in the browser.
|
|
28
|
-
|
|
29
|
-
The page will reload if you make edits. You will also see any lint errors in the console.
|
|
30
|
-
|
|
31
|
-
## 📜 Available Scripts
|
|
32
|
-
|
|
33
|
-
- `npm run dev`: Executes `vite` and start the local server for local deployment.
|
|
34
|
-
- `npm run build`: Executes `tsc && vite build` and builds the app for production and deployment.
|
|
35
|
-
- `npm run preview`: Executes `vite preview` and serves the static build output (from vite build) locally.
|
|
36
|
-
- `npm run clean`: Executes `rimraf node_modules && rimraf dist && rimraf package-lock.json` and remove node_modules folder, dist folder and package-lock.json.
|
|
37
|
-
- `npm run lint`: Executes `npx eslint --fix && npx prettier . --write` and resolve all the linting and prettier errors.
|
|
38
|
-
|
|
39
|
-
## 🧰 Tooling Setup
|
|
40
|
-
|
|
41
|
-
This project uses ESLint integrated with Prettier to automatically format and lint your code.
|
|
42
|
-
|
|
43
|
-
If you’re using Visual Studio Code, install:
|
|
44
|
-
* [ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
|
|
45
|
-
* [Prettier extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
|
|
46
|
-
|
|
47
|
-
Your editor should now show linting errors and automatically fix issues where possible.
|
|
48
|
-
|
|
49
|
-
More info: [ESLint Integrations](http://eslint.org/docs/user-guide/integrations)
|
|
50
|
-
|
|
51
|
-
## 🎨 Styling
|
|
52
|
-
|
|
53
|
-
This project uses [Tailwind CSS](https://tailwindcss.com/) for styling and and includes pre-configured design tokens from the UNDP Design System.
|
|
54
|
-
|
|
55
|
-
## 🔍 Data Fetching
|
|
56
|
-
|
|
57
|
-
Data fetching is powered by [TanStack Query](https://tanstack.com/query) for efficient, declarative data fetching and caching.
|
|
58
|
-
|
|
59
|
-
## 🌐 Embedding the Visualization
|
|
60
|
-
|
|
61
|
-
To embed the visualization on an external page, include:
|
|
62
|
-
|
|
63
|
-
**HTML Placeholder**
|
|
64
|
-
|
|
65
|
-
```html
|
|
66
|
-
<div id="root"></div>
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
**Required `<script>` and `<link>` tags**
|
|
70
|
-
```
|
|
71
|
-
<link rel="dns-prefetch" href="{{Visualization URL}}">
|
|
72
|
-
<script defer="defer" type="module" src="{{Visualization URL}}/index.js"></script>
|
|
73
|
-
<link rel="modulepreload" crossorigin href="{{Visualization URL}}/react-{{hash}}.js">
|
|
74
|
-
<link rel="modulepreload" crossorigin href="{{Visualization URL}}/undp-{{hash}}.js">
|
|
75
|
-
<link rel="stylesheet" href="{{Visualization URL}}/style.css"></link>
|
|
76
|
-
```
|
|
77
|
-
|
|
78
|
-
## 📬 Contact us
|
|
79
|
-
|
|
80
|
-
For questions or feedback, contact us at [data@undp.org](mailto:data@undp.org).
|
|
Binary file
|
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
This is a React + TypeScript + Vite project powered by Tailwind CSS, the UNDP Design System, and the UNDP Data Visualization Library, bootstrapped with [@undp/create-app](https://www.npmjs.com/package/@undp/create-app).
|
|
2
|
-
|
|
3
|
-
It includes:
|
|
4
|
-
* React 19.x with React compiler
|
|
5
|
-
* UNDP Design System
|
|
6
|
-
* UNDP Data Visualization library
|
|
7
|
-
* Routing with [TanStack Router](https://tanstack.com/router)
|
|
8
|
-
* Data fetching with [TanStack Query](https://tanstack.com/query)
|
|
9
|
-
* TailwindCSS
|
|
10
|
-
* Code linting and formatting via ESLint and Prettier
|
|
11
|
-
|
|
12
|
-
## 🧩 Installation
|
|
13
|
-
|
|
14
|
-
This project uses `npm`.
|
|
15
|
-
|
|
16
|
-
For installation you will need to install `node` and `npm`, if you don't already have it. `node` and `npm` can be installed from [here](https://nodejs.org/en/download/).
|
|
17
|
-
|
|
18
|
-
To install the project, simply run `npm install` in the project folder in the terminal on Mac or Command Prompt on Windows.
|
|
19
|
-
|
|
20
|
-
## 🚀 Local Development
|
|
21
|
-
|
|
22
|
-
To start the project locally:
|
|
23
|
-
|
|
24
|
-
```bash
|
|
25
|
-
npm run dev
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
This is run the app in development mode. Open [http://localhost:5173/](http://localhost:5173/) to view it in the browser.
|
|
29
|
-
|
|
30
|
-
The page will reload if you make edits. You will also see any lint errors in the console.
|
|
31
|
-
|
|
32
|
-
## 📜 Available Scripts
|
|
33
|
-
|
|
34
|
-
- `npm run dev`: Executes `vite` and start the local server for local deployment.
|
|
35
|
-
- `npm run build`: Executes `tsc && vite build` and builds the app for production and deployment.
|
|
36
|
-
- `npm run preview`: Executes `vite preview` and serves the static build output (from vite build) locally.
|
|
37
|
-
- `npm run clean`: Executes `rimraf node_modules && rimraf dist && rimraf package-lock.json` and remove node_modules folder, dist folder and package-lock.json.
|
|
38
|
-
- `npm run lint`: Executes `npx eslint --fix && npx prettier . --write` and resolve all the linting and prettier errors.
|
|
39
|
-
|
|
40
|
-
## 🧰 Tooling Setup
|
|
41
|
-
|
|
42
|
-
This project uses ESLint integrated with Prettier to automatically format and lint your code.
|
|
43
|
-
|
|
44
|
-
If you’re using Visual Studio Code, install:
|
|
45
|
-
* [ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
|
|
46
|
-
* [Prettier extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
|
|
47
|
-
|
|
48
|
-
Your editor should now show linting errors and automatically fix issues where possible.
|
|
49
|
-
|
|
50
|
-
More info: [ESLint Integrations](http://eslint.org/docs/user-guide/integrations)
|
|
51
|
-
|
|
52
|
-
## 🎨 Styling
|
|
53
|
-
|
|
54
|
-
This project uses [Tailwind CSS](https://tailwindcss.com/) for styling and and includes pre-configured design tokens from the UNDP Design System.
|
|
55
|
-
|
|
56
|
-
## 🧭 Routing
|
|
57
|
-
|
|
58
|
-
Routing is powered by [TanStack Router](https://tanstack.com/router) and uses a code-based configuration (in the `./src/main.tsx`).
|
|
59
|
-
|
|
60
|
-
### Adding A Route
|
|
61
|
-
|
|
62
|
-
Example: add an `/about` route:
|
|
63
|
-
|
|
64
|
-
```tsx
|
|
65
|
-
const aboutRoute = createRoute({
|
|
66
|
-
getParentRoute: () => rootRoute,
|
|
67
|
-
path: "/about",
|
|
68
|
-
component: () => <h1>About</h1>,
|
|
69
|
-
});
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
Then, register it in your `routeTree`:
|
|
73
|
-
|
|
74
|
-
```tsx
|
|
75
|
-
const routeTree = rootRoute.addChildren([indexRoute, aboutRoute]);
|
|
76
|
-
```
|
|
77
|
-
|
|
78
|
-
You can define your component in another file:
|
|
79
|
-
|
|
80
|
-
```tsx
|
|
81
|
-
import About from "./components/About.tsx";
|
|
82
|
-
|
|
83
|
-
const aboutRoute = createRoute({
|
|
84
|
-
getParentRoute: () => rootRoute,
|
|
85
|
-
path: "/about",
|
|
86
|
-
component: About,
|
|
87
|
-
});
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
More info: [Code Based Routing](https://tanstack.com/router/latest/docs/framework/react/guide/code-based-routing).
|
|
91
|
-
|
|
92
|
-
Now that you have two routes you can use a `Link` component to navigate between them.
|
|
93
|
-
|
|
94
|
-
### Adding Links
|
|
95
|
-
|
|
96
|
-
Use the `Link` component for client-side navigation:
|
|
97
|
-
|
|
98
|
-
```tsx
|
|
99
|
-
import { Link } from "@tanstack/react-router";
|
|
100
|
-
|
|
101
|
-
<Link to="/about">About</Link>
|
|
102
|
-
```
|
|
103
|
-
|
|
104
|
-
More info: [Link documentation](https://tanstack.com/router/v1/docs/framework/react/api/router/linkComponent).
|
|
105
|
-
|
|
106
|
-
## 🔍 Data Fetching
|
|
107
|
-
|
|
108
|
-
Data fetching is powered by [TanStack Query](https://tanstack.com/query) for efficient, declarative data fetching and caching.
|
|
109
|
-
|
|
110
|
-
## 📬 Contact us
|
|
111
|
-
|
|
112
|
-
For questions or feedback, contact us at [data@undp.org](mailto:data@undp.org).
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import { H6, P } from '@undp/design-system-react/Typography';
|
|
2
|
-
|
|
3
|
-
function App() {
|
|
4
|
-
return (
|
|
5
|
-
<>
|
|
6
|
-
<div className='flex gap-4 items-center justify-center my-8 mx-auto'>
|
|
7
|
-
<img
|
|
8
|
-
src='./imgs/Vitejs-logo.svg'
|
|
9
|
-
alt='vite logo'
|
|
10
|
-
width='72px'
|
|
11
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
12
|
-
/>
|
|
13
|
-
<P marginBottom='none'>&</P>
|
|
14
|
-
<img
|
|
15
|
-
src='./imgs/Tailwind_CSS_Logo.svg'
|
|
16
|
-
alt='tailwind logo'
|
|
17
|
-
width='72px'
|
|
18
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
19
|
-
/>
|
|
20
|
-
<P marginBottom='none'>&</P>
|
|
21
|
-
<img
|
|
22
|
-
src='./imgs/logo-color-600.png'
|
|
23
|
-
alt='tanstack logo'
|
|
24
|
-
width='72px'
|
|
25
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
26
|
-
/>
|
|
27
|
-
<P marginBottom='none'>&</P>
|
|
28
|
-
<img
|
|
29
|
-
src='./imgs/undp-logo-blue.svg'
|
|
30
|
-
alt='UNDP logo'
|
|
31
|
-
width='72px'
|
|
32
|
-
style={{ marginLeft: 'auto', marginRight: 'auto' }}
|
|
33
|
-
/>
|
|
34
|
-
</div>
|
|
35
|
-
<H6 marginBottom='xl' className='text-center'>
|
|
36
|
-
To get started, edit the App.tsx file.
|
|
37
|
-
</H6>
|
|
38
|
-
</>
|
|
39
|
-
);
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
export default App;
|