-
Notifications
You must be signed in to change notification settings - Fork 51
/
index.js
90 lines (82 loc) · 2.86 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
// @flow
/**
* Copyright (c) Garuda Labs, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
import * as Namespaces from 'hyperview/src/services/namespaces';
import * as Render from 'hyperview/src/services/render';
import * as ScrollContext from 'hyperview/src/services/scroll-context';
import type { InternalProps, Props } from './types';
import React, { PureComponent } from 'react';
import { ScrollView, View } from 'react-native';
import { addHref, createProps } from 'hyperview/src/services';
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scrollview';
import { LOCAL_NAME } from 'hyperview/src/types';
const ScrollViewWithScrollContext = ScrollContext.withScrollableComponent(
ScrollView,
);
const KeyboardAwareScrollViewWithScrollContext = ScrollContext.withScrollableComponent(
KeyboardAwareScrollView,
);
export default class HvView extends PureComponent<Props> {
static namespaceURI = Namespaces.HYPERVIEW;
static localName = LOCAL_NAME.VIEW;
static localNameAliases = [
LOCAL_NAME.BODY,
LOCAL_NAME.FORM,
LOCAL_NAME.HEADER,
LOCAL_NAME.ITEM,
LOCAL_NAME.SECTION_TITLE,
];
props: Props;
render() {
const { element, stylesheets, onUpdate, options } = this.props;
let viewOptions = options;
const { skipHref } = viewOptions || {};
const props: InternalProps = createProps(element, stylesheets, viewOptions);
const scrollable = !!element.getAttribute('scroll');
let Component = View;
const inputRefs = [];
if (scrollable) {
const textFields = element.getElementsByTagNameNS(
Namespaces.HYPERVIEW,
'text-field',
);
const textAreas = element.getElementsByTagNameNS(
Namespaces.HYPERVIEW,
'text-area',
);
const hasFields = textFields.length > 0 || textAreas.length > 0;
Component = hasFields
? KeyboardAwareScrollViewWithScrollContext
: ScrollViewWithScrollContext;
props.id = element.getAttribute('id');
if (hasFields) {
props.extraScrollHeight = 32;
props.keyboardOpeningTime = 0;
props.keyboardShouldPersistTaps = 'handled';
props.scrollEventThrottle = 16;
props.getTextInputRefs = () => inputRefs;
const registerInputHandler = ref => {
inputRefs.push(ref);
};
viewOptions = { ...viewOptions, registerInputHandler };
}
const scrollDirection = element.getAttribute('scroll-orientation');
if (scrollDirection === 'horizontal') {
props.horizontal = true;
}
}
const component = React.createElement(
Component,
props,
...Render.renderChildren(element, stylesheets, onUpdate, viewOptions),
);
return skipHref
? component
: addHref(component, element, stylesheets, onUpdate, viewOptions);
}
}