@sitecore-content-sdk/react 1.3.0-canary.9 → 1.4.0-canary.2

package/dist/cjs/components/Form.js

@@ -1,92 +1,100 @@
-"use strict";
-'use client';
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Form = exports.mockFormModule = void 0;
-const react_1 = __importStar(require("react"));
-const core_1 = require("@sitecore-content-sdk/core");
-const withSitecore_1 = require("../enhancers/withSitecore");
-let { executeScriptElements, loadForm, subscribeToFormSubmitEvent } = core_1.form;
-/**
- * Mock function to replace the form module functions for `testing` purposes.
- * @param {any} formModule - The form module to mock
- */
-const mockFormModule = (formModule) => {
-    executeScriptElements = formModule.executeScriptElements;
-    loadForm = formModule.loadForm;
-    subscribeToFormSubmitEvent = formModule.subscribeToFormSubmitEvent;
-};
-exports.mockFormModule = mockFormModule;
-const Form = ({ params, rendering }) => {
-    var _a;
-    const id = params === null || params === void 0 ? void 0 : params.RenderingIdentifier;
-    const [error, setError] = (0, react_1.useState)(false);
-    const [content, setContent] = (0, react_1.useState)('');
-    const context = (0, withSitecore_1.useSitecore)();
-    const formRef = (0, react_1.useRef)(null);
-    const isEditing = context.page.mode.isEditing;
-    (0, react_1.useEffect)(() => {
-        var _a, _b, _c, _d;
-        if (!content) {
-            // Forms must use clientContextId since they are rendered client-side
-            const edgeId = (_b = (_a = context.api) === null || _a === void 0 ? void 0 : _a.edge) === null || _b === void 0 ? void 0 : _b.clientContextId;
-            if (!edgeId) {
-                /* eslint-disable no-console */
-                console.warn('Warning: clientContextId is missing – form cannot be loaded properly on the client');
-                return;
-            }
-            loadForm(edgeId, params.FormId, (_d = (_c = context.api) === null || _c === void 0 ? void 0 : _c.edge) === null || _d === void 0 ? void 0 : _d.edgeUrl)
-                .then(setContent)
-                .catch(() => {
-                if (isEditing) {
-                    console.error(`Failed to load form with id ${params.FormId}. Check debug logs for content-sdk:form for more details.`);
-                }
-                setError(true);
-            });
-        }
-        else {
-            // If we are in editing mode, we don't want to send any events
-            if (!isEditing) {
-                subscribeToFormSubmitEvent(formRef.current, rendering.uid);
-            }
-            executeScriptElements(formRef.current);
-        }
-    }, [content]);
-    if (isEditing && error) {
-        return (react_1.default.createElement("div", { className: "sc-content-sdk-placeholder-error" }, "There was a problem loading this section"));
-    }
-    return (react_1.default.createElement("div", { ref: formRef, dangerouslySetInnerHTML: { __html: content }, className: (_a = params.styles) === null || _a === void 0 ? void 0 : _a.trimEnd(), id: id ? id : undefined }));
-};
-exports.Form = Form;
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Form = exports.mockFormModule = void 0;
+const react_1 = __importStar(require("react"));
+const core_1 = require("@sitecore-content-sdk/core");
+const withSitecore_1 = require("../enhancers/withSitecore");
+const ErrorBoundary_1 = require("./ErrorBoundary");
+let { executeScriptElements, loadForm, subscribeToFormSubmitEvent } = core_1.form;
+/**
+ * Mock function to replace the form module functions for `testing` purposes.
+ * @param {any} formModule - The form module to mock
+ */
+const mockFormModule = (formModule) => {
+    executeScriptElements = formModule.executeScriptElements;
+    loadForm = formModule.loadForm;
+    subscribeToFormSubmitEvent = formModule.subscribeToFormSubmitEvent;
+};
+exports.mockFormModule = mockFormModule;
+/**
+ * The Form component.
+ * @param {FormProps} props incoming props
+ * @public
+ */
+const Form = ({ params, rendering }) => {
+    var _a;
+    const id = params === null || params === void 0 ? void 0 : params.RenderingIdentifier;
+    const [error, setError] = (0, react_1.useState)(false);
+    const [content, setContent] = (0, react_1.useState)('');
+    const context = (0, withSitecore_1.useSitecore)();
+    const formRef = (0, react_1.useRef)(null);
+    const isEditing = context.page.mode.isEditing;
+    (0, react_1.useEffect)(() => {
+        var _a, _b, _c, _d;
+        if (!content) {
+            // Forms must use clientContextId since they are rendered client-side
+            const edgeId = (_b = (_a = context.api) === null || _a === void 0 ? void 0 : _a.edge) === null || _b === void 0 ? void 0 : _b.clientContextId;
+            if (!edgeId) {
+                /* eslint-disable no-console */
+                console.warn('Warning: clientContextId is missing – form cannot be loaded properly on the client');
+                return;
+            }
+            loadForm(edgeId, params.FormId, (_d = (_c = context.api) === null || _c === void 0 ? void 0 : _c.edge) === null || _d === void 0 ? void 0 : _d.edgeUrl)
+                .then(setContent)
+                .catch(() => {
+                if (isEditing) {
+                    console.error(`Failed to load form with id ${params.FormId}. Check debug logs for content-sdk:form for more details.`);
+                }
+                setError(true);
+            });
+        }
+        else {
+            if (!formRef.current)
+                return;
+            // If we are in editing mode, we don't want to send any events
+            if (!isEditing) {
+                subscribeToFormSubmitEvent(formRef.current, rendering.uid);
+            }
+            executeScriptElements(formRef.current);
+        }
+    }, [content]);
+    if (isEditing && error) {
+        return react_1.default.createElement(ErrorBoundary_1.ErrorComponent, { message: "There was a problem loading this section" });
+    }
+    return (react_1.default.createElement("div", { ref: formRef, dangerouslySetInnerHTML: { __html: content }, className: (_a = params.styles) === null || _a === void 0 ? void 0 : _a.trimEnd(), id: id ? id : undefined }));
+};
+exports.Form = Form;

package/dist/cjs/components/HiddenRendering.js

@@ -1,23 +1,23 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HiddenRendering = void 0;
-const react_1 = __importDefault(require("react"));
-const baseStyles = {
-    backgroundSize: '3px 3px',
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    padding: '30px',
-    color: '#aaa',
-};
-const backgroundImageStyle = {
-    backgroundImage: 'linear-gradient(45deg, #ffffff 25%, #dcdcdc 25%, #dcdcdc 50%, #ffffff 50%, #ffffff 75%, #dcdcdc 75%, #dcdcdc 100%)',
-};
-const HiddenRendering = () => {
-    const styles = process.env.NODE_ENV === 'test' ? baseStyles : Object.assign(Object.assign({}, baseStyles), backgroundImageStyle);
-    return react_1.default.createElement("div", { style: styles }, "The component is hidden");
-};
-exports.HiddenRendering = HiddenRendering;
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HiddenRendering = void 0;
+const react_1 = __importDefault(require("react"));
+const baseStyles = {
+    backgroundSize: '3px 3px',
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: '30px',
+    color: '#aaa',
+};
+const backgroundImageStyle = {
+    backgroundImage: 'linear-gradient(45deg, #ffffff 25%, #dcdcdc 25%, #dcdcdc 50%, #ffffff 50%, #ffffff 75%, #dcdcdc 75%, #dcdcdc 100%)',
+};
+const HiddenRendering = () => {
+    const styles = process.env.NODE_ENV === 'test' ? baseStyles : Object.assign(Object.assign({}, baseStyles), backgroundImageStyle);
+    return react_1.default.createElement("div", { style: styles }, "The component is hidden");
+};
+exports.HiddenRendering = HiddenRendering;

package/dist/cjs/components/Image.js

@@ -1,66 +1,71 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Image = void 0;
-/* eslint-disable no-unused-vars */
-const media_1 = require("@sitecore-content-sdk/core/media");
-const react_1 = __importDefault(require("react"));
-const utils_1 = require("../utils");
-const withFieldMetadata_1 = require("../enhancers/withFieldMetadata");
-const withEmptyFieldEditingComponent_1 = require("../enhancers/withEmptyFieldEditingComponent");
-const DefaultEmptyFieldEditingComponents_1 = require("./DefaultEmptyFieldEditingComponents");
-const layout_1 = require("@sitecore-content-sdk/core/layout");
-const getImageAttrs = (_a, imageParams, mediaUrlPrefix) => {
-    var { src, srcSet } = _a, otherAttrs = __rest(_a, ["src", "srcSet"]);
-    if (!src) {
-        return null;
-    }
-    (0, utils_1.addClassName)(otherAttrs);
-    const newAttrs = Object.assign({}, otherAttrs);
-    // update image URL for content sdk handler and image rendering params
-    const resolvedSrc = media_1.mediaApi.updateImageUrl(src, imageParams, mediaUrlPrefix);
-    if (srcSet) {
-        // replace with HTML-formatted srcset, including updated image URLs
-        newAttrs.srcSet = media_1.mediaApi.getSrcSet(resolvedSrc, srcSet, imageParams, mediaUrlPrefix);
-    }
-    // always output original src as fallback for older browsers
-    newAttrs.src = resolvedSrc;
-    return newAttrs;
-};
-exports.Image = (0, withFieldMetadata_1.withFieldMetadata)((0, withEmptyFieldEditingComponent_1.withEmptyFieldEditingComponent)((_a) => {
-    var { editable = true, imageParams, field, mediaUrlPrefix } = _a, otherProps = __rest(_a, ["editable", "imageParams", "field", "mediaUrlPrefix"]);
-    const dynamicMedia = field;
-    if ((0, layout_1.isFieldValueEmpty)(dynamicMedia)) {
-        return null;
-    }
-    // some wise-guy/gal is passing in a 'raw' image object value
-    const img = dynamicMedia.src
-        ? field
-        : dynamicMedia.value;
-    if (!img) {
-        return null;
-    }
-    // prevent metadata from being passed to the img tag
-    if (img.metadata) {
-        delete img.metadata;
-    }
-    const attrs = getImageAttrs(Object.assign(Object.assign({}, img), otherProps), imageParams, mediaUrlPrefix);
-    if (attrs) {
-        return react_1.default.createElement("img", Object.assign({}, attrs));
-    }
-    return null; // we can't handle the truth
-}, { defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponents_1.DefaultEmptyFieldEditingComponentImage }));
-exports.Image.displayName = 'Image';
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Image = void 0;
+/* eslint-disable no-unused-vars */
+const media_1 = require("@sitecore-content-sdk/core/media");
+const react_1 = __importDefault(require("react"));
+const utils_1 = require("../utils");
+const withFieldMetadata_1 = require("../enhancers/withFieldMetadata");
+const withEmptyFieldEditingComponent_1 = require("../enhancers/withEmptyFieldEditingComponent");
+const DefaultEmptyFieldEditingComponents_1 = require("./DefaultEmptyFieldEditingComponents");
+const layout_1 = require("@sitecore-content-sdk/core/layout");
+const getImageAttrs = (_a, imageParams, mediaUrlPrefix) => {
+    var { src, srcSet } = _a, otherAttrs = __rest(_a, ["src", "srcSet"]);
+    if (!src) {
+        return null;
+    }
+    (0, utils_1.addClassName)(otherAttrs);
+    const newAttrs = Object.assign({}, otherAttrs);
+    // update image URL for content sdk handler and image rendering params
+    const resolvedSrc = media_1.mediaApi.updateImageUrl(src, imageParams, mediaUrlPrefix);
+    if (srcSet) {
+        // replace with HTML-formatted srcset, including updated image URLs
+        newAttrs.srcSet = media_1.mediaApi.getSrcSet(resolvedSrc, srcSet, imageParams, mediaUrlPrefix);
+    }
+    // always output original src as fallback for older browsers
+    newAttrs.src = resolvedSrc;
+    return newAttrs;
+};
+/**
+ * The Image component.
+ * @param {ImageProps} props component props
+ * @public
+ */
+exports.Image = (0, withFieldMetadata_1.withFieldMetadata)((0, withEmptyFieldEditingComponent_1.withEmptyFieldEditingComponent)((_a) => {
+    var { editable = true, imageParams, field, mediaUrlPrefix } = _a, otherProps = __rest(_a, ["editable", "imageParams", "field", "mediaUrlPrefix"]);
+    const dynamicMedia = field;
+    if ((0, layout_1.isFieldValueEmpty)(dynamicMedia)) {
+        return null;
+    }
+    // some wise-guy/gal is passing in a 'raw' image object value
+    const img = dynamicMedia.src
+        ? field
+        : dynamicMedia.value;
+    if (!img) {
+        return null;
+    }
+    // prevent metadata from being passed to the img tag
+    if (img.metadata) {
+        delete img.metadata;
+    }
+    const attrs = getImageAttrs(Object.assign(Object.assign({}, img), otherProps), imageParams, mediaUrlPrefix);
+    if (attrs) {
+        return react_1.default.createElement("img", Object.assign({}, attrs));
+    }
+    return null; // we can't handle the truth
+}, { defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponents_1.DefaultEmptyFieldEditingComponentImage }));
+exports.Image.displayName = 'Image';

package/dist/cjs/components/Link.js

@@ -1,86 +1,91 @@
-"use strict";
-'use client';
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Link = void 0;
-const react_1 = __importStar(require("react"));
-const layout_1 = require("@sitecore-content-sdk/core/layout");
-const withFieldMetadata_1 = require("../enhancers/withFieldMetadata");
-const withEmptyFieldEditingComponent_1 = require("../enhancers/withEmptyFieldEditingComponent");
-const DefaultEmptyFieldEditingComponents_1 = require("./DefaultEmptyFieldEditingComponents");
-exports.Link = (0, withFieldMetadata_1.withFieldMetadata)((0, withEmptyFieldEditingComponent_1.withEmptyFieldEditingComponent)((0, react_1.forwardRef)(
-// eslint-disable-next-line no-unused-vars
-(_a, ref) => {
-    var { field, editable = true, showLinkTextWithChildrenPresent } = _a, otherProps = __rest(_a, ["field", "editable", "showLinkTextWithChildrenPresent"]);
-    const children = otherProps.children;
-    const dynamicField = field;
-    if ((0, layout_1.isFieldValueEmpty)(dynamicField)) {
-        return null;
-    }
-    // handle link directly on field for forgetful devs
-    const link = dynamicField.href
-        ? field
-        : dynamicField.value;
-    if (!link) {
-        return null;
-    }
-    const anchor = link.linktype !== 'anchor' && link.anchor ? `#${link.anchor}` : '';
-    const querystring = link.querystring ? `?${link.querystring}` : '';
-    const anchorAttrs = {
-        href: `${link.href}${querystring}${anchor}`,
-        className: link.class,
-        title: link.title,
-        target: link.target,
-    };
-    if (anchorAttrs.target === '_blank' && !anchorAttrs.rel) {
-        // information disclosure attack prevention keeps target blank site from getting ref to window.opener
-        anchorAttrs.rel = 'noopener noreferrer';
-    }
-    const linkText = showLinkTextWithChildrenPresent || !children ? link.text || link.href : null;
-    const element = react_1.default.createElement('a', Object.assign(Object.assign(Object.assign({}, anchorAttrs), otherProps), { key: 'link', ref }), linkText, children);
-    return react_1.default.createElement(react_1.default.Fragment, null, element);
-}), { defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponents_1.DefaultEmptyFieldEditingComponentText, isForwardRef: true }), true);
-exports.Link.displayName = 'Link';
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = void 0;
+const react_1 = __importStar(require("react"));
+const layout_1 = require("@sitecore-content-sdk/core/layout");
+const withFieldMetadata_1 = require("../enhancers/withFieldMetadata");
+const withEmptyFieldEditingComponent_1 = require("../enhancers/withEmptyFieldEditingComponent");
+const DefaultEmptyFieldEditingComponents_1 = require("./DefaultEmptyFieldEditingComponents");
+/**
+ * The Link component.
+ * @param {LinkProps} props component props
+ * @public
+ */
+exports.Link = (0, withFieldMetadata_1.withFieldMetadata)((0, withEmptyFieldEditingComponent_1.withEmptyFieldEditingComponent)((0, react_1.forwardRef)(
+// eslint-disable-next-line no-unused-vars
+(_a, ref) => {
+    var { field, editable = true, showLinkTextWithChildrenPresent } = _a, otherProps = __rest(_a, ["field", "editable", "showLinkTextWithChildrenPresent"]);
+    const children = otherProps.children;
+    const dynamicField = field;
+    if ((0, layout_1.isFieldValueEmpty)(dynamicField)) {
+        return null;
+    }
+    // handle link directly on field for forgetful devs
+    const link = dynamicField.href
+        ? field
+        : dynamicField.value;
+    if (!link) {
+        return null;
+    }
+    const anchor = link.linktype !== 'anchor' && link.anchor ? `#${link.anchor}` : '';
+    const querystring = link.querystring ? `?${link.querystring}` : '';
+    const anchorAttrs = {
+        href: `${link.href}${querystring}${anchor}`,
+        className: link.class,
+        title: link.title,
+        target: link.target,
+    };
+    if (anchorAttrs.target === '_blank' && !anchorAttrs.rel) {
+        // information disclosure attack prevention keeps target blank site from getting ref to window.opener
+        anchorAttrs.rel = 'noopener noreferrer';
+    }
+    const linkText = showLinkTextWithChildrenPresent || !children ? link.text || link.href : null;
+    const element = react_1.default.createElement('a', Object.assign(Object.assign(Object.assign({}, anchorAttrs), otherProps), { key: 'link', ref }), linkText, children);
+    return react_1.default.createElement(react_1.default.Fragment, null, element);
+}), { defaultEmptyFieldEditingComponent: DefaultEmptyFieldEditingComponents_1.DefaultEmptyFieldEditingComponentText, isForwardRef: true }), true);
+exports.Link.displayName = 'Link';

package/dist/cjs/components/MissingComponent.js

@@ -1,28 +1,28 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MissingComponent = void 0;
-const react_1 = __importDefault(require("react"));
-const MissingComponent = (props) => {
-    const componentName = props.rendering && props.rendering.componentName
-        ? props.rendering.componentName
-        : 'Unnamed Component';
-    // error override would mean component is not unimplemented
-    !props.errorOverride &&
-        console.log(`Component props for unimplemented '${componentName}' component`, props);
-    const errorMessage = props.errorOverride ||
-        'Content SDK component is missing React implementation. See the developer console for more information.';
-    return (react_1.default.createElement("div", { style: {
-            background: 'darkorange',
-            outline: '5px solid orange',
-            padding: '10px',
-            color: 'white',
-            maxWidth: '500px',
-        } },
-        react_1.default.createElement("h2", null, componentName),
-        react_1.default.createElement("p", null, errorMessage)));
-};
-exports.MissingComponent = MissingComponent;
-exports.MissingComponent.displayName = 'MissingComponent';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MissingComponent = void 0;
+const react_1 = __importDefault(require("react"));
+const MissingComponent = (props) => {
+    const componentName = props.rendering && props.rendering.componentName
+        ? props.rendering.componentName
+        : 'Unnamed Component';
+    // error override would mean component is not unimplemented
+    !props.errorOverride &&
+        console.log(`Component props for unimplemented '${componentName}' component`, props);
+    const errorMessage = props.errorOverride ||
+        'Content SDK component is missing React implementation. See the developer console for more information.';
+    return (react_1.default.createElement("div", { style: {
+            background: 'darkorange',
+            outline: '5px solid orange',
+            padding: '10px',
+            color: 'white',
+            maxWidth: '500px',
+        } },
+        react_1.default.createElement("h2", null, componentName),
+        react_1.default.createElement("p", null, errorMessage)));
+};
+exports.MissingComponent = MissingComponent;
+exports.MissingComponent.displayName = 'MissingComponent';