45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import { requireNativeViewManager } from 'expo-modules-core';
|
|
import type { JSX } from 'react';
|
|
import { processColor } from 'react-native';
|
|
|
|
import { NativeSymbolViewProps, SymbolViewProps } from './SymbolModule.types';
|
|
|
|
const NativeView: React.ComponentType<NativeSymbolViewProps> =
|
|
requireNativeViewManager('SymbolModule');
|
|
|
|
export function SymbolView(props: SymbolViewProps): JSX.Element {
|
|
if (!NativeView) {
|
|
return <>{props.fallback}</>;
|
|
}
|
|
|
|
const nativeProps = getNativeProps(props);
|
|
if (!nativeProps.name) {
|
|
return <>{props.fallback}</>;
|
|
}
|
|
|
|
return <NativeView {...nativeProps} />;
|
|
}
|
|
|
|
function getNativeProps(props: SymbolViewProps): NativeSymbolViewProps {
|
|
const colors = Array.isArray(props.colors) ? props.colors : props.colors ? [props.colors] : [];
|
|
const animated = !!props.animationSpec || false;
|
|
const type = props.type || 'monochrome';
|
|
const size = props.size || 24;
|
|
const style = props.style
|
|
? [{ width: size, height: size }, props.style]
|
|
: { width: size, height: size };
|
|
const name = typeof props.name === 'object' ? props.name.ios : props.name;
|
|
const weight = typeof props.weight === 'object' ? props.weight.ios : props.weight;
|
|
|
|
return {
|
|
...props,
|
|
name,
|
|
style,
|
|
colors: colors.map((c) => processColor(c)),
|
|
tint: processColor(props.tintColor),
|
|
weight,
|
|
animated,
|
|
type,
|
|
};
|
|
}
|