damien/neroshitron
1
0
Fork 0
mirror of https://github.com/D4M13N-D3V/neroshitron.git synced 2025-06-16 13:19:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore:(setup tamagui)

Browse Source
This commit is contained in:
Damien Ostler 2024-05-21 23:04:57 -04:00
parent da8ebf69da
commit 5a37846d1f
13 changed files with 57439 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43130
.tamagui/tamagui-components.config.cjs Normal file
View File

File diff suppressed because it is too large Load Diff

0
.tamagui/tamagui.config.cjs Normal file
View File

1
README.md
View File

@ -3,7 +3,6 @@
## Development ## Development
### Setting Up For Development ### Setting Up For Development
1) Open your terminal and navigate to the root folder of the git repository. 1) Open your terminal and navigate to the root folder of the git repository.
2) Run the command `npm update`. 2) Run the command `npm update`.
3) Once the depedencies are pulled and installed you can run the command `npm run dev` to run the application in development mode. 3) Once the depedencies are pulled and installed you can run the command `npm run dev` to run the application in development mode.

5
next-env.d.ts vendored Normal file
View File

@ -0,0 +1,5 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
// NOTE: This file should not be edited
// see https://nextjs.org/docs/basic-features/typescript for more information.

16
next.config.js Normal file
View File

@ -0,0 +1,16 @@
const { withTamagui } = require('@tamagui/next-plugin')
module.exports = function (name, { defaultConfig }) {
let config = {
...defaultConfig,
// ...your configuration
}
const tamaguiPlugin = withTamagui({
config: './tamagui.config.ts',
components: ['tamagui'],
})
return {
...config,
...tamaguiPlugin(config),
}
}

14061
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

11
package.json
View File

@ -1,13 +1,22 @@
{ {
"dependencies": { "dependencies": {
"@tamagui/config": "^1.98.2",
"@tamagui/next-plugin": "^1.98.2",
"@tamagui/next-theme": "^1.98.2",
"next": "^14.2.3", "next": "^14.2.3",
"react": "^18.3.1", "react": "^18.3.1",
"react-dom": "^18.3.1" "react-dom": "^18.3.1",
"react-native-web": "^0.19.11",
"tamagui": "^1.98.2"
}, },
"scripts": { "scripts": {
"dev": "next dev", "dev": "next dev",
"build": "next build", "build": "next build",
"start": "next start", "start": "next start",
"lint": "next lint" "lint": "next lint"
},
"devDependencies": {
"@types/react": "18.3.2",
"typescript": "5.4.5"
} }
} }

69
pages/_app.tsx Normal file
View File

@ -0,0 +1,69 @@
// Optional: add the reset to get more consistent styles across browsers
import '@tamagui/core/reset.css'
import { NextThemeProvider, useRootTheme } from '@tamagui/next-theme'
import { AppProps } from 'next/app'
import Head from 'next/head'
import React, { useMemo } from 'react'
import { TamaguiProvider, createTamagui } from 'tamagui'
import { config } from '@tamagui/config/v3'
const tamaguiConfig = createTamagui(config)
// you usually export this from a tamagui.config.ts file:
// import tamaguiConfig from '../tamagui.config'
// make TypeScript type everything based on your config
type Conf = typeof tamaguiConfig
declare module '@tamagui/core' {
interface TamaguiCustomConfig extends Conf {}
}
export default function App({ Component, pageProps }: AppProps) {
const [theme, setTheme] = useRootTheme()
// memo to avoid re-render on dark/light change
const contents = useMemo(() => {
return <Component {...pageProps} />
}, [pageProps])
return (
<NextThemeProvider onChangeTheme={setTheme as any}>
<Head>
<script
dangerouslySetInnerHTML={{
// avoid flash of animated things on enter:
__html: `document.documentElement.classList.add('t_unmounted')`,
}}
/>
</Head>
<TamaguiProvider
config={tamaguiConfig}
disableInjectCSS
disableRootThemeClass
defaultTheme={theme}
>
{contents}
</TamaguiProvider>
</NextThemeProvider>
)
}

89
pages/_document.tsx Normal file
View File

@ -0,0 +1,89 @@
import NextDocument, {
DocumentContext,
Head,
Html,
Main,
NextScript,
} from 'next/document'
import { StyleSheet } from 'react-native'
import { config } from '@tamagui/config/v3'
import { createTamagui } from 'tamagui'
const tamaguiConfig = createTamagui(config)
// you usually export this from a tamagui.config.ts file:
// import tamaguiConfig from '../tamagui.config'
export default class Document extends NextDocument {
static async getInitialProps({ renderPage }: DocumentContext) {
const page = await renderPage()
// @ts-ignore RN doesn't have this type
const rnwStyle = StyleSheet.getSheet()
return {
...page,
styles: (
<>
<style
id={rnwStyle.id}
dangerouslySetInnerHTML={{ __html: rnwStyle.textContent }}
/>
<style
dangerouslySetInnerHTML={{
__html: tamaguiConfig.getCSS(),
}}
/>
</>
),
}
}
render() {
return (
<Html lang="en">
<Head>
<meta id="theme-color" name="theme-color" />
<meta name="color-scheme" content="light dark" />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}

7
pages/index.js
View File

@ -1,7 +0,0 @@
export default function Home() {
return (
<h1>
Test
</h1>
)
}

18
pages/index.tsx Normal file
View File

@ -0,0 +1,18 @@
import { useState } from 'react'
import { Button, useIsomorphicLayoutEffect } from 'tamagui'
import { useThemeSetting } from '@tamagui/next-theme'
export default function Home() {
const themeSetting = useThemeSetting()
const [clientTheme, setClientTheme] = useState<string>('dark')
useIsomorphicLayoutEffect(() => {
setClientTheme(themeSetting.current || 'dark')
}, [themeSetting.current, themeSetting.resolvedTheme])
return <Button onPress={themeSetting.toggle}>Change theme: {clientTheme}</Button>
}

14
tamagui.config.ts Normal file
View File

@ -0,0 +1,14 @@
import { config } from '@tamagui/config/v3'
import { createTamagui } from 'tamagui'
const tamaguiConfig = createTamagui(config)
// this makes typescript properly type everything based on the config
type Conf = typeof tamaguiConfig
declare module 'tamagui' {
interface TamaguiCustomConfig extends Conf {}
}
export default tamaguiConfig

28
tsconfig.json Normal file
View File

@ -0,0 +1,28 @@
{
"compilerOptions": {
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"strict": false,
"noEmit": true,
"incremental": true,
"module": "esnext",
"esModuleInterop": true,
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve"
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx"
],
"exclude": [
"node_modules"
]
}