crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-03-31 17:25:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Disables link scroll on variant selection (#1109)

Browse Source 
* Disables link scroll on variant selection

* Fix TS error
This commit is contained in:
Michael Novotny 2023-07-25 11:00:31 -05:00 committed by GitHub
parent 326f516138
commit 29aaa8cac6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/grid/three-items.tsx
View File

@ -38,7 +38,7 @@ export async function ThreeItemGrid() {
const [firstProduct, secondProduct, thirdProduct] = homepageItems; const [firstProduct, secondProduct, thirdProduct] = homepageItems;
return ( return (
<section className="mx-auto max-w-screen-2xl gap-4 pb-4 lg:grid lg:grid-cols-6 lg:grid-rows-2"> <section className="mx-auto grid max-w-screen-2xl gap-4 pb-4 lg:grid-cols-6 lg:grid-rows-2">
<ThreeItemGridItem size="full" item={firstProduct} /> <ThreeItemGridItem size="full" item={firstProduct} />
<ThreeItemGridItem size="half" item={secondProduct} /> <ThreeItemGridItem size="half" item={secondProduct} />
<ThreeItemGridItem size="half" item={thirdProduct} /> <ThreeItemGridItem size="half" item={thirdProduct} />

5
components/product/variant-selector.tsx
View File

@ -107,10 +107,14 @@ export function VariantSelector({
)?.availableForSale; )?.availableForSale;
const DynamicTag = isAvailableForSale ? Link : 'p'; const DynamicTag = isAvailableForSale ? Link : 'p';
const dynamicProps = {
...(isAvailableForSale && { scroll: false })
};
return ( return (
<DynamicTag <DynamicTag
key={value} key={value}
aria-disabled={!isAvailableForSale}
href={optionUrl} href={optionUrl}
title={`${option.name} ${value}${!isAvailableForSale ? ' (Out of Stock)' : ''}`} title={`${option.name} ${value}${!isAvailableForSale ? ' (Out of Stock)' : ''}`}
className={clsx( className={clsx(
@ -123,6 +127,7 @@ export function VariantSelector({
!isAvailableForSale !isAvailableForSale
} }
)} )}
{...dynamicProps}
> >
{value} {value}
</DynamicTag> </DynamicTag>