@hero-design/rn 8.30.4 → 8.31.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.
Files changed (74) hide show
  1. package/.turbo/turbo-build.log +1 -1
  2. package/es/index.js +46 -7
  3. package/lib/index.js +46 -7
  4. package/package.json +5 -5
  5. package/src/components/Typography/Caption/StyledCaption.tsx +19 -0
  6. package/src/components/Typography/Caption/__tests__/StyledCaption.spec.tsx +39 -0
  7. package/src/components/Typography/Caption/__tests__/__snapshots__/StyledCaption.spec.tsx.snap +211 -0
  8. package/src/components/Typography/Caption/__tests__/__snapshots__/index.spec.tsx.snap +287 -0
  9. package/src/components/Typography/Caption/__tests__/index.spec.tsx +46 -0
  10. package/src/components/Typography/Caption/index.tsx +61 -0
  11. package/src/components/Typography/index.tsx +3 -0
  12. package/src/components/Typography/types.ts +18 -0
  13. package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +2 -0
  14. package/src/theme/components/typography.ts +2 -0
  15. package/src/utils/helpers.ts +4 -1
  16. package/types/components/Accordion/AccordionItem.d.ts +1 -1
  17. package/types/components/Accordion/StyledAccordion.d.ts +1 -1
  18. package/types/components/Avatar/StyledAvatar.d.ts +2 -2
  19. package/types/components/Badge/StyledBadge.d.ts +2 -2
  20. package/types/components/BottomNavigation/index.d.ts +1 -1
  21. package/types/components/BottomSheet/BottomSheetContext.d.ts +1 -1
  22. package/types/components/Box/config.d.ts +2 -2
  23. package/types/components/Box/types.d.ts +3 -3
  24. package/types/components/Button/LoadingIndicator/StyledLoadingIndicator.d.ts +1 -1
  25. package/types/components/Button/LoadingIndicator/index.d.ts +1 -1
  26. package/types/components/Button/StyledButton.d.ts +2 -2
  27. package/types/components/Carousel/CardCarousel.d.ts +1 -1
  28. package/types/components/Carousel/types.d.ts +2 -2
  29. package/types/components/Divider/StyledDivider.d.ts +1 -1
  30. package/types/components/Drawer/DragableDrawer/helpers.d.ts +1 -1
  31. package/types/components/Empty/StyledEmpty.d.ts +1 -1
  32. package/types/components/Error/StyledError.d.ts +1 -1
  33. package/types/components/FAB/AnimatedFABIcon.d.ts +1 -1
  34. package/types/components/Icon/AnimatedIcon.d.ts +1 -1
  35. package/types/components/Icon/HeroIcon/index.d.ts +2 -2
  36. package/types/components/Icon/index.d.ts +1 -1
  37. package/types/components/List/StyledListItem.d.ts +2 -2
  38. package/types/components/PinInput/StyledPinInput.d.ts +1 -1
  39. package/types/components/Progress/types.d.ts +1 -1
  40. package/types/components/Radio/types.d.ts +1 -1
  41. package/types/components/RefreshControl/index.d.ts +1 -1
  42. package/types/components/RichTextEditor/RichTextEditor.d.ts +1 -1
  43. package/types/components/RichTextEditor/types.d.ts +1 -1
  44. package/types/components/Select/BaseOptionList.d.ts +1 -1
  45. package/types/components/Select/MultiSelect/OptionList.d.ts +1 -1
  46. package/types/components/Select/SingleSelect/OptionList.d.ts +1 -1
  47. package/types/components/Select/helpers.d.ts +1 -1
  48. package/types/components/Select/types.d.ts +6 -6
  49. package/types/components/Skeleton/StyledSkeleton.d.ts +2 -2
  50. package/types/components/Success/StyledSuccess.d.ts +1 -1
  51. package/types/components/Swipeable/StyledSwipeable.d.ts +1 -1
  52. package/types/components/Swipeable/index.d.ts +2 -2
  53. package/types/components/Switch/SelectorSwitch/index.d.ts +3 -3
  54. package/types/components/Switch/StyledSwitch.d.ts +1 -1
  55. package/types/components/Tabs/TabWithBadge.d.ts +3 -3
  56. package/types/components/Tabs/index.d.ts +2 -2
  57. package/types/components/Tag/StyledTag.d.ts +2 -2
  58. package/types/components/TextInput/StyledTextInput.d.ts +2 -2
  59. package/types/components/TextInput/index.d.ts +1 -1
  60. package/types/components/Toast/ToastContext.d.ts +2 -2
  61. package/types/components/Toast/ToastProvider.d.ts +1 -1
  62. package/types/components/Toast/types.d.ts +2 -2
  63. package/types/components/Typography/Caption/StyledCaption.d.ts +13 -0
  64. package/types/components/Typography/Caption/index.d.ts +26 -0
  65. package/types/components/Typography/index.d.ts +2 -0
  66. package/types/components/Typography/types.d.ts +6 -0
  67. package/types/theme/ThemeSwitcher.d.ts +1 -1
  68. package/types/theme/components/typography.d.ts +2 -0
  69. package/types/theme/getTheme.d.ts +1 -1
  70. package/types/theme/global/colors/types.d.ts +3 -3
  71. package/types/theme/global/index.d.ts +1 -1
  72. package/types/theme/global/scale.d.ts +1 -1
  73. package/types/theme/global/typography.d.ts +1 -1
  74. package/types/utils/helpers.d.ts +1 -1
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
- declare type ThemeSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
3
- declare type ThemeIntent = 'text' | 'primary' | 'secondary' | 'info' | 'danger' | 'success' | 'warning' | 'disabled-text' | 'text-inverted';
2
+ type ThemeSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
3
+ type ThemeIntent = 'text' | 'primary' | 'secondary' | 'info' | 'danger' | 'success' | 'warning' | 'disabled-text' | 'text-inverted';
4
4
  declare const StyledHeroIcon: import("@emotion/native").StyledComponent<import("react-native-vector-icons/Icon").IconProps & {
5
5
  theme?: import("@emotion/react").Theme | undefined;
6
6
  as?: import("react").ElementType<any> | undefined;
@@ -1,6 +1,6 @@
1
1
  import type { AccessibilityProps, StyleProp, TextStyle } from 'react-native';
2
2
  import IconList from './IconList';
3
- export declare type IconName = typeof IconList[number];
3
+ export type IconName = typeof IconList[number];
4
4
  export interface IconProps extends AccessibilityProps {
5
5
  /**
6
6
  * Name of the Icon.
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { TouchableHighlight, View } from 'react-native';
3
- export declare type Variant = 'full-width' | 'card';
4
- export declare type LeadingStatusIntent = 'success' | 'warning' | 'danger' | 'info' | 'archived';
3
+ export type Variant = 'full-width' | 'card';
4
+ export type LeadingStatusIntent = 'success' | 'warning' | 'danger' | 'info' | 'archived';
5
5
  declare const StyledListItemContainer: import("@emotion/native").StyledComponent<import("react-native").TouchableHighlightProps & {
6
6
  theme?: import("@emotion/react").Theme | undefined;
7
7
  as?: import("react").ElementType<any> | undefined;
@@ -12,7 +12,7 @@ export declare const StyledPinWrapper: import("@emotion/native").StyledComponent
12
12
  }, {}, {
13
13
  ref?: import("react").Ref<View> | undefined;
14
14
  }>;
15
- export declare type State = 'default' | 'disabled' | 'error';
15
+ export type State = 'default' | 'disabled' | 'error';
16
16
  export declare const StyledCell: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
17
17
  theme?: import("@emotion/react").Theme | undefined;
18
18
  as?: import("react").ElementType<any> | undefined;
@@ -1 +1 @@
1
- export declare type ThemeIntent = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'archived' | 'primary-inverted' | 'success-inverted' | 'warning-inverted' | 'danger-inverted' | 'info-inverted' | 'archived-inverted';
1
+ export type ThemeIntent = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'archived' | 'primary-inverted' | 'success-inverted' | 'warning-inverted' | 'danger-inverted' | 'info-inverted' | 'archived-inverted';
@@ -1,4 +1,4 @@
1
- export declare type OptionType<T> = {
1
+ export type OptionType<T> = {
2
2
  value: T;
3
3
  text: string;
4
4
  key?: string;
@@ -1,4 +1,4 @@
1
1
  import { RefreshControlProps as NativeRefreshControlProps } from 'react-native';
2
- export declare type RefreshControlProps = Omit<NativeRefreshControlProps, 'colors' | 'tintColor'>;
2
+ export type RefreshControlProps = Omit<NativeRefreshControlProps, 'colors' | 'tintColor'>;
3
3
  declare const RefreshControl: ({ ...props }: RefreshControlProps) => JSX.Element;
4
4
  export default RefreshControl;
@@ -4,7 +4,7 @@ import type { StyleProp, ViewStyle } from 'react-native';
4
4
  export interface RichTextEditorRef {
5
5
  requestBlur: VoidFunction;
6
6
  }
7
- export declare type EditorValue = {
7
+ export type EditorValue = {
8
8
  type: string;
9
9
  children: any;
10
10
  }[];
@@ -1 +1 @@
1
- export declare type ToolbarButtonName = 'bold' | 'italic' | 'underline' | 'bulletedList' | 'numberedList' | 'headingOne' | 'headingTwo' | '|';
1
+ export type ToolbarButtonName = 'bold' | 'italic' | 'underline' | 'bulletedList' | 'numberedList' | 'headingOne' | 'headingTwo' | '|';
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { SectionList, SectionListProps } from 'react-native';
3
3
  import type { OptionType, SelectProps, SectionType } from './types';
4
- export declare type BaseOptionListProps<V, T extends OptionType<V>> = Pick<SelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange'> & {
4
+ export type BaseOptionListProps<V, T extends OptionType<V>> = Pick<SelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange'> & {
5
5
  sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
6
6
  } & SectionListProps<T, SectionType>;
7
7
  declare const BaseOptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onQueryChange, sections, renderItem, sectionListRef, ...rest }: BaseOptionListProps<V, T>) => JSX.Element;
@@ -1,7 +1,7 @@
1
1
  import { BaseOptionListProps } from '../BaseOptionList';
2
2
  import type { MultiSelectProps } from '.';
3
3
  import type { OptionType } from '../types';
4
- declare type OptionListProps<V, T extends OptionType<V>> = Pick<MultiSelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange' | 'value' | 'renderOption'> & {
4
+ type OptionListProps<V, T extends OptionType<V>> = Pick<MultiSelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange' | 'value' | 'renderOption'> & {
5
5
  onPress: (value: V[]) => void;
6
6
  } & BaseOptionListProps<V, T>;
7
7
  declare const OptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, sections, renderOption, value, sectionListRef, ...rest }: OptionListProps<V, T>) => JSX.Element;
@@ -3,7 +3,7 @@ import { SectionList } from 'react-native';
3
3
  import type { SingleSelectProps } from '.';
4
4
  import type { OptionType, SectionType } from '../types';
5
5
  import { BaseOptionListProps } from '../BaseOptionList';
6
- declare type OptionListProps<V, T extends OptionType<V>> = Pick<SingleSelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange' | 'value' | 'renderOption'> & {
6
+ type OptionListProps<V, T extends OptionType<V>> = Pick<SingleSelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange' | 'value' | 'renderOption'> & {
7
7
  onPress: (value: V | null) => void;
8
8
  sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
9
9
  } & BaseOptionListProps<V, T>;
@@ -4,7 +4,7 @@ export declare const getKey: <V, T extends OptionType<V>>(option: T, index: numb
4
4
  export declare const isSections: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => options is SectionData<V, T>[];
5
5
  export declare const toSections: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => SectionData<V, T>[];
6
6
  export declare const toFlatOptions: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => OptionType<V>[];
7
- export declare type ScrollParams = {
7
+ export type ScrollParams = {
8
8
  itemIndex: number;
9
9
  sectionIndex: number;
10
10
  };
@@ -1,23 +1,23 @@
1
1
  import type { ReactElement } from 'react';
2
2
  import type { ListRenderItemInfo, SectionListData, SectionListRenderItemInfo, StyleProp, ViewStyle } from 'react-native';
3
3
  import type { TextInputProps } from '../TextInput';
4
- export declare type OptionType<V> = {
4
+ export type OptionType<V> = {
5
5
  value: V;
6
6
  text: string;
7
7
  key?: string;
8
8
  disabled?: boolean;
9
9
  highlighted?: boolean;
10
10
  };
11
- export declare type SectionType = {
11
+ export type SectionType = {
12
12
  category: string;
13
13
  };
14
- export declare type SectionData<V, T extends OptionType<V>> = SectionListData<T, SectionType>;
15
- export declare type CombinedOptionsType<V, T extends OptionType<V>> = T[] | SectionData<V, T>[];
16
- export declare type ListRenderOptionInfo<V, T extends OptionType<V>> = ListRenderItemInfo<T> & {
14
+ export type SectionData<V, T extends OptionType<V>> = SectionListData<T, SectionType>;
15
+ export type CombinedOptionsType<V, T extends OptionType<V>> = T[] | SectionData<V, T>[];
16
+ export type ListRenderOptionInfo<V, T extends OptionType<V>> = ListRenderItemInfo<T> & {
17
17
  selected: boolean;
18
18
  onPress: () => void;
19
19
  };
20
- export declare type SectionListRenderOptionInfo<V, T extends OptionType<V>> = SectionListRenderItemInfo<T, SectionType> & {
20
+ export type SectionListRenderOptionInfo<V, T extends OptionType<V>> = SectionListRenderItemInfo<T, SectionType> & {
21
21
  selected: boolean;
22
22
  onPress: () => void;
23
23
  };
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
- declare type ThemeIntent = 'light' | 'dark';
3
- declare type ThemeVariant = 'circular' | 'rectangular' | 'rounded';
2
+ type ThemeIntent = 'light' | 'dark';
3
+ type ThemeVariant = 'circular' | 'rectangular' | 'rounded';
4
4
  declare const StyledContainer: import("@emotion/native").StyledComponent<import("../Box").BoxProps & {
5
5
  theme?: import("@emotion/react").Theme | undefined;
6
6
  as?: import("react").ElementType<any> | undefined;
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { Modal, View } from 'react-native';
3
- declare type SuccessVariant = 'full-screen' | 'in-page';
3
+ type SuccessVariant = 'full-screen' | 'in-page';
4
4
  declare const StyledSuccessContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
5
5
  theme?: import("@emotion/react").Theme | undefined;
6
6
  as?: import("react").ElementType<any> | undefined;
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { TouchableOpacity } from 'react-native';
3
- export declare type ActionIntent = 'primary' | 'success' | 'danger';
3
+ export type ActionIntent = 'primary' | 'success' | 'danger';
4
4
  export declare const StyledRectButton: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
5
5
  theme?: import("@emotion/react").Theme | undefined;
6
6
  as?: import("react").ElementType<any> | undefined;
@@ -1,7 +1,7 @@
1
1
  import { ComponentProps, ReactNode } from 'react';
2
2
  import { Swipeable as RnghSwipeable, RectButton } from 'react-native-gesture-handler';
3
- declare type State = 'closed' | 'leftOpen' | 'rightOpen';
4
- declare type RnghSwipeableProps = ComponentProps<typeof RnghSwipeable>;
3
+ type State = 'closed' | 'leftOpen' | 'rightOpen';
4
+ type RnghSwipeableProps = ComponentProps<typeof RnghSwipeable>;
5
5
  export interface SwipeableProps extends Pick<RnghSwipeableProps, 'enableTrackpadTwoFingerGesture' | 'friction' | 'leftThreshold' | 'rightThreshold' | 'overshootLeft' | 'overshootRight' | 'overshootFriction' | 'useNativeAnimations' | 'containerStyle' | 'childrenContainerStyle'> {
6
6
  /**
7
7
  * React node that is swipeable.
@@ -1,11 +1,11 @@
1
1
  import { ReactElement } from 'react';
2
2
  import { StyleProp, ViewStyle } from 'react-native';
3
3
  import type { IconName } from '../../Icon';
4
- declare type StatusBadgeType = {
4
+ type StatusBadgeType = {
5
5
  type: 'status';
6
6
  };
7
- export declare type BadgeConfigType = StatusBadgeType;
8
- export declare type OptionType<T> = {
7
+ export type BadgeConfigType = StatusBadgeType;
8
+ export type OptionType<T> = {
9
9
  value: T;
10
10
  text: string;
11
11
  icon: IconName;
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { Animated, View } from 'react-native';
3
- export declare type Variant = 'checked' | 'unchecked' | 'disabled-checked' | 'disabled-unchecked';
3
+ export type Variant = 'checked' | 'unchecked' | 'disabled-checked' | 'disabled-unchecked';
4
4
  declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
5
5
  theme?: import("@emotion/react").Theme | undefined;
6
6
  as?: import("react").ElementType<any> | undefined;
@@ -1,13 +1,13 @@
1
1
  import { ReactNode } from 'react';
2
- export declare type StatusBadgeType = {
2
+ export type StatusBadgeType = {
3
3
  type: 'status';
4
4
  };
5
- export declare type CounterBadgeType = {
5
+ export type CounterBadgeType = {
6
6
  type: 'counter';
7
7
  value: number;
8
8
  max?: number;
9
9
  };
10
- export declare type BadgeConfigType = StatusBadgeType | CounterBadgeType;
10
+ export type BadgeConfigType = StatusBadgeType | CounterBadgeType;
11
11
  interface TabWithBadgeProps {
12
12
  config?: BadgeConfigType;
13
13
  tabItem: ReactNode;
@@ -2,10 +2,10 @@ import type { ReactNode } from 'react';
2
2
  import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
3
3
  import { IconName } from '../Icon';
4
4
  import type { BadgeConfigType } from './TabWithBadge';
5
- export declare type ItemType = string | IconName | ((props: {
5
+ export type ItemType = string | IconName | ((props: {
6
6
  color: string;
7
7
  }) => ReactNode);
8
- export declare type TabType = {
8
+ export type TabType = {
9
9
  key: string;
10
10
  activeItem: ItemType;
11
11
  inactiveItem?: ItemType;
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { View } from 'react-native';
3
- declare type ThemeIntent = 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'archived';
4
- declare type ThemeVariant = 'filled' | 'outlined';
3
+ type ThemeIntent = 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'archived';
4
+ type ThemeVariant = 'filled' | 'outlined';
5
5
  declare const StyledView: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
6
6
  theme?: import("@emotion/react").Theme | undefined;
7
7
  as?: import("react").ElementType<any> | undefined;
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { TextInput, View } from 'react-native';
3
- export declare type State = 'default' | 'filled' | 'disabled' | 'readonly' | 'error';
4
- declare type Variant = 'text' | 'textarea';
3
+ export type State = 'default' | 'filled' | 'disabled' | 'readonly' | 'error';
4
+ type Variant = 'text' | 'textarea';
5
5
  declare const StyledContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
6
6
  theme?: import("@emotion/react").Theme | undefined;
7
7
  as?: import("react").ElementType<any> | undefined;
@@ -3,7 +3,7 @@ import { TextInput as RNTextInput } from 'react-native';
3
3
  import type { TextInputProps as NativeTextInputProps, StyleProp, ViewStyle, TextStyle } from 'react-native';
4
4
  import type { State } from './StyledTextInput';
5
5
  import type { IconName } from '../Icon';
6
- export declare type TextInputHandles = Pick<RNTextInput, 'focus' | 'clear' | 'blur' | 'isFocused' | 'setNativeProps'>;
6
+ export type TextInputHandles = Pick<RNTextInput, 'focus' | 'clear' | 'blur' | 'isFocused' | 'setNativeProps'>;
7
7
  export interface TextInputProps extends NativeTextInputProps {
8
8
  /**
9
9
  * Field label.
@@ -1,12 +1,12 @@
1
1
  /// <reference types="react" />
2
2
  import type { ToastContainerProps, ToastProps } from './types';
3
- export declare type ToastControllerContextType = {
3
+ export type ToastControllerContextType = {
4
4
  show: (props: Omit<ToastProps, 'position'>) => string;
5
5
  hide: (id: string) => void;
6
6
  clearAll: () => void;
7
7
  };
8
8
  export declare const ToastContext: import("react").Context<ToastControllerContextType>;
9
- export declare type ToastConfigContextType = Pick<ToastContainerProps, 'position' | 'displayType'>;
9
+ export type ToastConfigContextType = Pick<ToastContainerProps, 'position' | 'displayType'>;
10
10
  export declare const ToastConfigContext: import("react").Context<ToastConfigContextType>;
11
11
  export declare const useToastConfig: () => ToastConfigContextType;
12
12
  export declare const useToast: () => ToastControllerContextType;
@@ -1,6 +1,6 @@
1
1
  import type { ReactNode } from 'react';
2
2
  import type { ToastContainerProps } from './types';
3
- declare type ToastProviderProps = {
3
+ type ToastProviderProps = {
4
4
  /**
5
5
  * Content to be wrapped.
6
6
  */
@@ -1,7 +1,7 @@
1
1
  import type { ReactElement } from 'react';
2
2
  import type { StyleProp, ViewStyle } from 'react-native';
3
3
  import type { IconName } from '../Icon';
4
- export declare type IntentType = 'success' | 'info' | 'warning' | 'error' | 'notification' | 'snackbar';
4
+ export type IntentType = 'success' | 'info' | 'warning' | 'error' | 'notification' | 'snackbar';
5
5
  export interface ToastProps {
6
6
  /**
7
7
  * Toast content.
@@ -66,7 +66,7 @@ export interface ToastContainerProps {
66
66
  */
67
67
  style?: StyleProp<ViewStyle>;
68
68
  }
69
- export declare type ToastItemProps = {
69
+ export type ToastItemProps = {
70
70
  id: string;
71
71
  props: Omit<ToastProps, 'position'>;
72
72
  };
@@ -0,0 +1,13 @@
1
+ /// <reference types="react" />
2
+ import { Text } from 'react-native';
3
+ import { ThemeIntent } from '../types';
4
+ declare const StyledCaption: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
5
+ theme?: import("@emotion/react").Theme | undefined;
6
+ as?: import("react").ElementType<any> | undefined;
7
+ } & {
8
+ themeFontWeight: 'regular' | 'semi-bold';
9
+ themeIntent: ThemeIntent;
10
+ }, {}, {
11
+ ref?: import("react").Ref<Text> | undefined;
12
+ }>;
13
+ export { StyledCaption };
@@ -0,0 +1,26 @@
1
+ import type { ReactNode } from 'react';
2
+ import type { TextProps as NativeTextProps, StyleProp, TextStyle } from 'react-native';
3
+ export interface CaptionProps extends NativeTextProps {
4
+ /**
5
+ * Text content.
6
+ */
7
+ children: ReactNode;
8
+ /**
9
+ * Font weight of the text.
10
+ */
11
+ fontWeight?: 'regular' | 'semi-bold';
12
+ /**
13
+ * Visual intent color to apply to the text.
14
+ */
15
+ intent?: 'body' | 'subdued' | 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'inverted' | 'archived' | 'disabled';
16
+ /**
17
+ * Additional style.
18
+ */
19
+ style?: StyleProp<TextStyle>;
20
+ /**
21
+ * Testing id of the component.
22
+ */
23
+ testID?: string;
24
+ }
25
+ declare const Caption: ({ children, fontWeight, intent, allowFontScaling, ...nativeProps }: CaptionProps) => JSX.Element;
26
+ export default Caption;
@@ -1,6 +1,8 @@
1
1
  import Text from './Text';
2
+ import Caption from './Caption';
2
3
  interface TypographyProps {
3
4
  Text: typeof Text;
5
+ Caption: typeof Caption;
4
6
  }
5
7
  declare const Typography: TypographyProps;
6
8
  export default Typography;
@@ -0,0 +1,6 @@
1
+ export declare const FONTWEIGHT_MAP: {
2
+ readonly light: "light";
3
+ readonly regular: "regular";
4
+ readonly 'semi-bold': "semiBold";
5
+ };
6
+ export type ThemeIntent = 'body' | 'subdued' | 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'inverted' | 'archived' | 'disabled';
@@ -1,5 +1,5 @@
1
1
  import React, { PropsWithChildren } from 'react';
2
- declare type ThemeName = 'swag' | 'swagDark' | 'work' | 'jobs' | 'wallet' | 'eBens';
2
+ type ThemeName = 'swag' | 'swagDark' | 'work' | 'jobs' | 'wallet' | 'eBens';
3
3
  declare const ThemeSwitcher: ({ name, children, }: {
4
4
  name?: ThemeName | undefined;
5
5
  children: React.ReactNode;
@@ -25,6 +25,7 @@ declare const getTypographyTheme: (theme: GlobalTheme) => {
25
25
  xxxxxlarge: number;
26
26
  '6xlarge': number;
27
27
  '7xlarge': number;
28
+ caption: number;
28
29
  };
29
30
  lineHeights: {
30
31
  xsmall: number;
@@ -37,6 +38,7 @@ declare const getTypographyTheme: (theme: GlobalTheme) => {
37
38
  xxxxxlarge: number;
38
39
  '6xlarge': number;
39
40
  '7xlarge': number;
41
+ caption: number;
40
42
  };
41
43
  };
42
44
  export default getTypographyTheme;
@@ -44,7 +44,7 @@ import getToastTheme from './components/toast';
44
44
  import getToolbarTheme from './components/toolbar';
45
45
  import getTypographyTheme from './components/typography';
46
46
  import type { GlobalTheme, Scale, SystemPalette } from './global';
47
- declare type Theme = GlobalTheme & {
47
+ type Theme = GlobalTheme & {
48
48
  __hd__: {
49
49
  accordion: ReturnType<typeof getAccordionTheme>;
50
50
  alert: ReturnType<typeof getAlertTheme>;
@@ -1,4 +1,4 @@
1
- export declare type GlobalSystemPalette = {
1
+ export type GlobalSystemPalette = {
2
2
  defaultGlobalSurface: string;
3
3
  onDefaultGlobalSurface: string;
4
4
  neutralGlobalSurface: string;
@@ -33,7 +33,7 @@ export declare type GlobalSystemPalette = {
33
33
  archivedSurface: string;
34
34
  onArchivedSurface: string;
35
35
  };
36
- export declare type BrandSystemPalette = {
36
+ export type BrandSystemPalette = {
37
37
  primary: string;
38
38
  onPrimary: string;
39
39
  secondary: string;
@@ -44,4 +44,4 @@ export declare type BrandSystemPalette = {
44
44
  decorativePrimary: string;
45
45
  decorativePrimarySurface: string;
46
46
  };
47
- export declare type SystemPalette = GlobalSystemPalette & BrandSystemPalette;
47
+ export type SystemPalette = GlobalSystemPalette & BrandSystemPalette;
@@ -60,6 +60,6 @@ declare const getGlobalTheme: (scale: Scale, systemPalette: SystemPalette) => {
60
60
  sizes: import("./sizes").Sizes;
61
61
  radii: import("./borders").Radii;
62
62
  };
63
- declare type GlobalTheme = ReturnType<typeof getGlobalTheme>;
63
+ type GlobalTheme = ReturnType<typeof getGlobalTheme>;
64
64
  export type { GlobalTheme, Scale, SystemPalette };
65
65
  export { getGlobalTheme, defaultScale, swagSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, };
@@ -9,6 +9,6 @@ declare const scale: {
9
9
  fontSize: number;
10
10
  radius: number;
11
11
  };
12
- declare type Scale = typeof scale;
12
+ type Scale = typeof scale;
13
13
  export { scale };
14
14
  export type { Scale };
@@ -20,7 +20,7 @@ interface FontSizes {
20
20
  small: number;
21
21
  xsmall: number;
22
22
  }
23
- declare type LineHeights = FontSizes;
23
+ type LineHeights = FontSizes;
24
24
  declare const getFonts: ({ neutral, playful, }: {
25
25
  neutral: string;
26
26
  playful: string;
@@ -1,4 +1,4 @@
1
1
  export declare const isIOS: boolean;
2
2
  export declare const isAndroid: boolean;
3
- export declare function pick<O, T extends keyof O>(keys: T[], obj: O): Pick<O, T>;
3
+ export declare function pick<O extends object, T extends keyof O>(keys: T[], obj: O): Pick<O, T>;
4
4
  export declare function omit<O, T extends keyof O>(keys: T[], obj: O): Omit<O, T>;