aport-tools 1.0.11 → 2.0.1
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/.babelrc +7 -0
- package/.expo/README.md +15 -0
- package/.expo/devices.json +3 -0
- package/.expo/settings.json +8 -0
- package/App.tsx +41 -0
- package/dist/Button.d.ts +12 -0
- package/dist/Theme/ThemeContext.d.ts +13 -0
- package/dist/Theme/ThemeToggle.d.ts +3 -0
- package/dist/Theme/index.d.ts +2 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.esm.js +258 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +262 -0
- package/dist/index.js.map +1 -0
- package/dist/styles/colors.d.ts +17 -0
- package/dist/styles/theme.d.ts +4 -0
- package/package.json +33 -8
- package/rollup.config.mjs +54 -0
- package/rollup.config.js +0 -31
- package/src/Button.tsx +0 -104
- package/src/components/ThemeToggle.tsx +0 -39
- package/src/context/ThemeContext.tsx +0 -70
- package/src/styles/colors.ts +0 -60
- package/src/styles/theme.ts +0 -50
- package/tsconfig.json +0 -30
@@ -1,70 +0,0 @@
|
|
1
|
-
// src/context/ThemeContext.tsx
|
2
|
-
|
3
|
-
import React, { createContext, useState, useEffect, ReactNode } from 'react';
|
4
|
-
import { Appearance, ColorSchemeName } from 'react-native';
|
5
|
-
import AsyncStorage from '@react-native-async-storage/async-storage';
|
6
|
-
import { lightTheme, darkTheme, ThemeColors } from '../styles/colors';
|
7
|
-
import { Theme } from '../styles/theme';
|
8
|
-
|
9
|
-
interface ThemeContextProps {
|
10
|
-
theme: Theme;
|
11
|
-
toggleTheme: () => void;
|
12
|
-
}
|
13
|
-
|
14
|
-
export const ThemeContext = createContext<ThemeContextProps>({
|
15
|
-
theme: { colors: lightTheme },
|
16
|
-
toggleTheme: () => {},
|
17
|
-
});
|
18
|
-
|
19
|
-
interface ThemeProviderProps {
|
20
|
-
children: ReactNode;
|
21
|
-
}
|
22
|
-
|
23
|
-
export const ThemeProvider: React.FC<ThemeProviderProps> = ({ children }) => {
|
24
|
-
const [colorScheme, setColorScheme] = useState<ColorSchemeName | null>(null);
|
25
|
-
|
26
|
-
useEffect(() => {
|
27
|
-
const loadTheme = async () => {
|
28
|
-
try {
|
29
|
-
const storedTheme = await AsyncStorage.getItem('theme');
|
30
|
-
if (storedTheme === 'dark' || storedTheme === 'light') {
|
31
|
-
setColorScheme(storedTheme);
|
32
|
-
} else {
|
33
|
-
const systemTheme = Appearance.getColorScheme();
|
34
|
-
setColorScheme(systemTheme);
|
35
|
-
}
|
36
|
-
} catch (error) {
|
37
|
-
console.error('Failed to load theme.', error);
|
38
|
-
setColorScheme(Appearance.getColorScheme());
|
39
|
-
}
|
40
|
-
};
|
41
|
-
|
42
|
-
loadTheme();
|
43
|
-
|
44
|
-
const subscription = Appearance.addChangeListener(({ colorScheme }) => {
|
45
|
-
setColorScheme(colorScheme);
|
46
|
-
});
|
47
|
-
|
48
|
-
return () => subscription.remove();
|
49
|
-
}, []);
|
50
|
-
|
51
|
-
const toggleTheme = async () => {
|
52
|
-
try {
|
53
|
-
const newTheme = colorScheme === 'dark' ? 'light' : 'dark';
|
54
|
-
setColorScheme(newTheme);
|
55
|
-
await AsyncStorage.setItem('theme', newTheme);
|
56
|
-
} catch (error) {
|
57
|
-
console.error('Failed to toggle theme.', error);
|
58
|
-
}
|
59
|
-
};
|
60
|
-
|
61
|
-
const theme: Theme = {
|
62
|
-
colors: colorScheme === 'dark' ? darkTheme : lightTheme,
|
63
|
-
};
|
64
|
-
|
65
|
-
return (
|
66
|
-
<ThemeContext.Provider value={{ theme, toggleTheme }}>
|
67
|
-
{children}
|
68
|
-
</ThemeContext.Provider>
|
69
|
-
);
|
70
|
-
};
|
package/src/styles/colors.ts
DELETED
@@ -1,60 +0,0 @@
|
|
1
|
-
// src/styles/colors.ts
|
2
|
-
|
3
|
-
export interface RGB {
|
4
|
-
r: number;
|
5
|
-
g: number;
|
6
|
-
b: number;
|
7
|
-
}
|
8
|
-
|
9
|
-
export interface Color {
|
10
|
-
hex: string;
|
11
|
-
rgb: RGB;
|
12
|
-
}
|
13
|
-
|
14
|
-
export interface ThemeColors {
|
15
|
-
primary: Color;
|
16
|
-
secondary: Color;
|
17
|
-
background: Color;
|
18
|
-
text: Color;
|
19
|
-
// Add more categories as needed
|
20
|
-
}
|
21
|
-
|
22
|
-
export const lightTheme: ThemeColors = {
|
23
|
-
primary: {
|
24
|
-
hex: '#1A73E8',
|
25
|
-
rgb: { r: 26, g: 115, b: 232 },
|
26
|
-
},
|
27
|
-
secondary: {
|
28
|
-
hex: '#F0F6FF',
|
29
|
-
rgb: { r: 240, g: 246, b: 255 },
|
30
|
-
},
|
31
|
-
background: {
|
32
|
-
hex: '#FFFFFF',
|
33
|
-
rgb: { r: 255, g: 255, b: 255 },
|
34
|
-
},
|
35
|
-
text: {
|
36
|
-
hex: '#000000',
|
37
|
-
rgb: { r: 0, g: 0, b: 0 },
|
38
|
-
},
|
39
|
-
// Add more categories as needed
|
40
|
-
};
|
41
|
-
|
42
|
-
export const darkTheme: ThemeColors = {
|
43
|
-
primary: {
|
44
|
-
hex: '#BB86FC',
|
45
|
-
rgb: { r: 187, g: 134, b: 252 },
|
46
|
-
},
|
47
|
-
secondary: {
|
48
|
-
hex: '#03DAC6',
|
49
|
-
rgb: { r: 3, g: 218, b: 198 },
|
50
|
-
},
|
51
|
-
background: {
|
52
|
-
hex: '#121212',
|
53
|
-
rgb: { r: 18, g: 18, b: 18 },
|
54
|
-
},
|
55
|
-
text: {
|
56
|
-
hex: '#FFFFFF',
|
57
|
-
rgb: { r: 255, g: 255, b: 255 },
|
58
|
-
},
|
59
|
-
// Add more categories as needed
|
60
|
-
};
|
package/src/styles/theme.ts
DELETED
@@ -1,50 +0,0 @@
|
|
1
|
-
// src/styles/theme.ts
|
2
|
-
|
3
|
-
import { ThemeColors } from "./colors";
|
4
|
-
|
5
|
-
// Define the light theme with full ThemeColors structure
|
6
|
-
export const lightTheme: ThemeColors = {
|
7
|
-
primary: {
|
8
|
-
hex: "#1A73E8",
|
9
|
-
rgb: { r: 26, g: 115, b: 232 },
|
10
|
-
},
|
11
|
-
secondary: {
|
12
|
-
hex: "#F0F6FF",
|
13
|
-
rgb: { r: 240, g: 246, b: 255 },
|
14
|
-
},
|
15
|
-
background: {
|
16
|
-
hex: "#FFFFFF",
|
17
|
-
rgb: { r: 255, g: 255, b: 255 },
|
18
|
-
},
|
19
|
-
text: {
|
20
|
-
hex: "#000000",
|
21
|
-
rgb: { r: 0, g: 0, b: 0 },
|
22
|
-
},
|
23
|
-
};
|
24
|
-
|
25
|
-
// Define the dark theme with full ThemeColors structure
|
26
|
-
export const darkTheme: ThemeColors = {
|
27
|
-
primary: {
|
28
|
-
hex: "#BB86FC",
|
29
|
-
rgb: { r: 187, g: 134, b: 252 },
|
30
|
-
},
|
31
|
-
secondary: {
|
32
|
-
hex: "#03DAC6",
|
33
|
-
rgb: { r: 3, g: 218, b: 198 },
|
34
|
-
},
|
35
|
-
background: {
|
36
|
-
hex: "#121212",
|
37
|
-
rgb: { r: 18, g: 18, b: 18 },
|
38
|
-
},
|
39
|
-
text: {
|
40
|
-
hex: "#FFFFFF",
|
41
|
-
rgb: { r: 255, g: 255, b: 255 },
|
42
|
-
},
|
43
|
-
};
|
44
|
-
|
45
|
-
// src/styles/theme.ts
|
46
|
-
|
47
|
-
export interface Theme {
|
48
|
-
colors: ThemeColors;
|
49
|
-
}
|
50
|
-
|
package/tsconfig.json
DELETED
@@ -1,30 +0,0 @@
|
|
1
|
-
{
|
2
|
-
"compilerOptions": {
|
3
|
-
"outDir": "dist",
|
4
|
-
"module": "ES6",
|
5
|
-
"target": "ES5",
|
6
|
-
"lib": [
|
7
|
-
"ES2015",
|
8
|
-
"DOM"
|
9
|
-
],
|
10
|
-
"jsx": "react-native",
|
11
|
-
"declaration": true,
|
12
|
-
"esModuleInterop": true,
|
13
|
-
"forceConsistentCasingInFileNames": true,
|
14
|
-
"strict": true,
|
15
|
-
"skipLibCheck": true,
|
16
|
-
"moduleResolution": "node",
|
17
|
-
"types": [
|
18
|
-
"react",
|
19
|
-
"react-native"
|
20
|
-
]
|
21
|
-
},
|
22
|
-
"include": [
|
23
|
-
"src", "index.ts" ],
|
24
|
-
"exclude": [
|
25
|
-
"node_modules",
|
26
|
-
"dist",
|
27
|
-
"App.tsx"
|
28
|
-
],
|
29
|
-
"extends": "expo/tsconfig.base"
|
30
|
-
}
|