@oversightstudio/blur-data-urls/dist/index.js

Automatically assign URLs for blur data to media collections in Payload.

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __async = (__this, __arguments, generator) => {
  return new Promise((resolve, reject) => {
    var fulfilled = (value) => {
      try {
        step(generator.next(value));
      } catch (e) {
        reject(e);
      }
    };
    var rejected = (value) => {
      try {
        step(generator.throw(value));
      } catch (e) {
        reject(e);
      }
    };
    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
    step((generator = generator.apply(__this, __arguments)).next());
  });
};

// src/utilities/getIncomingFiles.ts
function getIncomingFiles({
  data,
  req
}) {
  const file = req.file;
  let files = [];
  if (file && data.filename && data.mimeType) {
    const mainFile = {
      buffer: file.data,
      filename: data.filename,
      filesize: file.size,
      mimeType: data.mimeType,
      tempFilePath: file.tempFilePath
    };
    files = [mainFile];
    if (data == null ? void 0 : data.sizes) {
      Object.entries(data.sizes).forEach(([key, resizedFileData]) => {
        var _a;
        if (((_a = req.payloadUploadSizes) == null ? void 0 : _a[key]) && data.mimeType) {
          files = files.concat([
            {
              buffer: req.payloadUploadSizes[key],
              filename: `${resizedFileData.filename}`,
              filesize: req.payloadUploadSizes[key].length,
              mimeType: data.mimeType
            }
          ]);
        }
      });
    }
  }
  return files;
}

// src/utilities/generateDataUrl.ts
import sharp from "sharp";
var generateDataUrl = (file, options) => __async(void 0, null, function* () {
  var _a, _b, _c;
  const { buffer } = file;
  const width = (_a = options == null ? void 0 : options.width) != null ? _a : 32;
  const height = (_b = options == null ? void 0 : options.height) != null ? _b : "auto";
  const blur = (_c = options == null ? void 0 : options.blur) != null ? _c : 18;
  try {
    const sharpImage = sharp(buffer);
    const metadata = yield sharpImage.metadata();
    let resizedHeight;
    if (height === "auto" && metadata.width && metadata.height) {
      resizedHeight = Math.round(width / metadata.width * metadata.height);
    } else if (typeof height === "number") {
      resizedHeight = height;
    } else {
      resizedHeight = 32;
    }
    const blurDataBuffer = yield sharpImage.resize(width, resizedHeight).blur(blur).toBuffer();
    const blurDataURL = `data:image/png;base64,${blurDataBuffer.toString("base64")}`;
    return blurDataURL;
  } catch (error) {
    console.error("Error generating blurDataURL:", error);
    throw error;
  }
});

// src/hooks/beforeChange.ts
var createBeforeChangeHook = (options) => {
  return (_0) => __async(void 0, [_0], function* ({ req, data }) {
    const files = getIncomingFiles({ data, req });
    for (const file of files) {
      if (!file.mimeType.startsWith("image/")) {
        continue;
      }
      data.blurDataUrl = yield generateDataUrl(file, options);
    }
    return data;
  });
};

// src/extendCollectionConfig.ts
var extendCollectionConfig = (collection, hook) => {
  var _a, _b;
  return __spreadProps(__spreadValues({}, collection), {
    fields: [
      ...collection.fields,
      {
        name: "blurDataUrl",
        type: "text",
        admin: {
          readOnly: true
        }
      }
    ],
    hooks: __spreadProps(__spreadValues({}, collection.hooks), {
      beforeChange: [...(_b = (_a = collection.hooks) == null ? void 0 : _a.beforeChange) != null ? _b : [], hook]
    })
  });
};
var extendCollectionsConfig = (incomingCollections, options) => {
  return incomingCollections.map((collection) => {
    const foundInConfig = options.collections.some(({ slug }) => slug === collection.slug);
    if (!foundInConfig) return collection;
    return extendCollectionConfig(collection, createBeforeChangeHook(options.blurOptions));
  });
};

// src/plugin.ts
var blurDataUrlsPlugin = (pluginOptions) => (incomingConfig) => {
  var _a;
  const config = __spreadValues({}, incomingConfig);
  config.admin = __spreadProps(__spreadValues({}, config.admin || {}), {
    components: __spreadValues({}, ((_a = config.admin) == null ? void 0 : _a.components) || {})
  });
  if (pluginOptions.enabled === false) {
    return config;
  }
  if (config.collections) {
    config.collections = extendCollectionsConfig(config.collections, pluginOptions);
  }
  return config;
};
export {
  blurDataUrlsPlugin
};