1import { ComponentType, forwardRef } from 'react';
2import { StyleSheet, createElement } from 'react-native';
3
4import { TableTextProps } from '../primitives/Table';
5import { TextProps } from '../primitives/Text';
6import { ViewProps } from '../primitives/View';
7
8export const Table = forwardRef((props: ViewProps, ref) => {
9  return createElement('table', { ...props, style: [styles.reset, props.style], ref });
10}) as ComponentType<ViewProps>;
11
12export const THead = forwardRef((props: ViewProps, ref) => {
13  return createElement('thead', { ...props, style: [styles.reset, props.style], ref });
14}) as ComponentType<ViewProps>;
15
16export const TBody = forwardRef((props: ViewProps, ref) => {
17  return createElement('tbody', { ...props, style: [styles.reset, props.style], ref });
18}) as ComponentType<ViewProps>;
19
20export const TFoot = forwardRef((props: ViewProps, ref) => {
21  return createElement('tfoot', { ...props, style: [styles.reset, props.style], ref });
22}) as ComponentType<ViewProps>;
23
24export const TH = forwardRef((props: TableTextProps, ref) => {
25  return createElement('th', { ...props, style: [styles.reset, props.style], ref });
26}) as ComponentType<TableTextProps>;
27
28export const TR = forwardRef((props: ViewProps, ref) => {
29  return createElement('tr', { ...props, style: [styles.reset, props.style], ref });
30}) as ComponentType<ViewProps>;
31
32export const TD = forwardRef((props: TableTextProps, ref) => {
33  return createElement('td', { ...props, style: [styles.reset, props.style], ref });
34}) as ComponentType<TableTextProps>;
35
36export const Caption = forwardRef((props: TextProps, ref) => {
37  return createElement('caption', { ...props, style: [styles.reset, props.style], ref });
38}) as ComponentType<TextProps>;
39
40const styles = StyleSheet.create({
41  reset: {
42    fontFamily: 'System',
43    padding: 0,
44  },
45});
46