react-native-acoustic-connect-beta 16.0.0

package/Example/nativebase-v3-kitchensink/src/navigators/rootNavigator.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import { createStackNavigator } from '@react-navigation/stack';
+import { Examples, MasonLayout } from '../screens';
+
+const Stack = createStackNavigator();
+
+export function RootStack() {
+ // for(let i = 0; i< 10000000000; i++){}
+  return (
+    <Stack.Navigator initialRouteName="Kitchensink | NativeBase">
+      <Stack.Screen
+        name="Component | NativeBase"
+        component={Examples}
+        options={{
+          headerShown: false,
+        }}
+      />
+      <Stack.Screen
+        name="Kitchensink | NativeBase"
+        component={MasonLayout}
+        options={{
+          headerShown: false,
+        }}
+      />
+    </Stack.Navigator>
+  );
+}

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/LICENSE

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright (C) 2024 GeekyAnts India Pvt Ltd
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/babel.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+  plugins:
+    process.env.NODE_ENV === 'production' ? ['transform-remove-console'] : [],
+};

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/cli.js

@@ -0,0 +1,69 @@
+const { exec } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+
+// Copy directory
+function copyDir(src, dest) {
+  fs.mkdirSync(dest, { recursive: true });
+  let entries = fs.readdirSync(src, { withFileTypes: true });
+
+  for (let entry of entries) {
+    let srcPath = path.join(src, entry.name);
+    let destPath = path.join(dest, entry.name);
+
+    entry.isDirectory()
+      ? copyDir(srcPath, destPath)
+      : fs.copyFileSync(srcPath, destPath);
+  }
+}
+
+const themeFolder = path.join(__dirname, 'src', 'theme');
+const outDirectory = path.join(process.cwd(), 'theme');
+const themeTemp = path.join(process.cwd(), 'theme-temp');
+
+const transpileScript = `tsc ${themeTemp}/index.ts --target esnext --moduleResolution node --outDir ${outDirectory} --skipLibCheck true --allowSyntheticDefaultImports true`;
+
+const VALID_ARGS = ['eject:theme'];
+
+const ejectTheme = async () => {
+  await copyDir(themeFolder, themeTemp);
+  await promisifyExec(transpileScript);
+  fs.rmSync(themeTemp, { recursive: true, force: true });
+
+  console.log('Theme ejected successfully!');
+  console.log('Theme folder is placed in ' + process.cwd() + ' directory.');
+};
+
+const main = () => {
+  const myArgs = process.argv.slice(2);
+  invokeFunctionBasedOnArgs(myArgs[0]);
+};
+
+const invokeFunctionBasedOnArgs = (arg) => {
+  switch (arg) {
+    case VALID_ARGS[0]: {
+      ejectTheme();
+      break;
+    }
+    default: {
+      console.log('No arguments matched. Valid arguments are ', VALID_ARGS);
+      break;
+    }
+  }
+};
+
+const promisifyExec = (command) => {
+  return new Promise((resolve, reject) => {
+    exec(command, (error, stdout, stderr) => {
+      console.log(stdout);
+      console.log(stderr);
+      if (error !== null) {
+        reject(error);
+        console.log(`exec error: ${error}`);
+      }
+      resolve();
+    });
+  });
+};
+
+main();

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/FlatList/FlatList.tsx

@@ -0,0 +1,43 @@
+import React, { forwardRef } from 'react';
+import { FlatList as RNFlatList } from 'react-native';
+import {
+  usePropsResolution,
+  useStyledSystemPropsResolver,
+} from '../../../hooks';
+import { makeStyledComponent } from '../../../utils/styled';
+import type { IFlatListProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const StyledFlatList: any = makeStyledComponent(RNFlatList);
+
+const FlatListComponent = <ItemT extends any>(
+  props: IFlatListProps<ItemT>,
+  ref: any
+) => {
+  const {
+    _contentContainerStyle,
+    contentContainerStyle,
+    ...resolvedProps
+  } = usePropsResolution('FlatList', props);
+  const resolved_ContentContainerStyle = useStyledSystemPropsResolver(
+    _contentContainerStyle || {}
+  );
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return (
+    <StyledFlatList
+      {...resolvedProps}
+      contentContainerStyle={
+        contentContainerStyle || resolved_ContentContainerStyle
+      }
+      ref={ref}
+    />
+  );
+};
+
+export const FlatList = forwardRef(FlatListComponent) as <ItemT>(
+  props: IFlatListProps<ItemT>,
+  ref: any
+) => any;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/FlatList/index.tsx

@@ -0,0 +1,2 @@
+export { FlatList } from './FlatList';
+export type { IFlatListProps } from './types';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/FlatList/types.ts

@@ -0,0 +1,19 @@
+import type { StyledProps } from '../../../theme/types';
+import type { FlatListProps } from 'react-native';
+import type { CustomProps, PlatformProps } from '../../types';
+import type { MutableRefObject } from 'react';
+
+export interface InterfaceFlatListProps<ItemT>
+  extends FlatListProps<ItemT>,
+    StyledProps,
+    PlatformProps<IFlatListProps<ItemT>> {
+  /**
+   * pass props to contentContainerStyle, and this also resolved NB tokens.
+   */
+  _contentContainerStyle?: Partial<IFlatListProps<ItemT>>;
+
+  ref?: MutableRefObject<any>;
+}
+
+export type IFlatListProps<ItemT> = InterfaceFlatListProps<ItemT> &
+  CustomProps<'FlatList'>;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/KeyboardAvoidingView/KeyboardAvoidingView.tsx

@@ -0,0 +1,25 @@
+import React, { forwardRef } from 'react';
+import { KeyboardAvoidingView as RNKeyboardAvoidingView } from 'react-native';
+import { usePropsResolution } from '../../../hooks';
+import { makeStyledComponent } from '../../../utils/styled';
+import type { IKeyboardAvoidingViewProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const StyledKeyboardAvoidingView: any = makeStyledComponent(
+  RNKeyboardAvoidingView
+);
+
+export const KeyboardAvoidingView = forwardRef(
+  (props: IKeyboardAvoidingViewProps, ref: any) => {
+    const { ...resolvedProps } = usePropsResolution(
+      'KeyboardAvoidingView',
+      props,
+      {}
+    );
+    //TODO: refactor for responsive prop
+    if (useHasResponsiveProps(props)) {
+      return null;
+    }
+    return <StyledKeyboardAvoidingView {...resolvedProps} ref={ref} />;
+  }
+);

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/KeyboardAvoidingView/index.tsx

@@ -0,0 +1 @@
+export { KeyboardAvoidingView } from './KeyboardAvoidingView';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/KeyboardAvoidingView/types.ts

@@ -0,0 +1,15 @@
+import type { KeyboardAvoidingViewProps } from 'react-native';
+import type { StyledProps } from '../../../theme/types';
+import type { CustomProps, PlatformProps } from '../../types';
+
+export interface InterfaceKeyboardAvoidingViewProps
+  extends KeyboardAvoidingViewProps,
+    StyledProps,
+    PlatformProps<IKeyboardAvoidingViewProps> {
+  /**
+   * Renders components as Box children. Accepts a JSX.Element or an array of JSX.Element. */
+  children?: JSX.Element | JSX.Element[] | string | any;
+}
+
+export type IKeyboardAvoidingViewProps = InterfaceKeyboardAvoidingViewProps &
+  CustomProps<'KeyboardAvoidingView'>;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/ScrollView/ScrollView.tsx

@@ -0,0 +1,35 @@
+import React, { forwardRef } from 'react';
+import { ScrollView as RNScrollView } from 'react-native';
+import {
+  usePropsResolution,
+  useStyledSystemPropsResolver,
+} from '../../../hooks';
+import { makeStyledComponent } from '../../../utils/styled';
+import type { IScrollViewProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const StyledScrollView: any = makeStyledComponent(RNScrollView);
+
+export const ScrollView = forwardRef((props: IScrollViewProps, ref: any) => {
+  const {
+    _contentContainerStyle,
+    contentContainerStyle,
+    ...resolvedProps
+  } = usePropsResolution('ScrollView', props, {});
+  const resolved_ContentContainerStyle = useStyledSystemPropsResolver(
+    _contentContainerStyle || {}
+  );
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return (
+    <StyledScrollView
+      {...resolvedProps}
+      contentContainerStyle={
+        contentContainerStyle || resolved_ContentContainerStyle
+      }
+      ref={ref}
+    />
+  );
+});

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/ScrollView/index.tsx

@@ -0,0 +1,2 @@
+export { ScrollView } from './ScrollView';
+export type { IScrollViewProps } from './types';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/ScrollView/types.ts

@@ -0,0 +1,19 @@
+import type { ScrollViewProps } from 'react-native';
+import type { StyledProps } from '../../../theme/types';
+import type { CustomProps, PlatformProps } from '../../types';
+
+export interface InterfaceScrollViewProps
+  extends ScrollViewProps,
+    StyledProps,
+    PlatformProps<IScrollViewProps> {
+  /**
+   * Renders components as Box children. Accepts a JSX.Element or an array of JSX.Element. */
+  children?: JSX.Element | JSX.Element[] | string | any;
+  /**
+   * pass props to contentContainerStyle, and this also resolved NB tokens.
+   */
+  _contentContainerStyle?: Partial<IScrollViewProps>;
+}
+
+export type IScrollViewProps = InterfaceScrollViewProps &
+  CustomProps<'ScrollView'>;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/SectionList/SectionList.tsx

@@ -0,0 +1,29 @@
+import React, { forwardRef } from 'react';
+import { SectionList as RNSectionList } from 'react-native';
+import { usePropsResolution } from '../../../hooks';
+import { makeStyledComponent } from '../../../utils/styled';
+import type { ISectionListProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const StyledSectionList: any = makeStyledComponent(RNSectionList);
+
+const SectionListComponent = <ItemT extends any, sectionT extends any>(
+  props: ISectionListProps<ItemT, sectionT>,
+  ref: any
+) => {
+  const { ...resolvedProps } = usePropsResolution('SectionList', props);
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+
+  return <StyledSectionList {...resolvedProps} ref={ref} />;
+};
+
+export const SectionList = forwardRef(SectionListComponent) as <
+  ItemT,
+  sectionT
+>(
+  props: ISectionListProps<ItemT, sectionT>,
+  ref: any
+) => any;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/SectionList/index.tsx

@@ -0,0 +1 @@
+export { SectionList } from './SectionList';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/SectionList/types.ts

@@ -0,0 +1,19 @@
+import type { StyledProps } from '../../../theme/types';
+import type { SectionListProps } from 'react-native';
+import type { CustomProps, PlatformProps } from '../../types';
+import type { MutableRefObject } from 'react';
+type DefaultSectionT = {
+  [key: string]: any;
+};
+// TODO: any need to fixed
+export interface InterfaceSectionListProps<ItemT, sectionT = DefaultSectionT>
+  extends SectionListProps<ItemT, sectionT>,
+    StyledProps,
+    PlatformProps<ISectionListProps<ItemT, sectionT>> {
+  ref?: MutableRefObject<any>;
+}
+
+export type ISectionListProps<
+  ItemT,
+  sectionT = DefaultSectionT
+> = InterfaceSectionListProps<ItemT, sectionT> & CustomProps<'SectionList'>;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/StatusBar/StatusBar.tsx

@@ -0,0 +1,12 @@
+import React, { forwardRef } from 'react';
+import { StatusBar as RNStatusBar, StatusBarProps } from 'react-native';
+// import type { IStatusBarProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+export const StatusBar = forwardRef((props: StatusBarProps, ref: any) => {
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return <RNStatusBar {...props} ref={ref} />;
+});

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/StatusBar/index.tsx

@@ -0,0 +1 @@
+export { StatusBar } from './StatusBar';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/StatusBar/types.ts

@@ -0,0 +1,8 @@
+import type { StatusBarProps } from 'react-native';
+import type { CustomProps } from '../../../components/types';
+
+export interface InterfaceStatusBarProps extends StatusBarProps {}
+export type IStatusBarProps = InterfaceStatusBarProps &
+  CustomProps<'StatusBar'>;
+
+export type IStatusBarComponentType = (props: IStatusBarProps) => JSX.Element;

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/View/View.tsx

@@ -0,0 +1,17 @@
+import React, { forwardRef } from 'react';
+import { View as RNView } from 'react-native';
+import { usePropsResolution } from '../../../hooks';
+import { makeStyledComponent } from '../../../utils/styled';
+import type { IViewProps } from './types';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const StyledView: any = makeStyledComponent(RNView);
+
+export const View = forwardRef((props: IViewProps, ref: any) => {
+  const { ...resolvedProps } = usePropsResolution('View', props);
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return <StyledView {...resolvedProps} ref={ref} />;
+});

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/View/index.tsx

@@ -0,0 +1 @@
+export { View } from './View';

package/Example/nativebase-v3-kitchensink/src/nb/NativeBase/src/components/basic/View/types.ts

@@ -0,0 +1,14 @@
+import type { StyledProps } from '../../../theme/types';
+import type { ViewProps } from 'react-native';
+import type { CustomProps, PlatformProps } from '../../types';
+
+export interface InterfaceViewProps
+  extends ViewProps,
+    StyledProps,
+    PlatformProps<IViewProps> {
+  /**
+   * Renders components as Box children. Accepts a JSX.Element or an array of JSX.Element. */
+  children?: JSX.Element | JSX.Element[] | string | any;
+}
+
+export type IViewProps = InterfaceViewProps & CustomProps<'View'>;

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

@@ -0,0 +1,7 @@
+export { ScrollView } from './ScrollView';
+export type { IScrollViewProps } from './ScrollView';
+export { View } from './View';
+export { StatusBar } from './StatusBar';
+export { FlatList } from './FlatList';
+export { SectionList } from './SectionList';
+export { KeyboardAvoidingView } from './KeyboardAvoidingView';

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

@@ -0,0 +1,78 @@
+import React from 'react';
+import Box from '../../primitives/Box';
+import type { IAccordionProps } from './types';
+import { useThemeProps } from '../../../hooks';
+import getIndexedChildren from '../../../utils/getIndexedChildren';
+import { AccordionContext } from './Context';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const Accordion = (
+  {
+    children,
+    index: pIndex,
+    defaultIndex,
+    allowMultiple,
+    allowToggle,
+    onChange,
+    ...props
+  }: IAccordionProps,
+  ref: any
+) => {
+  const {
+    endingHeight,
+    startingHeight,
+    duration,
+    isOpen,
+    onAnimationEnd,
+    onAnimationStart,
+    ...newProps
+  } = useThemeProps('Accordion', props);
+
+  const [index, setIndex] = React.useState(pIndex || defaultIndex || []);
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  const changeHandler = (isOpening: boolean, activeIndex: number) => {
+    let indexCopy = index.map((i: number) => i);
+    if (allowToggle) {
+      if (isOpening) {
+        indexCopy.push(activeIndex);
+        allowMultiple ? setIndex(indexCopy) : setIndex([activeIndex]);
+      } else {
+        setIndex(index.splice(index.indexOf(activeIndex), 1));
+      }
+    } else {
+      if (isOpening) {
+        indexCopy.push(activeIndex);
+        allowMultiple ? setIndex(indexCopy) : setIndex([activeIndex]);
+      } else {
+        indexCopy = indexCopy.filter((n: any) => n !== activeIndex);
+        setIndex(indexCopy);
+      }
+    }
+    onChange && onChange(indexCopy);
+  };
+  return (
+    <AccordionContext.Provider
+      value={{
+        index: index,
+        changeHandler,
+        AnimationProps: {
+          endingHeight,
+          startingHeight,
+          duration,
+          isOpen,
+          onAnimationEnd,
+          onAnimationStart,
+        },
+      }}
+    >
+      <Box overflow="hidden" {...newProps} ref={ref}>
+        {getIndexedChildren(children)}
+      </Box>
+    </AccordionContext.Provider>
+  );
+};
+
+export default React.memo(React.forwardRef(Accordion));

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

@@ -0,0 +1,34 @@
+import React from 'react';
+import { AccordionContext, AccordionItemContext } from './Context';
+import Collapse from '../Collapse';
+import type {
+  IAccordionDetailsProps,
+  IAccordionContextProps,
+  IAccordionItemContextProps,
+} from './types';
+import { useThemeProps } from '../../../hooks';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const AccordionDetails = (
+  { children, ...props }: IAccordionDetailsProps,
+  ref?: any
+) => {
+  const { ...newProps } = useThemeProps('AccordionDetails', props);
+  const { isOpen }: IAccordionItemContextProps = React.useContext(
+    AccordionItemContext
+  );
+  const { AnimationProps }: IAccordionContextProps = React.useContext(
+    AccordionContext
+  );
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return (
+    <Collapse {...AnimationProps} {...newProps} isOpen={isOpen} ref={ref}>
+      {children}
+    </Collapse>
+  );
+};
+
+export default React.memo(React.forwardRef(AccordionDetails));

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

@@ -0,0 +1,24 @@
+import React from 'react';
+import { ChevronDownIcon, ChevronUpIcon } from '../../primitives/Icon/Icons';
+import type { IAccordionIconProps, IAccordionItemContextProps } from './types';
+import { AccordionItemContext } from './Context';
+import { useThemeProps } from '../../../hooks';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const AccordionIcon = ({ ...props }: IAccordionIconProps, ref?: any) => {
+  const { isOpen }: IAccordionItemContextProps = React.useContext(
+    AccordionItemContext
+  );
+  const { ...newProps } = useThemeProps('AccordionIcon', props);
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return isOpen ? (
+    <ChevronUpIcon color="white" {...newProps} ref={ref} />
+  ) : (
+    <ChevronDownIcon {...newProps} ref={ref} />
+  );
+};
+
+export default React.memo(React.forwardRef(AccordionIcon));

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

@@ -0,0 +1,53 @@
+import React from 'react';
+import Box from '../../primitives/Box';
+import { AccordionContext, AccordionItemContext } from './Context';
+import type { IAccordionItemProps, IAccordionContextProps } from './types';
+import { useThemeProps } from '../../../hooks';
+import { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';
+
+const AccordionItem = (
+  { children, index: pIndex = 0, isDisabled, ...props }: IAccordionItemProps,
+  ref?: any
+) => {
+  const {
+    index: cIndex,
+    changeHandler,
+  }: IAccordionContextProps = React.useContext(AccordionContext);
+  const { ...newProps } = useThemeProps('AccordionItem', props);
+
+  const isOpen = cIndex?.includes(pIndex);
+  const onClose = (cb?: () => void) => {
+    changeHandler && changeHandler(false, pIndex);
+    cb && cb();
+  };
+  const onOpen = (cb?: () => void) => {
+    changeHandler && changeHandler(true, pIndex);
+    cb && cb();
+  };
+  const childSetter = () => {
+    if (typeof children === 'function')
+      return children({ isExpanded: isOpen, isDisabled });
+    return children;
+  };
+  //TODO: refactor for responsive prop
+  if (useHasResponsiveProps(props)) {
+    return null;
+  }
+  return (
+    <AccordionItemContext.Provider
+      value={{
+        index: pIndex,
+        isOpen,
+        isDisabled,
+        onClose,
+        onOpen,
+      }}
+    >
+      <Box {...newProps} ref={ref}>
+        {childSetter()}
+      </Box>
+    </AccordionItemContext.Provider>
+  );
+};
+
+export default React.memo(React.forwardRef(AccordionItem));