@semcore/feedback-form 4.0.4 → 5.0.1
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.
- package/CHANGELOG.md +18 -0
- package/lib/cjs/FeedbackForm.js +37 -42
- package/lib/cjs/FeedbackForm.js.map +1 -1
- package/lib/cjs/index.d.ts +26 -0
- package/lib/cjs/index.js +2 -19
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/feedback-form.shadow.css +7 -7
- package/lib/es6/FeedbackForm.js +37 -42
- package/lib/es6/FeedbackForm.js.map +1 -1
- package/lib/es6/index.d.ts +26 -0
- package/lib/es6/index.js +0 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/feedback-form.shadow.css +7 -7
- package/package.json +11 -8
- package/src/FeedbackForm.jsx +3 -3
- package/src/index.js +0 -1
- package/src/style/feedback-form.shadow.css +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [5.0.1] - 2022-05-18
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version patch update due to children dependencies update (`@semcore/button` [4.0.0 ~> 4.0.1]).
|
|
10
|
+
|
|
11
|
+
## [5.0.0] - 2022-05-17
|
|
12
|
+
|
|
13
|
+
### BREAK
|
|
14
|
+
|
|
15
|
+
- Updated styles according to the library redesign policy.
|
|
16
|
+
|
|
17
|
+
## [4.0.5] - 2022-04-25
|
|
18
|
+
|
|
19
|
+
### Changed
|
|
20
|
+
|
|
21
|
+
- Version patch update due to children dependencies update (`@semcore/spin-container` [5.0.5 ~> 5.1.0]).
|
|
22
|
+
|
|
5
23
|
## [4.0.4] - 2022-03-21
|
|
6
24
|
|
|
7
25
|
### Changed
|
package/lib/cjs/FeedbackForm.js
CHANGED
|
@@ -68,18 +68,17 @@ var style = (
|
|
|
68
68
|
/*__reshadow_css_start__*/
|
|
69
69
|
_core.sstyled.insert(
|
|
70
70
|
/*__inner_css_start__*/
|
|
71
|
-
".
|
|
71
|
+
".___SFeedbackForm_1tavz_gg_{max-width:320px}.___SCancel_1tavz_gg_,.___SSubmit_1tavz_gg_{display:inline-flex;margin-right:8px}.___SNotice_1tavz_gg_{padding:12px 16px;border-width:1px 0 0;border-top-style:solid;border-radius:0 0 6px 6px}.___SSuccess_1tavz_gg_{display:flex;align-items:center;flex-direction:column;width:320px;padding:46px 32px 32px;box-sizing:border-box}.___SEmail_1tavz_gg_{margin-bottom:18px;width:80px;height:80px;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='80' height='80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_11950_117175)'%3E%3Cpath d='M27.945 5.046a1.583 1.583 0 00-1.121.465L13.909 18.426a34.604 34.604 0 1048.938 48.938l12.915-12.916a1.58 1.58 0 00.464-1.12V5.944a.9.9 0 00-.9-.9l-47.381.002z' fill='%2345E0A8'/%3E%3Cpath d='M28.615 44.751l.2.353c6.141-3.452 24.182-13.678 27.531-10.531-1.138-3.107-17.039.327-27.731 10.178zM28.513 31.03C26.7 37.072 19.3 55.5 15.07 61.342l3.013.912 1.576-1.329c4.219-9.54 9.98-25.953 10.312-31.458-.51-.285-1.024.116-1.458 1.563z' fill='%23fff'/%3E%3Cpath d='M15.07 61.342C19.3 55.5 26.7 37.072 28.513 31.03c1.813-6.042 5.042 6.009 3.23 11.115' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M27.91 45.411C38.591 35.046 55.182 31.4 56.341 34.573c.688 1.886-13.429 6.259-18.408 12.316' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43c-3.245-1.16-8.592-2.891-11.449-3.689C36.95 15.907 69.787 3.753 72.5 2.5c-.922 4.106-4.924 18.28-6.716 24.933-4.827-1.682-9.728-3.158-12.922-4.193a70.111 70.111 0 00-5.417 8.351c-1.173-3.86-2.329-8.317-3.164-10.161z' fill='%23fff' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43l16.745-11.078M52.864 23.24L72.502 2.5M47.447 31.591l7.852-7.576' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.436 30.173l3.455-5.641.973-1.127 2.064.61.436-.131-3.355 3.427-2.479 2.27-1.326 1.114.232-.522z' fill='%23000'/%3E%3Cpath d='M34.013 21.451L23.202 26.58M40.905 22.5l-6.892 4.362M62.293 28.365l-4.04 9.85' stroke='%23fff' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.09 40.849c3.613 2.425-1.869 8.525-3.682 10.118M47.258 43.6c4.142 2.1 1.16 7.764-1.168 10.6M49.023 48.9c5.5 4.476-12.556 23.722-13.864 24.783' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88c13.658-2.117 20.2 10.047 20.459 13.52A116.386 116.386 0 0127.4 87.533' fill='%23000'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88c13.658-2.117 20.2 10.047 20.459 13.52A116.386 116.386 0 0127.4 87.533' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_11950_117175'%3E%3Cpath fill='%23fff' d='M0 0h80v80H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}"
|
|
72
72
|
/*__inner_css_end__*/
|
|
73
|
-
, "
|
|
73
|
+
, "16vzj3n_gg_")
|
|
74
74
|
/*__reshadow_css_end__*/
|
|
75
75
|
, {
|
|
76
|
-
"__SFeedbackForm": "
|
|
77
|
-
"__SCancel": "
|
|
78
|
-
"__SSubmit": "
|
|
79
|
-
"__SNotice": "
|
|
80
|
-
"
|
|
81
|
-
"
|
|
82
|
-
"__SEmail": "___SEmail_13cca_gg_"
|
|
76
|
+
"__SFeedbackForm": "___SFeedbackForm_1tavz_gg_",
|
|
77
|
+
"__SCancel": "___SCancel_1tavz_gg_",
|
|
78
|
+
"__SSubmit": "___SSubmit_1tavz_gg_",
|
|
79
|
+
"__SNotice": "___SNotice_1tavz_gg_",
|
|
80
|
+
"__SSuccess": "___SSuccess_1tavz_gg_",
|
|
81
|
+
"__SEmail": "___SEmail_1tavz_gg_"
|
|
83
82
|
});
|
|
84
83
|
|
|
85
84
|
var FeedbackForm = /*#__PURE__*/function (_Component) {
|
|
@@ -114,19 +113,19 @@ var FeedbackForm = /*#__PURE__*/function (_Component) {
|
|
|
114
113
|
return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Form, (0, _extends2["default"])({
|
|
115
114
|
decorators: [this.focusDecorator]
|
|
116
115
|
}, other), function (api) {
|
|
117
|
-
var
|
|
116
|
+
var _ref6;
|
|
118
117
|
|
|
119
|
-
return
|
|
118
|
+
return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(_spinContainer["default"], _ref6.cn("SpinContainer", {
|
|
120
119
|
"size": "xl",
|
|
121
120
|
"loading": loading === undefined ? api.submitting : loading
|
|
122
|
-
}), /*#__PURE__*/_react["default"].createElement(SFeedbackForm,
|
|
121
|
+
}), /*#__PURE__*/_react["default"].createElement(SFeedbackForm, _ref6.cn("SFeedbackForm", _objectSpread(_objectSpread({
|
|
123
122
|
"tag": "form",
|
|
124
123
|
"noValidate": true,
|
|
125
124
|
"method": "POST",
|
|
126
125
|
"ref": forwardRef
|
|
127
126
|
}, other), {}, {
|
|
128
127
|
"onSubmit": api.handleSubmit
|
|
129
|
-
})), typeof Children.origin === 'function' ? Children.origin(api) : /*#__PURE__*/_react["default"].createElement(Children,
|
|
128
|
+
})), typeof Children.origin === 'function' ? Children.origin(api) : /*#__PURE__*/_react["default"].createElement(Children, _ref6.cn("Children", {}))));
|
|
130
129
|
});
|
|
131
130
|
}
|
|
132
131
|
}]);
|
|
@@ -166,20 +165,16 @@ var FeedbackForm = /*#__PURE__*/function (_Component) {
|
|
|
166
165
|
});
|
|
167
166
|
var TooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
|
|
168
167
|
|
|
169
|
-
function Item(
|
|
170
|
-
var
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
var Children = _ref12.Children,
|
|
174
|
-
tag = _ref12.tag,
|
|
175
|
-
props = (0, _objectWithoutProperties2["default"])(_ref12, _excluded2);
|
|
168
|
+
function Item(_ref11) {
|
|
169
|
+
var Children = _ref11.Children,
|
|
170
|
+
tag = _ref11.tag,
|
|
171
|
+
props = (0, _objectWithoutProperties2["default"])(_ref11, _excluded2);
|
|
176
172
|
var tooltipProps = (0, _pick["default"])(props, TooltipProps);
|
|
177
|
-
return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field,
|
|
178
|
-
var
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
other = (0, _objectWithoutProperties2["default"])(_ref13, _excluded3);
|
|
173
|
+
return /*#__PURE__*/_react["default"].createElement(_reactFinalForm.Field, props, function (_ref12) {
|
|
174
|
+
var _ref = arguments[0];
|
|
175
|
+
var input = _ref12.input,
|
|
176
|
+
meta = _ref12.meta,
|
|
177
|
+
other = (0, _objectWithoutProperties2["default"])(_ref12, _excluded3);
|
|
183
178
|
var invalid = meta.invalid && meta.touched;
|
|
184
179
|
|
|
185
180
|
var inputProps = _objectSpread(_objectSpread({}, input), {}, {
|
|
@@ -195,7 +190,7 @@ function Item(_ref12) {
|
|
|
195
190
|
flip: {
|
|
196
191
|
fallbackPlacements: ['right', 'bottom']
|
|
197
192
|
}
|
|
198
|
-
}, tooltipProps), tag && /*#__PURE__*/_react["default"].createElement("tag", (0, _core.assignProps)(_objectSpread({}, inputProps),
|
|
193
|
+
}, tooltipProps), tag && /*#__PURE__*/_react["default"].createElement("tag", (0, _core.assignProps)(_objectSpread({}, inputProps), _ref)), typeof Children.origin === 'function' && Children.origin(_objectSpread({
|
|
199
194
|
input: inputProps,
|
|
200
195
|
meta: meta
|
|
201
196
|
}, other)));
|
|
@@ -203,56 +198,56 @@ function Item(_ref12) {
|
|
|
203
198
|
}
|
|
204
199
|
|
|
205
200
|
function Success(props) {
|
|
206
|
-
var
|
|
207
|
-
|
|
201
|
+
var _ref2 = arguments[0],
|
|
202
|
+
_ref7;
|
|
208
203
|
|
|
209
204
|
var Children = props.Children,
|
|
210
205
|
styles = props.styles;
|
|
211
206
|
var SSuccess = _flexBox.Box;
|
|
212
207
|
var SEmail = 'div';
|
|
213
|
-
return
|
|
208
|
+
return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SSuccess, _ref7.cn("SSuccess", _objectSpread({}, (0, _core.assignProps)({}, _ref2))), /*#__PURE__*/_react["default"].createElement(SEmail, _ref7.cn("SEmail", {})), /*#__PURE__*/_react["default"].createElement("span", _ref7.cn("span", {}), /*#__PURE__*/_react["default"].createElement(Children, _ref7.cn("Children", {}))));
|
|
214
209
|
} // because it is used without a wrapper
|
|
215
210
|
|
|
216
211
|
|
|
217
212
|
Success.style = style;
|
|
218
213
|
|
|
219
214
|
function Submit(props) {
|
|
220
|
-
var
|
|
221
|
-
|
|
215
|
+
var _ref3 = arguments[0],
|
|
216
|
+
_ref8;
|
|
222
217
|
|
|
223
218
|
var styles = props.styles;
|
|
224
219
|
var SSubmit = _button["default"];
|
|
225
|
-
return
|
|
220
|
+
return _ref8 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SSubmit, _ref8.cn("SSubmit", _objectSpread({}, (0, _core.assignProps)({
|
|
226
221
|
"type": "submit",
|
|
227
222
|
"use": "primary",
|
|
228
223
|
"theme": "success"
|
|
229
|
-
},
|
|
224
|
+
}, _ref3))));
|
|
230
225
|
}
|
|
231
226
|
|
|
232
227
|
function Cancel(props) {
|
|
233
|
-
var
|
|
234
|
-
|
|
228
|
+
var _ref4 = arguments[0],
|
|
229
|
+
_ref9;
|
|
235
230
|
|
|
236
231
|
var styles = props.styles;
|
|
237
232
|
var SCancel = _button["default"];
|
|
238
|
-
return
|
|
233
|
+
return _ref9 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SCancel, _ref9.cn("SCancel", _objectSpread({}, (0, _core.assignProps)({
|
|
239
234
|
"type": "reset",
|
|
240
235
|
"use": "secondary",
|
|
241
236
|
"theme": "muted"
|
|
242
|
-
},
|
|
237
|
+
}, _ref4))));
|
|
243
238
|
}
|
|
244
239
|
|
|
245
240
|
function Notice(props) {
|
|
246
|
-
var
|
|
247
|
-
|
|
241
|
+
var _ref5 = arguments[0],
|
|
242
|
+
_ref10;
|
|
248
243
|
|
|
249
244
|
var styles = props.styles;
|
|
250
245
|
var SNotice = _notice.NoticeSmart;
|
|
251
|
-
return
|
|
246
|
+
return _ref10 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SNotice, _ref10.cn("SNotice", _objectSpread({}, (0, _core.assignProps)({}, _ref5))));
|
|
252
247
|
}
|
|
253
248
|
|
|
254
249
|
Notice.defaultProps = {
|
|
255
|
-
theme: '
|
|
250
|
+
theme: 'gray96',
|
|
256
251
|
use: 'secondary'
|
|
257
252
|
};
|
|
258
253
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/FeedbackForm.jsx"],"names":["FeedbackForm","SFeedbackForm","Box","asProps","Children","styles","loading","forwardRef","other","focusDecorator","api","undefined","submitting","handleSubmit","origin","Component","style","Field","Form","onSubmit","description","error","value","words","split","symbols","join","length","email","test","String","toLowerCase","TooltipProps","Item","tag","props","tooltipProps","input","meta","invalid","touched","inputProps","state","active","fallbackPlacements","Success","SSuccess","SEmail","Submit","SSubmit","Button","Cancel","SCancel","Notice","SNotice","NoticeSmart","defaultProps","theme","use"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;;AAJA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA
|
|
1
|
+
{"version":3,"sources":["../../src/FeedbackForm.jsx"],"names":["FeedbackForm","SFeedbackForm","Box","asProps","Children","styles","loading","forwardRef","other","focusDecorator","api","undefined","submitting","handleSubmit","origin","Component","style","Field","Form","onSubmit","description","error","value","words","split","symbols","join","length","email","test","String","toLowerCase","TooltipProps","Item","tag","props","tooltipProps","input","meta","invalid","touched","inputProps","state","active","fallbackPlacements","Success","SSuccess","SEmail","Submit","SSubmit","Button","Cancel","SCancel","Notice","SNotice","NoticeSmart","defaultProps","theme","use"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Field, Form } from 'react-final-form';\nimport createFocusDecorator from 'final-form-focus';\n\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Button from '@semcore/button';\nimport SpinContainer from '@semcore/spin-container';\nimport Tooltip from '@semcore/tooltip';\nimport { NoticeSmart } from '@semcore/notice';\nimport { Box } from '@semcore/flex-box';\nimport pick from '@semcore/utils/lib/pick';\n\nimport style from './style/feedback-form.shadow.css';\n\nclass FeedbackForm extends Component {\n static displayName = 'FeedbackForm';\n static style = style;\n static FinalForm = {\n Field,\n Form,\n };\n\n static defaultProps = {\n onSubmit: () => {},\n };\n\n static validate = {\n description:\n (error) =>\n (value = '') => {\n const words = value.split(/\\s+/);\n const symbols = words.join(' ');\n if (symbols.length < 10 || words.length < 3) {\n return error;\n }\n },\n email:\n (error) =>\n (value = '') => {\n if (!/.+@.+\\..+/i.test(String(value).toLowerCase())) {\n return error;\n }\n },\n };\n\n focusDecorator = createFocusDecorator();\n\n render() {\n const SFeedbackForm = Box;\n const { Children, styles, loading, forwardRef, ...other } = this.asProps;\n\n return (\n <Form decorators={[this.focusDecorator]} {...other}>\n {(api) =>\n sstyled(styles)(\n <SpinContainer size=\"xl\" loading={loading === undefined ? api.submitting : loading}>\n <SFeedbackForm\n tag=\"form\"\n noValidate\n method=\"POST\"\n ref={forwardRef}\n {...other}\n onSubmit={api.handleSubmit}\n >\n {typeof Children.origin === 'function' ? Children.origin(api) : <Children />}\n </SFeedbackForm>\n </SpinContainer>,\n )\n }\n </Form>\n );\n }\n}\n\nconst TooltipProps = [\n 'title',\n 'theme',\n 'strategy',\n 'modifiers',\n 'placement',\n 'interaction',\n 'timeout',\n 'visible',\n 'defaultVisible',\n 'onVisibleChange',\n 'offset',\n 'preventOverflow',\n 'arrow',\n 'flip',\n 'computeStyles',\n 'eventListeners',\n 'onFirstUpdate',\n];\n\nfunction Item({ Children, tag, ...props }) {\n const tooltipProps = pick(props, TooltipProps);\n\n return (\n <Field {...props}>\n {({ input, meta, ...other }) => {\n const invalid = meta.invalid && meta.touched;\n const inputProps = {\n ...input,\n state: invalid ? 'invalid' : 'normal',\n };\n return (\n <Tooltip\n title={meta.error}\n visible={invalid && meta.active}\n inline={false}\n theme=\"warning\"\n placement=\"left\"\n flip={{\n fallbackPlacements: ['right', 'bottom'],\n }}\n {...tooltipProps}\n >\n {tag && <Root render={tag} {...inputProps} />}\n {typeof Children.origin === 'function' &&\n Children.origin({\n input: inputProps,\n meta,\n ...other,\n })}\n </Tooltip>\n );\n }}\n </Field>\n );\n}\n\nfunction Success(props) {\n const { Children, styles } = props;\n const SSuccess = Root;\n const SEmail = 'div';\n\n return sstyled(styles)(\n <SSuccess render={Box}>\n <SEmail />\n <span>\n <Children />\n </span>\n </SSuccess>,\n );\n}\n// because it is used without a wrapper\nSuccess.style = style;\n\nfunction Submit(props) {\n const { styles } = props;\n const SSubmit = Root;\n return sstyled(styles)(<SSubmit render={Button} type=\"submit\" use=\"primary\" theme=\"success\" />);\n}\n\nfunction Cancel(props) {\n const { styles } = props;\n const SCancel = Root;\n return sstyled(styles)(<SCancel render={Button} type=\"reset\" use=\"secondary\" theme=\"muted\" />);\n}\n\nfunction Notice(props) {\n const { styles } = props;\n const SNotice = Root;\n return sstyled(styles)(<SNotice render={NoticeSmart} />);\n}\n\nNotice.defaultProps = {\n theme: 'gray96',\n use: 'secondary',\n};\n\nexport default createComponent(FeedbackForm, {\n Item,\n Success,\n Submit,\n Cancel,\n Notice,\n});\n"],"file":"FeedbackForm.js"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import { FormProps, FieldProps } from 'react-final-form';
|
|
3
|
+
|
|
4
|
+
import { ReturnEl, CProps } from '@semcore/core';
|
|
5
|
+
import Button from '@semcore/button';
|
|
6
|
+
import { NoticeSmart } from '@semcore/notice';
|
|
7
|
+
import { Box } from '@semcore/flex-box';
|
|
8
|
+
|
|
9
|
+
export interface IFeedbackForm extends FormProps {
|
|
10
|
+
/* The event is called when the form is submitted */
|
|
11
|
+
onSubmit: (values: any, form: any, callback?: (errors?: {}) => void) => {} | Promise<{}> | void;
|
|
12
|
+
/**
|
|
13
|
+
* The property is in charge of the spinner showing
|
|
14
|
+
* */
|
|
15
|
+
loading?: boolean;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
declare const FeedbackForm: (<T>(props: CProps<IFeedbackForm> & T) => ReturnEl) & {
|
|
19
|
+
Item: <T>(props: FieldProps<any, any> & T) => ReturnEl;
|
|
20
|
+
Success: <T>(props: CProps<ComponentProps<typeof Box>> & T) => ReturnEl;
|
|
21
|
+
Submit: <T>(props: ComponentProps<typeof Button> & T) => ReturnEl;
|
|
22
|
+
Cancel: <T>(props: ComponentProps<typeof Button> & T) => ReturnEl;
|
|
23
|
+
Notice: <T>(props: ComponentProps<typeof NoticeSmart> & T) => ReturnEl;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export default FeedbackForm;
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
var _exportNames = {};
|
|
9
8
|
Object.defineProperty(exports, "default", {
|
|
10
9
|
enumerable: true,
|
|
11
10
|
get: function get() {
|
|
@@ -13,21 +12,5 @@ Object.defineProperty(exports, "default", {
|
|
|
13
12
|
}
|
|
14
13
|
});
|
|
15
14
|
|
|
16
|
-
var _FeedbackForm =
|
|
17
|
-
|
|
18
|
-
Object.keys(_FeedbackForm).forEach(function (key) {
|
|
19
|
-
if (key === "default" || key === "__esModule") return;
|
|
20
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
21
|
-
if (key in exports && exports[key] === _FeedbackForm[key]) return;
|
|
22
|
-
Object.defineProperty(exports, key, {
|
|
23
|
-
enumerable: true,
|
|
24
|
-
get: function get() {
|
|
25
|
-
return _FeedbackForm[key];
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
});
|
|
29
|
-
|
|
30
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
-
|
|
32
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
var _FeedbackForm = _interopRequireDefault(require("./FeedbackForm"));
|
|
33
16
|
//# sourceMappingURL=index.js.map
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default } from './FeedbackForm';\n"],"file":"index.js"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
2
|
|
|
3
3
|
SFeedbackForm {
|
|
4
|
-
max-width:
|
|
4
|
+
max-width: 320px;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
SSubmit,
|
|
@@ -10,24 +10,24 @@ SCancel {
|
|
|
10
10
|
margin-right: 8px;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
SNotice
|
|
13
|
+
SNotice {
|
|
14
|
+
padding: 12px 16px;
|
|
14
15
|
border-width: 1px 0 0;
|
|
15
16
|
border-top-style: solid;
|
|
16
|
-
border-radius: 0 0
|
|
17
|
+
border-radius: 0 0 6px 6px;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
SSuccess {
|
|
20
21
|
display: flex;
|
|
21
22
|
align-items: center;
|
|
22
23
|
flex-direction: column;
|
|
23
|
-
width:
|
|
24
|
-
padding: 32px;
|
|
24
|
+
width: 320px;
|
|
25
|
+
padding: 46px 32px 32px;
|
|
25
26
|
box-sizing: border-box;
|
|
26
27
|
}
|
|
27
28
|
|
|
28
29
|
SEmail {
|
|
29
|
-
margin-bottom:
|
|
30
|
-
color: var(--green);
|
|
30
|
+
margin-bottom: 18px;
|
|
31
31
|
width: 80px;
|
|
32
32
|
height: 80px;
|
|
33
33
|
background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_11950_117175)'%3E%3Cpath d='M27.945 5.04601C27.7367 5.04597 27.5305 5.08702 27.3381 5.16681C27.1458 5.24661 26.971 5.36357 26.8239 5.51101L13.909 18.426C7.41937 24.9156 3.77356 33.7174 3.77356 42.895C3.77356 52.0727 7.41937 60.8744 13.909 67.364C20.3985 73.8536 29.2003 77.4994 38.3779 77.4994C47.5556 77.4994 56.3574 73.8536 62.847 67.364L75.762 54.448C75.9092 54.3011 76.026 54.1265 76.1056 53.9343C76.1853 53.7421 76.2262 53.536 76.226 53.328V5.94401C76.226 5.70531 76.1311 5.47639 75.9623 5.30761C75.7936 5.13883 75.5646 5.04401 75.326 5.04401L27.945 5.04601Z' fill='%2345E0A8'/%3E%3Cpath d='M28.615 44.751L28.815 45.104C34.956 41.652 52.997 31.426 56.346 34.573C55.208 31.466 39.307 34.9 28.615 44.751Z' fill='white'/%3E%3Cpath d='M28.5129 31.03C26.6999 37.072 19.2999 55.5 15.0699 61.342L18.0829 62.254L19.6589 60.925C23.8779 51.385 29.6389 34.972 29.9709 29.467C29.4619 29.182 28.9469 29.583 28.5129 31.03Z' fill='white'/%3E%3Cpath d='M15.0699 61.342C19.2999 55.5 26.6999 37.072 28.5129 31.03C30.3259 24.988 33.5549 37.039 31.7429 42.145' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M27.9091 45.411C38.5921 35.046 55.1831 31.4 56.3421 34.573C57.0301 36.459 42.9131 40.832 37.9341 46.889' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43C41.036 20.27 35.689 18.539 32.832 17.741C36.95 15.907 69.787 3.753 72.5 2.5C71.578 6.606 67.576 20.78 65.784 27.433C60.957 25.751 56.056 24.275 52.862 23.24C50.8608 25.8918 49.0505 28.6825 47.445 31.591C46.272 27.731 45.116 23.274 44.281 21.43Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43L61.026 10.352' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M52.864 23.24L72.502 2.5' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.447 31.591L55.299 24.015' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.436 30.173L51.891 24.532L52.864 23.405L54.928 24.015L55.364 23.884L52.009 27.311L49.53 29.581L48.204 30.695L48.436 30.173Z' fill='black'/%3E%3Cpath d='M34.013 21.451L23.202 26.58' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.9049 22.5L34.0129 26.862' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.2931 28.365L58.2531 38.215' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.09 40.849C49.703 43.274 44.221 49.374 42.408 50.967' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.258 43.6C51.4 45.7 48.418 51.364 46.09 54.2' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M49.0231 48.9C54.5231 53.376 36.4671 72.622 35.1591 73.683' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' fill='black'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_11950_117175'%3E%3Crect width='80' height='80' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
|
package/lib/es6/FeedbackForm.js
CHANGED
|
@@ -8,7 +8,6 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
|
|
|
8
8
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
10
10
|
import { sstyled as _sstyled } from "@semcore/core";
|
|
11
|
-
import { assignProps as _assignProps6 } from "@semcore/core";
|
|
12
11
|
import { assignProps as _assignProps5 } from "@semcore/core";
|
|
13
12
|
import { assignProps as _assignProps4 } from "@semcore/core";
|
|
14
13
|
import { assignProps as _assignProps3 } from "@semcore/core";
|
|
@@ -42,18 +41,17 @@ var style = (
|
|
|
42
41
|
/*__reshadow_css_start__*/
|
|
43
42
|
_sstyled.insert(
|
|
44
43
|
/*__inner_css_start__*/
|
|
45
|
-
".
|
|
44
|
+
".___SFeedbackForm_1tavz_gg_{max-width:320px}.___SCancel_1tavz_gg_,.___SSubmit_1tavz_gg_{display:inline-flex;margin-right:8px}.___SNotice_1tavz_gg_{padding:12px 16px;border-width:1px 0 0;border-top-style:solid;border-radius:0 0 6px 6px}.___SSuccess_1tavz_gg_{display:flex;align-items:center;flex-direction:column;width:320px;padding:46px 32px 32px;box-sizing:border-box}.___SEmail_1tavz_gg_{margin-bottom:18px;width:80px;height:80px;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg width='80' height='80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_11950_117175)'%3E%3Cpath d='M27.945 5.046a1.583 1.583 0 00-1.121.465L13.909 18.426a34.604 34.604 0 1048.938 48.938l12.915-12.916a1.58 1.58 0 00.464-1.12V5.944a.9.9 0 00-.9-.9l-47.381.002z' fill='%2345E0A8'/%3E%3Cpath d='M28.615 44.751l.2.353c6.141-3.452 24.182-13.678 27.531-10.531-1.138-3.107-17.039.327-27.731 10.178zM28.513 31.03C26.7 37.072 19.3 55.5 15.07 61.342l3.013.912 1.576-1.329c4.219-9.54 9.98-25.953 10.312-31.458-.51-.285-1.024.116-1.458 1.563z' fill='%23fff'/%3E%3Cpath d='M15.07 61.342C19.3 55.5 26.7 37.072 28.513 31.03c1.813-6.042 5.042 6.009 3.23 11.115' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M27.91 45.411C38.591 35.046 55.182 31.4 56.341 34.573c.688 1.886-13.429 6.259-18.408 12.316' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43c-3.245-1.16-8.592-2.891-11.449-3.689C36.95 15.907 69.787 3.753 72.5 2.5c-.922 4.106-4.924 18.28-6.716 24.933-4.827-1.682-9.728-3.158-12.922-4.193a70.111 70.111 0 00-5.417 8.351c-1.173-3.86-2.329-8.317-3.164-10.161z' fill='%23fff' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43l16.745-11.078M52.864 23.24L72.502 2.5M47.447 31.591l7.852-7.576' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.436 30.173l3.455-5.641.973-1.127 2.064.61.436-.131-3.355 3.427-2.479 2.27-1.326 1.114.232-.522z' fill='%23000'/%3E%3Cpath d='M34.013 21.451L23.202 26.58M40.905 22.5l-6.892 4.362M62.293 28.365l-4.04 9.85' stroke='%23fff' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.09 40.849c3.613 2.425-1.869 8.525-3.682 10.118M47.258 43.6c4.142 2.1 1.16 7.764-1.168 10.6M49.023 48.9c5.5 4.476-12.556 23.722-13.864 24.783' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88c13.658-2.117 20.2 10.047 20.459 13.52A116.386 116.386 0 0127.4 87.533' fill='%23000'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88c13.658-2.117 20.2 10.047 20.459 13.52A116.386 116.386 0 0127.4 87.533' stroke='%23000' stroke-width='.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_11950_117175'%3E%3Cpath fill='%23fff' d='M0 0h80v80H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}"
|
|
46
45
|
/*__inner_css_end__*/
|
|
47
|
-
, "
|
|
46
|
+
, "16vzj3n_gg_")
|
|
48
47
|
/*__reshadow_css_end__*/
|
|
49
48
|
, {
|
|
50
|
-
"__SFeedbackForm": "
|
|
51
|
-
"__SCancel": "
|
|
52
|
-
"__SSubmit": "
|
|
53
|
-
"__SNotice": "
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"__SEmail": "___SEmail_13cca_gg_"
|
|
49
|
+
"__SFeedbackForm": "___SFeedbackForm_1tavz_gg_",
|
|
50
|
+
"__SCancel": "___SCancel_1tavz_gg_",
|
|
51
|
+
"__SSubmit": "___SSubmit_1tavz_gg_",
|
|
52
|
+
"__SNotice": "___SNotice_1tavz_gg_",
|
|
53
|
+
"__SSuccess": "___SSuccess_1tavz_gg_",
|
|
54
|
+
"__SEmail": "___SEmail_1tavz_gg_"
|
|
57
55
|
});
|
|
58
56
|
|
|
59
57
|
var FeedbackForm = /*#__PURE__*/function (_Component) {
|
|
@@ -92,19 +90,19 @@ var FeedbackForm = /*#__PURE__*/function (_Component) {
|
|
|
92
90
|
return /*#__PURE__*/React.createElement(Form, _extends({
|
|
93
91
|
decorators: [this.focusDecorator]
|
|
94
92
|
}, other), function (api) {
|
|
95
|
-
var
|
|
93
|
+
var _ref6;
|
|
96
94
|
|
|
97
|
-
return
|
|
95
|
+
return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(SpinContainer, _ref6.cn("SpinContainer", {
|
|
98
96
|
"size": "xl",
|
|
99
97
|
"loading": loading === undefined ? api.submitting : loading
|
|
100
|
-
}), /*#__PURE__*/React.createElement(SFeedbackForm,
|
|
98
|
+
}), /*#__PURE__*/React.createElement(SFeedbackForm, _ref6.cn("SFeedbackForm", _objectSpread(_objectSpread({
|
|
101
99
|
"tag": "form",
|
|
102
100
|
"noValidate": true,
|
|
103
101
|
"method": "POST",
|
|
104
102
|
"ref": forwardRef
|
|
105
103
|
}, other), {}, {
|
|
106
104
|
"onSubmit": api.handleSubmit
|
|
107
|
-
})), typeof Children.origin === 'function' ? Children.origin(api) : /*#__PURE__*/React.createElement(Children,
|
|
105
|
+
})), typeof Children.origin === 'function' ? Children.origin(api) : /*#__PURE__*/React.createElement(Children, _ref6.cn("Children", {}))));
|
|
108
106
|
});
|
|
109
107
|
}
|
|
110
108
|
}]);
|
|
@@ -150,21 +148,18 @@ _defineProperty(FeedbackForm, "validate", {
|
|
|
150
148
|
|
|
151
149
|
var TooltipProps = ['title', 'theme', 'strategy', 'modifiers', 'placement', 'interaction', 'timeout', 'visible', 'defaultVisible', 'onVisibleChange', 'offset', 'preventOverflow', 'arrow', 'flip', 'computeStyles', 'eventListeners', 'onFirstUpdate'];
|
|
152
150
|
|
|
153
|
-
function Item(
|
|
154
|
-
var
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
var Children = _ref12.Children,
|
|
158
|
-
tag = _ref12.tag,
|
|
159
|
-
props = _objectWithoutProperties(_ref12, _excluded2);
|
|
151
|
+
function Item(_ref11) {
|
|
152
|
+
var Children = _ref11.Children,
|
|
153
|
+
tag = _ref11.tag,
|
|
154
|
+
props = _objectWithoutProperties(_ref11, _excluded2);
|
|
160
155
|
|
|
161
156
|
var tooltipProps = pick(props, TooltipProps);
|
|
162
|
-
return /*#__PURE__*/React.createElement(Field,
|
|
163
|
-
var
|
|
157
|
+
return /*#__PURE__*/React.createElement(Field, props, function (_ref12) {
|
|
158
|
+
var _ref = arguments[0];
|
|
164
159
|
|
|
165
|
-
var input =
|
|
166
|
-
meta =
|
|
167
|
-
other = _objectWithoutProperties(
|
|
160
|
+
var input = _ref12.input,
|
|
161
|
+
meta = _ref12.meta,
|
|
162
|
+
other = _objectWithoutProperties(_ref12, _excluded3);
|
|
168
163
|
|
|
169
164
|
var invalid = meta.invalid && meta.touched;
|
|
170
165
|
|
|
@@ -181,7 +176,7 @@ function Item(_ref12) {
|
|
|
181
176
|
flip: {
|
|
182
177
|
fallbackPlacements: ['right', 'bottom']
|
|
183
178
|
}
|
|
184
|
-
}, tooltipProps), tag && /*#__PURE__*/React.createElement("tag",
|
|
179
|
+
}, tooltipProps), tag && /*#__PURE__*/React.createElement("tag", _assignProps(_objectSpread({}, inputProps), _ref)), typeof Children.origin === 'function' && Children.origin(_objectSpread({
|
|
185
180
|
input: inputProps,
|
|
186
181
|
meta: meta
|
|
187
182
|
}, other)));
|
|
@@ -189,56 +184,56 @@ function Item(_ref12) {
|
|
|
189
184
|
}
|
|
190
185
|
|
|
191
186
|
function Success(props) {
|
|
192
|
-
var
|
|
193
|
-
|
|
187
|
+
var _ref2 = arguments[0],
|
|
188
|
+
_ref7;
|
|
194
189
|
|
|
195
190
|
var Children = props.Children,
|
|
196
191
|
styles = props.styles;
|
|
197
192
|
var SSuccess = Box;
|
|
198
193
|
var SEmail = 'div';
|
|
199
|
-
return
|
|
194
|
+
return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SSuccess, _ref7.cn("SSuccess", _objectSpread({}, _assignProps2({}, _ref2))), /*#__PURE__*/React.createElement(SEmail, _ref7.cn("SEmail", {})), /*#__PURE__*/React.createElement("span", _ref7.cn("span", {}), /*#__PURE__*/React.createElement(Children, _ref7.cn("Children", {}))));
|
|
200
195
|
} // because it is used without a wrapper
|
|
201
196
|
|
|
202
197
|
|
|
203
198
|
Success.style = style;
|
|
204
199
|
|
|
205
200
|
function Submit(props) {
|
|
206
|
-
var
|
|
207
|
-
|
|
201
|
+
var _ref3 = arguments[0],
|
|
202
|
+
_ref8;
|
|
208
203
|
|
|
209
204
|
var styles = props.styles;
|
|
210
205
|
var SSubmit = Button;
|
|
211
|
-
return
|
|
206
|
+
return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SSubmit, _ref8.cn("SSubmit", _objectSpread({}, _assignProps3({
|
|
212
207
|
"type": "submit",
|
|
213
208
|
"use": "primary",
|
|
214
209
|
"theme": "success"
|
|
215
|
-
},
|
|
210
|
+
}, _ref3))));
|
|
216
211
|
}
|
|
217
212
|
|
|
218
213
|
function Cancel(props) {
|
|
219
|
-
var
|
|
220
|
-
|
|
214
|
+
var _ref4 = arguments[0],
|
|
215
|
+
_ref9;
|
|
221
216
|
|
|
222
217
|
var styles = props.styles;
|
|
223
218
|
var SCancel = Button;
|
|
224
|
-
return
|
|
219
|
+
return _ref9 = sstyled(styles), /*#__PURE__*/React.createElement(SCancel, _ref9.cn("SCancel", _objectSpread({}, _assignProps4({
|
|
225
220
|
"type": "reset",
|
|
226
221
|
"use": "secondary",
|
|
227
222
|
"theme": "muted"
|
|
228
|
-
},
|
|
223
|
+
}, _ref4))));
|
|
229
224
|
}
|
|
230
225
|
|
|
231
226
|
function Notice(props) {
|
|
232
|
-
var
|
|
233
|
-
|
|
227
|
+
var _ref5 = arguments[0],
|
|
228
|
+
_ref10;
|
|
234
229
|
|
|
235
230
|
var styles = props.styles;
|
|
236
231
|
var SNotice = NoticeSmart;
|
|
237
|
-
return
|
|
232
|
+
return _ref10 = sstyled(styles), /*#__PURE__*/React.createElement(SNotice, _ref10.cn("SNotice", _objectSpread({}, _assignProps5({}, _ref5))));
|
|
238
233
|
}
|
|
239
234
|
|
|
240
235
|
Notice.defaultProps = {
|
|
241
|
-
theme: '
|
|
236
|
+
theme: 'gray96',
|
|
242
237
|
use: 'secondary'
|
|
243
238
|
};
|
|
244
239
|
export default createComponent(FeedbackForm, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/FeedbackForm.jsx"],"names":["React","Field","Form","createFocusDecorator","createComponent","Component","sstyled","Root","Button","SpinContainer","Tooltip","NoticeSmart","Box","pick","FeedbackForm","SFeedbackForm","asProps","Children","styles","loading","forwardRef","other","focusDecorator","api","undefined","submitting","handleSubmit","origin","style","onSubmit","description","error","value","words","split","symbols","join","length","email","test","String","toLowerCase","TooltipProps","Item","tag","props","tooltipProps","input","meta","invalid","touched","inputProps","state","active","fallbackPlacements","Success","SSuccess","SEmail","Submit","SSubmit","Cancel","SCancel","Notice","SNotice","defaultProps","theme","use"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/FeedbackForm.jsx"],"names":["React","Field","Form","createFocusDecorator","createComponent","Component","sstyled","Root","Button","SpinContainer","Tooltip","NoticeSmart","Box","pick","FeedbackForm","SFeedbackForm","asProps","Children","styles","loading","forwardRef","other","focusDecorator","api","undefined","submitting","handleSubmit","origin","style","onSubmit","description","error","value","words","split","symbols","join","length","email","test","String","toLowerCase","TooltipProps","Item","tag","props","tooltipProps","input","meta","invalid","touched","inputProps","state","active","fallbackPlacements","Success","SSuccess","SEmail","Submit","SSubmit","Cancel","SCancel","Notice","SNotice","defaultProps","theme","use"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Field, Form } from 'react-final-form';\nimport createFocusDecorator from 'final-form-focus';\n\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Button from '@semcore/button';\nimport SpinContainer from '@semcore/spin-container';\nimport Tooltip from '@semcore/tooltip';\nimport { NoticeSmart } from '@semcore/notice';\nimport { Box } from '@semcore/flex-box';\nimport pick from '@semcore/utils/lib/pick';\n\nimport style from './style/feedback-form.shadow.css';\n\nclass FeedbackForm extends Component {\n static displayName = 'FeedbackForm';\n static style = style;\n static FinalForm = {\n Field,\n Form,\n };\n\n static defaultProps = {\n onSubmit: () => {},\n };\n\n static validate = {\n description:\n (error) =>\n (value = '') => {\n const words = value.split(/\\s+/);\n const symbols = words.join(' ');\n if (symbols.length < 10 || words.length < 3) {\n return error;\n }\n },\n email:\n (error) =>\n (value = '') => {\n if (!/.+@.+\\..+/i.test(String(value).toLowerCase())) {\n return error;\n }\n },\n };\n\n focusDecorator = createFocusDecorator();\n\n render() {\n const SFeedbackForm = Box;\n const { Children, styles, loading, forwardRef, ...other } = this.asProps;\n\n return (\n <Form decorators={[this.focusDecorator]} {...other}>\n {(api) =>\n sstyled(styles)(\n <SpinContainer size=\"xl\" loading={loading === undefined ? api.submitting : loading}>\n <SFeedbackForm\n tag=\"form\"\n noValidate\n method=\"POST\"\n ref={forwardRef}\n {...other}\n onSubmit={api.handleSubmit}\n >\n {typeof Children.origin === 'function' ? Children.origin(api) : <Children />}\n </SFeedbackForm>\n </SpinContainer>,\n )\n }\n </Form>\n );\n }\n}\n\nconst TooltipProps = [\n 'title',\n 'theme',\n 'strategy',\n 'modifiers',\n 'placement',\n 'interaction',\n 'timeout',\n 'visible',\n 'defaultVisible',\n 'onVisibleChange',\n 'offset',\n 'preventOverflow',\n 'arrow',\n 'flip',\n 'computeStyles',\n 'eventListeners',\n 'onFirstUpdate',\n];\n\nfunction Item({ Children, tag, ...props }) {\n const tooltipProps = pick(props, TooltipProps);\n\n return (\n <Field {...props}>\n {({ input, meta, ...other }) => {\n const invalid = meta.invalid && meta.touched;\n const inputProps = {\n ...input,\n state: invalid ? 'invalid' : 'normal',\n };\n return (\n <Tooltip\n title={meta.error}\n visible={invalid && meta.active}\n inline={false}\n theme=\"warning\"\n placement=\"left\"\n flip={{\n fallbackPlacements: ['right', 'bottom'],\n }}\n {...tooltipProps}\n >\n {tag && <Root render={tag} {...inputProps} />}\n {typeof Children.origin === 'function' &&\n Children.origin({\n input: inputProps,\n meta,\n ...other,\n })}\n </Tooltip>\n );\n }}\n </Field>\n );\n}\n\nfunction Success(props) {\n const { Children, styles } = props;\n const SSuccess = Root;\n const SEmail = 'div';\n\n return sstyled(styles)(\n <SSuccess render={Box}>\n <SEmail />\n <span>\n <Children />\n </span>\n </SSuccess>,\n );\n}\n// because it is used without a wrapper\nSuccess.style = style;\n\nfunction Submit(props) {\n const { styles } = props;\n const SSubmit = Root;\n return sstyled(styles)(<SSubmit render={Button} type=\"submit\" use=\"primary\" theme=\"success\" />);\n}\n\nfunction Cancel(props) {\n const { styles } = props;\n const SCancel = Root;\n return sstyled(styles)(<SCancel render={Button} type=\"reset\" use=\"secondary\" theme=\"muted\" />);\n}\n\nfunction Notice(props) {\n const { styles } = props;\n const SNotice = Root;\n return sstyled(styles)(<SNotice render={NoticeSmart} />);\n}\n\nNotice.defaultProps = {\n theme: 'gray96',\n use: 'secondary',\n};\n\nexport default createComponent(FeedbackForm, {\n Item,\n Success,\n Submit,\n Cancel,\n Notice,\n});\n"],"file":"FeedbackForm.js"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
import { FormProps, FieldProps } from 'react-final-form';
|
|
3
|
+
|
|
4
|
+
import { ReturnEl, CProps } from '@semcore/core';
|
|
5
|
+
import Button from '@semcore/button';
|
|
6
|
+
import { NoticeSmart } from '@semcore/notice';
|
|
7
|
+
import { Box } from '@semcore/flex-box';
|
|
8
|
+
|
|
9
|
+
export interface IFeedbackForm extends FormProps {
|
|
10
|
+
/* The event is called when the form is submitted */
|
|
11
|
+
onSubmit: (values: any, form: any, callback?: (errors?: {}) => void) => {} | Promise<{}> | void;
|
|
12
|
+
/**
|
|
13
|
+
* The property is in charge of the spinner showing
|
|
14
|
+
* */
|
|
15
|
+
loading?: boolean;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
declare const FeedbackForm: (<T>(props: CProps<IFeedbackForm> & T) => ReturnEl) & {
|
|
19
|
+
Item: <T>(props: FieldProps<any, any> & T) => ReturnEl;
|
|
20
|
+
Success: <T>(props: CProps<ComponentProps<typeof Box>> & T) => ReturnEl;
|
|
21
|
+
Submit: <T>(props: ComponentProps<typeof Button> & T) => ReturnEl;
|
|
22
|
+
Cancel: <T>(props: ComponentProps<typeof Button> & T) => ReturnEl;
|
|
23
|
+
Notice: <T>(props: ComponentProps<typeof NoticeSmart> & T) => ReturnEl;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export default FeedbackForm;
|
package/lib/es6/index.js
CHANGED
package/lib/es6/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,gBAAxB
|
|
1
|
+
{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,gBAAxB","sourcesContent":["export { default } from './FeedbackForm';\n"],"file":"index.js"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
2
|
|
|
3
3
|
SFeedbackForm {
|
|
4
|
-
max-width:
|
|
4
|
+
max-width: 320px;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
SSubmit,
|
|
@@ -10,24 +10,24 @@ SCancel {
|
|
|
10
10
|
margin-right: 8px;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
SNotice
|
|
13
|
+
SNotice {
|
|
14
|
+
padding: 12px 16px;
|
|
14
15
|
border-width: 1px 0 0;
|
|
15
16
|
border-top-style: solid;
|
|
16
|
-
border-radius: 0 0
|
|
17
|
+
border-radius: 0 0 6px 6px;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
SSuccess {
|
|
20
21
|
display: flex;
|
|
21
22
|
align-items: center;
|
|
22
23
|
flex-direction: column;
|
|
23
|
-
width:
|
|
24
|
-
padding: 32px;
|
|
24
|
+
width: 320px;
|
|
25
|
+
padding: 46px 32px 32px;
|
|
25
26
|
box-sizing: border-box;
|
|
26
27
|
}
|
|
27
28
|
|
|
28
29
|
SEmail {
|
|
29
|
-
margin-bottom:
|
|
30
|
-
color: var(--green);
|
|
30
|
+
margin-bottom: 18px;
|
|
31
31
|
width: 80px;
|
|
32
32
|
height: 80px;
|
|
33
33
|
background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_11950_117175)'%3E%3Cpath d='M27.945 5.04601C27.7367 5.04597 27.5305 5.08702 27.3381 5.16681C27.1458 5.24661 26.971 5.36357 26.8239 5.51101L13.909 18.426C7.41937 24.9156 3.77356 33.7174 3.77356 42.895C3.77356 52.0727 7.41937 60.8744 13.909 67.364C20.3985 73.8536 29.2003 77.4994 38.3779 77.4994C47.5556 77.4994 56.3574 73.8536 62.847 67.364L75.762 54.448C75.9092 54.3011 76.026 54.1265 76.1056 53.9343C76.1853 53.7421 76.2262 53.536 76.226 53.328V5.94401C76.226 5.70531 76.1311 5.47639 75.9623 5.30761C75.7936 5.13883 75.5646 5.04401 75.326 5.04401L27.945 5.04601Z' fill='%2345E0A8'/%3E%3Cpath d='M28.615 44.751L28.815 45.104C34.956 41.652 52.997 31.426 56.346 34.573C55.208 31.466 39.307 34.9 28.615 44.751Z' fill='white'/%3E%3Cpath d='M28.5129 31.03C26.6999 37.072 19.2999 55.5 15.0699 61.342L18.0829 62.254L19.6589 60.925C23.8779 51.385 29.6389 34.972 29.9709 29.467C29.4619 29.182 28.9469 29.583 28.5129 31.03Z' fill='white'/%3E%3Cpath d='M15.0699 61.342C19.2999 55.5 26.6999 37.072 28.5129 31.03C30.3259 24.988 33.5549 37.039 31.7429 42.145' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M27.9091 45.411C38.5921 35.046 55.1831 31.4 56.3421 34.573C57.0301 36.459 42.9131 40.832 37.9341 46.889' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43C41.036 20.27 35.689 18.539 32.832 17.741C36.95 15.907 69.787 3.753 72.5 2.5C71.578 6.606 67.576 20.78 65.784 27.433C60.957 25.751 56.056 24.275 52.862 23.24C50.8608 25.8918 49.0505 28.6825 47.445 31.591C46.272 27.731 45.116 23.274 44.281 21.43Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43L61.026 10.352' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M52.864 23.24L72.502 2.5' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.447 31.591L55.299 24.015' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.436 30.173L51.891 24.532L52.864 23.405L54.928 24.015L55.364 23.884L52.009 27.311L49.53 29.581L48.204 30.695L48.436 30.173Z' fill='black'/%3E%3Cpath d='M34.013 21.451L23.202 26.58' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.9049 22.5L34.0129 26.862' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.2931 28.365L58.2531 38.215' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.09 40.849C49.703 43.274 44.221 49.374 42.408 50.967' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.258 43.6C51.4 45.7 48.418 51.364 46.09 54.2' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M49.0231 48.9C54.5231 53.376 36.4671 72.622 35.1591 73.683' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' fill='black'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_11950_117175'%3E%3Crect width='80' height='80' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/feedback-form",
|
|
3
3
|
"description": "SEMRush Feedback Form Component",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "5.0.1",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -15,13 +15,13 @@
|
|
|
15
15
|
"dependencies": {
|
|
16
16
|
"@semcore/utils": "^3.15",
|
|
17
17
|
"@semcore/flex-box": "^4",
|
|
18
|
-
"@semcore/tooltip": "^
|
|
19
|
-
"@semcore/spin-container": "^
|
|
20
|
-
"@semcore/button": "^
|
|
21
|
-
"@semcore/notice": "^
|
|
22
|
-
"final-form": "
|
|
23
|
-
"final-form-focus": "
|
|
24
|
-
"react-final-form": "
|
|
18
|
+
"@semcore/tooltip": "^5",
|
|
19
|
+
"@semcore/spin-container": "^6.0.0",
|
|
20
|
+
"@semcore/button": "^4",
|
|
21
|
+
"@semcore/notice": "^4",
|
|
22
|
+
"final-form": "4.19.1",
|
|
23
|
+
"final-form-focus": "1.1.2",
|
|
24
|
+
"react-final-form": "6.4.0"
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
27
|
"@semcore/core": "^1.11",
|
|
@@ -34,5 +34,8 @@
|
|
|
34
34
|
"type": "git",
|
|
35
35
|
"url": "https://github.com/semrush/intergalactic.git",
|
|
36
36
|
"directory": "semcore/feedback-form"
|
|
37
|
+
},
|
|
38
|
+
"devDependencies": {
|
|
39
|
+
"@semcore/jest-preset-ui": "1.0.0"
|
|
37
40
|
}
|
|
38
41
|
}
|
package/src/FeedbackForm.jsx
CHANGED
|
@@ -96,7 +96,7 @@ function Item({ Children, tag, ...props }) {
|
|
|
96
96
|
const tooltipProps = pick(props, TooltipProps);
|
|
97
97
|
|
|
98
98
|
return (
|
|
99
|
-
<
|
|
99
|
+
<Field {...props}>
|
|
100
100
|
{({ input, meta, ...other }) => {
|
|
101
101
|
const invalid = meta.invalid && meta.touched;
|
|
102
102
|
const inputProps = {
|
|
@@ -125,7 +125,7 @@ function Item({ Children, tag, ...props }) {
|
|
|
125
125
|
</Tooltip>
|
|
126
126
|
);
|
|
127
127
|
}}
|
|
128
|
-
</
|
|
128
|
+
</Field>
|
|
129
129
|
);
|
|
130
130
|
}
|
|
131
131
|
|
|
@@ -165,7 +165,7 @@ function Notice(props) {
|
|
|
165
165
|
}
|
|
166
166
|
|
|
167
167
|
Notice.defaultProps = {
|
|
168
|
-
theme: '
|
|
168
|
+
theme: 'gray96',
|
|
169
169
|
use: 'secondary',
|
|
170
170
|
};
|
|
171
171
|
|
package/src/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
@import '@semcore/utils/style/var.css';
|
|
2
2
|
|
|
3
3
|
SFeedbackForm {
|
|
4
|
-
max-width:
|
|
4
|
+
max-width: 320px;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
SSubmit,
|
|
@@ -10,24 +10,24 @@ SCancel {
|
|
|
10
10
|
margin-right: 8px;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
SNotice
|
|
13
|
+
SNotice {
|
|
14
|
+
padding: 12px 16px;
|
|
14
15
|
border-width: 1px 0 0;
|
|
15
16
|
border-top-style: solid;
|
|
16
|
-
border-radius: 0 0
|
|
17
|
+
border-radius: 0 0 6px 6px;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
SSuccess {
|
|
20
21
|
display: flex;
|
|
21
22
|
align-items: center;
|
|
22
23
|
flex-direction: column;
|
|
23
|
-
width:
|
|
24
|
-
padding: 32px;
|
|
24
|
+
width: 320px;
|
|
25
|
+
padding: 46px 32px 32px;
|
|
25
26
|
box-sizing: border-box;
|
|
26
27
|
}
|
|
27
28
|
|
|
28
29
|
SEmail {
|
|
29
|
-
margin-bottom:
|
|
30
|
-
color: var(--green);
|
|
30
|
+
margin-bottom: 18px;
|
|
31
31
|
width: 80px;
|
|
32
32
|
height: 80px;
|
|
33
33
|
background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_11950_117175)'%3E%3Cpath d='M27.945 5.04601C27.7367 5.04597 27.5305 5.08702 27.3381 5.16681C27.1458 5.24661 26.971 5.36357 26.8239 5.51101L13.909 18.426C7.41937 24.9156 3.77356 33.7174 3.77356 42.895C3.77356 52.0727 7.41937 60.8744 13.909 67.364C20.3985 73.8536 29.2003 77.4994 38.3779 77.4994C47.5556 77.4994 56.3574 73.8536 62.847 67.364L75.762 54.448C75.9092 54.3011 76.026 54.1265 76.1056 53.9343C76.1853 53.7421 76.2262 53.536 76.226 53.328V5.94401C76.226 5.70531 76.1311 5.47639 75.9623 5.30761C75.7936 5.13883 75.5646 5.04401 75.326 5.04401L27.945 5.04601Z' fill='%2345E0A8'/%3E%3Cpath d='M28.615 44.751L28.815 45.104C34.956 41.652 52.997 31.426 56.346 34.573C55.208 31.466 39.307 34.9 28.615 44.751Z' fill='white'/%3E%3Cpath d='M28.5129 31.03C26.6999 37.072 19.2999 55.5 15.0699 61.342L18.0829 62.254L19.6589 60.925C23.8779 51.385 29.6389 34.972 29.9709 29.467C29.4619 29.182 28.9469 29.583 28.5129 31.03Z' fill='white'/%3E%3Cpath d='M15.0699 61.342C19.2999 55.5 26.6999 37.072 28.5129 31.03C30.3259 24.988 33.5549 37.039 31.7429 42.145' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M27.9091 45.411C38.5921 35.046 55.1831 31.4 56.3421 34.573C57.0301 36.459 42.9131 40.832 37.9341 46.889' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43C41.036 20.27 35.689 18.539 32.832 17.741C36.95 15.907 69.787 3.753 72.5 2.5C71.578 6.606 67.576 20.78 65.784 27.433C60.957 25.751 56.056 24.275 52.862 23.24C50.8608 25.8918 49.0505 28.6825 47.445 31.591C46.272 27.731 45.116 23.274 44.281 21.43Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.281 21.43L61.026 10.352' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M52.864 23.24L72.502 2.5' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.447 31.591L55.299 24.015' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.436 30.173L51.891 24.532L52.864 23.405L54.928 24.015L55.364 23.884L52.009 27.311L49.53 29.581L48.204 30.695L48.436 30.173Z' fill='black'/%3E%3Cpath d='M34.013 21.451L23.202 26.58' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.9049 22.5L34.0129 26.862' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.2931 28.365L58.2531 38.215' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.09 40.849C49.703 43.274 44.221 49.374 42.408 50.967' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.258 43.6C51.4 45.7 48.418 51.364 46.09 54.2' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M49.0231 48.9C54.5231 53.376 36.4671 72.622 35.1591 73.683' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' fill='black'/%3E%3Cpath d='M5.177 73.321C7.669 70.98 13.419 62.372 14.7 59.88C28.358 57.763 34.9 69.927 35.159 73.4C32.9025 78.2847 30.3099 83.007 27.4 87.533' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_11950_117175'%3E%3Crect width='80' height='80' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
|