@wavemaker/app-rn-runtime 12.0.0-next.44005 → 12.0.0-next.45001
Sign up to get free protection for your applications and to get access to all the features.
@@ -86,10 +86,8 @@ export default class WmSlider extends BaseComponent {
|
|
86
86
|
}
|
87
87
|
case 'maxvalue':
|
88
88
|
case 'minvalue':
|
89
|
-
|
90
|
-
|
91
|
-
this.computePosition(this.state.props.datavalue);
|
92
|
-
}
|
89
|
+
this.setProp('datavalue', this.getDataValue() || 0);
|
90
|
+
this.computePosition(this.state.props.datavalue);
|
93
91
|
}
|
94
92
|
}
|
95
93
|
computePosition(datavalue) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","View","Text","TouchableOpacity","Animated","debounce","isNumber","isNil","Gesture","GestureDetector","BackgroundComponent","BaseComponent","BaseComponentState","WmSliderProps","DEFAULT_CLASS","isWebPreviewMode","AccessibilityWidgetType","getAccessibilityProps","WmSliderState","constructor","arguments","_defineProperty","WmSlider","props","Value","Pan","value","state","datavalue","updateState","onFieldChange","e","layout","nativeEvent","track","top","y","left","x","width","height","computePosition","configureGesture","trackGesture","knobGesture","getValueFromGesture","positionX","factor","step","maxvalue","minvalue","Math","round","max","min","gesture","maxPointers","minDistance","onChange","absoluteX","forceUpdate","onEnd","getDataValue","onPropertyChange","name","$new","$old","invokeEventCallback","initialized","setProp","_this$state$track","_this$position","position","setValue","isNaN","renderWidget","_this$state$track2","createElement","style","styles","root","_background","flexDirection","justifyContent","_extends","getTestProps","text","minimumValue","maximumValue","activeOpacity","onLayout","onLayoutChange","SLIDER","minimumTrack","transform","translateX","interpolate","inputRange","outputRange","maximumTrack","thumb","accessible","accessibilityLabel","size","backgroundSize","backgroundPosition","image","backgroundImage","repeat","backgroundRepeat"],"sources":["slider.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, LayoutChangeEvent, TouchableOpacity, Animated, Easing } from 'react-native';\nimport { debounce, isNumber, isNil } from 'lodash';\nimport { Gesture, GestureDetector, PanGesture } from 'react-native-gesture-handler';\nimport { BackgroundComponent } from '@wavemaker/app-rn-runtime/styles/background.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmSliderProps from './slider.props';\nimport { DEFAULT_CLASS, WmSliderStyles } from './slider.styles';\nimport { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';\n\nexport class WmSliderState extends BaseComponentState<WmSliderProps> {\n track?: {\n top: number,\n left: number,\n width: number,\n height: number\n };\n}\n\nexport default class WmSlider extends BaseComponent<WmSliderProps, WmSliderState, WmSliderStyles> {\n valueBeforeSlide: number = 0;\n private position = new Animated.Value(0);\n private trackGesture = Gesture.Pan();\n private knobGesture = Gesture.Pan();\n\n constructor(props: WmSliderProps) {\n super(props, DEFAULT_CLASS, new WmSliderProps());\n this.configureGesture(this.trackGesture);\n this.configureGesture(this.knobGesture);\n }\n\n getValueFromGesture(positionX: number) {\n if (this.state.track) {\n const factor = (positionX - this.state.track.left) / this.state.track.width;\n const props = this.state.props;\n const step = props.step || (props.maxvalue - props.minvalue) / 100;\n let value = Math.round((factor * props.maxvalue + props.minvalue) / step) * step;\n return Math.max(Math.min(props.maxvalue, value), props.minvalue);\n }\n return 0;\n };\n\n configureGesture(gesture: PanGesture) {\n gesture\n .maxPointers(1)\n .minDistance(0)\n .onChange(e => {\n const value = this.getValueFromGesture(e.absoluteX);\n this.computePosition(value);\n this.forceUpdate();\n })\n .onEnd(e => {\n if (this.state.track) {\n const value = this.getValueFromGesture(e.absoluteX);\n this.onChange(value);\n this.forceUpdate();\n }\n })\n }\n\n getDataValue() {\n if (isNil(this.props.datavalue)) {\n return this.state.props.minvalue + (this.state.props.maxvalue - this.state.props.minvalue)/2;\n }\n return Math.min(Math.max(this.props.datavalue, this.state.props.minvalue), this.state.props.maxvalue);\n }\n\n onPropertyChange(name: string, $new: any, $old: any) {\n switch(name) {\n case 'datavalue':\n if (isNumber($new) && isNumber($old)) {\n this.invokeEventCallback('onChange', [null, this, $new, $old]);\n }\n case 'maxvalue':\n case 'minvalue': \n if (this.initialized) {\n this.setProp('datavalue', this.getDataValue() || 0)\n this.computePosition(this.state.props.datavalue);\n }\n }\n }\n\n onChange = debounce((value: number) => {\n if (this.state.props.datavalue !== value) {\n this.updateState({\n props : {\n datavalue: value\n }\n } as WmSliderState);\n this.props.onFieldChange &&\n this.props.onFieldChange(\n 'datavalue',\n value,\n this.state.props.datavalue\n );\n }\n }, 200);\n\n computePosition(datavalue: number) {\n const props = this.state.props;\n const width = this.state.track?.width || 0;\n const value = ((datavalue - props.minvalue) / props.maxvalue) * (width);\n this.position?.setValue(isNaN(value) ? 0 : value);\n }\n\n onLayoutChange = (e: LayoutChangeEvent) => {\n const layout = e.nativeEvent.layout;\n this.updateState({\n track: {\n top: isWebPreviewMode() ? (layout as any).top : layout.y,\n left: isWebPreviewMode() ? (layout as any).left : layout.x,\n width: layout.width,\n height: layout.height\n }\n } as WmSliderState, () => this.computePosition(this.state.props.datavalue));\n }\n\n renderWidget(props: WmSliderProps) {\n const width = this.state.track?.width || 0;\n return (\n <View style={this.styles.root}>\n {this._background}\n <View style={{flexDirection:'row', justifyContent:'space-between'}}>\n <Text {...this.getTestProps('min')} style={[this.styles.text, this.styles.minimumValue]}>{props.minvalue}</Text>\n <Text {...this.getTestProps('value')} style={[this.styles.text, this.styles.value]}>{props.datavalue}</Text>\n <Text {...this.getTestProps('max')} style={[this.styles.text, this.styles.maximumValue]}>{props.maxvalue}</Text>\n </View>\n <GestureDetector gesture={this.trackGesture}>\n <TouchableOpacity\n activeOpacity={1} \n style={this.styles.track}\n onLayout={this.onLayoutChange}\n {...this.getTestProps()}\n {...getAccessibilityProps(AccessibilityWidgetType.SLIDER, props)}>\n <Animated.View style={[this.styles.minimumTrack, {\n width: width,\n transform: [{\n translateX: this.position.interpolate({\n inputRange: [0, width],\n outputRange: [-width, 0]\n })\n }]\n }]}></Animated.View>\n <Animated.View style={[this.styles.maximumTrack, {\n width: width,\n transform: [{\n translateX: this.position\n }]\n }]}></Animated.View>\n </TouchableOpacity>\n </GestureDetector>\n <GestureDetector gesture={this.knobGesture}>\n <Animated.View style={[this.styles.thumb, {\n transform: [{\n translateX: this.position\n }]\n }]}\n accessible={true}\n accessibilityLabel={'Thumb'}\n >\n <BackgroundComponent\n size={(this.styles.thumb as any).backgroundSize || 'contain'}\n position={(this.styles.thumb as any).backgroundPosition}\n image={(this.styles.thumb as any).backgroundImage}\n repeat={(this.styles.thumb as any).backgroundRepeat || 'no-repeat'}> \n </BackgroundComponent>\n </Animated.View>\n </GestureDetector>\n </View>);\n }\n}\n"],"mappings":"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"}
|
1
|
+
{"version":3,"names":["React","View","Text","TouchableOpacity","Animated","debounce","isNumber","isNil","Gesture","GestureDetector","BackgroundComponent","BaseComponent","BaseComponentState","WmSliderProps","DEFAULT_CLASS","isWebPreviewMode","AccessibilityWidgetType","getAccessibilityProps","WmSliderState","constructor","arguments","_defineProperty","WmSlider","props","Value","Pan","value","state","datavalue","updateState","onFieldChange","e","layout","nativeEvent","track","top","y","left","x","width","height","computePosition","configureGesture","trackGesture","knobGesture","getValueFromGesture","positionX","factor","step","maxvalue","minvalue","Math","round","max","min","gesture","maxPointers","minDistance","onChange","absoluteX","forceUpdate","onEnd","getDataValue","onPropertyChange","name","$new","$old","invokeEventCallback","setProp","_this$state$track","_this$position","position","setValue","isNaN","renderWidget","_this$state$track2","createElement","style","styles","root","_background","flexDirection","justifyContent","_extends","getTestProps","text","minimumValue","maximumValue","activeOpacity","onLayout","onLayoutChange","SLIDER","minimumTrack","transform","translateX","interpolate","inputRange","outputRange","maximumTrack","thumb","accessible","accessibilityLabel","size","backgroundSize","backgroundPosition","image","backgroundImage","repeat","backgroundRepeat"],"sources":["slider.component.tsx"],"sourcesContent":["import React from 'react';\nimport { View, Text, LayoutChangeEvent, TouchableOpacity, Animated, Easing } from 'react-native';\nimport { debounce, isNumber, isNil } from 'lodash';\nimport { Gesture, GestureDetector, PanGesture } from 'react-native-gesture-handler';\nimport { BackgroundComponent } from '@wavemaker/app-rn-runtime/styles/background.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmSliderProps from './slider.props';\nimport { DEFAULT_CLASS, WmSliderStyles } from './slider.styles';\nimport { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';\nimport { AccessibilityWidgetType, getAccessibilityProps } from '@wavemaker/app-rn-runtime/core/accessibility';\n\nexport class WmSliderState extends BaseComponentState<WmSliderProps> {\n track?: {\n top: number,\n left: number,\n width: number,\n height: number\n };\n}\n\nexport default class WmSlider extends BaseComponent<WmSliderProps, WmSliderState, WmSliderStyles> {\n valueBeforeSlide: number = 0;\n private position = new Animated.Value(0);\n private trackGesture = Gesture.Pan();\n private knobGesture = Gesture.Pan();\n\n constructor(props: WmSliderProps) {\n super(props, DEFAULT_CLASS, new WmSliderProps());\n this.configureGesture(this.trackGesture);\n this.configureGesture(this.knobGesture);\n }\n\n getValueFromGesture(positionX: number) {\n if (this.state.track) {\n const factor = (positionX - this.state.track.left) / this.state.track.width;\n const props = this.state.props;\n const step = props.step || (props.maxvalue - props.minvalue) / 100;\n let value = Math.round((factor * props.maxvalue + props.minvalue) / step) * step;\n return Math.max(Math.min(props.maxvalue, value), props.minvalue);\n }\n return 0;\n };\n\n configureGesture(gesture: PanGesture) {\n gesture\n .maxPointers(1)\n .minDistance(0)\n .onChange(e => {\n const value = this.getValueFromGesture(e.absoluteX);\n this.computePosition(value);\n this.forceUpdate();\n })\n .onEnd(e => {\n if (this.state.track) {\n const value = this.getValueFromGesture(e.absoluteX);\n this.onChange(value);\n this.forceUpdate();\n }\n })\n }\n\n getDataValue() {\n if (isNil(this.props.datavalue)) {\n return this.state.props.minvalue + (this.state.props.maxvalue - this.state.props.minvalue)/2;\n }\n return Math.min(Math.max(this.props.datavalue, this.state.props.minvalue), this.state.props.maxvalue);\n }\n\n onPropertyChange(name: string, $new: any, $old: any) {\n switch(name) {\n case 'datavalue':\n if (isNumber($new) && isNumber($old)) {\n this.invokeEventCallback('onChange', [null, this, $new, $old]);\n }\n case 'maxvalue':\n case 'minvalue': \n this.setProp('datavalue', this.getDataValue() || 0)\n this.computePosition(this.state.props.datavalue);\n }\n }\n\n onChange = debounce((value: number) => {\n if (this.state.props.datavalue !== value) {\n this.updateState({\n props : {\n datavalue: value\n }\n } as WmSliderState);\n this.props.onFieldChange &&\n this.props.onFieldChange(\n 'datavalue',\n value,\n this.state.props.datavalue\n );\n }\n }, 200);\n\n computePosition(datavalue: number) {\n const props = this.state.props;\n const width = this.state.track?.width || 0;\n const value = ((datavalue - props.minvalue) / props.maxvalue) * (width);\n this.position?.setValue(isNaN(value) ? 0 : value);\n }\n\n onLayoutChange = (e: LayoutChangeEvent) => {\n const layout = e.nativeEvent.layout;\n this.updateState({\n track: {\n top: isWebPreviewMode() ? (layout as any).top : layout.y,\n left: isWebPreviewMode() ? (layout as any).left : layout.x,\n width: layout.width,\n height: layout.height\n }\n } as WmSliderState, () => this.computePosition(this.state.props.datavalue));\n }\n\n renderWidget(props: WmSliderProps) {\n const width = this.state.track?.width || 0;\n return (\n <View style={this.styles.root}>\n {this._background}\n <View style={{flexDirection:'row', justifyContent:'space-between'}}>\n <Text {...this.getTestProps('min')} style={[this.styles.text, this.styles.minimumValue]}>{props.minvalue}</Text>\n <Text {...this.getTestProps('value')} style={[this.styles.text, this.styles.value]}>{props.datavalue}</Text>\n <Text {...this.getTestProps('max')} style={[this.styles.text, this.styles.maximumValue]}>{props.maxvalue}</Text>\n </View>\n <GestureDetector gesture={this.trackGesture}>\n <TouchableOpacity\n activeOpacity={1} \n style={this.styles.track}\n onLayout={this.onLayoutChange}\n {...this.getTestProps()}\n {...getAccessibilityProps(AccessibilityWidgetType.SLIDER, props)}>\n <Animated.View style={[this.styles.minimumTrack, {\n width: width,\n transform: [{\n translateX: this.position.interpolate({\n inputRange: [0, width],\n outputRange: [-width, 0]\n })\n }]\n }]}></Animated.View>\n <Animated.View style={[this.styles.maximumTrack, {\n width: width,\n transform: [{\n translateX: this.position\n }]\n }]}></Animated.View>\n </TouchableOpacity>\n </GestureDetector>\n <GestureDetector gesture={this.knobGesture}>\n <Animated.View style={[this.styles.thumb, {\n transform: [{\n translateX: this.position\n }]\n }]}\n accessible={true}\n accessibilityLabel={'Thumb'}\n >\n <BackgroundComponent\n size={(this.styles.thumb as any).backgroundSize || 'contain'}\n position={(this.styles.thumb as any).backgroundPosition}\n image={(this.styles.thumb as any).backgroundImage}\n repeat={(this.styles.thumb as any).backgroundRepeat || 'no-repeat'}> \n </BackgroundComponent>\n </Animated.View>\n </GestureDetector>\n </View>);\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": "12.0.0-next.
|
3
|
+
"version": "12.0.0-next.45001",
|
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": "12.0.0-next.
|
52
|
+
"@wavemaker/variables": "12.0.0-next.45001",
|
53
53
|
"axios": "^1.4.0",
|
54
54
|
"color": "4.2.3",
|
55
55
|
"cross-env": "^5.2.0",
|
@@ -131,7 +131,7 @@
|
|
131
131
|
"typescript": "^5.1.3",
|
132
132
|
"victory-native": "36.6.11",
|
133
133
|
"yargs": "^16.2.0",
|
134
|
-
"@wavemaker/variables": "12.0.0-next.
|
134
|
+
"@wavemaker/variables": "12.0.0-next.45001"
|
135
135
|
},
|
136
136
|
"jest": {
|
137
137
|
"preset": "react-native",
|