@graphcommerce/next-ui 3.6.0 → 3.7.0

package/AspectRatioContainer/index.tsx

@@ -1,4 +1,4 @@
-import { makeStyles } from '@material-ui/styles'
+import { makeStyles } from '@material-ui/core'
 import React from 'react'
 import { UseStyles } from '../Styles'
 

package/Button/index.tsx

@@ -1,5 +1,9 @@
-import { Button as MuiButton, ButtonClassKey as MuiButtonClassKey, Theme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/styles'
+import {
+  Button as MuiButton,
+  ButtonClassKey as MuiButtonClassKey,
+  Theme,
+  makeStyles,
+} from '@material-ui/core'
 import clsx from 'clsx'
 import React from 'react'
 

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.7.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.6.0...@graphcommerce/next-ui@3.7.0) (2021-10-19)
+
+
+### Bug Fixes
+
+* solve import issue where @material-ui/styles couldn't be found ([efb3771](https://github.com/ho-nl/m2-pwa/commit/efb3771e8c173799779691d4d52857678dab4c15))
+
+
+### Features
+
+* **framer-scroller:** better defaults so the Scroller doesn't look broken when providing no props ([b177ce9](https://github.com/ho-nl/m2-pwa/commit/b177ce9570abb9ccfd4eb5cc34e43d157bb4e81a))
+
+
+
+
+
 # [3.6.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.5.0...@graphcommerce/next-ui@3.6.0) (2021-10-18)
 
 

package/FramerNextPagesSlider/Slider.tsx

@@ -1,5 +1,5 @@
 import { usePageContext, usePageRouter } from '@graphcommerce/framer-next-pages'
-import { makeStyles } from '@material-ui/styles'
+import { makeStyles } from '@material-ui/core'
 import { AnimatePresence } from 'framer-motion'
 import React, { useRef } from 'react'
 import RouterSlide from './Slide'

package/FramerScroller/components/SidebarGallery.tsx

@@ -73,9 +73,7 @@ const useStyles = makeStyles(
       top: 0,
       width: '100%',
       height: '100%',
-      display: `grid`,
-      gridAutoFlow: `column`,
-      gridTemplateColumns: `repeat(100, 100%)`,
+      gridAutoColumns: `100%`,
       gridTemplateRows: `100%`,
       cursor: 'zoom-in',
     },

package/FramerScroller/components/SidebarSlider.tsx

@@ -4,8 +4,7 @@ import {
   ScrollerPageCounter,
   ScrollerProvider,
 } from '@graphcommerce/framer-scroller'
-import { Theme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/styles'
+import { Theme, makeStyles } from '@material-ui/core'
 import React, { ReactNode } from 'react'
 import { UseStyles } from '../../Styles'
 import responsiveVal from '../../Styles/responsiveVal'
@@ -31,15 +30,11 @@ const useStyles = makeStyles(
     },
     scroller: {
       width: '100%',
-      display: 'grid',
-      gridAutoFlow: 'column',
       gridColumnGap: theme.spacings.md,
       gridRowGap: theme.spacings.lg,
       alignContent: 'space-around',
       paddingRight: theme.page.horizontal,
-      '& > *': {
-        minWidth: responsiveVal(200, 400),
-      },
+      gridAutoColumns: responsiveVal(200, 400),
     },
     sliderButtons: {
       [theme.breakpoints.down('sm')]: {

package/Row/ButtonLinkList/index.tsx

@@ -1,5 +1,4 @@
-import { Theme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/styles'
+import { Theme, makeStyles } from '@material-ui/core'
 import React from 'react'
 import Row from '..'
 import SectionContainer from '../../SectionContainer'

package/Row/ContentLinks/index.tsx

@@ -8,14 +8,10 @@ const useStyles = makeStyles(
     root: {},
     scroller: {
       marginBottom: `${theme.spacings.lg}`,
-      display: 'grid',
-      gridAutoFlow: 'column',
       justifyContent: 'start',
       gap: `${theme.spacings.md}`,
       alignContent: 'center',
-      '& > *': {
-        minWidth: 'max-content',
-      },
+      gridAutoColumns: `max-content`,
     },
     title: {
       fontWeight: 600,

package/Row/HeroBanner/index.tsx

@@ -1,5 +1,4 @@
-import { ContainerProps, Theme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/styles'
+import { ContainerProps, Theme, makeStyles } from '@material-ui/core'
 import { m, useTransform, useViewportScroll } from 'framer-motion'
 import React from 'react'
 import Row from '..'

package/StyledBadge/index.tsx

@@ -1,5 +1,4 @@
-import { Badge } from '@material-ui/core'
-import { withStyles } from '@material-ui/styles'
+import { Badge, withStyles } from '@material-ui/core'
 
 const StyledBadge = withStyles((theme) => ({
   colorError: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphcommerce/next-ui",
-  "version": "3.6.0",
+  "version": "3.7.0",
   "author": "",
   "license": "MIT",
   "scripts": {
@@ -11,7 +11,7 @@
   "dependencies": {
     "@apollo/client": "^3.4.16",
     "@graphcommerce/framer-next-pages": "^2.106.9",
-    "@graphcommerce/framer-scroller": "^0.2.11",
+    "@graphcommerce/framer-scroller": "^0.3.0",
     "@graphcommerce/framer-sheet": "^2.105.9",
     "@graphcommerce/framer-utils": "^2.103.8",
     "@graphcommerce/graphql": "^2.103.7",
@@ -55,5 +55,5 @@
       "project": "./tsconfig.json"
     }
   },
-  "gitHead": "beb4b83268176f7c6579cee2fe844752315e2378"
+  "gitHead": "a7749d81f482a77bc6bcbf237aca551ed3b7a835"
 }