@danielsaraldi/react-native-blur-view
Version:
A simple blur view in react native
71 lines (65 loc) • 1.56 kB
text/typescript
import type { ViewProps } from 'react-native';
/**
* @type {BlurViewIosType}
*
* @description Type for the color type of the overlay in iOS.
*/
export type BlurViewIosType =
| 'x-light'
| 'light'
| 'dark'
| 'thin-material'
| 'thin-material-light'
| 'thin-material-dark'
| 'material'
| 'material-light'
| 'material-dark'
| 'chrome-material'
| 'chrome-material-light'
| 'chrome-material-dark'
| 'thick-material'
| 'thick-material-light'
| 'thick-material-dark'
| 'ultra-thin-material'
| 'ultra-thin-material-light'
| 'ultra-thin-material-dark'
| 'regular'
| 'prominent';
/**
* @interface BlurViewIosProps
*
* @description Props for the BlurView component on iOS.
*/
export interface BlurViewIosProps extends ViewProps {
/**
* @description Set the color type of the overlay.
*
* @default 'light'
*/
type?: BlurViewIosType;
/**
* @description Set the blur radius. It accepts a number between `0` and
* `100`.
*
* @default 10
*/
radius?: number;
/**
* @description Style for the `BlurView` component children content. In
* **Android**, you can use `style` to set blur style content.
*
* @default { zIndex: 9999, position: 'absolute' }
*
* @platform iOS
*/
contentStyle?: ViewProps['style'];
/**
* @description Style for the `BlurView` component. In **Android**, you can
* use `style` to set blur style content.
*
* @default { zIndex: 9999, backgroundColor: 'transparent' }
*
* @platform iOS
*/
blurStyle?: ViewProps['style'];
}