UNPKG

@prismicio/client

Version:

The official JavaScript + TypeScript client library for Prismic

1 lines 3.69 kB
{"version":3,"file":"asImagePixelDensitySrcSet.cjs","names":["isImageThumbnailFilled"],"sources":["../../src/helpers/asImagePixelDensitySrcSet.ts"],"sourcesContent":["import type { BuildPixelDensitySrcSetParams } from \"imgix-url-builder\"\nimport { buildPixelDensitySrcSet, buildURL } from \"imgix-url-builder\"\n\nimport type { ImageFieldImage } from \"../types/value/image\"\n\nimport { imageThumbnail as isImageThumbnailFilled } from \"./isFilled\"\n\n/**\n * The default pixel densities used to generate a `srcset` value.\n */\nconst DEFAULT_PIXEL_DENSITIES = [1, 2, 3]\n\n/**\n * Configuration for `asImagePixelDensitySrcSet()`.\n */\ntype AsImagePixelDensitySrcSetConfig = Omit<\n\tBuildPixelDensitySrcSetParams,\n\t\"pixelDensities\"\n> &\n\tPartial<Pick<BuildPixelDensitySrcSetParams, \"pixelDensities\">>\n\n/**\n * The return type of `asImagePixelDensitySrcSet()`.\n */\ntype AsImagePixelDensitySrcSetReturnType<\n\tField extends ImageFieldImage | null | undefined,\n> =\n\tField extends ImageFieldImage<\"filled\">\n\t\t? {\n\t\t\t\t/**\n\t\t\t\t * The image field's URL with imgix URL parameters (if given).\n\t\t\t\t */\n\t\t\t\tsrc: string\n\n\t\t\t\t/**\n\t\t\t\t * A pixel-density-based `srcset` attribute value for the image field\n\t\t\t\t * with imgix URL parameters (if given).\n\t\t\t\t */\n\t\t\t\tsrcset: string\n\t\t\t}\n\t\t: null\n\n/**\n * Creates a pixel-density-based `srcset` from an image field with optional\n * image transformations via imgix URL parameters.\n *\n * If a `pixelDensities` parameter is not given, the following pixel densities\n * will be used by default: 1, 2, 3.\n *\n * @example\n *\n * ```ts\n * const srcset = asImagePixelDensitySrcSet(document.data.photo, {\n * \tpixelDensities: [1, 2],\n * \tsat: -100,\n * })\n * // => {\n * // src: \"https://images.prismic.io/repo/image.png?sat=-100\",\n * // srcset: \"https://images.prismic.io/repo/image.png?sat=-100&dpr=1 1x, \" +\n * // \"https://images.prismic.io/repo/image.png?sat=-100&dpr=2 2x\"\n * // }\n * ```\n *\n * @param field - An image field (or one of its responsive views) from which to\n * get an image URL.\n * @param config - An object of imgix URL API parameters. The `pixelDensities`\n * parameter defines the resulting `srcset` pixel densities.\n *\n * @returns A `srcset` attribute value for the image field with imgix URL\n * parameters, or `null` if the field is empty.\n *\n * @see Learn how to optimize images with imgix: {@link https://prismic.io/docs/fields/image}\n * @see imgix URL parameters reference: {@link https://docs.imgix.com/apis/rendering}\n */\nexport const asImagePixelDensitySrcSet = <\n\tField extends ImageFieldImage | null | undefined,\n>(\n\tfield: Field,\n\tconfig: AsImagePixelDensitySrcSetConfig = {},\n): AsImagePixelDensitySrcSetReturnType<Field> => {\n\tif (field && isImageThumbnailFilled(field)) {\n\t\t// We are using destructuring to omit `pixelDensities` from the\n\t\t// object we will pass to `buildURL()`.\n\t\tconst { pixelDensities = DEFAULT_PIXEL_DENSITIES, ...imgixParams } = config\n\n\t\treturn {\n\t\t\tsrc: buildURL(field.url, imgixParams),\n\t\t\tsrcset: buildPixelDensitySrcSet(field.url, {\n\t\t\t\t...imgixParams,\n\t\t\t\tpixelDensities,\n\t\t\t}),\n\t\t} as AsImagePixelDensitySrcSetReturnType<Field>\n\t} else {\n\t\treturn null as AsImagePixelDensitySrcSetReturnType<Field>\n\t}\n}\n"],"mappings":";;;;;;;AAUA,MAAM,0BAA0B;CAAC;CAAG;CAAG;CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgEzC,MAAa,6BAGZ,OACA,SAA0C,EAAE,KACI;AAChD,KAAI,SAASA,gCAAuB,MAAM,EAAE;EAG3C,MAAM,EAAE,iBAAiB,wBAAyB,GAAG,gBAAgB;AAErE,SAAO;GACN,qCAAc,MAAM,KAAK,YAAY;GACrC,uDAAgC,MAAM,KAAK;IAC1C,GAAG;IACH;IACA,CAAC;GACF;OAED,QAAO"}