1import React, { ComponentType, forwardRef } from 'react';
2import { Platform } from 'react-native';
3
4import View, { ViewProps } from '../primitives/View';
5
6function createView(nativeProps: ViewProps = {}): ComponentType<ViewProps> {
7  return forwardRef((props: ViewProps, ref) => {
8    return <View {...nativeProps} {...props} ref={ref} />;
9  }) as ComponentType<ViewProps>;
10}
11
12export const Div = createView();
13
14export const Nav = createView(
15  Platform.select({
16    web: {
17      accessibilityRole: 'navigation',
18    },
19  })
20);
21export const Footer = createView(
22  Platform.select({
23    web: {
24      accessibilityRole: 'contentinfo',
25    },
26  })
27);
28export const Aside = createView(
29  Platform.select({
30    web: {
31      accessibilityRole: 'complementary',
32    },
33  })
34);
35export const Header = createView(
36  Platform.select({
37    web: {
38      accessibilityRole: 'banner',
39    },
40    default: {
41      accessibilityRole: 'header',
42    },
43  })
44);
45export const Main = createView(
46  Platform.select({
47    web: {
48      accessibilityRole: 'main',
49    },
50  })
51);
52export const Article = createView(
53  Platform.select({
54    web: {
55      accessibilityRole: 'article',
56    },
57  })
58);
59export const Section = createView({
60  accessibilityRole: 'summary', // region?
61});
62