Skip to content

Commit

Permalink
Deprecate DrawerLayout (#3339)
Browse files Browse the repository at this point in the history
## Description

Seems like we overlooked the fact that `DrawerLayout` should be deprecated 😅 

## Test plan

Try to import `DrawerLayout` and check deprecation note.
  • Loading branch information
m-bert authored Jan 28, 2025
1 parent 15cdd8d commit 82d70d5
Show file tree
Hide file tree
Showing 2 changed files with 35 additions and 0 deletions.
6 changes: 6 additions & 0 deletions docs/docs/components/drawer-layout.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,12 @@ sidebar_label: DrawerLayout
import useBaseUrl from '@docusaurus/useBaseUrl';
import GifGallery from '@site/components/GifGallery';

:::caution
This component is deprecated.
Please use [the reanimated version](/react-native-gesture-handler/docs/components/reanimated-drawer-layout).
:::


This is a cross-platform replacement for React Native's [DrawerLayoutAndroid](http://reactnative.dev/docs/drawerlayoutandroid.html) component. It provides a compatible API but allows for the component to be used on both Android and iOS. Please refer to [React Native docs](http://reactnative.dev/docs/drawerlayoutandroid.html) for the detailed usage for standard parameters.

## Usage:
Expand Down
29 changes: 29 additions & 0 deletions src/components/DrawerLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,20 +44,39 @@ const IDLE: DrawerState = 'Idle';
const DRAGGING: DrawerState = 'Dragging';
const SETTLING: DrawerState = 'Settling';

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerPosition = 'left' | 'right';

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerState = 'Idle' | 'Dragging' | 'Settling';

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerType = 'front' | 'back' | 'slide';

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerLockMode = 'unlocked' | 'locked-closed' | 'locked-open';

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerKeyboardDismissMode = 'none' | 'on-drag';

// Animated.AnimatedInterpolation has been converted to a generic type
// in @types/react-native 0.70. This way we can maintain compatibility
// with all versions of @types/react-native`
type AnimatedInterpolation = ReturnType<Animated.Value['interpolate']>;

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export interface DrawerLayoutProps {
/**
* This attribute is present in the standard implementation already and is one
Expand Down Expand Up @@ -186,6 +205,9 @@ export interface DrawerLayoutProps {
enableContextMenu?: boolean;
}

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerLayoutState = {
dragX: Animated.Value;
touchX: Animated.Value;
Expand All @@ -195,10 +217,17 @@ export type DrawerLayoutState = {
drawerOpened: boolean;
};

/**
* @deprecated DrawerLayout is deprecated. Use Reanimated version of DrawerLayout instead.
*/
export type DrawerMovementOption = {
velocity?: number;
speed?: number;
};

/**
* @deprecated use Reanimated version of DrawerLayout instead
*/
export default class DrawerLayout extends Component<
DrawerLayoutProps,
DrawerLayoutState
Expand Down

0 comments on commit 82d70d5

Please sign in to comment.