adblock-detect-react

Provides utilities to check if ad block is enabled on a page via both a React hook and a wrapper component.

Usage no npm install needed!

<script type="module">
  import adblockDetectReact from 'https://cdn.skypack.dev/adblock-detect-react';
</script>

README

adblock-detect-react

npm version Publish Status

Description

Provides utilities to check if ad block is enabled on a page via either a React hook or a wrapper component.

Example Usage

useDetectAdBlock hook

import React from "react";
import { useDetectAdBlock } from "adblock-detect-react";

const SomeFunctionalComponent = () => {
  const adBlockDetected = useDetectAdBlock();

  React.useEffect(() => {
    if (adBlockDetected) {
      window.alert("ad block detected");
    }
  }, []);

  return <div>{adBlockDetected && "Hello Ad Blocked Page"}</div>;
};

AdBlockDetectedWrapper component

import React from "react";
import { AdBlockDetectedWrapper } from "adblock-detect-react";

const SomeFunctionalComponent = () => {
  return (
    <AdBlockDetectedWrapper>
      <div>{"Hello Ad Blocked Page"}</div>
    </AdBlockDetectedWrapper>
  );
};