@graphcommerce/image 3.1.2 → 3.1.5

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Change Log
 
+## 3.1.5
+
+### Patch Changes
+
+- [#1399](https://github.com/graphcommerce-org/graphcommerce/pull/1399) [`da0ae7d02`](https://github.com/graphcommerce-org/graphcommerce/commit/da0ae7d0236e4908ba0bf0fa16656be516e841d4) Thanks [@paales](https://github.com/paales)! - Updated dependencies
+
+- Updated dependencies [[`da0ae7d02`](https://github.com/graphcommerce-org/graphcommerce/commit/da0ae7d0236e4908ba0bf0fa16656be516e841d4)]:
+  - @graphcommerce/framer-utils@3.1.2
+
+## 3.1.4
+
+### Patch Changes
+
+- [#1387](https://github.com/graphcommerce-org/graphcommerce/pull/1387) [`0e425e85e`](https://github.com/graphcommerce-org/graphcommerce/commit/0e425e85ee8fed280349317ee0440c7bceea5823) Thanks [@NickdeK](https://github.com/NickdeK)! - Export Sizes type to be used for passing Sizes prop
+
+## 3.1.3
+
+### Patch Changes
+
+- [#1378](https://github.com/graphcommerce-org/graphcommerce/pull/1378) [`b610a6e40`](https://github.com/graphcommerce-org/graphcommerce/commit/b610a6e4049e8c9e8b5d2aeff31b8e1bfc24abe5) Thanks [@paales](https://github.com/paales)! - Pin all versions internally so we can’t end up in an unfixable state for the user
+
 ## 3.1.2
 
 ### Patch Changes

package/components/Image.tsx

@@ -32,6 +32,8 @@ if (typeof window === 'undefined') {
 
 export type { ImageLoaderProps, ImageLoader }
 
+type ImageConfig = ImageConfigComplete & { allSizes: number[] }
+
 const DEFAULT_SIZES: SizesRecord = { 0: '100vw', 1200: '50vw' }
 
 const VALID_LOADING_VALUES = ['lazy', 'eager', undefined] as const
@@ -84,7 +86,7 @@ export function srcToString(src: StaticImport | string) {
 // allSizes.sort((a, b) => a - b)
 
 function getWidths(
-  config: ImageLoaderProps['config'],
+  config: ImageConfig,
   width: number | undefined,
   layout: LayoutValue,
   sizes = '',
@@ -138,7 +140,7 @@ type GenImgAttrsData = {
   quality?: number
   sizes: string
   scale: number
-  config: ImageLoaderProps['config']
+  config: ImageConfig
 }
 
 function generateSrcSet(props: GenImgAttrsData): string {
@@ -148,7 +150,7 @@ function generateSrcSet(props: GenImgAttrsData): string {
   return widths
     .map(
       (w, i) =>
-        `${loader({ src, quality, width: w, config })} ${
+        `${loader({ src, quality, width: w })} ${
           kind === 'w' ? Math.round(w * scale) : i + 1
         }${kind}`,
     )
@@ -176,7 +178,7 @@ type SizesString =
   | `max(${string})`
   | `clamp(${string})`
 type SizesRecord = Record<number, SizesString>
-type Sizes = SizesString | SizesRecord | undefined
+export type Sizes = SizesString | SizesRecord | undefined
 
 function isSizesRecord(sizes?: Sizes): sizes is SizesRecord {
   return typeof sizes === 'object'
@@ -266,7 +268,7 @@ const Image = React.forwardRef<HTMLImageElement, ImageProps>(
     const combinedRef = useForkRef(ref, forwardedRef)
 
     const configContext = useContext(ImageConfigContext)
-    const config: ImageLoaderProps['config'] = useMemo(() => {
+    const config: ImageConfig = useMemo(() => {
       const c = configEnv || configContext || imageConfigDefault
       const allSizes = [...c.deviceSizes, ...c.imageSizes].sort((a, b) => a - b)
       const deviceSizes = c.deviceSizes.sort((a, b) => a - b)

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/image",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "3.1.2",
+  "version": "3.1.5",
   "sideEffects": false,
   "scripts": {
     "dev": "tsc -W"
@@ -15,18 +15,18 @@
     }
   },
   "dependencies": {
-    "@graphcommerce/framer-utils": "^3.1.1"
+    "@graphcommerce/framer-utils": "3.1.2"
   },
   "devDependencies": {
-    "@graphcommerce/eslint-config-pwa": "^4.1.3",
-    "@graphcommerce/prettier-config-pwa": "^4.0.5",
+    "@graphcommerce/eslint-config-pwa": "^4.1.5",
+    "@graphcommerce/prettier-config-pwa": "^4.0.6",
     "@graphcommerce/typescript-config-pwa": "^4.0.2",
-    "@playwright/test": "^1.20.1",
-    "type-fest": "2.12.1"
+    "@playwright/test": "^1.21.1",
+    "type-fest": "^2.12.2"
   },
   "peerDependencies": {
-    "@mui/material": "^5.5.0",
-    "next": "^12.1.0",
+    "@mui/material": "5.5.3",
+    "next": "12.1.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
   }