@arquimedes.co/eureka-forms 2.0.104 → 2.0.107
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/dist/@Types/GenericFormSteps.d.ts +1 -1
- package/dist/App/App.d.ts +3 -0
- package/dist/App/App.js +1 -0
- package/dist/App/AppFunctions.js +21 -3
- package/dist/App/AppHooks.js +3 -3
- package/dist/Contexts/CustomContext.d.ts +3 -0
- package/dist/Form/FormFunctions.js +1 -1
- package/dist/FormSteps/StepFunctions.d.ts +1 -1
- package/dist/FormSteps/StepFunctions.js +7 -4
- package/dist/FormSteps/TitleStep/MaterialTitleStep/MaterialTitleStep.js +13 -15
- package/dist/Services/DraftService.d.ts +2 -0
- package/dist/Services/DraftService.js +26 -14
- package/dist/Shared/SmartDraftRenderer/FormDecorator.d.ts +13 -0
- package/dist/Shared/SmartDraftRenderer/FormDecorator.js +34 -0
- package/dist/Shared/SmartDraftRenderer/FormDecorator.module.css +30 -0
- package/dist/Shared/SmartDraftRenderer/SmartDraftRenderer.d.ts +12 -0
- package/dist/Shared/SmartDraftRenderer/SmartDraftRenderer.js +66 -0
- package/dist/States/GlobalSlice.d.ts +2 -0
- package/package.json +1 -1
- package/dist/Shared/SmartDraftRenderer.d.ts +0 -8
- package/dist/Shared/SmartDraftRenderer.js +0 -17
package/dist/App/App.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ import './App.css';
|
|
|
4
4
|
import { CustomStep, CustomStepProps } from '../FormSteps/CustomStep';
|
|
5
5
|
import { EditorState } from 'draft-js';
|
|
6
6
|
import { CountryCode } from 'libphonenumber-js';
|
|
7
|
+
import { EurekaDraft } from '../@Types/Draft/Draft';
|
|
7
8
|
export interface AppProps {
|
|
8
9
|
/** If the app is currently a widget */
|
|
9
10
|
isWidget?: boolean;
|
|
@@ -49,6 +50,8 @@ export interface AppProps {
|
|
|
49
50
|
customSubmitBtns?: null | ((onSubmit: () => Promise<Record<string, any> | void>, loading: boolean) => JSX.Element);
|
|
50
51
|
/** Function to call on postview to fetch the download url of a file */
|
|
51
52
|
fetchDownloadUrl?: (S3Key: string, fileName: string) => Promise<string>;
|
|
53
|
+
/** Function to call to map entities internally (postview, activities) */
|
|
54
|
+
mapDraftEntities?: (property: string, dependencies: Record<string, any>) => Promise<EurekaDraft>;
|
|
52
55
|
/** Function to call after the confimation dialog has been closed */
|
|
53
56
|
handleConfirmed?: () => void;
|
|
54
57
|
/** Function called to scroll to the top */
|
package/dist/App/App.js
CHANGED
|
@@ -72,6 +72,7 @@ function App(_a) {
|
|
|
72
72
|
return (_jsx(CustomContext.Provider, __assign({ value: {
|
|
73
73
|
customSteps: customSteps,
|
|
74
74
|
sendLabel: props.sendLabel,
|
|
75
|
+
mapDraftEntities: props.mapDraftEntities,
|
|
75
76
|
fetchDownloadUrl: props.fetchDownloadUrl,
|
|
76
77
|
customStepProps: (_g = props.customStepProps) !== null && _g !== void 0 ? _g : {},
|
|
77
78
|
customClientInfoStep: props.customClientInfoStep,
|
package/dist/App/AppFunctions.js
CHANGED
|
@@ -182,8 +182,9 @@ export var mapOriginalValue = function (orgInfo, step, value, values, form, path
|
|
|
182
182
|
case FormStepTypes.CLASSIFIER_SELECTOR: return [3 /*break*/, 8];
|
|
183
183
|
case FormStepTypes.ENTITYVALUEPICKER: return [3 /*break*/, 9];
|
|
184
184
|
case FormStepTypes.TEXTINPUT: return [3 /*break*/, 12];
|
|
185
|
+
case FormStepTypes.TITLE: return [3 /*break*/, 13];
|
|
185
186
|
}
|
|
186
|
-
return [3 /*break*/,
|
|
187
|
+
return [3 /*break*/, 14];
|
|
187
188
|
case 1:
|
|
188
189
|
elements = value;
|
|
189
190
|
mappedElements = [];
|
|
@@ -297,7 +298,7 @@ export var mapOriginalValue = function (orgInfo, step, value, values, form, path
|
|
|
297
298
|
classifier = (_h = form.classifiers) === null || _h === void 0 ? void 0 : _h[value];
|
|
298
299
|
return [2 /*return*/, { value: value, label: classifier === null || classifier === void 0 ? void 0 : classifier.name }];
|
|
299
300
|
}
|
|
300
|
-
return [3 /*break*/,
|
|
301
|
+
return [3 /*break*/, 15];
|
|
301
302
|
}
|
|
302
303
|
_o.label = 9;
|
|
303
304
|
case 9:
|
|
@@ -335,13 +336,30 @@ export var mapOriginalValue = function (orgInfo, step, value, values, form, path
|
|
|
335
336
|
}
|
|
336
337
|
_o.label = 13;
|
|
337
338
|
case 13:
|
|
339
|
+
{
|
|
340
|
+
if (value.title) {
|
|
341
|
+
step.title =
|
|
342
|
+
typeof value.title === 'string'
|
|
343
|
+
? stringToDraft(value.title)
|
|
344
|
+
: value.title;
|
|
345
|
+
}
|
|
346
|
+
if (value.description) {
|
|
347
|
+
step.description =
|
|
348
|
+
typeof value.description === 'string'
|
|
349
|
+
? stringToDraft(value.description)
|
|
350
|
+
: value.description;
|
|
351
|
+
}
|
|
352
|
+
return [2 /*return*/, undefined];
|
|
353
|
+
}
|
|
354
|
+
_o.label = 14;
|
|
355
|
+
case 14:
|
|
338
356
|
if (step.type.startsWith('CBR_') &&
|
|
339
357
|
(value === null || value === void 0 ? void 0 : value.id) &&
|
|
340
358
|
typeof value.id === 'number') {
|
|
341
359
|
return [2 /*return*/, __assign(__assign({}, value), { id: value.id.toString() })];
|
|
342
360
|
}
|
|
343
361
|
return [2 /*return*/, value];
|
|
344
|
-
case
|
|
362
|
+
case 15: return [2 /*return*/];
|
|
345
363
|
}
|
|
346
364
|
});
|
|
347
365
|
});
|
package/dist/App/AppHooks.js
CHANGED
|
@@ -155,9 +155,9 @@ export var useSetupApp = function (isEmbedded, _a) {
|
|
|
155
155
|
var _loop_1 = function (section) {
|
|
156
156
|
for (var _b = 0, _c = section.steps; _b < _c.length; _b++) {
|
|
157
157
|
var idStep = _c[_b];
|
|
158
|
-
iterateNestedSteps(idStep, form.steps, function (step) {
|
|
158
|
+
iterateNestedSteps(idStep, form.steps, function (step, path) {
|
|
159
159
|
step.idSection = section.id;
|
|
160
|
-
step.
|
|
160
|
+
step.stepPath = path;
|
|
161
161
|
});
|
|
162
162
|
}
|
|
163
163
|
};
|
|
@@ -178,7 +178,7 @@ export var useSetupApp = function (isEmbedded, _a) {
|
|
|
178
178
|
return [4 /*yield*/, calcValuesStore({ idOrganization: idOrganization, countryCode: countryCode }, form, valuesData, postview, customSteps)];
|
|
179
179
|
case 5:
|
|
180
180
|
values = _g.sent();
|
|
181
|
-
dispatch(reset(__assign(__assign({ formStyle: internal
|
|
181
|
+
dispatch(reset(__assign(__assign({ apiKey: apiKey, formStyle: internal
|
|
182
182
|
? InternalFormStyle
|
|
183
183
|
: __assign(__assign({}, InternalFormStyle), ((_d = form === null || form === void 0 ? void 0 : form.style) !== null && _d !== void 0 ? _d : {})), confirmation: {
|
|
184
184
|
confirmationMessage: (_e = form.confirmationMessage) !== null && _e !== void 0 ? _e : BaseConfirmationMessage,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CustomStep, CustomStepProps } from '../FormSteps/CustomStep';
|
|
3
|
+
import { EurekaDraft } from '../@Types/Draft/Draft';
|
|
3
4
|
export interface CustomContextData {
|
|
4
5
|
sendLabel?: string;
|
|
5
6
|
customStepProps: Record<string, unknown>;
|
|
@@ -7,6 +8,8 @@ export interface CustomContextData {
|
|
|
7
8
|
customClientInfoStep?: (props: CustomStepProps) => JSX.Element;
|
|
8
9
|
/** Function to call on postview to fetch the download url of a file */
|
|
9
10
|
fetchDownloadUrl?: (S3Key: string, fileName: string) => Promise<string>;
|
|
11
|
+
/** Function to call to map entities internally (postview, activities) */
|
|
12
|
+
mapDraftEntities?: (property: string, dependencies: Record<string, any>) => Promise<EurekaDraft>;
|
|
10
13
|
}
|
|
11
14
|
declare const CustomContext: import("react").Context<CustomContextData>;
|
|
12
15
|
export default CustomContext;
|
|
@@ -224,7 +224,7 @@ function calcStepDependency(idStep, steps, values, customSteps) {
|
|
|
224
224
|
var originalValue = (_b = (_a = values.sections[depStep.idSection]) === null || _a === void 0 ? void 0 : _a[depStep.id]) !== null && _b !== void 0 ? _b : values.global[depStep.id];
|
|
225
225
|
return {
|
|
226
226
|
type: depStep.type,
|
|
227
|
-
idOriginal: depStep.
|
|
227
|
+
idOriginal: depStep.stepPath[0],
|
|
228
228
|
value: calcStepDependencyValue(depStep, originalValue, customSteps),
|
|
229
229
|
dependents: [],
|
|
230
230
|
};
|
|
@@ -9,7 +9,7 @@ export type FillerSteps = FormSelector | ClassifierSelector | EntityValuePicker
|
|
|
9
9
|
export declare function calcFillerSize(step: FillerSteps, steps: Record<string, FormStep>, values: Record<string, unknown>, size: FormSize): number;
|
|
10
10
|
export declare const calcStepWidth: (stepSize: 1 | 2 | 3 | 4, size: FormSize) => number;
|
|
11
11
|
export declare const calcDefaultValue: (step: FormStep | CBRFormStep) => any;
|
|
12
|
-
export declare const iterateNestedSteps: (idStep: string, steps: Record<string, FormStep>, iteration: (step: FormStep) => void) => void;
|
|
12
|
+
export declare const iterateNestedSteps: (idStep: string, steps: Record<string, FormStep>, iteration: (step: FormStep, path: string[]) => void, path?: string[]) => void;
|
|
13
13
|
/**
|
|
14
14
|
* Utility function to calc the substeps of a step
|
|
15
15
|
* @param step step to calc the substeps
|
|
@@ -150,23 +150,26 @@ export var calcDefaultValue = function (step) {
|
|
|
150
150
|
return undefined;
|
|
151
151
|
}
|
|
152
152
|
};
|
|
153
|
-
export var iterateNestedSteps = function (idStep, steps, iteration) {
|
|
153
|
+
export var iterateNestedSteps = function (idStep, steps, iteration, path) {
|
|
154
|
+
if (path === void 0) { path = [idStep]; }
|
|
154
155
|
var step = steps[idStep];
|
|
155
156
|
if (!step) {
|
|
156
157
|
console.error('Missing Step:', idStep);
|
|
157
158
|
return;
|
|
158
159
|
}
|
|
159
|
-
iteration(step);
|
|
160
|
+
iteration(step, path);
|
|
160
161
|
if (step.type === FormStepTypes.MAPPER) {
|
|
161
162
|
for (var _i = 0, _a = step.rootSteps; _i < _a.length; _i++) {
|
|
162
163
|
var idStep_1 = _a[_i];
|
|
163
|
-
iterateNestedSteps(idStep_1, step.steps, iteration)
|
|
164
|
+
iterateNestedSteps(idStep_1, step.steps, iteration, __spreadArray(__spreadArray([], path, true), [
|
|
165
|
+
step.id,
|
|
166
|
+
], false));
|
|
164
167
|
}
|
|
165
168
|
}
|
|
166
169
|
else {
|
|
167
170
|
for (var _b = 0, _c = calcSubSteps(step.id, steps); _b < _c.length; _b++) {
|
|
168
171
|
var idSubStep = _c[_b];
|
|
169
|
-
iterateNestedSteps(idSubStep, steps, iteration);
|
|
172
|
+
iterateNestedSteps(idSubStep, steps, iteration, __spreadArray(__spreadArray([], path, true), [step.id], false));
|
|
170
173
|
}
|
|
171
174
|
}
|
|
172
175
|
};
|
|
@@ -16,23 +16,21 @@ import { useAppSelector } from '../../../hooks';
|
|
|
16
16
|
import FormContext from '../../../Contexts/FormContext';
|
|
17
17
|
import { useContext, useMemo } from 'react';
|
|
18
18
|
import { selectDependencies, useFormStep } from '../../StepHooks';
|
|
19
|
-
import { convertFromRaw } from 'draft-js';
|
|
20
19
|
import { stringToDraft } from '../../../Utils/DraftFunctions';
|
|
21
|
-
import SmartDraftRenderer from '../../../Shared/SmartDraftRenderer';
|
|
20
|
+
import SmartDraftRenderer from '../../../Shared/SmartDraftRenderer/SmartDraftRenderer';
|
|
21
|
+
//**Pendientes a mejorar, esperar antes de enviar, en local (actividades), usar el value envez de el draft en actividades, esperar a que dejen de escribir, optimizar para que use lo que tiene en local y si necesita ahi si pregunte. */
|
|
22
22
|
function TitleStep(_a) {
|
|
23
23
|
var _b;
|
|
24
24
|
var step = _a.step;
|
|
25
|
-
var
|
|
25
|
+
var _c = useFormStep(step, {
|
|
26
26
|
defaultValue: undefined,
|
|
27
|
-
}).value;
|
|
27
|
+
}), value = _c.value, onChange = _c.onChange;
|
|
28
28
|
var formStyle = useAppSelector(function (state) { return state.global; }).formStyle;
|
|
29
29
|
var form = useContext(FormContext);
|
|
30
30
|
var widthStats = useAppSelector(function (state) { return state.widthStats; });
|
|
31
31
|
var size = (_b = step.size) !== null && _b !== void 0 ? _b : form.size.blockNum;
|
|
32
|
-
var title = useMemo(function () { return calcBaseDraft(
|
|
33
|
-
var
|
|
34
|
-
var description = useMemo(function () { return calcBaseDraft(value === null || value === void 0 ? void 0 : value.description, step.description); }, [value === null || value === void 0 ? void 0 : value.description, step.description]);
|
|
35
|
-
var hasDescription = useMemo(function () { return convertFromRaw(description).getPlainText().length > 0; }, [description]);
|
|
32
|
+
var title = useMemo(function () { return calcBaseDraft(step.title); }, [step.title]);
|
|
33
|
+
var description = useMemo(function () { return calcBaseDraft(step.description); }, [step.description]);
|
|
36
34
|
var dependencies = useAppSelector(function (state) {
|
|
37
35
|
return selectDependencies(state, step.dependencies);
|
|
38
36
|
});
|
|
@@ -49,18 +47,18 @@ function TitleStep(_a) {
|
|
|
49
47
|
width: widthStats.currentBreakPoint <= size
|
|
50
48
|
? '100%'
|
|
51
49
|
: calcStepWidth(size, form.size),
|
|
52
|
-
} }, { children: [
|
|
50
|
+
} }, { children: [_jsx("div", __assign({ className: styles.titleLbl, style: {
|
|
53
51
|
textAlign: widthStats.isMobile &&
|
|
54
52
|
widthStats.currentBreakPoint <= size
|
|
55
53
|
? 'center'
|
|
56
54
|
: 'start',
|
|
57
|
-
} }, { children: _jsx(SmartDraftRenderer, { draft: title, dependencies: values }) }))),
|
|
58
|
-
|
|
59
|
-
|
|
55
|
+
} }, { children: _jsx(SmartDraftRenderer, { draft: title, dependencies: values, property: "".concat(step.stepPath.join('.'), ".title"), onChange: function (title) { return onChange(__assign(__assign({}, value), { title: title })); } }) })), _jsx("div", __assign({ className: styles.descriptionPar }, { children: _jsx(SmartDraftRenderer, { draft: description, dependencies: values, margin: title ? '10px 0px' : '0px 0px 5px 0px', property: "".concat(step.stepPath.join('.'), ".description"), onChange: function (description) {
|
|
56
|
+
return onChange(__assign(__assign({}, value), { description: description }));
|
|
57
|
+
} }) }))] })));
|
|
60
58
|
}
|
|
61
59
|
export default TitleStep;
|
|
62
|
-
function calcBaseDraft(value
|
|
63
|
-
return value
|
|
60
|
+
function calcBaseDraft(value) {
|
|
61
|
+
return typeof value === 'string'
|
|
64
62
|
? stringToDraft(value)
|
|
65
|
-
:
|
|
63
|
+
: value !== null && value !== void 0 ? value : stringToDraft('');
|
|
66
64
|
}
|
|
@@ -9,7 +9,9 @@ export declare const DraftApi: import("@reduxjs/toolkit/query").Api<import("@red
|
|
|
9
9
|
}, unknown, unknown, {}, {}>, {
|
|
10
10
|
mapDraft: import("@reduxjs/toolkit/query").QueryDefinition<{
|
|
11
11
|
idForm: string;
|
|
12
|
+
property: string;
|
|
12
13
|
dependencies: Record<string, any>;
|
|
14
|
+
mapDraftEntities?: ((property: string, dependencies: Record<string, any>) => Promise<EurekaDraft>) | undefined;
|
|
13
15
|
}, import("@reduxjs/toolkit/query").BaseQueryFn<{
|
|
14
16
|
url: string;
|
|
15
17
|
timeout?: number | undefined;
|
|
@@ -41,27 +41,39 @@ export var DraftApi = RootApi.injectEndpoints({
|
|
|
41
41
|
endpoints: function (build) { return ({
|
|
42
42
|
mapDraft: build.query({
|
|
43
43
|
queryFn: function (_a, _b) {
|
|
44
|
-
var idForm = _a.idForm, dependencies = _a.dependencies;
|
|
44
|
+
var idForm = _a.idForm, dependencies = _a.dependencies, property = _a.property, mapDraftEntities = _a.mapDraftEntities;
|
|
45
45
|
var getState = _b.getState;
|
|
46
46
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
47
|
-
var idOrganization, response;
|
|
48
|
-
|
|
49
|
-
|
|
47
|
+
var idOrganization, apiKey, response;
|
|
48
|
+
var _c;
|
|
49
|
+
return __generator(this, function (_d) {
|
|
50
|
+
switch (_d.label) {
|
|
50
51
|
case 0:
|
|
51
52
|
idOrganization = getState().forms[idForm]
|
|
52
53
|
.global.idOrganization;
|
|
53
|
-
if (
|
|
54
|
+
if (!mapDraftEntities) return [3 /*break*/, 2];
|
|
55
|
+
_c = {};
|
|
56
|
+
return [4 /*yield*/, mapDraftEntities(property, dependencies)];
|
|
57
|
+
case 1: return [2 /*return*/, (_c.data = _d.sent(),
|
|
58
|
+
_c)];
|
|
59
|
+
case 2:
|
|
60
|
+
apiKey = getState().forms[idForm].global
|
|
61
|
+
.apiKey;
|
|
62
|
+
if (!apiKey)
|
|
54
63
|
return [2 /*return*/, { data: undefined }];
|
|
55
|
-
if (!idOrganization) return [3 /*break*/,
|
|
56
|
-
return [4 /*yield*/, widgetInstance.post("/form/draft?idOrganization=".concat(idOrganization),
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
case 2: return [4 /*yield*/, axiosInstance.post('/form/draft', dependencies)];
|
|
64
|
+
if (!idOrganization) return [3 /*break*/, 4];
|
|
65
|
+
return [4 /*yield*/, widgetInstance.post("/form/draft/".concat(apiKey, "?idOrganization=").concat(idOrganization), {
|
|
66
|
+
property: property,
|
|
67
|
+
dependencies: dependencies,
|
|
68
|
+
})];
|
|
61
69
|
case 3:
|
|
62
|
-
response =
|
|
63
|
-
|
|
64
|
-
case 4: return [
|
|
70
|
+
response = _d.sent();
|
|
71
|
+
return [3 /*break*/, 6];
|
|
72
|
+
case 4: return [4 /*yield*/, axiosInstance.post("/form/draft/".concat(apiKey), dependencies)];
|
|
73
|
+
case 5:
|
|
74
|
+
response = _d.sent();
|
|
75
|
+
_d.label = 6;
|
|
76
|
+
case 6: return [2 /*return*/, { data: response.data }];
|
|
65
77
|
}
|
|
66
78
|
});
|
|
67
79
|
});
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ContentState } from 'draft-js';
|
|
3
|
+
export interface DecoratorComponentProps {
|
|
4
|
+
children: JSX.Element;
|
|
5
|
+
contentState: ContentState;
|
|
6
|
+
entityKey: string;
|
|
7
|
+
blockKey: string;
|
|
8
|
+
start: number;
|
|
9
|
+
end: number;
|
|
10
|
+
editable?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare function FormDecorator({ children, entityKey, }: DecoratorComponentProps): JSX.Element;
|
|
13
|
+
export declare function FormDecoratorsStrategy(contentBlock: any, callback: any, contentState: any): void;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
import { useContext } from 'react';
|
|
14
|
+
import { DraftEntityTypes } from '../../constants/Draft/DraftEntityTypes';
|
|
15
|
+
import { DraftLoadingContext } from './SmartDraftRenderer';
|
|
16
|
+
import styles from './FormDecorator.module.css';
|
|
17
|
+
export function FormDecorator(_a) {
|
|
18
|
+
var children = _a.children, entityKey = _a.entityKey;
|
|
19
|
+
var loading = useContext(DraftLoadingContext);
|
|
20
|
+
return (_jsx("span", __assign({ id: entityKey, className: loading ? styles.loadingDecorator : styles.decorator, style: {
|
|
21
|
+
overflow: 'hidden',
|
|
22
|
+
position: 'relative',
|
|
23
|
+
padding: '0px 3px',
|
|
24
|
+
borderRadius: 12,
|
|
25
|
+
} }, { children: children })));
|
|
26
|
+
}
|
|
27
|
+
export function FormDecoratorsStrategy(contentBlock, callback, contentState) {
|
|
28
|
+
contentBlock.findEntityRanges(function (character) {
|
|
29
|
+
var entityKey = character.getEntity();
|
|
30
|
+
return (entityKey !== null &&
|
|
31
|
+
contentState.getEntity(entityKey).getType() ===
|
|
32
|
+
DraftEntityTypes.EUREKA);
|
|
33
|
+
}, callback);
|
|
34
|
+
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
.loadingDecorator {
|
|
2
|
+
position: absolute;
|
|
3
|
+
animation-duration: 3s;
|
|
4
|
+
animation-fill-mode: forwards;
|
|
5
|
+
animation-iteration-count: infinite;
|
|
6
|
+
animation-name: loading;
|
|
7
|
+
animation-timing-function: linear;
|
|
8
|
+
background: linear-gradient(
|
|
9
|
+
to right,
|
|
10
|
+
#d6d6d6 2%,
|
|
11
|
+
rgba(255, 255, 255, 0.3) 20%,
|
|
12
|
+
#d6d6d6 50%
|
|
13
|
+
);
|
|
14
|
+
background-size: 800px 100px;
|
|
15
|
+
height: 100%;
|
|
16
|
+
width: 100%;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.decorator {
|
|
20
|
+
background-color: #d6d6d6;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
@keyframes loading {
|
|
24
|
+
0% {
|
|
25
|
+
background-position: -800px 0;
|
|
26
|
+
}
|
|
27
|
+
100% {
|
|
28
|
+
background-position: 800px 0;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { EurekaDraft } from '../../@Types/Draft/Draft';
|
|
3
|
+
export declare const DraftLoadingContext: React.Context<boolean>;
|
|
4
|
+
interface SmartDraftRendererProps {
|
|
5
|
+
property: string;
|
|
6
|
+
draft: EurekaDraft;
|
|
7
|
+
margin?: React.CSSProperties['margin'];
|
|
8
|
+
dependencies: Record<string, any>;
|
|
9
|
+
onChange?: (value: EurekaDraft) => void;
|
|
10
|
+
}
|
|
11
|
+
declare function SmartDraftRenderer({ draft, margin, onChange, property, dependencies, }: SmartDraftRendererProps): JSX.Element;
|
|
12
|
+
export default SmartDraftRenderer;
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
import { createContext, useContext, useEffect, useMemo } from 'react';
|
|
14
|
+
import { IdFormContext } from '../../App/App';
|
|
15
|
+
import { DraftApi } from '../../Services/DraftService';
|
|
16
|
+
import { convertFromRaw, EditorState } from 'draft-js';
|
|
17
|
+
import { Editor } from 'react-draft-wysiwyg';
|
|
18
|
+
import { produce } from 'immer';
|
|
19
|
+
import CustomContext from '../../Contexts/CustomContext';
|
|
20
|
+
import { FormDecoratorsStrategy, FormDecorator } from './FormDecorator';
|
|
21
|
+
import { skipToken } from '@reduxjs/toolkit/query';
|
|
22
|
+
import { useAppSelector } from '../../hooks';
|
|
23
|
+
export var DraftLoadingContext = createContext(true);
|
|
24
|
+
function SmartDraftRenderer(_a) {
|
|
25
|
+
var draft = _a.draft, margin = _a.margin, onChange = _a.onChange, property = _a.property, dependencies = _a.dependencies;
|
|
26
|
+
var idForm = useContext(IdFormContext);
|
|
27
|
+
var mapDraftEntities = useContext(CustomContext).mapDraftEntities;
|
|
28
|
+
var postview = useAppSelector(function (state) { return state.global.postview; });
|
|
29
|
+
var hasEntities = useMemo(function () { return Object.keys(draft.entityMap).length > 0; }, [draft]);
|
|
30
|
+
var _b = DraftApi.useMapDraftQuery(!hasEntities || postview
|
|
31
|
+
? skipToken
|
|
32
|
+
: {
|
|
33
|
+
idForm: idForm,
|
|
34
|
+
property: property,
|
|
35
|
+
dependencies: dependencies,
|
|
36
|
+
mapDraftEntities: mapDraftEntities,
|
|
37
|
+
}), mapped = _b.data, isFetching = _b.isFetching;
|
|
38
|
+
useEffect(function () {
|
|
39
|
+
if (mapped && !postview)
|
|
40
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(mapped);
|
|
41
|
+
}, [mapped]);
|
|
42
|
+
var editorState = useMemo(function () {
|
|
43
|
+
return EditorState.createWithContent(convertFromRaw(cleanUpDraftParams(isFetching ? draft : mapped !== null && mapped !== void 0 ? mapped : draft)));
|
|
44
|
+
}, [mapped, draft, isFetching]);
|
|
45
|
+
return (_jsx("div", __assign({ style: { margin: margin } }, { children: _jsx(DraftLoadingContext.Provider, __assign({ value: !postview && isFetching }, { children: _jsx(Editor, { readOnly: true, toolbarHidden: true, editorState: editorState, editorClassName: 'Erk-Forms-Draft', customDecorators: customDecorators }) })) })));
|
|
46
|
+
}
|
|
47
|
+
export default SmartDraftRenderer;
|
|
48
|
+
function cleanUpDraftParams(draft) {
|
|
49
|
+
return produce(draft, function (draft) {
|
|
50
|
+
for (var _i = 0, _a = draft.blocks; _i < _a.length; _i++) {
|
|
51
|
+
var block = _a[_i];
|
|
52
|
+
for (var _b = 0, _c = block.entityRanges; _b < _c.length; _b++) {
|
|
53
|
+
var entity = _c[_b];
|
|
54
|
+
var offset = entity.offset, length_1 = entity.length;
|
|
55
|
+
//Change text into spaces
|
|
56
|
+
block.text = block.text.replace(block.text.substring(offset, offset + length_1), ' '.repeat(length_1));
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
var customDecorators = [
|
|
62
|
+
{
|
|
63
|
+
strategy: FormDecoratorsStrategy,
|
|
64
|
+
component: FormDecorator,
|
|
65
|
+
},
|
|
66
|
+
];
|
|
@@ -4,6 +4,7 @@ import { SiteState } from './SiteSlice';
|
|
|
4
4
|
import { EurekaDraft } from '../@Types/Draft/Draft';
|
|
5
5
|
import { CountryCode } from 'libphonenumber-js';
|
|
6
6
|
export interface GlobalState {
|
|
7
|
+
apiKey?: string;
|
|
7
8
|
idOrganization: string;
|
|
8
9
|
idCurrentAgent?: string;
|
|
9
10
|
countryCode: CountryCode;
|
|
@@ -30,6 +31,7 @@ export declare const GlobalSlice: import("@reduxjs/toolkit").Slice<GlobalState,
|
|
|
30
31
|
preview: boolean;
|
|
31
32
|
idOrganization: string;
|
|
32
33
|
idCurrentAgent?: string | undefined;
|
|
34
|
+
apiKey?: string | undefined;
|
|
33
35
|
countryCode: CountryCode;
|
|
34
36
|
confirmation: {
|
|
35
37
|
confirmationMessage: EurekaDraft;
|
package/package.json
CHANGED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { EurekaDraft } from '../@Types/Draft/Draft';
|
|
3
|
-
interface SmartDraftRendererProps {
|
|
4
|
-
draft: EurekaDraft;
|
|
5
|
-
dependencies: Record<string, any>;
|
|
6
|
-
}
|
|
7
|
-
declare function SmartDraftRenderer({ draft, dependencies, }: SmartDraftRendererProps): JSX.Element;
|
|
8
|
-
export default SmartDraftRenderer;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useContext, useMemo } from 'react';
|
|
3
|
-
import { IdFormContext } from '../App/App';
|
|
4
|
-
import { DraftApi } from '../Services/DraftService';
|
|
5
|
-
import { convertFromRaw, EditorState } from 'draft-js';
|
|
6
|
-
import { Editor } from 'react-draft-wysiwyg';
|
|
7
|
-
function SmartDraftRenderer(_a) {
|
|
8
|
-
var draft = _a.draft, dependencies = _a.dependencies;
|
|
9
|
-
var idForm = useContext(IdFormContext);
|
|
10
|
-
var mapped = DraftApi.useMapDraftQuery({
|
|
11
|
-
idForm: idForm,
|
|
12
|
-
dependencies: dependencies,
|
|
13
|
-
}).data;
|
|
14
|
-
var editorState = useMemo(function () { return EditorState.createWithContent(convertFromRaw(mapped !== null && mapped !== void 0 ? mapped : draft)); }, [mapped, draft]);
|
|
15
|
-
return (_jsx(Editor, { editorClassName: 'Erk-Forms-Draft', editorState: editorState, readOnly: true, toolbarHidden: true }));
|
|
16
|
-
}
|
|
17
|
-
export default SmartDraftRenderer;
|