@hoddy-ui/core 2.5.5 → 2.5.7

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.
@@ -1,5 +1,5 @@
1
1
  import React, { ReactNode, FC } from 'react';
2
- import { ViewStyle, TextStyle, NativeSyntheticEvent, NativeScrollEvent, TextInputProps, TextProps, TextInput } from 'react-native';
2
+ import { ViewStyle, TextStyle, NativeSyntheticEvent, NativeScrollEvent, TextInputProps, TextProps, StyleProp, TextInput } from 'react-native';
3
3
  import * as index from 'index';
4
4
 
5
5
  type ThemeTypes = "dark" | "light";
@@ -56,14 +56,6 @@ interface AvatarProps {
56
56
  size?: number;
57
57
  style?: ViewStyle;
58
58
  }
59
- interface AnimatorProps {
60
- style?: ViewStyle;
61
- duration?: number;
62
- children: ReactNode;
63
- delay?: number;
64
- animationType?: "easeInEaseOut" | "linear" | "spring";
65
- type?: "fade" | "slideInLeft" | "slideInRight" | "slideInUp" | "slideInDown";
66
- }
67
59
  interface ButtonProps {
68
60
  color?: colorTypes;
69
61
  variant?: "text" | "outlined" | "contained";
@@ -104,7 +96,7 @@ interface LinkButtonProps {
104
96
  style?: TextStyle & ViewStyle;
105
97
  color?: colorTypes;
106
98
  fontSize?: number;
107
- fontWeight?: string;
99
+ fontWeight?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
108
100
  disabled?: boolean;
109
101
  onPress?: () => void;
110
102
  }
@@ -197,6 +189,8 @@ interface PopupProps {
197
189
  open: boolean;
198
190
  onClose?: () => void;
199
191
  style?: ViewStyle;
192
+ onModalShow?: () => void;
193
+ onModalHide?: () => void;
200
194
  }
201
195
  interface SpinnerProps {
202
196
  label?: string;
@@ -207,6 +201,7 @@ interface SpinnerProps {
207
201
  }
208
202
  interface TextFieldProps extends TextInputProps {
209
203
  label?: string;
204
+ labelProps?: TypographyProps;
210
205
  variant?: "outlined" | "text" | "contained";
211
206
  color?: colorTypes;
212
207
  size?: "small" | "normal" | "large";
@@ -233,7 +228,7 @@ interface TextFieldProps extends TextInputProps {
233
228
  interface TypographyProps extends TextProps {
234
229
  children: ReactNode;
235
230
  color?: colorTypes | (string & {});
236
- style?: TextStyle | ViewStyle;
231
+ style?: StyleProp<TextStyle | ViewStyle>;
237
232
  textCase?: "capitalize" | "uppercase" | "lowercase" | undefined;
238
233
  variant?: "caption" | "body1" | "body2" | "h6" | "h5" | "h4" | "h3" | "h2" | "h1";
239
234
  align?: "center" | "left" | "right";
@@ -241,6 +236,7 @@ interface TypographyProps extends TextProps {
241
236
  numberOfLines?: number;
242
237
  adjustsFontSizeToFit?: boolean;
243
238
  fontFamily?: string;
239
+ fontSize?: number;
244
240
  fontWeight?: 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
245
241
  }
246
242
  interface SafeAreaViewProps {
@@ -289,12 +285,81 @@ interface DividerProps {
289
285
  style?: ViewStyle;
290
286
  height?: number;
291
287
  }
288
+ type AnimationType = "fade" | "grow" | "slide" | "blink" | "float" | "roll" | "thrownup";
289
+ interface BaseAnimatorProps {
290
+ children: ReactNode;
291
+ duration?: number;
292
+ delay?: number;
293
+ closeAfter?: number | null;
294
+ style?: ViewStyle;
295
+ }
296
+ type AnimatorProps = (BaseAnimatorProps & {
297
+ type: "fade";
298
+ }) | (BaseAnimatorProps & {
299
+ type: "grow";
300
+ initialScale?: number;
301
+ }) | (BaseAnimatorProps & {
302
+ type: "slide";
303
+ direction?: "up" | "down" | "left" | "right";
304
+ initialValue?: number;
305
+ }) | (BaseAnimatorProps & {
306
+ type: "blink";
307
+ blinkDuration?: number;
308
+ minOpacity?: number;
309
+ maxOpacity?: number;
310
+ }) | (BaseAnimatorProps & {
311
+ type: "float";
312
+ closeDuration?: number;
313
+ floatDistance?: number;
314
+ floatDuration?: number;
315
+ }) | (BaseAnimatorProps & {
316
+ type: "roll";
317
+ initialTranslateY?: number;
318
+ initialRotate?: string;
319
+ }) | (BaseAnimatorProps & {
320
+ type: "thrownup";
321
+ });
292
322
 
323
+ /**
324
+ * Configuration options for the Hoddy UI library
325
+ *
326
+ * @example
327
+ * ```typescript
328
+ * initialize({
329
+ * googleMapApiKey: "AIzaSyBxxxxxxxxxxxxxxxxxxxxxx",
330
+ * edgeToEdge: true,
331
+ * colors: {
332
+ * primary: "#007AFF",
333
+ * secondary: "#34C759"
334
+ * },
335
+ * typography: {
336
+ * fontFamily: "Inter",
337
+ * fontWeights: {
338
+ * 400: "Inter-Regular",
339
+ * 500: "Inter-Medium",
340
+ * 600: "Inter-SemiBold",
341
+ * 700: "Inter-Bold"
342
+ * }
343
+ * }
344
+ * });
345
+ * ```
346
+ */
293
347
  type configProps = {
348
+ /** Google Maps API key for map components */
294
349
  googleMapApiKey?: string;
350
+ /** Custom color palette overrides */
295
351
  colors?: extraColorTypes;
296
- fontFamily?: string;
352
+ /** Enable edge-to-edge display mode */
297
353
  edgeToEdge?: boolean;
354
+ /** Typography settings */
355
+ typography?: {
356
+ /** Primary font family */
357
+ fontFamily?: string;
358
+ /** Font family mappings for each weight (Android support) */
359
+ fontWeights?: {
360
+ [K in 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900]?: string;
361
+ };
362
+ };
298
363
  };
299
364
  declare function initialize(config: configProps): void;
300
365
 
@@ -371,10 +436,10 @@ declare const OTPInput: FC<OTPInputProps>;
371
436
 
372
437
  declare const useColors: () => {
373
438
  white: {
374
- main?: string | undefined;
375
- light?: string | undefined;
376
- dark?: string | undefined;
377
- text?: string | undefined;
439
+ main?: string;
440
+ light?: string;
441
+ dark?: string;
442
+ text?: string;
378
443
  1: string;
379
444
  2: string;
380
445
  3: string;
@@ -382,10 +447,10 @@ declare const useColors: () => {
382
447
  5: string;
383
448
  };
384
449
  black: {
385
- main?: string | undefined;
386
- light?: string | undefined;
387
- dark?: string | undefined;
388
- text?: string | undefined;
450
+ main?: string;
451
+ light?: string;
452
+ dark?: string;
453
+ text?: string;
389
454
  1: string;
390
455
  2: string;
391
456
  3: string;
@@ -454,10 +519,10 @@ declare const useColors: () => {
454
519
  };
455
520
  } | {
456
521
  white: {
457
- main?: string | undefined;
458
- light?: string | undefined;
459
- dark?: string | undefined;
460
- text?: string | undefined;
522
+ main?: string;
523
+ light?: string;
524
+ dark?: string;
525
+ text?: string;
461
526
  1: string;
462
527
  2: string;
463
528
  3: string;
@@ -465,10 +530,10 @@ declare const useColors: () => {
465
530
  5: string;
466
531
  };
467
532
  black: {
468
- main?: string | undefined;
469
- light?: string | undefined;
470
- dark?: string | undefined;
471
- text?: string | undefined;
533
+ main?: string;
534
+ light?: string;
535
+ dark?: string;
536
+ text?: string;
472
537
  1: string;
473
538
  2: string;
474
539
  3: string;
@@ -537,10 +602,10 @@ declare const useColors: () => {
537
602
  };
538
603
  } | {
539
604
  white: {
540
- main?: string | undefined;
541
- light?: string | undefined;
542
- dark?: string | undefined;
543
- text?: string | undefined;
605
+ main?: string;
606
+ light?: string;
607
+ dark?: string;
608
+ text?: string;
544
609
  1: string;
545
610
  2: string;
546
611
  3: string;
@@ -548,10 +613,10 @@ declare const useColors: () => {
548
613
  5: string;
549
614
  };
550
615
  black: {
551
- main?: string | undefined;
552
- light?: string | undefined;
553
- dark?: string | undefined;
554
- text?: string | undefined;
616
+ main?: string;
617
+ light?: string;
618
+ dark?: string;
619
+ text?: string;
555
620
  1: string;
556
621
  2: string;
557
622
  3: string;
@@ -629,4 +694,4 @@ declare const HoddyUI: {
629
694
  initialize: typeof initialize;
630
695
  };
631
696
 
632
- export { AdaptiveStatusBar, AlertX, type AlertXProps, type AnimatorProps, Avatar, type AvatarProps, Button, type ButtonProps, CheckBox, type CheckboxProps, Divider, type DividerProps, type FlashMessageProps, FormWrapper, type FormWrapperProps, Grid, GridItem, type GridItemProps, type GridProps, IconButton, type IconButtonProps, LinkButton, type LinkButtonProps, type ListItemProps, type ListItemTextProps, type ListProps, Locator, type LocatorInputProps, type LocatorProps, OTPInput, type OTPInputProps, Popup, type PopupProps, RatingInput, type RatingInputProps, RatingStars, type RatingStarsProps, SafeAreaView, type SafeAreaViewProps, SelectMenu, type SelectMenuProps, Spinner, type SpinnerProps, TextField, TextField2, type TextFieldProps, type ThemeActionTypes, type ThemeContext, type ThemeModes, type ThemeProviderProps, type ThemeState, type ThemeTypes, Typography, type TypographyProps, UIThemeContext, UIThemeProvider, type colorTypes, HoddyUI as default, type extraColorTypes, getLocationFromPlaceId, getPredictionsFromCoords, getPredictionsFromQuery, type locatorLocation, type predictionType, showFlashMessage, useColors, useNavScreenOptions, useTheme };
697
+ export { AdaptiveStatusBar, AlertX, type AlertXProps, type AnimationType, type AnimatorProps, Avatar, type AvatarProps, Button, type ButtonProps, CheckBox, type CheckboxProps, Divider, type DividerProps, type FlashMessageProps, FormWrapper, type FormWrapperProps, Grid, GridItem, type GridItemProps, type GridProps, IconButton, type IconButtonProps, LinkButton, type LinkButtonProps, type ListItemProps, type ListItemTextProps, type ListProps, Locator, type LocatorInputProps, type LocatorProps, OTPInput, type OTPInputProps, Popup, type PopupProps, RatingInput, type RatingInputProps, RatingStars, type RatingStarsProps, SafeAreaView, type SafeAreaViewProps, SelectMenu, type SelectMenuProps, Spinner, type SpinnerProps, TextField, TextField2, type TextFieldProps, type ThemeActionTypes, type ThemeContext, type ThemeModes, type ThemeProviderProps, type ThemeState, type ThemeTypes, Typography, type TypographyProps, UIThemeContext, UIThemeProvider, type colorTypes, HoddyUI as default, type extraColorTypes, getLocationFromPlaceId, getPredictionsFromCoords, getPredictionsFromQuery, type locatorLocation, type predictionType, showFlashMessage, useColors, useNavScreenOptions, useTheme };
@@ -1,5 +1,5 @@
1
1
  import React, { ReactNode, FC } from 'react';
2
- import { ViewStyle, TextStyle, NativeSyntheticEvent, NativeScrollEvent, TextInputProps, TextProps, TextInput } from 'react-native';
2
+ import { ViewStyle, TextStyle, NativeSyntheticEvent, NativeScrollEvent, TextInputProps, TextProps, StyleProp, TextInput } from 'react-native';
3
3
  import * as index from 'index';
4
4
 
5
5
  type ThemeTypes = "dark" | "light";
@@ -56,14 +56,6 @@ interface AvatarProps {
56
56
  size?: number;
57
57
  style?: ViewStyle;
58
58
  }
59
- interface AnimatorProps {
60
- style?: ViewStyle;
61
- duration?: number;
62
- children: ReactNode;
63
- delay?: number;
64
- animationType?: "easeInEaseOut" | "linear" | "spring";
65
- type?: "fade" | "slideInLeft" | "slideInRight" | "slideInUp" | "slideInDown";
66
- }
67
59
  interface ButtonProps {
68
60
  color?: colorTypes;
69
61
  variant?: "text" | "outlined" | "contained";
@@ -104,7 +96,7 @@ interface LinkButtonProps {
104
96
  style?: TextStyle & ViewStyle;
105
97
  color?: colorTypes;
106
98
  fontSize?: number;
107
- fontWeight?: string;
99
+ fontWeight?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
108
100
  disabled?: boolean;
109
101
  onPress?: () => void;
110
102
  }
@@ -197,6 +189,8 @@ interface PopupProps {
197
189
  open: boolean;
198
190
  onClose?: () => void;
199
191
  style?: ViewStyle;
192
+ onModalShow?: () => void;
193
+ onModalHide?: () => void;
200
194
  }
201
195
  interface SpinnerProps {
202
196
  label?: string;
@@ -207,6 +201,7 @@ interface SpinnerProps {
207
201
  }
208
202
  interface TextFieldProps extends TextInputProps {
209
203
  label?: string;
204
+ labelProps?: TypographyProps;
210
205
  variant?: "outlined" | "text" | "contained";
211
206
  color?: colorTypes;
212
207
  size?: "small" | "normal" | "large";
@@ -233,7 +228,7 @@ interface TextFieldProps extends TextInputProps {
233
228
  interface TypographyProps extends TextProps {
234
229
  children: ReactNode;
235
230
  color?: colorTypes | (string & {});
236
- style?: TextStyle | ViewStyle;
231
+ style?: StyleProp<TextStyle | ViewStyle>;
237
232
  textCase?: "capitalize" | "uppercase" | "lowercase" | undefined;
238
233
  variant?: "caption" | "body1" | "body2" | "h6" | "h5" | "h4" | "h3" | "h2" | "h1";
239
234
  align?: "center" | "left" | "right";
@@ -241,6 +236,7 @@ interface TypographyProps extends TextProps {
241
236
  numberOfLines?: number;
242
237
  adjustsFontSizeToFit?: boolean;
243
238
  fontFamily?: string;
239
+ fontSize?: number;
244
240
  fontWeight?: 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
245
241
  }
246
242
  interface SafeAreaViewProps {
@@ -289,12 +285,81 @@ interface DividerProps {
289
285
  style?: ViewStyle;
290
286
  height?: number;
291
287
  }
288
+ type AnimationType = "fade" | "grow" | "slide" | "blink" | "float" | "roll" | "thrownup";
289
+ interface BaseAnimatorProps {
290
+ children: ReactNode;
291
+ duration?: number;
292
+ delay?: number;
293
+ closeAfter?: number | null;
294
+ style?: ViewStyle;
295
+ }
296
+ type AnimatorProps = (BaseAnimatorProps & {
297
+ type: "fade";
298
+ }) | (BaseAnimatorProps & {
299
+ type: "grow";
300
+ initialScale?: number;
301
+ }) | (BaseAnimatorProps & {
302
+ type: "slide";
303
+ direction?: "up" | "down" | "left" | "right";
304
+ initialValue?: number;
305
+ }) | (BaseAnimatorProps & {
306
+ type: "blink";
307
+ blinkDuration?: number;
308
+ minOpacity?: number;
309
+ maxOpacity?: number;
310
+ }) | (BaseAnimatorProps & {
311
+ type: "float";
312
+ closeDuration?: number;
313
+ floatDistance?: number;
314
+ floatDuration?: number;
315
+ }) | (BaseAnimatorProps & {
316
+ type: "roll";
317
+ initialTranslateY?: number;
318
+ initialRotate?: string;
319
+ }) | (BaseAnimatorProps & {
320
+ type: "thrownup";
321
+ });
292
322
 
323
+ /**
324
+ * Configuration options for the Hoddy UI library
325
+ *
326
+ * @example
327
+ * ```typescript
328
+ * initialize({
329
+ * googleMapApiKey: "AIzaSyBxxxxxxxxxxxxxxxxxxxxxx",
330
+ * edgeToEdge: true,
331
+ * colors: {
332
+ * primary: "#007AFF",
333
+ * secondary: "#34C759"
334
+ * },
335
+ * typography: {
336
+ * fontFamily: "Inter",
337
+ * fontWeights: {
338
+ * 400: "Inter-Regular",
339
+ * 500: "Inter-Medium",
340
+ * 600: "Inter-SemiBold",
341
+ * 700: "Inter-Bold"
342
+ * }
343
+ * }
344
+ * });
345
+ * ```
346
+ */
293
347
  type configProps = {
348
+ /** Google Maps API key for map components */
294
349
  googleMapApiKey?: string;
350
+ /** Custom color palette overrides */
295
351
  colors?: extraColorTypes;
296
- fontFamily?: string;
352
+ /** Enable edge-to-edge display mode */
297
353
  edgeToEdge?: boolean;
354
+ /** Typography settings */
355
+ typography?: {
356
+ /** Primary font family */
357
+ fontFamily?: string;
358
+ /** Font family mappings for each weight (Android support) */
359
+ fontWeights?: {
360
+ [K in 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900]?: string;
361
+ };
362
+ };
298
363
  };
299
364
  declare function initialize(config: configProps): void;
300
365
 
@@ -371,10 +436,10 @@ declare const OTPInput: FC<OTPInputProps>;
371
436
 
372
437
  declare const useColors: () => {
373
438
  white: {
374
- main?: string | undefined;
375
- light?: string | undefined;
376
- dark?: string | undefined;
377
- text?: string | undefined;
439
+ main?: string;
440
+ light?: string;
441
+ dark?: string;
442
+ text?: string;
378
443
  1: string;
379
444
  2: string;
380
445
  3: string;
@@ -382,10 +447,10 @@ declare const useColors: () => {
382
447
  5: string;
383
448
  };
384
449
  black: {
385
- main?: string | undefined;
386
- light?: string | undefined;
387
- dark?: string | undefined;
388
- text?: string | undefined;
450
+ main?: string;
451
+ light?: string;
452
+ dark?: string;
453
+ text?: string;
389
454
  1: string;
390
455
  2: string;
391
456
  3: string;
@@ -454,10 +519,10 @@ declare const useColors: () => {
454
519
  };
455
520
  } | {
456
521
  white: {
457
- main?: string | undefined;
458
- light?: string | undefined;
459
- dark?: string | undefined;
460
- text?: string | undefined;
522
+ main?: string;
523
+ light?: string;
524
+ dark?: string;
525
+ text?: string;
461
526
  1: string;
462
527
  2: string;
463
528
  3: string;
@@ -465,10 +530,10 @@ declare const useColors: () => {
465
530
  5: string;
466
531
  };
467
532
  black: {
468
- main?: string | undefined;
469
- light?: string | undefined;
470
- dark?: string | undefined;
471
- text?: string | undefined;
533
+ main?: string;
534
+ light?: string;
535
+ dark?: string;
536
+ text?: string;
472
537
  1: string;
473
538
  2: string;
474
539
  3: string;
@@ -537,10 +602,10 @@ declare const useColors: () => {
537
602
  };
538
603
  } | {
539
604
  white: {
540
- main?: string | undefined;
541
- light?: string | undefined;
542
- dark?: string | undefined;
543
- text?: string | undefined;
605
+ main?: string;
606
+ light?: string;
607
+ dark?: string;
608
+ text?: string;
544
609
  1: string;
545
610
  2: string;
546
611
  3: string;
@@ -548,10 +613,10 @@ declare const useColors: () => {
548
613
  5: string;
549
614
  };
550
615
  black: {
551
- main?: string | undefined;
552
- light?: string | undefined;
553
- dark?: string | undefined;
554
- text?: string | undefined;
616
+ main?: string;
617
+ light?: string;
618
+ dark?: string;
619
+ text?: string;
555
620
  1: string;
556
621
  2: string;
557
622
  3: string;
@@ -629,4 +694,4 @@ declare const HoddyUI: {
629
694
  initialize: typeof initialize;
630
695
  };
631
696
 
632
- export { AdaptiveStatusBar, AlertX, type AlertXProps, type AnimatorProps, Avatar, type AvatarProps, Button, type ButtonProps, CheckBox, type CheckboxProps, Divider, type DividerProps, type FlashMessageProps, FormWrapper, type FormWrapperProps, Grid, GridItem, type GridItemProps, type GridProps, IconButton, type IconButtonProps, LinkButton, type LinkButtonProps, type ListItemProps, type ListItemTextProps, type ListProps, Locator, type LocatorInputProps, type LocatorProps, OTPInput, type OTPInputProps, Popup, type PopupProps, RatingInput, type RatingInputProps, RatingStars, type RatingStarsProps, SafeAreaView, type SafeAreaViewProps, SelectMenu, type SelectMenuProps, Spinner, type SpinnerProps, TextField, TextField2, type TextFieldProps, type ThemeActionTypes, type ThemeContext, type ThemeModes, type ThemeProviderProps, type ThemeState, type ThemeTypes, Typography, type TypographyProps, UIThemeContext, UIThemeProvider, type colorTypes, HoddyUI as default, type extraColorTypes, getLocationFromPlaceId, getPredictionsFromCoords, getPredictionsFromQuery, type locatorLocation, type predictionType, showFlashMessage, useColors, useNavScreenOptions, useTheme };
697
+ export { AdaptiveStatusBar, AlertX, type AlertXProps, type AnimationType, type AnimatorProps, Avatar, type AvatarProps, Button, type ButtonProps, CheckBox, type CheckboxProps, Divider, type DividerProps, type FlashMessageProps, FormWrapper, type FormWrapperProps, Grid, GridItem, type GridItemProps, type GridProps, IconButton, type IconButtonProps, LinkButton, type LinkButtonProps, type ListItemProps, type ListItemTextProps, type ListProps, Locator, type LocatorInputProps, type LocatorProps, OTPInput, type OTPInputProps, Popup, type PopupProps, RatingInput, type RatingInputProps, RatingStars, type RatingStarsProps, SafeAreaView, type SafeAreaViewProps, SelectMenu, type SelectMenuProps, Spinner, type SpinnerProps, TextField, TextField2, type TextFieldProps, type ThemeActionTypes, type ThemeContext, type ThemeModes, type ThemeProviderProps, type ThemeState, type ThemeTypes, Typography, type TypographyProps, UIThemeContext, UIThemeProvider, type colorTypes, HoddyUI as default, type extraColorTypes, getLocationFromPlaceId, getPredictionsFromCoords, getPredictionsFromQuery, type locatorLocation, type predictionType, showFlashMessage, useColors, useNavScreenOptions, useTheme };