expo-dev-client-components 1.2.1 → 1.3.0
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/CHANGELOG.md +4 -0
- package/build/Button.d.ts +3 -3
- package/build/Button.d.ts.map +1 -1
- package/build/create-primitive.d.ts +8 -8
- package/build/create-primitive.d.ts.map +1 -1
- package/build/create-primitive.js.map +1 -1
- package/build/icons/ExtensionsFilledIcon.d.ts +1 -1
- package/build/icons/ExtensionsFilledIcon.d.ts.map +1 -1
- package/build/icons/HomeFilledIcon.d.ts +1 -1
- package/build/icons/HomeFilledIcon.d.ts.map +1 -1
- package/build/icons/SettingsFilledIcon.d.ts +1 -1
- package/build/icons/SettingsFilledIcon.d.ts.map +1 -1
- package/build/theme.d.ts +5 -5
- package/build/theme.d.ts.map +1 -1
- package/build/useExpoTheme.d.ts +4 -4
- package/build/useExpoTheme.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/create-primitive.tsx +1 -1
package/CHANGELOG.md
CHANGED
package/build/Button.d.ts
CHANGED
|
@@ -16,7 +16,7 @@ declare const Container: React.ForwardRefExoticComponent<Pick<Animated.AnimatedP
|
|
|
16
16
|
rounded?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
17
17
|
roundedTop?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
18
18
|
roundedBottom?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
19
|
-
bg?: "transparent" | "primary" | "secondary" | "tertiary" | "ghost" | "default" |
|
|
19
|
+
bg?: "transparent" | "disabled" | "primary" | "secondary" | "tertiary" | "ghost" | "default" | undefined;
|
|
20
20
|
border?: "ghost" | undefined;
|
|
21
21
|
shadow?: "button" | undefined;
|
|
22
22
|
} & {
|
|
@@ -42,7 +42,7 @@ export declare const Button: {
|
|
|
42
42
|
rounded?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
43
43
|
roundedTop?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
44
44
|
roundedBottom?: "small" | "medium" | "large" | "none" | "full" | undefined;
|
|
45
|
-
bg?: "transparent" | "primary" | "secondary" | "tertiary" | "ghost" | "default" |
|
|
45
|
+
bg?: "transparent" | "disabled" | "primary" | "secondary" | "tertiary" | "ghost" | "default" | undefined;
|
|
46
46
|
border?: "ghost" | undefined;
|
|
47
47
|
shadow?: "button" | undefined;
|
|
48
48
|
} & {
|
|
@@ -68,7 +68,7 @@ export declare const Button: {
|
|
|
68
68
|
} | undefined;
|
|
69
69
|
} & React.RefAttributes<import("react-native").TextProps>>;
|
|
70
70
|
};
|
|
71
|
-
|
|
71
|
+
type ScalingPressableProps = {
|
|
72
72
|
minScale?: number;
|
|
73
73
|
};
|
|
74
74
|
declare function ScaleOnPressContainer({ minScale, ...props }: React.ComponentProps<typeof Container> & ScalingPressableProps): JSX.Element;
|
package/build/Button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAkB,QAAQ,EAA4C,MAAM,cAAc,CAAC;AAkDlG,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;uWAgDb,CAAC;AAEH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIlB,CAAC;AAEF,
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAkB,QAAQ,EAA4C,MAAM,cAAc,CAAC;AAkDlG,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;uWAgDb,CAAC;AAEH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIlB,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAkCF,iBAAS,qBAAqB,CAAC,EAC7B,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG,qBAAqB,eAoDhE"}
|
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ViewStyle, ImageStyle, TextStyle } from 'react-native';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
type StyleType = ViewStyle | TextStyle | ImageStyle;
|
|
4
|
+
type Options = {
|
|
5
5
|
base?: StyleType;
|
|
6
6
|
variants?: VariantMap<StyleType>;
|
|
7
7
|
};
|
|
8
|
-
|
|
8
|
+
type VariantMap<T> = {
|
|
9
9
|
[key: string]: {
|
|
10
10
|
[key: string]: T;
|
|
11
11
|
};
|
|
12
12
|
};
|
|
13
|
-
|
|
13
|
+
type Nested<Type> = {
|
|
14
14
|
[Property in keyof Type]?: keyof Type[Property];
|
|
15
15
|
};
|
|
16
|
-
|
|
16
|
+
type SelectorMap<Variants> = Partial<{
|
|
17
17
|
[K in keyof Variants]?: {
|
|
18
18
|
[T in keyof Variants[K]]?: StyleType;
|
|
19
19
|
};
|
|
20
20
|
}>;
|
|
21
|
-
|
|
21
|
+
type Selectors<Variants> = {
|
|
22
22
|
light?: SelectorMap<Variants>;
|
|
23
23
|
dark?: SelectorMap<Variants>;
|
|
24
24
|
};
|
|
25
|
-
|
|
25
|
+
type SelectorProps = {
|
|
26
26
|
light?: StyleType;
|
|
27
27
|
dark?: StyleType;
|
|
28
28
|
};
|
|
29
|
-
export declare function create<T, O extends Options>(component: React.ComponentType<T>, config: O & {
|
|
29
|
+
export declare function create<T extends object, O extends Options>(component: React.ComponentType<T>, config: O & {
|
|
30
30
|
selectors?: Selectors<O['variants']>;
|
|
31
31
|
props?: T;
|
|
32
32
|
}): React.ForwardRefExoticComponent<React.PropsWithoutRef<T & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-primitive.d.ts","sourceRoot":"","sources":["../src/create-primitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI5E,
|
|
1
|
+
{"version":3,"file":"create-primitive.d.ts","sourceRoot":"","sources":["../src/create-primitive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI5E,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAEpD,KAAK,OAAO,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;CAClC,CAAC;AAEF,KAAK,UAAU,CAAC,CAAC,IAAI;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,CAAA;KAAE,CAAA;CAAE,CAAC;AAE7D,KAAK,MAAM,CAAC,IAAI,IAAI;KACjB,QAAQ,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC;CAChD,CAAC;AAEF,KAAK,WAAW,CAAC,QAAQ,IAAI,OAAO,CAAC;KAClC,CAAC,IAAI,MAAM,QAAQ,CAAC,CAAC,EAAE;SACrB,CAAC,IAAI,MAAM,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS;KACrC;CACF,CAAC,CAAC;AAEH,KAAK,SAAS,CAAC,QAAQ,IAAI;IACzB,KAAK,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC9B,IAAI,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;CAC9B,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,OAAO,EACxD,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,EACjC,MAAM,EAAE,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,CAAA;CAAE;;;;;;;6BA0ChE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-primitive.js","sourceRoot":"","sources":["../src/create-primitive.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { StyleSheet, ViewStyle, ImageStyle, TextStyle } from 'react-native';\n\nimport { useTheme } from './useExpoTheme';\n\ntype StyleType = ViewStyle | TextStyle | ImageStyle;\n\ntype Options = {\n base?: StyleType;\n variants?: VariantMap<StyleType>;\n};\n\ntype VariantMap<T> = { [key: string]: { [key: string]: T } };\n\ntype Nested<Type> = {\n [Property in keyof Type]?: keyof Type[Property];\n};\n\ntype SelectorMap<Variants> = Partial<{\n [K in keyof Variants]?: {\n [T in keyof Variants[K]]?: StyleType;\n };\n}>;\n\ntype Selectors<Variants> = {\n light?: SelectorMap<Variants>;\n dark?: SelectorMap<Variants>;\n};\n\ntype SelectorProps = {\n light?: StyleType;\n dark?: StyleType;\n};\n\nexport function create<T, O extends Options>(\n component: React.ComponentType<T>,\n config: O & { selectors?: Selectors<O['variants']>; props?: T }\n) {\n config.selectors = config.selectors ?? {};\n config.variants = config.variants ?? {};\n\n const Component = React.forwardRef<\n T,\n React.PropsWithChildren<T> & Nested<typeof config['variants']> & { selectors?: SelectorProps }\n >((props, ref) => {\n const theme = useTheme();\n\n const variantStyles = stylesForVariants(props, config.variants);\n const selectorStyles = stylesForSelectors(props, config.selectors, { theme });\n const selectorPropsStyles = stylesForSelectorProps(props.selectors, { theme });\n\n const variantFreeProps: any = { ...props };\n\n // @ts-ignore\n // there could be a conflict between the primitive prop and the variant name\n // for example - variant name \"width\" and prop \"width\"\n // in these cases, favor the variant because it is under the users control (e.g they can update the conflicting name)\n\n Object.keys(config.variants).forEach((variant) => {\n delete variantFreeProps[variant];\n });\n\n return React.createElement(component, {\n ...config.props,\n ...variantFreeProps,\n style: StyleSheet.flatten([\n config.base,\n variantStyles,\n selectorStyles,\n selectorPropsStyles,\n // @ts-ignore\n props.style || {},\n ]),\n ref,\n });\n });\n\n return Component;\n}\n\nfunction stylesForVariants(props: any, variants: any = {}) {\n let styles = {};\n\n for (const key in props) {\n if (variants[key]) {\n const value = props[key];\n\n const styleValue = variants[key][value];\n if (styleValue) {\n styles = StyleSheet.flatten(StyleSheet.compose(styles, styleValue));\n }\n }\n }\n\n return styles;\n}\n\nfunction stylesForSelectors(props: any, selectors: any = {}, state: any = {}) {\n const styles: any[] = [];\n\n if (state.theme != null) {\n if (selectors[state.theme] != null) {\n const variants = selectors[state.theme];\n const variantStyles = stylesForVariants(props, variants);\n\n if (variants.base != null) {\n styles.push(variants.base);\n }\n\n styles.push(variantStyles);\n }\n }\n\n return StyleSheet.flatten(styles);\n}\n\nfunction stylesForSelectorProps(selectors: any = {}, state: any = {}) {\n const styles: any[] = [];\n\n if (state.theme != null) {\n if (selectors[state.theme] != null) {\n const selectorStyles = selectors[state.theme];\n styles.push(selectorStyles);\n }\n }\n\n return StyleSheet.flatten(styles);\n}\n"]}
|
|
1
|
+
{"version":3,"file":"create-primitive.js","sourceRoot":"","sources":["../src/create-primitive.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { StyleSheet, ViewStyle, ImageStyle, TextStyle } from 'react-native';\n\nimport { useTheme } from './useExpoTheme';\n\ntype StyleType = ViewStyle | TextStyle | ImageStyle;\n\ntype Options = {\n base?: StyleType;\n variants?: VariantMap<StyleType>;\n};\n\ntype VariantMap<T> = { [key: string]: { [key: string]: T } };\n\ntype Nested<Type> = {\n [Property in keyof Type]?: keyof Type[Property];\n};\n\ntype SelectorMap<Variants> = Partial<{\n [K in keyof Variants]?: {\n [T in keyof Variants[K]]?: StyleType;\n };\n}>;\n\ntype Selectors<Variants> = {\n light?: SelectorMap<Variants>;\n dark?: SelectorMap<Variants>;\n};\n\ntype SelectorProps = {\n light?: StyleType;\n dark?: StyleType;\n};\n\nexport function create<T extends object, O extends Options>(\n component: React.ComponentType<T>,\n config: O & { selectors?: Selectors<O['variants']>; props?: T }\n) {\n config.selectors = config.selectors ?? {};\n config.variants = config.variants ?? {};\n\n const Component = React.forwardRef<\n T,\n React.PropsWithChildren<T> & Nested<typeof config['variants']> & { selectors?: SelectorProps }\n >((props, ref) => {\n const theme = useTheme();\n\n const variantStyles = stylesForVariants(props, config.variants);\n const selectorStyles = stylesForSelectors(props, config.selectors, { theme });\n const selectorPropsStyles = stylesForSelectorProps(props.selectors, { theme });\n\n const variantFreeProps: any = { ...props };\n\n // @ts-ignore\n // there could be a conflict between the primitive prop and the variant name\n // for example - variant name \"width\" and prop \"width\"\n // in these cases, favor the variant because it is under the users control (e.g they can update the conflicting name)\n\n Object.keys(config.variants).forEach((variant) => {\n delete variantFreeProps[variant];\n });\n\n return React.createElement(component, {\n ...config.props,\n ...variantFreeProps,\n style: StyleSheet.flatten([\n config.base,\n variantStyles,\n selectorStyles,\n selectorPropsStyles,\n // @ts-ignore\n props.style || {},\n ]),\n ref,\n });\n });\n\n return Component;\n}\n\nfunction stylesForVariants(props: any, variants: any = {}) {\n let styles = {};\n\n for (const key in props) {\n if (variants[key]) {\n const value = props[key];\n\n const styleValue = variants[key][value];\n if (styleValue) {\n styles = StyleSheet.flatten(StyleSheet.compose(styles, styleValue));\n }\n }\n }\n\n return styles;\n}\n\nfunction stylesForSelectors(props: any, selectors: any = {}, state: any = {}) {\n const styles: any[] = [];\n\n if (state.theme != null) {\n if (selectors[state.theme] != null) {\n const variants = selectors[state.theme];\n const variantStyles = stylesForVariants(props, variants);\n\n if (variants.base != null) {\n styles.push(variants.base);\n }\n\n styles.push(variantStyles);\n }\n }\n\n return StyleSheet.flatten(styles);\n}\n\nfunction stylesForSelectorProps(selectors: any = {}, state: any = {}) {\n const styles: any[] = [];\n\n if (state.theme != null) {\n if (selectors[state.theme] != null) {\n const selectorStyles = selectors[state.theme];\n styles.push(selectorStyles);\n }\n }\n\n return StyleSheet.flatten(styles);\n}\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Image } from '../Image';
|
|
3
|
-
|
|
3
|
+
type TabBarIconProps = Partial<React.ComponentProps<typeof Image>> & {
|
|
4
4
|
focused?: boolean;
|
|
5
5
|
};
|
|
6
6
|
export declare function ExtensionsFilledIcon(props: TabBarIconProps): JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionsFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/ExtensionsFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,
|
|
1
|
+
{"version":3,"file":"ExtensionsFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/ExtensionsFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,KAAK,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,eAAe,eAK1D"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Image } from '../Image';
|
|
3
|
-
|
|
3
|
+
type TabBarIconProps = Partial<React.ComponentProps<typeof Image>> & {
|
|
4
4
|
focused?: boolean;
|
|
5
5
|
};
|
|
6
6
|
export declare function HomeFilledIcon(props: TabBarIconProps): JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HomeFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/HomeFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,
|
|
1
|
+
{"version":3,"file":"HomeFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/HomeFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,KAAK,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,eAAe,eAKpD"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Image } from '../Image';
|
|
3
|
-
|
|
3
|
+
type TabBarIconProps = Partial<React.ComponentProps<typeof Image>> & {
|
|
4
4
|
focused?: boolean;
|
|
5
5
|
};
|
|
6
6
|
export declare function SettingsFilledIcon(props: TabBarIconProps): JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SettingsFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/SettingsFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,
|
|
1
|
+
{"version":3,"file":"SettingsFilledIcon.d.ts","sourceRoot":"","sources":["../../src/icons/SettingsFilledIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAmBjC,KAAK,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,GAAG;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,eAAe,eAKxD"}
|
package/build/theme.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { spacing } from '@expo/styleguide-native';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
type SpacingKey = `${keyof typeof spacing}`;
|
|
3
|
+
type DescriptiveScale = 'micro' | 'tiny' | 'small' | 'medium' | 'large' | 'xl';
|
|
4
|
+
type ScaleKey = SpacingKey | DescriptiveScale;
|
|
5
|
+
type Scale = Record<ScaleKey, number>;
|
|
6
6
|
export declare const scale: Scale;
|
|
7
7
|
export declare const padding: {
|
|
8
8
|
padding: Record<"0" | "1" | "2" | "3" | "4" | "0.5" | "1.5" | "2.5" | "3.5" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | DescriptiveScale, any>;
|
|
@@ -293,7 +293,7 @@ export declare const bgDark: {
|
|
|
293
293
|
backgroundColor: string;
|
|
294
294
|
};
|
|
295
295
|
};
|
|
296
|
-
|
|
296
|
+
type NavigationTheme = {
|
|
297
297
|
dark: boolean;
|
|
298
298
|
colors: {
|
|
299
299
|
primary: string;
|
package/build/theme.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAmD,MAAM,yBAAyB,CAAC;AAGnG,
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAmD,MAAM,yBAAyB,CAAC;AAGnG,KAAK,UAAU,GAAG,GAAG,MAAM,OAAO,OAAO,EAAE,CAAC;AAC5C,KAAK,gBAAgB,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,IAAI,CAAC;AAC/E,KAAK,QAAQ,GAAG,UAAU,GAAG,gBAAgB,CAAC;AAC9C,KAAK,KAAK,GAAG,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;AAEtC,eAAO,MAAM,KAAK,EAAE,KAQnB,CAAC;AAmBF,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;CAMlB,CAAC;AAEF,eAAO,MAAM,KAAK,uQAA2C,CAAC;AAC9D,eAAO,MAAM,MAAM,uQAA4C,CAAC;AAEhE,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DhB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;CAcpB,CAAC;AAEF,eAAO,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;CAQd,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;CAOlB,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE;QACN,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,EAAE,MAAM,CAAC;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,EAAE,MAAM,CAAC;QACf,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,eAUlC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,eAUjC,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAIlB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;CAKtB,CAAC"}
|
package/build/useExpoTheme.d.ts
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { lightTheme } from '@expo/styleguide-native';
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
export
|
|
4
|
-
|
|
3
|
+
export type ThemePreference = 'light' | 'dark' | 'no-preference';
|
|
4
|
+
type Theme = 'light' | 'dark';
|
|
5
5
|
export declare const useTheme: () => Theme;
|
|
6
|
-
|
|
6
|
+
type ThemeProviderProps = {
|
|
7
7
|
children: React.ReactNode;
|
|
8
8
|
themePreference?: ThemePreference;
|
|
9
9
|
};
|
|
10
10
|
export declare function ThemeProvider({ children, themePreference }: ThemeProviderProps): JSX.Element;
|
|
11
|
-
export
|
|
11
|
+
export type ExpoTheme = typeof lightTheme;
|
|
12
12
|
export declare function useCurrentTheme(): 'light' | 'dark';
|
|
13
13
|
export declare function useExpoTheme(): ExpoTheme;
|
|
14
14
|
export declare function useExpoPalette(): {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useExpoTheme.d.ts","sourceRoot":"","sources":["../src/useExpoTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,yBAAyB,CAAC;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,
|
|
1
|
+
{"version":3,"file":"useExpoTheme.d.ts","sourceRoot":"","sources":["../src/useExpoTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,yBAAyB,CAAC;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,GAAG,eAAe,CAAC;AACjE,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAG9B,eAAO,MAAM,QAAQ,aAAuC,CAAC;AAE7D,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,eAAiC,EAAE,EAAE,kBAAkB,eAYhG;AAED,MAAM,MAAM,SAAS,GAAG,OAAO,UAAU,CAAC;AAE1C,wBAAgB,eAAe,IAAI,OAAO,GAAG,MAAM,CAGlD;AAED,wBAAgB,YAAY,IAAI,SAAS,CAQxC;AAED,wBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAG7B"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "expo-dev-client-components",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.0",
|
|
4
4
|
"description": "Shared JS components and configuration for expo-dev-client",
|
|
5
5
|
"main": "src/index.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -42,5 +42,5 @@
|
|
|
42
42
|
"./setupTests.js"
|
|
43
43
|
]
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "1815e2eaad8c753588c7b1eb74420174a28e01f4"
|
|
46
46
|
}
|
package/src/create-primitive.tsx
CHANGED
|
@@ -32,7 +32,7 @@ type SelectorProps = {
|
|
|
32
32
|
dark?: StyleType;
|
|
33
33
|
};
|
|
34
34
|
|
|
35
|
-
export function create<T, O extends Options>(
|
|
35
|
+
export function create<T extends object, O extends Options>(
|
|
36
36
|
component: React.ComponentType<T>,
|
|
37
37
|
config: O & { selectors?: Selectors<O['variants']>; props?: T }
|
|
38
38
|
) {
|