app-studio 0.7.18 → 0.8.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/README.md +11 -1
- package/dist/native/index.cjs +3360 -0
- package/dist/native/index.cjs.map +1 -0
- package/dist/native/index.d.mts +251 -0
- package/dist/native/index.d.ts +251 -0
- package/dist/native/index.js +3268 -0
- package/dist/native/index.js.map +1 -0
- package/dist/viewAnimation-B4BIoOwQ.d.mts +2246 -0
- package/dist/viewAnimation-B4BIoOwQ.d.ts +2246 -0
- package/dist/web/app-studio.umd.production.min.global.js +28 -0
- package/dist/web/app-studio.umd.production.min.global.js.map +1 -0
- package/dist/web/index.cjs +6109 -0
- package/dist/web/index.cjs.map +1 -0
- package/dist/web/index.d.mts +624 -0
- package/dist/web/index.d.ts +624 -0
- package/dist/web/index.js +6008 -0
- package/dist/web/index.js.map +1 -0
- package/docs/README.md +10 -0
- package/package.json +76 -14
- package/dist/app-studio.cjs.development.js +0 -6754
- package/dist/app-studio.cjs.development.js.map +0 -1
- package/dist/app-studio.cjs.production.min.js +0 -2
- package/dist/app-studio.cjs.production.min.js.map +0 -1
- package/dist/app-studio.esm.js +0 -6650
- package/dist/app-studio.esm.js.map +0 -1
- package/dist/app-studio.umd.development.js +0 -6757
- package/dist/app-studio.umd.development.js.map +0 -1
- package/dist/app-studio.umd.production.min.js +0 -2
- package/dist/app-studio.umd.production.min.js.map +0 -1
- package/dist/components/Form.d.ts +0 -17
- package/dist/components/Image.d.ts +0 -7
- package/dist/components/Skeleton.d.ts +0 -3
- package/dist/components/Text/Text.props.d.ts +0 -27
- package/dist/components/Text/Text.type.d.ts +0 -3
- package/dist/components/Text/Text.utils.d.ts +0 -2
- package/dist/components/Text/Text.view.d.ts +0 -20
- package/dist/components/Text.d.ts +0 -5
- package/dist/components/View.d.ts +0 -16
- package/dist/components/Wrapper.d.ts +0 -4
- package/dist/element/Animation.d.ts +0 -1164
- package/dist/element/Element.d.ts +0 -4
- package/dist/element/Element.types.d.ts +0 -123
- package/dist/element/css.d.ts +0 -50
- package/dist/element/utils.d.ts +0 -4
- package/dist/hooks/useActive.d.ts +0 -2
- package/dist/hooks/useClickOutside.d.ts +0 -6
- package/dist/hooks/useElementPosition.d.ts +0 -39
- package/dist/hooks/useFocus.d.ts +0 -2
- package/dist/hooks/useHover.d.ts +0 -2
- package/dist/hooks/useIframeStyles.d.ts +0 -41
- package/dist/hooks/useInView.d.ts +0 -11
- package/dist/hooks/useKeyPress.d.ts +0 -1
- package/dist/hooks/useMount.d.ts +0 -1
- package/dist/hooks/useOnScreen.d.ts +0 -6
- package/dist/hooks/useResponsive.d.ts +0 -59
- package/dist/hooks/useScroll.d.ts +0 -49
- package/dist/hooks/useWindowSize.d.ts +0 -4
- package/dist/index.d.ts +0 -33
- package/dist/index.js +0 -8
- package/dist/providers/Analytics.d.ts +0 -9
- package/dist/providers/Responsive.d.ts +0 -58
- package/dist/providers/StyleRegistry.d.ts +0 -32
- package/dist/providers/Theme.d.ts +0 -46
- package/dist/providers/WindowSize.d.ts +0 -11
- package/dist/stories/AnimateOn.stories.d.ts +0 -30
- package/dist/stories/Animation.stories.d.ts +0 -35
- package/dist/stories/BorderColor.stories.d.ts +0 -4
- package/dist/stories/Color.stories.d.ts +0 -4
- package/dist/stories/ColorAlpha.stories.d.ts +0 -5
- package/dist/stories/Component.stories.d.ts +0 -7
- package/dist/stories/CrossBrowserCompatibility.stories.d.ts +0 -6
- package/dist/stories/CssCascadeOrder.stories.d.ts +0 -10
- package/dist/stories/EmptyBeforeExample.stories.d.ts +0 -7
- package/dist/stories/EventHandlers.stories.d.ts +0 -6
- package/dist/stories/GradientColors.stories.d.ts +0 -6
- package/dist/stories/GroupPeer.stories.d.ts +0 -7
- package/dist/stories/Hooks.stories.d.ts +0 -17
- package/dist/stories/IframeCSSSupport.stories.d.ts +0 -28
- package/dist/stories/IframeSupport.stories.d.ts +0 -20
- package/dist/stories/Image.stories.d.ts +0 -6
- package/dist/stories/Scroll.stories.d.ts +0 -9
- package/dist/stories/ScrollAnimation.stories.d.ts +0 -36
- package/dist/stories/ScrollTimeline.stories.d.ts +0 -6
- package/dist/stories/Skeleton.stories.d.ts +0 -5
- package/dist/stories/Text.stories.d.ts +0 -18
- package/dist/stories/VendorPrefix.stories.d.ts +0 -6
- package/dist/stories/View.stories.d.ts +0 -10
- package/dist/stories/ViewAnimation.stories.d.ts +0 -33
- package/dist/test/CssVariablesTest.d.ts +0 -3
- package/dist/test/LowercaseVendorPrefixTest.d.ts +0 -3
- package/dist/test/VendorPrefixTest.d.ts +0 -3
- package/dist/test/WebkitTextStrokeTest.d.ts +0 -3
- package/dist/types/scrollAnimation.types.d.ts +0 -75
- package/dist/utils/colors.d.ts +0 -21
- package/dist/utils/constants.d.ts +0 -24
- package/dist/utils/cssProperties.d.ts +0 -8
- package/dist/utils/env.d.ts +0 -15
- package/dist/utils/hash.d.ts +0 -4
- package/dist/utils/shadow.d.ts +0 -10
- package/dist/utils/style.d.ts +0 -22
- package/dist/utils/typography.d.ts +0 -45
- package/dist/utils/vendorPrefixes.d.ts +0 -19
- package/dist/utils/viewAnimation.d.ts +0 -138
|
@@ -0,0 +1,251 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import react__default, { ReactNode } from 'react';
|
|
3
|
+
import { ViewStyle, TextStyle, ImageStyle, StyleProp, ImageSourcePropType } from 'react-native';
|
|
4
|
+
import { C as ColorSingleton, a as ColorPalette } from '../viewAnimation-B4BIoOwQ.mjs';
|
|
5
|
+
export { b as AnalyticsConfig, c as AnalyticsContext, d as AnalyticsProvider, e as Animation, B as BlurAnimationOptions, f as ColorConfig, R as RotateAnimationOptions, g as ScaleAnimationOptions, S as Shadow, h as Shadows, i as SlideAnimationOptions, j as Typography, k as ViewAnimationConfig, l as ViewAnimationFillMode, m as ViewAnimationOptions, n as ViewAnimationRange, o as ViewAnimationTimingFunction, p as animateOnView, q as blurInOnView, r as blurOutOnView, s as createViewAnimation, t as defaultColors, u as defaultDarkColors, v as defaultDarkPalette, w as defaultLightColors, x as defaultLightPalette, y as fadeInOnView, z as fadeOutOnView, D as flipXOnView, E as flipYOnView, F as getWindowInitialProps, G as hasColorToken, H as isBrowser, J as isDev, K as isMobile, L as isProd, M as isSSR, N as replaceColorTokens, O as revealOnView, P as rotateInOnView, Q as scaleDownOnView, U as scaleUpOnView, W as slideDownOnView, X as slideLeftOnView, Y as slideRightOnView, Z as slideUpOnView, _ as useAnalytics, $ as viewAnimationPresets } from '../viewAnimation-B4BIoOwQ.mjs';
|
|
6
|
+
|
|
7
|
+
type NativeStyle = ViewStyle & TextStyle & ImageStyle;
|
|
8
|
+
type NativeStyleValue = NativeStyle[keyof NativeStyle] | string | number;
|
|
9
|
+
type NativeStyleProps = Partial<Record<keyof NativeStyle, NativeStyleValue>> & {
|
|
10
|
+
widthHeight?: number | string;
|
|
11
|
+
paddingHorizontal?: number | string;
|
|
12
|
+
paddingVertical?: number | string;
|
|
13
|
+
marginHorizontal?: number | string;
|
|
14
|
+
marginVertical?: number | string;
|
|
15
|
+
shadow?: boolean | number;
|
|
16
|
+
};
|
|
17
|
+
interface NativeElementProps extends NativeStyleProps {
|
|
18
|
+
children?: react__default.ReactNode;
|
|
19
|
+
style?: StyleProp<NativeStyle>;
|
|
20
|
+
css?: NativeStyle;
|
|
21
|
+
media?: Record<string, NativeStyleProps>;
|
|
22
|
+
on?: Record<string, NativeStyleProps>;
|
|
23
|
+
onPress?: (...args: any[]) => void;
|
|
24
|
+
onClick?: (...args: any[]) => void;
|
|
25
|
+
testID?: string;
|
|
26
|
+
className?: string;
|
|
27
|
+
as?: unknown;
|
|
28
|
+
animate?: unknown;
|
|
29
|
+
animateIn?: unknown;
|
|
30
|
+
animateOut?: unknown;
|
|
31
|
+
animateOn?: unknown;
|
|
32
|
+
blend?: boolean;
|
|
33
|
+
before?: react__default.ReactNode;
|
|
34
|
+
after?: react__default.ReactNode;
|
|
35
|
+
theme?: Record<string, string>;
|
|
36
|
+
[key: string]: any;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
type CssProps = NativeStyleProps;
|
|
40
|
+
type ElementProps = NativeElementProps;
|
|
41
|
+
type ViewProps = NativeElementProps;
|
|
42
|
+
type TextProps = NativeElementProps & {
|
|
43
|
+
toUpperCase?: boolean;
|
|
44
|
+
isItalic?: boolean;
|
|
45
|
+
isStriked?: boolean;
|
|
46
|
+
isUnderlined?: boolean;
|
|
47
|
+
isSub?: boolean;
|
|
48
|
+
isSup?: boolean;
|
|
49
|
+
maxLines?: number;
|
|
50
|
+
bgColor?: string;
|
|
51
|
+
};
|
|
52
|
+
type ImageProps = NativeElementProps & {
|
|
53
|
+
src?: string;
|
|
54
|
+
source?: ImageSourcePropType;
|
|
55
|
+
alt?: string;
|
|
56
|
+
};
|
|
57
|
+
type InputProps = NativeElementProps & {
|
|
58
|
+
value?: string;
|
|
59
|
+
defaultValue?: string;
|
|
60
|
+
placeholder?: string;
|
|
61
|
+
onChangeText?: (value: string) => void;
|
|
62
|
+
};
|
|
63
|
+
type ButtonProps = NativeElementProps & {
|
|
64
|
+
disabled?: boolean;
|
|
65
|
+
};
|
|
66
|
+
declare const Element: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
67
|
+
declare const View: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
68
|
+
declare const Horizontal: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
69
|
+
declare const Vertical: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
70
|
+
declare const Center: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
71
|
+
declare const HorizontalResponsive: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
72
|
+
declare const VerticalResponsive: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
73
|
+
declare const Scroll: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
74
|
+
declare const SafeArea: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
75
|
+
declare const Div: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
76
|
+
declare const Span: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
77
|
+
declare const Text: react__default.ForwardRefExoticComponent<Omit<TextProps, "ref"> & react__default.RefAttributes<any>>;
|
|
78
|
+
declare const Image: react__default.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & react__default.RefAttributes<any>>;
|
|
79
|
+
declare const ImageBackground: react__default.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & react__default.RefAttributes<any>>;
|
|
80
|
+
declare const Form: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
81
|
+
declare const Input: react__default.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react__default.RefAttributes<any>>;
|
|
82
|
+
declare const Button: react__default.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & react__default.RefAttributes<any>>;
|
|
83
|
+
declare const Skeleton: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
84
|
+
|
|
85
|
+
type ThemeMode = 'light' | 'dark';
|
|
86
|
+
interface Colors {
|
|
87
|
+
main: ColorSingleton;
|
|
88
|
+
palette: ColorPalette;
|
|
89
|
+
}
|
|
90
|
+
interface Theme {
|
|
91
|
+
primary?: string;
|
|
92
|
+
secondary?: string;
|
|
93
|
+
success?: string;
|
|
94
|
+
error?: string;
|
|
95
|
+
warning?: string;
|
|
96
|
+
disabled?: string;
|
|
97
|
+
loading?: string;
|
|
98
|
+
[key: string]: string | undefined;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
interface ThemeContextProps {
|
|
102
|
+
getColor: (name: string) => string;
|
|
103
|
+
getColorHex: (name: string) => string;
|
|
104
|
+
getColorRGBA: (name: string, alpha?: number) => string;
|
|
105
|
+
getColorScheme: (name: string) => string | undefined;
|
|
106
|
+
getContrastColor: (name: string) => 'black' | 'white';
|
|
107
|
+
theme: Theme;
|
|
108
|
+
colors: Colors;
|
|
109
|
+
themeMode: ThemeMode;
|
|
110
|
+
setThemeMode: (mode: ThemeMode) => void;
|
|
111
|
+
}
|
|
112
|
+
interface ThemeProviderProps {
|
|
113
|
+
colors?: Partial<Colors>;
|
|
114
|
+
lightColors?: Partial<Colors>;
|
|
115
|
+
darkColors?: Partial<Colors>;
|
|
116
|
+
theme?: Theme;
|
|
117
|
+
initialMode?: ThemeMode;
|
|
118
|
+
children?: ReactNode;
|
|
119
|
+
}
|
|
120
|
+
declare const ThemeContext: react__default.Context<ThemeContextProps>;
|
|
121
|
+
declare const useTheme: () => ThemeContextProps;
|
|
122
|
+
declare const ThemeProvider: ({ colors, lightColors, darkColors, theme, initialMode, children, }: ThemeProviderProps) => react__default.JSX.Element;
|
|
123
|
+
|
|
124
|
+
type ResponsiveConfig = Record<string, number>;
|
|
125
|
+
type DeviceConfig = Record<string, string[]>;
|
|
126
|
+
type QueryConfig = Record<string, string>;
|
|
127
|
+
type ScreenOrientation = 'landscape' | 'portrait';
|
|
128
|
+
type DeviceType = 'mobile' | 'tablet' | 'desktop';
|
|
129
|
+
type BreakpointConfig = {
|
|
130
|
+
breakpoints: ResponsiveConfig;
|
|
131
|
+
devices: DeviceConfig;
|
|
132
|
+
mediaQueries: QueryConfig;
|
|
133
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
134
|
+
currentDevice: DeviceType;
|
|
135
|
+
orientation: ScreenOrientation;
|
|
136
|
+
};
|
|
137
|
+
type WindowDimensions = {
|
|
138
|
+
width: number;
|
|
139
|
+
height: number;
|
|
140
|
+
};
|
|
141
|
+
type ScreenConfig = BreakpointConfig & {
|
|
142
|
+
currentWidth: number;
|
|
143
|
+
currentHeight: number;
|
|
144
|
+
};
|
|
145
|
+
declare function getBreakpointFromWidth(width: number, breakpoints: ResponsiveConfig): keyof ResponsiveConfig;
|
|
146
|
+
declare function getDeviceFromBreakpoint(breakpoint: string, devices: DeviceConfig): DeviceType;
|
|
147
|
+
declare const BreakpointContext: react__default.Context<BreakpointConfig>;
|
|
148
|
+
declare const WindowDimensionsContext: react__default.Context<WindowDimensions>;
|
|
149
|
+
declare const ResponsiveContext: react__default.Context<ScreenConfig>;
|
|
150
|
+
declare const useBreakpointContext: () => BreakpointConfig;
|
|
151
|
+
declare const useWindowDimensionsContext: () => WindowDimensions;
|
|
152
|
+
declare const useResponsiveContext: () => ScreenConfig;
|
|
153
|
+
interface ResponsiveProviderProps {
|
|
154
|
+
breakpoints?: ResponsiveConfig;
|
|
155
|
+
devices?: DeviceConfig;
|
|
156
|
+
children?: ReactNode;
|
|
157
|
+
targetWindow?: Window;
|
|
158
|
+
}
|
|
159
|
+
declare const ResponsiveProvider: ({ breakpoints, devices, children, }: ResponsiveProviderProps) => react__default.JSX.Element;
|
|
160
|
+
|
|
161
|
+
declare const WindowSizeContext: react__default.Context<{
|
|
162
|
+
width: number;
|
|
163
|
+
height: number;
|
|
164
|
+
}>;
|
|
165
|
+
interface WindowSizeProviderProps {
|
|
166
|
+
children: ReactNode;
|
|
167
|
+
targetWindow?: Window;
|
|
168
|
+
}
|
|
169
|
+
declare const WindowSizeProvider: ({ children }: WindowSizeProviderProps) => react__default.JSX.Element;
|
|
170
|
+
|
|
171
|
+
declare const useStyleRegistry: () => {
|
|
172
|
+
manager: undefined;
|
|
173
|
+
};
|
|
174
|
+
declare const StyleRegistry: ({ children }: {
|
|
175
|
+
children: react__default.ReactNode;
|
|
176
|
+
}) => react__default.JSX.Element;
|
|
177
|
+
declare const createStyleRegistry: () => undefined;
|
|
178
|
+
declare const useServerInsertedHTML: () => () => null;
|
|
179
|
+
|
|
180
|
+
declare const useWindowSize: () => {
|
|
181
|
+
width: number;
|
|
182
|
+
height: number;
|
|
183
|
+
};
|
|
184
|
+
declare const useBreakpoint: () => {
|
|
185
|
+
screen: string;
|
|
186
|
+
orientation: ScreenOrientation;
|
|
187
|
+
on: (target: string) => boolean;
|
|
188
|
+
is: (target: string) => boolean;
|
|
189
|
+
breakpoints: ResponsiveConfig;
|
|
190
|
+
devices: DeviceConfig;
|
|
191
|
+
mediaQueries: QueryConfig;
|
|
192
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
193
|
+
currentDevice: DeviceType;
|
|
194
|
+
};
|
|
195
|
+
declare const useWindowDimensions: () => WindowDimensions;
|
|
196
|
+
declare const useResponsive: () => {
|
|
197
|
+
screen: string;
|
|
198
|
+
orientation: ScreenOrientation;
|
|
199
|
+
on: (target: string) => boolean;
|
|
200
|
+
is: (target: string) => boolean;
|
|
201
|
+
breakpoints: ResponsiveConfig;
|
|
202
|
+
devices: DeviceConfig;
|
|
203
|
+
mediaQueries: QueryConfig;
|
|
204
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
205
|
+
currentDevice: DeviceType;
|
|
206
|
+
currentWidth: number;
|
|
207
|
+
currentHeight: number;
|
|
208
|
+
};
|
|
209
|
+
declare const useMount: (callback: () => void) => void;
|
|
210
|
+
declare const useHover: () => {
|
|
211
|
+
isHovered: boolean;
|
|
212
|
+
hoverProps: {};
|
|
213
|
+
};
|
|
214
|
+
declare const useActive: () => {
|
|
215
|
+
isActive: boolean;
|
|
216
|
+
activeProps: {};
|
|
217
|
+
};
|
|
218
|
+
declare const useFocus: () => {
|
|
219
|
+
isFocused: boolean;
|
|
220
|
+
focusProps: {};
|
|
221
|
+
};
|
|
222
|
+
declare const useClickOutside: () => {
|
|
223
|
+
ref: react.MutableRefObject<null>;
|
|
224
|
+
isOutside: boolean;
|
|
225
|
+
};
|
|
226
|
+
declare const useElementPosition: () => {
|
|
227
|
+
ref: react.MutableRefObject<null>;
|
|
228
|
+
position: null;
|
|
229
|
+
};
|
|
230
|
+
declare const useKeyPress: () => boolean;
|
|
231
|
+
declare const useOnScreen: () => {
|
|
232
|
+
ref: react.MutableRefObject<null>;
|
|
233
|
+
isOnScreen: boolean;
|
|
234
|
+
};
|
|
235
|
+
declare const useInView: () => {
|
|
236
|
+
ref: react.MutableRefObject<null>;
|
|
237
|
+
inView: boolean;
|
|
238
|
+
};
|
|
239
|
+
declare const useIframeStyles: () => {
|
|
240
|
+
iframeRef: react.MutableRefObject<null>;
|
|
241
|
+
};
|
|
242
|
+
declare const useScroll: () => {
|
|
243
|
+
scrollY: number;
|
|
244
|
+
scrollX: number;
|
|
245
|
+
scrollDirection: null;
|
|
246
|
+
scrollTo: () => void;
|
|
247
|
+
scrollToTop: () => void;
|
|
248
|
+
scrollToBottom: () => void;
|
|
249
|
+
};
|
|
250
|
+
|
|
251
|
+
export { type BreakpointConfig, BreakpointContext, Button, type ButtonProps, Center, ColorPalette, ColorSingleton, type Colors, type CssProps, type DeviceConfig, type DeviceType, Div, Element, type ElementProps, Form, Horizontal, HorizontalResponsive, Image, ImageBackground, type ImageProps, Input, type InputProps, type QueryConfig, type ResponsiveConfig, ResponsiveContext, ResponsiveProvider, type ResponsiveProviderProps, SafeArea, type ScreenConfig, type ScreenOrientation, Scroll, Skeleton, Span, StyleRegistry, Text, type TextProps, type Theme, ThemeContext, type ThemeMode, ThemeProvider, type ThemeProviderProps, Vertical, VerticalResponsive, View, type ViewProps, type WindowDimensions, WindowDimensionsContext, WindowSizeContext, WindowSizeProvider, type WindowSizeProviderProps, createStyleRegistry, getBreakpointFromWidth, getDeviceFromBreakpoint, useActive, useBreakpoint, useBreakpointContext, useClickOutside, useElementPosition, useFocus, useHover, useIframeStyles, useInView, useKeyPress, useMount, useOnScreen, useResponsive, useResponsiveContext, useScroll, useServerInsertedHTML, useStyleRegistry, useTheme, useWindowDimensions, useWindowDimensionsContext, useWindowSize };
|
|
@@ -0,0 +1,251 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import react__default, { ReactNode } from 'react';
|
|
3
|
+
import { ViewStyle, TextStyle, ImageStyle, StyleProp, ImageSourcePropType } from 'react-native';
|
|
4
|
+
import { C as ColorSingleton, a as ColorPalette } from '../viewAnimation-B4BIoOwQ.js';
|
|
5
|
+
export { b as AnalyticsConfig, c as AnalyticsContext, d as AnalyticsProvider, e as Animation, B as BlurAnimationOptions, f as ColorConfig, R as RotateAnimationOptions, g as ScaleAnimationOptions, S as Shadow, h as Shadows, i as SlideAnimationOptions, j as Typography, k as ViewAnimationConfig, l as ViewAnimationFillMode, m as ViewAnimationOptions, n as ViewAnimationRange, o as ViewAnimationTimingFunction, p as animateOnView, q as blurInOnView, r as blurOutOnView, s as createViewAnimation, t as defaultColors, u as defaultDarkColors, v as defaultDarkPalette, w as defaultLightColors, x as defaultLightPalette, y as fadeInOnView, z as fadeOutOnView, D as flipXOnView, E as flipYOnView, F as getWindowInitialProps, G as hasColorToken, H as isBrowser, J as isDev, K as isMobile, L as isProd, M as isSSR, N as replaceColorTokens, O as revealOnView, P as rotateInOnView, Q as scaleDownOnView, U as scaleUpOnView, W as slideDownOnView, X as slideLeftOnView, Y as slideRightOnView, Z as slideUpOnView, _ as useAnalytics, $ as viewAnimationPresets } from '../viewAnimation-B4BIoOwQ.js';
|
|
6
|
+
|
|
7
|
+
type NativeStyle = ViewStyle & TextStyle & ImageStyle;
|
|
8
|
+
type NativeStyleValue = NativeStyle[keyof NativeStyle] | string | number;
|
|
9
|
+
type NativeStyleProps = Partial<Record<keyof NativeStyle, NativeStyleValue>> & {
|
|
10
|
+
widthHeight?: number | string;
|
|
11
|
+
paddingHorizontal?: number | string;
|
|
12
|
+
paddingVertical?: number | string;
|
|
13
|
+
marginHorizontal?: number | string;
|
|
14
|
+
marginVertical?: number | string;
|
|
15
|
+
shadow?: boolean | number;
|
|
16
|
+
};
|
|
17
|
+
interface NativeElementProps extends NativeStyleProps {
|
|
18
|
+
children?: react__default.ReactNode;
|
|
19
|
+
style?: StyleProp<NativeStyle>;
|
|
20
|
+
css?: NativeStyle;
|
|
21
|
+
media?: Record<string, NativeStyleProps>;
|
|
22
|
+
on?: Record<string, NativeStyleProps>;
|
|
23
|
+
onPress?: (...args: any[]) => void;
|
|
24
|
+
onClick?: (...args: any[]) => void;
|
|
25
|
+
testID?: string;
|
|
26
|
+
className?: string;
|
|
27
|
+
as?: unknown;
|
|
28
|
+
animate?: unknown;
|
|
29
|
+
animateIn?: unknown;
|
|
30
|
+
animateOut?: unknown;
|
|
31
|
+
animateOn?: unknown;
|
|
32
|
+
blend?: boolean;
|
|
33
|
+
before?: react__default.ReactNode;
|
|
34
|
+
after?: react__default.ReactNode;
|
|
35
|
+
theme?: Record<string, string>;
|
|
36
|
+
[key: string]: any;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
type CssProps = NativeStyleProps;
|
|
40
|
+
type ElementProps = NativeElementProps;
|
|
41
|
+
type ViewProps = NativeElementProps;
|
|
42
|
+
type TextProps = NativeElementProps & {
|
|
43
|
+
toUpperCase?: boolean;
|
|
44
|
+
isItalic?: boolean;
|
|
45
|
+
isStriked?: boolean;
|
|
46
|
+
isUnderlined?: boolean;
|
|
47
|
+
isSub?: boolean;
|
|
48
|
+
isSup?: boolean;
|
|
49
|
+
maxLines?: number;
|
|
50
|
+
bgColor?: string;
|
|
51
|
+
};
|
|
52
|
+
type ImageProps = NativeElementProps & {
|
|
53
|
+
src?: string;
|
|
54
|
+
source?: ImageSourcePropType;
|
|
55
|
+
alt?: string;
|
|
56
|
+
};
|
|
57
|
+
type InputProps = NativeElementProps & {
|
|
58
|
+
value?: string;
|
|
59
|
+
defaultValue?: string;
|
|
60
|
+
placeholder?: string;
|
|
61
|
+
onChangeText?: (value: string) => void;
|
|
62
|
+
};
|
|
63
|
+
type ButtonProps = NativeElementProps & {
|
|
64
|
+
disabled?: boolean;
|
|
65
|
+
};
|
|
66
|
+
declare const Element: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
67
|
+
declare const View: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
68
|
+
declare const Horizontal: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
69
|
+
declare const Vertical: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
70
|
+
declare const Center: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
71
|
+
declare const HorizontalResponsive: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
72
|
+
declare const VerticalResponsive: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
73
|
+
declare const Scroll: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
74
|
+
declare const SafeArea: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
75
|
+
declare const Div: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
76
|
+
declare const Span: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
77
|
+
declare const Text: react__default.ForwardRefExoticComponent<Omit<TextProps, "ref"> & react__default.RefAttributes<any>>;
|
|
78
|
+
declare const Image: react__default.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & react__default.RefAttributes<any>>;
|
|
79
|
+
declare const ImageBackground: react__default.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & react__default.RefAttributes<any>>;
|
|
80
|
+
declare const Form: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
81
|
+
declare const Input: react__default.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react__default.RefAttributes<any>>;
|
|
82
|
+
declare const Button: react__default.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & react__default.RefAttributes<any>>;
|
|
83
|
+
declare const Skeleton: react__default.ForwardRefExoticComponent<Omit<NativeElementProps, "ref"> & react__default.RefAttributes<any>>;
|
|
84
|
+
|
|
85
|
+
type ThemeMode = 'light' | 'dark';
|
|
86
|
+
interface Colors {
|
|
87
|
+
main: ColorSingleton;
|
|
88
|
+
palette: ColorPalette;
|
|
89
|
+
}
|
|
90
|
+
interface Theme {
|
|
91
|
+
primary?: string;
|
|
92
|
+
secondary?: string;
|
|
93
|
+
success?: string;
|
|
94
|
+
error?: string;
|
|
95
|
+
warning?: string;
|
|
96
|
+
disabled?: string;
|
|
97
|
+
loading?: string;
|
|
98
|
+
[key: string]: string | undefined;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
interface ThemeContextProps {
|
|
102
|
+
getColor: (name: string) => string;
|
|
103
|
+
getColorHex: (name: string) => string;
|
|
104
|
+
getColorRGBA: (name: string, alpha?: number) => string;
|
|
105
|
+
getColorScheme: (name: string) => string | undefined;
|
|
106
|
+
getContrastColor: (name: string) => 'black' | 'white';
|
|
107
|
+
theme: Theme;
|
|
108
|
+
colors: Colors;
|
|
109
|
+
themeMode: ThemeMode;
|
|
110
|
+
setThemeMode: (mode: ThemeMode) => void;
|
|
111
|
+
}
|
|
112
|
+
interface ThemeProviderProps {
|
|
113
|
+
colors?: Partial<Colors>;
|
|
114
|
+
lightColors?: Partial<Colors>;
|
|
115
|
+
darkColors?: Partial<Colors>;
|
|
116
|
+
theme?: Theme;
|
|
117
|
+
initialMode?: ThemeMode;
|
|
118
|
+
children?: ReactNode;
|
|
119
|
+
}
|
|
120
|
+
declare const ThemeContext: react__default.Context<ThemeContextProps>;
|
|
121
|
+
declare const useTheme: () => ThemeContextProps;
|
|
122
|
+
declare const ThemeProvider: ({ colors, lightColors, darkColors, theme, initialMode, children, }: ThemeProviderProps) => react__default.JSX.Element;
|
|
123
|
+
|
|
124
|
+
type ResponsiveConfig = Record<string, number>;
|
|
125
|
+
type DeviceConfig = Record<string, string[]>;
|
|
126
|
+
type QueryConfig = Record<string, string>;
|
|
127
|
+
type ScreenOrientation = 'landscape' | 'portrait';
|
|
128
|
+
type DeviceType = 'mobile' | 'tablet' | 'desktop';
|
|
129
|
+
type BreakpointConfig = {
|
|
130
|
+
breakpoints: ResponsiveConfig;
|
|
131
|
+
devices: DeviceConfig;
|
|
132
|
+
mediaQueries: QueryConfig;
|
|
133
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
134
|
+
currentDevice: DeviceType;
|
|
135
|
+
orientation: ScreenOrientation;
|
|
136
|
+
};
|
|
137
|
+
type WindowDimensions = {
|
|
138
|
+
width: number;
|
|
139
|
+
height: number;
|
|
140
|
+
};
|
|
141
|
+
type ScreenConfig = BreakpointConfig & {
|
|
142
|
+
currentWidth: number;
|
|
143
|
+
currentHeight: number;
|
|
144
|
+
};
|
|
145
|
+
declare function getBreakpointFromWidth(width: number, breakpoints: ResponsiveConfig): keyof ResponsiveConfig;
|
|
146
|
+
declare function getDeviceFromBreakpoint(breakpoint: string, devices: DeviceConfig): DeviceType;
|
|
147
|
+
declare const BreakpointContext: react__default.Context<BreakpointConfig>;
|
|
148
|
+
declare const WindowDimensionsContext: react__default.Context<WindowDimensions>;
|
|
149
|
+
declare const ResponsiveContext: react__default.Context<ScreenConfig>;
|
|
150
|
+
declare const useBreakpointContext: () => BreakpointConfig;
|
|
151
|
+
declare const useWindowDimensionsContext: () => WindowDimensions;
|
|
152
|
+
declare const useResponsiveContext: () => ScreenConfig;
|
|
153
|
+
interface ResponsiveProviderProps {
|
|
154
|
+
breakpoints?: ResponsiveConfig;
|
|
155
|
+
devices?: DeviceConfig;
|
|
156
|
+
children?: ReactNode;
|
|
157
|
+
targetWindow?: Window;
|
|
158
|
+
}
|
|
159
|
+
declare const ResponsiveProvider: ({ breakpoints, devices, children, }: ResponsiveProviderProps) => react__default.JSX.Element;
|
|
160
|
+
|
|
161
|
+
declare const WindowSizeContext: react__default.Context<{
|
|
162
|
+
width: number;
|
|
163
|
+
height: number;
|
|
164
|
+
}>;
|
|
165
|
+
interface WindowSizeProviderProps {
|
|
166
|
+
children: ReactNode;
|
|
167
|
+
targetWindow?: Window;
|
|
168
|
+
}
|
|
169
|
+
declare const WindowSizeProvider: ({ children }: WindowSizeProviderProps) => react__default.JSX.Element;
|
|
170
|
+
|
|
171
|
+
declare const useStyleRegistry: () => {
|
|
172
|
+
manager: undefined;
|
|
173
|
+
};
|
|
174
|
+
declare const StyleRegistry: ({ children }: {
|
|
175
|
+
children: react__default.ReactNode;
|
|
176
|
+
}) => react__default.JSX.Element;
|
|
177
|
+
declare const createStyleRegistry: () => undefined;
|
|
178
|
+
declare const useServerInsertedHTML: () => () => null;
|
|
179
|
+
|
|
180
|
+
declare const useWindowSize: () => {
|
|
181
|
+
width: number;
|
|
182
|
+
height: number;
|
|
183
|
+
};
|
|
184
|
+
declare const useBreakpoint: () => {
|
|
185
|
+
screen: string;
|
|
186
|
+
orientation: ScreenOrientation;
|
|
187
|
+
on: (target: string) => boolean;
|
|
188
|
+
is: (target: string) => boolean;
|
|
189
|
+
breakpoints: ResponsiveConfig;
|
|
190
|
+
devices: DeviceConfig;
|
|
191
|
+
mediaQueries: QueryConfig;
|
|
192
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
193
|
+
currentDevice: DeviceType;
|
|
194
|
+
};
|
|
195
|
+
declare const useWindowDimensions: () => WindowDimensions;
|
|
196
|
+
declare const useResponsive: () => {
|
|
197
|
+
screen: string;
|
|
198
|
+
orientation: ScreenOrientation;
|
|
199
|
+
on: (target: string) => boolean;
|
|
200
|
+
is: (target: string) => boolean;
|
|
201
|
+
breakpoints: ResponsiveConfig;
|
|
202
|
+
devices: DeviceConfig;
|
|
203
|
+
mediaQueries: QueryConfig;
|
|
204
|
+
currentBreakpoint: keyof ResponsiveConfig;
|
|
205
|
+
currentDevice: DeviceType;
|
|
206
|
+
currentWidth: number;
|
|
207
|
+
currentHeight: number;
|
|
208
|
+
};
|
|
209
|
+
declare const useMount: (callback: () => void) => void;
|
|
210
|
+
declare const useHover: () => {
|
|
211
|
+
isHovered: boolean;
|
|
212
|
+
hoverProps: {};
|
|
213
|
+
};
|
|
214
|
+
declare const useActive: () => {
|
|
215
|
+
isActive: boolean;
|
|
216
|
+
activeProps: {};
|
|
217
|
+
};
|
|
218
|
+
declare const useFocus: () => {
|
|
219
|
+
isFocused: boolean;
|
|
220
|
+
focusProps: {};
|
|
221
|
+
};
|
|
222
|
+
declare const useClickOutside: () => {
|
|
223
|
+
ref: react.MutableRefObject<null>;
|
|
224
|
+
isOutside: boolean;
|
|
225
|
+
};
|
|
226
|
+
declare const useElementPosition: () => {
|
|
227
|
+
ref: react.MutableRefObject<null>;
|
|
228
|
+
position: null;
|
|
229
|
+
};
|
|
230
|
+
declare const useKeyPress: () => boolean;
|
|
231
|
+
declare const useOnScreen: () => {
|
|
232
|
+
ref: react.MutableRefObject<null>;
|
|
233
|
+
isOnScreen: boolean;
|
|
234
|
+
};
|
|
235
|
+
declare const useInView: () => {
|
|
236
|
+
ref: react.MutableRefObject<null>;
|
|
237
|
+
inView: boolean;
|
|
238
|
+
};
|
|
239
|
+
declare const useIframeStyles: () => {
|
|
240
|
+
iframeRef: react.MutableRefObject<null>;
|
|
241
|
+
};
|
|
242
|
+
declare const useScroll: () => {
|
|
243
|
+
scrollY: number;
|
|
244
|
+
scrollX: number;
|
|
245
|
+
scrollDirection: null;
|
|
246
|
+
scrollTo: () => void;
|
|
247
|
+
scrollToTop: () => void;
|
|
248
|
+
scrollToBottom: () => void;
|
|
249
|
+
};
|
|
250
|
+
|
|
251
|
+
export { type BreakpointConfig, BreakpointContext, Button, type ButtonProps, Center, ColorPalette, ColorSingleton, type Colors, type CssProps, type DeviceConfig, type DeviceType, Div, Element, type ElementProps, Form, Horizontal, HorizontalResponsive, Image, ImageBackground, type ImageProps, Input, type InputProps, type QueryConfig, type ResponsiveConfig, ResponsiveContext, ResponsiveProvider, type ResponsiveProviderProps, SafeArea, type ScreenConfig, type ScreenOrientation, Scroll, Skeleton, Span, StyleRegistry, Text, type TextProps, type Theme, ThemeContext, type ThemeMode, ThemeProvider, type ThemeProviderProps, Vertical, VerticalResponsive, View, type ViewProps, type WindowDimensions, WindowDimensionsContext, WindowSizeContext, WindowSizeProvider, type WindowSizeProviderProps, createStyleRegistry, getBreakpointFromWidth, getDeviceFromBreakpoint, useActive, useBreakpoint, useBreakpointContext, useClickOutside, useElementPosition, useFocus, useHover, useIframeStyles, useInView, useKeyPress, useMount, useOnScreen, useResponsive, useResponsiveContext, useScroll, useServerInsertedHTML, useStyleRegistry, useTheme, useWindowDimensions, useWindowDimensionsContext, useWindowSize };
|