@flozy/editor 1.7.5 → 1.7.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (69) hide show
  1. package/dist/Editor/CommonEditor.js +30 -12
  2. package/dist/Editor/DialogWrapper.js +2 -10
  3. package/dist/Editor/Editor.css +105 -0
  4. package/dist/Editor/Elements/Color Picker/ColorButtons.js +20 -5
  5. package/dist/Editor/Elements/Color Picker/ColorPicker.js +9 -6
  6. package/dist/Editor/Elements/Color Picker/LogoIcon.js +15 -49
  7. package/dist/Editor/Elements/Color Picker/Styles.js +27 -6
  8. package/dist/Editor/Elements/Color Picker/defaultColors.js +1 -1
  9. package/dist/Editor/Elements/Embed/Image.js +25 -31
  10. package/dist/Editor/Elements/Embed/Video.js +49 -40
  11. package/dist/Editor/Elements/Form/Workflow/Styles.js +3 -2
  12. package/dist/Editor/Elements/Grid/Grid.js +67 -114
  13. package/dist/Editor/Elements/Grid/GridItem.js +9 -23
  14. package/dist/Editor/Elements/Grid/templates/default_grid.js +0 -23
  15. package/dist/Editor/Elements/Link/Link.js +58 -20
  16. package/dist/Editor/Elements/Link/LinkButton.js +37 -97
  17. package/dist/Editor/Elements/Link/LinkPopup.js +106 -0
  18. package/dist/Editor/Elements/List/CheckList.js +28 -22
  19. package/dist/Editor/Elements/Signature/SignatureOptions/TypeSignature.js +11 -5
  20. package/dist/Editor/Elements/Signature/SignaturePopup.js +15 -4
  21. package/dist/Editor/Elements/SimpleText.js +30 -26
  22. package/dist/Editor/MiniEditor.js +4 -6
  23. package/dist/Editor/Styles/EditorStyles.js +72 -1
  24. package/dist/Editor/Toolbar/FormatTools/TextSize.js +2 -1
  25. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +5 -1
  26. package/dist/Editor/Toolbar/PopupTool/AddTemplates.js +3 -1
  27. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +4 -1
  28. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +96 -19
  29. package/dist/Editor/Toolbar/toolbarGroups.js +1 -1
  30. package/dist/Editor/common/Icon.js +7 -4
  31. package/dist/Editor/common/Section/index.js +118 -0
  32. package/dist/Editor/common/Shorthands/elements.js +1 -1
  33. package/dist/Editor/common/StyleBuilder/appHeaderStyle.js +5 -1
  34. package/dist/Editor/common/StyleBuilder/buttonStyle.js +44 -51
  35. package/dist/Editor/common/StyleBuilder/embedImageStyle.js +2 -24
  36. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -3
  37. package/dist/Editor/common/StyleBuilder/fieldStyle.js +0 -3
  38. package/dist/Editor/common/StyleBuilder/fieldTypes/alignment.js +52 -62
  39. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +2 -1
  40. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +100 -74
  41. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +41 -10
  42. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +3 -3
  43. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +27 -77
  44. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -5
  45. package/dist/Editor/common/StyleBuilder/fieldTypes/gridSize.js +19 -15
  46. package/dist/Editor/common/StyleBuilder/fieldTypes/icons.js +2 -2
  47. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +2 -2
  48. package/dist/Editor/common/StyleBuilder/fieldTypes/radiusStyle.js +67 -8
  49. package/dist/Editor/common/StyleBuilder/fieldTypes/saveAsTemplate.js +2 -3
  50. package/dist/Editor/common/StyleBuilder/fieldTypes/text.js +21 -32
  51. package/dist/Editor/common/StyleBuilder/fieldTypes/textAlign.js +37 -41
  52. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +26 -24
  53. package/dist/Editor/common/StyleBuilder/formStyle.js +0 -6
  54. package/dist/Editor/common/StyleBuilder/gridItemStyle.js +38 -54
  55. package/dist/Editor/common/StyleBuilder/gridStyle.js +20 -26
  56. package/dist/Editor/common/StyleBuilder/index.js +14 -58
  57. package/dist/Editor/common/StyleBuilder/sectionStyle.js +16 -0
  58. package/dist/Editor/helper/index.js +63 -1
  59. package/dist/Editor/utils/Decorators/index.js +5 -0
  60. package/dist/Editor/utils/Decorators/link.js +26 -0
  61. package/dist/Editor/utils/SlateUtilityFunctions.js +36 -8
  62. package/dist/Editor/utils/accordion.js +17 -4
  63. package/dist/Editor/utils/button.js +15 -1
  64. package/dist/Editor/utils/customHooks/useElement.js +28 -0
  65. package/dist/Editor/utils/embed.js +1 -7
  66. package/dist/Editor/utils/events.js +92 -43
  67. package/dist/Editor/utils/gridItem.js +1 -1
  68. package/dist/Editor/utils/link.js +10 -9
  69. package/package.json +1 -1
@@ -3,6 +3,7 @@ import { Grid, Radio, RadioGroup, FormControl, FormLabel, FormControlLabel, Typo
3
3
  import { JustifyStartIcon, JustifyCenterIcon, JustifyEndIcon, AlignEndIcon, AlignCenterIcon, AlignStartIcon, DirectionRowIcon, DirectionColumIcon, DirectionReverseIcon } from "../../iconslist";
4
4
  import { jsx as _jsx } from "react/jsx-runtime";
5
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
6
+ import { Fragment as _Fragment } from "react/jsx-runtime";
6
7
  const Alignment = props => {
7
8
  const {
8
9
  value,
@@ -21,12 +22,7 @@ const Alignment = props => {
21
22
  });
22
23
  };
23
24
  const flexDirection = value?.flexDirection || "row";
24
- return /*#__PURE__*/_jsxs(Grid, {
25
- container: true,
26
- style: {
27
- paddingTop: "12px"
28
- },
29
- spacing: 1,
25
+ return /*#__PURE__*/_jsxs(_Fragment, {
30
26
  children: [/*#__PURE__*/_jsx(Grid, {
31
27
  item: true,
32
28
  xs: 12,
@@ -40,64 +36,58 @@ const Alignment = props => {
40
36
  fontSize: "14px",
41
37
  fontWeight: 500
42
38
  },
43
- children: "Align Items"
39
+ children: "Alignment"
44
40
  })
45
- }), /*#__PURE__*/_jsxs(RadioGroup, {
46
- row: true,
47
- "aria-labelledby": "pos-align-tems",
48
- name: "horizantal",
49
- value: value?.horizantal || "start",
50
- onChange: handleChange,
51
- className: "iconRadioButton",
52
- children: [/*#__PURE__*/_jsx(FormControlLabel, {
53
- value: "start",
54
- control: /*#__PURE__*/_jsx(Radio, {}),
55
- label: /*#__PURE__*/_jsx(AlignStartIcon, {})
56
- }), /*#__PURE__*/_jsx(FormControlLabel, {
57
- value: "center",
58
- control: /*#__PURE__*/_jsx(Radio, {}),
59
- label: /*#__PURE__*/_jsx(AlignCenterIcon, {})
60
- }), /*#__PURE__*/_jsx(FormControlLabel, {
61
- value: "end",
62
- control: /*#__PURE__*/_jsx(Radio, {}),
63
- label: /*#__PURE__*/_jsx(AlignEndIcon, {})
64
- })]
65
- })]
66
- })
67
- }), /*#__PURE__*/_jsx(Grid, {
68
- item: true,
69
- xs: 12,
70
- children: /*#__PURE__*/_jsxs(FormControl, {
71
- children: [/*#__PURE__*/_jsx(FormLabel, {
72
- id: "pos-jc",
73
- children: /*#__PURE__*/_jsx(Typography, {
74
- variant: "body1",
75
- color: "primary",
41
+ }), /*#__PURE__*/_jsxs("div", {
42
+ style: {
43
+ display: "flex"
44
+ },
45
+ children: [/*#__PURE__*/_jsxs(RadioGroup, {
46
+ row: true,
47
+ "aria-labelledby": "pos-align-tems",
48
+ name: "horizantal",
49
+ value: value?.horizantal || "start",
50
+ onChange: handleChange,
51
+ className: "iconRadioButton",
76
52
  style: {
77
- fontSize: "14px",
78
- fontWeight: 500
53
+ display: "flex"
79
54
  },
80
- children: "Justify Content"
81
- })
82
- }), /*#__PURE__*/_jsxs(RadioGroup, {
83
- row: true,
84
- "aria-labelledby": "pos-jc",
85
- name: "vertical",
86
- value: value?.vertical || "start",
87
- onChange: handleChange,
88
- className: "iconRadioButton",
89
- children: [/*#__PURE__*/_jsx(FormControlLabel, {
90
- value: "start",
91
- control: /*#__PURE__*/_jsx(Radio, {}),
92
- label: /*#__PURE__*/_jsx(JustifyStartIcon, {})
93
- }), /*#__PURE__*/_jsx(FormControlLabel, {
94
- value: "center",
95
- control: /*#__PURE__*/_jsx(Radio, {}),
96
- label: /*#__PURE__*/_jsx(JustifyCenterIcon, {})
97
- }), /*#__PURE__*/_jsx(FormControlLabel, {
98
- value: "end",
99
- control: /*#__PURE__*/_jsx(Radio, {}),
100
- label: /*#__PURE__*/_jsx(JustifyEndIcon, {})
55
+ children: [/*#__PURE__*/_jsx(FormControlLabel, {
56
+ value: "start",
57
+ control: /*#__PURE__*/_jsx(Radio, {}),
58
+ label: /*#__PURE__*/_jsx(AlignStartIcon, {})
59
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
60
+ value: "center",
61
+ control: /*#__PURE__*/_jsx(Radio, {}),
62
+ label: /*#__PURE__*/_jsx(AlignCenterIcon, {})
63
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
64
+ value: "end",
65
+ control: /*#__PURE__*/_jsx(Radio, {}),
66
+ label: /*#__PURE__*/_jsx(AlignEndIcon, {})
67
+ })]
68
+ }), /*#__PURE__*/_jsxs(RadioGroup, {
69
+ row: true,
70
+ "aria-labelledby": "pos-jc",
71
+ name: "vertical",
72
+ value: value?.vertical || "start",
73
+ onChange: handleChange,
74
+ className: "iconRadioButton",
75
+ style: {
76
+ display: "flex"
77
+ },
78
+ children: [/*#__PURE__*/_jsx(FormControlLabel, {
79
+ value: "start",
80
+ control: /*#__PURE__*/_jsx(Radio, {}),
81
+ label: /*#__PURE__*/_jsx(JustifyStartIcon, {})
82
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
83
+ value: "center",
84
+ control: /*#__PURE__*/_jsx(Radio, {}),
85
+ label: /*#__PURE__*/_jsx(JustifyCenterIcon, {})
86
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
87
+ value: "end",
88
+ control: /*#__PURE__*/_jsx(Radio, {}),
89
+ label: /*#__PURE__*/_jsx(JustifyEndIcon, {})
90
+ })]
101
91
  })]
102
92
  })]
103
93
  })
@@ -114,7 +104,7 @@ const Alignment = props => {
114
104
  fontSize: "14px",
115
105
  fontWeight: 500
116
106
  },
117
- children: "Flex Direction"
107
+ children: "Direction"
118
108
  })
119
109
  }), /*#__PURE__*/_jsxs(RadioGroup, {
120
110
  row: true,
@@ -39,13 +39,14 @@ const BackgroundImage = props => {
39
39
  };
40
40
  return /*#__PURE__*/_jsxs(Grid, {
41
41
  item: true,
42
+ xs: 12,
42
43
  children: [/*#__PURE__*/_jsx(Typography, {
43
44
  variant: "body1",
44
45
  color: "primary",
45
46
  sx: {
46
47
  fontSize: "14px",
47
48
  fontWeight: "500",
48
- marginBottom: "5px"
49
+ marginBottom: "8px"
49
50
  },
50
51
  children: "Upload Image"
51
52
  }), /*#__PURE__*/_jsx(Grid, {
@@ -1,8 +1,6 @@
1
1
  import React from "react";
2
- import { Grid, Typography } from "@mui/material";
3
- import LockIcon from "@mui/icons-material/Lock";
4
- import LockOpenIcon from "@mui/icons-material/LockOpen";
5
- import { radiusStyle } from "./radiusStyle";
2
+ import { Checkbox, FormControlLabel, Grid, Slider, Typography } from "@mui/material";
3
+ import { squreStyle } from "./radiusStyle";
6
4
  import { jsx as _jsx } from "react/jsx-runtime";
7
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
8
6
  const BANNER_SPACING_KEYS = ["top", "left", "right", "bottom"];
@@ -13,15 +11,14 @@ const BannerSpacing = props => {
13
11
  onChange,
14
12
  elementProps
15
13
  } = props;
16
- let {
17
- lockSpacing
18
- } = elementProps || {};
19
- if (lockSpacing === undefined) {
20
- lockSpacing = true;
21
- }
22
14
  const {
23
15
  key
24
16
  } = data;
17
+ const lockKeyVal = `lock${key}`;
18
+ let lockSpacing = elementProps[lockKeyVal];
19
+ if (lockSpacing === undefined) {
20
+ lockSpacing = true;
21
+ }
25
22
  const handleChange = e => {
26
23
  let changeAll = {};
27
24
  if (lockSpacing) {
@@ -39,12 +36,9 @@ const BannerSpacing = props => {
39
36
  };
40
37
  const onLockSpacing = () => {
41
38
  onChange({
42
- lockSpacing: !lockSpacing
39
+ [lockKeyVal]: !lockSpacing
43
40
  });
44
41
  };
45
- const maxCap = val => {
46
- return val > 24 ? 24 : val;
47
- };
48
42
  return /*#__PURE__*/_jsxs(Grid, {
49
43
  item: true,
50
44
  xs: 12,
@@ -56,7 +50,42 @@ const BannerSpacing = props => {
56
50
  fontWeight: 500
57
51
  },
58
52
  children: data?.label
59
- }), /*#__PURE__*/_jsx(Grid, {
53
+ }), /*#__PURE__*/_jsxs(Grid, {
54
+ container: true,
55
+ wrap: "nowrap",
56
+ className: "sld-wrpr",
57
+ children: [/*#__PURE__*/_jsx(Slider, {
58
+ sx: {
59
+ opacity: !lockSpacing && 0.5
60
+ },
61
+ disabled: !lockSpacing,
62
+ className: "spacingSlider",
63
+ defaultValue: value?.top || 0,
64
+ "aria-label": "Default",
65
+ valueLabelDisplay: "auto",
66
+ max: 100,
67
+ onChange: handleChange
68
+ }), /*#__PURE__*/_jsx("input", {
69
+ value: !lockSpacing ? "" : value?.top || 0,
70
+ className: "sliderInput",
71
+ disabled: !lockSpacing,
72
+ onChange: handleChange
73
+ })]
74
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
75
+ className: "ccheckbox-primary",
76
+ control: /*#__PURE__*/_jsx(Checkbox, {
77
+ value: !lockSpacing,
78
+ checked: !lockSpacing,
79
+ onChange: onLockSpacing
80
+ }),
81
+ label: /*#__PURE__*/_jsx(Typography, {
82
+ variant: "body1",
83
+ sx: {
84
+ fontSize: "14px"
85
+ },
86
+ children: "Customize"
87
+ })
88
+ }), !lockSpacing ? /*#__PURE__*/_jsx(Grid, {
60
89
  container: true,
61
90
  padding: 4,
62
91
  children: /*#__PURE__*/_jsx(Grid, {
@@ -69,72 +98,69 @@ const BannerSpacing = props => {
69
98
  flexDirection: "column",
70
99
  alignItems: "center"
71
100
  },
72
- children: /*#__PURE__*/_jsxs("div", {
101
+ children: /*#__PURE__*/_jsx("div", {
73
102
  style: {
74
103
  width: "100px",
75
- height: "50px",
76
- // border: "1px solid #495efc",
104
+ height: "100px",
77
105
  backgroundColor: "transparent",
78
106
  position: "relative",
79
- display: "flex",
80
- padding: `${maxCap(value?.top)}px ${maxCap(value?.right)}px ${maxCap(value?.bottom)}px ${maxCap(value?.left)}px`
107
+ display: "flex"
81
108
  },
82
- children: [/*#__PURE__*/_jsx("div", {
83
- style: {
84
- border: "1px solid #495efc",
85
- width: "100%"
86
- }
87
- }), /*#__PURE__*/_jsx("input", {
88
- type: "text",
89
- name: "left",
90
- className: "borderInput",
91
- value: value?.left,
92
- style: {
93
- ...radiusStyle.topLeft
94
- },
95
- onChange: handleChange
96
- }), /*#__PURE__*/_jsx("input", {
97
- type: "text",
98
- name: "top",
99
- value: value?.top,
100
- className: "borderInput",
101
- style: {
102
- ...radiusStyle.topRight
103
- },
104
- onChange: handleChange
105
- }), /*#__PURE__*/_jsx("input", {
106
- type: "text",
107
- name: "right",
108
- value: value?.right,
109
- className: "borderInput",
110
- style: {
111
- ...radiusStyle.bottomLeft
112
- },
113
- onChange: handleChange
114
- }), /*#__PURE__*/_jsx("input", {
115
- type: "text",
116
- name: "bottom",
117
- value: value?.bottom,
118
- className: "borderInput",
119
- style: {
120
- ...radiusStyle.bottomRight
121
- },
122
- onChange: handleChange
123
- }), /*#__PURE__*/_jsx("button", {
124
- style: {
125
- position: "absolute",
126
- right: 0,
127
- left: 0,
128
- top: 0,
129
- bottom: 0,
130
- background: "none"
131
- },
132
- onClick: onLockSpacing,
133
- children: !lockSpacing ? /*#__PURE__*/_jsx(LockOpenIcon, {}) : /*#__PURE__*/_jsx(LockIcon, {})
134
- })]
109
+ children: /*#__PURE__*/_jsxs("div", {
110
+ className: "bannerSpaceBox",
111
+ children: [/*#__PURE__*/_jsx("div", {
112
+ className: "bannerSpaceBoxTop",
113
+ children: /*#__PURE__*/_jsx("input", {
114
+ type: "text",
115
+ name: "top",
116
+ value: value?.top,
117
+ className: "borderInput",
118
+ style: {
119
+ ...squreStyle.topRight
120
+ },
121
+ onChange: handleChange
122
+ })
123
+ }), /*#__PURE__*/_jsx("div", {
124
+ className: "bannerSpaceBoxRight",
125
+ children: /*#__PURE__*/_jsx("input", {
126
+ type: "text",
127
+ name: "right",
128
+ value: value?.right,
129
+ className: "borderInput",
130
+ style: {
131
+ ...squreStyle.bottomLeft
132
+ },
133
+ onChange: handleChange
134
+ })
135
+ }), /*#__PURE__*/_jsx("div", {
136
+ className: "bannerSpaceBoxBottom",
137
+ children: /*#__PURE__*/_jsx("input", {
138
+ type: "text",
139
+ name: "bottom",
140
+ value: value?.bottom,
141
+ className: "borderInput",
142
+ style: {
143
+ ...squreStyle.bottomRight
144
+ },
145
+ onChange: handleChange
146
+ })
147
+ }), /*#__PURE__*/_jsx("div", {
148
+ className: "bannerSpaceBoxLeft",
149
+ children: /*#__PURE__*/_jsx("input", {
150
+ type: "text",
151
+ name: "left",
152
+ className: "borderInput",
153
+ value: value?.left,
154
+ style: {
155
+ ...squreStyle.topLeft
156
+ },
157
+ onChange: handleChange
158
+ })
159
+ })]
160
+ })
135
161
  })
136
162
  })
137
- })]
163
+ }) : null]
138
164
  });
139
165
  };
140
166
  export default BannerSpacing;
@@ -1,7 +1,5 @@
1
1
  import React from "react";
2
- import { Grid, Typography } from "@mui/material";
3
- import LockIcon from "@mui/icons-material/Lock";
4
- import LockOpenIcon from "@mui/icons-material/LockOpen";
2
+ import { Grid, Typography, Slider, FormControlLabel, Checkbox } from "@mui/material";
5
3
  import { radiusStyle } from "./radiusStyle";
6
4
  import { jsx as _jsx } from "react/jsx-runtime";
7
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -14,8 +12,7 @@ const BorderRadius = props => {
14
12
  elementProps
15
13
  } = props;
16
14
  let {
17
- lockRadius,
18
- borderColor
15
+ lockRadius
19
16
  } = elementProps;
20
17
  if (lockRadius === undefined) {
21
18
  lockRadius = true;
@@ -54,7 +51,42 @@ const BorderRadius = props => {
54
51
  fontWeight: 500
55
52
  },
56
53
  children: data?.label
57
- }), /*#__PURE__*/_jsx(Grid, {
54
+ }), /*#__PURE__*/_jsxs(Grid, {
55
+ container: true,
56
+ wrap: "nowrap",
57
+ className: "sld-wrpr",
58
+ children: [/*#__PURE__*/_jsx(Slider, {
59
+ sx: {
60
+ opacity: !lockRadius && 0.5
61
+ },
62
+ disabled: !lockRadius,
63
+ className: "spacingSlider",
64
+ defaultValue: value?.topLeft || 0,
65
+ "aria-label": "Default",
66
+ valueLabelDisplay: "auto",
67
+ max: 100,
68
+ onChange: handleChange
69
+ }), /*#__PURE__*/_jsx("input", {
70
+ value: !lockRadius ? "" : value?.topLeft || 0,
71
+ className: "sliderInput",
72
+ disabled: !lockRadius,
73
+ onChange: handleChange
74
+ })]
75
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
76
+ className: "ccheckbox-primary",
77
+ control: /*#__PURE__*/_jsx(Checkbox, {
78
+ value: !lockRadius,
79
+ checked: !lockRadius,
80
+ onChange: onLockRadius
81
+ }),
82
+ label: /*#__PURE__*/_jsx(Typography, {
83
+ variant: "body1",
84
+ sx: {
85
+ fontSize: "14px"
86
+ },
87
+ children: "Customize"
88
+ })
89
+ }), !lockRadius ? /*#__PURE__*/_jsx(Grid, {
58
90
  container: true,
59
91
  children: /*#__PURE__*/_jsx(Grid, {
60
92
  item: true,
@@ -75,7 +107,7 @@ const BorderRadius = props => {
75
107
  border: "none",
76
108
  position: "relative",
77
109
  display: "flex",
78
- borderColor: `${borderColor}`,
110
+ borderColor: `#2563eb`,
79
111
  borderRadius: `${value?.topLeft}px ${value?.topRight}px ${value?.bottomLeft}px ${value?.bottomRight}px`
80
112
  },
81
113
  children: [/*#__PURE__*/_jsx("input", {
@@ -135,12 +167,11 @@ const BorderRadius = props => {
135
167
  bottom: 0,
136
168
  background: "none"
137
169
  },
138
- onClick: onLockRadius,
139
- children: !lockRadius ? /*#__PURE__*/_jsx(LockOpenIcon, {}) : /*#__PURE__*/_jsx(LockIcon, {})
170
+ onClick: onLockRadius
140
171
  })]
141
172
  })
142
173
  })
143
- })]
174
+ }) : null]
144
175
  });
145
176
  };
146
177
  export default BorderRadius;
@@ -2,6 +2,7 @@ import React from "react";
2
2
  import { FormControl, RadioGroup, FormControlLabel, Grid, Radio, TextField, Typography } from "@mui/material";
3
3
  import { jsx as _jsx } from "react/jsx-runtime";
4
4
  import { jsxs as _jsxs } from "react/jsx-runtime";
5
+ import { Fragment as _Fragment } from "react/jsx-runtime";
5
6
  const ButtonLink = props => {
6
7
  const {
7
8
  value,
@@ -62,9 +63,7 @@ const ButtonLink = props => {
62
63
  return null;
63
64
  }
64
65
  };
65
- return /*#__PURE__*/_jsxs(Grid, {
66
- container: true,
67
- spacing: 1,
66
+ return /*#__PURE__*/_jsxs(_Fragment, {
68
67
  children: [/*#__PURE__*/_jsx(Grid, {
69
68
  item: true,
70
69
  xs: 12,
@@ -83,6 +82,7 @@ const ButtonLink = props => {
83
82
  "aria-labelledby": "demo-radio-buttons-group-label",
84
83
  value: value?.linkType || "",
85
84
  name: "linkType",
85
+ className: "cradio-primary",
86
86
  onChange: handleChange,
87
87
  children: [/*#__PURE__*/_jsx(FormControlLabel, {
88
88
  value: "actionTrigger",
@@ -7,96 +7,46 @@ const Color = props => {
7
7
  const {
8
8
  value,
9
9
  data,
10
- onChange,
11
- elementProps
10
+ onChange
12
11
  } = props;
13
12
  const {
14
13
  key,
15
- label,
16
- needPreview
14
+ label
17
15
  } = data;
18
- const {
19
- textColor,
20
- bgColor,
21
- borderColor
22
- } = elementProps;
23
16
  const onSave = color => {
24
17
  onChange({
25
18
  [key]: color
26
19
  });
27
20
  };
28
21
  return /*#__PURE__*/_jsxs(Grid, {
29
- container: true,
30
- children: [needPreview && /*#__PURE__*/_jsxs(Grid, {
31
- container: true,
22
+ item: true,
23
+ xs: 12,
24
+ className: "btnColorPicker",
25
+ children: [/*#__PURE__*/_jsx(Typography, {
26
+ variant: "body1",
27
+ color: "primary",
32
28
  sx: {
33
- pt: 1,
34
- pb: 2
29
+ fontSize: "14px",
30
+ fontWeight: 500,
31
+ marginBottom: "5px"
35
32
  },
36
- children: [/*#__PURE__*/_jsx(Grid, {
37
- item: true,
38
- xs: 12,
39
- children: /*#__PURE__*/_jsx(Grid, {
40
- item: true,
41
- style: {
42
- color: textColor,
43
- background: bgColor,
44
- border: `1px solid ${borderColor}`,
45
- fontSize: "14px",
46
- fontWeight: 500
47
- },
48
- children: "Button Preview"
49
- })
50
- }), /*#__PURE__*/_jsx(Typography, {
51
- variant: "body1",
52
- color: "textSecondary",
53
- sx: {
54
- fontSize: "13px"
55
- },
56
- children: "*Enter or Select color"
57
- })]
58
- }), /*#__PURE__*/_jsx(Grid, {
59
- item: true,
60
- xs: 12,
61
- style: {
62
- marginBottom: "12px",
63
- display: "flex",
64
- alignItems: "cente",
65
- justifyContent: "space-between"
33
+ children: label
34
+ }), /*#__PURE__*/_jsx(TextField, {
35
+ fullWidth: true,
36
+ value: value,
37
+ placeholder: `${label} color code`,
38
+ InputLabelProps: {
39
+ shrink: true
66
40
  },
67
- children: /*#__PURE__*/_jsxs(Grid, {
68
- item: true,
69
- xs: 12,
70
- className: "btnColorPicker",
71
- children: [/*#__PURE__*/_jsx(Typography, {
72
- variant: "body1",
73
- color: "primary",
74
- sx: {
75
- fontSize: "14px",
76
- fontWeight: 500,
77
- marginBottom: "5px"
78
- },
79
- children: label
80
- }), /*#__PURE__*/_jsx(TextField, {
81
- fullWidth: true,
82
- value: value
83
- // label={label}
84
- ,
85
- placeholder: `${label} color code`,
86
- InputLabelProps: {
87
- shrink: true
88
- },
89
- InputProps: {
90
- startAdornment: /*#__PURE__*/_jsx(InputAdornment, {
91
- position: "start",
92
- children: /*#__PURE__*/_jsx(ColorPickerButton, {
93
- value: value,
94
- onSave: onSave
95
- })
96
- })
97
- }
98
- })]
99
- })
41
+ InputProps: {
42
+ startAdornment: /*#__PURE__*/_jsx(InputAdornment, {
43
+ position: "start",
44
+ children: /*#__PURE__*/_jsx(ColorPickerButton, {
45
+ value: value,
46
+ onSave: onSave
47
+ })
48
+ })
49
+ }
100
50
  })]
101
51
  });
102
52
  };
@@ -4,7 +4,6 @@ import { sizeMap } from "../../../utils/font.js";
4
4
  import { TextMinusIcon, TextPlusIcon } from "../../../common/iconslist.js";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
- import { Fragment as _Fragment } from "react/jsx-runtime";
8
7
  const FontSize = props => {
9
8
  const {
10
9
  value,
@@ -12,7 +11,8 @@ const FontSize = props => {
12
11
  onChange
13
12
  } = props;
14
13
  const {
15
- key
14
+ key,
15
+ width
16
16
  } = data;
17
17
  const handleChange = e => {
18
18
  let inc = parseInt(e.target.value) || 16;
@@ -42,7 +42,9 @@ const FontSize = props => {
42
42
  [key]: combinedOldVal - 1 || 0
43
43
  });
44
44
  };
45
- return /*#__PURE__*/_jsxs(_Fragment, {
45
+ return /*#__PURE__*/_jsxs(Grid, {
46
+ item: true,
47
+ xs: width || 12,
46
48
  children: [/*#__PURE__*/_jsx(Grid, {
47
49
  item: true,
48
50
  xs: 12,
@@ -70,8 +72,8 @@ const FontSize = props => {
70
72
  size: "small",
71
73
  inputProps: {
72
74
  style: {
73
- width: "30px",
74
- textAlign: "center"
75
+ textAlign: "center",
76
+ padding: "11px"
75
77
  }
76
78
  },
77
79
  InputProps: {