@onehat/ui 0.2.25 → 0.2.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -9,6 +9,7 @@ import Editor from 'ckeditor5-custom-build/build/ckeditor.js'; // built using ht
|
|
|
9
9
|
import { CKEditor } from '@ckeditor/ckeditor5-react'; // https://ckeditor.com/docs/ckeditor5/latest/installation/frameworks/react.html
|
|
10
10
|
import withValue from '../../../Hoc/withValue.js';
|
|
11
11
|
import withTooltip from '../../../Hoc/withTooltip.js';
|
|
12
|
+
import _ from 'lodash';
|
|
12
13
|
import './styles.css';
|
|
13
14
|
|
|
14
15
|
const
|
|
@@ -18,9 +18,6 @@ import withEditor from './withEditor.js';
|
|
|
18
18
|
import _ from 'lodash';
|
|
19
19
|
|
|
20
20
|
export default function withInlineEditor(WrappedComponent) {
|
|
21
|
-
if (UiGlobals.mode === UI_MODE_REACT_NATIVE) {
|
|
22
|
-
throw new Error('Not yet implemented for RN.');
|
|
23
|
-
}
|
|
24
21
|
return withEditor((props) => {
|
|
25
22
|
const {
|
|
26
23
|
useEditor = false,
|
|
@@ -69,6 +66,9 @@ export default function withInlineEditor(WrappedComponent) {
|
|
|
69
66
|
if (isEditorShown && selection.length !== 1) {
|
|
70
67
|
throw new Error('Can only edit one at a time with inline editor!');
|
|
71
68
|
}
|
|
69
|
+
if (UiGlobals.mode === UI_MODE_REACT_NATIVE) {
|
|
70
|
+
throw new Error('Not yet implemented for RN.');
|
|
71
|
+
}
|
|
72
72
|
|
|
73
73
|
return <>
|
|
74
74
|
<WrappedComponent
|
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import {
|
|
3
3
|
Column,
|
|
4
4
|
Icon,
|
|
5
|
+
Pressable,
|
|
5
6
|
Row,
|
|
6
7
|
Text,
|
|
7
8
|
} from 'native-base';
|
|
@@ -106,7 +107,90 @@ export default function Header(props) {
|
|
|
106
107
|
|
|
107
108
|
} else if (CURRENT_MODE === UI_MODE_REACT_NATIVE) {
|
|
108
109
|
|
|
109
|
-
|
|
110
|
+
if (isCollapsed) {
|
|
111
|
+
if (collapseDirection === HORIZONTAL) {
|
|
112
|
+
collapseBtn = React.cloneElement(collapseBtn, { my: 2, mr: 1, });
|
|
113
|
+
return <Pressable
|
|
114
|
+
testID={testID}
|
|
115
|
+
flex={1}
|
|
116
|
+
w="100%"
|
|
117
|
+
style={{ userSelect: 'none', ...doubleClickStyle, }}
|
|
118
|
+
onPress={(e) => {
|
|
119
|
+
switch (e.detail) {
|
|
120
|
+
case 1: // single click
|
|
121
|
+
break;
|
|
122
|
+
case 2: // double click
|
|
123
|
+
if (isCollapsible) {
|
|
124
|
+
onToggleCollapse(e);
|
|
125
|
+
}
|
|
126
|
+
break;
|
|
127
|
+
case 3: // triple click
|
|
128
|
+
break;
|
|
129
|
+
default:
|
|
130
|
+
}
|
|
131
|
+
}}
|
|
132
|
+
>
|
|
133
|
+
<Column
|
|
134
|
+
alignItems="center"
|
|
135
|
+
justifyContent="flex-start"
|
|
136
|
+
h="100%"
|
|
137
|
+
w="100%"
|
|
138
|
+
bg={styles.PANEL_HEADER_BG_VERTICAL}
|
|
139
|
+
style={{ userSelect: 'none', }}
|
|
140
|
+
>
|
|
141
|
+
{collapseBtn}
|
|
142
|
+
<Text
|
|
143
|
+
flex={1}
|
|
144
|
+
fontSize={styles.PANEL_HEADER_TEXT_FONTSIZE}
|
|
145
|
+
color={styles.PANEL_HEADER_TEXT_COLOR}
|
|
146
|
+
numberOfLines={1}
|
|
147
|
+
ellipsizeMode="head"
|
|
148
|
+
style={{transform: [{ rotate: '-90deg'}]}}
|
|
149
|
+
>{title}</Text>
|
|
150
|
+
</Column>
|
|
151
|
+
</Pressable>;
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
return <Pressable
|
|
156
|
+
testID={testID}
|
|
157
|
+
flex={1}
|
|
158
|
+
w="100%"
|
|
159
|
+
style={{ userSelect: 'none', ...doubleClickStyle, }}
|
|
160
|
+
onPress={(e) => {
|
|
161
|
+
switch (e.detail) {
|
|
162
|
+
case 1: // single click
|
|
163
|
+
break;
|
|
164
|
+
case 2: // double click
|
|
165
|
+
if (isCollapsible) {
|
|
166
|
+
onToggleCollapse(e);
|
|
167
|
+
}
|
|
168
|
+
break;
|
|
169
|
+
case 3: // triple click
|
|
170
|
+
break;
|
|
171
|
+
default:
|
|
172
|
+
}
|
|
173
|
+
}}
|
|
174
|
+
>
|
|
175
|
+
<Row
|
|
176
|
+
alignItems="center"
|
|
177
|
+
justifyContent="flex-start"
|
|
178
|
+
px={styles.PANEL_HEADER_PX}
|
|
179
|
+
py={styles.PANEL_HEADER_PY}
|
|
180
|
+
bg={styles.PANEL_HEADER_BG}
|
|
181
|
+
style={{ userSelect: 'none', }}
|
|
182
|
+
>
|
|
183
|
+
{closeBtn}
|
|
184
|
+
<Text
|
|
185
|
+
flex={1}
|
|
186
|
+
fontSize={styles.PANEL_HEADER_TEXT_FONTSIZE}
|
|
187
|
+
color={styles.PANEL_HEADER_TEXT_COLOR}
|
|
188
|
+
numberOfLines={1}
|
|
189
|
+
ellipsizeMode="head"
|
|
190
|
+
>{title}</Text>
|
|
191
|
+
{collapseBtn}
|
|
192
|
+
</Row>
|
|
193
|
+
</Pressable>;
|
|
110
194
|
|
|
111
195
|
}
|
|
112
196
|
|
|
@@ -3,7 +3,7 @@ import Datetime from '../PlatformImports/ReactNative/Datetime';
|
|
|
3
3
|
import Draggable from '../PlatformImports/ReactNative/Draggable';
|
|
4
4
|
import _ from 'lodash';
|
|
5
5
|
|
|
6
|
-
export function registerReactNativeComponents() {
|
|
6
|
+
export default function registerReactNativeComponents() {
|
|
7
7
|
_.merge(UiGlobals.components, {
|
|
8
8
|
Datetime,
|
|
9
9
|
Draggable,
|