@hero-design/rn 7.14.3-alpha.2 → 7.14.3-alpha.4

package/types/components/RichTextEditor/RichTextEditor.d.ts

@@ -0,0 +1,65 @@
+import React, { Ref } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export interface RichTextEditorRef {
+    requestBlur: VoidFunction;
+}
+export declare type EditorValue = {
+    type: string;
+    children: any;
+}[];
+export interface RichTextEditorProps {
+    /**
+     * Error message
+     */
+    error?: string;
+    /**
+     * Field value
+     */
+    value?: EditorValue;
+    /**
+     * Unique name used to communicate with webview
+     */
+    name: string;
+    /**
+     * Callback function called when the field value changed
+     */
+    onChange: (data: EditorValue) => void;
+    /**
+     * Callback function called when the cursor position changed
+     */
+    onCursorChange?: (params: {
+        position: {
+            top: number;
+        };
+    }) => void;
+    /**
+     * Field placeholder
+     */
+    placeholder?: string;
+    /**
+     * Additional styles
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Field label
+     */
+    label: string;
+    /**
+     * Field helper text
+     */
+    helpText?: string;
+    /**
+     *  Whether the input is required, if true, an asterisk will be appended to the label.
+     * */
+    required?: boolean;
+    /**
+     * Testing ID of the component
+     */
+    testID?: string;
+    /**
+     * Imperative ref to expose the component method
+     */
+    forwardedRef?: Ref<RichTextEditorRef>;
+}
+declare const _default: React.ForwardRefExoticComponent<Omit<RichTextEditorProps, "forwardedRef"> & React.RefAttributes<RichTextEditorRef>>;
+export default _default;

package/types/components/RichTextEditor/StyledRichTextEditor.d.ts

@@ -0,0 +1,16 @@
+import { View } from 'react-native';
+import { WebView } from 'react-native-webview';
+export declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export declare const StyledWebView: import("@emotion/native").StyledComponent<import("react-native-webview/lib/WebViewTypes").IOSWebViewProps & import("react-native-webview/lib/WebViewTypes").AndroidWebViewProps & import("react-native-webview/lib/WebViewTypes").WindowsWebViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    height: number | undefined;
+}, {}, {
+    ref?: import("react").Ref<WebView<unknown>> | undefined;
+}>;

package/types/components/RichTextEditor/StyledToolbar.d.ts

@@ -0,0 +1,21 @@
+import { TouchableOpacity, View } from 'react-native';
+export declare const StyledToolbarButton: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    selected: boolean;
+}, {}, {
+    ref?: import("react").Ref<TouchableOpacity> | undefined;
+}>;
+export declare const StyledToolbar: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export declare const StyledSeparator: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;

package/types/components/RichTextEditor/__tests__/EditorToolbar.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/RichTextEditor/__tests__/MentionList.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/RichTextEditor/__tests__/RichTextEditor.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/RichTextEditor/constants.d.ts

@@ -0,0 +1,19 @@
+export declare enum ToolbarEvents {
+    Bold = "bold",
+    Italic = "italic",
+    Underline = "underline",
+    BulletedList = "bulleted-list",
+    NumberedList = "numbered-list",
+    HeadingOne = "heading-one",
+    HeadingTwo = "heading-two"
+}
+export declare enum ToolbarButtonName {
+    Bold = "bold",
+    Italic = "italic",
+    Underline = "underline",
+    BulletedList = "bulletedList",
+    NumberedList = "numberedList",
+    HeadingOne = "headingOne",
+    HeadingTwo = "headingTwo",
+    Seperator = "|"
+}

package/types/components/RichTextEditor/index.d.ts

@@ -0,0 +1,5 @@
+declare const _default: import("react").ForwardRefExoticComponent<Omit<import("./RichTextEditor").RichTextEditorProps, "forwardedRef"> & import("react").RefAttributes<import("./RichTextEditor").RichTextEditorRef>> & {
+    MentionList: ({ name: eventPrefix, render }: import("./MentionList").MentionListProps) => JSX.Element | null;
+    Toolbar: ({ name, buttons, testID, }: import("./EditorToolbar").EditorToolbarProps) => JSX.Element | null;
+};
+export default _default;

package/types/components/RichTextEditor/utils/events.d.ts

@@ -0,0 +1,8 @@
+import { EventEmitter } from 'events';
+export interface Listener<T> {
+    (data: T): void;
+}
+export declare const off: <T>(emitter: EventEmitter, eventName: string, listener: Listener<T>) => void;
+export declare const emit: <T>(emitter: EventEmitter, eventName: string, data: T) => boolean;
+export declare const setMaxListeners: (emitter: EventEmitter, n: number) => void;
+export declare const on: <T>(emitter: EventEmitter, eventName: string, listener: Listener<T>) => () => void;

package/types/components/RichTextEditor/utils/rnWebView.d.ts

@@ -0,0 +1,7 @@
+import WebView from 'react-native-webview';
+export declare const requestBlurEditor: (element: WebView) => void;
+export interface WebViewEventMessage {
+    type: string;
+    data: any;
+}
+export declare const postMessage: (element: WebView, message: WebViewEventMessage) => void;

package/types/components/SectionHeading/index.d.ts

@@ -1,6 +1,6 @@
 import { ReactElement } from 'react';
 import { StyleProp, ViewProps, ViewStyle } from 'react-native';
-import { IconName } from '../Icon';
+import { IconName, IconProps } from '../Icon';
 export interface SectionHeadingProps extends ViewProps {
     /**
      * Heading text.
@@ -9,7 +9,7 @@ export interface SectionHeadingProps extends ViewProps {
     /**
      * Name of the Icon.
      */
-    icon?: IconName;
+    icon?: IconName | ReactElement<IconProps>;
     /**
      * Right corner content
      */

package/types/components/Select/MultiSelect/OptionList.d.ts

@@ -5,5 +5,5 @@ interface OptionListProps<T> extends MultiSelectProps<T> {
      */
     onPress: (value: T[]) => void;
 }
-declare const OptionList: <T>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, options, value, }: Pick<OptionListProps<T>, "value" | "onPress" | "loading" | "options" | "keyExtractor" | "onEndReached" | "onQueryChange">) => JSX.Element;
+declare const OptionList: <T>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, options, value, }: Pick<OptionListProps<T>, "value" | "onPress" | "loading" | "options" | "keyExtractor" | "onQueryChange" | "onEndReached">) => JSX.Element;
 export default OptionList;

package/types/components/Select/MultiSelect/index.d.ts

@@ -13,5 +13,5 @@ export interface MultiSelectProps<T> extends SelectProps<T> {
      */
     footerLabel: string;
 }
-declare function MultiSelect<T>({ footerLabel, label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, style, testID, value, }: MultiSelectProps<T>): JSX.Element;
+declare function MultiSelect<T>({ footerLabel, label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, error, editable, disabled, numberOfLines, style, testID, value, }: MultiSelectProps<T>): JSX.Element;
 export default MultiSelect;

package/types/components/Select/SingleSelect/OptionList.d.ts

@@ -5,5 +5,5 @@ interface OptionListProps<T> extends SingleSelectProps<T> {
      */
     onPress: (value: T | null) => void;
 }
-declare const OptionList: <T>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, options, value, }: Pick<OptionListProps<T>, "value" | "onPress" | "loading" | "options" | "keyExtractor" | "onEndReached" | "onQueryChange">) => JSX.Element;
+declare const OptionList: <T>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, options, value, }: Pick<OptionListProps<T>, "value" | "onPress" | "loading" | "options" | "keyExtractor" | "onQueryChange" | "onEndReached">) => JSX.Element;
 export default OptionList;

package/types/components/Select/SingleSelect/index.d.ts

@@ -9,5 +9,5 @@ export interface SingleSelectProps<T> extends SelectProps<T> {
      */
     onConfirm: (value: T | null) => void;
 }
-declare const SingleSelect: <T>({ label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, style, testID, value, }: SingleSelectProps<T>) => JSX.Element;
+declare const SingleSelect: <T>({ label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, error, editable, disabled, numberOfLines, style, testID, value, }: SingleSelectProps<T>) => JSX.Element;
 export default SingleSelect;

package/types/components/Select/StyledOptionList.d.ts

@@ -13,5 +13,5 @@ export interface OptionListProps<T> extends SelectProps<T> {
      */
     scrollIndex?: number;
 }
-declare const StyledOptionList: <T>({ keyExtractor, loading, onEndReached, onQueryChange, options, RenderItem, scrollIndex, }: Pick<OptionListProps<T>, "loading" | "options" | "keyExtractor" | "scrollIndex" | "onEndReached" | "RenderItem" | "onQueryChange">) => JSX.Element;
+declare const StyledOptionList: <T>({ keyExtractor, loading, onEndReached, onQueryChange, options, RenderItem, scrollIndex, }: Pick<OptionListProps<T>, "loading" | "options" | "keyExtractor" | "onQueryChange" | "onEndReached" | "scrollIndex" | "RenderItem">) => JSX.Element;
 export default StyledOptionList;

package/types/components/Select/index.d.ts

@@ -1,5 +1,7 @@
-import MultiSelect from './MultiSelect';
-declare const _default: (<T>({ label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, style, testID, value, }: import("./SingleSelect").SingleSelectProps<T>) => JSX.Element) & {
+import MultiSelect, { MultiSelectProps } from './MultiSelect';
+import { SingleSelectProps } from './SingleSelect';
+declare const _default: (<T>({ label, loading, onConfirm, onDimiss, onEndReached, onQueryChange, options, query, error, editable, disabled, numberOfLines, style, testID, value, }: SingleSelectProps<T>) => JSX.Element) & {
     Multi: typeof MultiSelect;
 };
 export default _default;
+export { MultiSelectProps, SingleSelectProps };

package/types/components/Select/types.d.ts

@@ -1,10 +1,11 @@
 import { StyleProp, ViewStyle } from 'react-native';
+import { TextInputProps } from '../TextInput';
 export declare type OptionType<T> = {
     value: T;
     text: string;
     key?: string;
 };
-export interface SelectProps<T> {
+export interface SelectProps<T> extends Pick<TextInputProps, 'editable' | 'disabled' | 'numberOfLines' | 'error'> {
     /**
      * An array of options to be selected.
      */
@@ -23,7 +24,7 @@ export interface SelectProps<T> {
      */
     onQueryChange?: (value: string) => void;
     /**
-     * Event handler when selection dimiss
+     * Event handler when selection dismiss
      */
     onDimiss?: () => void;
     /**

package/types/components/Switch/StyledSwitch.d.ts

@@ -0,0 +1,36 @@
+import { Animated, View } from 'react-native';
+declare type ThemeSize = 'small' | 'medium';
+declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeChecked: boolean | undefined;
+    themeSize: ThemeSize;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledDisabledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeSize: ThemeSize;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledThumbWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeSize: ThemeSize;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledKnot: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeSize: ThemeSize;
+}, {}, {}>;
+export { StyledWrapper, StyledDisabledWrapper, StyledThumbWrapper, StyledKnot };

package/types/components/Tabs/StyledScrollableTabs.d.ts

@@ -0,0 +1,60 @@
+import { Animated, View } from 'react-native';
+import PagerView from 'react-native-pager-view';
+declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const ContentWrapper: import("@emotion/native").StyledComponent<import("react-native-pager-view").PagerViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<PagerView> | undefined;
+}>;
+declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeInsets: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const HeaderTabItem: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {}>;
+declare const HeaderTabItemOutlineWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const HeaderTabItemOutline: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeActive: boolean;
+}, {}, {}>;
+declare const HeaderTabItemWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { HeaderTabItem, TabScreen, TabContainer, HeaderTabWrapper, ContentWrapper, HeaderTabItemOutlineWrapper, HeaderTabItemOutline, HeaderTabItemWrapper, };

package/types/components/Tabs/StyledTabs.d.ts

@@ -0,0 +1,54 @@
+import { Animated, View } from 'react-native';
+import PagerView from 'react-native-pager-view';
+declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeInsets: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const HeaderTab: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const HeaderTabItem: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const ContentWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native-pager-view").PagerViewProps & import("react").RefAttributes<PagerView>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {}>;
+declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledIndicator: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeWidth: number;
+}, {}, {}>;
+export { TabContainer, HeaderTabWrapper, HeaderTab, HeaderTabItem, ContentWrapper, TabScreen, StyledIndicator, };

package/types/components/TimePicker/TimePickerAndroid.d.ts

@@ -1,3 +1,3 @@
 import { TimePickerProps } from './types';
-declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, style, testID, }: TimePickerProps) => JSX.Element;
+declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, }: TimePickerProps) => JSX.Element;
 export default TimePickerAndroid;

package/types/components/TimePicker/TimePickerIOS.d.ts

@@ -1,3 +1,3 @@
 import { TimePickerProps } from './types';
-declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, style, testID, }: TimePickerProps) => JSX.Element;
+declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, }: TimePickerProps) => JSX.Element;
 export default TimePickerIOS;

package/types/components/TimePicker/types.d.ts

@@ -38,6 +38,10 @@ export interface TimePickerProps {
      *  Whether the value is required, if true, an asterisk will be appended to the label.
      */
     required?: boolean;
+    /**
+     * The helper text to display.
+     */
+    helpText?: string;
     /**
      * Addtional style.
      */

package/types/components/Toast/StyledToast.d.ts

@@ -0,0 +1,45 @@
+import { Animated, TouchableOpacity, View, ViewProps } from 'react-native';
+declare const ToastContainerWrapper: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    position: 'top' | 'bottom';
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const Container: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    themeVariant: 'default' | 'round';
+    themeIntent: 'success' | 'info' | 'warning' | 'error';
+}, {}, {}>;
+declare const IconContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const TextContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const ContentContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    showDivider: boolean;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const CTAWrapper: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<TouchableOpacity> | undefined;
+}>;
+export { ToastContainerWrapper, Container, ContentContainer, TextContainer, IconContainer, CTAWrapper, };

package/types/components/Typography/Text/StyledText.d.ts

@@ -5,7 +5,7 @@ declare const StyledText: import("@emotion/native").StyledComponent<import("reac
 } & {
     themeFontSize: 'small' | 'medium' | 'large' | 'xlarge' | 'xxxxxlarge';
     themeFontWeight: 'light' | 'regular' | 'semi-bold';
-    themeIntent: 'body' | 'subdued' | 'primary' | 'success' | 'info' | 'warning' | 'danger';
+    themeIntent: 'body' | 'subdued' | 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'inverted';
 }, {}, {
     ref?: import("react").Ref<Text> | undefined;
 }>;

package/types/components/Typography/Text/index.d.ts

@@ -16,7 +16,7 @@ export interface TextProps extends NativeTextProps {
     /**
      * Visual intent color to apply to the text.
      */
-    intent?: 'body' | 'subdued' | 'primary' | 'success' | 'info' | 'warning' | 'danger';
+    intent?: 'body' | 'subdued' | 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'inverted';
     /**
      * Additional style.
      */

package/types/index.d.ts

@@ -7,6 +7,7 @@ import Badge from './components/Badge';
 import BottomNavigation from './components/BottomNavigation';
 import BottomSheet from './components/BottomSheet';
 import Button from './components/Button';
+import Calendar from './components/Calendar';
 import Card from './components/Card';
 import Collapse from './components/Collapse';
 import Checkbox from './components/Checkbox';
@@ -14,6 +15,7 @@ import ContentNavigator from './components/ContentNavigator';
 import DatePicker from './components/DatePicker';
 import Divider from './components/Divider';
 import Drawer from './components/Drawer';
+import Empty from './components/Empty';
 import FAB from './components/FAB';
 import Icon from './components/Icon';
 import List from './components/List';
@@ -31,5 +33,6 @@ import TimePicker from './components/TimePicker';
 import Toast from './components/Toast';
 import Toolbar from './components/Toolbar';
 import Typography from './components/Typography';
-export { theme, getTheme, useTheme, scale, ThemeProvider, Accordion, Alert, Avatar, Badge, BottomNavigation, BottomSheet, Button, Card, Collapse, Checkbox, ContentNavigator, DatePicker, Divider, Drawer, FAB, Icon, List, PinInput, Progress, Spinner, Radio, SectionHeading, Select, Switch, Tabs, Tag, TextInput, TimePicker, Toast, Toolbar, Typography, };
+import RichTextEditor from './components/RichTextEditor';
+export { theme, getTheme, useTheme, scale, ThemeProvider, Accordion, Alert, Avatar, Badge, BottomNavigation, BottomSheet, Button, Calendar, Card, Collapse, Checkbox, ContentNavigator, DatePicker, Divider, Drawer, Empty, FAB, Icon, List, PinInput, Progress, Spinner, Radio, SectionHeading, Select, Switch, Tabs, Tag, TextInput, TimePicker, Toast, Toolbar, Typography, RichTextEditor, };
 export * from './types';

package/types/theme/components/calendar.d.ts

@@ -0,0 +1,26 @@
+import { GlobalTheme } from '../global';
+declare const getCalendarTheme: (theme: GlobalTheme) => {
+    radii: {
+        default: number;
+    };
+    colors: {
+        background: string;
+        border: string;
+        primary: string;
+        inverted: string;
+    };
+    sizes: {
+        cellWidth: number;
+        cellHeight: number;
+        cellCircleWidth: number;
+        cellCircleHeight: number;
+        markWidth: number;
+        markHeight: number;
+    };
+    space: {
+        rowVerticalPadding: number;
+        headerVerticalPadding: number;
+        headerHorizontalPadding: number;
+    };
+};
+export default getCalendarTheme;

package/types/theme/components/empty.d.ts

@@ -0,0 +1,28 @@
+import { GlobalTheme } from '../global';
+declare const getEmptyTheme: (theme: GlobalTheme) => {
+    fontSizes: {
+        title: number;
+        description: number;
+    };
+    colors: {
+        text: string;
+        invertedText: string;
+        subduedText: string;
+        illustrationBackground: string;
+    };
+    sizes: {
+        illustration: number;
+    };
+    space: {
+        medium: number;
+        large: number;
+    };
+    fonts: {
+        title: string;
+        description: string;
+    };
+    radii: {
+        illustration: number;
+    };
+};
+export default getEmptyTheme;

package/types/theme/components/richTextEditor.d.ts

@@ -0,0 +1,26 @@
+import { GlobalTheme } from '../global';
+declare const getRichTextEditorTheme: (theme: GlobalTheme) => {
+    colors: {
+        toolbarBorderColor: string;
+        toolbarBackgroundColor: string;
+        toolbarButtonSelectedBackground: string;
+    };
+    space: {
+        wrapperMarginBottom: number;
+        toolbarHorizontalPadding: number;
+        editorPadding: number;
+    };
+    borderWidths: {
+        webViewBorderBottomWidth: number;
+    };
+    fontSizes: {
+        editor: number;
+    };
+    sizes: {
+        editorMinHeight: number;
+        toolbarButtonSize: number;
+        toolbarSeparatorWidth: number;
+        toolbarSeparatorHeight: number;
+    };
+};
+export default getRichTextEditorTheme;

package/types/theme/components/typography.d.ts

@@ -8,6 +8,7 @@ declare const getTypographyTheme: (theme: GlobalTheme) => {
         danger: string;
         warning: string;
         success: string;
+        inverted: string;
     };
     fonts: {
         light: string;