How to use the @magento/peregrine.useWindowSize function in @magento/peregrine

To help you get started, we’ve selected a few @magento/peregrine examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Jordaneisenburger / fallback-studio / src / pwa-studio / packages / venia-concept / src / components / ProductImageCarousel / thumbnail.js View on Github external
const Thumbnail = props => {
    const classes = mergeClasses(defaultClasses, props.classes);

    const {
        isActive,
        item: { file, label },
        onClickHandler,
        itemIndex
    } = props;

    const windowSize = useWindowSize();
    const isDesktop = windowSize.innerWidth >= 1024;

    const thumbnailImage = useMemo(() => {
        const src = file
            ? resourceUrl(file, {
                  type: 'image-product',
                  width: DEFAULT_THUMBNAIL_WIDTH,
                  height: DEFAULT_THUMBNAIL_HEIGHT
              })
            : transparentPlaceholder;

        return isDesktop ? (