@croct/plug-react/hooks/useContent.cjs

React components and hooks to plug your React applications into Croct.

"use strict";
"use client";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var useContent_exports = {};
__export(useContent_exports, {
  useContent: () => useContent
});
module.exports = __toCommonJS(useContent_exports);
var import_react = require("react");
var import_content = require("@croct/content");
var import_useLoader = require('./useLoader.cjs');
var import_useCroct = require('./useCroct.cjs');
var import_ssr_polyfills = require('../ssr-polyfills.cjs');
var import_hash = require('../hash.cjs');
function useCsrContent(id, options = {}) {
  const {
    cacheKey,
    expiration,
    fallback: fallbackContent,
    initial: initialContent,
    staleWhileLoading = false,
    preferredLocale,
    ...fetchOptions
  } = options;
  const normalizedLocale = normalizePreferredLocale(preferredLocale);
  const defaultContent = (0, import_react.useMemo)(
    () => (0, import_content.getSlotContent)(id, normalizedLocale) ?? void 0,
    [id, normalizedLocale]
  );
  const fallback = fallbackContent === void 0 ? defaultContent : fallbackContent;
  const [initial, setInitial] = (0, import_react.useState)(
    () => {
      const content = initialContent === void 0 ? defaultContent : initialContent;
      if (content === void 0) {
        return void 0;
      }
      return { content };
    }
  );
  const croct = (0, import_useCroct.useCroct)();
  const result = (0, import_useLoader.useLoader)({
    cacheKey: (0, import_hash.hash)(
      `useContent:${cacheKey ?? ""}:${id}:${normalizedLocale ?? ""}:${JSON.stringify(fetchOptions?.attributes ?? {})}`
    ),
    loader: () => croct.fetch(id, {
      ...fetchOptions,
      ...normalizedLocale !== void 0 ? { preferredLocale: normalizedLocale } : {},
      ...fallback !== void 0 ? { fallback } : {}
    }),
    initial,
    expiration
  });
  (0, import_react.useEffect)(
    () => {
      if (staleWhileLoading) {
        setInitial((current) => {
          if (current !== result) {
            return result;
          }
          return current;
        });
      }
    },
    [result, staleWhileLoading]
  );
  return result;
}
function useSsrContent(slotId, options = {}) {
  const { initial, preferredLocale } = options;
  const resolvedInitialContent = initial === void 0 ? (0, import_content.getSlotContent)(slotId, normalizePreferredLocale(preferredLocale)) ?? void 0 : initial;
  if (resolvedInitialContent === void 0) {
    throw new Error(
      "The initial content is required for server-side rendering (SSR). For help, see https://croct.help/sdk/react/missing-slot-content"
    );
  }
  return { content: resolvedInitialContent };
}
function normalizePreferredLocale(preferredLocale) {
  return preferredLocale !== void 0 && preferredLocale !== "" ? preferredLocale : void 0;
}
const useContent = (0, import_ssr_polyfills.isSsr)() ? useSsrContent : useCsrContent;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  useContent
});