@sitecore-jss/sitecore-jss-react 23.0.0-canary.8 → 23.0.0
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/LICENSE.txt +202 -202
- package/README.md +10 -10
- package/dist/cjs/components/Date.js +3 -5
- package/dist/cjs/components/ErrorBoundary.js +18 -2
- package/dist/cjs/components/Image.js +5 -10
- package/dist/cjs/components/Link.js +5 -8
- package/dist/cjs/components/Placeholder.js +3 -10
- package/dist/cjs/components/PlaceholderCommon.js +8 -44
- package/dist/cjs/components/RichText.js +10 -11
- package/dist/cjs/components/SitecoreContext.js +0 -8
- package/dist/cjs/components/Text.js +3 -6
- package/dist/cjs/enhancers/withDatasourceCheck.js +1 -4
- package/dist/cjs/enhancers/withPlaceholder.js +2 -2
- package/dist/cjs/enhancers/withSitecoreContext.js +1 -2
- package/dist/cjs/index.js +1 -28
- package/dist/cjs/utils.js +1 -16
- package/dist/esm/components/Date.js +2 -5
- package/dist/esm/components/ErrorBoundary.js +18 -2
- package/dist/esm/components/Image.js +4 -10
- package/dist/esm/components/Link.js +5 -8
- package/dist/esm/components/Placeholder.js +3 -10
- package/dist/esm/components/PlaceholderCommon.js +9 -45
- package/dist/esm/components/RichText.js +11 -12
- package/dist/esm/components/SitecoreContext.js +0 -8
- package/dist/esm/components/Text.js +2 -6
- package/dist/esm/enhancers/withDatasourceCheck.js +1 -4
- package/dist/esm/enhancers/withPlaceholder.js +2 -2
- package/dist/esm/enhancers/withSitecoreContext.js +2 -3
- package/dist/esm/index.js +1 -11
- package/dist/esm/utils.js +0 -14
- package/package.json +3 -6
- package/types/ComponentBuilder.d.ts +0 -1
- package/types/components/Date.d.ts +2 -4
- package/types/components/EditFrame.d.ts +0 -1
- package/types/components/ErrorBoundary.d.ts +0 -1
- package/types/components/File.d.ts +0 -1
- package/types/components/HiddenRendering.d.ts +0 -1
- package/types/components/Image.d.ts +2 -4
- package/types/components/Link.d.ts +3 -5
- package/types/components/MissingComponent.d.ts +0 -1
- package/types/components/Placeholder.d.ts +0 -1
- package/types/components/PlaceholderCommon.d.ts +5 -4
- package/types/components/RichText.d.ts +3 -5
- package/types/components/SitecoreContext.d.ts +0 -21
- package/types/components/Text.d.ts +2 -4
- package/types/components/VisitorIdentification.d.ts +0 -1
- package/types/components/sharedTypes.d.ts +1 -8
- package/types/enhancers/withComponentFactory.d.ts +0 -1
- package/types/enhancers/withDatasourceCheck.d.ts +0 -1
- package/types/enhancers/withEditorChromes.d.ts +0 -1
- package/types/enhancers/withPlaceholder.d.ts +0 -1
- package/types/enhancers/withSitecoreContext.d.ts +1 -3
- package/types/index.d.ts +1 -11
- package/types/utils.d.ts +0 -9
- package/dist/cjs/components/BYOCComponent.js +0 -122
- package/dist/cjs/components/BYOCWrapper.js +0 -18
- package/dist/cjs/components/DefaultEmptyFieldEditingComponents.js +0 -22
- package/dist/cjs/components/DesignLibrary.js +0 -72
- package/dist/cjs/components/EditingScripts.js +0 -47
- package/dist/cjs/components/FEaaSComponent.js +0 -151
- package/dist/cjs/components/FEaaSWrapper.js +0 -18
- package/dist/cjs/components/FieldMetadata.js +0 -29
- package/dist/cjs/components/Form.js +0 -80
- package/dist/cjs/components/PlaceholderMetadata.js +0 -63
- package/dist/cjs/enhancers/withEmptyFieldEditingComponent.js +0 -63
- package/dist/cjs/enhancers/withFieldMetadata.js +0 -60
- package/dist/esm/components/BYOCComponent.js +0 -91
- package/dist/esm/components/BYOCWrapper.js +0 -11
- package/dist/esm/components/DefaultEmptyFieldEditingComponents.js +0 -14
- package/dist/esm/components/DesignLibrary.js +0 -45
- package/dist/esm/components/EditingScripts.js +0 -40
- package/dist/esm/components/FEaaSComponent.js +0 -119
- package/dist/esm/components/FEaaSWrapper.js +0 -11
- package/dist/esm/components/FieldMetadata.js +0 -22
- package/dist/esm/components/Form.js +0 -52
- package/dist/esm/components/PlaceholderMetadata.js +0 -56
- package/dist/esm/enhancers/withEmptyFieldEditingComponent.js +0 -36
- package/dist/esm/enhancers/withFieldMetadata.js +0 -33
- package/types/components/BYOCComponent.d.ts +0 -91
- package/types/components/BYOCWrapper.d.ts +0 -4
- package/types/components/DefaultEmptyFieldEditingComponents.d.ts +0 -10
- package/types/components/DesignLibrary.d.ts +0 -3
- package/types/components/EditingScripts.d.ts +0 -8
- package/types/components/FEaaSComponent.d.ts +0 -72
- package/types/components/FEaaSWrapper.d.ts +0 -4
- package/types/components/FieldMetadata.d.ts +0 -18
- package/types/components/Form.d.ts +0 -30
- package/types/components/PlaceholderMetadata.d.ts +0 -29
- package/types/enhancers/withEmptyFieldEditingComponent.d.ts +0 -28
- package/types/enhancers/withFieldMetadata.d.ts +0 -17
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
/// <reference types="@types/react" />
|
|
2
1
|
import React from 'react';
|
|
3
2
|
import { EnhancedOmit } from '@sitecore-jss/sitecore-jss/utils';
|
|
4
|
-
import {
|
|
3
|
+
import { SitecoreContextValue } from '../components/SitecoreContext';
|
|
5
4
|
export interface WithSitecoreContextOptions {
|
|
6
5
|
updatable?: boolean;
|
|
7
6
|
}
|
|
8
7
|
export interface WithSitecoreContextProps {
|
|
9
8
|
sitecoreContext: SitecoreContextValue;
|
|
10
|
-
api?: SitecoreContextState['api'];
|
|
11
9
|
updateSitecoreContext?: ((value: SitecoreContextValue) => void) | false;
|
|
12
10
|
}
|
|
13
11
|
export type WithSitecoreContextHocProps<ComponentProps> = EnhancedOmit<ComponentProps, keyof WithSitecoreContextProps>;
|
package/types/index.d.ts
CHANGED
|
@@ -1,23 +1,17 @@
|
|
|
1
1
|
export { constants, enableDebug, ClientError, CacheClient, CacheOptions, MemoryCacheClient, HttpDataFetcher, NativeDataFetcher, NativeDataFetcherError, NativeDataFetcherResponse, NativeDataFetcherConfig, } from '@sitecore-jss/sitecore-jss';
|
|
2
2
|
export { EnhancedOmit } from '@sitecore-jss/sitecore-jss/utils';
|
|
3
3
|
export { isEditorActive, resetEditorChromes, DefaultEditFrameButton, DefaultEditFrameButtons, EditFrameDataSource, FieldEditButton, WebEditButton, EditButtonTypes, } from '@sitecore-jss/sitecore-jss/editing';
|
|
4
|
-
export {
|
|
4
|
+
export { LayoutService, LayoutServiceData, LayoutServicePageState, LayoutServiceContext, LayoutServiceContextData, GraphQLLayoutService, RestLayoutService, RouteData, Field, Item, HtmlElementRendering, getChildPlaceholder, getFieldValue, ComponentRendering, ComponentFields, ComponentParams, } from '@sitecore-jss/sitecore-jss/layout';
|
|
5
5
|
export { trackingApi, TrackingRequestOptions, CampaignInstance, GoalInstance, OutcomeInstance, EventInstance, PageViewInstance, } from '@sitecore-jss/sitecore-jss/tracking';
|
|
6
6
|
export { DictionaryPhrases, DictionaryService, GraphQLDictionaryService, RestDictionaryService, } from '@sitecore-jss/sitecore-jss/i18n';
|
|
7
7
|
export { GraphQLClientError, RetryStrategy, DefaultRetryStrategy, GraphQLRequestClientFactoryConfig, GraphQLRequestClient, } from '@sitecore-jss/sitecore-jss/graphql';
|
|
8
8
|
export { mediaApi } from '@sitecore-jss/sitecore-jss/media';
|
|
9
9
|
export { ComponentFactory, JssComponentType } from './components/sharedTypes';
|
|
10
10
|
export { Placeholder, PlaceholderComponentProps } from './components/Placeholder';
|
|
11
|
-
export { Form } from './components/Form';
|
|
12
11
|
export { Image, ImageProps, ImageField, getEEMarkup, ImageFieldValue, ImageSizeParameters, } from './components/Image';
|
|
13
12
|
export { RichText, RichTextProps, RichTextField } from './components/RichText';
|
|
14
13
|
export { Text, TextField } from './components/Text';
|
|
15
14
|
export { DateField, DateFieldProps } from './components/Date';
|
|
16
|
-
export { FEaaSComponent, FEaaSComponentProps, FEaaSComponentParams, fetchFEaaSComponentServerProps, } from './components/FEaaSComponent';
|
|
17
|
-
export { FEaaSWrapper } from './components/FEaaSWrapper';
|
|
18
|
-
export { DesignLibrary } from './components/DesignLibrary';
|
|
19
|
-
export { BYOCComponent, BYOCComponentParams, BYOCComponentProps, fetchBYOCComponentServerProps, } from './components/BYOCComponent';
|
|
20
|
-
export { BYOCWrapper } from './components/BYOCWrapper';
|
|
21
15
|
export { Link, LinkField, LinkFieldValue, LinkProps } from './components/Link';
|
|
22
16
|
export { File, FileField } from './components/File';
|
|
23
17
|
export { VisitorIdentification } from './components/VisitorIdentification';
|
|
@@ -28,7 +22,3 @@ export { withPlaceholder } from './enhancers/withPlaceholder';
|
|
|
28
22
|
export { withDatasourceCheck } from './enhancers/withDatasourceCheck';
|
|
29
23
|
export { EditFrameProps, EditFrame } from './components/EditFrame';
|
|
30
24
|
export { ComponentBuilder, ComponentBuilderConfig } from './ComponentBuilder';
|
|
31
|
-
export { withFieldMetadata } from './enhancers/withFieldMetadata';
|
|
32
|
-
export { withEmptyFieldEditingComponent } from './enhancers/withEmptyFieldEditingComponent';
|
|
33
|
-
export { EditingScripts } from './components/EditingScripts';
|
|
34
|
-
export { DefaultEmptyFieldEditingComponentText, DefaultEmptyFieldEditingComponentImage, } from './components/DefaultEmptyFieldEditingComponents';
|
package/types/utils.d.ts
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { ComponentFields } from '@sitecore-jss/sitecore-jss/layout';
|
|
2
1
|
export declare const convertKebabCasetoCamelCase: (str: string) => string;
|
|
3
2
|
/**
|
|
4
3
|
* https://facebook.github.io/react/docs/dom-elements.html
|
|
@@ -32,11 +31,3 @@ export declare const addClassName: (otherAttrs: {
|
|
|
32
31
|
export declare const getAttributesString: (attributes: {
|
|
33
32
|
[key: string]: unknown;
|
|
34
33
|
}) => string;
|
|
35
|
-
/**
|
|
36
|
-
* Used in FEAAS and BYOC implementations to convert datasource item field values into component props
|
|
37
|
-
* @param {ComponentFields} fields field collection from Sitecore
|
|
38
|
-
* @returns JSON object that can be used as props
|
|
39
|
-
*/
|
|
40
|
-
export declare const getDataFromFields: (fields: ComponentFields) => {
|
|
41
|
-
[key: string]: unknown;
|
|
42
|
-
};
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
26
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
27
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
28
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
29
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
30
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
31
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
32
|
-
});
|
|
33
|
-
};
|
|
34
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
35
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
36
|
-
};
|
|
37
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
-
exports.fetchBYOCComponentServerProps = exports.BYOCComponent = exports.BYOC_COMPONENT_RENDERING_NAME = void 0;
|
|
39
|
-
const react_1 = __importDefault(require("react"));
|
|
40
|
-
const utils_1 = require("../utils");
|
|
41
|
-
const MissingComponent_1 = require("./MissingComponent");
|
|
42
|
-
const FEAAS = __importStar(require("@sitecore-feaas/clientside/react"));
|
|
43
|
-
exports.BYOC_COMPONENT_RENDERING_NAME = 'BYOCComponent';
|
|
44
|
-
const DefaultErrorComponent = (props) => {
|
|
45
|
-
var _a;
|
|
46
|
-
return (react_1.default.createElement("div", null,
|
|
47
|
-
"A rendering error occurred: ", (_a = props.error) === null || _a === void 0 ? void 0 :
|
|
48
|
-
_a.message,
|
|
49
|
-
"."));
|
|
50
|
-
};
|
|
51
|
-
/**
|
|
52
|
-
* BYOCComponent facilitate the rendering of external components. It manages potential errors,
|
|
53
|
-
* missing components, and customization of error messages or alternative rendering components.
|
|
54
|
-
* @param {ByocComponentProps} props component props
|
|
55
|
-
* @returns dynamicly rendered component or Missing Component error frame
|
|
56
|
-
*/
|
|
57
|
-
class BYOCComponent extends react_1.default.Component {
|
|
58
|
-
constructor(props) {
|
|
59
|
-
super(props);
|
|
60
|
-
this.state = {};
|
|
61
|
-
}
|
|
62
|
-
static getDerivedStateFromError(error) {
|
|
63
|
-
// Update state so the next render will show the fallback UI.
|
|
64
|
-
return { error: error };
|
|
65
|
-
}
|
|
66
|
-
componentDidCatch(error) {
|
|
67
|
-
this.setState({ error });
|
|
68
|
-
}
|
|
69
|
-
render() {
|
|
70
|
-
var _a, _b, _c;
|
|
71
|
-
const props = this.props;
|
|
72
|
-
if (this.state.error) {
|
|
73
|
-
return this.props.errorComponent ? (react_1.default.createElement(this.props.errorComponent, { error: this.state.error })) : (react_1.default.createElement(DefaultErrorComponent, { error: this.state.error }));
|
|
74
|
-
}
|
|
75
|
-
const { ComponentName: componentName } = props.params || {};
|
|
76
|
-
if (!componentName) {
|
|
77
|
-
const noNameProps = {
|
|
78
|
-
errorOverride: 'BYOC: The ComponentName for this rendering is missing',
|
|
79
|
-
};
|
|
80
|
-
return props.missingComponentComponent ? (react_1.default.createElement(this.props.missingComponentComponent, Object.assign({}, noNameProps))) : (react_1.default.createElement(MissingComponent_1.MissingComponent, Object.assign({}, noNameProps)));
|
|
81
|
-
}
|
|
82
|
-
const unRegisteredComponentProps = {
|
|
83
|
-
rendering: {
|
|
84
|
-
componentName: componentName,
|
|
85
|
-
},
|
|
86
|
-
errorOverride: 'BYOC: This component was not registered.',
|
|
87
|
-
};
|
|
88
|
-
const fallbackComponent = this.props.missingComponentComponent ? (react_1.default.createElement(this.props.missingComponentComponent, Object.assign({}, unRegisteredComponentProps))) : (react_1.default.createElement(MissingComponent_1.MissingComponent, Object.assign({}, unRegisteredComponentProps)));
|
|
89
|
-
const ErrorComponent = this.props.errorComponent;
|
|
90
|
-
let componentProps = {};
|
|
91
|
-
if ((_a = props.params) === null || _a === void 0 ? void 0 : _a.ComponentProps) {
|
|
92
|
-
try {
|
|
93
|
-
componentProps = (_b = JSON.parse(props.params.ComponentProps)) !== null && _b !== void 0 ? _b : {};
|
|
94
|
-
}
|
|
95
|
-
catch (e) {
|
|
96
|
-
console.error(`Parsing props for ${componentName} component from rendering params failed. Error: ${e}`);
|
|
97
|
-
return ErrorComponent ? (react_1.default.createElement(ErrorComponent, { error: e })) : (react_1.default.createElement(DefaultErrorComponent, { error: e }));
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
// apply props from item datasource
|
|
101
|
-
const dataSourcesData = Object.assign(Object.assign({}, props.fetchedData), { _: (0, utils_1.getDataFromFields)((_c = props.fields) !== null && _c !== void 0 ? _c : {}) });
|
|
102
|
-
// we render fallback on client to avoid problems with client-only components
|
|
103
|
-
return (react_1.default.createElement(FEAAS.ExternalComponent, Object.assign({}, props.rendering, { componentName: componentName, clientFallback: fallbackComponent, datasources: dataSourcesData }, componentProps)));
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
exports.BYOCComponent = BYOCComponent;
|
|
107
|
-
/**
|
|
108
|
-
* Fetches server component props required for server rendering, based on rendering params.
|
|
109
|
-
* @param {BYOCComponentParams} params component params
|
|
110
|
-
*/
|
|
111
|
-
function fetchBYOCComponentServerProps(params) {
|
|
112
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
113
|
-
const fetchDataOptions = params.ComponentDataOverride
|
|
114
|
-
? JSON.parse(params.ComponentDataOverride)
|
|
115
|
-
: {};
|
|
116
|
-
const fetchedData = yield FEAAS.DataSettings.fetch(fetchDataOptions || {});
|
|
117
|
-
return {
|
|
118
|
-
fetchedData,
|
|
119
|
-
};
|
|
120
|
-
});
|
|
121
|
-
}
|
|
122
|
-
exports.fetchBYOCComponentServerProps = fetchBYOCComponentServerProps;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.BYOCWrapper = exports.BYOC_WRAPPER_RENDERING_NAME = void 0;
|
|
7
|
-
const BYOCComponent_1 = require("./BYOCComponent");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
9
|
-
exports.BYOC_WRAPPER_RENDERING_NAME = 'BYOCWrapper';
|
|
10
|
-
const BYOCWrapper = (props) => {
|
|
11
|
-
var _a, _b, _c;
|
|
12
|
-
const styles = (_b = (_a = props.params) === null || _a === void 0 ? void 0 : _a.styles) === null || _b === void 0 ? void 0 : _b.trimEnd();
|
|
13
|
-
const id = (_c = props.params) === null || _c === void 0 ? void 0 : _c.RenderingIdentifier;
|
|
14
|
-
return (react_1.default.createElement("div", { className: styles ? styles : undefined, id: id ? id : undefined },
|
|
15
|
-
react_1.default.createElement("div", { className: "component-content" },
|
|
16
|
-
react_1.default.createElement(BYOCComponent_1.BYOCComponent, Object.assign({}, props)))));
|
|
17
|
-
};
|
|
18
|
-
exports.BYOCWrapper = BYOCWrapper;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.DefaultEmptyFieldEditingComponentImage = exports.DefaultEmptyFieldEditingComponentText = void 0;
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
8
|
-
const DefaultEmptyFieldEditingComponentText = (props) => {
|
|
9
|
-
return react_1.default.createElement(props.tag || 'span', props, '[No text in field]');
|
|
10
|
-
};
|
|
11
|
-
exports.DefaultEmptyFieldEditingComponentText = DefaultEmptyFieldEditingComponentText;
|
|
12
|
-
const DefaultEmptyFieldEditingComponentImage = (props) => {
|
|
13
|
-
const inlineStyles = {
|
|
14
|
-
minWidth: '48px',
|
|
15
|
-
minHeight: '48px',
|
|
16
|
-
maxWidth: '400px',
|
|
17
|
-
maxHeight: '400px',
|
|
18
|
-
cursor: 'pointer',
|
|
19
|
-
};
|
|
20
|
-
return (react_1.default.createElement("img", Object.assign({}, props, { alt: "", src: 'data:image/svg+xml,%3Csvg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 240 240" style="enable-background:new 0 0 240 240;" xml:space="preserve"%3E%3Cstyle type="text/css"%3E .st0%7Bfill:none;%7D .st1%7Bfill:%23969696;%7D .st2%7Bfill:%23FFFFFF;%7D .st3%7Bfill:%23FFFFFF;stroke:%23FFFFFF;stroke-width:0.75;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cg%3E%3Crect class="st0" width="240" height="240"/%3E%3Cg%3E%3Cg%3E%3Crect x="20" y="20" class="st1" width="200" height="200"/%3E%3C/g%3E%3Cg%3E%3Ccircle class="st2" cx="174" cy="67" r="14"/%3E%3Cpath class="st2" d="M174,54c7.17,0,13,5.83,13,13s-5.83,13-13,13s-13-5.83-13-13S166.83,54,174,54 M174,52 c-8.28,0-15,6.72-15,15s6.72,15,15,15s15-6.72,15-15S182.28,52,174,52L174,52z"/%3E%3C/g%3E%3Cpolyline class="st3" points="29.5,179.25 81.32,122.25 95.41,137.75 137.23,91.75 209.5,179.75 "/%3E%3C/g%3E%3C/g%3E%3C/svg%3E', style: inlineStyles, className: `scEmptyImage ${props.className || ''}` })));
|
|
21
|
-
};
|
|
22
|
-
exports.DefaultEmptyFieldEditingComponentImage = DefaultEmptyFieldEditingComponentImage;
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.DesignLibrary = void 0;
|
|
27
|
-
const react_1 = __importStar(require("react"));
|
|
28
|
-
const Placeholder_1 = require("./Placeholder");
|
|
29
|
-
const layout_1 = require("@sitecore-jss/sitecore-jss/layout");
|
|
30
|
-
const editing_1 = require("@sitecore-jss/sitecore-jss/editing");
|
|
31
|
-
const DesignLibrary = (layoutData) => {
|
|
32
|
-
const { route } = layoutData.sitecore;
|
|
33
|
-
const isDesignLibrary = layoutData.sitecore.context.renderingType === layout_1.RenderingType.Component;
|
|
34
|
-
if (!isDesignLibrary) {
|
|
35
|
-
return react_1.default.createElement(react_1.default.Fragment, null);
|
|
36
|
-
}
|
|
37
|
-
const [renderKey, setRenderKey] = (0, react_1.useState)(0);
|
|
38
|
-
const [rootUpdate, setRootUpdate] = (0, react_1.useState)(null);
|
|
39
|
-
const rootComponent = route === null || route === void 0 ? void 0 : route.placeholders[layout_1.EDITING_COMPONENT_PLACEHOLDER][0];
|
|
40
|
-
// useEffect may execute multiple times on single render (i.e. in dev) - but we only want to fire ready event once
|
|
41
|
-
let componentReady = false;
|
|
42
|
-
// have an up-to-date layout state between re-renders (SSR re-render excluded)
|
|
43
|
-
const persistedRoot = (0, react_1.useMemo)(() => (Object.assign(Object.assign({}, (rootComponent || {})), rootUpdate)), [
|
|
44
|
-
rootComponent,
|
|
45
|
-
rootUpdate,
|
|
46
|
-
]);
|
|
47
|
-
route.placeholders[layout_1.EDITING_COMPONENT_PLACEHOLDER][0] = persistedRoot;
|
|
48
|
-
(0, react_1.useEffect)(() => {
|
|
49
|
-
// useEffect will fire when components are ready - and we inform the whole wide world of it too
|
|
50
|
-
if (!componentReady) {
|
|
51
|
-
componentReady = true;
|
|
52
|
-
window.top.postMessage((0, editing_1.getDesignLibraryStatusEvent)(editing_1.DesignLibraryStatus.READY, rootComponent.uid), '*');
|
|
53
|
-
}
|
|
54
|
-
const unsubscribe = (0, editing_1.addComponentUpdateHandler)(persistedRoot, (updatedRoot) => {
|
|
55
|
-
setRootUpdate(Object.assign({}, updatedRoot));
|
|
56
|
-
setRenderKey((key) => key + 1);
|
|
57
|
-
});
|
|
58
|
-
// useEffect will cleanup event handler on re-render
|
|
59
|
-
return unsubscribe;
|
|
60
|
-
}, []);
|
|
61
|
-
(0, react_1.useEffect)(() => {
|
|
62
|
-
// Send a rendered event only as effect of a component update command
|
|
63
|
-
if (renderKey === 0) {
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
window.top.postMessage((0, editing_1.getDesignLibraryStatusEvent)(editing_1.DesignLibraryStatus.RENDERED, rootComponent.uid), '*');
|
|
67
|
-
}, [renderKey, rootComponent.uid]);
|
|
68
|
-
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
69
|
-
react_1.default.createElement("main", null,
|
|
70
|
-
react_1.default.createElement("div", { id: layout_1.EDITING_COMPONENT_ID }, route && (react_1.default.createElement(Placeholder_1.Placeholder, { name: layout_1.EDITING_COMPONENT_PLACEHOLDER, rendering: route, key: renderKey }))))));
|
|
71
|
-
};
|
|
72
|
-
exports.DesignLibrary = DesignLibrary;
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.EditingScripts = void 0;
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
8
|
-
const layout_1 = require("@sitecore-jss/sitecore-jss/layout");
|
|
9
|
-
const withSitecoreContext_1 = require("../enhancers/withSitecoreContext");
|
|
10
|
-
const editing_1 = require("@sitecore-jss/sitecore-jss/editing");
|
|
11
|
-
const editing_2 = require("@sitecore-jss/sitecore-jss/editing");
|
|
12
|
-
/**
|
|
13
|
-
* - Renders client scripts and data for editing/preview mode for Pages
|
|
14
|
-
* - Renders script required for the Design Library (when RenderingType is `component`).
|
|
15
|
-
* This script is only rendered when EditMode is Metadata or RenderingType is `component`, otherwise it renders nothing.
|
|
16
|
-
* @returns A JSX element containing the editing scripts or an empty fragment if not in editing/preview mode.
|
|
17
|
-
*/
|
|
18
|
-
const EditingScripts = () => {
|
|
19
|
-
var _a;
|
|
20
|
-
const { sitecoreContext: { pageState, editMode, clientData, clientScripts, renderingType }, api, } = (0, withSitecoreContext_1.useSitecoreContext)();
|
|
21
|
-
// Don't render anything if not in editing/preview mode and rendering type is not component
|
|
22
|
-
if (renderingType !== layout_1.RenderingType.Component &&
|
|
23
|
-
(pageState === layout_1.LayoutServicePageState.Normal || pageState === layout_1.LayoutServicePageState.Preview)) {
|
|
24
|
-
return react_1.default.createElement(react_1.default.Fragment, null);
|
|
25
|
-
}
|
|
26
|
-
// In case of RenderingType.Component - render only the script for Design Libnrary
|
|
27
|
-
if (renderingType === layout_1.RenderingType.Component) {
|
|
28
|
-
// Add cache buster to the script URL (format hh-dd-mm-yyyy, UTC)
|
|
29
|
-
const now = new Date();
|
|
30
|
-
const hour = String(now.getUTCHours()).padStart(2, '0');
|
|
31
|
-
const day = String(now.getUTCDate()).padStart(2, '0');
|
|
32
|
-
const month = String(now.getUTCMonth() + 1).padStart(2, '0');
|
|
33
|
-
const year = String(now.getUTCFullYear());
|
|
34
|
-
const cacheTimestamp = `${hour}-${day}-${month}-${year}`;
|
|
35
|
-
const scriptUrl = `${(0, editing_2.getDesignLibraryScriptLink)((_a = api === null || api === void 0 ? void 0 : api.edge) === null || _a === void 0 ? void 0 : _a.edgeUrl)}?cb=${cacheTimestamp}`;
|
|
36
|
-
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
37
|
-
react_1.default.createElement("script", { src: scriptUrl, suppressHydrationWarning: true })));
|
|
38
|
-
}
|
|
39
|
-
if (editMode === layout_1.EditMode.Metadata) {
|
|
40
|
-
const jssClientData = Object.assign(Object.assign({}, clientData), (0, editing_1.getJssPagesClientData)());
|
|
41
|
-
return (react_1.default.createElement(react_1.default.Fragment, null, clientScripts === null || clientScripts === void 0 ? void 0 :
|
|
42
|
-
clientScripts.map((src, index) => (react_1.default.createElement("script", { src: src, key: index }))),
|
|
43
|
-
Object.keys(jssClientData).map((id) => (react_1.default.createElement("script", { key: id, id: id, type: "application/json", dangerouslySetInnerHTML: { __html: JSON.stringify(jssClientData[id]) } })))));
|
|
44
|
-
}
|
|
45
|
-
return react_1.default.createElement(react_1.default.Fragment, null);
|
|
46
|
-
};
|
|
47
|
-
exports.EditingScripts = EditingScripts;
|
|
@@ -1,151 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
26
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
27
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
28
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
29
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
30
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
31
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
32
|
-
});
|
|
33
|
-
};
|
|
34
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
35
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
36
|
-
};
|
|
37
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
-
exports.composeComponentEndpoint = exports.fetchFEaaSComponentServerProps = exports.FEaaSComponent = exports.FEAAS_COMPONENT_RENDERING_NAME = void 0;
|
|
39
|
-
const react_1 = __importDefault(require("react"));
|
|
40
|
-
const FEAAS = __importStar(require("@sitecore-feaas/clientside/react"));
|
|
41
|
-
const layout_1 = require("@sitecore-jss/sitecore-jss/layout");
|
|
42
|
-
const utils_1 = require("../utils");
|
|
43
|
-
exports.FEAAS_COMPONENT_RENDERING_NAME = 'FEaaSComponent';
|
|
44
|
-
/**
|
|
45
|
-
* @param {FEaaSComponentProps} props component props
|
|
46
|
-
*/
|
|
47
|
-
const FEaaSComponent = (props) => {
|
|
48
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
49
|
-
const computedRevision = ((_a = props.params) === null || _a === void 0 ? void 0 : _a.ComponentRevision) || props.revisionFallback;
|
|
50
|
-
if (!props.template &&
|
|
51
|
-
(!props.params ||
|
|
52
|
-
!props.params.LibraryId ||
|
|
53
|
-
!props.params.ComponentId ||
|
|
54
|
-
!props.params.ComponentVersion ||
|
|
55
|
-
!props.params.ComponentHostName ||
|
|
56
|
-
!computedRevision)) {
|
|
57
|
-
// Missing FEaaS component required props
|
|
58
|
-
return null;
|
|
59
|
-
}
|
|
60
|
-
// combine fetchedData from server with datasource data (if present)
|
|
61
|
-
const data = Object.assign(Object.assign({}, props.fetchedData), { _: (0, utils_1.getDataFromFields)((_b = props.fields) !== null && _b !== void 0 ? _b : {}) });
|
|
62
|
-
// FEaaS control would still be hydrated by client
|
|
63
|
-
// we pass all the props as a workaround to avoid hydration error, until we convert all JSS components to server side
|
|
64
|
-
// this also allows component to fall back to full client-side rendering when template or src is empty
|
|
65
|
-
// FEAAS should not fetch anything, since JSS does the fetching - so we pass empty array into fetch param
|
|
66
|
-
return (react_1.default.createElement(FEAAS.Component, { data: data, template: props.template, cdn: (_c = props.params) === null || _c === void 0 ? void 0 : _c.ComponentHostName, library: (_d = props.params) === null || _d === void 0 ? void 0 : _d.LibraryId, version: (_e = props.params) === null || _e === void 0 ? void 0 : _e.ComponentVersion, component: (_f = props.params) === null || _f === void 0 ? void 0 : _f.ComponentId, instance: (_g = props.params) === null || _g === void 0 ? void 0 : _g.ComponentInstanceId, revision: computedRevision, fetch: [] }));
|
|
67
|
-
};
|
|
68
|
-
exports.FEaaSComponent = FEaaSComponent;
|
|
69
|
-
/**
|
|
70
|
-
* Fetches server component props required for server rendering, based on rendering params.
|
|
71
|
-
* Component endpoint will either be retrieved from params or from endpointOverride
|
|
72
|
-
* @param {FEaaSComponentParams} params component params
|
|
73
|
-
* @param {LayoutServicePageState} [pageState] page state to determine which component variant to use
|
|
74
|
-
* @param {string} [endpointOverride] optional override for component endpoint
|
|
75
|
-
*/
|
|
76
|
-
function fetchFEaaSComponentServerProps(params, pageState, endpointOverride) {
|
|
77
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
78
|
-
const revisionFallback = pageState && pageState !== layout_1.LayoutServicePageState.Normal ? 'staged' : 'published';
|
|
79
|
-
const src = endpointOverride || (0, exports.composeComponentEndpoint)(params, revisionFallback);
|
|
80
|
-
let template = '';
|
|
81
|
-
let fetchedData = {};
|
|
82
|
-
const fetchDataOptions = params.ComponentDataOverride
|
|
83
|
-
? JSON.parse(params.ComponentDataOverride)
|
|
84
|
-
: {};
|
|
85
|
-
try {
|
|
86
|
-
template = yield fetchComponentTemplate(src, params, revisionFallback);
|
|
87
|
-
fetchedData = yield fetchData(fetchDataOptions);
|
|
88
|
-
}
|
|
89
|
-
catch (e) {
|
|
90
|
-
console.error(e);
|
|
91
|
-
}
|
|
92
|
-
return {
|
|
93
|
-
fetchedData,
|
|
94
|
-
revisionFallback,
|
|
95
|
-
template,
|
|
96
|
-
};
|
|
97
|
-
});
|
|
98
|
-
}
|
|
99
|
-
exports.fetchFEaaSComponentServerProps = fetchFEaaSComponentServerProps;
|
|
100
|
-
/**
|
|
101
|
-
* @param {string} src component endpoint
|
|
102
|
-
* @param {FEaaSComponentParams} params rendering parameters for FEAAS component
|
|
103
|
-
* @param {RevisionType} revisionFallback fallback revision to fetch if revision is absent in params
|
|
104
|
-
*/
|
|
105
|
-
function fetchComponentTemplate(src, params, revisionFallback) {
|
|
106
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
107
|
-
try {
|
|
108
|
-
const { template } = yield FEAAS.fetchComponent(src);
|
|
109
|
-
return template;
|
|
110
|
-
}
|
|
111
|
-
catch (error) {
|
|
112
|
-
console.error(`Fetch FEAAS component from ${src} failed. Ensure the component revision "${params.ComponentRevision ||
|
|
113
|
-
revisionFallback}" is present`);
|
|
114
|
-
throw error;
|
|
115
|
-
}
|
|
116
|
-
});
|
|
117
|
-
}
|
|
118
|
-
/**
|
|
119
|
-
* Fetches component data based on the provided data options.
|
|
120
|
-
* This function asynchronously fetches data using the FEAAS.DataSettings.fetch method.
|
|
121
|
-
* @param {FEAAS.DataOptions} dataOptions - Options to customize data fetching.
|
|
122
|
-
* @returns {Promise<FEAAS.DataScopes>} A promise that resolves with the fetched data,
|
|
123
|
-
* or rejects with an error if data fetching encounters an issue.
|
|
124
|
-
* @throws {Error} If an error occurs during data fetching, it is propagated as an error.
|
|
125
|
-
*/
|
|
126
|
-
function fetchData(dataOptions) {
|
|
127
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
128
|
-
try {
|
|
129
|
-
const fetchedData = yield FEAAS.DataSettings.fetch(dataOptions || {});
|
|
130
|
-
return fetchedData;
|
|
131
|
-
}
|
|
132
|
-
catch (error) {
|
|
133
|
-
console.error('Fetch FEAAS component data settings failed');
|
|
134
|
-
throw error;
|
|
135
|
-
}
|
|
136
|
-
});
|
|
137
|
-
}
|
|
138
|
-
/**
|
|
139
|
-
* Build component endpoint URL from component's params
|
|
140
|
-
* @param {FEaaSComponentParams} params rendering parameters for FEAAS component
|
|
141
|
-
* @param {RevisionType} revisionFallback fallback revision to fetch if revision is absent in params
|
|
142
|
-
* @returns component endpoint URL
|
|
143
|
-
*/
|
|
144
|
-
const composeComponentEndpoint = (params, revisionFallback) => {
|
|
145
|
-
const revision = params.ComponentRevision || revisionFallback;
|
|
146
|
-
const hostname = params.ComponentHostName.startsWith('https://')
|
|
147
|
-
? params.ComponentHostName
|
|
148
|
-
: `https://${params.ComponentHostName}`;
|
|
149
|
-
return `${hostname}/components/${params.LibraryId}/${params.ComponentId}/${params.ComponentVersion}/${revision}`;
|
|
150
|
-
};
|
|
151
|
-
exports.composeComponentEndpoint = composeComponentEndpoint;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.FEaaSWrapper = exports.FEAAS_WRAPPER_RENDERING_NAME = void 0;
|
|
7
|
-
const FEaaSComponent_1 = require("./FEaaSComponent");
|
|
8
|
-
const react_1 = __importDefault(require("react"));
|
|
9
|
-
exports.FEAAS_WRAPPER_RENDERING_NAME = 'FEaaSWrapper';
|
|
10
|
-
const FEaaSWrapper = (props) => {
|
|
11
|
-
var _a, _b;
|
|
12
|
-
const styles = `component feaas ${(_a = props.params) === null || _a === void 0 ? void 0 : _a.styles}`.trimEnd();
|
|
13
|
-
const id = (_b = props.params) === null || _b === void 0 ? void 0 : _b.RenderingIdentifier;
|
|
14
|
-
return (react_1.default.createElement("div", { className: styles, id: id ? id : undefined },
|
|
15
|
-
react_1.default.createElement("div", { className: "component-content" },
|
|
16
|
-
react_1.default.createElement(FEaaSComponent_1.FEaaSComponent, Object.assign({}, props)))));
|
|
17
|
-
};
|
|
18
|
-
exports.FEaaSWrapper = FEaaSWrapper;
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.FieldMetadata = void 0;
|
|
7
|
-
const react_1 = __importDefault(require("react"));
|
|
8
|
-
const editing_1 = require("@sitecore-jss/sitecore-jss/editing");
|
|
9
|
-
/**
|
|
10
|
-
* The component which renders field metadata markup
|
|
11
|
-
* @param {FieldMetadataProps} props the props of the component
|
|
12
|
-
* @returns metadata markup wrapped around children
|
|
13
|
-
*/
|
|
14
|
-
const FieldMetadata = (props) => {
|
|
15
|
-
const data = JSON.stringify(props.metadata);
|
|
16
|
-
const attributes = {
|
|
17
|
-
type: 'text/sitecore',
|
|
18
|
-
chrometype: 'field',
|
|
19
|
-
className: 'scpm',
|
|
20
|
-
};
|
|
21
|
-
const codeOpenAttributes = Object.assign(Object.assign({}, attributes), { kind: editing_1.MetadataKind.Open });
|
|
22
|
-
const codeCloseAttributes = Object.assign(Object.assign({}, attributes), { kind: editing_1.MetadataKind.Close });
|
|
23
|
-
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
24
|
-
react_1.default.createElement("code", Object.assign({}, codeOpenAttributes), data),
|
|
25
|
-
props.children,
|
|
26
|
-
react_1.default.createElement("code", Object.assign({}, codeCloseAttributes))));
|
|
27
|
-
};
|
|
28
|
-
exports.FieldMetadata = FieldMetadata;
|
|
29
|
-
exports.FieldMetadata.displayName = 'FieldMetadata';
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
/* eslint-disable prefer-const */
|
|
3
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
-
if (k2 === undefined) k2 = k;
|
|
5
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
-
}
|
|
9
|
-
Object.defineProperty(o, k2, desc);
|
|
10
|
-
}) : (function(o, m, k, k2) {
|
|
11
|
-
if (k2 === undefined) k2 = k;
|
|
12
|
-
o[k2] = m[k];
|
|
13
|
-
}));
|
|
14
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
-
}) : function(o, v) {
|
|
17
|
-
o["default"] = v;
|
|
18
|
-
});
|
|
19
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
20
|
-
if (mod && mod.__esModule) return mod;
|
|
21
|
-
var result = {};
|
|
22
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
23
|
-
__setModuleDefault(result, mod);
|
|
24
|
-
return result;
|
|
25
|
-
};
|
|
26
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
-
exports.Form = exports.mockFormModule = void 0;
|
|
28
|
-
const react_1 = __importStar(require("react"));
|
|
29
|
-
const sitecore_jss_1 = require("@sitecore-jss/sitecore-jss");
|
|
30
|
-
const withSitecoreContext_1 = require("../enhancers/withSitecoreContext");
|
|
31
|
-
let { executeScriptElements, loadForm, subscribeToFormSubmitEvent } = sitecore_jss_1.form;
|
|
32
|
-
/**
|
|
33
|
-
* Mock function to replace the form module functions for `testing` purposes.
|
|
34
|
-
* @param {any} formModule - The form module to mock
|
|
35
|
-
*/
|
|
36
|
-
const mockFormModule = (formModule) => {
|
|
37
|
-
executeScriptElements = formModule.executeScriptElements;
|
|
38
|
-
loadForm = formModule.loadForm;
|
|
39
|
-
subscribeToFormSubmitEvent = formModule.subscribeToFormSubmitEvent;
|
|
40
|
-
};
|
|
41
|
-
exports.mockFormModule = mockFormModule;
|
|
42
|
-
const Form = ({ params, rendering }) => {
|
|
43
|
-
var _a, _b, _c, _d, _e;
|
|
44
|
-
const id = params === null || params === void 0 ? void 0 : params.RenderingIdentifier;
|
|
45
|
-
const [error, setError] = (0, react_1.useState)(false);
|
|
46
|
-
const [content, setContent] = (0, react_1.useState)('');
|
|
47
|
-
const context = (0, withSitecoreContext_1.useSitecoreContext)();
|
|
48
|
-
const formRef = (0, react_1.useRef)(null);
|
|
49
|
-
const isEditing = context.sitecoreContext.pageEditing;
|
|
50
|
-
(0, react_1.useEffect)(() => {
|
|
51
|
-
var _a, _b, _c, _d;
|
|
52
|
-
if (!content) {
|
|
53
|
-
loadForm((_b = (_a = context.api) === null || _a === void 0 ? void 0 : _a.edge) === null || _b === void 0 ? void 0 : _b.contextId, params.FormId, (_d = (_c = context.api) === null || _c === void 0 ? void 0 : _c.edge) === null || _d === void 0 ? void 0 : _d.edgeUrl)
|
|
54
|
-
.then(setContent)
|
|
55
|
-
.catch(() => {
|
|
56
|
-
if (isEditing) {
|
|
57
|
-
console.error(`Failed to load form with id ${params.FormId}. Check debug logs for sitecore-jss:form for more details.`);
|
|
58
|
-
}
|
|
59
|
-
setError(true);
|
|
60
|
-
});
|
|
61
|
-
}
|
|
62
|
-
}, [content, params.FormId, (_b = (_a = context.api) === null || _a === void 0 ? void 0 : _a.edge) === null || _b === void 0 ? void 0 : _b.contextId, (_d = (_c = context.api) === null || _c === void 0 ? void 0 : _c.edge) === null || _d === void 0 ? void 0 : _d.edgeUrl, isEditing]);
|
|
63
|
-
(0, react_1.useEffect)(() => {
|
|
64
|
-
if (!content || !formRef.current)
|
|
65
|
-
return;
|
|
66
|
-
formRef.current.innerHTML = content;
|
|
67
|
-
executeScriptElements(formRef.current);
|
|
68
|
-
// If we are in editing mode, we don't want to send any events
|
|
69
|
-
if (!isEditing) {
|
|
70
|
-
subscribeToFormSubmitEvent(formRef.current, rendering.uid);
|
|
71
|
-
}
|
|
72
|
-
}, [content, isEditing, rendering.uid]);
|
|
73
|
-
if (isEditing) {
|
|
74
|
-
if (error) {
|
|
75
|
-
return (react_1.default.createElement("div", { className: "sc-jss-placeholder-error" }, "There was a problem loading this section"));
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
return react_1.default.createElement("div", { ref: formRef, className: (_e = params.styles) === null || _e === void 0 ? void 0 : _e.trimEnd(), id: id ? id : undefined });
|
|
79
|
-
};
|
|
80
|
-
exports.Form = Form;
|