@wavemaker/app-rn-runtime 11.6.0-rc.5488 → 11.7.0-next.42251
Sign up to get free protection for your applications and to get access to all the features.
- app-rn-runtime/components/advanced/carousel/carousel.component.js +14 -9
- app-rn-runtime/components/advanced/carousel/carousel.component.js.map +1 -1
- app-rn-runtime/components/advanced/carousel/carousel.styles.js +6 -3
- app-rn-runtime/components/advanced/carousel/carousel.styles.js.map +1 -1
- app-rn-runtime/components/advanced/webview/webview.component.js +33 -14
- app-rn-runtime/components/advanced/webview/webview.component.js.map +1 -1
- app-rn-runtime/components/advanced/webview/webview.props.js +3 -1
- app-rn-runtime/components/advanced/webview/webview.props.js.map +1 -1
- app-rn-runtime/components/basic/anchor/anchor.component.js +22 -8
- app-rn-runtime/components/basic/anchor/anchor.component.js.map +1 -1
- app-rn-runtime/components/basic/anchor/anchor.props.js +7 -0
- app-rn-runtime/components/basic/anchor/anchor.props.js.map +1 -1
- app-rn-runtime/components/basic/anchor/anchor.styles.js +3 -1
- app-rn-runtime/components/basic/anchor/anchor.styles.js.map +1 -1
- app-rn-runtime/components/basic/animatedview.component.js +5 -3
- app-rn-runtime/components/basic/animatedview.component.js.map +1 -1
- app-rn-runtime/components/basic/button/button.component.js +41 -8
- app-rn-runtime/components/basic/button/button.component.js.map +1 -1
- app-rn-runtime/components/basic/button/button.props.js +7 -0
- app-rn-runtime/components/basic/button/button.props.js.map +1 -1
- app-rn-runtime/components/basic/button/button.styles.js +9 -10
- app-rn-runtime/components/basic/button/button.styles.js.map +1 -1
- app-rn-runtime/components/basic/buttongroup/buttongroup.styles.js +13 -5
- app-rn-runtime/components/basic/buttongroup/buttongroup.styles.js.map +1 -1
- app-rn-runtime/components/basic/icon/icon.component.js +64 -12
- app-rn-runtime/components/basic/icon/icon.component.js.map +1 -1
- app-rn-runtime/components/basic/icon/icon.props.js +7 -0
- app-rn-runtime/components/basic/icon/icon.props.js.map +1 -1
- app-rn-runtime/components/basic/icon/icon.styles.js +2 -1
- app-rn-runtime/components/basic/icon/icon.styles.js.map +1 -1
- app-rn-runtime/components/basic/label/label.component.js +34 -25
- app-rn-runtime/components/basic/label/label.component.js.map +1 -1
- app-rn-runtime/components/basic/label/label.props.js +4 -0
- app-rn-runtime/components/basic/label/label.props.js.map +1 -1
- app-rn-runtime/components/basic/label/label.styles.js +4 -5
- app-rn-runtime/components/basic/label/label.styles.js.map +1 -1
- app-rn-runtime/components/basic/message/message.component.js +3 -2
- app-rn-runtime/components/basic/message/message.component.js.map +1 -1
- app-rn-runtime/components/basic/message/message.props.js +3 -0
- app-rn-runtime/components/basic/message/message.props.js.map +1 -1
- app-rn-runtime/components/basic/message/message.styles.js +3 -1
- app-rn-runtime/components/basic/message/message.styles.js.map +1 -1
- app-rn-runtime/components/basic/picture/picture.component.js +4 -2
- app-rn-runtime/components/basic/picture/picture.component.js.map +1 -1
- app-rn-runtime/components/basic/picture/picture.props.js +3 -0
- app-rn-runtime/components/basic/picture/picture.props.js.map +1 -1
- app-rn-runtime/components/basic/picture/picture.styles.js +3 -1
- app-rn-runtime/components/basic/picture/picture.styles.js.map +1 -1
- app-rn-runtime/components/basic/progress-bar/progress-bar.component.js +3 -3
- app-rn-runtime/components/basic/progress-bar/progress-bar.component.js.map +1 -1
- app-rn-runtime/components/basic/progress-bar/progress-bar.props.js +2 -0
- app-rn-runtime/components/basic/progress-bar/progress-bar.props.js.map +1 -1
- app-rn-runtime/components/basic/progress-circle/progress-circle.component.js +3 -2
- app-rn-runtime/components/basic/progress-circle/progress-circle.component.js.map +1 -1
- app-rn-runtime/components/basic/progress-circle/progress-circle.props.js +2 -0
- app-rn-runtime/components/basic/progress-circle/progress-circle.props.js.map +1 -1
- app-rn-runtime/components/basic/search/search.component.js +2 -1
- app-rn-runtime/components/basic/search/search.component.js.map +1 -1
- app-rn-runtime/components/basic/search/search.props.js +3 -0
- app-rn-runtime/components/basic/search/search.props.js.map +1 -1
- app-rn-runtime/components/basic/search/search.styles.js +6 -5
- app-rn-runtime/components/basic/search/search.styles.js.map +1 -1
- app-rn-runtime/components/basic/skeleton/skeleton.component.js +0 -1
- app-rn-runtime/components/basic/skeleton/skeleton.component.js.map +1 -1
- app-rn-runtime/components/basic/video/video.component.js +4 -2
- app-rn-runtime/components/basic/video/video.component.js.map +1 -1
- app-rn-runtime/components/basic/video/video.props.js +3 -0
- app-rn-runtime/components/basic/video/video.props.js.map +1 -1
- app-rn-runtime/components/chart/area-chart/area-chart.component.js +34 -24
- app-rn-runtime/components/chart/area-chart/area-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/bar-chart/bar-chart.component.js +29 -16
- app-rn-runtime/components/chart/bar-chart/bar-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/bar-chart/bar-chart.props.js +0 -2
- app-rn-runtime/components/chart/bar-chart/bar-chart.props.js.map +1 -1
- app-rn-runtime/components/chart/basechart.component.js +33 -7
- app-rn-runtime/components/chart/basechart.component.js.map +1 -1
- app-rn-runtime/components/chart/basechart.props.js +7 -2
- app-rn-runtime/components/chart/basechart.props.js.map +1 -1
- app-rn-runtime/components/chart/basechart.styles.js +9 -2
- app-rn-runtime/components/chart/basechart.styles.js.map +1 -1
- app-rn-runtime/components/chart/bubble-chart/bubble-chart.component.js +4 -2
- app-rn-runtime/components/chart/bubble-chart/bubble-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/line-chart/line-chart.component.js +27 -20
- app-rn-runtime/components/chart/line-chart/line-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/line-chart/line-chart.props.js.map +1 -1
- app-rn-runtime/components/chart/pie-chart/pie-chart.component.js +7 -4
- app-rn-runtime/components/chart/pie-chart/pie-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/stack-chart/stack-chart.component.js +33 -10
- app-rn-runtime/components/chart/stack-chart/stack-chart.component.js.map +1 -1
- app-rn-runtime/components/chart/stack-chart/stack-chart.props.js +1 -0
- app-rn-runtime/components/chart/stack-chart/stack-chart.props.js.map +1 -1
- app-rn-runtime/components/chart/staticdata.js +215 -0
- app-rn-runtime/components/chart/staticdata.js.map +1 -0
- app-rn-runtime/components/container/container.component.js +11 -2
- app-rn-runtime/components/container/container.component.js.map +1 -1
- app-rn-runtime/components/container/container.props.js +1 -0
- app-rn-runtime/components/container/container.props.js.map +1 -1
- app-rn-runtime/components/container/panel/panel.component.js +6 -2
- app-rn-runtime/components/container/panel/panel.component.js.map +1 -1
- app-rn-runtime/components/container/panel/panel.props.js +4 -0
- app-rn-runtime/components/container/panel/panel.props.js.map +1 -1
- app-rn-runtime/components/container/tabs/tabheader/tabheader.styles.js +1 -1
- app-rn-runtime/components/container/tabs/tabheader/tabheader.styles.js.map +1 -1
- app-rn-runtime/components/container/wizard/wizard.component.js +17 -14
- app-rn-runtime/components/container/wizard/wizard.component.js.map +1 -1
- app-rn-runtime/components/container/wizard/wizard.styles.js +19 -3
- app-rn-runtime/components/container/wizard/wizard.styles.js.map +1 -1
- app-rn-runtime/components/container/wizard/wizardstep/wizardstep.component.js +27 -2
- app-rn-runtime/components/container/wizard/wizardstep/wizardstep.component.js.map +1 -1
- app-rn-runtime/components/container/wizard/wizardstep/wizardstep.props.js +6 -0
- app-rn-runtime/components/container/wizard/wizardstep/wizardstep.props.js.map +1 -1
- app-rn-runtime/components/data/card/card.component.js +7 -3
- app-rn-runtime/components/data/card/card.component.js.map +1 -1
- app-rn-runtime/components/data/card/card.props.js +4 -0
- app-rn-runtime/components/data/card/card.props.js.map +1 -1
- app-rn-runtime/components/data/form/form-action/form-action.styles.js +2 -1
- app-rn-runtime/components/data/form/form-action/form-action.styles.js.map +1 -1
- app-rn-runtime/components/data/form/form-field/form-field.component.js +5 -1
- app-rn-runtime/components/data/form/form-field/form-field.component.js.map +1 -1
- app-rn-runtime/components/data/list/list.component.js +136 -25
- app-rn-runtime/components/data/list/list.component.js.map +1 -1
- app-rn-runtime/components/data/list/list.props.js +4 -1
- app-rn-runtime/components/data/list/list.props.js.map +1 -1
- app-rn-runtime/components/data/list/list.styles.js +9 -0
- app-rn-runtime/components/data/list/list.styles.js.map +1 -1
- app-rn-runtime/components/device/barcodescanner/barcodescanner.component.js +4 -1
- app-rn-runtime/components/device/barcodescanner/barcodescanner.component.js.map +1 -1
- app-rn-runtime/components/device/barcodescanner/barcodescanner.props.js +3 -0
- app-rn-runtime/components/device/barcodescanner/barcodescanner.props.js.map +1 -1
- app-rn-runtime/components/device/barcodescanner/barcodescanner.styles.js +13 -6
- app-rn-runtime/components/device/barcodescanner/barcodescanner.styles.js.map +1 -1
- app-rn-runtime/components/device/camera/camera.component.js +4 -1
- app-rn-runtime/components/device/camera/camera.component.js.map +1 -1
- app-rn-runtime/components/device/camera/camera.props.js +3 -0
- app-rn-runtime/components/device/camera/camera.props.js.map +1 -1
- app-rn-runtime/components/device/camera/camera.styles.js +12 -4
- app-rn-runtime/components/device/camera/camera.styles.js.map +1 -1
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.component.js +4 -0
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.component.js.map +1 -1
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.props.js +4 -0
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.props.js.map +1 -1
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.styles.js +2 -1
- app-rn-runtime/components/dialogs/alertdialog/alertdialog.styles.js.map +1 -1
- app-rn-runtime/components/dialogs/confirmdialog/confirmdialog.component.js +4 -0
- app-rn-runtime/components/dialogs/confirmdialog/confirmdialog.component.js.map +1 -1
- app-rn-runtime/components/dialogs/confirmdialog/confirmdialog.props.js +4 -0
- app-rn-runtime/components/dialogs/confirmdialog/confirmdialog.props.js.map +1 -1
- app-rn-runtime/components/dialogs/dialog/dialog.component.js +7 -3
- app-rn-runtime/components/dialogs/dialog/dialog.component.js.map +1 -1
- app-rn-runtime/components/dialogs/dialog/dialog.props.js +4 -0
- app-rn-runtime/components/dialogs/dialog/dialog.props.js.map +1 -1
- app-rn-runtime/components/dialogs/dialog/dialog.styles.js +11 -2
- app-rn-runtime/components/dialogs/dialog/dialog.styles.js.map +1 -1
- app-rn-runtime/components/input/basedataset/basedataset.props.js +4 -0
- app-rn-runtime/components/input/basedataset/basedataset.props.js.map +1 -1
- app-rn-runtime/components/input/baseinput/baseinput.component.js +2 -2
- app-rn-runtime/components/input/baseinput/baseinput.component.js.map +1 -1
- app-rn-runtime/components/input/baseinput/baseinput.props.js +4 -0
- app-rn-runtime/components/input/baseinput/baseinput.props.js.map +1 -1
- app-rn-runtime/components/input/basenumber/basenumber.component.js +16 -10
- app-rn-runtime/components/input/basenumber/basenumber.component.js.map +1 -1
- app-rn-runtime/components/input/basenumber/basenumber.props.js +4 -0
- app-rn-runtime/components/input/basenumber/basenumber.props.js.map +1 -1
- app-rn-runtime/components/input/checkbox/checkbox.component.js +12 -5
- app-rn-runtime/components/input/checkbox/checkbox.component.js.map +1 -1
- app-rn-runtime/components/input/checkbox/checkbox.styles.js +35 -5
- app-rn-runtime/components/input/checkbox/checkbox.styles.js.map +1 -1
- app-rn-runtime/components/input/checkboxset/checkboxset.component.js +13 -6
- app-rn-runtime/components/input/checkboxset/checkboxset.component.js.map +1 -1
- app-rn-runtime/components/input/checkboxset/checkboxset.styles.js +39 -10
- app-rn-runtime/components/input/checkboxset/checkboxset.styles.js.map +1 -1
- app-rn-runtime/components/input/chips/chips.component.js +5 -1
- app-rn-runtime/components/input/chips/chips.component.js.map +1 -1
- app-rn-runtime/components/input/composite/composite.component.js +1 -1
- app-rn-runtime/components/input/composite/composite.component.js.map +1 -1
- app-rn-runtime/components/input/composite/composite.props.js +1 -1
- app-rn-runtime/components/input/composite/composite.props.js.map +1 -1
- app-rn-runtime/components/input/currency/currency.component.js +18 -3
- app-rn-runtime/components/input/currency/currency.component.js.map +1 -1
- app-rn-runtime/components/input/currency/currency.props.js +1 -0
- app-rn-runtime/components/input/currency/currency.props.js.map +1 -1
- app-rn-runtime/components/input/currency/currency.styles.js +19 -1
- app-rn-runtime/components/input/currency/currency.styles.js.map +1 -1
- app-rn-runtime/components/input/epoch/base-datetime.component.js +76 -10
- app-rn-runtime/components/input/epoch/base-datetime.component.js.map +1 -1
- app-rn-runtime/components/input/epoch/date/date.component.js +8 -0
- app-rn-runtime/components/input/epoch/date/date.component.js.map +1 -1
- app-rn-runtime/components/input/epoch/date/date.styles.js +16 -0
- app-rn-runtime/components/input/epoch/date/date.styles.js.map +1 -1
- app-rn-runtime/components/input/epoch/datetime/datetime.component.js +8 -0
- app-rn-runtime/components/input/epoch/datetime/datetime.component.js.map +1 -1
- app-rn-runtime/components/input/epoch/datetime/datetime.props.js +5 -0
- app-rn-runtime/components/input/epoch/datetime/datetime.props.js.map +1 -1
- app-rn-runtime/components/input/epoch/datetime/datetime.styles.js +49 -1
- app-rn-runtime/components/input/epoch/datetime/datetime.styles.js.map +1 -1
- app-rn-runtime/components/input/epoch/time/time.component.js +8 -0
- app-rn-runtime/components/input/epoch/time/time.component.js.map +1 -1
- app-rn-runtime/components/input/epoch/time/time.styles.js +16 -0
- app-rn-runtime/components/input/epoch/time/time.styles.js.map +1 -1
- app-rn-runtime/components/input/fileupload/fileupload.component.js +2 -0
- app-rn-runtime/components/input/fileupload/fileupload.component.js.map +1 -1
- app-rn-runtime/components/input/fileupload/fileupload.props.js +2 -0
- app-rn-runtime/components/input/fileupload/fileupload.props.js.map +1 -1
- app-rn-runtime/components/input/fileupload/fileupload.styles.js +1 -1
- app-rn-runtime/components/input/fileupload/fileupload.styles.js.map +1 -1
- app-rn-runtime/components/input/number/number.component.js +13 -2
- app-rn-runtime/components/input/number/number.component.js.map +1 -1
- app-rn-runtime/components/input/number/number.props.js +1 -0
- app-rn-runtime/components/input/number/number.props.js.map +1 -1
- app-rn-runtime/components/input/number/number.styles.js +17 -0
- app-rn-runtime/components/input/number/number.styles.js.map +1 -1
- app-rn-runtime/components/input/radioset/radioset.component.js +7 -2
- app-rn-runtime/components/input/radioset/radioset.component.js.map +1 -1
- app-rn-runtime/components/input/select/select.component.js +7 -3
- app-rn-runtime/components/input/select/select.component.js.map +1 -1
- app-rn-runtime/components/input/select/select.styles.js +5 -1
- app-rn-runtime/components/input/select/select.styles.js.map +1 -1
- app-rn-runtime/components/input/slider/slider.styles.js +3 -3
- app-rn-runtime/components/input/slider/slider.styles.js.map +1 -1
- app-rn-runtime/components/input/switch/switch.component.js +8 -1
- app-rn-runtime/components/input/switch/switch.component.js.map +1 -1
- app-rn-runtime/components/input/switch/switch.styles.js +10 -5
- app-rn-runtime/components/input/switch/switch.styles.js.map +1 -1
- app-rn-runtime/components/input/text/text.component.js +13 -1
- app-rn-runtime/components/input/text/text.component.js.map +1 -1
- app-rn-runtime/components/input/text/text.props.js +1 -0
- app-rn-runtime/components/input/text/text.props.js.map +1 -1
- app-rn-runtime/components/input/text/text.styles.js +17 -0
- app-rn-runtime/components/input/text/text.styles.js.map +1 -1
- app-rn-runtime/components/input/textarea/textarea.component.js +13 -1
- app-rn-runtime/components/input/textarea/textarea.component.js.map +1 -1
- app-rn-runtime/components/input/textarea/textarea.props.js +1 -0
- app-rn-runtime/components/input/textarea/textarea.props.js.map +1 -1
- app-rn-runtime/components/input/textarea/textarea.styles.js +17 -0
- app-rn-runtime/components/input/textarea/textarea.styles.js.map +1 -1
- app-rn-runtime/components/input/toggle/toggle.component.js +48 -5
- app-rn-runtime/components/input/toggle/toggle.component.js.map +1 -1
- app-rn-runtime/components/input/toggle/toggle.props.js +4 -0
- app-rn-runtime/components/input/toggle/toggle.props.js.map +1 -1
- app-rn-runtime/components/input/toggle/toggle.styles.js +5 -12
- app-rn-runtime/components/input/toggle/toggle.styles.js.map +1 -1
- app-rn-runtime/components/navigation/appnavbar/appnavbar.component.js +6 -1
- app-rn-runtime/components/navigation/appnavbar/appnavbar.component.js.map +1 -1
- app-rn-runtime/components/navigation/appnavbar/appnavbar.props.js +1 -0
- app-rn-runtime/components/navigation/appnavbar/appnavbar.props.js.map +1 -1
- app-rn-runtime/components/navigation/appnavbar/appnavbar.styles.js +11 -2
- app-rn-runtime/components/navigation/appnavbar/appnavbar.styles.js.map +1 -1
- app-rn-runtime/components/navigation/basenav/basenav.component.js +1 -2
- app-rn-runtime/components/navigation/basenav/basenav.component.js.map +1 -1
- app-rn-runtime/components/navigation/menu/menu.styles.js +8 -5
- app-rn-runtime/components/navigation/menu/menu.styles.js.map +1 -1
- app-rn-runtime/components/navigation/navitem/navitem.component.js +8 -5
- app-rn-runtime/components/navigation/navitem/navitem.component.js.map +1 -1
- app-rn-runtime/components/navigation/navitem/navitem.props.js +3 -0
- app-rn-runtime/components/navigation/navitem/navitem.props.js.map +1 -1
- app-rn-runtime/components/navigation/popover/popover.component.js +10 -3
- app-rn-runtime/components/navigation/popover/popover.component.js.map +1 -1
- app-rn-runtime/components/navigation/popover/popover.props.js +7 -0
- app-rn-runtime/components/navigation/popover/popover.props.js.map +1 -1
- app-rn-runtime/components/navigation/popover/popover.styles.js +8 -2
- app-rn-runtime/components/navigation/popover/popover.styles.js.map +1 -1
- app-rn-runtime/components/page/page-content/page-content.component.js +7 -1
- app-rn-runtime/components/page/page-content/page-content.component.js.map +1 -1
- app-rn-runtime/components/page/tabbar/curve.js +84 -0
- app-rn-runtime/components/page/tabbar/curve.js.map +1 -0
- app-rn-runtime/components/page/tabbar/tabbar.component.js +44 -10
- app-rn-runtime/components/page/tabbar/tabbar.component.js.map +1 -1
- app-rn-runtime/components/page/tabbar/tabbar.styles.js +82 -15
- app-rn-runtime/components/page/tabbar/tabbar.styles.js.map +1 -1
- app-rn-runtime/core/accessibility.js +149 -0
- app-rn-runtime/core/accessibility.js.map +1 -0
- app-rn-runtime/core/base.component.js +21 -3
- app-rn-runtime/core/base.component.js.map +1 -1
- app-rn-runtime/core/components/floatinglabel.component.js +45 -0
- app-rn-runtime/core/components/floatinglabel.component.js.map +1 -0
- app-rn-runtime/core/components/textinput.component.js +25 -2
- app-rn-runtime/core/components/textinput.component.js.map +1 -1
- app-rn-runtime/core/event-notifier.js +22 -1
- app-rn-runtime/core/event-notifier.js.map +1 -1
- app-rn-runtime/core/tappable.component.js +37 -10
- app-rn-runtime/core/tappable.component.js.map +1 -1
- app-rn-runtime/core/utils.js +11 -0
- app-rn-runtime/core/utils.js.map +1 -1
- app-rn-runtime/gestures/swipe.animation.js +34 -1
- app-rn-runtime/gestures/swipe.animation.js.map +1 -1
- app-rn-runtime/package.json +8 -3
- app-rn-runtime/runtime/App.js +12 -7
- app-rn-runtime/runtime/App.js.map +1 -1
- app-rn-runtime/runtime/base-page.component.js +1 -1
- app-rn-runtime/runtime/base-page.component.js.map +1 -1
- app-rn-runtime/runtime/services/app-security.service.js +2 -1
- app-rn-runtime/runtime/services/app-security.service.js.map +1 -1
- app-rn-runtime/runtime/services/webprocess.service.js +0 -1
- app-rn-runtime/runtime/services/webprocess.service.js.map +1 -1
- app-rn-runtime/styles/background.component.js +1 -1
- app-rn-runtime/styles/background.component.js.map +1 -1
- app-rn-runtime/styles/theme.js +43 -0
- app-rn-runtime/styles/theme.js.map +1 -1
- app-rn-runtime/styles/theme.variables.js +30 -6
- app-rn-runtime/styles/theme.variables.js.map +1 -1
- app-rn-runtime/variables/model-variable.js +2 -1
- app-rn-runtime/variables/model-variable.js.map +1 -1
- app-rn-runtime/variables/service-variable.js +14 -6
- app-rn-runtime/variables/service-variable.js.map +1 -1
@@ -18,6 +18,13 @@ export default class WmPopoverProps extends BaseProps {
|
|
18
18
|
_defineProperty(this, "renderPartial", null);
|
19
19
|
_defineProperty(this, "title", null);
|
20
20
|
_defineProperty(this, "type", 'action-sheet');
|
21
|
+
_defineProperty(this, "iconurl", null);
|
22
|
+
_defineProperty(this, "iconheight", null);
|
23
|
+
_defineProperty(this, "iconwidth", null);
|
24
|
+
_defineProperty(this, "iconmargin", null);
|
25
|
+
_defineProperty(this, "accessibilitylabel", undefined);
|
26
|
+
_defineProperty(this, "hint", undefined);
|
27
|
+
_defineProperty(this, "accessibilityrole", "none");
|
21
28
|
}
|
22
29
|
}
|
23
30
|
//# sourceMappingURL=popover.props.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["BaseProps","WmPopoverProps","constructor","arguments","_defineProperty"],"sources":["popover.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\nimport React from 'react';\n\nexport default class WmPopoverProps extends BaseProps {\n animation?: string = null as any;\n badgevalue? = null as any;\n caption? = 'Link';\n contentanimation?: string = null as any;\n iconclass? = null as any;\n iconposition? = 'left' as any;\n popoverwidth?: string | number | null = 240;\n popoverheight?: string | number | null = 360;\n autoclose?: 'outsideClick' | 'disabled' | 'always' = 'outsideClick';\n children? = [] as any;\n renderPartial?: Function = null as any;\n title?: string = null as any;\n type?: 'action-sheet' | 'dropdown' = 'action-sheet';\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;
|
1
|
+
{"version":3,"names":["BaseProps","WmPopoverProps","constructor","arguments","_defineProperty","undefined"],"sources":["popover.props.ts"],"sourcesContent":["import { BaseProps } from '@wavemaker/app-rn-runtime/core/base.component';\nimport React from 'react';\nimport { AccessibilityRole } from 'react-native';\n\nexport default class WmPopoverProps extends BaseProps {\n animation?: string = null as any;\n badgevalue? = null as any;\n caption? = 'Link';\n contentanimation?: string = null as any;\n iconclass? = null as any;\n iconposition? = 'left' as any;\n popoverwidth?: string | number | null = 240;\n popoverheight?: string | number | null = 360;\n autoclose?: 'outsideClick' | 'disabled' | 'always' = 'outsideClick';\n children? = [] as any;\n renderPartial?: Function = null as any;\n title?: string = null as any;\n type?: 'action-sheet' | 'dropdown' = 'action-sheet';\n iconurl?: string = null as any;\n iconheight?: number = null as any;\n iconwidth?: number = null as any;\n iconmargin?: number = null as any;\n accessibilitylabel?: string = undefined;\n hint?: string = undefined;\n accessibilityrole?: AccessibilityRole = \"none\";\n}\n"],"mappings":";;;AAAA,SAASA,SAAS,QAAQ,+CAA+C;AAIzE,eAAe,MAAMC,cAAc,SAASD,SAAS,CAAC;EAAAE,YAAA;IAAA,SAAAC,SAAA;IAAAC,eAAA,oBAC/B,IAAI;IAAAA,eAAA,qBACX,IAAI;IAAAA,eAAA,kBACP,MAAM;IAAAA,eAAA,2BACW,IAAI;IAAAA,eAAA,oBACnB,IAAI;IAAAA,eAAA,uBACD,MAAM;IAAAA,eAAA,uBACkB,GAAG;IAAAA,eAAA,wBACF,GAAG;IAAAA,eAAA,oBACS,cAAc;IAAAA,eAAA,mBACvD,EAAE;IAAAA,eAAA,wBACa,IAAI;IAAAA,eAAA,gBACd,IAAI;IAAAA,eAAA,eACgB,cAAc;IAAAA,eAAA,kBAChC,IAAI;IAAAA,eAAA,qBACD,IAAI;IAAAA,eAAA,oBACL,IAAI;IAAAA,eAAA,qBACH,IAAI;IAAAA,eAAA,6BACIC,SAAS;IAAAD,eAAA,eACvBC,SAAS;IAAAD,eAAA,4BACe,MAAM;EAAA;AAChD"}
|
@@ -5,7 +5,8 @@ export const DEFAULT_CLASS = 'app-popover';
|
|
5
5
|
BASE_THEME.registerStyle((themeVariables, addStyle) => {
|
6
6
|
const defaultStyles = defineStyles({
|
7
7
|
root: {
|
8
|
-
padding: 8
|
8
|
+
padding: 8,
|
9
|
+
alignSelf: 'flex-start'
|
9
10
|
},
|
10
11
|
text: {},
|
11
12
|
title: {
|
@@ -15,7 +16,12 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
|
|
15
16
|
fontSize: 16,
|
16
17
|
fontFamily: themeVariables.baseFont
|
17
18
|
},
|
18
|
-
link: {
|
19
|
+
link: {
|
20
|
+
root: {},
|
21
|
+
text: {
|
22
|
+
paddingRight: 8
|
23
|
+
}
|
24
|
+
},
|
19
25
|
popover: {
|
20
26
|
backgroundColor: themeVariables.popoverBackgroundColor,
|
21
27
|
maxWidth: 640,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["BASE_THEME","defineStyles","Dimensions","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","padding","text","title","backgroundColor","popoverTitleBackgroundColor","color","popoverTitleColor","fontSize","fontFamily","baseFont","link","popover","popoverBackgroundColor","maxWidth","borderTopLeftRadius","borderTopRightRadius","popoverContent","flex","modal","modalContent","width","minHeight","maxHeight","get","height","position","bottom","getStyle","shadowOffset","shadowOpacity","shadowRadius","justifyContent","transparent","borderRadius"],"sources":["popover.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmAnchorStyles } from '@wavemaker/app-rn-runtime/components/basic/anchor/anchor.styles';\nimport { WmContainerStyles } from '@wavemaker/app-rn-runtime/components/container/container.styles';\nimport { Dimensions } from 'react-native';\n\nexport type WmPopoverStyles = BaseStyles & {\n link: WmAnchorStyles,\n popover: AllStyle,\n popoverContent : WmContainerStyles,\n modal: AllStyle,\n modalContent: AllStyle,\n title: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-popover';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n const defaultStyles: WmPopoverStyles = defineStyles({\n root: {\n padding: 8\n },\n text: {},\n title: {\n backgroundColor: themeVariables.popoverTitleBackgroundColor,\n padding: 12,\n color: themeVariables.popoverTitleColor,\n fontSize: 16,\n fontFamily: themeVariables.baseFont\n },\n link: {} as WmAnchorStyles,\n popover: {\n backgroundColor: themeVariables.popoverBackgroundColor,\n maxWidth: 640,\n borderTopLeftRadius: 28,\n borderTopRightRadius: 28 \n },\n popoverContent : {\n root: {\n flex: 1\n }\n } as WmContainerStyles,\n modal: {},\n modalContent: {\n borderTopLeftRadius: 28,\n borderTopRightRadius: 28\n }\n });\n\n addStyle(DEFAULT_CLASS, '', defaultStyles);\n addStyle('popover-action-sheet', '', {\n modal: {\n backgroundColor: 'rgba(0, 0, 0, 0.3)',\n },\n popover: {\n width: '100%',\n minHeight: 240,\n maxHeight: Dimensions.get('window').height - 120,\n },\n modalContent: {\n position: 'absolute',\n bottom: 0,\n width: '100%',\n ...BASE_THEME.getStyle('elevate1').root,\n shadowOffset: {\n width: 0,\n height: 0\n },\n shadowOpacity: 0.6,\n shadowRadius: 10,\n justifyContent: 'flex-end'\n }\n } as any as WmPopoverStyles);\n addStyle('popover-dropdown', '', {\n modal: {\n backgroundColor: 'transparent',\n },\n popover: {\n backgroundColor: themeVariables.transparent\n },\n modalContent: {\n borderRadius: 6,\n position: 'absolute',\n ...BASE_THEME.getStyle('elevate4').root,\n shadowRadius: 8\n }\n } as WmPopoverStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAoB,wCAAwC;AAC7E,SAAqBC,YAAY,QAAQ,+CAA+C;AAGxF,SAASC,UAAU,QAAQ,cAAc;AAWzC,OAAO,MAAMC,aAAa,GAAG,aAAa;AAC1CH,UAAU,CAACI,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAA8B,GAAGN,YAAY,CAAC;IAChDO,IAAI,EAAE;MACFC,OAAO,EAAE;
|
1
|
+
{"version":3,"names":["BASE_THEME","defineStyles","Dimensions","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","padding","alignSelf","text","title","backgroundColor","popoverTitleBackgroundColor","color","popoverTitleColor","fontSize","fontFamily","baseFont","link","paddingRight","popover","popoverBackgroundColor","maxWidth","borderTopLeftRadius","borderTopRightRadius","popoverContent","flex","modal","modalContent","width","minHeight","maxHeight","get","height","position","bottom","getStyle","shadowOffset","shadowOpacity","shadowRadius","justifyContent","transparent","borderRadius"],"sources":["popover.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmAnchorStyles } from '@wavemaker/app-rn-runtime/components/basic/anchor/anchor.styles';\nimport { WmContainerStyles } from '@wavemaker/app-rn-runtime/components/container/container.styles';\nimport { Dimensions } from 'react-native';\n\nexport type WmPopoverStyles = BaseStyles & {\n link: WmAnchorStyles,\n popover: AllStyle,\n popoverContent : WmContainerStyles,\n modal: AllStyle,\n modalContent: AllStyle,\n title: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-popover';\nBASE_THEME.registerStyle((themeVariables, addStyle) => {\n const defaultStyles: WmPopoverStyles = defineStyles({\n root: {\n padding: 8,\n alignSelf: 'flex-start'\n },\n text: {},\n title: {\n backgroundColor: themeVariables.popoverTitleBackgroundColor,\n padding: 12,\n color: themeVariables.popoverTitleColor,\n fontSize: 16,\n fontFamily: themeVariables.baseFont\n },\n link: {\n root:{\n },\n text:{\n paddingRight: 8\n }\n } as WmAnchorStyles,\n popover: {\n backgroundColor: themeVariables.popoverBackgroundColor,\n maxWidth: 640,\n borderTopLeftRadius: 28,\n borderTopRightRadius: 28 \n },\n popoverContent : {\n root: {\n flex: 1\n }\n } as WmContainerStyles,\n modal: {},\n modalContent: {\n borderTopLeftRadius: 28,\n borderTopRightRadius: 28\n }\n });\n\n addStyle(DEFAULT_CLASS, '', defaultStyles);\n addStyle('popover-action-sheet', '', {\n modal: {\n backgroundColor: 'rgba(0, 0, 0, 0.3)',\n },\n popover: {\n width: '100%',\n minHeight: 240,\n maxHeight: Dimensions.get('window').height - 120,\n },\n modalContent: {\n position: 'absolute',\n bottom: 0,\n width: '100%',\n ...BASE_THEME.getStyle('elevate1').root,\n shadowOffset: {\n width: 0,\n height: 0\n },\n shadowOpacity: 0.6,\n shadowRadius: 10,\n justifyContent: 'flex-end'\n }\n } as any as WmPopoverStyles);\n addStyle('popover-dropdown', '', {\n modal: {\n backgroundColor: 'transparent',\n },\n popover: {\n backgroundColor: themeVariables.transparent\n },\n modalContent: {\n borderRadius: 6,\n position: 'absolute',\n ...BASE_THEME.getStyle('elevate4').root,\n shadowRadius: 8\n }\n } as WmPopoverStyles);\n});"],"mappings":"AAAA,OAAOA,UAAU,MAAoB,wCAAwC;AAC7E,SAAqBC,YAAY,QAAQ,+CAA+C;AAGxF,SAASC,UAAU,QAAQ,cAAc;AAWzC,OAAO,MAAMC,aAAa,GAAG,aAAa;AAC1CH,UAAU,CAACI,aAAa,CAAC,CAACC,cAAc,EAAEC,QAAQ,KAAK;EACnD,MAAMC,aAA8B,GAAGN,YAAY,CAAC;IAChDO,IAAI,EAAE;MACFC,OAAO,EAAE,CAAC;MACVC,SAAS,EAAE;IACf,CAAC;IACDC,IAAI,EAAE,CAAC,CAAC;IACRC,KAAK,EAAE;MACHC,eAAe,EAAER,cAAc,CAACS,2BAA2B;MAC3DL,OAAO,EAAE,EAAE;MACXM,KAAK,EAAEV,cAAc,CAACW,iBAAiB;MACvCC,QAAQ,EAAE,EAAE;MACZC,UAAU,EAAEb,cAAc,CAACc;IAC/B,CAAC;IACDC,IAAI,EAAE;MACFZ,IAAI,EAAC,CACL,CAAC;MACDG,IAAI,EAAC;QACDU,YAAY,EAAE;MAClB;IACJ,CAAmB;IACnBC,OAAO,EAAE;MACLT,eAAe,EAAER,cAAc,CAACkB,sBAAsB;MACtDC,QAAQ,EAAE,GAAG;MACbC,mBAAmB,EAAE,EAAE;MACvBC,oBAAoB,EAAE;IAC1B,CAAC;IACDC,cAAc,EAAG;MACbnB,IAAI,EAAE;QACFoB,IAAI,EAAE;MACV;IACJ,CAAsB;IACtBC,KAAK,EAAE,CAAC,CAAC;IACTC,YAAY,EAAE;MACVL,mBAAmB,EAAE,EAAE;MACvBC,oBAAoB,EAAE;IAC1B;EACJ,CAAC,CAAC;EAEFpB,QAAQ,CAACH,aAAa,EAAE,EAAE,EAAEI,aAAa,CAAC;EAC1CD,QAAQ,CAAC,sBAAsB,EAAE,EAAE,EAAE;IACjCuB,KAAK,EAAE;MACHhB,eAAe,EAAE;IACrB,CAAC;IACDS,OAAO,EAAE;MACLS,KAAK,EAAE,MAAM;MACbC,SAAS,EAAE,GAAG;MACdC,SAAS,EAAE/B,UAAU,CAACgC,GAAG,CAAC,QAAQ,CAAC,CAACC,MAAM,GAAG;IACjD,CAAC;IACDL,YAAY,EAAE;MACVM,QAAQ,EAAE,UAAU;MACpBC,MAAM,EAAE,CAAC;MACTN,KAAK,EAAE,MAAM;MACb,GAAG/B,UAAU,CAACsC,QAAQ,CAAC,UAAU,CAAC,CAAC9B,IAAI;MACvC+B,YAAY,EAAE;QACVR,KAAK,EAAE,CAAC;QACRI,MAAM,EAAE;MACZ,CAAC;MACDK,aAAa,EAAE,GAAG;MAClBC,YAAY,EAAE,EAAE;MAChBC,cAAc,EAAE;IACpB;EACJ,CAA2B,CAAC;EAC5BpC,QAAQ,CAAC,kBAAkB,EAAE,EAAE,EAAE;IAC7BuB,KAAK,EAAE;MACHhB,eAAe,EAAE;IACrB,CAAC;IACDS,OAAO,EAAE;MACLT,eAAe,EAAER,cAAc,CAACsC;IACpC,CAAC;IACDb,YAAY,EAAE;MACVc,YAAY,EAAE,CAAC;MACfR,QAAQ,EAAE,UAAU;MACpB,GAAGpC,UAAU,CAACsC,QAAQ,CAAC,UAAU,CAAC,CAAC9B,IAAI;MACvCiC,YAAY,EAAE;IAClB;EACJ,CAAoB,CAAC;AACzB,CAAC,CAAC"}
|
@@ -12,6 +12,7 @@ export default class WmPageContent extends BaseComponent {
|
|
12
12
|
this.hideMode = HideMode.DONOT_ADD_TO_DOM;
|
13
13
|
}
|
14
14
|
renderWidget(props) {
|
15
|
+
const showScrollbar = this.styles.root.scrollbarColor != 'transparent';
|
15
16
|
return props.scrollable || isWebPreviewMode() ? /*#__PURE__*/React.createElement(View, {
|
16
17
|
style: {
|
17
18
|
height: '100%',
|
@@ -21,7 +22,12 @@ export default class WmPageContent extends BaseComponent {
|
|
21
22
|
}, this._background, /*#__PURE__*/React.createElement(ScrollView, {
|
22
23
|
contentContainerStyle: [this.styles.root, {
|
23
24
|
backgroundColor: 'transparent'
|
24
|
-
}]
|
25
|
+
}],
|
26
|
+
showsVerticalScrollIndicator: showScrollbar,
|
27
|
+
onScroll: event => {
|
28
|
+
this.notify('scroll', [event]);
|
29
|
+
},
|
30
|
+
scrollEventThrottle: 48
|
25
31
|
}, props.children)) : /*#__PURE__*/React.createElement(View, {
|
26
32
|
style: this.styles.root
|
27
33
|
}, this._background, props.children);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","ScrollView","View","isWebPreviewMode","HideMode","BaseComponent","BaseComponentState","WmPageContentProps","DEFAULT_CLASS","WmPageContentState","WmPageContent","constructor","props","hideMode","DONOT_ADD_TO_DOM","renderWidget","scrollable","createElement","style","height","width","backgroundColor","
|
1
|
+
{"version":3,"names":["React","ScrollView","View","isWebPreviewMode","HideMode","BaseComponent","BaseComponentState","WmPageContentProps","DEFAULT_CLASS","WmPageContentState","WmPageContent","constructor","props","hideMode","DONOT_ADD_TO_DOM","renderWidget","showScrollbar","styles","root","scrollbarColor","scrollable","createElement","style","height","width","backgroundColor","_background","contentContainerStyle","showsVerticalScrollIndicator","onScroll","event","notify","scrollEventThrottle","children"],"sources":["page-content.component.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView, View } from 'react-native';\nimport { isWebPreviewMode } from '@wavemaker/app-rn-runtime/core/utils';\nimport { HideMode } from '@wavemaker/app-rn-runtime/core/if.component';\nimport { BaseComponent, BaseComponentState } from '@wavemaker/app-rn-runtime/core/base.component';\n\nimport WmPageContentProps from './page-content.props';\nimport { DEFAULT_CLASS, WmPageContentStyles } from './page-content.styles';\n\nexport class WmPageContentState extends BaseComponentState<WmPageContentProps> {\n\n}\n\nexport default class WmPageContent extends BaseComponent<WmPageContentProps, WmPageContentState, WmPageContentStyles> {\n\n constructor(props: WmPageContentProps) {\n super(props, DEFAULT_CLASS, new WmPageContentProps());\n this.hideMode = HideMode.DONOT_ADD_TO_DOM;\n }\n\n renderWidget(props: WmPageContentProps) {\n const showScrollbar = (this.styles.root as any).scrollbarColor != 'transparent';\n return props.scrollable || isWebPreviewMode() ? (\n <View style={{height: '100%', width: '100%', backgroundColor: this.styles.root.backgroundColor}}>\n {this._background}\n <ScrollView contentContainerStyle={[this.styles.root, {backgroundColor: 'transparent'}]}\n showsVerticalScrollIndicator={showScrollbar}\n onScroll={(event) => {this.notify('scroll', [event])}}\n scrollEventThrottle={48}>\n {props.children}\n </ScrollView>\n </View>\n ) : (\n <View style={this.styles.root}>\n {this._background}\n {props.children}\n </View>\n ); \n }\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,SAASC,gBAAgB,QAAQ,sCAAsC;AACvE,SAASC,QAAQ,QAAQ,6CAA6C;AACtE,SAASC,aAAa,EAAEC,kBAAkB,QAAQ,+CAA+C;AAEjG,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,SAASC,aAAa,QAA6B,uBAAuB;AAE1E,OAAO,MAAMC,kBAAkB,SAASH,kBAAkB,CAAqB;AAI/E,eAAe,MAAMI,aAAa,SAASL,aAAa,CAA8D;EAEpHM,WAAWA,CAACC,KAAyB,EAAE;IACrC,KAAK,CAACA,KAAK,EAAEJ,aAAa,EAAE,IAAID,kBAAkB,CAAC,CAAC,CAAC;IACrD,IAAI,CAACM,QAAQ,GAAGT,QAAQ,CAACU,gBAAgB;EAC3C;EAEAC,YAAYA,CAACH,KAAyB,EAAE;IACtC,MAAMI,aAAa,GAAI,IAAI,CAACC,MAAM,CAACC,IAAI,CAASC,cAAc,IAAI,aAAa;IAC/E,OAAOP,KAAK,CAACQ,UAAU,IAAIjB,gBAAgB,CAAC,CAAC,gBAC3CH,KAAA,CAAAqB,aAAA,CAACnB,IAAI;MAACoB,KAAK,EAAE;QAACC,MAAM,EAAE,MAAM;QAAEC,KAAK,EAAE,MAAM;QAAEC,eAAe,EAAE,IAAI,CAACR,MAAM,CAACC,IAAI,CAACO;MAAe;IAAE,GAC7F,IAAI,CAACC,WAAW,eACjB1B,KAAA,CAAAqB,aAAA,CAACpB,UAAU;MAAC0B,qBAAqB,EAAE,CAAC,IAAI,CAACV,MAAM,CAACC,IAAI,EAAE;QAACO,eAAe,EAAE;MAAa,CAAC,CAAE;MACtFG,4BAA4B,EAAEZ,aAAc;MAC5Ca,QAAQ,EAAGC,KAAK,IAAK;QAAC,IAAI,CAACC,MAAM,CAAC,QAAQ,EAAE,CAACD,KAAK,CAAC,CAAC;MAAA,CAAE;MACtDE,mBAAmB,EAAE;IAAG,GACvBpB,KAAK,CAACqB,QACG,CACR,CAAC,gBAEPjC,KAAA,CAAAqB,aAAA,CAACnB,IAAI;MAACoB,KAAK,EAAE,IAAI,CAACL,MAAM,CAACC;IAAK,GAC3B,IAAI,CAACQ,WAAW,EAChBd,KAAK,CAACqB,QACH,CACP;EACH;AACF"}
|
@@ -0,0 +1,84 @@
|
|
1
|
+
import * as d3Shape from "d3-shape";
|
2
|
+
// import { scale } from "react-native-size-scaling";
|
3
|
+
const scale = n => n;
|
4
|
+
//** Path Line */
|
5
|
+
const line = (width, height) => {
|
6
|
+
const path = d3Shape.line().x(d => d.x).y(d => d.y)([{
|
7
|
+
x: width / 2,
|
8
|
+
y: 0
|
9
|
+
}, {
|
10
|
+
x: width,
|
11
|
+
y: 0
|
12
|
+
}, {
|
13
|
+
x: width,
|
14
|
+
y: height
|
15
|
+
}, {
|
16
|
+
x: 0,
|
17
|
+
y: height
|
18
|
+
}, {
|
19
|
+
x: 0,
|
20
|
+
y: 0
|
21
|
+
}, {
|
22
|
+
x: width / 2,
|
23
|
+
y: 0
|
24
|
+
}]);
|
25
|
+
return path;
|
26
|
+
};
|
27
|
+
|
28
|
+
//** Path Curved*/
|
29
|
+
const lineCurvedDown = (iPosition, height, circle) => {
|
30
|
+
const position = iPosition;
|
31
|
+
const circleWidth = circle + position;
|
32
|
+
const trim = (position + circleWidth) / 2;
|
33
|
+
const curved = d3Shape.line().x(d => d.x).y(d => d.y).curve(d3Shape.curveBasis)([{
|
34
|
+
x: position - scale(20),
|
35
|
+
y: 0
|
36
|
+
},
|
37
|
+
// border center left
|
38
|
+
{
|
39
|
+
x: position - scale(10),
|
40
|
+
y: scale(2)
|
41
|
+
}, {
|
42
|
+
x: position - scale(2),
|
43
|
+
y: scale(10)
|
44
|
+
}, {
|
45
|
+
x: position,
|
46
|
+
y: scale(17)
|
47
|
+
}, {
|
48
|
+
x: trim - scale(25),
|
49
|
+
y: height / 2 + scale(2)
|
50
|
+
}, {
|
51
|
+
x: trim - scale(10),
|
52
|
+
y: height / 2 + scale(10)
|
53
|
+
}, {
|
54
|
+
x: trim,
|
55
|
+
y: height / 2 + scale(10)
|
56
|
+
}, {
|
57
|
+
x: trim + scale(10),
|
58
|
+
y: height / 2 + scale(10)
|
59
|
+
}, {
|
60
|
+
x: trim + scale(25),
|
61
|
+
y: height / 2 + scale(2)
|
62
|
+
}, {
|
63
|
+
x: circleWidth,
|
64
|
+
y: scale(17)
|
65
|
+
},
|
66
|
+
// border center right
|
67
|
+
{
|
68
|
+
x: circleWidth + scale(2),
|
69
|
+
y: scale(10)
|
70
|
+
}, {
|
71
|
+
x: circleWidth + scale(10),
|
72
|
+
y: 0
|
73
|
+
}, {
|
74
|
+
x: circleWidth + scale(20),
|
75
|
+
y: 0
|
76
|
+
}]);
|
77
|
+
return curved;
|
78
|
+
};
|
79
|
+
export const getPathDown = (width, iHeight, centerWidth, clippedTabbarHeight) => {
|
80
|
+
const height = scale(iHeight);
|
81
|
+
const circleWidth = scale(centerWidth) + scale(16);
|
82
|
+
return `${line(width, clippedTabbarHeight)} ${lineCurvedDown(width / 2 - circleWidth / 2, height, circleWidth)}`;
|
83
|
+
};
|
84
|
+
//# sourceMappingURL=curve.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"names":["d3Shape","scale","n","line","width","height","path","x","d","y","lineCurvedDown","iPosition","circle","position","circleWidth","trim","curved","curve","curveBasis","getPathDown","iHeight","centerWidth","clippedTabbarHeight"],"sources":["curve.tsx"],"sourcesContent":["import * as d3Shape from \"d3-shape\";\n// import { scale } from \"react-native-size-scaling\";\nconst scale = (n: number) => n;\n\ninterface LineDatum {\n x: number;\n y: number;\n missing?: boolean;\n}\n\n//** Path Line */\nconst line = (width : number, height: number) => {\n const path: any = d3Shape\n .line<LineDatum>()\n .x((d) => d.x)\n .y((d) => d.y)([\n { x: width / 2, y: 0 },\n { x: width, y: 0 },\n { x: width, y: height },\n { x: 0, y: height},\n { x: 0, y: 0 },\n { x: width / 2, y: 0 },\n ]);\n \nreturn path;\n};\n\n//** Path Curved*/\nconst lineCurvedDown = (iPosition: number, height: number, circle: number) => {\n const position = iPosition;\n const circleWidth = circle + position;\n const trim = (position + circleWidth) / 2;\n \n const curved: any = d3Shape\n .line<LineDatum>()\n .x((d) => d.x)\n .y((d) => d.y)\n .curve(d3Shape.curveBasis)([\n { x: position - scale(20), y: 0 }, // border center left\n { x: position - scale(10), y: scale(2) },\n { x: position - scale(2), y: scale(10) },\n { x: position, y: scale(17) },\n \n { x: trim - scale(25), y: height / 2 + scale(2) },\n { x: trim - scale(10), y: height / 2 + scale(10) },\n { x: trim, y: height / 2 + scale(10) },\n { x: trim + scale(10), y: height / 2 + scale(10) },\n { x: trim + scale(25), y: height / 2 + scale(2) },\n \n { x: circleWidth, y: scale(17) }, // border center right\n { x: circleWidth + scale(2), y: scale(10) },\n { x: circleWidth + scale(10), y: 0 },\n { x: circleWidth + scale(20), y: 0 },\n ]);\n return curved;\n};\n\nexport const getPathDown = (width: number, iHeight: number, centerWidth: number, clippedTabbarHeight: number) => {\n const height = scale(iHeight);\n const circleWidth = scale(centerWidth) + scale(16);\n return `${line(width, clippedTabbarHeight)} ${lineCurvedDown(\n width / 2 - circleWidth / 2,\n height,\n circleWidth\n )}`;\n};\n"],"mappings":"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"}
|
@@ -3,7 +3,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
|
|
3
3
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
4
4
|
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); }
|
5
5
|
import React from 'react';
|
6
|
-
import { Text, View, TouchableOpacity } from 'react-native';
|
6
|
+
import { Text, View, TouchableOpacity, Dimensions } from 'react-native';
|
7
7
|
import { ThemeProvider } from '@wavemaker/app-rn-runtime/styles/theme';
|
8
8
|
import { ModalConsumer } from '@wavemaker/app-rn-runtime/core/modal.service';
|
9
9
|
import WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';
|
@@ -11,32 +11,47 @@ import { NavigationServiceConsumer } from '@wavemaker/app-rn-runtime/core/naviga
|
|
11
11
|
import { BaseNavComponent, BaseNavState } from '@wavemaker/app-rn-runtime/components/navigation/basenav/basenav.component';
|
12
12
|
import WmTabbarProps from './tabbar.props';
|
13
13
|
import { DEFAULT_CLASS } from './tabbar.styles';
|
14
|
+
import Svg, { Path } from 'react-native-svg';
|
15
|
+
import { getPathDown } from './curve';
|
16
|
+
// import { scale } from 'react-native-size-scaling';
|
17
|
+
import ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';
|
18
|
+
const scale = n => n;
|
14
19
|
class WmTabbarState extends BaseNavState {
|
15
20
|
constructor() {
|
16
21
|
super(...arguments);
|
17
22
|
_defineProperty(this, "showMore", false);
|
18
23
|
_defineProperty(this, "modalOptions", {});
|
24
|
+
_defineProperty(this, "dataItems", []);
|
19
25
|
}
|
20
26
|
}
|
21
27
|
export default class WmTabbar extends BaseNavComponent {
|
22
28
|
constructor(props) {
|
23
29
|
super(props, DEFAULT_CLASS, new WmTabbarProps(), new WmTabbarState());
|
24
30
|
_defineProperty(this, "tabbarHeight", 0);
|
31
|
+
_defineProperty(this, "maxWidth", Dimensions.get("window").width);
|
32
|
+
_defineProperty(this, "returnpathDown", void 0);
|
25
33
|
}
|
26
34
|
renderTabItem(item, testId, props, onSelect) {
|
35
|
+
let floating = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
27
36
|
const isActive = props.isActive && props.isActive(item);
|
28
37
|
const getDisplayLabel = this.props.getDisplayExpression || (label => label);
|
29
|
-
|
38
|
+
let increasedGap = Number(testId) === (item === null || item === void 0 ? void 0 : item.indexBeforeMid) && this.state.dataItems.length % 2 != 0 && (props.classname || '').indexOf('clipped-tabbar') >= 0 ? [this.styles.tabItem, {
|
39
|
+
paddingRight: 70
|
40
|
+
}] : [this.styles.tabItem];
|
41
|
+
return /*#__PURE__*/React.createElement(View, {
|
42
|
+
style: [increasedGap, floating ? this.styles.centerHubItem : {}],
|
43
|
+
key: `${item.label}_${testId}`
|
44
|
+
}, /*#__PURE__*/React.createElement(TouchableOpacity, _extends({}, this.getTestPropsForAction('item' + testId), {
|
30
45
|
onPress: () => onSelect && onSelect(),
|
31
46
|
key: item.key
|
32
47
|
}), /*#__PURE__*/React.createElement(View, {
|
33
|
-
style: [
|
48
|
+
style: [isActive && !floating ? this.styles.activeTabItem : {}]
|
34
49
|
}, /*#__PURE__*/React.createElement(WmIcon, {
|
35
|
-
styles: this.theme.mergeStyle({}, this.styles.tabIcon, isActive ? this.styles.activeTabIcon : {}),
|
50
|
+
styles: this.theme.mergeStyle({}, this.styles.tabIcon, floating ? this.styles.centerHubIcon : {}, isActive ? this.styles.activeTabIcon : {}),
|
36
51
|
iconclass: item.icon
|
37
|
-
}), /*#__PURE__*/React.createElement(Text, {
|
38
|
-
style: [this.styles.tabLabel, isActive ? this.styles.activeTabLabel : {}]
|
39
|
-
}, getDisplayLabel(item.label)))
|
52
|
+
}))), /*#__PURE__*/React.createElement(Text, {
|
53
|
+
style: [this.styles.tabLabel, floating ? this.styles.centerHubLabel : {}, isActive ? this.styles.activeTabLabel : {}]
|
54
|
+
}, getDisplayLabel(item.label)));
|
40
55
|
}
|
41
56
|
onItemSelect(item, navigationService) {
|
42
57
|
item.link && navigationService.openUrl(item.link);
|
@@ -54,6 +69,14 @@ export default class WmTabbar extends BaseNavComponent {
|
|
54
69
|
renderWidget(props) {
|
55
70
|
let max = 5;
|
56
71
|
const tabItems = this.state.dataItems;
|
72
|
+
const tabItemsLength = tabItems.length;
|
73
|
+
const isClippedTabbar = (props.classname || '').indexOf('clipped-tabbar') >= 0 && tabItemsLength % 2 !== 0;
|
74
|
+
if (tabItemsLength % 2 !== 0) {
|
75
|
+
const middleIndex = Math.floor(tabItemsLength / 2);
|
76
|
+
tabItems[middleIndex]['floating'] = true;
|
77
|
+
tabItems[middleIndex - 1]['indexBeforeMid'] = middleIndex - 1;
|
78
|
+
}
|
79
|
+
this.returnpathDown = getPathDown(this.maxWidth, 65, 60, this.styles.root.height);
|
57
80
|
const moreItems = [];
|
58
81
|
if (tabItems.length > max) {
|
59
82
|
const moreItemsCount = Math.ceil((tabItems.length + 1 - max) / max) * max;
|
@@ -71,7 +94,18 @@ export default class WmTabbar extends BaseNavComponent {
|
|
71
94
|
}
|
72
95
|
return /*#__PURE__*/React.createElement(NavigationServiceConsumer, null, navigationService => /*#__PURE__*/React.createElement(View, {
|
73
96
|
style: this.styles.root
|
74
|
-
}, /*#__PURE__*/React.createElement(
|
97
|
+
}, isClippedTabbar ? /*#__PURE__*/React.createElement(Svg, {
|
98
|
+
width: this.maxWidth,
|
99
|
+
height: scale(this.styles.root.height),
|
100
|
+
style: {
|
101
|
+
zIndex: -1,
|
102
|
+
position: 'absolute',
|
103
|
+
backgroundColor: ThemeVariables.INSTANCE.transparent
|
104
|
+
}
|
105
|
+
}, /*#__PURE__*/React.createElement(Path, {
|
106
|
+
fill: ThemeVariables.INSTANCE.tabbarBackgroundColor,
|
107
|
+
d: this.returnpathDown
|
108
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(ModalConsumer, null, modalService => {
|
75
109
|
if (this.state.showMore) {
|
76
110
|
modalService.showModal(this.prepareModalOptions( /*#__PURE__*/React.createElement(ThemeProvider, {
|
77
111
|
value: this.theme
|
@@ -80,7 +114,7 @@ export default class WmTabbar extends BaseNavComponent {
|
|
80
114
|
}, moreItems.map((a, i) => /*#__PURE__*/React.createElement(View, {
|
81
115
|
key: i,
|
82
116
|
style: this.styles.moreMenuRow
|
83
|
-
}, a.map(item => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService)))))))));
|
117
|
+
}, a.map((item, index) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService)))))))));
|
84
118
|
} else {
|
85
119
|
modalService.hideModal(this.state.modalOptions);
|
86
120
|
}
|
@@ -90,7 +124,7 @@ export default class WmTabbar extends BaseNavComponent {
|
|
90
124
|
onLayout: e => {
|
91
125
|
this.tabbarHeight = e.nativeEvent.layout.height;
|
92
126
|
}
|
93
|
-
}, tabItems.filter((item, i) => i < max).map((item, i) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService))), tabItems.length > max && this.renderTabItem({
|
127
|
+
}, tabItems.filter((item, i) => i < max).map((item, i) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService), item.floating)), tabItems.length > max && this.renderTabItem({
|
94
128
|
label: props.morebuttonlabel,
|
95
129
|
icon: props.morebuttoniconclass
|
96
130
|
}, 6666 + '', props, () => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","Text","View","TouchableOpacity","ThemeProvider","ModalConsumer","WmIcon","NavigationServiceConsumer","BaseNavComponent","BaseNavState","WmTabbarProps","DEFAULT_CLASS","WmTabbarState","constructor","arguments","_defineProperty","WmTabbar","props","renderTabItem","item","testId","onSelect","isActive","getDisplayLabel","getDisplayExpression","label","createElement","_extends","getTestPropsForAction","onPress","key","style","styles","tabItem","activeTabItem","theme","mergeStyle","tabIcon","activeTabIcon","iconclass","icon","tabLabel","activeTabLabel","onItemSelect","navigationService","link","openUrl","invokeEventCallback","proxy","prepareModalOptions","content","o","state","modalOptions","modalStyle","bottom","tabbarHeight","contentStyle","modalContent","renderWidget","max","tabItems","dataItems","moreItems","length","moreItemsCount","Math","ceil","j","i","row","push","root","modalService","showMore","showModal","value","moreMenu","map","a","moreMenuRow","hideModal","menu","onLayout","e","nativeEvent","layout","height","filter","morebuttonlabel","morebuttoniconclass","updateState"],"sources":["tabbar.component.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Text, View, TouchableOpacity } from 'react-native';\n\nimport { ThemeProvider } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { ModalConsumer, ModalOptions, ModalService } from '@wavemaker/app-rn-runtime/core/modal.service';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport NavigationService, { NavigationServiceConsumer } from '@wavemaker/app-rn-runtime/core/navigation.service';\nimport { BaseNavProps } from '@wavemaker/app-rn-runtime/components/navigation/basenav/basenav.props';\nimport { BaseNavComponent, BaseNavState, NavigationDataItem } from '@wavemaker/app-rn-runtime/components/navigation/basenav/basenav.component';\n\nimport WmTabbarProps from './tabbar.props';\nimport { DEFAULT_CLASS, WmTabbarStyles } from './tabbar.styles';\n\nclass WmTabbarState<T extends BaseNavProps> extends BaseNavState<T>{\n showMore = false;\n modalOptions = {} as ModalOptions;\n}\n\nexport default class WmTabbar extends BaseNavComponent<WmTabbarProps, WmTabbarState<WmTabbarProps>, WmTabbarStyles> {\n\n private tabbarHeight = 0;\n\n constructor(props: WmTabbarProps) {\n super(props, DEFAULT_CLASS, new WmTabbarProps(), new WmTabbarState());\n }\n\n renderTabItem(item: NavigationDataItem, testId: string, props: WmTabbarProps, onSelect: Function) {\n const isActive = props.isActive && props.isActive(item);\n const getDisplayLabel = this.props.getDisplayExpression || ((label: string) => label);\n return (\n <TouchableOpacity {...this.getTestPropsForAction('item' + testId)} onPress={() => onSelect && onSelect()} key={item.key}>\n <View style={[this.styles.tabItem, isActive ? this.styles.activeTabItem: {}]}>\n <WmIcon styles={this.theme.mergeStyle({}, this.styles.tabIcon, isActive ? this.styles.activeTabIcon: {})} iconclass={item.icon}></WmIcon>\n <Text style={[this.styles.tabLabel, isActive ? this.styles.activeTabLabel: {}]}>{getDisplayLabel(item.label)}</Text>\n </View>\n </TouchableOpacity>\n );\n }\n\n onItemSelect(item: NavigationDataItem, navigationService: NavigationService) {\n item.link && navigationService.openUrl(item.link);\n this.invokeEventCallback('onSelect', [null, this.proxy, item]);\n }\n\n prepareModalOptions(content: ReactNode) {\n const o = this.state.modalOptions;\n o.content = content;\n o.modalStyle = {\n bottom: this.tabbarHeight\n };\n o.contentStyle = this.styles.modalContent; \n return o;\n }\n\n renderWidget(props: WmTabbarProps) {\n let max = 5;\n const tabItems = this.state.dataItems;\n const moreItems = [] as any[][];\n if (tabItems.length > max) {\n const moreItemsCount = Math.ceil((tabItems.length + 1 - max)/ max) * max;\n let j = 0;\n for (let i = max-1; i < moreItemsCount;) {\n const row = [];\n for (let j = 0; j < max; j++) {\n row[j] = tabItems[i++] || {key: 'tabItem' + i} as NavigationDataItem;\n }\n moreItems.push(row);\n }\n max = max - 1;\n }\n return (\n <NavigationServiceConsumer>\n {(navigationService) =>\n (<View style={this.styles.root}>\n <ModalConsumer>\n {(modalService: ModalService) => {\n if (this.state.showMore) {\n modalService.showModal(this.prepareModalOptions((\n <ThemeProvider value={this.theme} >\n <View style={this.styles.moreMenu}>\n {moreItems.map((a, i) =>\n (<View key={i} style={this.styles.moreMenuRow}>\n {a.map(item => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService)))}\n </View>)\n )}\n </View>\n </ThemeProvider>)));\n } else {\n modalService.hideModal(this.state.modalOptions);\n }\n return null;\n }}\n </ModalConsumer>\n <View style={this.styles.menu}\n onLayout={e => { this.tabbarHeight = e.nativeEvent.layout.height}}>\n {tabItems.filter((item, i) => i < max)\n .map((item, i) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService)))}\n {tabItems.length > max && (\n this.renderTabItem({\n label: props.morebuttonlabel,\n icon: props.morebuttoniconclass\n } as NavigationDataItem, 6666 +'', props, () => {\n this.updateState({showMore: !this.state.showMore} as WmTabbarState<WmTabbarProps>);\n })\n )}\n </View>\n </View>)}\n </NavigationServiceConsumer>\n );\n }\n}\n"],"mappings":"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"}
|
1
|
+
{"version":3,"names":["React","Text","View","TouchableOpacity","Dimensions","ThemeProvider","ModalConsumer","WmIcon","NavigationServiceConsumer","BaseNavComponent","BaseNavState","WmTabbarProps","DEFAULT_CLASS","Svg","Path","getPathDown","ThemeVariables","scale","n","WmTabbarState","constructor","arguments","_defineProperty","WmTabbar","props","get","width","renderTabItem","item","testId","onSelect","floating","length","undefined","isActive","getDisplayLabel","getDisplayExpression","label","increasedGap","Number","indexBeforeMid","state","dataItems","classname","indexOf","styles","tabItem","paddingRight","createElement","style","centerHubItem","key","_extends","getTestPropsForAction","onPress","activeTabItem","theme","mergeStyle","tabIcon","centerHubIcon","activeTabIcon","iconclass","icon","tabLabel","centerHubLabel","activeTabLabel","onItemSelect","navigationService","link","openUrl","invokeEventCallback","proxy","prepareModalOptions","content","o","modalOptions","modalStyle","bottom","tabbarHeight","contentStyle","modalContent","renderWidget","max","tabItems","tabItemsLength","isClippedTabbar","middleIndex","Math","floor","returnpathDown","maxWidth","root","height","moreItems","moreItemsCount","ceil","j","i","row","push","zIndex","position","backgroundColor","INSTANCE","transparent","fill","tabbarBackgroundColor","d","Fragment","modalService","showMore","showModal","value","moreMenu","map","a","moreMenuRow","index","hideModal","menu","onLayout","e","nativeEvent","layout","filter","morebuttonlabel","morebuttoniconclass","updateState"],"sources":["tabbar.component.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Text, View, TouchableOpacity, Dimensions } from 'react-native';\n\nimport { ThemeProvider } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { ModalConsumer, ModalOptions, ModalService } from '@wavemaker/app-rn-runtime/core/modal.service';\nimport WmIcon from '@wavemaker/app-rn-runtime/components/basic/icon/icon.component';\nimport NavigationService, { NavigationServiceConsumer } from '@wavemaker/app-rn-runtime/core/navigation.service';\nimport { BaseNavProps } from '@wavemaker/app-rn-runtime/components/navigation/basenav/basenav.props';\nimport { BaseNavComponent, BaseNavState, NavigationDataItem } from '@wavemaker/app-rn-runtime/components/navigation/basenav/basenav.component';\n\nimport WmTabbarProps from './tabbar.props';\nimport { DEFAULT_CLASS, WmTabbarStyles } from './tabbar.styles';\nimport Svg, { Path } from 'react-native-svg';\nimport { getPathDown } from './curve';\n// import { scale } from 'react-native-size-scaling';\nimport ThemeVariables from '@wavemaker/app-rn-runtime/styles/theme.variables';\n\ninterface TabDataItem extends NavigationDataItem {\n floating: boolean;\n indexBeforeMid: number;\n}\n\nconst scale = (n: number) => n;\n\nclass WmTabbarState<T extends BaseNavProps> extends BaseNavState<T> {\n showMore = false;\n modalOptions = {} as ModalOptions;\n dataItems: TabDataItem[] = [];\n}\n\nexport default class WmTabbar extends BaseNavComponent<WmTabbarProps, WmTabbarState<WmTabbarProps>, WmTabbarStyles> {\n\n private tabbarHeight = 0;\n\n constructor(props: WmTabbarProps) {\n super(props, DEFAULT_CLASS, new WmTabbarProps(), new WmTabbarState());\n }\n\n private maxWidth = Dimensions.get(\"window\").width; \n private returnpathDown: any;\n\n renderTabItem(item: TabDataItem, testId: string, props: WmTabbarProps, onSelect: Function, floating = false) {\n\n const isActive = props.isActive && props.isActive(item);\n const getDisplayLabel = this.props.getDisplayExpression || ((label: string) => label);\n let increasedGap = Number(testId) === item?.indexBeforeMid && (this.state.dataItems.length % 2!=0) && ((props.classname || '').indexOf('clipped-tabbar') >= 0)\n ? [this.styles.tabItem, { paddingRight: 70 }]\n : [this.styles.tabItem];\n \n return (\n <View style={[increasedGap, floating? this.styles.centerHubItem: {}]} key={`${item.label}_${testId}`}>\n <TouchableOpacity\n {...this.getTestPropsForAction('item' + testId)}\n onPress={() => onSelect && onSelect()}\n key={item.key}\n >\n <View style={[isActive && !floating ? this.styles.activeTabItem : {}]}>\n <WmIcon\n styles={this.theme.mergeStyle({}, this.styles.tabIcon, floating? this.styles.centerHubIcon: {}, isActive ? this.styles.activeTabIcon : {})}\n iconclass={item.icon}\n ></WmIcon>\n </View>\n </TouchableOpacity>\n <Text style={[this.styles.tabLabel, floating? this.styles.centerHubLabel: {}, isActive ? this.styles.activeTabLabel : {}]}>\n {getDisplayLabel(item.label)}\n </Text>\n </View>\n );\n }\n \n onItemSelect(item: NavigationDataItem, navigationService: NavigationService) {\n item.link && navigationService.openUrl(item.link);\n this.invokeEventCallback('onSelect', [null, this.proxy, item]);\n }\n\n prepareModalOptions(content: ReactNode) {\n const o = this.state.modalOptions;\n o.content = content;\n o.modalStyle = {\n bottom: this.tabbarHeight\n };\n o.contentStyle = this.styles.modalContent; \n return o;\n }\n\n renderWidget(props: WmTabbarProps) {\n let max = 5;\n const tabItems = this.state.dataItems;\n const tabItemsLength = tabItems.length;\n const isClippedTabbar = ((props.classname || '').indexOf('clipped-tabbar') >= 0) && (tabItemsLength % 2 !== 0);\n if (tabItemsLength % 2 !== 0) {\n const middleIndex = Math.floor(tabItemsLength / 2);\n tabItems[middleIndex]['floating'] = true;\n tabItems[middleIndex - 1]['indexBeforeMid'] = middleIndex-1;\n }\n this.returnpathDown = getPathDown(this.maxWidth, 65 ,60,this.styles.root.height as number);\n const moreItems = [] as any[][];\n if (tabItems.length > max) {\n const moreItemsCount = Math.ceil((tabItems.length + 1 - max)/ max) * max;\n let j = 0;\n for (let i = max-1; i < moreItemsCount;) {\n const row = [];\n for (let j = 0; j < max; j++) {\n row[j] = tabItems[i++] || {key: 'tabItem' + i} as TabDataItem;\n }\n moreItems.push(row);\n }\n max = max - 1;\n }\n return (\n <NavigationServiceConsumer>\n {(navigationService) =>\n (<View style={this.styles.root}>\n {isClippedTabbar ? (\n <Svg width={this.maxWidth} height={scale(this.styles.root.height as number)} style={{zIndex: -1,position: 'absolute',backgroundColor: ThemeVariables.INSTANCE.transparent}}>\n <Path fill={ThemeVariables.INSTANCE.tabbarBackgroundColor} {...{ d: this.returnpathDown }}/>\n </Svg>\n ): <></>} \n <ModalConsumer>\n {(modalService: ModalService) => {\n if (this.state.showMore) {\n modalService.showModal(this.prepareModalOptions((\n <ThemeProvider value={this.theme} >\n <View style={this.styles.moreMenu}>\n {moreItems.map((a, i) =>\n (<View key={i} style={this.styles.moreMenuRow}>\n {a.map((item, index) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService)))}\n </View>)\n )}\n </View>\n </ThemeProvider>)));\n } else {\n modalService.hideModal(this.state.modalOptions);\n }\n return null;\n }}\n </ModalConsumer>\n <View style={this.styles.menu}\n onLayout={e => { this.tabbarHeight = e.nativeEvent.layout.height}}> \n {tabItems.filter((item, i) => i < max)\n .map((item, i) => this.renderTabItem(item, i + '', props, () => this.onItemSelect(item, navigationService), item.floating))}\n {tabItems.length > max && (\n this.renderTabItem({\n label: props.morebuttonlabel,\n icon: props.morebuttoniconclass\n } as TabDataItem, 6666 +'', props, () => {\n this.updateState({showMore: !this.state.showMore} as WmTabbarState<WmTabbarProps>);\n })\n )}\n </View>\n </View>)}\n </NavigationServiceConsumer>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -4,7 +4,9 @@ export const DEFAULT_CLASS = 'app-tabbar';
|
|
4
4
|
BASE_THEME.registerStyle((themeVariables, addStyle) => {
|
5
5
|
const defaultStyles = defineStyles({
|
6
6
|
root: {
|
7
|
-
height:
|
7
|
+
height: 80,
|
8
|
+
elevation: 3,
|
9
|
+
shadowColor: themeVariables.tabShadowColor
|
8
10
|
},
|
9
11
|
text: {},
|
10
12
|
menu: {
|
@@ -39,41 +41,61 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
|
|
39
41
|
flexDirection: 'column',
|
40
42
|
justifyContent: 'center',
|
41
43
|
alignItems: 'center',
|
42
|
-
|
43
|
-
|
44
|
+
minHeight: 32,
|
45
|
+
minWidth: 64,
|
46
|
+
opacity: 1,
|
47
|
+
marginBottom: 16
|
44
48
|
},
|
45
49
|
activeTabItem: {
|
46
|
-
opacity: 1
|
50
|
+
opacity: 1,
|
51
|
+
height: 32,
|
52
|
+
width: 64,
|
53
|
+
borderRadius: 50,
|
54
|
+
marginBottom: -2,
|
55
|
+
backgroundColor: themeVariables.tabActiveBackgroundColor
|
47
56
|
},
|
48
57
|
tabIcon: {
|
49
58
|
root: {
|
50
59
|
alignSelf: 'center',
|
51
|
-
paddingBottom: 32,
|
52
60
|
borderBottomColor: themeVariables.transparent,
|
53
|
-
|
61
|
+
paddingBottom: 4
|
54
62
|
},
|
55
63
|
icon: {
|
56
|
-
fontSize:
|
64
|
+
fontSize: 24,
|
65
|
+
paddingRight: 0,
|
57
66
|
color: themeVariables.tabbarIconColor
|
58
67
|
}
|
59
68
|
},
|
60
69
|
activeTabIcon: {
|
61
|
-
root: {
|
62
|
-
|
70
|
+
root: {},
|
71
|
+
icon: {
|
72
|
+
color: themeVariables.tabActiveIconColor
|
63
73
|
}
|
64
74
|
},
|
65
75
|
tabLabel: {
|
66
|
-
fontSize:
|
76
|
+
fontSize: 12,
|
77
|
+
marginTop: 4,
|
67
78
|
fontWeight: '500',
|
68
|
-
color: themeVariables.tabbarIconColor,
|
69
|
-
textAlign: 'center',
|
70
79
|
fontFamily: themeVariables.baseFont,
|
71
|
-
|
72
|
-
|
80
|
+
color: themeVariables.tabbarTextColor,
|
81
|
+
textAlign: 'center'
|
82
|
+
},
|
83
|
+
activeTabLabel: {
|
84
|
+
fontWeight: '700',
|
85
|
+
fontSize: 12,
|
86
|
+
fontFamily: themeVariables.baseFont,
|
87
|
+
color: themeVariables.tabLabelTextColor
|
73
88
|
},
|
74
|
-
|
89
|
+
centerHubItem: {},
|
90
|
+
centerHubIcon: {},
|
91
|
+
centerHubLabel: {}
|
75
92
|
});
|
76
93
|
addStyle(DEFAULT_CLASS, '', defaultStyles);
|
94
|
+
addStyle('tabbar-spacer', '', {
|
95
|
+
root: {
|
96
|
+
height: 96
|
97
|
+
}
|
98
|
+
});
|
77
99
|
addStyle(DEFAULT_CLASS + '-1', '', {
|
78
100
|
root: {
|
79
101
|
height: undefined
|
@@ -96,5 +118,50 @@ BASE_THEME.registerStyle((themeVariables, addStyle) => {
|
|
96
118
|
marginTop: 0
|
97
119
|
}
|
98
120
|
});
|
121
|
+
addStyle('clipped-tabbar', '', {
|
122
|
+
root: {
|
123
|
+
backgroundColor: themeVariables.transparent,
|
124
|
+
marginTop: -88
|
125
|
+
},
|
126
|
+
menu: {
|
127
|
+
backgroundColor: themeVariables.transparent
|
128
|
+
},
|
129
|
+
centerHubItem: {
|
130
|
+
width: 70,
|
131
|
+
height: 70,
|
132
|
+
shadowColor: 'grey',
|
133
|
+
shadowOpacity: 0.1,
|
134
|
+
opacity: 1,
|
135
|
+
shadowOffset: {
|
136
|
+
width: 2,
|
137
|
+
height: 0
|
138
|
+
},
|
139
|
+
shadowRadius: 2,
|
140
|
+
borderRadius: 35,
|
141
|
+
position: 'absolute',
|
142
|
+
bottom: 28,
|
143
|
+
alignItems: 'center',
|
144
|
+
justifyContent: 'center',
|
145
|
+
backgroundColor: themeVariables.centerHubItemColor,
|
146
|
+
left: themeVariables.maxWidth / 2 - 35
|
147
|
+
},
|
148
|
+
centerHubIcon: {
|
149
|
+
root: {
|
150
|
+
alignSelf: 'center',
|
151
|
+
paddingBottom: 0,
|
152
|
+
borderBottomColor: themeVariables.transparent,
|
153
|
+
borderBottomWidth: 0
|
154
|
+
},
|
155
|
+
icon: {
|
156
|
+
fontSize: 24,
|
157
|
+
color: themeVariables.centerHubIconColor
|
158
|
+
}
|
159
|
+
},
|
160
|
+
centerHubLabel: {
|
161
|
+
color: themeVariables.centerHubLabelColor,
|
162
|
+
marginTop: 0,
|
163
|
+
paddingBottom: 4
|
164
|
+
}
|
165
|
+
});
|
99
166
|
});
|
100
167
|
//# sourceMappingURL=tabbar.styles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","height","text","menu","flexDirection","backgroundColor","tabbarBackgroundColor","justifyContent","alignItems","modalContent","moreMenu","width","getStyle","shadowOffset","shadowOpacity","shadowRadius","moreMenuRow","paddingTop","paddingBottom","tabItem","minWidth","opacity","activeTabItem","tabIcon","alignSelf","borderBottomColor","transparent","borderBottomWidth","icon","fontSize","color","tabbarIconColor","activeTabIcon","tabLabel","fontWeight","textAlign","fontFamily","baseFont","marginTop","activeTabLabel","undefined","borderTopWidth","borderTopColor"],"sources":["tabbar.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmIconStyles } from '../../basic/icon/icon.styles';\n\nexport type WmTabbarStyles = BaseStyles & {\n menu: AllStyle,\n modalContent: AllStyle,\n moreMenu: AllStyle,\n moreMenuRow: AllStyle,\n tabItem: AllStyle,\n activeTabItem: AllStyle,\n tabIcon: WmIconStyles,\n activeTabIcon: WmIconStyles,\n tabLabel: AllStyle,\n activeTabLabel: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-tabbar';\n BASE_THEME.registerStyle((themeVariables, addStyle) => {\n const defaultStyles: WmTabbarStyles = defineStyles<WmTabbarStyles>({\n root: {\n height: 88\n },\n text: {},\n menu: {\n height: '100%',\n flexDirection: 'row',\n backgroundColor: themeVariables.tabbarBackgroundColor,\n justifyContent: 'space-around',\n alignItems: 'flex-end',\n },\n modalContent: {},\n moreMenu: {\n width: '100%',\n flexDirection: 'column-reverse',\n justifyContent: 'flex-end',\n backgroundColor: themeVariables.tabbarBackgroundColor,\n ...BASE_THEME.getStyle('elevate1').root,\n shadowOffset: {\n width: 0,\n height: -6\n },\n shadowOpacity: 0.3,\n shadowRadius: 6\n },\n moreMenuRow: {\n flexDirection: 'row-reverse',\n justifyContent: 'space-around',\n width: '100%',\n paddingTop: 4,\n paddingBottom: 4\n },\n tabItem: {\n flexDirection: 'column',\n justifyContent: 'center',\n alignItems: 'center',\n minWidth: 60,\n opacity: 0.4\n },\n activeTabItem: {\n opacity: 1\n },\n tabIcon: {\n root: {\n alignSelf: 'center',\n paddingBottom: 32,\n borderBottomColor: themeVariables.transparent,\n borderBottomWidth: 4\n },\n icon: {\n fontSize: 36,\n color: themeVariables.tabbarIconColor\n }\n } as WmIconStyles,\n activeTabIcon: {\n root: {\n borderBottomColor: themeVariables.tabbarIconColor,\n }\n } as WmIconStyles,\n tabLabel: {\n fontSize: 14,\n fontWeight: '500',\n color: themeVariables.tabbarIconColor,\n textAlign: 'center',\n fontFamily: themeVariables.baseFont,\n marginTop: -32,\n paddingBottom: 14\n },\n activeTabLabel: {}\n });\n\n addStyle(DEFAULT_CLASS, '', defaultStyles);\n addStyle(DEFAULT_CLASS+ '-1', '', {\n root: {\n height: undefined\n },\n tabItem: {\n justifyContent: 'space-between' \n },\n activeTabItem: {\n borderTopWidth: 4,\n borderTopColor: themeVariables.tabbarIconColor\n },\n tabIcon: {\n root: {\n paddingTop: 8,\n paddingBottom: 8,\n borderBottomWidth: 0\n }\n },\n tabLabel: {\n marginTop: 0\n }\n } as WmTabbarStyles);\n});"],"mappings":"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"}
|
1
|
+
{"version":3,"names":["BASE_THEME","defineStyles","DEFAULT_CLASS","registerStyle","themeVariables","addStyle","defaultStyles","root","height","elevation","shadowColor","tabShadowColor","text","menu","flexDirection","backgroundColor","tabbarBackgroundColor","justifyContent","alignItems","modalContent","moreMenu","width","getStyle","shadowOffset","shadowOpacity","shadowRadius","moreMenuRow","paddingTop","paddingBottom","tabItem","minHeight","minWidth","opacity","marginBottom","activeTabItem","borderRadius","tabActiveBackgroundColor","tabIcon","alignSelf","borderBottomColor","transparent","icon","fontSize","paddingRight","color","tabbarIconColor","activeTabIcon","tabActiveIconColor","tabLabel","marginTop","fontWeight","fontFamily","baseFont","tabbarTextColor","textAlign","activeTabLabel","tabLabelTextColor","centerHubItem","centerHubIcon","centerHubLabel","undefined","borderTopWidth","borderTopColor","borderBottomWidth","position","bottom","centerHubItemColor","left","maxWidth","centerHubIconColor","centerHubLabelColor"],"sources":["tabbar.styles.ts"],"sourcesContent":["import BASE_THEME, { AllStyle } from '@wavemaker/app-rn-runtime/styles/theme';\nimport { BaseStyles, defineStyles } from '@wavemaker/app-rn-runtime/core/base.component';\nimport { WmIconStyles } from '../../basic/icon/icon.styles';\n\nexport type WmTabbarStyles = BaseStyles & {\n menu: AllStyle,\n modalContent: AllStyle,\n moreMenu: AllStyle,\n moreMenuRow: AllStyle,\n tabItem: AllStyle,\n activeTabItem: AllStyle,\n tabIcon: WmIconStyles,\n activeTabIcon: WmIconStyles,\n tabLabel: AllStyle,\n activeTabLabel: AllStyle,\n centerHubItem: AllStyle,\n centerHubIcon: WmIconStyles,\n centerHubLabel: AllStyle\n};\n\nexport const DEFAULT_CLASS = 'app-tabbar';\n BASE_THEME.registerStyle((themeVariables, addStyle) => {\n const defaultStyles: WmTabbarStyles = defineStyles<WmTabbarStyles>({\n root: {\n height: 80,\n elevation: 3,\n shadowColor : themeVariables.tabShadowColor\n },\n text: {},\n menu: {\n height: '100%',\n flexDirection: 'row',\n backgroundColor: themeVariables.tabbarBackgroundColor,\n justifyContent: 'space-around',\n alignItems: 'flex-end',\n },\n modalContent: {},\n moreMenu: {\n width: '100%',\n flexDirection: 'column-reverse',\n justifyContent: 'flex-end',\n backgroundColor: themeVariables.tabbarBackgroundColor,\n ...BASE_THEME.getStyle('elevate1').root,\n shadowOffset: {\n width: 0,\n height: -6\n },\n shadowOpacity: 0.3,\n shadowRadius: 6\n },\n moreMenuRow: {\n flexDirection: 'row-reverse',\n justifyContent: 'space-around',\n width: '100%',\n paddingTop: 4,\n paddingBottom: 4\n },\n tabItem: {\n flexDirection: 'column',\n justifyContent: 'center',\n alignItems: 'center',\n minHeight: 32,\n minWidth: 64,\n opacity: 1,\n marginBottom: 16\n },\n activeTabItem: {\n opacity: 1,\n height: 32,\n width: 64,\n borderRadius: 50,\n marginBottom: -2,\n backgroundColor: themeVariables.tabActiveBackgroundColor\n },\n tabIcon: {\n root: {\n alignSelf: 'center',\n borderBottomColor: themeVariables.transparent,\n paddingBottom: 4\n },\n icon: {\n fontSize: 24,\n paddingRight: 0,\n color: themeVariables.tabbarIconColor\n }\n } as WmIconStyles,\n activeTabIcon: {\n root: {\n },\n icon:{\n color: themeVariables.tabActiveIconColor,\n }\n } as WmIconStyles,\n tabLabel: {\n fontSize: 12,\n marginTop: 4,\n fontWeight: '500',\n fontFamily: themeVariables.baseFont,\n color: themeVariables.tabbarTextColor,\n textAlign: 'center',\n },\n activeTabLabel: {\n fontWeight: '700',\n fontSize: 12,\n fontFamily: themeVariables.baseFont,\n color: themeVariables.tabLabelTextColor,\n },\n centerHubItem: {},\n centerHubIcon: {} as WmIconStyles, \n centerHubLabel:{}\n });\n\n addStyle(DEFAULT_CLASS, '', defaultStyles);\n addStyle('tabbar-spacer', '', {\n root: {\n height: 96\n }\n });\n addStyle(DEFAULT_CLASS+ '-1', '', {\n root: {\n height: undefined\n },\n tabItem: {\n justifyContent: 'space-between' \n },\n activeTabItem: {\n borderTopWidth: 4,\n borderTopColor: themeVariables.tabbarIconColor\n },\n tabIcon: {\n root: {\n paddingTop: 8,\n paddingBottom: 8,\n borderBottomWidth: 0\n }\n },\n tabLabel: {\n marginTop: 0\n }\n } as WmTabbarStyles);\n addStyle('clipped-tabbar', '', {\n root:{\n backgroundColor: themeVariables.transparent,\n marginTop: -88\n },\n menu: {\n backgroundColor: themeVariables.transparent\n },\n centerHubItem: {\n width: 70,\n height: 70,\n shadowColor: 'grey',\n shadowOpacity: 0.1,\n opacity: 1,\n shadowOffset: { width: 2, height: 0 },\n shadowRadius: 2,\n borderRadius: 35,\n position: 'absolute',\n bottom: 28,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: themeVariables.centerHubItemColor,\n left: (themeVariables.maxWidth/2) - 35\n },\n centerHubIcon: {\n root: {\n alignSelf: 'center',\n paddingBottom: 0,\n borderBottomColor: themeVariables.transparent,\n borderBottomWidth: 0 \n },\n icon: {\n fontSize: 24,\n color: themeVariables.centerHubIconColor\n }\n } as WmIconStyles, \n centerHubLabel:{\n color: themeVariables.centerHubLabelColor,\n marginTop: 0,\n paddingBottom: 4\n }\n })\n});"],"mappings":"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"}
|