This commit is contained in:
Yamozha
2021-04-02 02:24:13 +03:00
parent c23950b545
commit 7256d79e2c
31493 changed files with 3036630 additions and 0 deletions

View File

@ -0,0 +1,86 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow strict-local
*/
'use strict';
import * as React from 'react';
import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands';
import codegenNativeComponent from '../../Utilities/codegenNativeComponent';
import type {HostComponent} from '../../Renderer/shims/ReactNativeTypes';
import type {
DirectEventHandler,
Float,
Int32,
WithDefault,
} from '../../Types/CodegenTypes';
import type {ColorValue} from '../../StyleSheet/StyleSheetTypes';
import type {ViewProps} from '../View/ViewPropTypes';
type NativeProps = $ReadOnly<{|
...ViewProps,
/**
* Whether the pull to refresh functionality is enabled.
*/
enabled?: WithDefault<boolean, true>,
/**
* The colors (at least one) that will be used to draw the refresh indicator.
*/
colors?: ?$ReadOnlyArray<ColorValue>,
/**
* The background color of the refresh indicator.
*/
progressBackgroundColor?: ?ColorValue,
/**
* Size of the refresh indicator, see RefreshControl.SIZE.
*
* This type isn't currently accurate. It really is specific numbers
* hard coded in the Android platform.
*
* Also, 1 isn't actually a safe default. We are able to set this here
* because native code isn't currently consuming the generated artifact.
* This will end up being
* size?: WithDefault<'default' | 'large', 'default'>,
*/
size?: WithDefault<Int32, 1>,
/**
* Progress view top offset
*/
progressViewOffset?: WithDefault<Float, 0>,
/**
* Called when the view starts refreshing.
*/
onRefresh?: ?DirectEventHandler<null>,
/**
* Whether the view should be indicating an active refresh.
*/
refreshing: boolean,
|}>;
type NativeType = HostComponent<NativeProps>;
interface NativeCommands {
+setNativeRefreshing: (
viewRef: React.ElementRef<NativeType>,
value: boolean,
) => void;
}
export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
supportedCommands: ['setNativeRefreshing'],
});
export default (codegenNativeComponent<NativeProps>(
'AndroidSwipeRefreshLayout',
): NativeType);

View File

@ -0,0 +1,65 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow strict-local
*/
'use strict';
import type {DirectEventHandler, WithDefault} from '../../Types/CodegenTypes';
import type {ColorValue} from '../../StyleSheet/StyleSheetTypes';
import type {ViewProps} from '../View/ViewPropTypes';
import * as React from 'react';
import codegenNativeComponent from '../../Utilities/codegenNativeComponent';
import type {HostComponent} from '../../Renderer/shims/ReactNativeTypes';
import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands';
type NativeProps = $ReadOnly<{|
...ViewProps,
/**
* The color of the refresh indicator.
*/
tintColor?: ?ColorValue,
/**
* Title color.
*/
titleColor?: ?ColorValue,
/**
* The title displayed under the refresh indicator.
*/
title?: WithDefault<string, null>,
/**
* Called when the view starts refreshing.
*/
onRefresh?: ?DirectEventHandler<null>,
/**
* Whether the view should be indicating an active refresh.
*/
refreshing: boolean,
|}>;
type ComponentType = HostComponent<NativeProps>;
interface NativeCommands {
+setNativeRefreshing: (
viewRef: React.ElementRef<ComponentType>,
refreshing: boolean,
) => void;
}
export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
supportedCommands: ['setNativeRefreshing'],
});
export default (codegenNativeComponent<NativeProps>('PullToRefreshView', {
paperComponentName: 'RCTRefreshControl',
excludedPlatform: 'android',
}): HostComponent<NativeProps>);

View File

@ -0,0 +1,226 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow
*/
'use strict';
const Platform = require('../../Utilities/Platform');
const React = require('react');
import type {ColorValue} from '../../StyleSheet/StyleSheetTypes';
import type {ViewProps} from '../View/ViewPropTypes';
import AndroidSwipeRefreshLayoutNativeComponent, {
Commands as AndroidSwipeRefreshLayoutCommands,
} from './AndroidSwipeRefreshLayoutNativeComponent';
import PullToRefreshViewNativeComponent, {
Commands as PullToRefreshCommands,
} from './PullToRefreshViewNativeComponent';
let RefreshLayoutConsts: any;
if (Platform.OS === 'android') {
const AndroidSwipeRefreshLayout = require('../../ReactNative/UIManager').getViewManagerConfig(
'AndroidSwipeRefreshLayout',
);
RefreshLayoutConsts = AndroidSwipeRefreshLayout
? AndroidSwipeRefreshLayout.Constants
: {SIZE: {}};
} else {
RefreshLayoutConsts = {SIZE: {}};
}
type IOSProps = $ReadOnly<{|
/**
* The color of the refresh indicator.
*/
tintColor?: ?ColorValue,
/**
* Title color.
*/
titleColor?: ?ColorValue,
/**
* The title displayed under the refresh indicator.
*/
title?: ?string,
|}>;
type AndroidProps = $ReadOnly<{|
/**
* Whether the pull to refresh functionality is enabled.
*/
enabled?: ?boolean,
/**
* The colors (at least one) that will be used to draw the refresh indicator.
*/
colors?: ?$ReadOnlyArray<ColorValue>,
/**
* The background color of the refresh indicator.
*/
progressBackgroundColor?: ?ColorValue,
/**
* Size of the refresh indicator, see RefreshControl.SIZE.
*/
size?: ?(
| typeof RefreshLayoutConsts.SIZE.DEFAULT
| typeof RefreshLayoutConsts.SIZE.LARGE
),
/**
* Progress view top offset
*/
progressViewOffset?: ?number,
|}>;
export type RefreshControlProps = $ReadOnly<{|
...ViewProps,
...IOSProps,
...AndroidProps,
/**
* Called when the view starts refreshing.
*/
onRefresh?: ?() => void | Promise<void>,
/**
* Whether the view should be indicating an active refresh.
*/
refreshing: boolean,
|}>;
/**
* This component is used inside a ScrollView or ListView to add pull to refresh
* functionality. When the ScrollView is at `scrollY: 0`, swiping down
* triggers an `onRefresh` event.
*
* ### Usage example
*
* ``` js
* class RefreshableList extends Component {
* constructor(props) {
* super(props);
* this.state = {
* refreshing: false,
* };
* }
*
* _onRefresh() {
* this.setState({refreshing: true});
* fetchData().then(() => {
* this.setState({refreshing: false});
* });
* }
*
* render() {
* return (
* <ListView
* refreshControl={
* <RefreshControl
* refreshing={this.state.refreshing}
* onRefresh={this._onRefresh.bind(this)}
* />
* }
* ...
* >
* ...
* </ListView>
* );
* }
* ...
* }
* ```
*
* __Note:__ `refreshing` is a controlled prop, this is why it needs to be set to true
* in the `onRefresh` function otherwise the refresh indicator will stop immediately.
*/
class RefreshControl extends React.Component<RefreshControlProps> {
static SIZE: any = RefreshLayoutConsts.SIZE;
_nativeRef: ?React.ElementRef<
| typeof PullToRefreshViewNativeComponent
| typeof AndroidSwipeRefreshLayoutNativeComponent,
>;
_lastNativeRefreshing = false;
componentDidMount() {
this._lastNativeRefreshing = this.props.refreshing;
}
componentDidUpdate(prevProps: RefreshControlProps) {
// RefreshControl is a controlled component so if the native refreshing
// value doesn't match the current js refreshing prop update it to
// the js value.
if (this.props.refreshing !== prevProps.refreshing) {
this._lastNativeRefreshing = this.props.refreshing;
} else if (
this.props.refreshing !== this._lastNativeRefreshing &&
this._nativeRef
) {
if (Platform.OS === 'android') {
AndroidSwipeRefreshLayoutCommands.setNativeRefreshing(
this._nativeRef,
this.props.refreshing,
);
} else {
PullToRefreshCommands.setNativeRefreshing(
this._nativeRef,
this.props.refreshing,
);
}
this._lastNativeRefreshing = this.props.refreshing;
}
}
render(): React.Node {
if (Platform.OS === 'ios') {
const {
enabled,
colors,
progressBackgroundColor,
size,
progressViewOffset,
...props
} = this.props;
return (
<PullToRefreshViewNativeComponent
{...props}
ref={this._setNativeRef}
onRefresh={this._onRefresh}
/>
);
} else {
const {tintColor, titleColor, title, ...props} = this.props;
return (
<AndroidSwipeRefreshLayoutNativeComponent
{...props}
ref={this._setNativeRef}
onRefresh={this._onRefresh}
/>
);
}
}
_onRefresh = () => {
this._lastNativeRefreshing = true;
this.props.onRefresh && this.props.onRefresh();
// The native component will start refreshing so force an update to
// make sure it stays in sync with the js component.
this.forceUpdate();
};
_setNativeRef = (
ref: ?React.ElementRef<
| typeof PullToRefreshViewNativeComponent
| typeof AndroidSwipeRefreshLayoutNativeComponent,
>,
) => {
this._nativeRef = ref;
};
}
module.exports = RefreshControl;

View File

@ -0,0 +1,33 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow strict-local
*/
'use strict';
const React = require('react');
const requireNativeComponent = require('../../../ReactNative/requireNativeComponent');
import type {HostComponent} from '../../../Renderer/shims/ReactNativeTypes';
const RCTRefreshControl: HostComponent<mixed> = requireNativeComponent<mixed>(
'RCTRefreshControl',
);
class RefreshControlMock extends React.Component<{...}> {
static latestRef: ?RefreshControlMock;
componentDidMount() {
RefreshControlMock.latestRef = this;
}
render(): React.Element<typeof RCTRefreshControl> {
return <RCTRefreshControl />;
}
}
module.exports = RefreshControlMock;