reactnatively-core 0.1.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/LICENSE +20 -0
- package/dist/index.d.mts +1519 -0
- package/dist/index.d.ts +1519 -0
- package/dist/index.js +12333 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +12088 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +82 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,1519 @@
|
|
|
1
|
+
import React$1, { ReactNode } from 'react';
|
|
2
|
+
import { StyleProp, ViewStyle, FlexStyle, TextStyle, TextProps as TextProps$1, PressableProps, GestureResponderEvent, TextInputProps as TextInputProps$1, ImageStyle } from 'react-native';
|
|
3
|
+
import { SpacingKey, RadiiKey, GlassElevation, GlassTintVariant } from 'reactnatively-theme';
|
|
4
|
+
export { BaseTheme, ColorSchemePreference, GlassElevation, GlassTintVariant, InferTheme, ResolvedColorScheme, ThemeColors, ThemeProvider, baseTheme, createTheme, glassTokens, motion, radii, shadows, spacing, springs, typography, useColorScheme, useIsDark, useTheme, useToken } from 'reactnatively-theme';
|
|
5
|
+
export { GlassSurfaceConfig, Surface, SurfaceProps } from 'reactnatively-primitives';
|
|
6
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
|
+
import { SharedValue } from 'react-native-reanimated';
|
|
8
|
+
export { FrostPanel, FrostPanelProps, GLASS_CAPABILITY, GlassConfig, GlassView, GlassViewProps, IS_FULL_GLASS, IS_NO_GLASS, IS_PARTIAL_GLASS, ResolvedGlassStyle, SUPPORTS_BLUR, useGlassStyle } from 'reactnatively-glass';
|
|
9
|
+
export { SPRING_BOUNCE, SPRING_LIQUID, SPRING_PRECISE, SPRING_REVEAL, SPRING_SNAPPY, TIMING_ENTER, TIMING_EXIT, TIMING_FAST, TIMING_NORMAL, TIMING_SLOW, useDuration, useEntranceAnimation, usePressAnimation, useReducedMotion, useSpring } from 'reactnatively-animations';
|
|
10
|
+
|
|
11
|
+
type FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';
|
|
12
|
+
type FlexAlign = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
|
|
13
|
+
type FlexJustify = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
|
|
14
|
+
type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
|
|
15
|
+
interface BoxProps {
|
|
16
|
+
p?: SpacingKey | number;
|
|
17
|
+
px?: SpacingKey | number;
|
|
18
|
+
py?: SpacingKey | number;
|
|
19
|
+
pt?: SpacingKey | number;
|
|
20
|
+
pb?: SpacingKey | number;
|
|
21
|
+
pl?: SpacingKey | number;
|
|
22
|
+
pr?: SpacingKey | number;
|
|
23
|
+
m?: SpacingKey | number;
|
|
24
|
+
mx?: SpacingKey | number;
|
|
25
|
+
my?: SpacingKey | number;
|
|
26
|
+
mt?: SpacingKey | number;
|
|
27
|
+
mb?: SpacingKey | number;
|
|
28
|
+
ml?: SpacingKey | number;
|
|
29
|
+
mr?: SpacingKey | number;
|
|
30
|
+
flex?: number;
|
|
31
|
+
direction?: FlexDirection;
|
|
32
|
+
align?: FlexAlign;
|
|
33
|
+
justify?: FlexJustify;
|
|
34
|
+
wrap?: FlexWrap;
|
|
35
|
+
gap?: SpacingKey | number;
|
|
36
|
+
rowGap?: SpacingKey | number;
|
|
37
|
+
columnGap?: SpacingKey | number;
|
|
38
|
+
selfAlign?: FlexAlign | 'auto';
|
|
39
|
+
width?: number | string;
|
|
40
|
+
height?: number | string;
|
|
41
|
+
minWidth?: number | string;
|
|
42
|
+
maxWidth?: number | string;
|
|
43
|
+
minHeight?: number | string;
|
|
44
|
+
maxHeight?: number | string;
|
|
45
|
+
bg?: string;
|
|
46
|
+
borderRadius?: RadiiKey | number;
|
|
47
|
+
overflow?: 'visible' | 'hidden' | 'scroll';
|
|
48
|
+
opacity?: number;
|
|
49
|
+
position?: 'relative' | 'absolute';
|
|
50
|
+
top?: number;
|
|
51
|
+
right?: number;
|
|
52
|
+
bottom?: number;
|
|
53
|
+
left?: number;
|
|
54
|
+
zIndex?: number;
|
|
55
|
+
style?: StyleProp<ViewStyle>;
|
|
56
|
+
children?: ReactNode;
|
|
57
|
+
testID?: string;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
declare const Box: React$1.NamedExoticComponent<BoxProps>;
|
|
61
|
+
|
|
62
|
+
interface StackProps {
|
|
63
|
+
direction?: 'vertical' | 'horizontal';
|
|
64
|
+
gap?: SpacingKey | number;
|
|
65
|
+
align?: ViewStyle['alignItems'];
|
|
66
|
+
justify?: ViewStyle['justifyContent'];
|
|
67
|
+
flex?: number;
|
|
68
|
+
wrap?: boolean;
|
|
69
|
+
divider?: boolean;
|
|
70
|
+
style?: StyleProp<ViewStyle>;
|
|
71
|
+
children?: ReactNode;
|
|
72
|
+
testID?: string;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
declare const Stack: React$1.NamedExoticComponent<StackProps>;
|
|
76
|
+
declare const HStack: React$1.NamedExoticComponent<Omit<StackProps, "direction">>;
|
|
77
|
+
declare const VStack: React$1.NamedExoticComponent<Omit<StackProps, "direction">>;
|
|
78
|
+
|
|
79
|
+
interface FlexProps {
|
|
80
|
+
direction?: 'row' | 'column';
|
|
81
|
+
gap?: SpacingKey | number;
|
|
82
|
+
align?: FlexStyle['alignItems'];
|
|
83
|
+
justify?: FlexStyle['justifyContent'];
|
|
84
|
+
wrap?: boolean;
|
|
85
|
+
flex?: number;
|
|
86
|
+
grow?: number;
|
|
87
|
+
shrink?: number;
|
|
88
|
+
basis?: number | string;
|
|
89
|
+
children?: ReactNode;
|
|
90
|
+
style?: StyleProp<ViewStyle>;
|
|
91
|
+
testID?: string;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
declare const Flex: React$1.NamedExoticComponent<FlexProps>;
|
|
95
|
+
|
|
96
|
+
interface GridProps {
|
|
97
|
+
columns?: number;
|
|
98
|
+
gap?: SpacingKey | number;
|
|
99
|
+
rowGap?: SpacingKey | number;
|
|
100
|
+
columnGap?: SpacingKey | number;
|
|
101
|
+
children?: ReactNode;
|
|
102
|
+
style?: StyleProp<ViewStyle>;
|
|
103
|
+
testID?: string;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
declare const Grid: React$1.NamedExoticComponent<GridProps>;
|
|
107
|
+
|
|
108
|
+
interface CenterProps {
|
|
109
|
+
flex?: number;
|
|
110
|
+
children?: ReactNode;
|
|
111
|
+
style?: StyleProp<ViewStyle>;
|
|
112
|
+
testID?: string;
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
declare const Center: React$1.NamedExoticComponent<CenterProps>;
|
|
116
|
+
|
|
117
|
+
interface SpacerProps {
|
|
118
|
+
size?: SpacingKey | number;
|
|
119
|
+
axis?: 'horizontal' | 'vertical' | 'both';
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
declare const Spacer: React$1.NamedExoticComponent<SpacerProps>;
|
|
123
|
+
|
|
124
|
+
type ContainerMaxWidth = 'sm' | 'md' | 'lg' | 'xl';
|
|
125
|
+
interface ContainerProps {
|
|
126
|
+
maxWidth?: number | ContainerMaxWidth;
|
|
127
|
+
px?: SpacingKey | number;
|
|
128
|
+
py?: SpacingKey | number;
|
|
129
|
+
center?: boolean;
|
|
130
|
+
children?: ReactNode;
|
|
131
|
+
style?: StyleProp<ViewStyle>;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
declare const Container: React$1.NamedExoticComponent<ContainerProps>;
|
|
135
|
+
|
|
136
|
+
interface DividerProps {
|
|
137
|
+
orientation?: 'horizontal' | 'vertical';
|
|
138
|
+
thickness?: number;
|
|
139
|
+
color?: string;
|
|
140
|
+
spacing?: SpacingKey | number;
|
|
141
|
+
label?: string;
|
|
142
|
+
labelStyle?: StyleProp<TextStyle>;
|
|
143
|
+
style?: StyleProp<ViewStyle>;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
declare const Divider: React$1.NamedExoticComponent<DividerProps>;
|
|
147
|
+
|
|
148
|
+
interface AspectRatioProps {
|
|
149
|
+
ratio: number;
|
|
150
|
+
children?: ReactNode;
|
|
151
|
+
style?: StyleProp<ViewStyle>;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
declare const AspectRatio: React$1.NamedExoticComponent<AspectRatioProps>;
|
|
155
|
+
|
|
156
|
+
type TextVariant = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
157
|
+
type TextWeight = 'regular' | 'medium' | 'semibold' | 'bold' | 'extrabold';
|
|
158
|
+
interface TextProps extends Omit<TextProps$1, 'style'> {
|
|
159
|
+
variant?: TextVariant;
|
|
160
|
+
weight?: TextWeight;
|
|
161
|
+
color?: string;
|
|
162
|
+
align?: 'left' | 'center' | 'right' | 'justify';
|
|
163
|
+
italic?: boolean;
|
|
164
|
+
underline?: boolean;
|
|
165
|
+
strikethrough?: boolean;
|
|
166
|
+
numberOfLines?: number;
|
|
167
|
+
style?: StyleProp<TextStyle>;
|
|
168
|
+
children?: ReactNode;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
declare const Text: React$1.NamedExoticComponent<TextProps>;
|
|
172
|
+
|
|
173
|
+
type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
174
|
+
interface HeadingProps extends Omit<TextProps$1, 'style'> {
|
|
175
|
+
level?: HeadingLevel;
|
|
176
|
+
weight?: TextWeight;
|
|
177
|
+
color?: string;
|
|
178
|
+
align?: 'left' | 'center' | 'right';
|
|
179
|
+
style?: StyleProp<TextStyle>;
|
|
180
|
+
children?: ReactNode;
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
declare const Heading: React$1.NamedExoticComponent<HeadingProps>;
|
|
184
|
+
|
|
185
|
+
interface CaptionProps {
|
|
186
|
+
color?: string;
|
|
187
|
+
align?: 'left' | 'center' | 'right';
|
|
188
|
+
style?: StyleProp<TextStyle>;
|
|
189
|
+
children?: ReactNode;
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
declare const Caption: React$1.NamedExoticComponent<CaptionProps>;
|
|
193
|
+
|
|
194
|
+
type ParagraphSize = 'sm' | 'md' | 'lg';
|
|
195
|
+
interface ParagraphProps {
|
|
196
|
+
size?: ParagraphSize;
|
|
197
|
+
color?: string;
|
|
198
|
+
align?: 'left' | 'center' | 'right' | 'justify';
|
|
199
|
+
style?: StyleProp<TextStyle>;
|
|
200
|
+
children?: ReactNode;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
declare const Paragraph: React$1.NamedExoticComponent<ParagraphProps>;
|
|
204
|
+
|
|
205
|
+
interface LinkProps extends Omit<TextProps$1, 'style'> {
|
|
206
|
+
href?: string;
|
|
207
|
+
onPress?: () => void;
|
|
208
|
+
color?: string;
|
|
209
|
+
underline?: boolean;
|
|
210
|
+
external?: boolean;
|
|
211
|
+
children?: ReactNode;
|
|
212
|
+
style?: StyleProp<TextStyle>;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
declare const Link: React$1.NamedExoticComponent<LinkProps>;
|
|
216
|
+
|
|
217
|
+
interface CodeProps {
|
|
218
|
+
children?: string;
|
|
219
|
+
block?: boolean;
|
|
220
|
+
language?: string;
|
|
221
|
+
glass?: boolean;
|
|
222
|
+
style?: StyleProp<ViewStyle>;
|
|
223
|
+
textStyle?: StyleProp<TextStyle>;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
declare const Code: React$1.NamedExoticComponent<CodeProps>;
|
|
227
|
+
|
|
228
|
+
interface GradientTextProps extends Omit<TextProps$1, 'style'> {
|
|
229
|
+
colors?: string[];
|
|
230
|
+
start?: {
|
|
231
|
+
x: number;
|
|
232
|
+
y: number;
|
|
233
|
+
};
|
|
234
|
+
end?: {
|
|
235
|
+
x: number;
|
|
236
|
+
y: number;
|
|
237
|
+
};
|
|
238
|
+
children?: string;
|
|
239
|
+
style?: StyleProp<TextStyle>;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
declare const GradientText: React$1.NamedExoticComponent<GradientTextProps>;
|
|
243
|
+
|
|
244
|
+
type ButtonVariant = 'solid' | 'outline' | 'ghost' | 'glass' | 'tinted' | 'destructive';
|
|
245
|
+
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
246
|
+
type ButtonColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'danger' | 'neutral';
|
|
247
|
+
interface GlassButtonConfig {
|
|
248
|
+
elevation?: GlassElevation;
|
|
249
|
+
variant?: GlassTintVariant;
|
|
250
|
+
glow?: boolean;
|
|
251
|
+
glowColor?: string;
|
|
252
|
+
}
|
|
253
|
+
interface ButtonProps extends Omit<PressableProps, 'style' | 'children'> {
|
|
254
|
+
variant?: ButtonVariant;
|
|
255
|
+
size?: ButtonSize;
|
|
256
|
+
color?: ButtonColor;
|
|
257
|
+
label?: string;
|
|
258
|
+
children?: ReactNode;
|
|
259
|
+
leftIcon?: ReactNode;
|
|
260
|
+
rightIcon?: ReactNode;
|
|
261
|
+
loading?: boolean;
|
|
262
|
+
disabled?: boolean;
|
|
263
|
+
fullWidth?: boolean;
|
|
264
|
+
flex?: number;
|
|
265
|
+
glass?: GlassButtonConfig;
|
|
266
|
+
style?: StyleProp<ViewStyle>;
|
|
267
|
+
textStyle?: StyleProp<TextStyle>;
|
|
268
|
+
pressedStyle?: StyleProp<ViewStyle>;
|
|
269
|
+
accessibilityLabel?: string;
|
|
270
|
+
accessibilityHint?: string;
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
declare const Button: React$1.NamedExoticComponent<ButtonProps>;
|
|
274
|
+
|
|
275
|
+
type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
276
|
+
type IconButtonVariant = 'solid' | 'outline' | 'ghost' | 'glass';
|
|
277
|
+
interface IconButtonProps {
|
|
278
|
+
icon: ReactNode;
|
|
279
|
+
size?: IconButtonSize;
|
|
280
|
+
variant?: IconButtonVariant;
|
|
281
|
+
color?: ButtonColor;
|
|
282
|
+
isDisabled?: boolean;
|
|
283
|
+
isLoading?: boolean;
|
|
284
|
+
onPress?: (e: GestureResponderEvent) => void;
|
|
285
|
+
accessibilityLabel: string;
|
|
286
|
+
borderRadius?: number;
|
|
287
|
+
glass?: boolean;
|
|
288
|
+
style?: StyleProp<ViewStyle>;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
declare const IconButton: React$1.NamedExoticComponent<IconButtonProps>;
|
|
292
|
+
|
|
293
|
+
type FABSize = 'sm' | 'md' | 'lg';
|
|
294
|
+
type FABVariant = 'solid' | 'glass';
|
|
295
|
+
type FABPosition = 'bottomRight' | 'bottomLeft' | 'bottomCenter' | 'topRight';
|
|
296
|
+
interface FABProps {
|
|
297
|
+
icon: ReactNode;
|
|
298
|
+
label?: string;
|
|
299
|
+
size?: FABSize;
|
|
300
|
+
variant?: FABVariant;
|
|
301
|
+
color?: string;
|
|
302
|
+
position?: FABPosition;
|
|
303
|
+
onPress?: (e: GestureResponderEvent) => void;
|
|
304
|
+
isDisabled?: boolean;
|
|
305
|
+
style?: StyleProp<ViewStyle>;
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
declare const FAB: React$1.NamedExoticComponent<FABProps>;
|
|
309
|
+
|
|
310
|
+
interface FormControlProps {
|
|
311
|
+
/** Explicit HTML-style id forwarded to child inputs via context. Auto-generated if omitted. */
|
|
312
|
+
id?: string;
|
|
313
|
+
/** Label text rendered above the children. */
|
|
314
|
+
label?: string;
|
|
315
|
+
/** Supportive text rendered below the children. Hidden when isInvalid and errorText is provided. */
|
|
316
|
+
helperText?: string;
|
|
317
|
+
/** Error message rendered below the children when isInvalid is true. */
|
|
318
|
+
errorText?: string;
|
|
319
|
+
/** Marks the field as required — appends " *" to label. */
|
|
320
|
+
isRequired?: boolean;
|
|
321
|
+
/** Disables child inputs via context. */
|
|
322
|
+
isDisabled?: boolean;
|
|
323
|
+
/** Marks the field as invalid. Automatically true when errorText is provided. */
|
|
324
|
+
isInvalid?: boolean;
|
|
325
|
+
/** Marks the field as read-only via context. */
|
|
326
|
+
isReadOnly?: boolean;
|
|
327
|
+
children?: ReactNode;
|
|
328
|
+
style?: StyleProp<ViewStyle>;
|
|
329
|
+
}
|
|
330
|
+
|
|
331
|
+
declare const FormControl: React$1.NamedExoticComponent<FormControlProps>;
|
|
332
|
+
|
|
333
|
+
interface FormControlContextValue {
|
|
334
|
+
id: string;
|
|
335
|
+
isRequired: boolean;
|
|
336
|
+
isDisabled: boolean;
|
|
337
|
+
isInvalid: boolean;
|
|
338
|
+
isReadOnly: boolean;
|
|
339
|
+
label?: string;
|
|
340
|
+
helperText?: string;
|
|
341
|
+
errorText?: string;
|
|
342
|
+
}
|
|
343
|
+
declare function useFormControl(): FormControlContextValue | null;
|
|
344
|
+
|
|
345
|
+
type TextInputSize = 'sm' | 'md' | 'lg';
|
|
346
|
+
type TextInputVariant = 'outline' | 'filled' | 'glass' | 'underline';
|
|
347
|
+
interface TextInputProps extends Omit<TextInputProps$1, 'style'> {
|
|
348
|
+
/** Label text (floating label inside the input, animates up when focused/has value). */
|
|
349
|
+
label?: string;
|
|
350
|
+
placeholder?: string;
|
|
351
|
+
helperText?: string;
|
|
352
|
+
errorText?: string;
|
|
353
|
+
/** Node rendered on the left side of the input (icon). */
|
|
354
|
+
leftIcon?: ReactNode;
|
|
355
|
+
/** Node rendered on the right side of the input (icon). */
|
|
356
|
+
rightIcon?: ReactNode;
|
|
357
|
+
/** Non-icon prefix element (e.g. text, select). */
|
|
358
|
+
leftAddon?: ReactNode;
|
|
359
|
+
/** Non-icon suffix element. */
|
|
360
|
+
rightAddon?: ReactNode;
|
|
361
|
+
size?: TextInputSize;
|
|
362
|
+
variant?: TextInputVariant;
|
|
363
|
+
/** Shorthand for variant='glass'. */
|
|
364
|
+
glass?: boolean;
|
|
365
|
+
isRequired?: boolean;
|
|
366
|
+
isDisabled?: boolean;
|
|
367
|
+
isReadOnly?: boolean;
|
|
368
|
+
isInvalid?: boolean;
|
|
369
|
+
/** Show a clear (×) button when the input has a value. */
|
|
370
|
+
clearable?: boolean;
|
|
371
|
+
onClear?: () => void;
|
|
372
|
+
style?: StyleProp<ViewStyle>;
|
|
373
|
+
inputStyle?: StyleProp<TextStyle>;
|
|
374
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
declare const TextInput: React$1.NamedExoticComponent<TextInputProps>;
|
|
378
|
+
|
|
379
|
+
interface PasswordInputProps extends Omit<TextInputProps, 'secureTextEntry' | 'rightIcon'> {
|
|
380
|
+
/** Initial visibility state. Default false (hidden). */
|
|
381
|
+
defaultVisible?: boolean;
|
|
382
|
+
}
|
|
383
|
+
|
|
384
|
+
declare const PasswordInput: React$1.NamedExoticComponent<PasswordInputProps>;
|
|
385
|
+
|
|
386
|
+
interface TextAreaProps extends Omit<TextInputProps, 'clearable' | 'leftIcon' | 'rightIcon' | 'leftAddon' | 'rightAddon'> {
|
|
387
|
+
/** Number of visible lines when not auto-growing. Default 4. */
|
|
388
|
+
numberOfLines?: number;
|
|
389
|
+
/** Automatically grow the textarea as content increases. Default false. */
|
|
390
|
+
autoGrow?: boolean;
|
|
391
|
+
/** Maximum height in pixels when autoGrow is enabled. */
|
|
392
|
+
maxHeight?: number;
|
|
393
|
+
}
|
|
394
|
+
|
|
395
|
+
declare const TextArea: React$1.NamedExoticComponent<TextAreaProps>;
|
|
396
|
+
|
|
397
|
+
type SearchBarSize = 'sm' | 'md' | 'lg';
|
|
398
|
+
interface SearchBarProps {
|
|
399
|
+
value?: string;
|
|
400
|
+
defaultValue?: string;
|
|
401
|
+
onChangeText?: (text: string) => void;
|
|
402
|
+
onSearch?: (text: string) => void;
|
|
403
|
+
onCancel?: () => void;
|
|
404
|
+
placeholder?: string;
|
|
405
|
+
showCancel?: boolean;
|
|
406
|
+
autoFocus?: boolean;
|
|
407
|
+
glass?: boolean;
|
|
408
|
+
size?: SearchBarSize;
|
|
409
|
+
style?: StyleProp<ViewStyle>;
|
|
410
|
+
}
|
|
411
|
+
|
|
412
|
+
declare const SearchBar: React$1.NamedExoticComponent<SearchBarProps>;
|
|
413
|
+
|
|
414
|
+
type CheckboxSize = 'sm' | 'md' | 'lg';
|
|
415
|
+
interface CheckboxProps {
|
|
416
|
+
checked?: boolean;
|
|
417
|
+
defaultChecked?: boolean;
|
|
418
|
+
onChange?: (checked: boolean) => void;
|
|
419
|
+
label?: string;
|
|
420
|
+
helperText?: string;
|
|
421
|
+
errorText?: string;
|
|
422
|
+
size?: CheckboxSize;
|
|
423
|
+
glass?: boolean;
|
|
424
|
+
isDisabled?: boolean;
|
|
425
|
+
isInvalid?: boolean;
|
|
426
|
+
isIndeterminate?: boolean;
|
|
427
|
+
style?: StyleProp<ViewStyle>;
|
|
428
|
+
}
|
|
429
|
+
|
|
430
|
+
declare const Checkbox: React$1.NamedExoticComponent<CheckboxProps>;
|
|
431
|
+
|
|
432
|
+
type RadioSize = 'sm' | 'md' | 'lg';
|
|
433
|
+
interface RadioGroupProps {
|
|
434
|
+
value?: string;
|
|
435
|
+
defaultValue?: string;
|
|
436
|
+
onChange?: (v: string) => void;
|
|
437
|
+
direction?: 'row' | 'column';
|
|
438
|
+
children: React.ReactNode;
|
|
439
|
+
isDisabled?: boolean;
|
|
440
|
+
isInvalid?: boolean;
|
|
441
|
+
size?: RadioSize;
|
|
442
|
+
style?: StyleProp<ViewStyle>;
|
|
443
|
+
}
|
|
444
|
+
interface RadioProps {
|
|
445
|
+
value: string;
|
|
446
|
+
label?: string;
|
|
447
|
+
isDisabled?: boolean;
|
|
448
|
+
style?: StyleProp<ViewStyle>;
|
|
449
|
+
}
|
|
450
|
+
|
|
451
|
+
declare const Radio: React$1.NamedExoticComponent<RadioProps>;
|
|
452
|
+
|
|
453
|
+
declare const RadioGroup: React$1.NamedExoticComponent<RadioGroupProps>;
|
|
454
|
+
|
|
455
|
+
type SwitchSize = 'sm' | 'md' | 'lg';
|
|
456
|
+
type SwitchColor = 'primary' | 'success' | 'warning' | 'error';
|
|
457
|
+
interface SwitchProps {
|
|
458
|
+
checked?: boolean;
|
|
459
|
+
defaultChecked?: boolean;
|
|
460
|
+
onChange?: (checked: boolean) => void;
|
|
461
|
+
size?: SwitchSize;
|
|
462
|
+
color?: SwitchColor;
|
|
463
|
+
label?: string;
|
|
464
|
+
labelPosition?: 'left' | 'right';
|
|
465
|
+
glass?: boolean;
|
|
466
|
+
isDisabled?: boolean;
|
|
467
|
+
style?: StyleProp<ViewStyle>;
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
declare const Switch: React$1.NamedExoticComponent<SwitchProps>;
|
|
471
|
+
|
|
472
|
+
interface SliderProps {
|
|
473
|
+
value?: number;
|
|
474
|
+
defaultValue?: number;
|
|
475
|
+
min?: number;
|
|
476
|
+
max?: number;
|
|
477
|
+
step?: number;
|
|
478
|
+
onChange?: (value: number) => void;
|
|
479
|
+
onChangeEnd?: (value: number) => void;
|
|
480
|
+
size?: 'sm' | 'md' | 'lg';
|
|
481
|
+
color?: string;
|
|
482
|
+
trackColor?: string;
|
|
483
|
+
thumbSize?: number;
|
|
484
|
+
showValue?: boolean;
|
|
485
|
+
marks?: boolean | number[];
|
|
486
|
+
isDisabled?: boolean;
|
|
487
|
+
style?: StyleProp<ViewStyle>;
|
|
488
|
+
}
|
|
489
|
+
|
|
490
|
+
declare function Slider({ value: valueProp, defaultValue, min, max, step, onChange, onChangeEnd, size, color, trackColor, thumbSize: thumbSizeProp, showValue, marks, isDisabled, style, }: SliderProps): react_jsx_runtime.JSX.Element;
|
|
491
|
+
declare namespace Slider {
|
|
492
|
+
var displayName: string;
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
interface RangeSliderProps {
|
|
496
|
+
min?: number;
|
|
497
|
+
max?: number;
|
|
498
|
+
step?: number;
|
|
499
|
+
value?: [number, number];
|
|
500
|
+
defaultValue?: [number, number];
|
|
501
|
+
onChange?: (value: [number, number]) => void;
|
|
502
|
+
onChangeEnd?: (value: [number, number]) => void;
|
|
503
|
+
trackColor?: string;
|
|
504
|
+
activeTrackColor?: string;
|
|
505
|
+
thumbSize?: number;
|
|
506
|
+
glass?: boolean;
|
|
507
|
+
isDisabled?: boolean;
|
|
508
|
+
style?: StyleProp<ViewStyle>;
|
|
509
|
+
}
|
|
510
|
+
|
|
511
|
+
declare const RangeSlider: React$1.NamedExoticComponent<RangeSliderProps>;
|
|
512
|
+
|
|
513
|
+
interface OTPInputProps {
|
|
514
|
+
length?: number;
|
|
515
|
+
value?: string;
|
|
516
|
+
onChange?: (value: string) => void;
|
|
517
|
+
onComplete?: (value: string) => void;
|
|
518
|
+
type?: 'numeric' | 'alphanumeric';
|
|
519
|
+
glass?: boolean;
|
|
520
|
+
isInvalid?: boolean;
|
|
521
|
+
isDisabled?: boolean;
|
|
522
|
+
autoFocus?: boolean;
|
|
523
|
+
style?: StyleProp<ViewStyle>;
|
|
524
|
+
}
|
|
525
|
+
|
|
526
|
+
declare const OTPInput: React$1.NamedExoticComponent<OTPInputProps>;
|
|
527
|
+
|
|
528
|
+
interface SelectOption {
|
|
529
|
+
label: string;
|
|
530
|
+
value: string;
|
|
531
|
+
description?: string;
|
|
532
|
+
disabled?: boolean;
|
|
533
|
+
}
|
|
534
|
+
interface SelectProps {
|
|
535
|
+
options: SelectOption[];
|
|
536
|
+
value?: string;
|
|
537
|
+
defaultValue?: string;
|
|
538
|
+
onChange?: (value: string) => void;
|
|
539
|
+
placeholder?: string;
|
|
540
|
+
label?: string;
|
|
541
|
+
helperText?: string;
|
|
542
|
+
errorText?: string;
|
|
543
|
+
size?: 'sm' | 'md' | 'lg';
|
|
544
|
+
glass?: boolean;
|
|
545
|
+
isDisabled?: boolean;
|
|
546
|
+
isInvalid?: boolean;
|
|
547
|
+
style?: StyleProp<ViewStyle>;
|
|
548
|
+
}
|
|
549
|
+
|
|
550
|
+
declare const Select: React$1.NamedExoticComponent<SelectProps>;
|
|
551
|
+
|
|
552
|
+
interface MultiSelectProps {
|
|
553
|
+
options: SelectOption[];
|
|
554
|
+
value?: string[];
|
|
555
|
+
defaultValue?: string[];
|
|
556
|
+
onChange?: (values: string[]) => void;
|
|
557
|
+
placeholder?: string;
|
|
558
|
+
maxSelections?: number;
|
|
559
|
+
glass?: boolean;
|
|
560
|
+
isDisabled?: boolean;
|
|
561
|
+
isInvalid?: boolean;
|
|
562
|
+
style?: StyleProp<ViewStyle>;
|
|
563
|
+
}
|
|
564
|
+
|
|
565
|
+
declare const MultiSelect: React$1.NamedExoticComponent<MultiSelectProps>;
|
|
566
|
+
|
|
567
|
+
interface DatePickerProps {
|
|
568
|
+
value?: Date;
|
|
569
|
+
defaultValue?: Date;
|
|
570
|
+
onChange?: (date: Date) => void;
|
|
571
|
+
minDate?: Date;
|
|
572
|
+
maxDate?: Date;
|
|
573
|
+
mode?: 'date' | 'datetime';
|
|
574
|
+
glass?: boolean;
|
|
575
|
+
isDisabled?: boolean;
|
|
576
|
+
style?: StyleProp<ViewStyle>;
|
|
577
|
+
}
|
|
578
|
+
|
|
579
|
+
declare const DatePicker: React$1.NamedExoticComponent<DatePickerProps>;
|
|
580
|
+
|
|
581
|
+
interface TimePickerProps {
|
|
582
|
+
value?: Date;
|
|
583
|
+
defaultValue?: Date;
|
|
584
|
+
onChange?: (date: Date) => void;
|
|
585
|
+
use24Hour?: boolean;
|
|
586
|
+
glass?: boolean;
|
|
587
|
+
isDisabled?: boolean;
|
|
588
|
+
style?: StyleProp<ViewStyle>;
|
|
589
|
+
}
|
|
590
|
+
|
|
591
|
+
declare const TimePicker: React$1.NamedExoticComponent<TimePickerProps>;
|
|
592
|
+
|
|
593
|
+
interface LiquidCardProps {
|
|
594
|
+
elevation?: GlassElevation;
|
|
595
|
+
variant?: GlassTintVariant;
|
|
596
|
+
borderRadius?: number;
|
|
597
|
+
glow?: {
|
|
598
|
+
color: string;
|
|
599
|
+
radius?: number;
|
|
600
|
+
opacity?: number;
|
|
601
|
+
} | false;
|
|
602
|
+
border?: boolean;
|
|
603
|
+
pressable?: boolean;
|
|
604
|
+
onPress?: () => void;
|
|
605
|
+
onLongPress?: () => void;
|
|
606
|
+
fullWidth?: boolean;
|
|
607
|
+
style?: StyleProp<ViewStyle>;
|
|
608
|
+
contentStyle?: StyleProp<ViewStyle>;
|
|
609
|
+
children?: ReactNode;
|
|
610
|
+
testID?: string;
|
|
611
|
+
accessibilityLabel?: string;
|
|
612
|
+
accessibilityHint?: string;
|
|
613
|
+
}
|
|
614
|
+
interface LiquidCardHeaderProps {
|
|
615
|
+
children?: ReactNode;
|
|
616
|
+
style?: StyleProp<ViewStyle>;
|
|
617
|
+
bordered?: boolean;
|
|
618
|
+
compact?: boolean;
|
|
619
|
+
}
|
|
620
|
+
interface LiquidCardBodyProps {
|
|
621
|
+
children?: ReactNode;
|
|
622
|
+
style?: StyleProp<ViewStyle>;
|
|
623
|
+
compact?: boolean;
|
|
624
|
+
}
|
|
625
|
+
interface LiquidCardFooterProps {
|
|
626
|
+
children?: ReactNode;
|
|
627
|
+
style?: StyleProp<ViewStyle>;
|
|
628
|
+
bordered?: boolean;
|
|
629
|
+
compact?: boolean;
|
|
630
|
+
}
|
|
631
|
+
interface LiquidCardImageProps {
|
|
632
|
+
source: {
|
|
633
|
+
uri: string;
|
|
634
|
+
} | number;
|
|
635
|
+
height?: number;
|
|
636
|
+
style?: StyleProp<ImageStyle>;
|
|
637
|
+
rounded?: boolean;
|
|
638
|
+
}
|
|
639
|
+
|
|
640
|
+
declare const LiquidCard: React$1.NamedExoticComponent<LiquidCardProps> & {
|
|
641
|
+
Header: React$1.NamedExoticComponent<LiquidCardHeaderProps>;
|
|
642
|
+
Body: React$1.NamedExoticComponent<LiquidCardBodyProps>;
|
|
643
|
+
Footer: React$1.NamedExoticComponent<LiquidCardFooterProps>;
|
|
644
|
+
Image: React$1.NamedExoticComponent<LiquidCardImageProps>;
|
|
645
|
+
};
|
|
646
|
+
|
|
647
|
+
type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | number;
|
|
648
|
+
interface AvatarProps {
|
|
649
|
+
src?: {
|
|
650
|
+
uri: string;
|
|
651
|
+
} | number;
|
|
652
|
+
name?: string;
|
|
653
|
+
size?: AvatarSize;
|
|
654
|
+
online?: boolean | 'online' | 'offline' | 'busy' | 'away';
|
|
655
|
+
bordered?: boolean;
|
|
656
|
+
borderColor?: string;
|
|
657
|
+
fallbackBg?: string;
|
|
658
|
+
fallbackColor?: string;
|
|
659
|
+
style?: StyleProp<ViewStyle>;
|
|
660
|
+
imageStyle?: StyleProp<ImageStyle>;
|
|
661
|
+
testID?: string;
|
|
662
|
+
}
|
|
663
|
+
|
|
664
|
+
declare const Avatar: React$1.NamedExoticComponent<AvatarProps>;
|
|
665
|
+
|
|
666
|
+
type BadgeVariant = 'solid' | 'outline' | 'subtle' | 'glass';
|
|
667
|
+
type BadgeStatus = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'neutral';
|
|
668
|
+
interface BadgeProps {
|
|
669
|
+
/** Numeric badge count */
|
|
670
|
+
count?: number;
|
|
671
|
+
/** Dot indicator — renders a small circle with no content */
|
|
672
|
+
dot?: boolean;
|
|
673
|
+
/** Text label for non-numeric badges */
|
|
674
|
+
label?: string;
|
|
675
|
+
status?: BadgeStatus;
|
|
676
|
+
variant?: BadgeVariant;
|
|
677
|
+
/** Clamps count display — defaults to 99, shows "99+" when exceeded */
|
|
678
|
+
maxCount?: number;
|
|
679
|
+
size?: 'sm' | 'md' | 'lg';
|
|
680
|
+
/** When provided, badge is absolutely positioned over the child */
|
|
681
|
+
children?: ReactNode;
|
|
682
|
+
placement?: 'topRight' | 'topLeft' | 'bottomRight' | 'bottomLeft';
|
|
683
|
+
style?: StyleProp<ViewStyle>;
|
|
684
|
+
}
|
|
685
|
+
|
|
686
|
+
declare const Badge: React$1.NamedExoticComponent<BadgeProps>;
|
|
687
|
+
|
|
688
|
+
type ChipVariant = 'solid' | 'outline' | 'subtle' | 'glass';
|
|
689
|
+
interface ChipProps {
|
|
690
|
+
label: string;
|
|
691
|
+
/** Leading avatar slot */
|
|
692
|
+
avatar?: ReactNode;
|
|
693
|
+
/** Leading icon slot (shown after avatar if both provided) */
|
|
694
|
+
icon?: ReactNode;
|
|
695
|
+
/** Trailing icon slot (shown before dismiss button) */
|
|
696
|
+
trailingIcon?: ReactNode;
|
|
697
|
+
/** When provided a dismiss (✕) button is rendered on the right */
|
|
698
|
+
onDismiss?: () => void;
|
|
699
|
+
isSelected?: boolean;
|
|
700
|
+
onPress?: () => void;
|
|
701
|
+
variant?: ChipVariant;
|
|
702
|
+
size?: 'sm' | 'md' | 'lg';
|
|
703
|
+
/** Custom tint color — overrides status-based colors */
|
|
704
|
+
color?: string;
|
|
705
|
+
glass?: boolean;
|
|
706
|
+
isDisabled?: boolean;
|
|
707
|
+
style?: StyleProp<ViewStyle>;
|
|
708
|
+
}
|
|
709
|
+
|
|
710
|
+
declare const Chip: React$1.NamedExoticComponent<ChipProps>;
|
|
711
|
+
|
|
712
|
+
interface ListItemProps {
|
|
713
|
+
title: string;
|
|
714
|
+
subtitle?: string;
|
|
715
|
+
description?: string;
|
|
716
|
+
/** Leading slot — avatar, icon, image */
|
|
717
|
+
leading?: ReactNode;
|
|
718
|
+
/** Trailing slot — badge, chevron, action */
|
|
719
|
+
trailing?: ReactNode;
|
|
720
|
+
onPress?: () => void;
|
|
721
|
+
onLongPress?: () => void;
|
|
722
|
+
isDisabled?: boolean;
|
|
723
|
+
glass?: boolean;
|
|
724
|
+
showDivider?: boolean;
|
|
725
|
+
style?: StyleProp<ViewStyle>;
|
|
726
|
+
}
|
|
727
|
+
interface ListSection {
|
|
728
|
+
title?: string;
|
|
729
|
+
data: ListItemProps[];
|
|
730
|
+
}
|
|
731
|
+
interface ListProps {
|
|
732
|
+
/** Simple flat list of items */
|
|
733
|
+
items?: ListItemProps[];
|
|
734
|
+
/** Sectioned list — mutually exclusive with items */
|
|
735
|
+
sections?: ListSection[];
|
|
736
|
+
keyExtractor?: (item: ListItemProps, index: number) => string;
|
|
737
|
+
renderItem?: (item: ListItemProps) => ReactNode;
|
|
738
|
+
glass?: boolean;
|
|
739
|
+
style?: StyleProp<ViewStyle>;
|
|
740
|
+
}
|
|
741
|
+
|
|
742
|
+
declare const List: React$1.NamedExoticComponent<ListProps> & {
|
|
743
|
+
Item: React$1.NamedExoticComponent<ListItemProps>;
|
|
744
|
+
};
|
|
745
|
+
|
|
746
|
+
declare const ListItem: React$1.NamedExoticComponent<ListItemProps>;
|
|
747
|
+
|
|
748
|
+
interface AccordionItemProps {
|
|
749
|
+
/** Unique value used for open/close tracking */
|
|
750
|
+
value: string;
|
|
751
|
+
title: string;
|
|
752
|
+
children: ReactNode;
|
|
753
|
+
icon?: ReactNode;
|
|
754
|
+
isDisabled?: boolean;
|
|
755
|
+
}
|
|
756
|
+
interface AccordionProps {
|
|
757
|
+
/** Allow multiple panels open simultaneously */
|
|
758
|
+
allowMultiple?: boolean;
|
|
759
|
+
/** Uncontrolled default open value(s) */
|
|
760
|
+
defaultValue?: string | string[];
|
|
761
|
+
/** Controlled open value(s) */
|
|
762
|
+
value?: string | string[];
|
|
763
|
+
onChange?: (value: string | string[]) => void;
|
|
764
|
+
glass?: boolean;
|
|
765
|
+
children: ReactNode;
|
|
766
|
+
style?: StyleProp<ViewStyle>;
|
|
767
|
+
}
|
|
768
|
+
|
|
769
|
+
declare const Accordion: React$1.NamedExoticComponent<AccordionProps> & {
|
|
770
|
+
Item: React$1.NamedExoticComponent<AccordionItemProps>;
|
|
771
|
+
};
|
|
772
|
+
|
|
773
|
+
type TimelineItemStatus = 'complete' | 'active' | 'pending';
|
|
774
|
+
interface TimelineItem {
|
|
775
|
+
title: string;
|
|
776
|
+
description?: string;
|
|
777
|
+
timestamp?: string;
|
|
778
|
+
icon?: ReactNode;
|
|
779
|
+
status?: TimelineItemStatus;
|
|
780
|
+
}
|
|
781
|
+
interface TimelineProps {
|
|
782
|
+
items: TimelineItem[];
|
|
783
|
+
glass?: boolean;
|
|
784
|
+
style?: StyleProp<ViewStyle>;
|
|
785
|
+
}
|
|
786
|
+
|
|
787
|
+
declare const Timeline: React$1.NamedExoticComponent<TimelineProps>;
|
|
788
|
+
|
|
789
|
+
interface CarouselProps {
|
|
790
|
+
data: any[];
|
|
791
|
+
renderItem: (info: {
|
|
792
|
+
item: any;
|
|
793
|
+
index: number;
|
|
794
|
+
}) => ReactNode;
|
|
795
|
+
/** Defaults to screen width */
|
|
796
|
+
itemWidth?: number;
|
|
797
|
+
/** Gap between items in px */
|
|
798
|
+
gap?: number;
|
|
799
|
+
showDots?: boolean;
|
|
800
|
+
autoPlay?: boolean;
|
|
801
|
+
/** Interval in ms between auto-advances — default 3000 */
|
|
802
|
+
autoPlayInterval?: number;
|
|
803
|
+
loop?: boolean;
|
|
804
|
+
onIndexChange?: (index: number) => void;
|
|
805
|
+
glass?: boolean;
|
|
806
|
+
style?: StyleProp<ViewStyle>;
|
|
807
|
+
}
|
|
808
|
+
|
|
809
|
+
declare const Carousel: React$1.NamedExoticComponent<CarouselProps>;
|
|
810
|
+
|
|
811
|
+
type TrendDirection = 'up' | 'down' | 'neutral';
|
|
812
|
+
interface StatsCardProps {
|
|
813
|
+
value: string | number;
|
|
814
|
+
label: string;
|
|
815
|
+
prefix?: string;
|
|
816
|
+
suffix?: string;
|
|
817
|
+
trend?: {
|
|
818
|
+
value: string;
|
|
819
|
+
direction: TrendDirection;
|
|
820
|
+
};
|
|
821
|
+
/** Icon rendered in the top-right corner */
|
|
822
|
+
icon?: ReactNode;
|
|
823
|
+
glass?: boolean;
|
|
824
|
+
style?: StyleProp<ViewStyle>;
|
|
825
|
+
}
|
|
826
|
+
|
|
827
|
+
declare const StatsCard: React$1.NamedExoticComponent<StatsCardProps>;
|
|
828
|
+
|
|
829
|
+
interface TableColumn {
|
|
830
|
+
key: string;
|
|
831
|
+
title: string;
|
|
832
|
+
width?: number;
|
|
833
|
+
align?: 'left' | 'center' | 'right';
|
|
834
|
+
sortable?: boolean;
|
|
835
|
+
renderCell?: (value: any, row: Record<string, any>) => ReactNode;
|
|
836
|
+
}
|
|
837
|
+
interface TableProps {
|
|
838
|
+
columns: TableColumn[];
|
|
839
|
+
data: Record<string, any>[];
|
|
840
|
+
onSort?: (key: string, direction: 'asc' | 'desc') => void;
|
|
841
|
+
glass?: boolean;
|
|
842
|
+
striped?: boolean;
|
|
843
|
+
bordered?: boolean;
|
|
844
|
+
stickyHeader?: boolean;
|
|
845
|
+
style?: StyleProp<ViewStyle>;
|
|
846
|
+
}
|
|
847
|
+
|
|
848
|
+
declare const Table: React$1.NamedExoticComponent<TableProps>;
|
|
849
|
+
|
|
850
|
+
type AlertStatus = 'info' | 'success' | 'warning' | 'error';
|
|
851
|
+
type AlertVariant = 'subtle' | 'solid' | 'outline' | 'glass';
|
|
852
|
+
interface AlertProps {
|
|
853
|
+
status?: AlertStatus;
|
|
854
|
+
variant?: AlertVariant;
|
|
855
|
+
title?: string;
|
|
856
|
+
description?: string;
|
|
857
|
+
icon?: ReactNode;
|
|
858
|
+
showIcon?: boolean;
|
|
859
|
+
isDismissible?: boolean;
|
|
860
|
+
onDismiss?: () => void;
|
|
861
|
+
action?: {
|
|
862
|
+
label: string;
|
|
863
|
+
onPress: () => void;
|
|
864
|
+
};
|
|
865
|
+
style?: StyleProp<ViewStyle>;
|
|
866
|
+
children?: ReactNode;
|
|
867
|
+
}
|
|
868
|
+
declare const Alert: React$1.NamedExoticComponent<AlertProps>;
|
|
869
|
+
|
|
870
|
+
type BannerStatus = 'info' | 'success' | 'warning' | 'error' | 'neutral';
|
|
871
|
+
interface BannerProps {
|
|
872
|
+
status?: BannerStatus;
|
|
873
|
+
title?: string;
|
|
874
|
+
description?: string;
|
|
875
|
+
action?: {
|
|
876
|
+
label: string;
|
|
877
|
+
onPress: () => void;
|
|
878
|
+
};
|
|
879
|
+
secondaryAction?: {
|
|
880
|
+
label: string;
|
|
881
|
+
onPress: () => void;
|
|
882
|
+
};
|
|
883
|
+
isDismissible?: boolean;
|
|
884
|
+
onDismiss?: () => void;
|
|
885
|
+
glass?: boolean;
|
|
886
|
+
style?: StyleProp<ViewStyle>;
|
|
887
|
+
}
|
|
888
|
+
|
|
889
|
+
declare const Banner: React$1.NamedExoticComponent<BannerProps>;
|
|
890
|
+
|
|
891
|
+
type ToastType = 'success' | 'error' | 'warning' | 'info' | 'default';
|
|
892
|
+
type ToastPosition = 'top' | 'bottom';
|
|
893
|
+
interface ToastAction {
|
|
894
|
+
label: string;
|
|
895
|
+
onPress: () => void;
|
|
896
|
+
}
|
|
897
|
+
interface ToastOptions {
|
|
898
|
+
message: string;
|
|
899
|
+
type?: ToastType;
|
|
900
|
+
duration?: number;
|
|
901
|
+
position?: ToastPosition;
|
|
902
|
+
icon?: ReactNode;
|
|
903
|
+
action?: ToastAction;
|
|
904
|
+
glass?: boolean;
|
|
905
|
+
id?: string;
|
|
906
|
+
}
|
|
907
|
+
interface ToastItem extends Required<Omit<ToastOptions, 'action' | 'icon'>> {
|
|
908
|
+
id: string;
|
|
909
|
+
action?: ToastAction;
|
|
910
|
+
icon?: ReactNode;
|
|
911
|
+
}
|
|
912
|
+
|
|
913
|
+
interface ToastProps {
|
|
914
|
+
item: ToastItem;
|
|
915
|
+
onDismiss: (id: string) => void;
|
|
916
|
+
}
|
|
917
|
+
declare const Toast: React$1.NamedExoticComponent<ToastProps>;
|
|
918
|
+
|
|
919
|
+
interface ToastProviderProps {
|
|
920
|
+
children: React$1.ReactNode;
|
|
921
|
+
maxToasts?: number;
|
|
922
|
+
safeAreaTop?: number;
|
|
923
|
+
safeAreaBottom?: number;
|
|
924
|
+
}
|
|
925
|
+
declare function ToastProvider({ children, maxToasts, safeAreaTop, safeAreaBottom, }: ToastProviderProps): react_jsx_runtime.JSX.Element;
|
|
926
|
+
|
|
927
|
+
type ShowListener = (item: ToastItem) => void;
|
|
928
|
+
type DismissListener = (id: string) => void;
|
|
929
|
+
declare function show(options: ToastOptions): string;
|
|
930
|
+
declare const toast: {
|
|
931
|
+
show: typeof show;
|
|
932
|
+
success(message: string, options?: Partial<ToastOptions>): string;
|
|
933
|
+
error(message: string, options?: Partial<ToastOptions>): string;
|
|
934
|
+
warning(message: string, options?: Partial<ToastOptions>): string;
|
|
935
|
+
info(message: string, options?: Partial<ToastOptions>): string;
|
|
936
|
+
dismiss(id: string): void;
|
|
937
|
+
_onShow(fn: ShowListener): () => void;
|
|
938
|
+
_onDismiss(fn: DismissListener): () => void;
|
|
939
|
+
};
|
|
940
|
+
|
|
941
|
+
type SkeletonVariant = 'text' | 'circle' | 'rect' | 'card';
|
|
942
|
+
interface SkeletonProps {
|
|
943
|
+
variant?: SkeletonVariant;
|
|
944
|
+
width?: number | string;
|
|
945
|
+
height?: number;
|
|
946
|
+
borderRadius?: number;
|
|
947
|
+
lines?: number;
|
|
948
|
+
lineSpacing?: number;
|
|
949
|
+
style?: StyleProp<ViewStyle>;
|
|
950
|
+
testID?: string;
|
|
951
|
+
}
|
|
952
|
+
declare const Skeleton: React$1.NamedExoticComponent<SkeletonProps>;
|
|
953
|
+
|
|
954
|
+
type ProgressBarVariant = 'solid' | 'striped' | 'gradient' | 'glass';
|
|
955
|
+
interface ProgressBarProps {
|
|
956
|
+
value?: number;
|
|
957
|
+
max?: number;
|
|
958
|
+
variant?: ProgressBarVariant;
|
|
959
|
+
color?: string;
|
|
960
|
+
trackColor?: string;
|
|
961
|
+
height?: number;
|
|
962
|
+
borderRadius?: number;
|
|
963
|
+
showLabel?: boolean;
|
|
964
|
+
label?: string;
|
|
965
|
+
animated?: boolean;
|
|
966
|
+
indeterminate?: boolean;
|
|
967
|
+
glass?: boolean;
|
|
968
|
+
style?: StyleProp<ViewStyle>;
|
|
969
|
+
}
|
|
970
|
+
|
|
971
|
+
declare const ProgressBar: React$1.NamedExoticComponent<ProgressBarProps>;
|
|
972
|
+
|
|
973
|
+
type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
974
|
+
interface SpinnerProps {
|
|
975
|
+
size?: SpinnerSize;
|
|
976
|
+
color?: string;
|
|
977
|
+
trackColor?: string;
|
|
978
|
+
thickness?: number;
|
|
979
|
+
duration?: number;
|
|
980
|
+
style?: StyleProp<ViewStyle>;
|
|
981
|
+
label?: string;
|
|
982
|
+
}
|
|
983
|
+
|
|
984
|
+
declare const Spinner: React$1.NamedExoticComponent<SpinnerProps>;
|
|
985
|
+
|
|
986
|
+
interface EmptyStateProps {
|
|
987
|
+
illustration?: ReactNode;
|
|
988
|
+
icon?: ReactNode;
|
|
989
|
+
title?: string;
|
|
990
|
+
description?: string;
|
|
991
|
+
action?: {
|
|
992
|
+
label: string;
|
|
993
|
+
onPress: () => void;
|
|
994
|
+
variant?: 'solid' | 'outline';
|
|
995
|
+
};
|
|
996
|
+
secondaryAction?: {
|
|
997
|
+
label: string;
|
|
998
|
+
onPress: () => void;
|
|
999
|
+
};
|
|
1000
|
+
glass?: boolean;
|
|
1001
|
+
style?: StyleProp<ViewStyle>;
|
|
1002
|
+
}
|
|
1003
|
+
|
|
1004
|
+
declare const EmptyState: React$1.NamedExoticComponent<EmptyStateProps>;
|
|
1005
|
+
|
|
1006
|
+
interface DialogProps {
|
|
1007
|
+
isOpen: boolean;
|
|
1008
|
+
onClose: () => void;
|
|
1009
|
+
title?: string;
|
|
1010
|
+
description?: string;
|
|
1011
|
+
children?: ReactNode;
|
|
1012
|
+
actions?: Array<{
|
|
1013
|
+
label: string;
|
|
1014
|
+
onPress: () => void;
|
|
1015
|
+
variant?: 'solid' | 'outline' | 'ghost';
|
|
1016
|
+
color?: string;
|
|
1017
|
+
isDestructive?: boolean;
|
|
1018
|
+
}>;
|
|
1019
|
+
isDismissible?: boolean;
|
|
1020
|
+
glass?: boolean;
|
|
1021
|
+
size?: 'sm' | 'md' | 'lg' | 'full';
|
|
1022
|
+
style?: StyleProp<ViewStyle>;
|
|
1023
|
+
}
|
|
1024
|
+
|
|
1025
|
+
declare const Dialog: React$1.NamedExoticComponent<DialogProps>;
|
|
1026
|
+
|
|
1027
|
+
interface BottomSheetProps {
|
|
1028
|
+
isOpen: boolean;
|
|
1029
|
+
onClose: () => void;
|
|
1030
|
+
snapPoints?: number[];
|
|
1031
|
+
initialSnap?: number;
|
|
1032
|
+
title?: string;
|
|
1033
|
+
children?: ReactNode;
|
|
1034
|
+
isDismissible?: boolean;
|
|
1035
|
+
showHandle?: boolean;
|
|
1036
|
+
glass?: boolean;
|
|
1037
|
+
style?: StyleProp<ViewStyle>;
|
|
1038
|
+
}
|
|
1039
|
+
|
|
1040
|
+
declare const BottomSheet: React$1.NamedExoticComponent<BottomSheetProps>;
|
|
1041
|
+
|
|
1042
|
+
type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
1043
|
+
interface TooltipProps {
|
|
1044
|
+
content: string | ReactNode;
|
|
1045
|
+
placement?: TooltipPlacement;
|
|
1046
|
+
children: ReactNode;
|
|
1047
|
+
delay?: number;
|
|
1048
|
+
glass?: boolean;
|
|
1049
|
+
style?: StyleProp<ViewStyle>;
|
|
1050
|
+
}
|
|
1051
|
+
|
|
1052
|
+
declare const Tooltip: React$1.NamedExoticComponent<TooltipProps>;
|
|
1053
|
+
|
|
1054
|
+
interface PopoverProps {
|
|
1055
|
+
trigger: ReactNode | ((props: {
|
|
1056
|
+
onPress: () => void;
|
|
1057
|
+
isOpen: boolean;
|
|
1058
|
+
}) => ReactNode);
|
|
1059
|
+
content: ReactNode;
|
|
1060
|
+
placement?: TooltipPlacement;
|
|
1061
|
+
isDismissible?: boolean;
|
|
1062
|
+
glass?: boolean;
|
|
1063
|
+
style?: StyleProp<ViewStyle>;
|
|
1064
|
+
}
|
|
1065
|
+
|
|
1066
|
+
declare const Popover: React$1.NamedExoticComponent<PopoverProps>;
|
|
1067
|
+
|
|
1068
|
+
interface SnackbarOptions {
|
|
1069
|
+
message: string;
|
|
1070
|
+
duration?: number;
|
|
1071
|
+
action?: {
|
|
1072
|
+
label: string;
|
|
1073
|
+
onPress: () => void;
|
|
1074
|
+
};
|
|
1075
|
+
position?: 'bottom' | 'top';
|
|
1076
|
+
glass?: boolean;
|
|
1077
|
+
}
|
|
1078
|
+
type ShowCallback = (opts: SnackbarOptions) => void;
|
|
1079
|
+
type HideCallback = () => void;
|
|
1080
|
+
declare const snackbar: {
|
|
1081
|
+
show(opts: SnackbarOptions): void;
|
|
1082
|
+
hide(): void;
|
|
1083
|
+
_register(onShow: ShowCallback, onHide: HideCallback): () => void;
|
|
1084
|
+
};
|
|
1085
|
+
|
|
1086
|
+
interface SnackbarProviderProps {
|
|
1087
|
+
children: ReactNode;
|
|
1088
|
+
}
|
|
1089
|
+
|
|
1090
|
+
declare function SnackbarProvider({ children }: SnackbarProviderProps): react_jsx_runtime.JSX.Element;
|
|
1091
|
+
declare namespace SnackbarProvider {
|
|
1092
|
+
var displayName: string;
|
|
1093
|
+
}
|
|
1094
|
+
|
|
1095
|
+
type TabVariant = 'line' | 'enclosed' | 'pills' | 'glass';
|
|
1096
|
+
type TabOrientation = 'horizontal' | 'vertical';
|
|
1097
|
+
interface TabsProps {
|
|
1098
|
+
value?: string;
|
|
1099
|
+
defaultValue?: string;
|
|
1100
|
+
onChange?: (value: string) => void;
|
|
1101
|
+
variant?: TabVariant;
|
|
1102
|
+
orientation?: TabOrientation;
|
|
1103
|
+
glass?: boolean;
|
|
1104
|
+
children: ReactNode;
|
|
1105
|
+
style?: StyleProp<ViewStyle>;
|
|
1106
|
+
}
|
|
1107
|
+
interface TabProps {
|
|
1108
|
+
value: string;
|
|
1109
|
+
label: string;
|
|
1110
|
+
icon?: ReactNode;
|
|
1111
|
+
isDisabled?: boolean;
|
|
1112
|
+
}
|
|
1113
|
+
interface TabPanelProps {
|
|
1114
|
+
value: string;
|
|
1115
|
+
children: ReactNode;
|
|
1116
|
+
style?: StyleProp<ViewStyle>;
|
|
1117
|
+
}
|
|
1118
|
+
interface TabListProps {
|
|
1119
|
+
children: ReactNode;
|
|
1120
|
+
style?: StyleProp<ViewStyle>;
|
|
1121
|
+
}
|
|
1122
|
+
|
|
1123
|
+
declare const Tabs: React$1.NamedExoticComponent<TabsProps> & {
|
|
1124
|
+
Tab: React$1.NamedExoticComponent<TabProps>;
|
|
1125
|
+
Panel: React$1.NamedExoticComponent<TabPanelProps>;
|
|
1126
|
+
List: React$1.NamedExoticComponent<TabListProps>;
|
|
1127
|
+
};
|
|
1128
|
+
|
|
1129
|
+
type SegmentedTabsSize = 'sm' | 'md' | 'lg';
|
|
1130
|
+
interface SegmentedTabsOption {
|
|
1131
|
+
label: string;
|
|
1132
|
+
value: string;
|
|
1133
|
+
icon?: ReactNode;
|
|
1134
|
+
}
|
|
1135
|
+
interface SegmentedTabsProps {
|
|
1136
|
+
options: SegmentedTabsOption[];
|
|
1137
|
+
value?: string;
|
|
1138
|
+
defaultValue?: string;
|
|
1139
|
+
onChange?: (value: string) => void;
|
|
1140
|
+
glass?: boolean;
|
|
1141
|
+
size?: SegmentedTabsSize;
|
|
1142
|
+
style?: StyleProp<ViewStyle>;
|
|
1143
|
+
}
|
|
1144
|
+
|
|
1145
|
+
declare const SegmentedTabs: React$1.NamedExoticComponent<SegmentedTabsProps>;
|
|
1146
|
+
|
|
1147
|
+
interface TopNavigationProps {
|
|
1148
|
+
title?: string;
|
|
1149
|
+
subtitle?: string;
|
|
1150
|
+
leading?: ReactNode;
|
|
1151
|
+
trailing?: ReactNode;
|
|
1152
|
+
glass?: boolean;
|
|
1153
|
+
blur?: boolean;
|
|
1154
|
+
scrollY?: SharedValue<number>;
|
|
1155
|
+
style?: StyleProp<ViewStyle>;
|
|
1156
|
+
}
|
|
1157
|
+
|
|
1158
|
+
declare const TopNavigation: React$1.NamedExoticComponent<TopNavigationProps>;
|
|
1159
|
+
|
|
1160
|
+
interface BottomNavigationItem {
|
|
1161
|
+
label: string;
|
|
1162
|
+
icon: ReactNode;
|
|
1163
|
+
activeIcon?: ReactNode;
|
|
1164
|
+
value: string;
|
|
1165
|
+
badge?: number | boolean;
|
|
1166
|
+
}
|
|
1167
|
+
interface BottomNavigationProps {
|
|
1168
|
+
items: BottomNavigationItem[];
|
|
1169
|
+
value?: string;
|
|
1170
|
+
defaultValue?: string;
|
|
1171
|
+
onChange?: (value: string) => void;
|
|
1172
|
+
glass?: boolean;
|
|
1173
|
+
showLabel?: boolean;
|
|
1174
|
+
style?: StyleProp<ViewStyle>;
|
|
1175
|
+
}
|
|
1176
|
+
|
|
1177
|
+
declare const BottomNavigation: React$1.NamedExoticComponent<BottomNavigationProps>;
|
|
1178
|
+
|
|
1179
|
+
type DrawerPlacement = 'left' | 'right';
|
|
1180
|
+
interface DrawerProps {
|
|
1181
|
+
isOpen: boolean;
|
|
1182
|
+
onClose: () => void;
|
|
1183
|
+
placement?: DrawerPlacement;
|
|
1184
|
+
width?: number;
|
|
1185
|
+
children: ReactNode;
|
|
1186
|
+
glass?: boolean;
|
|
1187
|
+
backdrop?: boolean;
|
|
1188
|
+
style?: StyleProp<ViewStyle>;
|
|
1189
|
+
}
|
|
1190
|
+
|
|
1191
|
+
declare const Drawer: React$1.NamedExoticComponent<DrawerProps>;
|
|
1192
|
+
|
|
1193
|
+
interface SidebarProps {
|
|
1194
|
+
isOpen?: boolean;
|
|
1195
|
+
defaultOpen?: boolean;
|
|
1196
|
+
width?: number;
|
|
1197
|
+
collapsedWidth?: number;
|
|
1198
|
+
children: ReactNode;
|
|
1199
|
+
glass?: boolean;
|
|
1200
|
+
style?: StyleProp<ViewStyle>;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
declare const Sidebar: React$1.NamedExoticComponent<SidebarProps>;
|
|
1204
|
+
|
|
1205
|
+
interface BreadcrumbItem {
|
|
1206
|
+
label: string;
|
|
1207
|
+
onPress?: () => void;
|
|
1208
|
+
icon?: ReactNode;
|
|
1209
|
+
}
|
|
1210
|
+
interface BreadcrumbProps {
|
|
1211
|
+
items: BreadcrumbItem[];
|
|
1212
|
+
separator?: ReactNode | string;
|
|
1213
|
+
maxItems?: number;
|
|
1214
|
+
style?: StyleProp<ViewStyle>;
|
|
1215
|
+
}
|
|
1216
|
+
|
|
1217
|
+
declare const Breadcrumb: React$1.NamedExoticComponent<BreadcrumbProps>;
|
|
1218
|
+
|
|
1219
|
+
type StepStatus = 'complete' | 'current' | 'upcoming';
|
|
1220
|
+
type StepperOrientation = 'horizontal' | 'vertical';
|
|
1221
|
+
type StepperVariant = 'circles' | 'numbers' | 'dots';
|
|
1222
|
+
interface StepItem {
|
|
1223
|
+
label: string;
|
|
1224
|
+
description?: string;
|
|
1225
|
+
status?: StepStatus;
|
|
1226
|
+
}
|
|
1227
|
+
interface StepperProps {
|
|
1228
|
+
steps: StepItem[];
|
|
1229
|
+
activeStep?: number;
|
|
1230
|
+
orientation?: StepperOrientation;
|
|
1231
|
+
variant?: StepperVariant;
|
|
1232
|
+
glass?: boolean;
|
|
1233
|
+
style?: StyleProp<ViewStyle>;
|
|
1234
|
+
}
|
|
1235
|
+
|
|
1236
|
+
declare const Stepper: React$1.NamedExoticComponent<StepperProps>;
|
|
1237
|
+
|
|
1238
|
+
type ModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
|
|
1239
|
+
interface ModalProps {
|
|
1240
|
+
isOpen: boolean;
|
|
1241
|
+
onClose: () => void;
|
|
1242
|
+
children: ReactNode;
|
|
1243
|
+
title?: string;
|
|
1244
|
+
size?: ModalSize;
|
|
1245
|
+
glass?: boolean;
|
|
1246
|
+
isDismissible?: boolean;
|
|
1247
|
+
showCloseButton?: boolean;
|
|
1248
|
+
style?: StyleProp<ViewStyle>;
|
|
1249
|
+
}
|
|
1250
|
+
|
|
1251
|
+
declare const Modal: React$1.NamedExoticComponent<ModalProps>;
|
|
1252
|
+
|
|
1253
|
+
interface ActionSheetAction {
|
|
1254
|
+
label: string;
|
|
1255
|
+
onPress: () => void;
|
|
1256
|
+
icon?: ReactNode;
|
|
1257
|
+
isDestructive?: boolean;
|
|
1258
|
+
isDisabled?: boolean;
|
|
1259
|
+
}
|
|
1260
|
+
interface ActionSheetProps {
|
|
1261
|
+
isOpen: boolean;
|
|
1262
|
+
onClose: () => void;
|
|
1263
|
+
title?: string;
|
|
1264
|
+
message?: string;
|
|
1265
|
+
actions: ActionSheetAction[];
|
|
1266
|
+
cancelLabel?: string;
|
|
1267
|
+
glass?: boolean;
|
|
1268
|
+
}
|
|
1269
|
+
|
|
1270
|
+
declare const ActionSheet: React$1.NamedExoticComponent<ActionSheetProps>;
|
|
1271
|
+
|
|
1272
|
+
interface CommandItem {
|
|
1273
|
+
id: string;
|
|
1274
|
+
label: string;
|
|
1275
|
+
description?: string;
|
|
1276
|
+
icon?: ReactNode;
|
|
1277
|
+
shortcut?: string;
|
|
1278
|
+
onSelect: () => void;
|
|
1279
|
+
group?: string;
|
|
1280
|
+
}
|
|
1281
|
+
interface CommandPaletteProps {
|
|
1282
|
+
isOpen: boolean;
|
|
1283
|
+
onClose: () => void;
|
|
1284
|
+
items: CommandItem[];
|
|
1285
|
+
placeholder?: string;
|
|
1286
|
+
glass?: boolean;
|
|
1287
|
+
}
|
|
1288
|
+
|
|
1289
|
+
declare const CommandPalette: React$1.NamedExoticComponent<CommandPaletteProps>;
|
|
1290
|
+
|
|
1291
|
+
interface ContextMenuItem {
|
|
1292
|
+
label: string;
|
|
1293
|
+
icon?: ReactNode;
|
|
1294
|
+
onPress: () => void;
|
|
1295
|
+
isDestructive?: boolean;
|
|
1296
|
+
isDisabled?: boolean;
|
|
1297
|
+
}
|
|
1298
|
+
interface ContextMenuProps {
|
|
1299
|
+
items: ContextMenuItem[];
|
|
1300
|
+
children: ReactNode;
|
|
1301
|
+
glass?: boolean;
|
|
1302
|
+
}
|
|
1303
|
+
|
|
1304
|
+
declare const ContextMenu: React$1.NamedExoticComponent<ContextMenuProps>;
|
|
1305
|
+
|
|
1306
|
+
type HoverCardPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
1307
|
+
interface HoverCardProps {
|
|
1308
|
+
trigger: ReactNode;
|
|
1309
|
+
content: ReactNode;
|
|
1310
|
+
placement?: HoverCardPlacement;
|
|
1311
|
+
glass?: boolean;
|
|
1312
|
+
}
|
|
1313
|
+
|
|
1314
|
+
declare const HoverCard: React$1.NamedExoticComponent<HoverCardProps>;
|
|
1315
|
+
|
|
1316
|
+
interface FadeProps {
|
|
1317
|
+
in?: boolean;
|
|
1318
|
+
duration?: number;
|
|
1319
|
+
delay?: number;
|
|
1320
|
+
children: ReactNode;
|
|
1321
|
+
style?: StyleProp<ViewStyle>;
|
|
1322
|
+
onEntered?: () => void;
|
|
1323
|
+
onExited?: () => void;
|
|
1324
|
+
}
|
|
1325
|
+
|
|
1326
|
+
declare const Fade: React$1.NamedExoticComponent<FadeProps>;
|
|
1327
|
+
|
|
1328
|
+
interface ScaleProps {
|
|
1329
|
+
in?: boolean;
|
|
1330
|
+
from?: number;
|
|
1331
|
+
to?: number;
|
|
1332
|
+
duration?: number;
|
|
1333
|
+
children: ReactNode;
|
|
1334
|
+
style?: StyleProp<ViewStyle>;
|
|
1335
|
+
}
|
|
1336
|
+
|
|
1337
|
+
declare const Scale: React$1.NamedExoticComponent<ScaleProps>;
|
|
1338
|
+
|
|
1339
|
+
type SlideDirection = 'up' | 'down' | 'left' | 'right';
|
|
1340
|
+
interface SlideProps {
|
|
1341
|
+
in?: boolean;
|
|
1342
|
+
direction?: SlideDirection;
|
|
1343
|
+
distance?: number;
|
|
1344
|
+
duration?: number;
|
|
1345
|
+
children: ReactNode;
|
|
1346
|
+
style?: StyleProp<ViewStyle>;
|
|
1347
|
+
}
|
|
1348
|
+
|
|
1349
|
+
declare const Slide: React$1.NamedExoticComponent<SlideProps>;
|
|
1350
|
+
|
|
1351
|
+
interface BlurTransitionProps {
|
|
1352
|
+
in?: boolean;
|
|
1353
|
+
blurAmount?: number;
|
|
1354
|
+
duration?: number;
|
|
1355
|
+
children: ReactNode;
|
|
1356
|
+
style?: StyleProp<ViewStyle>;
|
|
1357
|
+
}
|
|
1358
|
+
|
|
1359
|
+
declare const BlurTransition: React$1.NamedExoticComponent<BlurTransitionProps>;
|
|
1360
|
+
|
|
1361
|
+
interface MagneticPressableProps {
|
|
1362
|
+
children: ReactNode;
|
|
1363
|
+
strength?: number;
|
|
1364
|
+
onPress?: () => void;
|
|
1365
|
+
style?: StyleProp<ViewStyle>;
|
|
1366
|
+
}
|
|
1367
|
+
|
|
1368
|
+
declare const MagneticPressable: React$1.NamedExoticComponent<MagneticPressableProps>;
|
|
1369
|
+
|
|
1370
|
+
interface BlurSurfaceProps {
|
|
1371
|
+
elevation?: 0 | 1 | 2 | 3 | 4 | 5;
|
|
1372
|
+
variant?: 'surface' | 'frosted' | 'elevated' | 'ultraThin';
|
|
1373
|
+
borderRadius?: number;
|
|
1374
|
+
style?: StyleProp<ViewStyle>;
|
|
1375
|
+
children?: ReactNode;
|
|
1376
|
+
}
|
|
1377
|
+
|
|
1378
|
+
/**
|
|
1379
|
+
* BlurSurface — thin wrapper around GlassView exposing a clean API.
|
|
1380
|
+
* Used as a standalone decorative blur layer. No children required.
|
|
1381
|
+
*/
|
|
1382
|
+
declare const BlurSurface: React$1.NamedExoticComponent<BlurSurfaceProps>;
|
|
1383
|
+
|
|
1384
|
+
type DynamicIslandState = 'compact' | 'expanded' | 'minimal';
|
|
1385
|
+
interface DynamicIslandProps {
|
|
1386
|
+
state?: DynamicIslandState;
|
|
1387
|
+
defaultState?: DynamicIslandState;
|
|
1388
|
+
onStateChange?: (state: DynamicIslandState) => void;
|
|
1389
|
+
/** Small content for compact pill */
|
|
1390
|
+
compactContent?: ReactNode;
|
|
1391
|
+
/** Rich content for expanded state */
|
|
1392
|
+
expandedContent?: ReactNode;
|
|
1393
|
+
/** Tiny indicator dot */
|
|
1394
|
+
minimalContent?: ReactNode;
|
|
1395
|
+
onPress?: () => void;
|
|
1396
|
+
style?: StyleProp<ViewStyle>;
|
|
1397
|
+
}
|
|
1398
|
+
|
|
1399
|
+
/**
|
|
1400
|
+
* DynamicIsland — morphing pill that cycles between compact, expanded, and minimal states.
|
|
1401
|
+
* Animated width/height transitions via withSpring(SPRING_BOUNCE).
|
|
1402
|
+
*/
|
|
1403
|
+
declare const DynamicIsland: React$1.NamedExoticComponent<DynamicIslandProps>;
|
|
1404
|
+
|
|
1405
|
+
interface DockItem {
|
|
1406
|
+
icon: ReactNode;
|
|
1407
|
+
label: string;
|
|
1408
|
+
onPress: () => void;
|
|
1409
|
+
}
|
|
1410
|
+
interface FloatingDockProps {
|
|
1411
|
+
items: DockItem[];
|
|
1412
|
+
position?: 'bottom' | 'top';
|
|
1413
|
+
glass?: boolean;
|
|
1414
|
+
/** Items scale up on touch proximity */
|
|
1415
|
+
magnification?: boolean;
|
|
1416
|
+
style?: StyleProp<ViewStyle>;
|
|
1417
|
+
}
|
|
1418
|
+
|
|
1419
|
+
/**
|
|
1420
|
+
* FloatingDock — macOS-inspired dock with magnification on touch proximity.
|
|
1421
|
+
* GlassView pill container with items in a row.
|
|
1422
|
+
*/
|
|
1423
|
+
declare const FloatingDock: React$1.NamedExoticComponent<FloatingDockProps>;
|
|
1424
|
+
|
|
1425
|
+
interface MorphingContainerShape {
|
|
1426
|
+
width: number;
|
|
1427
|
+
height: number;
|
|
1428
|
+
borderRadius: number;
|
|
1429
|
+
}
|
|
1430
|
+
interface MorphingContainerProps {
|
|
1431
|
+
shape?: MorphingContainerShape;
|
|
1432
|
+
glass?: boolean;
|
|
1433
|
+
children?: ReactNode;
|
|
1434
|
+
style?: StyleProp<ViewStyle>;
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
/**
|
|
1438
|
+
* MorphingContainer — GlassView that spring-animates between different shape prop values.
|
|
1439
|
+
* All three dimensions (width, height, borderRadius) animate in unison via withSpring.
|
|
1440
|
+
*/
|
|
1441
|
+
declare const MorphingContainer: React$1.NamedExoticComponent<MorphingContainerProps>;
|
|
1442
|
+
|
|
1443
|
+
interface GlassNavbarProps {
|
|
1444
|
+
title?: string;
|
|
1445
|
+
leading?: ReactNode;
|
|
1446
|
+
trailing?: ReactNode;
|
|
1447
|
+
/** SharedValue from useScrollHandler — controls glass intensity with scroll */
|
|
1448
|
+
scrollY?: SharedValue<number>;
|
|
1449
|
+
style?: StyleProp<ViewStyle>;
|
|
1450
|
+
}
|
|
1451
|
+
|
|
1452
|
+
/**
|
|
1453
|
+
* GlassNavbar — top navigation bar whose glass intensity scales with scroll position.
|
|
1454
|
+
* At scrollY=0: transparent (elevation 0). At scrollY>50: frosted (elevation 2).
|
|
1455
|
+
*/
|
|
1456
|
+
declare const GlassNavbar: React$1.NamedExoticComponent<GlassNavbarProps>;
|
|
1457
|
+
|
|
1458
|
+
interface GlassSidebarItem {
|
|
1459
|
+
label: string;
|
|
1460
|
+
icon: ReactNode;
|
|
1461
|
+
value: string;
|
|
1462
|
+
badge?: number;
|
|
1463
|
+
}
|
|
1464
|
+
interface GlassSidebarProps {
|
|
1465
|
+
items: GlassSidebarItem[];
|
|
1466
|
+
activeItem?: string;
|
|
1467
|
+
onItemPress?: (value: string) => void;
|
|
1468
|
+
isCollapsed?: boolean;
|
|
1469
|
+
width?: number;
|
|
1470
|
+
collapsedWidth?: number;
|
|
1471
|
+
style?: StyleProp<ViewStyle>;
|
|
1472
|
+
}
|
|
1473
|
+
|
|
1474
|
+
/**
|
|
1475
|
+
* GlassSidebar — persistent (non-modal) sidebar with collapsible animation.
|
|
1476
|
+
* Width springs between expanded/collapsed; labels fade out when collapsed.
|
|
1477
|
+
*/
|
|
1478
|
+
declare const GlassSidebar: React$1.NamedExoticComponent<GlassSidebarProps>;
|
|
1479
|
+
|
|
1480
|
+
interface InteractiveGlassSurfaceProps {
|
|
1481
|
+
children?: ReactNode;
|
|
1482
|
+
/** Tilt strength 0–1, default 0.05 */
|
|
1483
|
+
parallaxStrength?: number;
|
|
1484
|
+
elevation?: 0 | 1 | 2 | 3 | 4 | 5;
|
|
1485
|
+
style?: StyleProp<ViewStyle>;
|
|
1486
|
+
}
|
|
1487
|
+
|
|
1488
|
+
/**
|
|
1489
|
+
* InteractiveGlassSurface — GlassView that simulates a gyroscope tilt effect
|
|
1490
|
+
* by tracking touch position relative to the component center.
|
|
1491
|
+
* Springs back to 0,0 on touch end.
|
|
1492
|
+
*/
|
|
1493
|
+
declare const InteractiveGlassSurface: React$1.NamedExoticComponent<InteractiveGlassSurfaceProps>;
|
|
1494
|
+
|
|
1495
|
+
type MediaPanelState = 'mini' | 'expanded';
|
|
1496
|
+
interface FloatingMediaPanelProps {
|
|
1497
|
+
state?: MediaPanelState;
|
|
1498
|
+
defaultState?: MediaPanelState;
|
|
1499
|
+
onStateChange?: (state: MediaPanelState) => void;
|
|
1500
|
+
/** Album art / thumbnail */
|
|
1501
|
+
artwork?: ReactNode;
|
|
1502
|
+
title?: string;
|
|
1503
|
+
subtitle?: string;
|
|
1504
|
+
isPlaying?: boolean;
|
|
1505
|
+
onPlayPause?: () => void;
|
|
1506
|
+
onNext?: () => void;
|
|
1507
|
+
onPrevious?: () => void;
|
|
1508
|
+
/** Playback progress 0–1 */
|
|
1509
|
+
progress?: number;
|
|
1510
|
+
style?: StyleProp<ViewStyle>;
|
|
1511
|
+
}
|
|
1512
|
+
|
|
1513
|
+
/**
|
|
1514
|
+
* FloatingMediaPanel — glass panel that morphs between a slim mini bar and a
|
|
1515
|
+
* full expanded player. Drag up to expand, drag down to minimise.
|
|
1516
|
+
*/
|
|
1517
|
+
declare const FloatingMediaPanel: React$1.NamedExoticComponent<FloatingMediaPanelProps>;
|
|
1518
|
+
|
|
1519
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, ActionSheet, type ActionSheetAction, type ActionSheetProps, Alert, type AlertProps, type AlertStatus, type AlertVariant, AspectRatio, type AspectRatioProps, Avatar, type AvatarProps, type AvatarSize, Badge, type BadgeProps, type BadgeStatus, type BadgeVariant, Banner, type BannerProps, type BannerStatus, BlurSurface, type BlurSurfaceProps, BlurTransition, type BlurTransitionProps, BottomNavigation, type BottomNavigationItem, type BottomNavigationProps, BottomSheet, type BottomSheetProps, Box, type BoxProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonColor, type ButtonProps, type ButtonSize, type ButtonVariant, Caption, type CaptionProps, Carousel, type CarouselProps, Center, type CenterProps, Checkbox, type CheckboxProps, type CheckboxSize, Chip, type ChipProps, type ChipVariant, Code, type CodeProps, type CommandItem, CommandPalette, type CommandPaletteProps, Container, type ContainerMaxWidth, type ContainerProps, ContextMenu, type ContextMenuItem, type ContextMenuProps, DatePicker, type DatePickerProps, Dialog, type DialogProps, Divider, type DividerProps, type DockItem, Drawer, type DrawerPlacement, type DrawerProps, DynamicIsland, type DynamicIslandProps, type DynamicIslandState, EmptyState, type EmptyStateProps, FAB, type FABPosition, type FABProps, type FABSize, type FABVariant, Fade, type FadeProps, Flex, type FlexProps, FloatingDock, type FloatingDockProps, FloatingMediaPanel, type FloatingMediaPanelProps, FormControl, type FormControlContextValue, type FormControlProps, type GlassButtonConfig, GlassNavbar, type GlassNavbarProps, GlassSidebar, type GlassSidebarItem, type GlassSidebarProps, GradientText, type GradientTextProps, Grid, type GridProps, HStack, Heading, type HeadingLevel, type HeadingProps, HoverCard, type HoverCardProps, IconButton, type IconButtonProps, type IconButtonSize, type IconButtonVariant, InteractiveGlassSurface, type InteractiveGlassSurfaceProps, Link, type LinkProps, LiquidCard, type LiquidCardBodyProps, type LiquidCardFooterProps, type LiquidCardHeaderProps, type LiquidCardImageProps, type LiquidCardProps, List, ListItem, type ListItemProps, type ListProps, type ListSection, MagneticPressable, type MagneticPressableProps, type MediaPanelState, Modal, type ModalProps, type ModalSize, MorphingContainer, type MorphingContainerProps, type MorphingContainerShape, MultiSelect, type MultiSelectProps, OTPInput, type OTPInputProps, Paragraph, type ParagraphProps, type ParagraphSize, PasswordInput, type PasswordInputProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, type ProgressBarVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RadioSize, RangeSlider, type RangeSliderProps, Scale, type ScaleProps, SearchBar, type SearchBarProps, type SearchBarSize, SegmentedTabs, type SegmentedTabsOption, type SegmentedTabsProps, type SegmentedTabsSize, Select, type SelectOption, type SelectProps, Sidebar, type SidebarProps, Skeleton, type SkeletonProps, type SkeletonVariant, Slide, type SlideDirection, type SlideProps, Slider, type SliderProps, type SnackbarOptions, SnackbarProvider, type SnackbarProviderProps, Spacer, type SpacerProps, Spinner, type SpinnerProps, type SpinnerSize, Stack, type StackProps, StatsCard, type StatsCardProps, type StepItem, type StepStatus, Stepper, type StepperProps, Switch, type SwitchColor, type SwitchProps, type SwitchSize, type TabListProps, type TabPanelProps, type TabProps, type TabVariant, Table, type TableColumn, type TableProps, Tabs, type TabsProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps, type TextVariant, type TextWeight, TimePicker, type TimePickerProps, Timeline, type TimelineItem, type TimelineItemStatus, type TimelineProps, Toast, type ToastAction, type ToastItem, type ToastOptions, type ToastPosition, ToastProvider, type ToastType, Tooltip, type TooltipPlacement, type TooltipProps, TopNavigation, type TopNavigationProps, type TrendDirection, VStack, snackbar, toast, useFormControl };
|