@wavemaker/app-rn-runtime 11.5.0-next.24738 → 11.5.0-next.24739
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.
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
function
|
|
1
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
3
|
+
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
2
4
|
import React from 'react';
|
|
3
5
|
import { Text, View } from 'react-native';
|
|
4
6
|
import { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';
|
|
@@ -8,16 +10,32 @@ import { DEFAULT_CLASS } from './label.styles';
|
|
|
8
10
|
import { isNil, toString } from 'lodash-es';
|
|
9
11
|
import { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';
|
|
10
12
|
import { createSkeleton } from '../skeleton/skeleton.component';
|
|
11
|
-
|
|
13
|
+
import WmAnchor from '../anchor/anchor.component';
|
|
14
|
+
export class WmLabelState extends BaseComponentState {
|
|
15
|
+
constructor() {
|
|
16
|
+
super(...arguments);
|
|
17
|
+
_defineProperty(this, "parts", []);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
12
20
|
export default class WmLabel extends BaseComponent {
|
|
13
21
|
constructor(props) {
|
|
14
|
-
super(props, DEFAULT_CLASS, new WmLabelProps());
|
|
22
|
+
super(props, DEFAULT_CLASS, new WmLabelProps(), new WmLabelState());
|
|
15
23
|
}
|
|
16
24
|
getAsterisk() {
|
|
17
25
|
return /*#__PURE__*/React.createElement(Text, {
|
|
18
26
|
style: this.styles.asterisk
|
|
19
27
|
}, "*");
|
|
20
28
|
}
|
|
29
|
+
onPropertyChange(name, $new, $old) {
|
|
30
|
+
super.onPropertyChange(name, $new, $old);
|
|
31
|
+
switch (name) {
|
|
32
|
+
case "caption":
|
|
33
|
+
this.updateState({
|
|
34
|
+
parts: this.parseCaption($new)
|
|
35
|
+
});
|
|
36
|
+
break;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
21
39
|
getMultilineSkeleton(width, height) {
|
|
22
40
|
const styles = {
|
|
23
41
|
borderRadius: 4,
|
|
@@ -30,6 +48,28 @@ export default class WmLabel extends BaseComponent {
|
|
|
30
48
|
height: height
|
|
31
49
|
});
|
|
32
50
|
}
|
|
51
|
+
parseCaption(caption) {
|
|
52
|
+
const pattern = /\[([^\]]+)\]\((http.*?[^)])\)/g;
|
|
53
|
+
const linkRegex = /^(http|https):\/\/[^ "]+$/;
|
|
54
|
+
const captionSplit = caption.split(pattern);
|
|
55
|
+
let parts = [];
|
|
56
|
+
for (let i = 0; i < captionSplit.length; i++) {
|
|
57
|
+
const isLink = linkRegex.test(captionSplit[i]);
|
|
58
|
+
let part = {};
|
|
59
|
+
const isNextTextALink = linkRegex.test(captionSplit[i + 1]) || false;
|
|
60
|
+
if (isLink) {
|
|
61
|
+
part.text = captionSplit[i - 1] ?? '';
|
|
62
|
+
part.link = captionSplit[i];
|
|
63
|
+
} else {
|
|
64
|
+
part.text = isNextTextALink ? "" : captionSplit[i];
|
|
65
|
+
}
|
|
66
|
+
;
|
|
67
|
+
if (part.text) {
|
|
68
|
+
parts.push(part);
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
return parts;
|
|
72
|
+
}
|
|
33
73
|
renderSkeleton(props) {
|
|
34
74
|
var _this$styles$root, _this$styles$root2;
|
|
35
75
|
const skeletonWidth = this.props.skeletonwidth || ((_this$styles$root = this.styles.root) === null || _this$styles$root === void 0 ? void 0 : _this$styles$root.width);
|
|
@@ -49,19 +89,29 @@ export default class WmLabel extends BaseComponent {
|
|
|
49
89
|
}
|
|
50
90
|
}
|
|
51
91
|
renderWidget(props) {
|
|
92
|
+
var _this$state$parts;
|
|
52
93
|
return !isNil(props.caption) ? /*#__PURE__*/React.createElement(Animatedview, {
|
|
53
94
|
entryanimation: props.animation,
|
|
54
95
|
style: this.styles.root
|
|
55
|
-
}, this._background, /*#__PURE__*/React.createElement(Tappable,
|
|
96
|
+
}, this._background, /*#__PURE__*/React.createElement(Tappable, {
|
|
56
97
|
target: this
|
|
57
|
-
}
|
|
98
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
99
|
+
style: {
|
|
100
|
+
flex: 1,
|
|
101
|
+
flexWrap: "wrap"
|
|
102
|
+
}
|
|
103
|
+
}, (_this$state$parts = this.state.parts) === null || _this$state$parts === void 0 ? void 0 : _this$state$parts.map((part, index) => /*#__PURE__*/React.createElement(React.Fragment, {
|
|
104
|
+
key: `part_${index}`
|
|
105
|
+
}, part.link ? /*#__PURE__*/React.createElement(WmAnchor, {
|
|
106
|
+
caption: part.text,
|
|
107
|
+
hyperlink: part.link
|
|
108
|
+
}) : /*#__PURE__*/React.createElement(Text, {
|
|
58
109
|
style: [this.styles.text, {
|
|
59
110
|
color: props.isValid === false ? 'red' : this.styles.text.color
|
|
60
|
-
}]
|
|
61
|
-
}, this.getTestPropsForLabel('caption'), {
|
|
111
|
+
}],
|
|
62
112
|
numberOfLines: props.wrap ? undefined : 1,
|
|
63
113
|
selectable: this.styles.text.userSelect === 'text'
|
|
64
|
-
}
|
|
114
|
+
}, toString(part.text), props.required && this.getAsterisk())))))) : null;
|
|
65
115
|
}
|
|
66
116
|
}
|
|
67
117
|
//# sourceMappingURL=label.component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","Tappable","WmLabelProps","DEFAULT_CLASS","isNil","toString","Animatedview","createSkeleton","
|
|
1
|
+
{"version":3,"names":["React","Text","View","BaseComponent","BaseComponentState","Tappable","WmLabelProps","DEFAULT_CLASS","isNil","toString","Animatedview","createSkeleton","WmAnchor","WmLabelState","constructor","arguments","_defineProperty","WmLabel","props","getAsterisk","createElement","style","styles","asterisk","onPropertyChange","name","$new","$old","updateState","parts","parseCaption","getMultilineSkeleton","width","height","borderRadius","marginBottom","theme","skeleton","caption","pattern","linkRegex","captionSplit","split","i","length","isLink","test","part","isNextTextALink","text","link","push","renderSkeleton","_this$styles$root","_this$styles$root2","skeletonWidth","skeletonwidth","root","skeletonHeight","skeletonheight","fontSize","multilineskeleton","renderWidget","_this$state$parts","entryanimation","animation","_background","target","flex","flexWrap","state","map","index","Fragment","key","hyperlink","color","isValid","numberOfLines","wrap","undefined","selectable","userSelect","required"],"sources":["label.component.tsx"],"sourcesContent":["import React from 'react';\nimport { DimensionValue, Text, View } from 'react-native';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { Tappable } from '@wavemaker/app-rn-runtime/core/tappable.component';\n\nimport WmLabelProps from './label.props';\nimport { DEFAULT_CLASS, WmLabelStyles } from './label.styles';\nimport { isNil, toString } from 'lodash-es';\nimport { Animatedview } from '@wavemaker/app-rn-runtime/components/basic/animatedview.component';\nimport WmSkeleton, { createSkeleton } from '../skeleton/skeleton.component';\nimport { totalMonths } from 'react-native-paper-dates/lib/typescript/Date/dateUtils';\nimport WmAnchor from '../anchor/anchor.component';\n\ntype PartType = {\n text?: string,\n link?: string,\n};\n\nexport class WmLabelState extends BaseComponentState<WmLabelProps> {\n parts: PartType[] = []\n}\n\nexport default class WmLabel extends BaseComponent<WmLabelProps, WmLabelState, WmLabelStyles> {\n\n constructor(props: WmLabelProps) {\n super(props, DEFAULT_CLASS, new WmLabelProps(), new WmLabelState());\n }\n\n private getAsterisk () {\n return <Text style={this.styles.asterisk}>*</Text>;\n }\n\n public onPropertyChange(name: string, $new: any, $old: any): void {\n super.onPropertyChange(name, $new, $old);\n\n switch(name) {\n case \"caption\":\n this.updateState({\n parts: this.parseCaption($new)\n } as WmLabelState);\n break;\n }\n }\n private getMultilineSkeleton(width: any, height: any) {\n const styles = {\n borderRadius:4,\n marginBottom: 10,\n height: height\n };\n return createSkeleton(this.theme, this.styles.skeleton, {\n ...styles,\n width: width,\n height: height\n });\n }\n\n parseCaption(caption: string) {\n const pattern = /\\[([^\\]]+)\\]\\((http.*?[^)])\\)/g;\n const linkRegex = /^(http|https):\\/\\/[^ \"]+$/;\n const captionSplit = caption.split(pattern);\n\n let parts = [];\n\n for (let i = 0; i < captionSplit.length; i++) {\n const isLink = linkRegex.test(captionSplit[i]);\n let part: PartType = {};\n \n const isNextTextALink = linkRegex.test(captionSplit[i + 1]) || false;\n if (isLink) {\n part.text = captionSplit[i - 1] ?? '';\n part.link = captionSplit[i];\n } else {\n part.text = isNextTextALink ? \"\" : captionSplit[i];\n };\n\n if (part.text) {\n parts.push(part);\n }\n }\n\n return parts;\n }\n\n public renderSkeleton(props: WmLabelProps){\n const skeletonWidth = this.props.skeletonwidth || this.styles.root?.width;\n const skeletonHeight = this.props.skeletonheight || this.styles.root?.height || this.styles.text.fontSize;\n if(this.props.multilineskeleton) {\n return (<View style={{\n width: skeletonWidth as DimensionValue\n }}>\n {this.getMultilineSkeleton('100%', skeletonHeight)}\n {this.getMultilineSkeleton('70%', skeletonHeight)}\n {this.getMultilineSkeleton('40%', skeletonHeight)}\n </View>)\n }\n else{\n return createSkeleton(this.theme, this.styles.skeleton, {\n ...this.styles.root,\n width: skeletonWidth as DimensionValue,\n height: skeletonHeight as DimensionValue\n }); \n }\n }\n\n renderWidget(props: WmLabelProps) {\n return !isNil(props.caption) ? (\n <Animatedview entryanimation={props.animation} style={this.styles.root}>\n {this._background}\n <Tappable target={this}>\n <Text style={{flex: 1, flexWrap: \"wrap\"}}>\n {this.state.parts?.map((part, index) => (\n <React.Fragment key={`part_${index}`}>\n {part.link ? (\n <WmAnchor caption={part.text} hyperlink={part.link} />\n ) : (\n <Text\n style={[\n this.styles.text,\n {\n color:\n props.isValid === false\n ? 'red'\n : this.styles.text.color,\n },\n ]}\n numberOfLines={props.wrap ? undefined : 1}\n selectable={this.styles.text.userSelect === 'text'}\n >\n {toString(part.text)}\n {props.required && this.getAsterisk()}\n </Text>\n )}\n </React.Fragment>\n ))}\n </Text>\n </Tappable>\n </Animatedview>\n ) : null;\n }\n}\n"],"mappings":"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"}
|
app-rn-runtime/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wavemaker/app-rn-runtime",
|
|
3
|
-
"version": "11.5.0-next.
|
|
3
|
+
"version": "11.5.0-next.24739",
|
|
4
4
|
"description": "''",
|
|
5
5
|
"main": "index",
|
|
6
6
|
"module": "index",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"@react-navigation/native": "6.1.7",
|
|
50
50
|
"@react-navigation/stack": "^6.3.7",
|
|
51
51
|
"@types/lodash-es": "^4.17.6",
|
|
52
|
-
"@wavemaker/variables": "11.5.0-next.
|
|
52
|
+
"@wavemaker/variables": "11.5.0-next.24739",
|
|
53
53
|
"axios": "^1.4.0",
|
|
54
54
|
"color": "4.2.3",
|
|
55
55
|
"cross-env": "^5.2.0",
|
|
@@ -128,7 +128,7 @@
|
|
|
128
128
|
"typescript": "^5.1.3",
|
|
129
129
|
"victory-native": "36.6.11",
|
|
130
130
|
"yargs": "^16.2.0",
|
|
131
|
-
"@wavemaker/variables": "11.5.0-next.
|
|
131
|
+
"@wavemaker/variables": "11.5.0-next.24739"
|
|
132
132
|
},
|
|
133
133
|
"jest": {
|
|
134
134
|
"preset": "react-native",
|