@wordpress/block-library 9.36.2-next.8fd3f8831.0 → 9.37.2-next.79a2f3cdd.0

package/build-module/media-text/media-container.mjs

@@ -0,0 +1,195 @@
+// packages/block-library/src/media-text/media-container.js
+import clsx from "clsx";
+import { ResizableBox, Spinner, Placeholder } from "@wordpress/components";
+import {
+  BlockControls,
+  BlockIcon,
+  MediaPlaceholder,
+  MediaReplaceFlow,
+  store as blockEditorStore
+} from "@wordpress/block-editor";
+import { __ } from "@wordpress/i18n";
+import { useViewportMatch } from "@wordpress/compose";
+import { useDispatch } from "@wordpress/data";
+import { forwardRef } from "@wordpress/element";
+import { isBlobURL } from "@wordpress/blob";
+import { store as noticesStore } from "@wordpress/notices";
+import { media as icon } from "@wordpress/icons";
+import { imageFillStyles } from "./image-fill.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ALLOWED_MEDIA_TYPES = ["image", "video"];
+var noop = () => {
+};
+var ResizableBoxContainer = forwardRef(
+  ({ isSelected, isStackedOnMobile, ...props }, ref) => {
+    const isMobile = useViewportMatch("small", "<");
+    return /* @__PURE__ */ jsx(
+      ResizableBox,
+      {
+        ref,
+        showHandle: isSelected && (!isMobile || !isStackedOnMobile),
+        ...props
+      }
+    );
+  }
+);
+function ToolbarEditButton({
+  mediaId,
+  mediaUrl,
+  onSelectMedia,
+  toggleUseFeaturedImage,
+  useFeaturedImage
+}) {
+  return /* @__PURE__ */ jsx(BlockControls, { group: "other", children: /* @__PURE__ */ jsx(
+    MediaReplaceFlow,
+    {
+      mediaId,
+      mediaURL: mediaUrl,
+      allowedTypes: ALLOWED_MEDIA_TYPES,
+      onSelect: onSelectMedia,
+      onToggleFeaturedImage: toggleUseFeaturedImage,
+      useFeaturedImage,
+      onReset: () => onSelectMedia(void 0)
+    }
+  ) });
+}
+function PlaceholderContainer({
+  className,
+  mediaUrl,
+  onSelectMedia,
+  toggleUseFeaturedImage
+}) {
+  const { createErrorNotice } = useDispatch(noticesStore);
+  const onUploadError = (message) => {
+    createErrorNotice(message, { type: "snackbar" });
+  };
+  return /* @__PURE__ */ jsx(
+    MediaPlaceholder,
+    {
+      icon: /* @__PURE__ */ jsx(BlockIcon, { icon }),
+      labels: {
+        title: __("Media area")
+      },
+      className,
+      onSelect: onSelectMedia,
+      onToggleFeaturedImage: toggleUseFeaturedImage,
+      allowedTypes: ALLOWED_MEDIA_TYPES,
+      onError: onUploadError,
+      disableMediaButtons: mediaUrl
+    }
+  );
+}
+function MediaContainer(props, ref) {
+  const {
+    className,
+    commitWidthChange,
+    focalPoint,
+    imageFill,
+    isSelected,
+    isStackedOnMobile,
+    mediaAlt,
+    mediaId,
+    mediaPosition,
+    mediaType,
+    mediaUrl,
+    mediaWidth,
+    onSelectMedia,
+    onWidthChange,
+    enableResize,
+    toggleUseFeaturedImage,
+    useFeaturedImage,
+    featuredImageURL,
+    featuredImageAlt,
+    refMedia
+  } = props;
+  const isTemporaryMedia = !mediaId && isBlobURL(mediaUrl);
+  const { toggleSelection } = useDispatch(blockEditorStore);
+  if (mediaUrl || featuredImageURL || useFeaturedImage) {
+    const onResizeStart = () => {
+      toggleSelection(false);
+    };
+    const onResize = (event, direction, elt) => {
+      onWidthChange(parseInt(elt.style.width));
+    };
+    const onResizeStop = (event, direction, elt) => {
+      toggleSelection(true);
+      commitWidthChange(parseInt(elt.style.width));
+    };
+    const enablePositions = {
+      right: enableResize && mediaPosition === "left",
+      left: enableResize && mediaPosition === "right"
+    };
+    const positionStyles = mediaType === "image" && imageFill ? imageFillStyles(mediaUrl || featuredImageURL, focalPoint) : {};
+    const mediaTypeRenderers = {
+      image: () => useFeaturedImage && featuredImageURL ? /* @__PURE__ */ jsx(
+        "img",
+        {
+          ref: refMedia,
+          src: featuredImageURL,
+          alt: featuredImageAlt,
+          style: positionStyles
+        }
+      ) : mediaUrl && /* @__PURE__ */ jsx(
+        "img",
+        {
+          ref: refMedia,
+          src: mediaUrl,
+          alt: mediaAlt,
+          style: positionStyles
+        }
+      ),
+      video: () => /* @__PURE__ */ jsx("video", { controls: true, ref: refMedia, src: mediaUrl })
+    };
+    return /* @__PURE__ */ jsxs(
+      ResizableBoxContainer,
+      {
+        as: "figure",
+        className: clsx(
+          className,
+          "editor-media-container__resizer",
+          { "is-transient": isTemporaryMedia }
+        ),
+        size: { width: mediaWidth + "%" },
+        minWidth: "10%",
+        maxWidth: "100%",
+        enable: enablePositions,
+        onResizeStart,
+        onResize,
+        onResizeStop,
+        axis: "x",
+        isSelected,
+        isStackedOnMobile,
+        ref,
+        children: [
+          /* @__PURE__ */ jsx(
+            ToolbarEditButton,
+            {
+              onSelectMedia,
+              mediaUrl: useFeaturedImage && featuredImageURL ? featuredImageURL : mediaUrl,
+              mediaId,
+              toggleUseFeaturedImage,
+              useFeaturedImage
+            }
+          ),
+          (mediaTypeRenderers[mediaType] || noop)(),
+          isTemporaryMedia && /* @__PURE__ */ jsx(Spinner, {}),
+          !useFeaturedImage && /* @__PURE__ */ jsx(PlaceholderContainer, { ...props }),
+          !featuredImageURL && useFeaturedImage && /* @__PURE__ */ jsx(
+            Placeholder,
+            {
+              className: "wp-block-media-text--placeholder-image",
+              style: positionStyles,
+              withIllustration: true
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(PlaceholderContainer, { ...props });
+}
+var media_container_default = forwardRef(MediaContainer);
+export {
+  media_container_default as default
+};
+//# sourceMappingURL=media-container.mjs.map

package/build-module/media-text/save.mjs

@@ -0,0 +1,100 @@
+// packages/block-library/src/media-text/save.js
+import clsx from "clsx";
+import { useInnerBlocksProps, useBlockProps } from "@wordpress/block-editor";
+import { imageFillStyles } from "./image-fill.mjs";
+import { DEFAULT_MEDIA_SIZE_SLUG } from "./constants.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_MEDIA_WIDTH = 50;
+var noop = () => {
+};
+function save({ attributes }) {
+  const {
+    isStackedOnMobile,
+    mediaAlt,
+    mediaPosition,
+    mediaType,
+    mediaUrl,
+    mediaWidth,
+    mediaId,
+    verticalAlignment,
+    imageFill,
+    focalPoint,
+    linkClass,
+    href,
+    linkTarget,
+    rel
+  } = attributes;
+  const mediaSizeSlug = attributes.mediaSizeSlug || DEFAULT_MEDIA_SIZE_SLUG;
+  const newRel = !rel ? void 0 : rel;
+  const imageClasses = clsx({
+    [`wp-image-${mediaId}`]: mediaId && mediaType === "image",
+    [`size-${mediaSizeSlug}`]: mediaId && mediaType === "image"
+  });
+  const positionStyles = imageFill ? imageFillStyles(mediaUrl, focalPoint) : {};
+  let image = mediaUrl ? /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: mediaUrl,
+      alt: mediaAlt,
+      className: imageClasses || null,
+      style: positionStyles
+    }
+  ) : null;
+  if (href) {
+    image = /* @__PURE__ */ jsx(
+      "a",
+      {
+        className: linkClass,
+        href,
+        target: linkTarget,
+        rel: newRel,
+        children: image
+      }
+    );
+  }
+  const mediaTypeRenders = {
+    image: () => image,
+    video: () => /* @__PURE__ */ jsx("video", { controls: true, src: mediaUrl })
+  };
+  const className = clsx({
+    "has-media-on-the-right": "right" === mediaPosition,
+    "is-stacked-on-mobile": isStackedOnMobile,
+    [`is-vertically-aligned-${verticalAlignment}`]: verticalAlignment,
+    "is-image-fill-element": imageFill
+  });
+  let gridTemplateColumns;
+  if (mediaWidth !== DEFAULT_MEDIA_WIDTH) {
+    gridTemplateColumns = "right" === mediaPosition ? `auto ${mediaWidth}%` : `${mediaWidth}% auto`;
+  }
+  const style = {
+    gridTemplateColumns
+  };
+  if ("right" === mediaPosition) {
+    return /* @__PURE__ */ jsxs("div", { ...useBlockProps.save({ className, style }), children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ...useInnerBlocksProps.save({
+            className: "wp-block-media-text__content"
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx("figure", { className: "wp-block-media-text__media", children: (mediaTypeRenders[mediaType] || noop)() })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { ...useBlockProps.save({ className, style }), children: [
+    /* @__PURE__ */ jsx("figure", { className: "wp-block-media-text__media", children: (mediaTypeRenders[mediaType] || noop)() }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...useInnerBlocksProps.save({
+          className: "wp-block-media-text__content"
+        })
+      }
+    )
+  ] });
+}
+export {
+  save as default
+};
+//# sourceMappingURL=save.mjs.map

package/build-module/media-text/transforms.mjs

@@ -0,0 +1,176 @@
+// packages/block-library/src/media-text/transforms.js
+import { createBlock } from "@wordpress/blocks";
+var transforms = {
+  from: [
+    {
+      type: "block",
+      blocks: ["core/image"],
+      transform: ({ alt, url, id, anchor }) => createBlock("core/media-text", {
+        mediaAlt: alt,
+        mediaId: id,
+        mediaUrl: url,
+        mediaType: "image",
+        anchor
+      })
+    },
+    {
+      type: "block",
+      blocks: ["core/video"],
+      transform: ({ src, id, anchor }) => createBlock("core/media-text", {
+        mediaId: id,
+        mediaUrl: src,
+        mediaType: "video",
+        anchor
+      })
+    },
+    {
+      type: "block",
+      blocks: ["core/cover"],
+      transform: ({
+        align,
+        alt,
+        anchor,
+        backgroundType,
+        customGradient,
+        customOverlayColor,
+        gradient,
+        id,
+        overlayColor,
+        style,
+        textColor,
+        url,
+        useFeaturedImage
+      }, innerBlocks) => {
+        let additionalAttributes = {};
+        if (customGradient) {
+          additionalAttributes = {
+            style: {
+              color: {
+                gradient: customGradient
+              }
+            }
+          };
+        } else if (customOverlayColor) {
+          additionalAttributes = {
+            style: {
+              color: {
+                background: customOverlayColor
+              }
+            }
+          };
+        }
+        if (style?.color?.text) {
+          additionalAttributes.style = {
+            color: {
+              ...additionalAttributes.style?.color,
+              text: style.color.text
+            }
+          };
+        }
+        return createBlock(
+          "core/media-text",
+          {
+            align,
+            anchor,
+            backgroundColor: overlayColor,
+            gradient,
+            mediaAlt: alt,
+            mediaId: id,
+            mediaType: backgroundType,
+            mediaUrl: url,
+            textColor,
+            useFeaturedImage,
+            ...additionalAttributes
+          },
+          innerBlocks
+        );
+      }
+    }
+  ],
+  to: [
+    {
+      type: "block",
+      blocks: ["core/image"],
+      isMatch: ({ mediaType, mediaUrl }) => {
+        return !mediaUrl || mediaType === "image";
+      },
+      transform: ({ mediaAlt, mediaId, mediaUrl, anchor }) => {
+        return createBlock("core/image", {
+          alt: mediaAlt,
+          id: mediaId,
+          url: mediaUrl,
+          anchor
+        });
+      }
+    },
+    {
+      type: "block",
+      blocks: ["core/video"],
+      isMatch: ({ mediaType, mediaUrl }) => {
+        return !mediaUrl || mediaType === "video";
+      },
+      transform: ({ mediaId, mediaUrl, anchor }) => {
+        return createBlock("core/video", {
+          id: mediaId,
+          src: mediaUrl,
+          anchor
+        });
+      }
+    },
+    {
+      type: "block",
+      blocks: ["core/cover"],
+      transform: ({
+        align,
+        anchor,
+        backgroundColor,
+        focalPoint,
+        gradient,
+        mediaAlt,
+        mediaId,
+        mediaType,
+        mediaUrl,
+        style,
+        textColor,
+        useFeaturedImage
+      }, innerBlocks) => {
+        const additionalAttributes = {};
+        if (style?.color?.gradient) {
+          additionalAttributes.customGradient = style.color.gradient;
+        } else if (style?.color?.background) {
+          additionalAttributes.customOverlayColor = style.color.background;
+        }
+        if (style?.color?.text) {
+          additionalAttributes.style = {
+            color: { text: style.color.text }
+          };
+        }
+        const coverAttributes = {
+          align,
+          alt: mediaAlt,
+          anchor,
+          backgroundType: mediaType,
+          dimRatio: !!mediaUrl || useFeaturedImage ? 50 : 100,
+          focalPoint,
+          gradient,
+          id: mediaId,
+          overlayColor: backgroundColor,
+          textColor,
+          url: mediaUrl,
+          useFeaturedImage,
+          ...additionalAttributes
+        };
+        return createBlock(
+          "core/cover",
+          coverAttributes,
+          innerBlocks
+        );
+      }
+    }
+  ]
+};
+var transforms_default = transforms;
+export {
+  transforms_default as default
+};
+//# sourceMappingURL=transforms.mjs.map

package/build-module/missing/edit.mjs

@@ -0,0 +1,91 @@
+// packages/block-library/src/missing/edit.js
+import { __, sprintf } from "@wordpress/i18n";
+import { RawHTML } from "@wordpress/element";
+import { Button } from "@wordpress/components";
+import { createBlock } from "@wordpress/blocks";
+import { useDispatch, useSelect } from "@wordpress/data";
+import {
+  Warning,
+  useBlockProps,
+  store as blockEditorStore
+} from "@wordpress/block-editor";
+import { safeHTML } from "@wordpress/dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+function MissingEdit({ attributes, clientId }) {
+  const { originalName, originalUndelimitedContent } = attributes;
+  const hasContent = !!originalUndelimitedContent;
+  const { hasFreeformBlock, hasHTMLBlock } = useSelect(
+    (select) => {
+      const { canInsertBlockType, getBlockRootClientId } = select(blockEditorStore);
+      return {
+        hasFreeformBlock: canInsertBlockType(
+          "core/freeform",
+          getBlockRootClientId(clientId)
+        ),
+        hasHTMLBlock: canInsertBlockType(
+          "core/html",
+          getBlockRootClientId(clientId)
+        )
+      };
+    },
+    [clientId]
+  );
+  const { replaceBlock } = useDispatch(blockEditorStore);
+  function convertToHTML() {
+    replaceBlock(
+      clientId,
+      createBlock("core/html", {
+        content: originalUndelimitedContent
+      })
+    );
+  }
+  const actions = [];
+  let messageHTML;
+  const convertToHtmlButton = /* @__PURE__ */ jsx(
+    Button,
+    {
+      __next40pxDefaultSize: true,
+      onClick: convertToHTML,
+      variant: "primary",
+      children: __("Keep as HTML")
+    },
+    "convert"
+  );
+  if (hasContent && !hasFreeformBlock && (!originalName || originalName === "core/freeform")) {
+    if (hasHTMLBlock) {
+      messageHTML = __(
+        "It appears you are trying to use the deprecated Classic block. You can leave this block intact, convert its content to a Custom HTML block, or remove it entirely. Alternatively, if you have unsaved changes, you can save them and refresh to use the Classic block."
+      );
+      actions.push(convertToHtmlButton);
+    } else {
+      messageHTML = __(
+        "It appears you are trying to use the deprecated Classic block. You can leave this block intact, or remove it entirely. Alternatively, if you have unsaved changes, you can save them and refresh to use the Classic block."
+      );
+    }
+  } else if (hasContent && hasHTMLBlock) {
+    messageHTML = sprintf(
+      /* translators: %s: block name */
+      __(
+        'Your site doesn\u2019t include support for the "%s" block. You can leave it as-is, convert it to custom HTML, or remove it.'
+      ),
+      originalName
+    );
+    actions.push(convertToHtmlButton);
+  } else {
+    messageHTML = sprintf(
+      /* translators: %s: block name */
+      __(
+        'Your site doesn\u2019t include support for the "%s" block. You can leave it as-is or remove it.'
+      ),
+      originalName
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { ...useBlockProps({ className: "has-warning" }), children: [
+    /* @__PURE__ */ jsx(Warning, { actions, children: messageHTML }),
+    /* @__PURE__ */ jsx(RawHTML, { children: safeHTML(originalUndelimitedContent) })
+  ] });
+}
+export {
+  MissingEdit as default
+};
+//# sourceMappingURL=edit.mjs.map

package/build-module/missing/index.mjs

@@ -0,0 +1,30 @@
+// packages/block-library/src/missing/index.js
+import { getBlockType } from "@wordpress/blocks";
+import initBlock from "../utils/init-block.mjs";
+import edit from "./edit.mjs";
+import metadata from "./block.json";
+import save from "./save.mjs";
+var { name } = metadata;
+var settings = {
+  name,
+  __experimentalLabel(attributes, { context }) {
+    if (context === "accessibility") {
+      const { originalName } = attributes;
+      const originalBlockType = originalName ? getBlockType(originalName) : void 0;
+      if (originalBlockType) {
+        return originalBlockType.settings.title || originalName;
+      }
+      return "";
+    }
+  },
+  edit,
+  save
+};
+var init = () => initBlock({ name, metadata, settings });
+export {
+  init,
+  metadata,
+  name,
+  settings
+};
+//# sourceMappingURL=index.mjs.map

package/build-module/missing/init.mjs

@@ -0,0 +1,7 @@
+// packages/block-library/src/missing/init.js
+import { init } from "./index.mjs";
+var init_default = init();
+export {
+  init_default as default
+};
+//# sourceMappingURL=init.mjs.map

package/build-module/missing/save.mjs

@@ -0,0 +1,10 @@
+// packages/block-library/src/missing/save.js
+import { RawHTML } from "@wordpress/element";
+import { jsx } from "react/jsx-runtime";
+function save({ attributes }) {
+  return /* @__PURE__ */ jsx(RawHTML, { children: attributes.originalContent });
+}
+export {
+  save as default
+};
+//# sourceMappingURL=save.mjs.map

package/build-module/more/edit.mjs

@@ -0,0 +1,76 @@
+// packages/block-library/src/more/edit.js
+import { __ } from "@wordpress/i18n";
+import {
+  __experimentalToolsPanel as ToolsPanel,
+  __experimentalToolsPanelItem as ToolsPanelItem,
+  ToggleControl
+} from "@wordpress/components";
+import {
+  InspectorControls,
+  PlainText,
+  useBlockProps
+} from "@wordpress/block-editor";
+import { getDefaultBlockName, createBlock } from "@wordpress/blocks";
+import { useToolsPanelDropdownMenuProps } from "../utils/hooks.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_TEXT = __("Read more");
+function MoreEdit({
+  attributes: { customText, noTeaser },
+  insertBlocksAfter,
+  setAttributes
+}) {
+  const dropdownMenuProps = useToolsPanelDropdownMenuProps();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsx(
+      ToolsPanel,
+      {
+        label: __("Settings"),
+        resetAll: () => {
+          setAttributes({
+            noTeaser: false
+          });
+        },
+        dropdownMenuProps,
+        children: /* @__PURE__ */ jsx(
+          ToolsPanelItem,
+          {
+            label: __("Hide excerpt"),
+            isShownByDefault: true,
+            hasValue: () => noTeaser,
+            onDeselect: () => setAttributes({ noTeaser: false }),
+            children: /* @__PURE__ */ jsx(
+              ToggleControl,
+              {
+                label: __(
+                  "Hide the excerpt on the full content page"
+                ),
+                checked: !!noTeaser,
+                onChange: () => setAttributes({ noTeaser: !noTeaser }),
+                help: (checked) => checked ? __("The excerpt is hidden.") : __("The excerpt is visible.")
+              }
+            )
+          }
+        )
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { ...useBlockProps(), children: /* @__PURE__ */ jsx(
+      PlainText,
+      {
+        __experimentalVersion: 2,
+        tagName: "span",
+        "aria-label": __('"Read more" text'),
+        value: customText,
+        placeholder: DEFAULT_TEXT,
+        onChange: (value) => setAttributes({ customText: value }),
+        disableLineBreaks: true,
+        __unstableOnSplitAtEnd: () => insertBlocksAfter(
+          createBlock(getDefaultBlockName())
+        )
+      }
+    ) })
+  ] });
+}
+export {
+  MoreEdit as default
+};
+//# sourceMappingURL=edit.mjs.map