46 lines
1.0 KiB
JavaScript
46 lines
1.0 KiB
JavaScript
import React, { useRef, useContext, forwardRef } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
|
|
import ActionSheet from './ActionSheet';
|
|
import { useTheme } from '../../theme';
|
|
|
|
const context = React.createContext({
|
|
showActionSheet: () => {},
|
|
hideActionSheet: () => {}
|
|
});
|
|
|
|
export const useActionSheet = () => useContext(context);
|
|
|
|
const { Provider, Consumer } = context;
|
|
|
|
export const withActionSheet = Component => forwardRef((props, ref) => (
|
|
<Consumer>
|
|
{contexts => <Component {...props} {...contexts} ref={ref} />}
|
|
</Consumer>
|
|
));
|
|
|
|
export const ActionSheetProvider = React.memo(({ children }) => {
|
|
const ref = useRef();
|
|
const { theme } = useTheme();
|
|
|
|
const getContext = () => ({
|
|
showActionSheet: (options) => {
|
|
ref.current?.showActionSheet(options);
|
|
},
|
|
hideActionSheet: () => {
|
|
ref.current?.hideActionSheet();
|
|
}
|
|
});
|
|
|
|
return (
|
|
<Provider value={getContext()}>
|
|
<ActionSheet ref={ref} theme={theme}>
|
|
{children}
|
|
</ActionSheet>
|
|
</Provider>
|
|
);
|
|
});
|
|
ActionSheetProvider.propTypes = {
|
|
children: PropTypes.node
|
|
};
|