Skip to content

Commit 757f33d

Browse files
dannyhwdannyhw
authored
chore: update expo, ts and emotion (#498)
1 parent a316465 commit 757f33d

40 files changed

+1237
-951
lines changed

‎.prettierignore

+1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
.yarn
2+
dist/

‎check-matching-deps.ts

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import glob from 'glob';
2+
import pkg from './package.json';
3+
4+
const packageGlobs = pkg.workspaces.packages;
5+
console.log('packageGlobs', packageGlobs);
6+
7+
const packages = packageGlobs
8+
.map((packageName) => {
9+
return glob.sync(`./${packageName}/package.json`);
10+
})
11+
.flat();
12+
13+
console.log('checking the following locations ', packages);
14+
15+
type DepsComparison = Record<string, Record<string, string>>;
16+
17+
const depsLookup = packages.reduce((dependenciesMap, packagePath) => {
18+
const json = require(packagePath);
19+
20+
const deps: [string, string][] = Object.entries(json.dependencies ?? {});
21+
22+
const devDeps: [string, string][] = Object.entries(json.devDependencies ?? {});
23+
24+
const currentDependencies = deps.concat(devDeps);
25+
26+
return currentDependencies.reduce((depsMapSoFar, [currentDependency, version]) => {
27+
if (!depsMapSoFar[currentDependency]) {
28+
depsMapSoFar[currentDependency] = {
29+
[json.name]: version,
30+
};
31+
} else {
32+
depsMapSoFar[currentDependency][json.name] = version;
33+
}
34+
35+
return depsMapSoFar;
36+
}, dependenciesMap);
37+
}, {} as DepsComparison);
38+
39+
console.log('checking for mismatched versions of dependencies');
40+
41+
let sum = 0;
42+
43+
Object.entries(depsLookup).forEach(([dependency, versionsMap]) => {
44+
const versionValues = Object.values(versionsMap);
45+
46+
if (versionValues.length > 1 && versionValues.some((v) => v !== versionValues[0])) {
47+
console.log({ dependency, versionsMap });
48+
49+
sum++;
50+
}
51+
});
52+
53+
console.log(`found ${sum} mismatched versions`);

‎examples/expo-example/package.json

+16-16
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "expo-example",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"private": true,
55
"main": "index.js",
66
"scripts": {
@@ -17,36 +17,36 @@
1717
"web": "expo start --web"
1818
},
1919
"dependencies": {
20-
"@react-native-async-storage/async-storage": "1.17.11",
21-
"@react-native-community/datetimepicker": "6.7.3",
20+
"@react-native-async-storage/async-storage": "1.18.2",
21+
"@react-native-community/datetimepicker": "7.2.0",
2222
"@react-native-community/slider": "4.4.2",
2323
"@storybook/addon-actions": "^6.5.14",
2424
"@storybook/addon-essentials": "^6.5.14",
2525
"@storybook/addon-knobs": "^6.4.0",
2626
"@storybook/addon-links": "^6.5.14",
27-
"@storybook/addon-ondevice-actions": "^6.5.5-alpha.0",
28-
"@storybook/addon-ondevice-backgrounds": "^6.5.5-alpha.0",
29-
"@storybook/addon-ondevice-controls": "^6.5.5-alpha.0",
30-
"@storybook/addon-ondevice-knobs": "^6.5.5-alpha.0",
31-
"@storybook/addon-ondevice-notes": "^6.5.5-alpha.0",
27+
"@storybook/addon-ondevice-actions": "^6.5.5-alpha.1",
28+
"@storybook/addon-ondevice-backgrounds": "^6.5.5-alpha.1",
29+
"@storybook/addon-ondevice-controls": "^6.5.5-alpha.1",
30+
"@storybook/addon-ondevice-knobs": "^6.5.5-alpha.1",
31+
"@storybook/addon-ondevice-notes": "^6.5.5-alpha.1",
3232
"@storybook/addons": "^6.5.14",
3333
"@storybook/builder-webpack5": "^6.5.16",
3434
"@storybook/docs-tools": "^6.5.14",
3535
"@storybook/manager-webpack5": "^6.5.16",
3636
"@storybook/react": "^6.5.14",
37-
"@storybook/react-native": "^6.5.5-alpha.0",
38-
"@storybook/react-native-server": "^6.5.5-alpha.0",
39-
"expo": "^48.0.4",
37+
"@storybook/react-native": "^6.5.5-alpha.1",
38+
"@storybook/react-native-server": "^6.5.5-alpha.1",
39+
"expo": "^49.0.3",
4040
"react": "18.2.0",
4141
"react-dom": "18.2.0",
42-
"react-native": "0.71.8",
43-
"react-native-safe-area-context": "4.5.0",
44-
"react-native-web": "~0.18.10"
42+
"react-native": "0.72.3",
43+
"react-native-safe-area-context": "4.6.3",
44+
"react-native-web": "~0.19.6"
4545
},
4646
"devDependencies": {
4747
"@babel/core": "^7.19.3",
48-
"@types/react": "~18.0.27",
48+
"@types/react": "~18.2.14",
4949
"babel-plugin-react-docgen-typescript": "^1.5.1",
50-
"typescript": "^4.8.4"
50+
"typescript": "^5.1.3"
5151
}
5252
}

‎lerna.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,5 @@
22
"npmClient": "yarn",
33
"useWorkspaces": true,
44
"registry": "https://registry.npmjs.org",
5-
"version": "6.5.5-alpha.0"
5+
"version": "6.5.5-alpha.1"
66
}

‎package.json

+4-2
Original file line numberDiff line numberDiff line change
@@ -40,13 +40,15 @@
4040
"publish:alpha": "yarn lerna publish from-git --dist-tag alpha",
4141
"publish:latest": "yarn lerna publish from-git --dist-tag latest",
4242
"publish:next": "yarn lerna publish from-git --dist-tag next",
43-
"test": "lerna run test"
43+
"test": "lerna run test",
44+
"check-mismatched-deps": "ts-node ./check-matching-deps.ts"
4445
},
4546
"devDependencies": {
4647
"lerna": "^6.6.1",
4748
"cross-env": "^7.0.3",
4849
"eslint": "8.24.0",
49-
"@react-native/eslint-config": "^0.72.1"
50+
"@react-native/eslint-config": "^0.72.1",
51+
"typescript": "^5.1.3"
5052
},
5153
"resolutions": {
5254
"telejson": "^7.0.4"

‎packages/ondevice-actions/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@storybook/addon-ondevice-actions",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"description": "Action Logger addon for react-native storybook",
55
"keywords": [
66
"storybook"

‎packages/ondevice-backgrounds/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@storybook/addon-ondevice-backgrounds",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"description": "A react-native storybook addon to show different backgrounds for your preview",
55
"keywords": [
66
"addon",

‎packages/ondevice-controls/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@storybook/addon-ondevice-controls",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"description": "Display storybook controls on your device.",
55
"keywords": [
66
"addon",
@@ -30,10 +30,11 @@
3030
"copyimages": "cross-env-shell cp -r src/components/color-picker/resources dist/components/color-picker/resources"
3131
},
3232
"dependencies": {
33-
"@emotion/native": "^10.0.14",
33+
"@emotion/native": "^11.11.0",
3434
"@storybook/addons": "^6.5.14",
3535
"@storybook/client-logger": "^6.5.14",
3636
"@storybook/core-events": "^6.5.14",
37+
"@storybook/react-native-theming": "^6.5.5-alpha.1",
3738
"core-js": "^3.0.1",
3839
"deep-equal": "^1.0.1",
3940
"prop-types": "^15.7.2",

‎packages/ondevice-controls/src/emotion.d.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import '@emotion/react';
2+
3+
import { Theme as StorybookTheme } from '@storybook/react-native-theming';
4+
5+
declare module '@emotion/react' {
6+
export interface Theme extends StorybookTheme {}
7+
}

‎packages/ondevice-controls/src/types/Color.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ const TouchableContainer = styled.View(({ theme }) => ({
2929
backgroundColor: theme.inputs.swatch.backgroundColor,
3030
}));
3131

32-
const Touchable = styled.TouchableOpacity(({ theme, color }) => ({
32+
const Touchable = styled.TouchableOpacity<{ color: string }>(({ theme, color }) => ({
3333
width: '100%',
3434
height: '100%',
3535
borderRadius: theme.inputs.swatch.innerBorderRadius,
@@ -47,7 +47,7 @@ const WebInput = styled('input' as any)(({ theme }) => ({
4747
backgroundColor: theme.inputs.swatch.backgroundColor,
4848
}));
4949

50-
const ButtonTouchable = styled.TouchableOpacity(({ theme, primary }) => {
50+
const ButtonTouchable = styled.TouchableOpacity<{ primary?: boolean }>(({ theme, primary }) => {
5151
const buttonTheme = primary ? theme.button.primary : theme.button.secondary;
5252
return {
5353
backgroundColor: buttonTheme.backgroundColor,
@@ -61,7 +61,7 @@ const ButtonTouchable = styled.TouchableOpacity(({ theme, primary }) => {
6161
};
6262
});
6363

64-
const ButtonText = styled.Text(({ theme, primary }) => {
64+
const ButtonText = styled.Text<{ primary?: boolean }>(({ theme, primary }) => {
6565
const buttonTheme = primary ? theme.button.primary : theme.button.secondary;
6666
return {
6767
color: buttonTheme.textColor,

‎packages/ondevice-controls/src/types/Number.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { View } from 'react-native';
66
import { inputStyle } from './common';
77
import { useResyncValue } from './useResyncValue';
88

9-
const Input = styled.TextInput(({ theme, showError }) => {
9+
const Input = styled.TextInput<{ showError: boolean }>(({ theme, showError }) => {
1010
const style = inputStyle(theme);
1111
return {
1212
...style,

‎packages/ondevice-controls/src/types/common.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1+
import { Theme } from '@storybook/react-native-theming';
12
import { Platform } from 'react-native';
23

3-
export function inputStyle(theme: any, isTextInput = true) {
4+
// TODO fix this any
5+
export function inputStyle(theme: Theme, isTextInput = true): any {
46
return {
57
backgroundColor: theme.inputs.text.backgroundColor,
68
borderWidth: theme.inputs.text.borderWidth,

‎packages/ondevice-controls/src/typings.d.ts

-75
This file was deleted.

‎packages/ondevice-controls/tsconfig.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"compilerOptions": {
44
"outDir": "dist/",
55
"paths": {
6-
"@emotion/native": ["src/typings.d.ts"]
6+
"@emotion/react": ["src/emotion.d.ts"]
77
},
88
"rootDir": "./src"
99
},

‎packages/ondevice-knobs/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@storybook/addon-ondevice-knobs",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"description": "Display storybook story knobs on your deviced.",
55
"keywords": [
66
"addon",
@@ -30,7 +30,7 @@
3030
"dev": "tsc --watch"
3131
},
3232
"dependencies": {
33-
"@emotion/native": "^10.0.14",
33+
"@emotion/native": "^11.11.0",
3434
"@storybook/addons": "^6.5.14",
3535
"@storybook/core-events": "^6.5.14",
3636
"core-js": "^3.0.1",
@@ -41,7 +41,7 @@
4141
"tinycolor2": "^1.4.1"
4242
},
4343
"devDependencies": {
44-
"@storybook/addon-knobs": "^6"
44+
"@storybook/addon-knobs": "^6.4.0"
4545
},
4646
"peerDependencies": {
4747
"@react-native-community/datetimepicker": "*",

‎packages/ondevice-notes/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@storybook/addon-ondevice-notes",
3-
"version": "6.5.5-alpha.0",
3+
"version": "6.5.5-alpha.1",
44
"description": "Write notes for your react-native Storybook stories.",
55
"keywords": [
66
"addon",
@@ -29,14 +29,14 @@
2929
"dev": "tsc --watch"
3030
},
3131
"dependencies": {
32-
"@emotion/core": "^10.0.20",
32+
"@emotion/react": "^11.11.1",
3333
"@storybook/addons": "^6.5.14",
3434
"@storybook/api": "^6.5.14",
3535
"@storybook/client-api": "^6.5.14",
3636
"@storybook/client-logger": "^6.5.14",
3737
"@storybook/core-events": "^6.5.14",
38+
"@storybook/react-native-theming": "^6.5.5-alpha.1",
3839
"core-js": "^3.0.1",
39-
"emotion-theming": "^10.0.19",
4040
"prop-types": "^15.7.2",
4141
"simple-markdown": "^0.7.3"
4242
},

‎packages/ondevice-notes/src/components/Markdown/styles.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/**
22
* mostly based on code from https://github.com/CharlesMangwa/react-native-simple-markdown
33
*/
4-
import { useTheme } from 'emotion-theming';
4+
import { useTheme } from '@emotion/react';
55
import { useMemo } from 'react';
66
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native/types';
77

@@ -10,7 +10,7 @@ interface Styles {
1010
}
1111

1212
export const useThemedStyles = (): Styles => {
13-
const theme = useTheme<any>();
13+
const theme = useTheme();
1414

1515
const styles: Styles = useMemo(
1616
() => ({

‎packages/ondevice-notes/src/emotion.d.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import '@emotion/react';
2+
3+
import { Theme as StorybookTheme } from '@storybook/react-native-theming';
4+
5+
declare module '@emotion/react' {
6+
export interface Theme extends StorybookTheme {}
7+
}

0 commit comments

Comments
 (0)