@wix/editor-react-components 1.2878.0 → 1.2881.0

package/dist/site/components/WRichText/component.js

@@ -1,12 +1,47 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { useRef, useEffect, useMemo } from "react";
+import { createElement, useRef, useEffect, useMemo } from "react";
 import { c as clsx } from "../chunks/clsx.js";
 import { f as formatClassNames } from "../chunks/classNames.js";
 import { g as getQaDataAttributes, a as getDataAttributes } from "../chunks/dataUtils.js";
 import { a as activateBySpaceOrEnterButton, c as convertA11yKeysToHtmlFormat, g as getAccessibilityAttributesSpread } from "../chunks/a11y.js";
+import { l as libExports } from "../chunks/index.js";
 import { p as parseHtml } from "../chunks/parseHtml.js";
 import { T as TestIds } from "../chunks/constants.js";
+const HTML_TAGS = /* @__PURE__ */ new Set([
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "p",
+  "blockquote"
+]);
+const renderRichText = (html, tag) => {
+  if (!tag || !HTML_TAGS.has(tag)) {
+    return parseHtml(html);
+  }
+  let replaced = false;
+  const options = {
+    replace: (node) => {
+      var _a;
+      const isTopLevelElement = node.type === "tag" && ((_a = node.parent) == null ? void 0 : _a.type) === "root";
+      if (!isTopLevelElement) {
+        return void 0;
+      }
+      replaced = true;
+      const element = node;
+      return createElement(
+        tag,
+        libExports.attributesToProps(element.attribs),
+        libExports.domToReact(element.children, options)
+      );
+    }
+  };
+  const content = parseHtml(html, options);
+  return replaced || !html.trim() ? content : createElement(tag, null, content);
+};
 const semanticClassNames = {
   root: "rich-text"
 };
@@ -90,6 +125,7 @@ const WRichText$1 = React.forwardRef((props, ref) => {
   } = props;
   const [isInteractive, setIsInteractive] = React.useState(false);
   const { prefix, suffix } = screenReader || {};
+  const { tag, ...a11yAttributes } = a11y ?? {};
   const htmlWrapperRef = React.useRef(null);
   usePopupLinkEvents(htmlWrapperRef, [html]);
   const skinsWithContainer = [
@@ -132,7 +168,7 @@ const WRichText$1 = React.forwardRef((props, ref) => {
       "data-testid": TestIds.richTextElement,
       ...sdkEventHandlers,
       ...getAccessibilityAttributesSpread({ ariaAttributes, lang }),
-      ...convertA11yKeysToHtmlFormat(a11y ?? {}),
+      ...convertA11yKeysToHtmlFormat(a11yAttributes),
       ...getQaDataAttributes(isQaMode, fullNameCompType)
     } : {
       className: isClassNameToRootEnabled ? className : ""
@@ -167,7 +203,7 @@ const WRichText$1 = React.forwardRef((props, ref) => {
       "data-testid": TestIds.richTextElement,
       ...sdkEventHandlers,
       ...getAccessibilityAttributesSpread({ ariaAttributes, lang }),
-      ...convertA11yKeysToHtmlFormat(a11y ?? {})
+      ...convertA11yKeysToHtmlFormat(a11yAttributes)
     }
   };
   const prefixElement = prefix && /* @__PURE__ */ jsx(
@@ -184,7 +220,7 @@ const WRichText$1 = React.forwardRef((props, ref) => {
       testId: TestIds.screenReaderSuffixElement
     }
   );
-  const richTextElement = /* @__PURE__ */ jsx("div", { ...richTextAttributes, children: parseHtml(html) });
+  const richTextElement = /* @__PURE__ */ jsx("div", { ...richTextAttributes, children: renderRichText(html, tag) });
   if (isInContainer) {
     return /* @__PURE__ */ jsxs("div", { ...wrapperAttributes, children: [
       prefixElement,

package/dist/site/components/WRichText/manifest.js

@@ -69,7 +69,8 @@ const manifest = {
             DATA.A11Y_ATTRIBUTES.ariaLevel,
             DATA.A11Y_ATTRIBUTES.role,
             DATA.A11Y_ATTRIBUTES.ariaHidden,
-            DATA.A11Y_ATTRIBUTES.lang
+            DATA.A11Y_ATTRIBUTES.lang,
+            DATA.A11Y_ATTRIBUTES.tag
           ]
         }
       }

package/dist/site/components/WRichText/sdk.js

@@ -1,6 +1,6 @@
 import { c as createA11ySdk } from "../chunks/a11ySdk.js";
 import { s as sanitizeHTML } from "../chunks/sanitizeHTML.js";
-import { L as LinkUtilsDefinition } from "../chunks/index.js";
+import { L as LinkUtilsDefinition } from "../chunks/index2.js";
 import { w as wixCodeName, a as wixGuard, e as endBlockTagRegex, b as endTagRegex, s as startTagRegex } from "../chunks/constants.js";
 import { i as isNil } from "../chunks/assert.js";
 import { c as createElementPropsSDKFactory } from "../chunks/elementPropsSDKFactory.js";

package/dist/site/components/WRichText/utils/renderRichText.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+/**
+ * Renders the rich text, with every top-level element as the owner's HTML tag
+ * (the manifest's `a11y.tag`) when one is picked. Attributes and children are
+ * kept. Text-only content, as set through the SDK, is wrapped in the tag.
+ * Unsupported tags are ignored.
+ */
+export declare const renderRichText: (html: string, tag: string | undefined) => ReactNode;

package/dist/site/components/chunks/constants36.js

@@ -1,4 +1,4 @@
-const COMPONENT_TYPE = "wixEditorElements.Dropdown__DEV__v5";
+const COMPONENT_TYPE = "wixEditorElements.Dropdown__DEV__v6";
 const DesignStates = {
   input: {
     hover: { displayName: "Hover", className: "dropdown__input--hover" },