@unifold/connect-react-native 0.1.11 → 0.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -116,7 +116,15 @@ The SDK provides comprehensive theming options. For full documentation, see [doc
116
116
  components: {
117
117
  header: { titleColor: "#FFFFFF" },
118
118
  card: { backgroundColor: "#1A1A1D" },
119
- }
119
+ },
120
+
121
+ // Bottom sheet corner radius
122
+ sheetBorderRadius: {
123
+ globalBorderTopLeftRadius: 24, // Default for all sheets
124
+ globalBorderTopRightRadius: 24,
125
+ main: { borderTopLeftRadius: 0, borderTopRightRadius: 0 },
126
+ buyWithCard: { borderTopLeftRadius: 16, borderTopRightRadius: 16 },
127
+ },
120
128
  }}
121
129
  >
122
130
  ```
@@ -151,6 +159,41 @@ await beginDeposit({
151
159
  | `config.fontFamily` | `string` | No | Single font family for all text |
152
160
  | `config.fonts` | `FontConfig` | No | Granular font weight configuration |
153
161
  | `config.components` | `ComponentConfig` | No | Component-specific token overrides |
162
+ | `config.sheetBorderRadius` | `SheetBorderRadius` | No | Border radius configuration for all bottom sheets (see below) |
163
+
164
+ ### SheetBorderRadius
165
+
166
+ Configure the border radius of all bottom sheets. Set global defaults and optionally override individual sheets. Per-component values accept `{ borderTopLeftRadius?: number, borderTopRightRadius?: number }` and fall back to the global values, then to the default of `24`.
167
+
168
+ | Key | Type | Description |
169
+ |-----|------|-------------|
170
+ | `globalBorderTopLeftRadius` | `number` | Default top-left radius for all sheets (default: `24`) |
171
+ | `globalBorderTopRightRadius` | `number` | Default top-right radius for all sheets (default: `24`) |
172
+ | `main` | `BorderRadiusConfig` | The main deposit modal |
173
+ | `transferCrypto` | `BorderRadiusConfig` | Transfer crypto wrapper sheet |
174
+ | `buyWithCard` | `BorderRadiusConfig` | Buy with card wrapper sheet |
175
+ | `depositsTracker` | `BorderRadiusConfig` | Deposits tracker modal |
176
+ | `tokenSelector` | `BorderRadiusConfig` | Token selector (inside transfer crypto) |
177
+ | `chainSelector` | `BorderRadiusConfig` | Chain selector (inside transfer crypto, double\_input variant) |
178
+ | `currencyModal` | `BorderRadiusConfig` | Currency selector (inside buy with card) |
179
+ | `providerModal` | `BorderRadiusConfig` | Provider selection (inside buy with card) |
180
+ | `depositStatus` | `BorderRadiusConfig` | Deposit status sheet |
181
+ | `infoSheet` | `BorderRadiusConfig` | Price impact & slippage info sheet |
182
+ | `webView` | `BorderRadiusConfig` | WebView sheet (inside buy with card) |
183
+
184
+ ```tsx
185
+ // Example: sharp top corners everywhere, except currency modal gets rounded
186
+ <UnifoldProvider
187
+ publishableKey="pk_live_..."
188
+ config={{
189
+ sheetBorderRadius: {
190
+ globalBorderTopLeftRadius: 0,
191
+ globalBorderTopRightRadius: 0,
192
+ currencyModal: { borderTopLeftRadius: 16, borderTopRightRadius: 16 },
193
+ },
194
+ }}
195
+ >
196
+ ```
154
197
 
155
198
  ### useUnifold Hook
156
199
 
@@ -213,6 +256,7 @@ import type {
213
256
  ThemeConfig,
214
257
  FontConfig,
215
258
  ComponentConfig,
259
+ BorderRadiusConfig,
216
260
  UnifoldProviderProps,
217
261
  } from '@unifold/connect-react-native';
218
262
  ```