@sendbird/uikit-react-native-foundation 1.0.0 → 1.1.0

package/src/ui/MenuBar/index.tsx

@@ -23,7 +23,7 @@ export type MenuBarProps = {
   actionLabel?: string;
   actionItem?: React.ReactNode;
 };
-const MenuBar: React.FC<MenuBarProps> = ({
+const MenuBar = ({
   variant = 'default',
   disabled,
   onPress,
@@ -33,7 +33,7 @@ const MenuBar: React.FC<MenuBarProps> = ({
   iconBackgroundColor,
   actionLabel,
   actionItem = null,
-}) => {
+}: MenuBarProps) => {
   const { palette, colors } = useUIKitTheme();
 
   return (

package/src/ui/Modal/index.tsx

@@ -34,7 +34,7 @@ type Props = {
  * Modal Close: Triggered by Modal.props.onClose() call
  * - Modal.props.onClose() -> visible false -> animation start -> modalVisible false
  * */
-const Modal: React.FC<Props> = ({
+const Modal = ({
   children,
   onClose,
   backgroundStyle,
@@ -45,7 +45,7 @@ const Modal: React.FC<Props> = ({
   enableKeyboardAvoid = false,
   statusBarTranslucent,
   ...props
-}) => {
+}: Props) => {
   const { palette } = useUIKitTheme();
   const { content, backdrop, showTransition, hideTransition } = useModalAnimation(type);
   const panResponder = useModalPanResponder(type, content.translateY, showTransition, onClose);

package/src/ui/Placeholder/index.tsx

@@ -19,7 +19,7 @@ type Props = {
   onPressRetry?: () => void;
 };
 
-const Placeholder: React.FC<Props> = ({ icon, loading = false, message = '', errorRetryLabel, onPressRetry }) => {
+const Placeholder = ({ icon, loading = false, message = '', errorRetryLabel, onPressRetry }: Props) => {
   const { colors } = useUIKitTheme();
 
   // loading ? styles.containerLoading : errorRetryLabel ? styles.containerError : styles.container

package/src/ui/Prompt/index.tsx

@@ -28,7 +28,7 @@ type Props = {
   onDismiss?: () => void;
   autoFocus?: boolean;
 } & PromptItem;
-const Prompt: React.FC<Props> = ({
+const Prompt = ({
   onDismiss,
   visible,
   onHide,
@@ -40,7 +40,7 @@ const Prompt: React.FC<Props> = ({
   onCancel = NOOP,
   submitLabel = 'Submit',
   cancelLabel = 'Cancel',
-}) => {
+}: Props) => {
   const { statusBarTranslucent } = useHeaderStyle();
   const { colors } = useUIKitTheme();
   const inputRef = useRef<RNTextInput>(null);

package/src/ui/Switch/index.tsx

@@ -4,7 +4,7 @@ import { Animated, Platform, Pressable } from 'react-native';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 
-interface SwitchProps {
+type SwitchProps = React.PropsWithChildren<{
   trackColor?: string;
   thumbColor?: string;
   inactiveThumbColor?: string;
@@ -12,15 +12,15 @@ interface SwitchProps {
 
   value: boolean;
   onChangeValue: (val: boolean) => void;
-}
-const Switch: React.FC<SwitchProps> = ({
+}>;
+const Switch = ({
   value,
   onChangeValue,
   inactiveThumbColor,
   inactiveTrackColor,
   trackColor,
   thumbColor,
-}) => {
+}: SwitchProps) => {
   const { select, palette, colors } = useUIKitTheme();
   const position = useRef(new Animated.Value(0)).current;
 

package/src/ui/Text/index.tsx

@@ -6,7 +6,7 @@ import type { TypoName, UIKitTheme } from '../../types';
 
 type TypographyProps = Partial<Record<TypoName, boolean>>;
 export type TextProps = RNTextProps & TypographyProps & { color?: ((colors: UIKitTheme['colors']) => string) | string };
-const Text: React.FC<TextProps> = ({ children, color, style, ...props }) => {
+const Text = ({ children, color, style, ...props }: TextProps) => {
   const { colors } = useUIKitTheme();
   const typoStyle = useTypographyFilter(props);
   return (

package/src/ui/Toast/index.tsx

@@ -12,13 +12,13 @@ type Context = { show(text: string, type?: ToastType): void };
 
 const ToastContext = createContext<Context | null>(null);
 
-type Props = {
+type Props = React.PropsWithChildren<{
   top?: number;
   bottom?: number;
   visible: boolean;
   type: ToastType;
   children: string;
-};
+}>;
 
 const useOpacity = () => {
   const opacity = useRef(new Animated.Value(0)).current;
@@ -32,7 +32,8 @@ const useOpacity = () => {
     hide: () => transition(0),
   };
 };
-const Toast: React.FC<Props> = ({ visible, type, children, top, bottom }) => {
+
+const Toast = ({ visible, type, children, top, bottom }: Props) => {
   const { colors, select, palette } = useUIKitTheme();
   const { opacity, show, hide } = useOpacity();
 
@@ -67,7 +68,10 @@ const Toast: React.FC<Props> = ({ visible, type, children, top, bottom }) => {
 };
 
 const VISIBLE_MS = 3000;
-export const ToastProvider: React.FC<{ dismissTimeout?: number }> = ({ children, dismissTimeout = VISIBLE_MS }) => {
+export const ToastProvider = ({
+  children,
+  dismissTimeout = VISIBLE_MS,
+}: React.PropsWithChildren<{ dismissTimeout?: number }>) => {
   const [state, setState] = useState({ visible: false, type: 'error' as ToastType, text: '' });
   const { bottom } = useSafeAreaInsets();
 

package/src/ui/URLParsedText/index.tsx

@@ -18,7 +18,7 @@ type Props = TextProps & {
   onPressUrl?: OnPressUrl;
   strict?: boolean;
 };
-const URLParsedText: React.FC<Props> = ({ children, onPressUrl = openUrl, strict, ...props }) => {
+const URLParsedText = ({ children, onPressUrl = openUrl, strict, ...props }: Props) => {
   const parsedChildren = useMemo((): React.ReactNode => {
     return React.Children.map(React.Children.toArray(children), (child) => {
       if (typeof child === 'string') {