{"version":3,"file":"asImageWidthSrcSet.cjs","names":[],"sources":["../../src/helpers/asImageWidthSrcSet.ts"],"sourcesContent":["import type { BuildWidthSrcSetParams } from \"imgix-url-builder\"\nimport { buildURL, buildWidthSrcSet } from \"imgix-url-builder\"\n\nimport type { ImageFieldImage } from \"../types/value/image\"\nimport * as isFilled from \"./isFilled\"\n\n/** The default widths used to generate a `srcset` value. */\nconst DEFAULT_WIDTHS = [640, 828, 1200, 2048, 3840]\n\n/** The return type of `asImageWidthSrcSet()`. */\ntype AsImageWidthSrcSetReturnType =\n\tField extends ImageFieldImage<\"filled\">\n\t\t? {\n\t\t\t\t/** The image field's URL with imgix URL parameters (if given). */\n\t\t\t\tsrc: string\n\n\t\t\t\t/**\n\t\t\t\t * A width-based `srcset` attribute value for the image field with imgix URL parameters (if\n\t\t\t\t * given).\n\t\t\t\t */\n\t\t\t\tsrcset: string\n\t\t\t}\n\t\t: null\n\n/** Configuration for `asImageWidthSrcSet()`. */\ntype AsImageWidthSrcSetConfig = Omit & {\n\twidths?: \"thumbnails\" | BuildWidthSrcSetParams[\"widths\"]\n}\n\n/**\n * Creates a width-based `srcset` from an image field with optional image transformations via imgix\n * URL parameters.\n *\n * If a `widths` parameter is not given, the following widths (in pixels) will be used by default:\n * 640, 750, 828, 1080, 1200, 1920, 2048, 3840.\n *\n * If the image field contains responsive views, each responsive view can be used as a width in the\n * resulting `srcset` by passing `\"thumbnails\"` as the `widths` parameter.\n *\n * @example\n * \t;```ts\n * \tconst srcset = asImageWidthSrcSet(document.data.photo, {\n * \t\twidths: [400, 800, 1600],\n * \t\tsat: -100,\n * \t})\n * \t// => {\n * \t// src: \"https://images.prismic.io/repo/image.png?sat=-100\",\n * \t// srcset: \"https://images.prismic.io/repo/image.png?sat=-100&width=400 400w, \" +\n * \t// \"https://images.prismic.io/repo/image.png?sat=-100&width=800 800w, \" +\n * \t// \"https://images.prismic.io/repo/image.png?sat=-100&width=1600 1600w\"\n * \t// }\n * \t```\n *\n * @param field - An image field (or one of its responsive views) from which to get an image URL.\n * @param config - An object of imgix URL API parameters. The `widths` parameter defines the\n * resulting `srcset` widths. Pass `\"thumbnails\"` to automatically use the field's responsive\n * views.\n * @returns A `srcset` attribute value for the image field with imgix URL parameters, or `null` if\n * the field is empty.\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 asImageWidthSrcSet = (\n\tfield: Field,\n\tconfig: AsImageWidthSrcSetConfig = {},\n): AsImageWidthSrcSetReturnType => {\n\tif (field && isFilled.imageThumbnail(field)) {\n\t\t// We are using destructuring to omit `widths` from the object\n\t\t// we will pass to `buildURL()`.\n\t\t// oxlint-disable-next-line prefer-const\n\t\tlet { widths = DEFAULT_WIDTHS, ...imgixParams } = config\n\t\tconst {\n\t\t\turl,\n\t\t\tdimensions,\n\t\t\tid: _id,\n\t\t\talt: _alt,\n\t\t\tcopyright: _copyright,\n\t\t\tedit: _edit,\n\t\t\t...responsiveViews\n\t\t} = field\n\n\t\t// The Prismic Rest API will always return thumbnail values if\n\t\t// the base size is filled.\n\t\tconst responsiveViewObjects: ImageFieldImage<\"filled\">[] = Object.values(responsiveViews)\n\n\t\t// If this `asImageWidthSrcSet()` call is configured to use\n\t\t// thumbnail widths, but the field does not have thumbnails, we\n\t\t// fall back to the default set of widths.\n\t\tif (widths === \"thumbnails\" && responsiveViewObjects.length < 1) {\n\t\t\twidths = DEFAULT_WIDTHS\n\t\t}\n\n\t\treturn {\n\t\t\tsrc: buildURL(url, imgixParams),\n\t\t\tsrcset:\n\t\t\t\t// By this point, we know `widths` can only be\n\t\t\t\t// `\"thubmanils\"` if the field has thumbnails.\n\t\t\t\twidths === \"thumbnails\"\n\t\t\t\t\t? [\n\t\t\t\t\t\t\tbuildWidthSrcSet(url, {\n\t\t\t\t\t\t\t\t...imgixParams,\n\t\t\t\t\t\t\t\twidths: [dimensions.width],\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t...responsiveViewObjects.map((thumbnail) => {\n\t\t\t\t\t\t\t\treturn buildWidthSrcSet(thumbnail.url, {\n\t\t\t\t\t\t\t\t\t...imgixParams,\n\t\t\t\t\t\t\t\t\twidths: [thumbnail.dimensions.width],\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t].join(\", \")\n\t\t\t\t\t: buildWidthSrcSet(field.url, {\n\t\t\t\t\t\t\t...imgixParams,\n\t\t\t\t\t\t\twidths,\n\t\t\t\t\t\t}),\n\t\t} as AsImageWidthSrcSetReturnType\n\t} else {\n\t\treturn null as AsImageWidthSrcSetReturnType\n\t}\n}\n"],"mappings":";;;;AAOA,MAAM,iBAAiB;CAAC;CAAK;CAAK;CAAM;CAAM;CAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDnD,MAAa,sBACZ,OACA,SAAmC,EAAE,KACI;AACzC,KAAI,SAAA,iBAAA,eAAiC,MAAM,EAAE;EAI5C,IAAI,EAAE,SAAS,gBAAgB,GAAG,gBAAgB;EAClD,MAAM,EACL,KACA,YACA,IAAI,KACJ,KAAK,MACL,WAAW,YACX,MAAM,OACN,GAAG,oBACA;EAIJ,MAAM,wBAAqD,OAAO,OAAO,gBAAgB;AAKzF,MAAI,WAAW,gBAAgB,sBAAsB,SAAS,EAC7D,UAAS;AAGV,SAAO;GACN,MAAA,GAAA,kBAAA,UAAc,KAAK,YAAY;GAC/B,QAGC,WAAW,eACR,EAAA,GAAA,kBAAA,kBACiB,KAAK;IACrB,GAAG;IACH,QAAQ,CAAC,WAAW,MAAM;IAC1B,CAAC,EACF,GAAG,sBAAsB,KAAK,cAAc;AAC3C,YAAA,GAAA,kBAAA,kBAAwB,UAAU,KAAK;KACtC,GAAG;KACH,QAAQ,CAAC,UAAU,WAAW,MAAM;KACpC,CAAC;KACD,CACF,CAAC,KAAK,KAAK,IAAA,GAAA,kBAAA,kBACM,MAAM,KAAK;IAC5B,GAAG;IACH;IACA,CAAC;GACL;OAED,QAAO"}