@flozy/editor 1.7.4 → 1.7.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,10 +1,11 @@
1
- import React from "react";
2
- import { Grid, Radio, RadioGroup, Typography, FormControlLabel, Select, MenuItem, FormControl, TextField } from "@mui/material";
1
+ import React, { useState } from "react";
2
+ import { Grid, Radio, RadioGroup, Typography, FormControlLabel, Select, MenuItem, FormControl, TextField, Button, Menu } from "@mui/material";
3
3
  import FormStyles from "./Styles";
4
4
  import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
5
5
  import UserInputs from "./UserInputs";
6
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
8
+ import { Fragment as _Fragment } from "react/jsx-runtime";
8
9
  const FormWorkflow = props => {
9
10
  const {
10
11
  schedule,
@@ -23,6 +24,9 @@ const FormWorkflow = props => {
23
24
  handleInputReset
24
25
  } = props;
25
26
  const classes = FormStyles();
27
+ const [anchorEl, setAnchorEl] = useState(null);
28
+ const variables = element?.children;
29
+ const type = 1;
26
30
  const handleBodyField = event => {
27
31
  setBodyData(event.target.value);
28
32
  };
@@ -35,6 +39,14 @@ const FormWorkflow = props => {
35
39
  const onSubjectChange = event => {
36
40
  setSubject(event.target.value);
37
41
  };
42
+ const handleVariables = event => {
43
+ event.stopPropagation();
44
+ setAnchorEl(event.currentTarget);
45
+ };
46
+ const handleClose = event => {
47
+ event.stopPropagation();
48
+ setAnchorEl(null);
49
+ };
38
50
  return /*#__PURE__*/_jsxs(Grid, {
39
51
  container: true,
40
52
  children: [/*#__PURE__*/_jsxs(Grid, {
@@ -154,13 +166,47 @@ const FormWorkflow = props => {
154
166
  },
155
167
  "& textarea": {
156
168
  fontSize: "16px",
157
- fontWeight: 500
169
+ fontWeight: 500,
170
+ width: "410px"
158
171
  },
159
172
  "& textarea:focus-visible": {
160
173
  outline: "none",
161
174
  borderRadius: "none",
162
175
  border: "none"
176
+ },
177
+ "& .MuiOutlinedInput-root": {
178
+ padding: "8px 10px"
163
179
  }
180
+ },
181
+ InputProps: {
182
+ endAdornment: /*#__PURE__*/_jsxs(_Fragment, {
183
+ children: [/*#__PURE__*/_jsx(Button, {
184
+ sx: classes.variableBtn,
185
+ onClick: handleVariables,
186
+ endIcon: /*#__PURE__*/_jsx(KeyboardArrowDownIcon, {}),
187
+ children: "Variables"
188
+ }), /*#__PURE__*/_jsx(Menu, {
189
+ id: "basic-menu",
190
+ open: Boolean(anchorEl),
191
+ anchorEl: anchorEl,
192
+ onClose: handleClose,
193
+ anchorOrigin: {
194
+ vertical: "bottom",
195
+ horizontal: "right"
196
+ },
197
+ transformOrigin: {
198
+ vertical: "top",
199
+ horizontal: "right"
200
+ },
201
+ children: variables?.map((m, i) => /*#__PURE__*/_jsx(MenuItem, {
202
+ sx: {
203
+ color: "#64748B"
204
+ },
205
+ onClick: handleSelectedVariables(m, type),
206
+ children: m.name
207
+ }, `menu_${i}_${m.name}`))
208
+ })]
209
+ })
164
210
  }
165
211
  })]
166
212
  }), /*#__PURE__*/_jsxs(Grid, {
@@ -2,8 +2,8 @@ import React from "react";
2
2
  import { Grid, Typography } from "@mui/material";
3
3
  import FormStyles from "./Styles";
4
4
  import MoreOptions from "./MoreOptions";
5
- import { jsx as _jsx } from "react/jsx-runtime";
6
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
7
  const ListWorkflow = props => {
8
8
  const {
9
9
  workflow,
@@ -27,110 +27,127 @@ const ListWorkflow = props => {
27
27
  xs: 12,
28
28
  children: /*#__PURE__*/_jsxs(Grid, {
29
29
  container: true,
30
- sx: classes.flowListCard,
31
- alignItems: "center",
32
- justifyContent: "space-between",
33
30
  children: [/*#__PURE__*/_jsx(Grid, {
34
31
  item: true,
35
- xs: 11,
32
+ sx: classes.emailIndexCard,
33
+ children: /*#__PURE__*/_jsxs(Typography, {
34
+ sx: {
35
+ fontSize: "12px",
36
+ fontWeight: 600
37
+ },
38
+ children: ["Email ", index + 1]
39
+ })
40
+ }), /*#__PURE__*/_jsx(Grid, {
41
+ item: true,
42
+ xs: 12,
36
43
  children: /*#__PURE__*/_jsxs(Grid, {
37
44
  container: true,
38
- gap: 1,
45
+ sx: classes.flowListCard,
46
+ alignItems: "center",
47
+ justifyContent: "space-between",
39
48
  children: [/*#__PURE__*/_jsx(Grid, {
40
49
  item: true,
41
- xs: 12,
42
- children: /*#__PURE__*/_jsxs(Grid, {
43
- container: true,
44
- alignItems: "center",
45
- children: [/*#__PURE__*/_jsx(Grid, {
46
- item: true,
47
- children: /*#__PURE__*/_jsx(Typography, {
48
- sx: classes.listHeading,
49
- children: "Subject:"
50
- })
51
- }), /*#__PURE__*/_jsx(Grid, {
52
- item: true,
53
- children: /*#__PURE__*/_jsx(Typography, {
54
- sx: classes.listSubHeading,
55
- style: {
56
- paddingLeft: '24px'
57
- },
58
- children: flow.subject_data
59
- })
60
- })]
61
- })
62
- }), /*#__PURE__*/_jsx(Grid, {
63
- item: true,
64
- xs: 12,
65
- children: /*#__PURE__*/_jsxs(Grid, {
66
- container: true,
67
- alignItems: "center",
68
- children: [/*#__PURE__*/_jsx(Grid, {
69
- item: true,
70
- children: /*#__PURE__*/_jsx(Typography, {
71
- sx: classes.listHeading,
72
- children: "Body:"
73
- })
74
- }), /*#__PURE__*/_jsx(Grid, {
75
- item: true,
76
- children: /*#__PURE__*/_jsx(Typography, {
77
- sx: classes.listSubHeading,
78
- style: {
79
- paddingLeft: '40px'
80
- },
81
- children: flow.body_data
82
- })
83
- })]
84
- })
85
- }), /*#__PURE__*/_jsx(Grid, {
86
- item: true,
87
- xs: 12,
50
+ xs: 11,
88
51
  children: /*#__PURE__*/_jsxs(Grid, {
89
52
  container: true,
90
- alignItems: "center",
53
+ gap: 1,
91
54
  children: [/*#__PURE__*/_jsx(Grid, {
92
55
  item: true,
93
- children: /*#__PURE__*/_jsx(Typography, {
94
- sx: classes.listHeading,
95
- children: "Scheduled:"
96
- })
97
- }), /*#__PURE__*/_jsx(Grid, {
98
- item: true,
56
+ xs: 12,
99
57
  children: /*#__PURE__*/_jsxs(Grid, {
100
58
  container: true,
59
+ alignItems: "center",
101
60
  children: [/*#__PURE__*/_jsx(Grid, {
61
+ item: true,
62
+ children: /*#__PURE__*/_jsx(Typography, {
63
+ sx: classes.listHeading,
64
+ children: "Subject:"
65
+ })
66
+ }), /*#__PURE__*/_jsx(Grid, {
102
67
  item: true,
103
68
  children: /*#__PURE__*/_jsx(Typography, {
104
69
  sx: classes.listSubHeading,
105
70
  style: {
106
- paddingLeft: '5px'
71
+ paddingLeft: '24px'
107
72
  },
108
- children: flow.schedule_type
73
+ children: flow.subject_data
74
+ })
75
+ })]
76
+ })
77
+ }), /*#__PURE__*/_jsx(Grid, {
78
+ item: true,
79
+ xs: 12,
80
+ children: /*#__PURE__*/_jsxs(Grid, {
81
+ container: true,
82
+ alignItems: "center",
83
+ children: [/*#__PURE__*/_jsx(Grid, {
84
+ item: true,
85
+ children: /*#__PURE__*/_jsx(Typography, {
86
+ sx: classes.listHeading,
87
+ children: "Body:"
109
88
  })
110
- }), flow.schedule_type === 'after' && /*#__PURE__*/_jsx(Grid, {
89
+ }), /*#__PURE__*/_jsx(Grid, {
111
90
  item: true,
112
- children: /*#__PURE__*/_jsxs(Typography, {
91
+ children: /*#__PURE__*/_jsx(Typography, {
113
92
  sx: classes.listSubHeading,
114
93
  style: {
115
- paddingLeft: '5px'
94
+ paddingLeft: '40px'
116
95
  },
117
- children: [flow.schedule_on, flow.schedule_every]
96
+ children: flow.body_data
97
+ })
98
+ })]
99
+ })
100
+ }), /*#__PURE__*/_jsx(Grid, {
101
+ item: true,
102
+ xs: 12,
103
+ children: /*#__PURE__*/_jsxs(Grid, {
104
+ container: true,
105
+ alignItems: "center",
106
+ children: [/*#__PURE__*/_jsx(Grid, {
107
+ item: true,
108
+ children: /*#__PURE__*/_jsx(Typography, {
109
+ sx: classes.listHeading,
110
+ children: "Scheduled:"
111
+ })
112
+ }), /*#__PURE__*/_jsx(Grid, {
113
+ item: true,
114
+ children: /*#__PURE__*/_jsxs(Grid, {
115
+ container: true,
116
+ children: [/*#__PURE__*/_jsx(Grid, {
117
+ item: true,
118
+ children: /*#__PURE__*/_jsx(Typography, {
119
+ sx: classes.listSubHeading,
120
+ style: {
121
+ paddingLeft: '5px'
122
+ },
123
+ children: flow.schedule_type
124
+ })
125
+ }), flow.schedule_type === 'after' && /*#__PURE__*/_jsx(Grid, {
126
+ item: true,
127
+ children: /*#__PURE__*/_jsxs(Typography, {
128
+ sx: classes.listSubHeading,
129
+ style: {
130
+ paddingLeft: '5px'
131
+ },
132
+ children: [flow.schedule_on, flow.schedule_every]
133
+ })
134
+ })]
118
135
  })
119
136
  })]
120
137
  })
121
138
  })]
122
139
  })
140
+ }), /*#__PURE__*/_jsx(Grid, {
141
+ item: true,
142
+ xs: 1,
143
+ children: /*#__PURE__*/_jsx(MoreOptions, {
144
+ classes: classes,
145
+ menus: optionsList,
146
+ selectedFlow: index,
147
+ onMenuClick: onMenuClick
148
+ })
123
149
  })]
124
150
  })
125
- }), /*#__PURE__*/_jsx(Grid, {
126
- item: true,
127
- xs: 1,
128
- children: /*#__PURE__*/_jsx(MoreOptions, {
129
- classes: classes,
130
- menus: optionsList,
131
- selectedFlow: index,
132
- onMenuClick: onMenuClick
133
- })
134
151
  })]
135
152
  })
136
153
  }, `workflow_list_${index}`))
@@ -1,6 +1,5 @@
1
1
  import React, { useState } from "react";
2
2
  import { IconButton, Menu, MenuItem, Tooltip } from "@mui/material";
3
- import { MoreHorizontal } from "../../../common/iconslist";
4
3
  import Icon from "../../../common/Icon";
5
4
  import { jsx as _jsx } from "react/jsx-runtime";
6
5
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -11,8 +11,8 @@ const FormStyles = () => ({
11
11
  bodyTextArea: {
12
12
  "& textarea": {
13
13
  border: "none",
14
- width: "100%",
15
- maxWidth: "100%",
14
+ width: "95%",
15
+ maxWidth: "95%",
16
16
  outline: "none",
17
17
  padding: "12px"
18
18
  },
@@ -149,7 +149,7 @@ const FormStyles = () => ({
149
149
  borderRadius: "10px"
150
150
  },
151
151
  toolBar: {
152
- padding: "5px"
152
+ padding: "8px 10px 5px 5px"
153
153
  },
154
154
  colorButtons: {
155
155
  "& .buttonsWrpr": {
@@ -205,11 +205,24 @@ const FormStyles = () => ({
205
205
  dialogFooter: {
206
206
  "&.MuiDialogActions-root": {
207
207
  padding: "8px 24px"
208
+ },
209
+ "& .secondaryBtn": {
210
+ marginRight: "0px !important"
211
+ },
212
+ "& .primaryBtn": {
213
+ marginLeft: "15px !important"
208
214
  }
209
215
  },
210
216
  toolButtons: {
211
217
  width: "36px",
212
218
  height: "36px"
219
+ },
220
+ emailIndexCard: {
221
+ borderRadius: "5px 5px 0 0",
222
+ background: "#2563EB",
223
+ color: "#fff",
224
+ padding: "8px",
225
+ marginLeft: "8px"
213
226
  }
214
227
  });
215
228
  export default FormStyles;
@@ -2,7 +2,7 @@ import { Button, Divider, Grid, IconButton, Menu, MenuItem, TextareaAutosize, To
2
2
  import React, { useState } from "react";
3
3
  import FormStyles from "./Styles";
4
4
  import Icon from "../../../common/Icon";
5
- import { PlusIcon, RestRight } from "../../../common/iconslist";
5
+ import { RestRight } from "../../../common/iconslist";
6
6
  import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
7
7
  import { AllColors } from "../../Color Picker/ColorButtons";
8
8
  import PopupToolStyle from "../../../Toolbar/PopupTool/PopupToolStyle";
@@ -156,10 +156,8 @@ const UserInputs = props => {
156
156
  item: true,
157
157
  children: [/*#__PURE__*/_jsx(Button, {
158
158
  sx: classes.variableBtn,
159
- variant: "outlined",
160
- size: "small",
161
159
  onClick: handleVariables,
162
- startIcon: /*#__PURE__*/_jsx(PlusIcon, {}),
160
+ endIcon: /*#__PURE__*/_jsx(KeyboardArrowDownIcon, {}),
163
161
  children: "Variables"
164
162
  }), /*#__PURE__*/_jsx(Menu, {
165
163
  id: "basic-menu",
@@ -9,14 +9,10 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
9
9
  const Uploader = props => {
10
10
  const {
11
11
  value,
12
- data,
13
12
  onUploaded,
14
13
  customProps
15
14
  } = props;
16
15
  const classes = UploadStyles();
17
- const {
18
- key
19
- } = data;
20
16
  const [base64, setBase64] = useState(value?.url);
21
17
  const [uploading, setUploading] = useState(false);
22
18
  const handleChange = async e => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "1.7.4",
3
+ "version": "1.7.5",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"