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

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

@@ -1,55 +0,0 @@
-import React, { forwardRef, memo, useContext } from 'react';
-import { CheckIcon } from '../../primitives/Icon/Icons';
-import Box from '../../primitives/Box';
-import { usePropsResolution } from '../../../hooks/useThemeProps';
-import MenuItem from './MenuItem';
-import type { IMenuItemOptionProps, IMenuOptionContextProps } from './types';
-import { MenuOptionContext } from './MenuOptionGroup';
-import { useMenuOptionItem } from './useMenu';
-import { HStack } from '../../primitives/Stack';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const MenuItemOption = (
-  { value, ...props }: IMenuItemOptionProps,
-  ref: any
-) => {
-  const { values, onChange, type }: IMenuOptionContextProps = useContext(
-    MenuOptionContext
-  );
-  const isChecked = values.includes(value);
-  const menuOptionProps = useMenuOptionItem({ isChecked, type });
-  const {
-    children,
-    onPress,
-    _icon,
-    _stack,
-    _text,
-    ...resolvedProps
-  } = usePropsResolution('MenuItem', props, { isChecked });
-
-  const modifiedOnPress = (e: any) => {
-    onChange(value);
-    onPress && onPress(e);
-  };
-
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return (
-    <MenuItem
-      {...resolvedProps}
-      {...menuOptionProps}
-      accessibilityRole="button"
-      onPress={modifiedOnPress}
-      ref={ref}
-    >
-      <HStack {..._stack}>
-        <CheckIcon {..._icon} />
-        <Box _text={_text}>{children}</Box>
-      </HStack>
-    </MenuItem>
-  );
-};
-
-export default memo(forwardRef(MenuItemOption));

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

@@ -1,62 +0,0 @@
-import React, { forwardRef, memo } from 'react';
-import MenuGroup from './MenuGroup';
-import type { IMenuOptionGroupProps, IMenuOptionContextProps } from './types';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-export const MenuOptionContext = React.createContext<IMenuOptionContextProps>({
-  values: [],
-  onChange: (_val) => {},
-  type: 'checkbox',
-});
-
-const MenuOptionGroup = (
-  { type, defaultValue, value, onChange, ...props }: IMenuOptionGroupProps,
-  ref?: any
-) => {
-  const internalDefaultValue = defaultValue
-    ? Array.isArray(defaultValue)
-      ? defaultValue
-      : [defaultValue]
-    : [];
-
-  const [internalValues, setValues] = React.useState<Array<string | number>>(
-    internalDefaultValue
-  );
-  const _onChange = (newValue: string | number) => {
-    if (type === 'checkbox') {
-      const newValues = [...internalValues];
-      if (internalValues.includes(newValue)) {
-        newValues.splice(newValues.indexOf(newValue), 1);
-        setValues(newValues);
-      } else {
-        newValues.push(newValue);
-        setValues(newValues);
-      }
-      onChange && onChange(newValues);
-    } else if (type === 'radio') {
-      setValues([newValue]);
-      onChange && onChange(newValue);
-    }
-  };
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(props)) {
-    return null;
-  }
-  return (
-    <MenuOptionContext.Provider
-      value={{
-        values: !value
-          ? internalValues
-          : Array.isArray(value)
-          ? value
-          : [value],
-        onChange: _onChange,
-        type,
-      }}
-    >
-      <MenuGroup {...props} ref={ref} />
-    </MenuOptionContext.Provider>
-  );
-};
-
-export default memo(forwardRef(MenuOptionGroup));

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

@@ -1,24 +0,0 @@
-import { default as MenuMain } from './Menu';
-import MenuGroup from './MenuGroup';
-import MenuItem from './MenuItem';
-import MenuItemOption from './MenuItemOption';
-import MenuOptionGroup from './MenuOptionGroup';
-import type { IMenuComponent } from './types';
-
-let MenuTemp: any = MenuMain;
-MenuTemp.Item = MenuItem;
-MenuTemp.Group = MenuGroup;
-MenuTemp.ItemOption = MenuItemOption;
-MenuTemp.OptionGroup = MenuOptionGroup;
-
-// To add typings
-const Menu = MenuTemp as IMenuComponent;
-
-export { Menu };
-export type {
-  IMenuProps,
-  IMenuItemProps,
-  IMenuItemOptionProps,
-  IMenuGroupProps,
-  IMenuOptionGroupProps,
-} from './types';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Menu/types.ts

@@ -1,189 +0,0 @@
-import type { ITextProps } from '../../primitives/Text';
-import type { InterfaceBoxProps } from '../../primitives/Box/types';
-import type { IPressableProps } from '../../primitives/Pressable';
-import type { MutableRefObject } from 'react';
-import type { IPresenceTransitionProps } from '../Transitions/types';
-import type { IIconProps } from '../../../components/primitives/Icon';
-import type { IStackProps } from '../../../components/primitives/Stack';
-import type { IOverlayProps } from '../../../components/primitives/Overlay';
-import type { CustomProps } from '../../../components/types';
-
-export interface InterfaceMenuProps extends InterfaceBoxProps<IMenuProps> {
-  /**
-   * Function that returns a React Element. This element will be used as a Trigger for the menu
-   */
-  trigger: (_props: any, state: { open: boolean }) => JSX.Element;
-  /**
-   * This function will be invoked when menu is opened
-   */
-  onOpen?: () => void;
-  /**
-   * This function will be invoked when menu is closed. It'll also be called when user attempts to close the menu via Escape key or backdrop press.
-   */
-  onClose?: () => void;
-  /**
-   * Whether menu should be closed when a menu item is pressed
-   * @default true
-   */
-  closeOnSelect?: boolean;
-  /**
-   * If true, the menu will be opened by default
-   */
-  defaultIsOpen?: boolean;
-  /**
-   * Whether the menu is opened. Useful for conrolling the open state
-   */
-  isOpen?: boolean;
-  /**
-   * The additional offset applied along the cross axis between the element and its trigger element.
-   */
-  crossOffset?: number;
-  /**
-   * The additional offset applied along the main axis between the element and its trigger element.
-   */
-  offset?: number;
-  /**
-   * Determines whether menu content should overlap with the trigger
-   * @default false
-   */
-  shouldOverlapWithTrigger?: boolean;
-  /**
-   * menu placement
-   * @default 'bottom left'
-   */
-  placement?:
-    | 'top'
-    | 'bottom'
-    | 'left'
-    | 'right'
-    | 'top left'
-    | 'top right'
-    | 'bottom left'
-    | 'bottom right'
-    | 'right top'
-    | 'right bottom'
-    | 'left top'
-    | 'left bottom';
-  /**
-   * Whether the element should flip its orientation (e.g. top to bottom or left to right) when there is insufficient room for it to render completely.
-   * @default true
-   */
-  shouldFlip?: boolean;
-  /**
-   * Overlay related props can be passed in _overlay.
-   */
-  _overlay?: Partial<IOverlayProps>;
-  /**
-   * PresenceTransition related props can be passed in _presenceTransition.
-   */
-  _presenceTransition?: Partial<IPresenceTransitionProps>;
-  /**
-   * Backdrop related props can be passed in _backdrop.
-   */
-  _backdrop?: Partial<IPressableProps>;
-}
-
-export interface IMenuItemProps extends IPressableProps {
-  /**
-   * Children of Menu Item
-   */
-  children: string | JSX.Element | Array<JSX.Element>;
-  /**
-   * Whether menu item is disabled
-   */
-  isDisabled?: boolean;
-  /**
-   * Props to be passed to Text
-   */
-  _text?: Partial<ITextProps>;
-  /**
-   * This value will be available for the typeahead menu feature
-   */
-  textValue?: string;
-}
-
-export interface IMenuItemOptionProps extends IMenuItemProps {
-  /**
-   * Value of the Menu Item option.
-   */
-  value: string | number;
-  /**
-   * Stack related props can be passed in _stack.
-   */
-  _stack?: Partial<IStackProps>;
-  /**
-   * Icon related props can be passed in _icon.
-   */
-  _icon?: Partial<IIconProps>;
-  /**
-   * Text related props can be passed in _text.
-   */
-  _text?: Partial<ITextProps>;
-}
-export interface IMenuGroupProps {
-  /**
-   *  The title of the menu group
-   */
-  title: string;
-  /**
-   * The children of Menu group
-   */
-  children: JSX.Element | Array<JSX.Element>;
-  /**
-   * Props to pass on to Text.
-   */
-  _title?: Partial<ITextProps>;
-}
-
-export interface IMenuOptionGroupProps extends IMenuGroupProps {
-  /**
-   * Used to add selection type of menu group.
-   */
-  type: 'radio' | 'checkbox';
-  /**
-   * The initial value of the option group
-   */
-  defaultValue?: string | number | string[] | number[];
-  /**
-   * The value of the option group
-   */
-  value?: string | number | Array<string> | Array<number>;
-  /**
-   * Function called when selection changes
-   */
-  onChange?: (val: any) => void;
-}
-
-export type IMenuOptionContextProps = {
-  values: Array<string | number>;
-  onChange: (val: string | number) => void;
-  type: 'radio' | 'checkbox';
-};
-
-export type IMenuComponent = ((
-  props: IMenuProps & { ref?: MutableRefObject<any> }
-) => JSX.Element) & {
-  Item: React.MemoExoticComponent<
-    (props: IMenuItemProps & { ref?: MutableRefObject<any> }) => JSX.Element
-  >;
-  Group: React.MemoExoticComponent<
-    (props: IMenuGroupProps & { ref?: MutableRefObject<any> }) => JSX.Element
-  >;
-  ItemOption: React.MemoExoticComponent<
-    (
-      props: IMenuItemOptionProps & { ref?: MutableRefObject<any> }
-    ) => JSX.Element
-  >;
-  OptionGroup: React.MemoExoticComponent<
-    (
-      props: IMenuOptionGroupProps & { ref?: MutableRefObject<any> }
-    ) => JSX.Element
-  >;
-};
-
-export type IMenuContextProps = {
-  closeMenu?: () => void;
-  open?: boolean;
-  closeOnSelect?: boolean;
-};
-export type IMenuProps = InterfaceMenuProps & CustomProps<'Menu'>;

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

@@ -1,121 +0,0 @@
-import { useFocusManager } from '@react-aria/focus';
-import { useId } from '@react-aria/utils';
-import { AccessibilityRole, Platform } from 'react-native';
-
-type IMenuTriggerProps = {
-  handleOpen: () => void;
-  isOpen: boolean;
-};
-
-export const useMenuTrigger = ({ handleOpen, isOpen }: IMenuTriggerProps) => {
-  const menuTriggerId = useId();
-  return {
-    'onKeyDownCapture': (event: KeyboardEvent) => {
-      if ([' ', 'Enter', 'ArrowUp', 'ArrowDown'].includes(event.key)) {
-        event.preventDefault();
-        handleOpen();
-      }
-    },
-    'aria-haspopup': 'menu',
-    'aria-expanded': isOpen ? true : undefined,
-    'nativeID': menuTriggerId,
-  };
-};
-
-export const useMenu = () => {
-  const focusManager = useFocusManager();
-  const onKeyDown = (e: KeyboardEvent) => {
-    switch (e.key) {
-      case 'ArrowDown': {
-        e.preventDefault();
-        focusManager.focusNext({ wrap: true });
-        break;
-      }
-      case 'ArrowUp': {
-        e.preventDefault();
-        focusManager.focusPrevious({ wrap: true });
-        break;
-      }
-    }
-  };
-
-  return {
-    onKeyDown,
-    accessibilityRole: 'menu' as AccessibilityRole,
-  };
-};
-
-export const useMenuItem = ({
-  textValue,
-  ref,
-}: {
-  textValue: string;
-  ref: any;
-}) => {
-  return {
-    accessibilityRole: 'menuitem' as AccessibilityRole,
-    dataSet: {
-      nativebaseMenuItem: textValue,
-    },
-    onHoverIn: () => {
-      if (ref.current && Platform.OS === 'web') ref.current.focus();
-    },
-  };
-};
-
-export const useMenuOptionItem = ({
-  isChecked,
-  type,
-}: {
-  isChecked: boolean;
-  type: 'checkbox' | 'radio';
-}) => {
-  return {
-    accessibilityRole: ('menuitem' +
-      (Platform.OS === 'web' ? type : '')) as AccessibilityRole,
-    accessibilityState: {
-      checked: isChecked,
-    },
-    accessibilityChecked: isChecked,
-  };
-};
-
-const ITEM_ATTR = 'data-nativebase-menu-item';
-const getValue = (element: Element) => element.getAttribute(ITEM_ATTR) ?? '';
-
-export const useMenuTypeahead = (props: any): any => {
-  return {
-    onKeyDown(event: KeyboardEvent) {
-      if (props.onKeyDown) {
-        props.onKeyDown(event);
-      }
-
-      if (
-        event.key.length === 1 &&
-        !(event.ctrlKey || event.altKey || event.metaKey)
-      ) {
-        const container = event.currentTarget as HTMLElement;
-        const values = Array.from(
-          container.querySelectorAll(`[${ITEM_ATTR}]`)
-        ).map(getValue);
-
-        const searchKey = event.key;
-
-        const foundValue = values.find((value) =>
-          value.toLowerCase().startsWith(searchKey)
-        );
-        const newItem = container.querySelector(
-          `[${ITEM_ATTR}="${foundValue}"]`
-        );
-
-        if (newItem) {
-          /**
-           * Imperative focus during keydown is risky so we prevent React's batching updates
-           * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
-           */
-          setTimeout(() => (newItem as HTMLElement).focus());
-        }
-      }
-    },
-  };
-};

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/composites/Modal/Context.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-
-export const ModalContext = React.createContext({
-  handleClose: (() => {}) as any,
-  contentSize: {} as any,
-  initialFocusRef: { current: null } as React.RefObject<any> | undefined,
-  finalFocusRef: { current: null } as React.RefObject<any> | undefined,
-  visible: false as boolean,
-});

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

@@ -1,124 +0,0 @@
-import React, { forwardRef, memo } from 'react';
-import { StyleSheet } from 'react-native';
-import Backdrop from '../Backdrop';
-import { Slide } from '../Transitions';
-import { FocusScope } from '@react-native-aria/focus';
-import { useControllableState, usePropsResolution } from '../../../hooks';
-import { ModalContext } from './Context';
-import Box from '../../primitives/Box';
-import type { IModalProps } from './types';
-import { Fade } from '../../composites/Transitions';
-import { useKeyboardBottomInset } from '../../../utils';
-import { Overlay } from '../../primitives/Overlay';
-import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
-
-const Modal = (
-  {
-    children,
-    isOpen,
-    onClose,
-    defaultIsOpen,
-    initialFocusRef,
-    finalFocusRef,
-    avoidKeyboard,
-    closeOnOverlayClick = true,
-    isKeyboardDismissable = true,
-    overlayVisible = true,
-    backdropVisible = true,
-    animationPreset,
-    ...rest
-  }: IModalProps,
-  ref: any
-) => {
-  const bottomInset = useKeyboardBottomInset();
-  const {
-    contentSize,
-    _backdrop,
-    _backdropFade,
-    _fade,
-    _slide,
-    ...resolvedProps
-  } = usePropsResolution('Modal', rest);
-
-  const [visible, setVisible] = useControllableState({
-    value: isOpen,
-    defaultValue: defaultIsOpen,
-    onChange: (val) => {
-      if (!val) onClose && onClose();
-    },
-  });
-
-  const handleClose = React.useCallback(() => setVisible(false), [setVisible]);
-
-  const child = (
-    <Box
-      bottom={avoidKeyboard ? bottomInset + 'px' : undefined}
-      {...resolvedProps}
-      ref={ref}
-      pointerEvents="box-none"
-    >
-      {children}
-    </Box>
-  );
-
-  const contextValue = React.useMemo(() => {
-    return {
-      handleClose,
-      contentSize,
-      initialFocusRef,
-      finalFocusRef,
-      visible,
-    };
-  }, [handleClose, contentSize, initialFocusRef, finalFocusRef, visible]);
-
-  //TODO: refactor for responsive prop
-  if (useHasResponsiveProps(rest)) {
-    return null;
-  }
-  // console.log('visible here', visible);
-  return (
-    <Overlay
-      isOpen={visible}
-      onRequestClose={handleClose}
-      isKeyboardDismissable={isKeyboardDismissable}
-      animationPreset={animationPreset}
-      useRNModalOnAndroid
-    >
-      <ModalContext.Provider value={contextValue}>
-        <Fade in={visible} style={StyleSheet.absoluteFill} {..._backdropFade}>
-          {overlayVisible && backdropVisible && (
-            <Backdrop
-              onPress={() => {
-                closeOnOverlayClick && handleClose();
-              }}
-              {..._backdrop}
-            />
-          )}
-        </Fade>
-        {animationPreset === 'slide' ? (
-          <Slide in={visible} {..._slide}>
-            <FocusScope
-              contain={visible}
-              autoFocus={visible && !initialFocusRef}
-              restoreFocus={visible && !finalFocusRef}
-            >
-              {child}
-            </FocusScope>
-          </Slide>
-        ) : (
-          <Fade in={visible} style={StyleSheet.absoluteFill} {..._fade}>
-            <FocusScope
-              contain={visible}
-              autoFocus={visible && !initialFocusRef}
-              restoreFocus={visible && !finalFocusRef}
-            >
-              {child}
-            </FocusScope>
-          </Fade>
-        )}
-      </ModalContext.Provider>
-    </Overlay>
-  );
-};
-
-export default memo(forwardRef(Modal));

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

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

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

@@ -1,70 +0,0 @@
-import React, { memo, forwardRef } from 'react';
-import { ModalContext } from './Context';
-import { usePropsResolution } from '../../../hooks';
-import { Pressable } from '../../primitives/Pressable';
-import { CloseIcon } from '../../primitives/Icon/Icons';
-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 ModalCloseButton = (props: IButtonProps, ref?: any) => {
-  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('ModalCloseButton', props, {
-    isHovered,
-    isPressed,
-    isFocused,
-    isFocusVisible,
-  });
-  const { handleClose } = React.useContext(ModalContext);
-  //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={handleClose}
-      {...resolvedProps}
-    >
-      <CloseIcon {..._icon} />
-    </Pressable>
-  );
-};
-
-export default memo(forwardRef(ModalCloseButton));