Skip to content

Commit fd14d12

Browse files
patrycjakalinskam-bert
patrycjakalinska
and
m-bert
authored
[docs] Bump t-rex-ui (#4019)
## Description <!-- Description and motivation for this PR. Include 'Fixes #<number>' if this is fixing some issue. --> >[!NOTE] >For now it contains `"resolutions": { "webpackbar": "^7.0.0" },`, a without it [build fails](facebook/docusaurus#11923) ## Test plan <!-- Describe how did you test this change here. --> --------- Co-authored-by: Michał <michal.bert@swmansion.com>
1 parent aed7c4c commit fd14d12

46 files changed

Lines changed: 3561 additions & 4256 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎packages/docs-gesture-handler/docs/components/buttons.mdx‎

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ sidebar_label: Buttons
77
import useBaseUrl from '@docusaurus/useBaseUrl';
88
import GifGallery from '@site/components/GifGallery';
99

10-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
11-
1210
:::danger
1311
Button components described in this section are deprecated and will be removed in the future. Please use [`Touchable`](/docs/components/touchable) instead.
1412
:::
@@ -43,19 +41,19 @@ exclusive?: boolean;
4341

4442
Defines whether pressing this button prevents other buttons exported by Gesture Handler from being pressed. By default set to `true`.
4543

46-
<HeaderWithBadges platforms={['android']}>
44+
<Badges platforms={['android']}>
4745
### rippleColor
48-
</HeaderWithBadges>
46+
</Badges>
4947

5048
```ts
5149
rippleColor?: number | ColorValue | null;
5250
```
5351

5452
Defines [color](https://reactnative.dev/docs/colors) of native [ripple](https://developer.android.com/reference/android/graphics/drawable/RippleDrawable) animation.
5553

56-
<HeaderWithBadges platforms={['android']}>
54+
<Badges platforms={['android']}>
5755
### rippleRadius
58-
</HeaderWithBadges>
56+
</Badges>
5957

6058

6159
```ts
@@ -64,29 +62,29 @@ rippleRadius?: number | null;
6462

6563
Defines radius of native [ripple](https://developer.android.com/reference/android/graphics/drawable/RippleDrawable) animation.
6664

67-
<HeaderWithBadges platforms={['android']}>
65+
<Badges platforms={['android']}>
6866
### borderless
69-
</HeaderWithBadges>
67+
</Badges>
7068

7169
```ts
7270
borderless?: boolean;
7371
```
7472

7573
If set to `false`, [ripple](https://developer.android.com/reference/android/graphics/drawable/RippleDrawable) animation will render only within view bounds.
7674

77-
<HeaderWithBadges platforms={['android']}>
75+
<Badges platforms={['android']}>
7876
### foreground
79-
</HeaderWithBadges>
77+
</Badges>
8078

8179
```ts
8280
foreground?: boolean;
8381
```
8482

8583
Defines whether the [ripple](https://developer.android.com/reference/android/graphics/drawable/RippleDrawable) animation should be drawn on the foreground of the view.
8684

87-
<HeaderWithBadges platforms={['android']}>
85+
<Badges platforms={['android']}>
8886
### touchSoundDisabled
89-
</HeaderWithBadges>
87+
</Badges>
9088

9189
```ts
9290
touchSoundDisabled?: boolean;
@@ -144,9 +142,9 @@ underlayColor?: string;
144142

145143
Background color that will be dimmed when the button is in an active state.
146144

147-
<HeaderWithBadges platforms={['iOS']}>
145+
<Badges platforms={['ios']}>
148146
### activeOpacity
149-
</HeaderWithBadges>
147+
</Badges>
150148

151149
```ts
152150
activeOpacity?: number;
@@ -158,9 +156,9 @@ Opacity applied to the underlay when the button is in an active state.
158156

159157
This type of button component should be used with simple icon-only or text-only buttons. The interaction will be different depending on platform: on Android a borderless ripple will be rendered (it means that the ripple will animate into a circle that can span outside of the view bounds), whereas on iOS the button will be dimmed (similar to how `TouchableOpacity` works). In addition to the props of [`BaseButton`](#basebutton), it accepts the following:
160158

161-
<HeaderWithBadges platforms={['iOS']}>
159+
<Badges platforms={['ios']}>
162160
### activeOpacity
163-
</HeaderWithBadges>
161+
</Badges>
164162

165163
```ts
166164
activeOpacity?: number;

‎packages/docs-gesture-handler/docs/components/pressable.mdx‎

Lines changed: 16 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ sidebar_label: Pressable
77
import useBaseUrl from '@docusaurus/useBaseUrl';
88
import GifGallery from '@site/components/GifGallery';
99

10-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
11-
1210
:::info
1311
This component is a drop-in replacement for the `Pressable` component.
1412
:::
@@ -89,39 +87,39 @@ cancelable?: null | boolean;
8987

9088
Whether a press gesture can be interrupted by a parent gesture such as a scroll event. Defaults to `true`.
9189

92-
<HeaderWithBadges platforms={['android', 'web']}>
90+
<Badges platforms={['android', 'web']}>
9391
### onHoverIn
94-
</HeaderWithBadges>
92+
</Badges>
9593

9694
```ts
9795
onHoverIn?: null | ((event: PressableEvent) => void);
9896
```
9997

10098
Called when pointer is hovering over the element.
10199

102-
<HeaderWithBadges platforms={['android', 'web']}>
100+
<Badges platforms={['android', 'web']}>
103101
### onHoverOut
104-
</HeaderWithBadges>
102+
</Badges>
105103

106104
```ts
107105
onHoverOut?: null | ((event: PressableEvent) => void);
108106
```
109107

110108
Called when pointer stops hovering over the element.
111109

112-
<HeaderWithBadges platforms={['web']}>
110+
<Badges platforms={['web']}>
113111
### delayHoverIn
114-
</HeaderWithBadges>
112+
</Badges>
115113

116114
```ts
117115
delayHoverIn?: number | null;
118116
```
119117

120118
Duration to wait after hover in before calling `onHoverIn`.
121119

122-
<HeaderWithBadges platforms={['web']}>
120+
<Badges platforms={['web']}>
123121
### delayHoverOut
124-
</HeaderWithBadges>
122+
</Badges>
125123

126124
```ts
127125
delayHoverOut?: number | null;
@@ -145,9 +143,9 @@ disabled?: null | boolean;
145143

146144
Whether the `Pressable` behavior is disabled.
147145

148-
<HeaderWithBadges platforms={['android', 'iOS']}>
146+
<Badges platforms={['android', 'ios']}>
149147
### hitSlop
150-
</HeaderWithBadges>
148+
</Badges>
151149

152150
```ts
153151
hitSlop?: null | Insets | number;
@@ -157,9 +155,9 @@ Additional distance outside of the view in which a press is detected and [`onPre
157155

158156
The `Insets` type is essentially the same as [`Rect`](https://reactnative.dev/docs/rect).
159157

160-
<HeaderWithBadges platforms={['android', 'iOS']}>
158+
<Badges platforms={['android', 'ios']}>
161159
### pressRetentionOffset
162-
</HeaderWithBadges>
160+
</Badges>
163161

164162
```ts
165163
pressRetentionOffset?: null | Insets | number;
@@ -170,19 +168,19 @@ press before [`onPressOut`](#onpressout) is triggered.
170168

171169
The `Insets` type is essentially the same as [`Rect`](https://reactnative.dev/docs/rect).
172170

173-
<HeaderWithBadges platforms={['android']}>
171+
<Badges platforms={['android']}>
174172
### android_disableSound
175-
</HeaderWithBadges>
173+
</Badges>
176174

177175
```ts
178176
android_disableSound?: null | boolean;
179177
```
180178

181179
If `true`, doesn't play system sound on touch.
182180

183-
<HeaderWithBadges platforms={['android']}>
181+
<Badges platforms={['android']}>
184182
### android_ripple
185-
</HeaderWithBadges>
183+
</Badges>
186184

187185
```ts
188186
android_ripple?: null | PressableAndroidRippleConfig;

‎packages/docs-gesture-handler/docs/components/reanimated-drawer-layout.mdx‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,6 @@ sidebar_label: Reanimated Drawer Layout
66

77
import useBaseUrl from '@docusaurus/useBaseUrl';
88

9-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
10-
119
import MouseButtonProp from '../gestures/\_shared/mouse-button.mdx';
1210

1311
:::info
@@ -221,9 +219,9 @@ export enum DrawerState {
221219

222220
A function is called when the status of the drawer changes, taking `newState` to represent the drawer's interaction state and `drawerWillShow`, which is `true` when the drawer starts animating towards the open position and `false` otherwise.
223221

224-
<HeaderWithBadges platforms={['iOS']}>
222+
<Badges platforms={['ios']}>
225223
### enableTrackpadTwoFingerGesture
226-
</HeaderWithBadges>
224+
</Badges>
227225

228226
```ts
229227
enableTrackpadTwoFingerGesture?: boolean;
@@ -242,29 +240,29 @@ Either a component rendered in the content view or a function. If `children` is
242240

243241
<MouseButtonProp />
244242

245-
<HeaderWithBadges platforms={['web']}>
243+
<Badges platforms={['web']}>
246244
### enableContextMenu
247-
</HeaderWithBadges>
245+
</Badges>
248246

249247
```ts
250248
enableContextMenu: boolean;
251249
```
252250

253251
Specifies whether the context menu should be enabled after clicking on the underlying view with the right mouse button. Default value is set to `false` if [`MouseButton.RIGHT`](#mousebutton-web--android-only) is specified.
254252

255-
<HeaderWithBadges platforms={['web']}>
253+
<Badges platforms={['web']}>
256254
### userSelect
257-
</HeaderWithBadges>
255+
</Badges>
258256

259257
```ts
260258
userSelect: 'none' | 'auto' | 'text';
261259
```
262260

263261
This parameter allows specifying which `userSelect` property should be applied to the underlying view. Default value is set to `"none"`.
264262

265-
<HeaderWithBadges platforms={['web']}>
263+
<Badges platforms={['web']}>
266264
### activeCursor
267-
</HeaderWithBadges>
265+
</Badges>
268266

269267
```ts
270268
activeCursor: ActiveCursor;

‎packages/docs-gesture-handler/docs/components/reanimated_swipeable.mdx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ sidebar_label: Reanimated Swipeable
77
import useBaseUrl from '@docusaurus/useBaseUrl';
88
import GifGallery from '@site/components/GifGallery'
99

10-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
11-
1210
:::info
1311
This component is a drop-in replacement for the `Swipeable` component, rewritten using [Reanimated](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started).
1412
:::
@@ -242,9 +240,9 @@ blocksExternalGesture?: AnyGesture | AnyGesture[];
242240

243241
Gestures that `Swipeable` will prevent from activating (see [gesture composition section](/docs/fundamentals/gesture-composition#simultaneouswith)).
244242

245-
<HeaderWithBadges platforms={['iOS']}>
243+
<Badges platforms={['ios']}>
246244
### enableTrackpadTwoFingerGesture
247-
</HeaderWithBadges>
245+
</Badges>
248246

249247
```ts
250248
enableTrackpadTwoFingerGesture?: boolean;

‎packages/docs-gesture-handler/docs/components/touchable.mdx‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,6 @@ title: Touchable
44
sidebar_label: Touchable
55
---
66

7-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
8-
97
:::note
108
This section refers to new `Touchable` component, meant to replace both buttons and touchables. If you are looking for documentation for the deprecated touchable components, check out the [Legacy Touchables](/docs/components/legacy-touchables) section.
119
:::
@@ -206,9 +204,9 @@ exclusive?: boolean;
206204

207205
Defines whether pressing this button prevents other buttons exported by Gesture Handler from being pressed. By default set to `true`.
208206

209-
<HeaderWithBadges platforms={['android']}>
207+
<Badges platforms={['android']}>
210208
### touchSoundDisabled
211-
</HeaderWithBadges>
209+
</Badges>
212210

213211
```ts
214212
touchSoundDisabled?: boolean;
@@ -304,9 +302,9 @@ delayLongPress?: number;
304302
Defines the delay, in milliseconds, after which the [`onLongPress`](#onlongpress) callback gets called. By default set to `600`.
305303

306304

307-
<HeaderWithBadges platforms={['android']}>
305+
<Badges platforms={['android']}>
308306
### androidRipple
309-
</HeaderWithBadges>
307+
</Badges>
310308

311309
<CollapsibleCode
312310
label="Show composed types definitions"

‎packages/docs-gesture-handler/docs/fundamentals/animated-interactions.mdx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ sidebar_label: Integration with Animated
55
sidebar_position: 9
66
---
77

8-
import CollapsibleCode from '@site/src/components/CollapsibleCode';
9-
108
Using hook API allows for smooth integration with the [Animated API](https://reactnative.dev/docs/animated) by allowing for passing an `Animated.event` as the argument to the [`onUpdate`](/docs/fundamentals/callbacks-events#onupdate) callback. The event mapping of `Animated.event` depends on the [`useNativeDriver`](https://reactnative.dev/docs/animated#using-the-native-driver) property.
119

1210
When using Animated API, remember to set `useAnimated` property to `true`.

‎packages/docs-gesture-handler/docs/fundamentals/callbacks-events.mdx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ sidebar_position: 6
66
---
77

88
import { GestureEventFlowChart, TouchEventFlowChart } from '@site/src/examples/CallbacksFlowCharts'
9-
import CollapsibleCode from '@site/src/components/CollapsibleCode';
109

1110
At any given time, each handler instance has an assigned [state](/docs/under-the-hood/state) that can change when new touch events occur or can be forced to change by the touch system under certain circumstances. You can hook into state transitions using specific [gesture callbacks](#callbacks).
1211

‎packages/docs-gesture-handler/docs/fundamentals/gesture-composition.mdx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ sidebar_label: Gesture composition & interactions
55
sidebar_position: 5
66
---
77

8-
import CollapsibleCode from '@site/src/components/CollapsibleCode';
9-
108
import Competing from '!!raw-loader!.//\_examples/hooks/Competing';
119
import Simultaneous from '!!raw-loader!.//\_examples/hooks/Simultaneous';
1210
import Exclusive from '!!raw-loader!.//\_examples/hooks/Exclusive';

‎packages/docs-gesture-handler/docs/fundamentals/gesture-detector.mdx‎

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@ sidebar_label: Gesture detectors
55
sidebar_position: 4
66
---
77

8-
import CollapsibleCode from '@site/src/components/CollapsibleCode';
9-
import HeaderWithBadges from '@site/src/components/HeaderWithBadges';
10-
118
## Gesture Detector
129

1310
The `GestureDetector` is a key component of `react-native-gesture-handler`. It supports gestures created either using the hook-based API or the builder pattern. Additionally, it allows for the recognition of multiple gestures through [gesture composition](/docs/fundamentals/gesture-composition). `GestureDetector` interacts closely with [`Reanimated`](https://docs.swmansion.com/react-native-reanimated/). For more details, refer to the [Integration with Reanimated](/docs/fundamentals/reanimated-interactions) section.
@@ -190,29 +187,29 @@ gesture: SingleGesture | ComposedGesture;
190187

191188
A gesture object containing the configuration and callbacks. Can be any of the base gestures or any [`ComposedGesture`](/docs/fundamentals/gesture-composition).
192189

193-
<HeaderWithBadges platforms={['web']}>
190+
<Badges platforms={['web']}>
194191
### userSelect
195-
</HeaderWithBadges>
192+
</Badges>
196193

197194
```ts
198195
userSelect: 'none' | 'auto' | 'text';
199196
```
200197

201198
This parameter allows specifying which `userSelect` property should be applied to the underlying view. Default value is set to `"none"`.
202199

203-
<HeaderWithBadges platforms={['web']}>
200+
<Badges platforms={['web']}>
204201
### touchAction
205-
</HeaderWithBadges>
202+
</Badges>
206203

207204
```ts
208205
touchAction: TouchAction;
209206
```
210207

211208
This parameter allows specifying which `touchAction` property should be applied to the underlying view. Supports all CSS [touch-action](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/touch-action) values. Default value is set to `"none"`.
212209

213-
<HeaderWithBadges platforms={['web']}>
210+
<Badges platforms={['web']}>
214211
### enableContextMenu
215-
</HeaderWithBadges>
212+
</Badges>
216213

217214
```ts
218215
enableContextMenu: boolean;

‎packages/docs-gesture-handler/docs/fundamentals/introduction.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ id: introduction
33
title: Introduction
44
sidebar_label: Introduction
55
sidebar_position: 1
6-
slug: /
6+
slug: /fundamentals/introduction
77
---
88

99
Gesture Handler provides a declarative API exposing the native platform's touch and gesture system to React Native. It's designed to be a replacement of React Native's built in touch system called [Gesture Responder System](http://reactnative.dev/docs/gesture-responder-system). Using native touch handling allows addressing the performance limitations of React Native's Gesture Responder System. It also provides more control over the platform's native components that can handle gestures on their own. If you want to learn more, we recommend [this talk](https://www.youtube.com/watch?v=V8maYc4R2G0) by [Krzysztof Magiera](https://twitter.com/kzzzf) in which he explains issues with the responder system.

0 commit comments

Comments
 (0)