How to use the bpk-component-breakpoint.BREAKPOINTS.ABOVE_TABLET function in bpk-component-breakpoint

TABLET
          )}
        
        
          {isActive => (
            TABLET ONLY
          )}
        
        
          {isActive => (
            
              ABOVE MOBILE
            
          )}
        
        
          {isActive => (
            
              ABOVE TABLET
            
          )}
        
      ,
    ],
  },
];

const blurb = [
  
    The breakpoint component allows information to be displayed in different
    ways depending on the screen size. To simplify things, Backpack uses only
    three breakpoints optimised for mobile, tablet and desktop viewports.

}
  }

  const heroClassNames = getClassName(
    'bpkdocs-main-hero-image',
    !heroImage && 'bpkdocs-main-hero-image--collapsed',
  );

  const hamburgerMenuClassNames = getClassName(
    'bpkdocs-main-hero-image__hamburger',
    !heroImage && 'bpkdocs-main-hero-image__hamburger--hero-collapsed',
  );

  return (
    <div style="{heroStyle}">
      
        {aboveTablet =&gt;
          !aboveTablet &amp;&amp; (
            
          )
        }
      
    </div>
  );
};