react-native-acoustic-connect-beta 17.0.2 → 18.0.7

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/PinInput/PinInput.tsx

@@ -1,121 +0,0 @@
-import React from 'react';
-import { HStack } from '../../primitives/Stack';
-import { useThemeProps } from '../../../hooks';
-import type { IPinInputProps } from './types';
-import { useFormControlContext } from '../FormControl';
-import { Platform } from 'react-native';
-import { PinInputContext } from './Context';
-import { themeTools } from '../../../theme';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PinInput = ({ children, ...props }: IPinInputProps, ref?: any) => {
-  let [padding, remProps] = themeTools.extractInObject(props, [
-    'p',
-    'px',
-    'py',
-    'pt',
-    'pb',
-    'pl',
-    'pr',
-  ]);
-  const {
-    manageFocus,
-    defaultValue,
-    value,
-    space,
-    onChange,
-    ...newProps
-  } = useThemeProps('PinInput', remProps);
-  const formControlContext = useFormControlContext();
-
-  const RefList: Array<any> = [];
-  const setRefList = (ref: any, index: number) => {
-    RefList[index] = ref;
-  };
-  const [pinInputValue, setPinInputValue] = React.useState(
-    value || defaultValue
-  );
-
-  const handleChange = (newValue: string, fieldIndex: number) => {
-    let temp = (pinInputValue && [...pinInputValue]) || [];
-    temp[fieldIndex] = newValue;
-    value === undefined && setPinInputValue(temp.join(''));
-    onChange && onChange(temp.join(''));
-    if (newValue === '' && manageFocus && fieldIndex - 1 > -1)
-      RefList[fieldIndex - 1].current.focus();
-    else if (newValue && manageFocus && fieldIndex + 1 < RefList.length)
-      RefList[fieldIndex + 1].current.focus();
-    return temp.join('');
-  };
-  const handleMultiValueChange = (newValue: string, fieldIndex: number) => {
-    const pinFieldLength = RefList.length;
-    const newValueLength = newValue.length;
-    if (newValueLength >= pinFieldLength && newValueLength > 2) {
-      let splicedValue = newValue ? [...newValue] : [];
-      splicedValue.splice(pinFieldLength);
-      RefList[pinFieldLength - 1].current.focus();
-      setPinInputValue(splicedValue.join(''));
-      onChange && onChange(splicedValue.join(''));
-    }
-
-    if (Platform.OS !== 'ios') {
-      let temp = pinInputValue ? [...pinInputValue] : [];
-      if (newValue === '') {
-        // Handling Backward focus.
-        temp = temp.filter((_n, i) => i !== fieldIndex);
-        if (manageFocus && fieldIndex - 1 > -1)
-          RefList[fieldIndex - 1].current.focus();
-      } else {
-        temp[fieldIndex] = JSON.stringify(parseInt(newValue, 10) % 10);
-        if (manageFocus && fieldIndex + 1 < RefList.length)
-          RefList[fieldIndex + 1].current.focus();
-      }
-      value === undefined && setPinInputValue(temp.join(''));
-      onChange && onChange(temp.join(''));
-    }
-  };
-
-  const indexSetter = (allChildren: JSX.Element | JSX.Element[]) => {
-    let pinInputFiledCounter = -1;
-    return React.Children.map(allChildren, (child: JSX.Element) => {
-      pinInputFiledCounter++;
-      return React.cloneElement(
-        child,
-        {
-          fieldIndex: pinInputFiledCounter,
-        },
-        child.props.children
-      );
-    });
-  };
-
-  React.useEffect(() => {
-    if (value !== undefined && value != pinInputValue) setPinInputValue(value);
-  }, [value, pinInputValue, setPinInputValue]);
-
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-
-  return (
-    <PinInputContext.Provider
-      value={{
-        ...formControlContext,
-        ...newProps,
-        setRefList,
-        handleChange,
-        handleMultiValueChange,
-        value: pinInputValue,
-      }}
-    >
-      {children && (
-        <HStack flexDirection="row" space={space} {...padding} ref={ref}>
-          {indexSetter(children)}
-        </HStack>
-      )}
-    </PinInputContext.Provider>
-  );
-};
-
-export default React.memo(React.forwardRef(PinInput));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/PinInput/PinInputField.tsx

@@ -1,66 +0,0 @@
-import React from 'react';
-import { Input } from '../../primitives/Input';
-import type { IPinInputFieldProps, IPinInputContext } from './types';
-import { PinInputContext } from './Context';
-import { Platform } from 'react-native';
-import { mergeRefs } from '../../../utils';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PinInputFiled = (
-  {
-    fieldIndex = 0,
-    defaultValue: pDefaultValue,
-    ...props
-  }: IPinInputFieldProps,
-  ref?: any
-) => {
-  let {
-    handleChange,
-    value: cValue,
-    setRefList,
-    defaultValue: cDefaultValue,
-    handleMultiValueChange,
-    ...context
-  }: IPinInputContext = React.useContext(PinInputContext);
-  cDefaultValue = cDefaultValue && cDefaultValue[fieldIndex];
-  let defaultValue = pDefaultValue || cDefaultValue;
-  let value = cValue && cValue[fieldIndex];
-
-  const keyPressHandler = (event: any) => {
-    if (Platform.OS !== 'web') {
-      if (event.nativeEvent.key >= 0 && event.nativeEvent.key <= 9) {
-        handleChange && handleChange(event.nativeEvent.key, fieldIndex);
-      } else if (event.nativeEvent.key === 'Backspace') {
-        handleChange && handleChange('', fieldIndex);
-      }
-    }
-  };
-  const textChangeHandler = (value: any) => {
-    // Also used to handle change for Android.
-    handleMultiValueChange && handleMultiValueChange(value, fieldIndex);
-  };
-  const myRef = React.useRef(null);
-  React.useEffect(() => {
-    setRefList && setRefList(myRef, fieldIndex);
-  }, [myRef, fieldIndex, setRefList]);
-
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return (
-    <Input
-      //@ts-ignore
-      ref={mergeRefs([myRef, ref])}
-      {...context}
-      {...props}
-      onKeyPress={(event) => keyPressHandler(event)}
-      onChangeText={(value) => textChangeHandler(value)}
-      keyboardType="numeric"
-      defaultValue={defaultValue}
-      value={value}
-    />
-  );
-};
-
-export default React.memo(React.forwardRef(PinInputFiled));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/PinInput/index.tsx

@@ -1,15 +0,0 @@
-import PinInputField from './PinInputField';
-import PinInputMain from './PinInput';
-export type {
-  IPinInputContext,
-  IPinInputFieldProps,
-  IPinInputProps,
-} from './types';
-import type { IPinInputComponentType } from './types';
-
-let PinInputTemp: any = PinInputMain;
-PinInputTemp.Field = PinInputField;
-
-// To add typings
-const PinInput = PinInputTemp as IPinInputComponentType;
-export { PinInput };

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/PinInput/types.tsx

@@ -1,33 +0,0 @@
-import type { MutableRefObject } from 'react';
-import type { InterfaceInputProps } from '../../primitives/Input/types';
-import type { CustomProps, ResponsiveValue } from '../../../components/types';
-import type { ISizes } from '../../../theme/base/sizes';
-
-export type IPinInputProps = (InterfaceInputProps & {
-  onChange?: (value: string) => void;
-  children?: JSX.Element[] | JSX.Element;
-  manageFocus?: boolean;
-}) &
-  CustomProps<'PinInput'>;
-
-export type IPinInputFieldProps = InterfaceInputProps & {
-  fieldIndex?: number;
-  inputSize?: number | string;
-};
-export type IPinInputComponentType = ((
-  props: IPinInputProps & { ref?: MutableRefObject<any> }
-) => JSX.Element) & {
-  Field: React.MemoExoticComponent<
-    (
-      props: IPinInputFieldProps & { ref?: MutableRefObject<any> }
-    ) => JSX.Element
-  >;
-};
-export type IPinInputContext = IPinInputProps & {
-  handleChange?: (value: string, index: number) => void;
-  handleMultiValueChange?: (value: string, index: number) => void;
-  value?: string[] | string;
-  size?: ResponsiveValue<ISizes | (string & {}) | number>;
-  defaultValue?: string[] | string;
-  setRefList?: (ref: any, index: number) => void;
-};

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/Popover.tsx

@@ -1,117 +0,0 @@
-import React, { forwardRef, memo } from 'react';
-import { Popper } from '../Popper';
-import type { IPopoverProps } from './types';
-import { mergeRefs } from '../../../utils';
-import { useControllableState } from '../../../hooks';
-import { PopoverContext } from './PopoverContext';
-import Box from '../../primitives/Box';
-import Backdrop from '../Backdrop';
-import { FocusScope } from '@react-native-aria/focus';
-import { PresenceTransition } from '../Transitions';
-import { StyleSheet } from 'react-native';
-import { useId } from '@react-aria/utils';
-import { Overlay } from '../../primitives/Overlay';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const Popover = (
-  {
-    onOpen,
-    trigger,
-    onClose,
-    isOpen: isOpenProp,
-    children,
-    defaultIsOpen,
-    initialFocusRef,
-    finalFocusRef,
-    trapFocus = true,
-    ...props
-  }: IPopoverProps,
-  ref: any
-) => {
-  const triggerRef = React.useRef(null);
-  const mergedRef = mergeRefs([triggerRef]);
-  const [isOpen, setIsOpen] = useControllableState({
-    value: isOpenProp,
-    defaultValue: defaultIsOpen,
-    onChange: (value) => {
-      value ? onOpen && onOpen() : onClose && onClose();
-    },
-  });
-
-  const [bodyMounted, setBodyMounted] = React.useState(false);
-  const [headerMounted, setHeaderMounted] = React.useState(false);
-
-  const popoverContentId = `${useId()}-content`;
-  const headerId = `${popoverContentId}-header`;
-  const bodyId = `${popoverContentId}-body`;
-
-  const handleOpen = React.useCallback(() => {
-    setIsOpen(true);
-  }, [setIsOpen]);
-
-  const updatedTrigger = () => {
-    return trigger(
-      {
-        'ref': mergedRef,
-        'onPress': handleOpen,
-        'aria-expanded': isOpen ? true : false,
-        'aria-controls': isOpen ? popoverContentId : undefined,
-        'aria-haspopup': true,
-      },
-      { open: isOpen }
-    );
-  };
-
-  const handleClose = () => {
-    setIsOpen(false);
-  };
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-
-  return (
-    <Box ref={ref}>
-      {updatedTrigger()}
-      <Overlay
-        isOpen={isOpen}
-        onRequestClose={handleClose}
-        useRNModalOnAndroid
-        unmountOnExit
-      >
-        <PresenceTransition
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1, transition: { duration: 150 } }}
-          exit={{ opacity: 0, scale: 0.95, transition: { duration: 100 } }}
-          visible={isOpen}
-          style={StyleSheet.absoluteFill}
-        >
-          <Popper onClose={handleClose} triggerRef={triggerRef} {...props}>
-            <Backdrop onPress={handleClose} bg="transparent" />
-            <PopoverContext.Provider
-              value={{
-                onClose: handleClose,
-                initialFocusRef,
-                finalFocusRef,
-                popoverContentId,
-                bodyId,
-                headerId,
-                headerMounted,
-                bodyMounted,
-                setBodyMounted,
-                setHeaderMounted,
-                isOpen,
-              }}
-            >
-              <FocusScope contain={trapFocus} restoreFocus autoFocus>
-                {children}
-              </FocusScope>
-            </PopoverContext.Provider>
-          </Popper>
-        </PresenceTransition>
-      </Overlay>
-    </Box>
-  );
-};
-
-export default memo(forwardRef(Popover));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverArrow.tsx

@@ -1,18 +0,0 @@
-import React from 'react';
-import { usePropsResolution } from '../../../hooks';
-import { Popper } from '../Popper';
-import type { IBoxProps } from '../../primitives/Box';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PopoverArrow = React.forwardRef((props: IBoxProps, ref: any) => {
-  const resolvedProps = usePropsResolution('PopoverArrow', props);
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return <Popper.Arrow {...resolvedProps} ref={ref} />;
-});
-
-PopoverArrow.displayName = 'PopperArrow';
-
-export default PopoverArrow;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverBody.tsx

@@ -1,25 +0,0 @@
-import { usePropsResolution } from '../../../hooks';
-import React, { useContext, memo, forwardRef, useEffect } from 'react';
-import { default as Box, IBoxProps } from '../../primitives/Box';
-import { PopoverContext } from './PopoverContext';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PopoverBody = (props: IBoxProps, ref?: any) => {
-  const resolvedProps = usePropsResolution('PopoverBody', props);
-  const { setBodyMounted, bodyId } = useContext(PopoverContext);
-
-  useEffect(() => {
-    setBodyMounted(true);
-    return () => {
-      setBodyMounted(false);
-    };
-  }, [setBodyMounted]);
-
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return <Box nativeID={bodyId} {...resolvedProps} ref={ref} />;
-};
-
-export default memo(forwardRef(PopoverBody));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverCloseButton.tsx

@@ -1,70 +0,0 @@
-import React from 'react';
-import { usePropsResolution } from '../../../hooks';
-import { Pressable } from '../../primitives/Pressable';
-import { CloseIcon } from '../../primitives/Icon/Icons';
-import { PopoverContext } from './PopoverContext';
-import type { IButtonProps } from '../../primitives/Button';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-import {
-  useHover,
-  useFocus,
-  useIsPressed,
-} from '../../primitives/Pressable/Pressable';
-import { composeEventHandlers } from '../../../utils';
-import { useFocusRing } from '@react-native-aria/focus';
-
-const PopoverCloseButton = (props: IButtonProps, ref: any) => {
-  const { onClose }: any = React.useContext(PopoverContext);
-  const { hoverProps, isHovered } = useHover();
-  const { pressableProps, isPressed } = useIsPressed();
-  const { focusProps, isFocused } = useFocus();
-  const { isFocusVisible, focusProps: focusRingProps }: any = useFocusRing();
-
-  const {
-    _icon,
-    onPressIn,
-    onPressOut,
-    onHoverIn,
-    onHoverOut,
-    onFocus,
-    onBlur,
-    ...resolvedProps
-  } = usePropsResolution('PopoverCloseButton', props, {
-    isHovered,
-    isPressed,
-    isFocused,
-    isFocusVisible,
-  });
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return (
-    <Pressable
-      accessibilityRole="button"
-      ref={ref}
-      onPressIn={composeEventHandlers(onPressIn, pressableProps.onPressIn)}
-      onPressOut={composeEventHandlers(onPressOut, pressableProps.onPressOut)}
-      // @ts-ignore - web only
-      onHoverIn={composeEventHandlers(onHoverIn, hoverProps.onHoverIn)}
-      // @ts-ignore - web only
-      onHoverOut={composeEventHandlers(onHoverOut, hoverProps.onHoverOut)}
-      // @ts-ignore - web only
-      onFocus={composeEventHandlers(
-        composeEventHandlers(onFocus, focusProps.onFocus),
-        focusRingProps.onFocus
-      )}
-      // @ts-ignore - web only
-      onBlur={composeEventHandlers(
-        composeEventHandlers(onBlur, focusProps.onBlur),
-        focusRingProps.onBlur
-      )}
-      onPress={onClose}
-      {...resolvedProps}
-    >
-      <CloseIcon {..._icon} />
-    </Pressable>
-  );
-};
-
-export default React.memo(React.forwardRef(PopoverCloseButton));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverContent.tsx

@@ -1,94 +0,0 @@
-import {
-  useKeyboardDismissable,
-  usePropsResolution,
-  useToken,
-} from '../../../hooks';
-import React from 'react';
-import { Platform } from 'react-native';
-import type { IPopoverContentProps } from './types';
-import { Popper } from '../Popper';
-import { PopoverContext } from './PopoverContext';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-export const PopoverContent = React.forwardRef(
-  (props: IPopoverContentProps, ref: any) => {
-    const {
-      onClose,
-      initialFocusRef,
-      finalFocusRef,
-      popoverContentId,
-      headerMounted,
-      bodyMounted,
-      bodyId,
-      headerId,
-      isOpen,
-    } = React.useContext(PopoverContext);
-    const resolvedProps = usePropsResolution('PopoverContent', props);
-
-    const arrowDefaultColor =
-      props.bgColor ??
-      props.bg ??
-      props.backgroundColor ??
-      resolvedProps.backgroundColor;
-    const color = useToken('colors', arrowDefaultColor);
-
-    React.useEffect(() => {
-      const finalFocusRefCurrentVal = finalFocusRef?.current;
-      if (initialFocusRef && initialFocusRef.current) {
-        initialFocusRef.current.focus();
-      }
-
-      return () => {
-        if (finalFocusRefCurrentVal) {
-          finalFocusRefCurrentVal.focus();
-        }
-      };
-    }, [finalFocusRef, initialFocusRef]);
-
-    useKeyboardDismissable({
-      enabled: true,
-      callback: onClose,
-    });
-
-    let arrowElement = null;
-    const restChildren: any = [];
-    React.Children.forEach(props.children, (child) => {
-      if (child.type.displayName === 'PopperArrow') {
-        arrowElement = React.cloneElement(child, {
-          backgroundColor: child.props.color ?? color,
-        });
-      } else {
-        restChildren.push(child);
-      }
-    });
-
-    const accessibilityProps =
-      Platform.OS === 'web'
-        ? ({
-            'accessibilityRole': 'dialog',
-            'aria-labelledby': headerMounted ? headerId : undefined,
-            'aria-describedby': bodyMounted ? bodyId : undefined,
-          } as any)
-        : {};
-
-    //TODO: refactor for responsive prop
-    if (useHasResponsiveProps(props)) {
-      return null;
-    }
-
-    return (
-      <Popper.Content
-        nativeID={popoverContentId}
-        {...accessibilityProps}
-        {...resolvedProps}
-        ref={ref}
-        isOpen={isOpen}
-      >
-        {arrowElement}
-        {restChildren}
-      </Popper.Content>
-    );
-  }
-);
-
-PopoverContent.displayName = 'PopoverContent';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverContext.ts

@@ -1,15 +0,0 @@
-import React, { RefObject } from 'react';
-
-export const PopoverContext = React.createContext({
-  onClose: () => {},
-  initialFocusRef: { current: null } as RefObject<any> | undefined,
-  finalFocusRef: { current: null } as RefObject<any> | undefined,
-  popoverContentId: undefined as string | undefined,
-  headerId: undefined as string | undefined,
-  bodyId: undefined as string | undefined,
-  setHeaderMounted: (() => {}) as any,
-  setBodyMounted: (() => {}) as any,
-  headerMounted: false,
-  bodyMounted: false,
-  isOpen: false,
-});

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverFooter.tsx

@@ -1,15 +0,0 @@
-import React, { memo, forwardRef } from 'react';
-import { usePropsResolution } from '../../../hooks';
-import { default as Box, IBoxProps } from '../../primitives/Box';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PopoverFooter = (props: IBoxProps, ref?: any) => {
-  const resolvedProps = usePropsResolution('PopoverFooter', props);
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return <Box {...resolvedProps} ref={ref} />;
-};
-
-export default memo(forwardRef(PopoverFooter));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/PopoverHeader.tsx

@@ -1,24 +0,0 @@
-import React, { memo, forwardRef, useEffect, useContext } from 'react';
-import { usePropsResolution } from '../../../hooks';
-import { default as Box, IBoxProps } from '../../primitives/Box';
-import { PopoverContext } from './PopoverContext';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const PopoverHeader = (props: IBoxProps, ref?: any) => {
-  const resolvedProps = usePropsResolution('PopoverHeader', props);
-  const { setHeaderMounted, headerId } = useContext(PopoverContext);
-
-  useEffect(() => {
-    setHeaderMounted(true);
-    return () => {
-      setHeaderMounted(false);
-    };
-  }, [setHeaderMounted]);
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return <Box nativeID={headerId} {...resolvedProps} ref={ref} />;
-};
-
-export default memo(forwardRef(PopoverHeader));

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Popover/index.tsx

@@ -1,21 +0,0 @@
-import { default as PopoverMain } from './Popover';
-import { PopoverContent } from './PopoverContent';
-import PopoverBody from './PopoverBody';
-import PopoverCloseButton from './PopoverCloseButton';
-import PopoverFooter from './PopoverFooter';
-import PopoverHeader from './PopoverHeader';
-import type { IPopoverComponentType } from './types';
-import PopoverArrow from './PopoverArrow';
-export type { IPopoverProps } from './types';
-
-const PopoverTemp: any = PopoverMain;
-PopoverTemp.Content = PopoverContent;
-PopoverTemp.CloseButton = PopoverCloseButton;
-PopoverTemp.Header = PopoverHeader;
-PopoverTemp.Footer = PopoverFooter;
-PopoverTemp.Body = PopoverBody;
-PopoverTemp.Arrow = PopoverArrow;
-
-// To add typings
-const Popover = PopoverTemp as IPopoverComponentType;
-export { Popover };