[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

/wp-includes/js/dist/ -> server-side-render.js (source)

   1  "use strict";
   2  var wp;
   3  (wp ||= {}).serverSideRender = (() => {
   4    var __create = Object.create;
   5    var __defProp = Object.defineProperty;
   6    var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
   7    var __getOwnPropNames = Object.getOwnPropertyNames;
   8    var __getProtoOf = Object.getPrototypeOf;
   9    var __hasOwnProp = Object.prototype.hasOwnProperty;
  10    var __commonJS = (cb, mod) => function __require() {
  11      return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
  12    };
  13    var __export = (target, all) => {
  14      for (var name in all)
  15        __defProp(target, name, { get: all[name], enumerable: true });
  16    };
  17    var __copyProps = (to, from, except, desc) => {
  18      if (from && typeof from === "object" || typeof from === "function") {
  19        for (let key of __getOwnPropNames(from))
  20          if (!__hasOwnProp.call(to, key) && key !== except)
  21            __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  22      }
  23      return to;
  24    };
  25    var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  26      // If the importer is in node compatibility mode or this is not an ESM
  27      // file that has been converted to a CommonJS file using a Babel-
  28      // compatible transform (i.e. "__esModule" has not been set), then set
  29      // "default" to the CommonJS "module.exports" for node compatibility.
  30      isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  31      mod
  32    ));
  33    var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  34  
  35    // package-external:@wordpress/element
  36    var require_element = __commonJS({
  37      "package-external:@wordpress/element"(exports, module) {
  38        module.exports = window.wp.element;
  39      }
  40    });
  41  
  42    // package-external:@wordpress/i18n
  43    var require_i18n = __commonJS({
  44      "package-external:@wordpress/i18n"(exports, module) {
  45        module.exports = window.wp.i18n;
  46      }
  47    });
  48  
  49    // package-external:@wordpress/components
  50    var require_components = __commonJS({
  51      "package-external:@wordpress/components"(exports, module) {
  52        module.exports = window.wp.components;
  53      }
  54    });
  55  
  56    // package-external:@wordpress/data
  57    var require_data = __commonJS({
  58      "package-external:@wordpress/data"(exports, module) {
  59        module.exports = window.wp.data;
  60      }
  61    });
  62  
  63    // package-external:@wordpress/compose
  64    var require_compose = __commonJS({
  65      "package-external:@wordpress/compose"(exports, module) {
  66        module.exports = window.wp.compose;
  67      }
  68    });
  69  
  70    // package-external:@wordpress/api-fetch
  71    var require_api_fetch = __commonJS({
  72      "package-external:@wordpress/api-fetch"(exports, module) {
  73        module.exports = window.wp.apiFetch;
  74      }
  75    });
  76  
  77    // package-external:@wordpress/url
  78    var require_url = __commonJS({
  79      "package-external:@wordpress/url"(exports, module) {
  80        module.exports = window.wp.url;
  81      }
  82    });
  83  
  84    // package-external:@wordpress/blocks
  85    var require_blocks = __commonJS({
  86      "package-external:@wordpress/blocks"(exports, module) {
  87        module.exports = window.wp.blocks;
  88      }
  89    });
  90  
  91    // vendor-external:react/jsx-runtime
  92    var require_jsx_runtime = __commonJS({
  93      "vendor-external:react/jsx-runtime"(exports, module) {
  94        module.exports = window.ReactJSXRuntime;
  95      }
  96    });
  97  
  98    // packages/server-side-render/build-module/index.mjs
  99    var index_exports = {};
 100    __export(index_exports, {
 101      ServerSideRender: () => ServerSideRenderWithPostId,
 102      default: () => index_default,
 103      useServerSideRender: () => useServerSideRender
 104    });
 105  
 106    // packages/server-side-render/build-module/server-side-render.mjs
 107    var import_element2 = __toESM(require_element(), 1);
 108    var import_i18n = __toESM(require_i18n(), 1);
 109    var import_components = __toESM(require_components(), 1);
 110    var import_data = __toESM(require_data(), 1);
 111  
 112    // packages/server-side-render/build-module/hook.mjs
 113    var import_compose = __toESM(require_compose(), 1);
 114    var import_element = __toESM(require_element(), 1);
 115    var import_api_fetch = __toESM(require_api_fetch(), 1);
 116    var import_url = __toESM(require_url(), 1);
 117    var import_blocks = __toESM(require_blocks(), 1);
 118    function rendererPath(block, attributes = null, urlQueryArgs = {}) {
 119      return (0, import_url.addQueryArgs)(`/wp/v2/block-renderer/$block}`, {
 120        context: "edit",
 121        ...null !== attributes ? { attributes } : {},
 122        ...urlQueryArgs
 123      });
 124    }
 125    function removeBlockSupportAttributes(attributes) {
 126      const {
 127        backgroundColor,
 128        borderColor,
 129        fontFamily,
 130        fontSize,
 131        gradient,
 132        textColor,
 133        className,
 134        ...restAttributes
 135      } = attributes;
 136      const {
 137        border,
 138        color,
 139        elements,
 140        shadow,
 141        spacing,
 142        typography,
 143        ...restStyles
 144      } = attributes?.style || {};
 145      return {
 146        ...restAttributes,
 147        style: restStyles
 148      };
 149    }
 150    function useServerSideRender(args) {
 151      const [response, setResponse] = (0, import_element.useState)({
 152        status: "idle"
 153      });
 154      const shouldDebounceRef = (0, import_element.useRef)(false);
 155      const {
 156        attributes,
 157        block,
 158        skipBlockSupportAttributes = false,
 159        httpMethod = "GET",
 160        urlQueryArgs
 161      } = args;
 162      let sanitizedAttributes = attributes && (0, import_blocks.sanitizeBlockAttributes)(block, attributes);
 163      if (skipBlockSupportAttributes && sanitizedAttributes) {
 164        sanitizedAttributes = removeBlockSupportAttributes(sanitizedAttributes);
 165      }
 166      const isPostRequest = "POST" === httpMethod;
 167      const urlAttributes = isPostRequest ? null : sanitizedAttributes;
 168      const path = rendererPath(block, urlAttributes, urlQueryArgs);
 169      const body = isPostRequest ? JSON.stringify({ attributes: sanitizedAttributes ?? null }) : void 0;
 170      (0, import_element.useEffect)(() => {
 171        const controller = new AbortController();
 172        const debouncedFetch = (0, import_compose.debounce)(
 173          function() {
 174            {
 175              setResponse({ status: "loading" });
 176              (0, import_api_fetch.default)({
 177                path,
 178                method: isPostRequest ? "POST" : "GET",
 179                body,
 180                headers: isPostRequest ? {
 181                  "Content-Type": "application/json"
 182                } : {},
 183                signal: controller.signal
 184              }).then((res) => {
 185                setResponse({
 186                  status: "success",
 187                  content: res ? res.rendered : ""
 188                });
 189              }).catch((error) => {
 190                if (error instanceof Error && error.name === "AbortError") {
 191                  return;
 192                }
 193                setResponse({
 194                  status: "error",
 195                  error: error instanceof Error ? error.message : String(error)
 196                });
 197              }).finally(() => {
 198                shouldDebounceRef.current = true;
 199              });
 200            }
 201          },
 202          shouldDebounceRef.current ? 500 : 0
 203        );
 204        debouncedFetch();
 205        return () => {
 206          controller.abort();
 207          debouncedFetch.cancel();
 208        };
 209      }, [path, isPostRequest, body]);
 210      return response;
 211    }
 212  
 213    // packages/server-side-render/build-module/server-side-render.mjs
 214    var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
 215    var EMPTY_OBJECT = {};
 216    function DefaultEmptyResponsePlaceholder({ className }) {
 217      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Placeholder, { className, children: (0, import_i18n.__)("Block rendered as empty.") });
 218    }
 219    function DefaultErrorResponsePlaceholder({
 220      message,
 221      className
 222    }) {
 223      const errorMessage = (0, import_i18n.sprintf)(
 224        // translators: %s: error message describing the problem
 225        (0, import_i18n.__)("Error loading block: %s"),
 226        message || (0, import_i18n.__)("Unknown error")
 227      );
 228      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Placeholder, { className, children: errorMessage });
 229    }
 230    function DefaultLoadingResponsePlaceholder({
 231      children
 232    }) {
 233      const [showLoader, setShowLoader] = (0, import_element2.useState)(false);
 234      (0, import_element2.useEffect)(() => {
 235        const timeout = setTimeout(() => {
 236          setShowLoader(true);
 237        }, 1e3);
 238        return () => clearTimeout(timeout);
 239      }, []);
 240      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { position: "relative" }, children: [
 241        showLoader && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
 242          "div",
 243          {
 244            style: {
 245              position: "absolute",
 246              top: "50%",
 247              left: "50%",
 248              marginTop: "-9px",
 249              marginLeft: "-9px"
 250            },
 251            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {})
 252          }
 253        ),
 254        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { opacity: showLoader ? "0.3" : 1 }, children })
 255      ] });
 256    }
 257    function ServerSideRender(props) {
 258      const prevContentRef = (0, import_element2.useRef)("");
 259      const {
 260        className,
 261        EmptyResponsePlaceholder = DefaultEmptyResponsePlaceholder,
 262        ErrorResponsePlaceholder = DefaultErrorResponsePlaceholder,
 263        LoadingResponsePlaceholder = DefaultLoadingResponsePlaceholder,
 264        ...restProps
 265      } = props;
 266      const { content, status, error } = useServerSideRender(restProps);
 267      (0, import_element2.useEffect)(() => {
 268        if (content) {
 269          prevContentRef.current = content;
 270        }
 271      }, [content]);
 272      if (status === "loading") {
 273        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingResponsePlaceholder, { ...props, children: !!prevContentRef.current && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_element2.RawHTML, {
 274          className,
 275          // eslint-disable-next-line react-hooks/refs
 276          children: prevContentRef.current
 277        }) });
 278      }
 279      if (status === "success" && !content) {
 280        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyResponsePlaceholder, { ...props });
 281      }
 282      if (status === "error") {
 283        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ErrorResponsePlaceholder, { message: error, ...props });
 284      }
 285      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_element2.RawHTML, { className, children: content || "" });
 286    }
 287    function ServerSideRenderWithPostId({
 288      urlQueryArgs = EMPTY_OBJECT,
 289      ...props
 290    }) {
 291      const currentPostId = (0, import_data.useSelect)((select) => {
 292        const editorStore = select("core/editor");
 293        const postId = editorStore?.getCurrentPostId?.();
 294        return postId && typeof postId === "number" ? postId : null;
 295      }, []);
 296      const newUrlQueryArgs = (0, import_element2.useMemo)(() => {
 297        if (!currentPostId) {
 298          return urlQueryArgs;
 299        }
 300        return {
 301          post_id: currentPostId,
 302          ...urlQueryArgs
 303        };
 304      }, [currentPostId, urlQueryArgs]);
 305      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ServerSideRender, { urlQueryArgs: newUrlQueryArgs, ...props });
 306    }
 307  
 308    // packages/server-side-render/build-module/index.mjs
 309    var ServerSideRenderCompat = ServerSideRenderWithPostId;
 310    ServerSideRenderCompat.ServerSideRender = ServerSideRenderWithPostId;
 311    ServerSideRenderCompat.useServerSideRender = useServerSideRender;
 312    var index_default = ServerSideRenderCompat;
 313    return __toCommonJS(index_exports);
 314  })();
 315  if (typeof wp.serverSideRender === 'object' && wp.serverSideRender.default) { wp.serverSideRender = wp.serverSideRender.default; }


Generated : Thu Jul 16 08:20:16 2026 Cross-referenced by PHPXref