@graphcommerce/next-ui 3.13.2 → 3.14.3

package/AppShell/DesktopNavBar.tsx

@@ -23,10 +23,11 @@ const useStyles = makeStyles(
       },
     },
     scroller: {
-      display: 'flex',
+      display: 'grid',
       columnGap: 40,
       padding: '0 40px',
       minHeight: 40,
+      gridAutoColumns: 'min-content',
     },
     prevNextBtnWrapper: {
       position: 'absolute',

package/AppShell/MenuFab.tsx

@@ -11,7 +11,7 @@ import {
 import { m } from 'framer-motion'
 import PageLink from 'next/link'
 import { Router, useRouter } from 'next/router'
-import React from 'react'
+import React, { useEffect } from 'react'
 import { UseStyles } from '../Styles'
 import responsiveVal from '../Styles/responsiveVal'
 import SvgImageSimple from '../SvgImage/SvgImageSimple'
@@ -56,10 +56,6 @@ const useStyles = makeStyles(
       ...theme.typography.h3,
       fontWeight: 550,
       lineHeight: 1,
-      // fontSize: '1.6em',
-      // fontWeight: 550,
-      // letterSpacing: '-0.0375em',
-      // lineHeight: 1,
     },
     menuItem: {},
   }),
@@ -81,7 +77,11 @@ export default function MenuFab(props: MenuFabProps) {
 
   const { filter, opacity, scale } = useFabAnimation()
 
-  Router.events.on('routeChangeStart', () => setOpenEl(null))
+  useEffect(() => {
+    const clear = () => setOpenEl(null)
+    router.events.on('routeChangeStart', clear)
+    return () => router.events.off('routeChangeStart', clear)
+  }, [router])
 
   return (
     <m.div className={classes.menuWrapper} style={{ opacity, scale, filter }}>

package/AppShell/SheetShellBase/index.tsx

@@ -60,7 +60,7 @@ function SheetShellBase(props: SheetShellBaseProps) {
   const sheetClasses = useSheetStyles(props)
   const router = useRouter()
   const pageRouter = usePageRouter()
-  const { depth, closeSteps, active } = usePageContext()
+  const { depth, closeSteps, active, direction } = usePageContext()
   const open = depth < 0 || router.asPath === pageRouter.asPath
   const initialLocale = useRef(router.locale)
 
@@ -95,7 +95,7 @@ function SheetShellBase(props: SheetShellBaseProps) {
         <Sheet open={open} onSnap={handleSnap} variant={variant} size={size}>
           <SheetBackdrop onTap={handleClose} classes={sheetClasses} />
           <SheetContainer classes={sheetContainerClasses}>
-            <SheetPanel classes={sheetClasses}>
+            <SheetPanel initial={direction === -1 ? 'snapPoint1' : 'closed'} classes={sheetClasses}>
               {/* <FocusLock returnFocus={{ preventScroll: true }} disabled={!isActive}> */}
               {children}
               {/* </FocusLock> */}

package/CHANGELOG.md

@@ -3,6 +3,46 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.14.3](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.14.2...@graphcommerce/next-ui@3.14.3) (2021-11-06)
+
+
+### Bug Fixes
+
+* spacing DesktopNavBar items ([c3373b9](https://github.com/ho-nl/m2-pwa/commit/c3373b97add87864adc5809ab04cf683bc5b0498))
+
+
+
+
+
+## [3.14.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.14.0...@graphcommerce/next-ui@3.14.1) (2021-11-04)
+
+
+### Bug Fixes
+
+* can't remove filters on click icon ([2528802](https://github.com/ho-nl/m2-pwa/commit/252880216994da7f8e65c1b565ff996bbab0472a))
+* Checkout button margin consistency ([9fcf7e7](https://github.com/ho-nl/m2-pwa/commit/9fcf7e7d96172448b2d2911771d6bf70ab976594))
+* remove hardcoded fontSize ([e4e09e1](https://github.com/ho-nl/m2-pwa/commit/e4e09e11baeb8edeff634550b8cdb88571d96911))
+
+
+
+
+
+# [3.14.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.13.2...@graphcommerce/next-ui@3.14.0) (2021-11-04)
+
+
+### Bug Fixes
+
+* **menu-fab:** fix route change start event handling ([20dde65](https://github.com/ho-nl/m2-pwa/commit/20dde65f8e8ead449b21f4f5292d653d003e6ead))
+
+
+### Features
+
+* **sheet-shell-base:** stop animating drawer on browser back ([c6262f1](https://github.com/ho-nl/m2-pwa/commit/c6262f1c3a0d181e57bd5d4971efb469901503b1))
+
+
+
+
+
 ## [3.13.2](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/next-ui@3.13.1...@graphcommerce/next-ui@3.13.2) (2021-11-03)
 
 

package/ChipMenu/index.tsx

@@ -67,7 +67,9 @@ export default function ChipMenu(props: ChipMenuProps) {
   const classes = useChipMenuStyles(props)
 
   let deleteIcon = selected ? (
-    <SvgImageSimple src={iconCancelAlt} className={classes.iconCancel} />
+    <div>
+      <SvgImageSimple src={iconCancelAlt} className={classes.iconCancel} />
+    </div>
   ) : (
     <SvgImageSimple src={iconChevronDown} />
   )

package/Form/FormActions.tsx

@@ -2,8 +2,8 @@ import { styled } from '@material-ui/core'
 
 const FormActions = styled('div')(
   ({ theme }) => ({
-    paddingTop: theme.spacings.xxs,
-    paddingBottom: theme.spacings.md,
+    paddingTop: theme.spacings.md,
+    paddingBottom: theme.spacings.lg,
     justifyContent: 'center',
     display: 'grid',
     gridAutoFlow: 'column',

package/IconHeader/index.tsx

@@ -10,8 +10,8 @@ import SvgImage, { SvgImageProps } from '../SvgImage'
 const useStyles = makeStyles(
   (theme: Theme) => ({
     container: {
+      ...theme.typography.subtitle1,
       textAlign: 'center',
-      fontSize: responsiveVal(16, 24),
     },
     innerContainer: {
       display: 'flex',

package/StyledBadge/index.tsx

@@ -3,12 +3,12 @@ import { Badge, withStyles } from '@material-ui/core'
 const StyledBadge = withStyles((theme) => ({
   colorError: {},
   badge: {
+    ...theme.typography.caption,
     right: 6,
     top: 6,
     padding: 3,
     color: '#FFF',
     borderRadius: '100%',
-    fontSize: 10,
     [theme.breakpoints.up('md')]: {
       padding: 6,
       right: 8,

package/TextInputNumber/index.tsx

@@ -27,9 +27,7 @@ const useStyles = makeStyles(
         appearance: 'none',
       },
     },
-    button: {
-      fontSize: 22,
-    },
+    button: {},
     adornedEnd: {
       paddingRight: responsiveVal(7, 14),
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphcommerce/next-ui",
-  "version": "3.13.2",
+  "version": "3.14.3",
   "author": "",
   "license": "MIT",
   "scripts": {
@@ -12,7 +12,7 @@
     "@apollo/client": "^3.4.16",
     "@graphcommerce/framer-next-pages": "^2.107.3",
     "@graphcommerce/framer-scroller": "^1.0.2",
-    "@graphcommerce/framer-sheet": "^2.105.15",
+    "@graphcommerce/framer-sheet": "^2.106.0",
     "@graphcommerce/framer-utils": "^2.103.13",
     "@graphcommerce/graphql": "^2.105.3",
     "@graphcommerce/image": "^2.105.2",
@@ -53,5 +53,5 @@
       "project": "./tsconfig.json"
     }
   },
-  "gitHead": "db0c7ff1a81b75e4e6eeee3717a1fc608d9c3c86"
+  "gitHead": "c0165c35074fb4f6e8ddf64d3d12b8cfbb169c1d"
 }