@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.
- package/.turbo/turbo-build.log +1 -1
- package/es/index.js +46 -7
- package/lib/index.js +46 -7
- package/package.json +5 -5
- package/src/components/Typography/Caption/StyledCaption.tsx +19 -0
- package/src/components/Typography/Caption/__tests__/StyledCaption.spec.tsx +39 -0
- package/src/components/Typography/Caption/__tests__/__snapshots__/StyledCaption.spec.tsx.snap +211 -0
- package/src/components/Typography/Caption/__tests__/__snapshots__/index.spec.tsx.snap +287 -0
- package/src/components/Typography/Caption/__tests__/index.spec.tsx +46 -0
- package/src/components/Typography/Caption/index.tsx +61 -0
- package/src/components/Typography/index.tsx +3 -0
- package/src/components/Typography/types.ts +18 -0
- package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +2 -0
- package/src/theme/components/typography.ts +2 -0
- package/src/utils/helpers.ts +4 -1
- package/types/components/Accordion/AccordionItem.d.ts +1 -1
- package/types/components/Accordion/StyledAccordion.d.ts +1 -1
- package/types/components/Avatar/StyledAvatar.d.ts +2 -2
- package/types/components/Badge/StyledBadge.d.ts +2 -2
- package/types/components/BottomNavigation/index.d.ts +1 -1
- package/types/components/BottomSheet/BottomSheetContext.d.ts +1 -1
- package/types/components/Box/config.d.ts +2 -2
- package/types/components/Box/types.d.ts +3 -3
- package/types/components/Button/LoadingIndicator/StyledLoadingIndicator.d.ts +1 -1
- package/types/components/Button/LoadingIndicator/index.d.ts +1 -1
- package/types/components/Button/StyledButton.d.ts +2 -2
- package/types/components/Carousel/CardCarousel.d.ts +1 -1
- package/types/components/Carousel/types.d.ts +2 -2
- package/types/components/Divider/StyledDivider.d.ts +1 -1
- package/types/components/Drawer/DragableDrawer/helpers.d.ts +1 -1
- package/types/components/Empty/StyledEmpty.d.ts +1 -1
- package/types/components/Error/StyledError.d.ts +1 -1
- package/types/components/FAB/AnimatedFABIcon.d.ts +1 -1
- package/types/components/Icon/AnimatedIcon.d.ts +1 -1
- package/types/components/Icon/HeroIcon/index.d.ts +2 -2
- package/types/components/Icon/index.d.ts +1 -1
- package/types/components/List/StyledListItem.d.ts +2 -2
- package/types/components/PinInput/StyledPinInput.d.ts +1 -1
- package/types/components/Progress/types.d.ts +1 -1
- package/types/components/Radio/types.d.ts +1 -1
- package/types/components/RefreshControl/index.d.ts +1 -1
- package/types/components/RichTextEditor/RichTextEditor.d.ts +1 -1
- package/types/components/RichTextEditor/types.d.ts +1 -1
- package/types/components/Select/BaseOptionList.d.ts +1 -1
- package/types/components/Select/MultiSelect/OptionList.d.ts +1 -1
- package/types/components/Select/SingleSelect/OptionList.d.ts +1 -1
- package/types/components/Select/helpers.d.ts +1 -1
- package/types/components/Select/types.d.ts +6 -6
- package/types/components/Skeleton/StyledSkeleton.d.ts +2 -2
- package/types/components/Success/StyledSuccess.d.ts +1 -1
- package/types/components/Swipeable/StyledSwipeable.d.ts +1 -1
- package/types/components/Swipeable/index.d.ts +2 -2
- package/types/components/Switch/SelectorSwitch/index.d.ts +3 -3
- package/types/components/Switch/StyledSwitch.d.ts +1 -1
- package/types/components/Tabs/TabWithBadge.d.ts +3 -3
- package/types/components/Tabs/index.d.ts +2 -2
- package/types/components/Tag/StyledTag.d.ts +2 -2
- package/types/components/TextInput/StyledTextInput.d.ts +2 -2
- package/types/components/TextInput/index.d.ts +1 -1
- package/types/components/Toast/ToastContext.d.ts +2 -2
- package/types/components/Toast/ToastProvider.d.ts +1 -1
- package/types/components/Toast/types.d.ts +2 -2
- package/types/components/Typography/Caption/StyledCaption.d.ts +13 -0
- package/types/components/Typography/Caption/index.d.ts +26 -0
- package/types/components/Typography/index.d.ts +2 -0
- package/types/components/Typography/types.d.ts +6 -0
- package/types/theme/ThemeSwitcher.d.ts +1 -1
- package/types/theme/components/typography.d.ts +2 -0
- package/types/theme/getTheme.d.ts +1 -1
- package/types/theme/global/colors/types.d.ts +3 -3
- package/types/theme/global/index.d.ts +1 -1
- package/types/theme/global/scale.d.ts +1 -1
- package/types/theme/global/typography.d.ts +1 -1
- package/types/utils/helpers.d.ts +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
3
|
-
|
|
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
|
|
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
|
|
4
|
-
export
|
|
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
|
|
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
|
|
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
1
|
import { RefreshControlProps as NativeRefreshControlProps } from 'react-native';
|
|
2
|
-
export
|
|
2
|
+
export type RefreshControlProps = Omit<NativeRefreshControlProps, 'colors' | 'tintColor'>;
|
|
3
3
|
declare const RefreshControl: ({ ...props }: RefreshControlProps) => JSX.Element;
|
|
4
4
|
export default RefreshControl;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export
|
|
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
|
|
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
|
-
|
|
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
|
-
|
|
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
|
|
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
|
|
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
|
|
11
|
+
export type SectionType = {
|
|
12
12
|
category: string;
|
|
13
13
|
};
|
|
14
|
-
export
|
|
15
|
-
export
|
|
16
|
-
export
|
|
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
|
|
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
|
-
|
|
3
|
-
|
|
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
|
-
|
|
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
|
|
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
|
-
|
|
4
|
-
|
|
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
|
-
|
|
4
|
+
type StatusBadgeType = {
|
|
5
5
|
type: 'status';
|
|
6
6
|
};
|
|
7
|
-
export
|
|
8
|
-
export
|
|
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
|
|
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
|
|
2
|
+
export type StatusBadgeType = {
|
|
3
3
|
type: 'status';
|
|
4
4
|
};
|
|
5
|
-
export
|
|
5
|
+
export type CounterBadgeType = {
|
|
6
6
|
type: 'counter';
|
|
7
7
|
value: number;
|
|
8
8
|
max?: number;
|
|
9
9
|
};
|
|
10
|
-
export
|
|
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
|
|
5
|
+
export type ItemType = string | IconName | ((props: {
|
|
6
6
|
color: string;
|
|
7
7
|
}) => ReactNode);
|
|
8
|
-
export
|
|
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
|
-
|
|
4
|
-
|
|
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
|
|
4
|
-
|
|
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
|
|
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
|
|
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
|
|
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,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
|
|
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
|
|
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;
|
|
@@ -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
|
-
|
|
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
|
-
|
|
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
|
|
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
|
|
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
|
|
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
|
-
|
|
63
|
+
type GlobalTheme = ReturnType<typeof getGlobalTheme>;
|
|
64
64
|
export type { GlobalTheme, Scale, SystemPalette };
|
|
65
65
|
export { getGlobalTheme, defaultScale, swagSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, };
|
package/types/utils/helpers.d.ts
CHANGED
|
@@ -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>;
|