@traund/orquezta-widget-calculator 1.1.3 → 1.1.4

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.
Files changed (7) hide show
  1. package/dist/index.js +38 -30
  2. package/dist/index.js.map +1 -1
  3. package/dist/module.js +38 -30
  4. package/dist/module.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/components/inputAmount.js +22 -24
  7. package/src/simulator.js +14 -14
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@traund/orquezta-widget-calculator",
3
- "version": "1.1.3",
3
+ "version": "1.1.4",
4
4
  "description": "Calculator React component",
5
5
  "main": "dist/index.js",
6
6
  "typings": "dist/index.js",
package/src/components/inputAmount.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import Autocomplete from '@mui/material/Autocomplete';
2
- import Box from '@mui/material/Box';
3
2
  import CircularProgress from '@mui/material/CircularProgress';
4
3
  import FormHelperText from '@mui/material/FormHelperText';
5
4
  import InputAdornment from '@mui/material/InputAdornment';
@@ -15,6 +14,7 @@ import componentStyles from "./componentStyles";
15
14
  const filterOptions = (options, { inputValue }) => {
16
15
  return matchSorter(options, inputValue, { keys: ["label", "currency"] });
17
16
  }
17
+
18
18
  const InputAmount = (props) => {
19
19
  const classes = componentStyles;
20
20
 
@@ -78,7 +78,7 @@ const InputAmount = (props) => {
78
78
  />
79
79
  </Paper>
80
80
  </Grid>
81
- <Grid size={{ xs: 5}}>
81
+ <Grid size={{ xs: 7}}>
82
82
  <Autocomplete
83
83
  disabled={user.isLoading || user.isDisabled}
84
84
  options={transferOptions}
@@ -90,34 +90,29 @@ const InputAmount = (props) => {
90
90
  fontSize: 18,
91
91
  },
92
92
  }}
93
- isOptionEqualToValue={(option, value) => option.code === value?.code}
94
- value={selectedOption ? transferOptions.find(x => x.code === selectedOption.code) || null : null}
93
+ filterOptions={filterOptions}
94
+ value={
95
+ transferOptions.find(x => x.code == selectedOption.code)
96
+ }
95
97
  autoHighlight
96
- getOptionLabel={(option) => {
97
- if (!option) return '';
98
- if (typeof option === 'string') return option;
99
- if (typeof option.currency === 'string') return option.currency;
100
- return '';
101
- }}
98
+ getOptionLabel={(option) =>
99
+ `${option?.currency || ""}`
100
+ }
102
101
  renderOption={(props, option) => {
103
- if (!option) return null;
104
102
  const { key, ...restProps } = props;
105
- const code = option.code || 'unknown';
106
- const currency = option.currency || '';
107
- const flagCode = code === "PE-USD" ? "PE" : code;
108
-
109
103
  return (
110
- <Box component="li" key={`${code}-${currency}`} {...restProps}>
104
+ <>
111
105
  <span style={{ marginRight: "5px" }}>
112
- <FlagsHelpers code={flagCode} />
106
+ <FlagsHelpers code={option.code == "PE-USD" ? "PE" : option.code} />
113
107
  </span>
114
- {currency}
115
- </Box>
108
+ {" "}
109
+ {option?.currency || ""}
110
+ </>
116
111
  );
117
112
  }}
118
113
  disableClearable
119
114
  renderInput={(params) => (
120
- <Paper variant="outlined" style={classes.rootFlags}>
115
+ <Paper variant="outlined" style={classes.rootFlags} >
121
116
  <TextField
122
117
  style={{ fontSize: "15px" }}
123
118
  {...params}
@@ -126,15 +121,18 @@ const InputAmount = (props) => {
126
121
  ...params.InputProps,
127
122
  startAdornment: (
128
123
  <FlagsHelpers
129
- code={selectedOption.code == "PE-USD" ? "PE" : selectedOption.code}
130
- />
124
+ code={selectedOption.code == "PE-USD" ?
125
+ "PE" :
126
+ selectedOption.code
127
+ }>
128
+ </FlagsHelpers>
131
129
  ),
132
130
  disableUnderline: true,
133
131
  }}
134
132
  />
135
133
  </Paper>
136
134
  )}
137
- onChange={(event, value) => onChangeCountry && onChangeCountry(event, value)}
135
+ onChange={onChangeCountry}
138
136
  />
139
137
  </Grid>
140
138
  </Grid>
@@ -161,4 +159,4 @@ const InputAmount = (props) => {
161
159
  );
162
160
  }
163
161
 
164
- export default InputAmount;
162
+ export default InputAmount;
package/src/simulator.js CHANGED
@@ -906,7 +906,7 @@ function Simulator(props) {
906
906
  cleanSimulationMode(storeId, simulatorMode, sender?.selectedOption?.type, sender?.selectedOption?.code, sender?.amount, receiver?.selectedOption?.code, sender?.currency, receiver?.currency);
907
907
  }, [simulatorMode])
908
908
 
909
- return <Fragment>
909
+ return <main>
910
910
  <link
911
911
  href="https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap"
912
912
  rel="stylesheet"
@@ -967,7 +967,7 @@ function Simulator(props) {
967
967
  {(simulatorMode === SimulatorMode.SEND) ?
968
968
  <Grid size={{ xs: 12}}>
969
969
  <Grid container>
970
- <Grid size={{ xs: 12}} >
970
+ <Grid size={{ xs: 12}} sx={{ paddingBottom: "15px" }}>
971
971
  <InputAmount
972
972
  id="transfer-sender"
973
973
  content={content}
@@ -987,7 +987,7 @@ function Simulator(props) {
987
987
  />
988
988
  </Grid>}
989
989
  {(sender.selectedOption.type == TransferType.COUNTRY) ?
990
- <Grid size={{ xs: 12}} >
990
+ <Grid size={{ xs: 12}} sx={{ paddingBottom: "15px" }}>
991
991
 
992
992
  <InputAmount
993
993
  id="transfer-receiver"
@@ -999,7 +999,7 @@ function Simulator(props) {
999
999
  />
1000
1000
 
1001
1001
  </Grid> :
1002
- <Grid size={{ xs: 12}} >
1002
+ <Grid size={{ xs: 12}} sx={{ paddingBottom: "15px" }}>
1003
1003
 
1004
1004
  <InputAmount
1005
1005
  id="wallet-receiver"
@@ -1018,7 +1018,7 @@ function Simulator(props) {
1018
1018
  {(simulatorMode === SimulatorMode.COLLECT) ?
1019
1019
  <Grid size={{ xs: 12}}>
1020
1020
  <Grid container>
1021
- <Grid size={{ xs: 12}} >
1021
+ <Grid size={{ xs: 12}} sx={{ paddingBottom: "15px" }}>
1022
1022
  <InputAmount
1023
1023
  id="collect-sender"
1024
1024
  content={content}
@@ -1036,7 +1036,7 @@ function Simulator(props) {
1036
1036
  locale={locale}
1037
1037
  />
1038
1038
  </Grid>}
1039
- <Grid size={{ xs: 12}} >
1039
+ <Grid size={{ xs: 12}} sx={{ paddingBottom: "15px" }}>
1040
1040
  <InputAmount
1041
1041
  id="collect-receiver"
1042
1042
  content={content}
@@ -1052,12 +1052,12 @@ function Simulator(props) {
1052
1052
 
1053
1053
  {
1054
1054
  (["VE", "AR"].includes(receiver.selectedOption.code) && !receiver.isLoading) &&
1055
- <Grid size={{ xs: 12}} >
1055
+ <Grid size={{ xs: 12}} sx={{ marginTop: "15px", marginBottom: "15px" }}>
1056
1056
  <PaymentMethodSelector paymentMethods={receiver.paymentMethods} onChange={handleOnchangePaymentMethod} />
1057
1057
  </Grid>
1058
1058
  }
1059
1059
 
1060
- {!props.onlyView && <Grid size={{ xs: 12}} >
1060
+ {!props.onlyView && <Grid size={{ xs: 12}} sx={{ marginBottom: "15px" }}>
1061
1061
  <Disclaimers
1062
1062
  simulatorMode={simulatorMode}
1063
1063
  transferType={sender.selectedOption.type}
@@ -1066,16 +1066,16 @@ function Simulator(props) {
1066
1066
  option={sender.selectedOption}
1067
1067
  />
1068
1068
  </Grid>}
1069
- {!props.onlyView && <Grid size={{ xs: 12}} sx={{marginTop: "15px",marginBottom: "15px"}}>
1069
+ {!props.onlyView && <Grid size={{ xs: 12}}>
1070
1070
  <Button className={classes.button} variant="contained" onClick={handleNext}
1071
1071
  disabled={sender.isLoading || receiver.isLoading || isOutOfLimits()} fullWidth>
1072
1072
  {content.simulator.footer_action_button}
1073
1073
  </Button>
1074
1074
  </Grid>}
1075
- <Grid size={{ xs: 12}} sx={{ textAlign: "center",marginTop: "15px" }}>
1075
+ <Grid size={{ xs: 12}} sx={{ textAlign: "center", marginTop: "15px", marginBottom: "15px" }}>
1076
1076
  {(recalculate && sender.selectedOption.type != TransferType.WALLET) && <Timer onTimeout={calculateAgain} locale={locale} />}
1077
1077
  </Grid>
1078
- <Grid size={{ xs: 12}} sx={{marginTop: "60px"}}>
1078
+ <Grid size={{ xs: 12}} sx={{marginTop: "30px"}}>
1079
1079
  <Divider ></Divider>
1080
1080
  </Grid>
1081
1081
  <Grid size={{ xs: 12}} container
@@ -1087,13 +1087,13 @@ function Simulator(props) {
1087
1087
  variant="subtitle1"
1088
1088
  sx={{ display: "flex", alignItems: "center", textAlign: "center" }}
1089
1089
  >
1090
- <span sx={{ fontSize: "10px", textAlign: "center" }}>Powered by&nbsp;</span>
1091
- <span sx={{ fontWeight: "bold", fontSize: "12px", textAlign: "center" }}>Orquezta</span>
1090
+ <span style={{ fontSize: "10px", textAlign: "center" }}>Powered by&nbsp;</span>
1091
+ <span style={{ fontWeight: "bold", fontSize: "12px", textAlign: "center" }}>Orquezta</span>
1092
1092
  </Typography>
1093
1093
  </Grid>
1094
1094
  </Grid>
1095
1095
  </Paper>
1096
- </Fragment>;
1096
+ </main>;
1097
1097
  }
1098
1098
 
1099
1099
  export default Simulator;