@bikdotai/bik-widgets 1.0.0 → 1.0.2

package/src/widgets/STW/wheel.tsx

@@ -1,304 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import parse from 'html-react-parser';
-import {
-  addDiscountText,
-  colorLuminance,
-  getSegmentDetails,
-  updateSegmentWidth,
-} from './utility';
-import { ISTWTemplate } from './stw1';
-import SVGFactory, { SVGName } from './components/svgFactory';
-import { decodeTextHelper } from '../utility';
-import {
-  BACKGROUND_TYPE,
-  ISTWWidgetCustomisation,
-  LANGUAGE_VALUES,
-  LANGUAGE_ISO_CODES,
-} from '@bikdotai/bik-models/dm';
-import useIsMobile from '../../hooks/useIsMobile';
-import { ComponentStyleMap, injectFontLink } from '../../utilities/styleUtils';
-import { LanguageUtils } from 'utilities/languageUtilities';
-
-const Wheel = (props: ISTWTemplate) => {
-  const {
-    widgetCustomisation,
-    onSpinHandle,
-    onCloseHandle,
-    preview,
-    isMobile,
-    templateName,
-  } = props;
-  const {
-    fontFamily,
-    fontColour,
-    backgroundType,
-    backgroundColour,
-    backgroundImageMobile,
-    backgroundImageDesktop,
-    playScreenHeading,
-    playScreenSubHeading,
-    spinnerColor,
-    spinnerTextColor,
-    spikesCount,
-    segmentColor1,
-    segmentTextColor1,
-    segmentTextColor2,
-    segmentColor2,
-    discountCodeTitle,
-    multiLingualConfigurations,
-  } = widgetCustomisation as ISTWWidgetCustomisation;
-  const [segmentWidth, setSegmentWidth] = useState<number>(null);
-  const [segmentDetailsFinal, setSegmentDetailsFinal] = useState<any[]>([]);
-  const [segmentDividerAngle, setSegmentDividerAngle] = useState<number>(null);
-  const [currentStyle, setCurrentStyle] = useState<any>(null);
-  const isMobileDevice = useIsMobile();
-  const languageUtils = new LanguageUtils();
-  const [widgetLanguage, setWidgetLanguage] = useState(LANGUAGE_VALUES.ENGLISH);
-
-  useEffect(() => {
-    setSegmentDividerAngle(90 - 360 / (spikesCount * 2));
-    setSegmentWidth(
-      updateSegmentWidth(spikesCount, preview, isMobile, templateName),
-    );
-    let segmentDetailsTemp = getSegmentDetails(
-      spikesCount,
-      segmentColor1,
-      segmentColor2,
-      discountCodeTitle,
-    );
-    if (
-      discountCodeTitle &&
-      Object.keys(discountCodeTitle)?.length &&
-      segmentDetailsTemp?.length
-    ) {
-      segmentDetailsTemp = addDiscountText(
-        discountCodeTitle,
-        segmentDetailsTemp,
-      );
-    }
-    setSegmentDetailsFinal(segmentDetailsTemp);
-  }, [
-    preview,
-    isMobile,
-    spikesCount,
-    segmentColor1,
-    segmentColor2,
-    discountCodeTitle,
-  ]);
-
-  useEffect(() => {
-    if (fontFamily && fontFamily?.link) {
-      injectFontLink([fontFamily?.link]);
-    }
-  }, [fontFamily]);
-
-  const addTextLuminance = color => {
-    return colorLuminance(color, -0.5);
-  };
-
-  useEffect(() => {
-    if (preview) {
-      if (isMobile) {
-        ComponentStyleMap[templateName]?.wheelPreviewMobile
-          .then()
-          .then(async style => {
-            setCurrentStyle((await style()).default);
-          });
-      } else {
-        ComponentStyleMap[templateName]?.wheelPreviewDesktop
-          .then()
-          .then(async style => {
-            setCurrentStyle((await style()).default);
-          });
-      }
-    } else {
-      ComponentStyleMap[templateName]?.globalStyle.then().then(async style => {
-        setCurrentStyle((await style()).default);
-      });
-    }
-  }, [preview, isMobile]);
-
-  useEffect(() => {
-    const isBikURL =
-      window.location.href?.includes('https://dashboard.bik.ai/') ||
-      window.location.href?.includes('https://staging.dashboard.bik.ai/');
-    const previewLanguage = props?.widgetCustomisation?.previewLanguage;
-    const storeLanguage =
-      (isBikURL ? previewLanguage : window?.Shopify?.locale) ??
-      previewLanguage ??
-      LANGUAGE_ISO_CODES.EN;
-    setWidgetLanguage(languageUtils.getStoreLanguage(storeLanguage));
-  }, [window.location.href, props?.widgetCustomisation?.previewLanguage]);
-
-  if (!currentStyle) {
-    return <></>;
-  }
-
-  return (
-    <>
-      {/* <button onClick={() => setIsMobile(!isMobile)}>Toggle</button> */}
-      <div className={currentStyle.bikSpinOverlay}>
-        <div className={currentStyle.bikMainWrapper}>
-          <div
-            className={
-              currentStyle.bikCloseBtnWrapper +
-              ' ' +
-              currentStyle.bikCloseAbsolute
-            }
-          >
-            <div
-              className={currentStyle.bikCloseBtn}
-              onClick={() => onCloseHandle('wheel')}
-            >
-              <svg
-                width="32"
-                height="32"
-                viewBox="0 0 32 32"
-                fill="none"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M24.9428 8.94265C25.4635 8.42195 25.4635 7.57773 24.9428 7.05703C24.4221 6.53633 23.5778 6.53633 23.0572 7.05703L16 14.1142L8.94277 7.05703C8.42207 6.53633 7.57785 6.53633 7.05715 7.05703C6.53645 7.57773 6.53645 8.42195 7.05715 8.94265L14.1143 15.9998L7.05715 23.057C6.53645 23.5777 6.53645 24.4219 7.05715 24.9426C7.57785 25.4633 8.42207 25.4633 8.94277 24.9426L16 17.8855L23.0572 24.9426C23.5778 25.4633 24.4221 25.4633 24.9428 24.9426C25.4635 24.4219 25.4635 23.5777 24.9428 23.057L17.8856 15.9998L24.9428 8.94265Z"
-                  fill="#142236"
-                />
-              </svg>
-            </div>
-          </div>
-          <div
-            className={
-              currentStyle.bikWrapper + ' ' + currentStyle.bikContainerPadding
-            }
-            style={
-              backgroundType === BACKGROUND_TYPE.COLOUR
-                ? { backgroundColor: backgroundColour }
-                : {
-                    background: `url(${isMobileDevice || isMobile ? backgroundImageMobile : backgroundImageDesktop})`,
-                    backgroundSize: 'contain',
-                    backgroundRepeat: 'round',
-                    backgroundPosition: 'top',
-                  }
-            }
-          >
-            <div id="bik-header1" className={currentStyle.bikHeaderContainer}>
-              <div
-                id={currentStyle.bikHeader}
-                style={{ fontFamily: fontFamily.name, color: fontColour }}
-              >
-                {parse(
-                  decodeTextHelper(
-                    multiLingualConfigurations?.[widgetLanguage]
-                      ?.playScreenHeading ?? playScreenHeading,
-                  ),
-                )}{' '}
-              </div>
-              <div
-                id={currentStyle.bikSubheader}
-                className={`${currentStyle.font16}, ${currentStyle.fontWeight400}`}
-                style={{
-                  fontFamily: fontFamily.name,
-                  color: fontColour,
-                  opacity: 0.8,
-                }}
-              >
-                {' '}
-                {parse(
-                  decodeTextHelper(
-                    multiLingualConfigurations?.[widgetLanguage]
-                      ?.playScreenSubHeading ?? playScreenSubHeading,
-                  ),
-                )}{' '}
-              </div>
-              <div
-                className={currentStyle.poweredBy}
-                style={{ opacity: 0.4 }}
-                onClick={() =>
-                  window.open(
-                    'https://bik.ai/?utm_campaign=Spin_The_Wheel_1&utm_medium=Widgets&utm_source=Powered_by_bik',
-                  )
-                }
-              >
-                <a
-                  target="_blank"
-                  rel="noreferrer"
-                  href="https://bik.ai/?utm_campaign=Spin_The_Wheel_1&utm_medium=Widgets&utm_source=Powered_by_bik"
-                  style={{ color: fontColour }}
-                >
-                  {languageUtils.getPoweredByMessage(widgetLanguage)}
-                </a>
-                <SVGFactory name={SVGName.BIK} color={fontColour} />
-              </div>
-            </div>
-            <div className={currentStyle.bikMainContainer}>
-              <div className={currentStyle.bikContainerSpinner}>
-                <div
-                  className={currentStyle.bikContainerInner}
-                  style={{ fontFamily: fontFamily.name }}
-                >
-                  <div className={currentStyle.bikContainerOverlay}></div>
-                  {segmentDetailsFinal.map((details, index) => {
-                    return (
-                      <div
-                        key={JSON.stringify(details)}
-                        className={
-                          currentStyle.bikSegment + ' ' + details.class
-                        }
-                        style={{
-                          backgroundColor: details.color,
-                          transform: `rotate(${details.rotationValue}deg)`,
-                          width: `${segmentWidth}px`,
-                          color:
-                            (index % 2 === 0
-                              ? segmentTextColor1
-                              : segmentTextColor2) ??
-                            addTextLuminance(details.color),
-                        }}
-                      >
-                        <span
-                          style={{
-                            color: 'inherit',
-                          }}
-                          className={currentStyle.bikCouponText}
-                        >
-                          {details.text}
-                        </span>
-                        <span
-                          id="testing"
-                          className={currentStyle.bikSegmentDivider}
-                          style={{
-                            transform: `rotate(-${segmentDividerAngle}deg)`,
-                          }}
-                        ></span>
-                      </div>
-                    );
-                  })}
-                </div>
-              </div>
-              <div
-                className={currentStyle.bikContainerSpin}
-                onClick={onSpinHandle}
-              >
-                <div className={currentStyle.bikSpinArrow}></div>
-                <div
-                  id="spin"
-                  className={currentStyle.bikSpinContent}
-                  style={{ backgroundColor: spinnerColor }}
-                >
-                  <div
-                    className={currentStyle.bikSpinLogo}
-                    style={{
-                      color: spinnerTextColor ?? addTextLuminance(spinnerColor),
-                    }}
-                  >
-                    SPIN
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-};
-
-export default Wheel;

package/src/widgets/ScratchCard/ScratchOff/scratchOff.tsx

@@ -1,157 +0,0 @@
-import React, { Component, ReactNode, RefObject } from 'react';
-
-interface ScratchOffProps {
-  width?: number;
-  height?: number;
-  coverImage?: string;
-  brushImage?: string;
-  children?: ReactNode;
-  onScratched: () => void;
-  scratchThreshold?: number; //0 to 1
-}
-
-interface ScratchOffState {
-  isScratching: boolean;
-  scratched: boolean;
-}
-
-const defaultScratchCover =
-  'data:image/png;base64,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';
-const defaultBrush =
-  'data:image/png;base64,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';
-
-class ScratchOff extends Component<ScratchOffProps, ScratchOffState> {
-  private canvasRef: RefObject<HTMLCanvasElement>;
-  private imageRef: RefObject<HTMLImageElement>;
-  private brushImage: HTMLImageElement;
-  private scratchThreshold: number;
-
-  constructor(props) {
-    super(props);
-    this.state = {
-      isScratching: false,
-      scratched: false,
-    };
-
-    this.canvasRef = React.createRef();
-    this.imageRef = React.createRef();
-    this.brushImage = new Image();
-    this.brushImage.src = defaultBrush;
-    this.scratchThreshold =
-      (this.props.width || 100) * (this.props.height || 40) * 0.5;
-  }
-
-  componentDidMount() {
-    this.initializeCanvas();
-  }
-
-  initializeCanvas() {
-    const canvas = this.canvasRef.current;
-    const ctx = canvas.getContext('2d');
-
-    // Set the size of the canvas
-    canvas.width = this.props.width || 200;
-    canvas.height = this.props.height || 40;
-
-    // Load the cover image
-    const image = new Image();
-    image.src = this.props.coverImage || defaultScratchCover;
-    image.onload = () => {
-      // Draw the image on the canvas
-      ctx!.drawImage(image, 0, 0, canvas.width, canvas.height);
-    };
-
-    // Set up event listeners for both mouse and touch events
-    canvas.addEventListener('mousedown', this.startScratching);
-    canvas.addEventListener('mousemove', this.handleScratching);
-    canvas.addEventListener('mouseup', this.stopScratching);
-    //canvas.addEventListener('mouseleave', this.stopScratching);
-
-    canvas.addEventListener('touchstart', this.startScratching);
-    canvas.addEventListener('touchmove', this.handleTouchScratching);
-    canvas.addEventListener('touchend', this.stopScratching);
-  }
-
-  startScratching = () => {
-    this.setState({ isScratching: true });
-  };
-
-  stopScratching = () => {
-    this.setState({ isScratching: false });
-  };
-
-  handleScratching = e => {
-    if (this.state.isScratching) {
-      this.scratch(e);
-    }
-  };
-
-  handleTouchScratching = e => {
-    if (this.state.isScratching) {
-      // Prevent the default touch move behavior, which may scroll the page
-      e.preventDefault();
-      this.scratch(e.touches[0]);
-    }
-  };
-
-  scratch(touch) {
-    const canvas = this.canvasRef.current;
-    const ctx = canvas.getContext('2d');
-    const { clientX, clientY } = touch;
-    const { left, top } = canvas.getBoundingClientRect();
-
-    // Calculate the position of the touch relative to the canvas
-    const x = clientX - left;
-    const y = clientY - top;
-
-    // Save the current context state to restore later
-    ctx!.save();
-
-    // Change the global composite operation to source-over for drawing the brush
-    ctx!.globalCompositeOperation = 'destination-out';
-
-    // Draw the brush image at the current touch position
-    ctx!.drawImage(
-      this.brushImage,
-      x - this.brushImage.width / 2,
-      y - this.brushImage.height / 2,
-    );
-
-    // Restore the previous context state
-    ctx!.restore();
-
-    // Check if the entire canvas has been scratched off (no visible cover)
-    const imageData = ctx!.getImageData(0, 0, canvas.width, canvas.height);
-    const clearedPixels = Array.from(imageData.data).filter(
-      value => value === 0,
-    ).length;
-
-    if (clearedPixels >= this.scratchThreshold) {
-      // If the threshold is met, automatically scratch the remaining area
-      this.autoScratch(canvas, ctx);
-    }
-  }
-
-  autoScratch(canvas, ctx) {
-    // Clear the entire canvas to reveal the content
-    ctx!.clearRect(0, 0, canvas.width, canvas.height);
-    // Draw the text or content
-    this.setState({ scratched: true });
-    this.props.onScratched();
-  }
-
-  render() {
-    const { scratched } = this.state;
-    const { children } = this.props;
-    return (
-      <div>
-        <canvas ref={this.canvasRef} style={{ cursor: 'pointer' }}>
-          Your browser does not support the HTML5 canvas element.
-        </canvas>
-        {scratched && children}
-      </div>
-    );
-  }
-}
-
-export default ScratchOff;

package/src/widgets/ScratchCard/config.ts

@@ -1,152 +0,0 @@
-const config = {
-  preview: false,
-  id: 'id',
-  environment: 'staging',
-  visibility: {
-    visiblePages: ['/*'],
-    triggers: {
-      fabButtonVisibility: true,
-      hasFAbButton: true,
-      isPlayable: false,
-      pageScroll: 10,
-      viewLimit: 2000,
-      playLimit: null,
-      timeDelay: null,
-      frequency: 24,
-      exitIntentTimeDelay: 1,
-    },
-  },
-  leadGeneration: {
-    mandatoryOption: {
-      isEmail: false,
-      isSms: false,
-      isWhatsapp: true,
-    },
-    optionalOption: {
-      isSms: true,
-      isWhatsapp: false,
-      isEmail: true,
-    },
-    optionalOptions: {
-      isSms: true,
-      isWhatsapp: false,
-      isEmail: true,
-    },
-  },
-  info: {
-    storeId: 'storeId',
-  },
-  widgetCustomisation: {
-    postPlayScreenBackgroundColour: '#ffffff',
-    winningScreenBackgroundColour: '#ffffff',
-    cardTitle: 'Scratch & Win!',
-    cardTheme: 'linear-gradient(220.24deg, #E8465E 26.59%, #FED56E 88.17%)',
-    cardDesktopImg:
-      'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2Fb14f911b-25e7-47f1-b8f4-59b1fdb11288?alt=media&token=2074d0e7-f7b4-4779-94dd-d24b77340dca',
-    cardMobileImg:
-      'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F03395f2c-c8d6-44e1-86f2-e45429da2621?alt=media&token=818eee8d-3157-4a33-ad3c-86b7e22dfd28',
-    fabBackgroundColor: '#000000',
-    fabMobileSize: 50,
-    fabWebSize: 50,
-    fabPosition: 'BOTTOM_RIGHT',
-    fabPositioner: {
-      bottom: '30px',
-      right: '30px',
-    },
-    iconColor: '#ffffff',
-    fabIconLink:
-      'https://storage.googleapis.com/bik-widget-mfe/bap%2Ffab-assets%2Ficons%2Fbik%2Fgift.svg',
-    imageType: 'TEXT_BASED',
-    backgroundImage:
-      'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2Fb14f911b-25e7-47f1-b8f4-59b1fdb11288?alt=media&token=2074d0e7-f7b4-4779-94dd-d24b77340dca',
-    scratchLayerColor: '#F5F5F5',
-    postPlayScreenTitle: '<p><strong>Special prize only for you!</strong></p>',
-    postPlayScreenSubTitle: '<p>You have won discount code</p>',
-    postPlayScreenButtonText: 'Claim the price',
-    postPlayScreenButtonTextColour: '#ffffff',
-    postPlayScreenButtonColour: '#000000',
-    winningScreenTitle: '<p><strong>Congratulations!</strong></p>',
-    winningScreenSubTitle: '<p>To claim prize fill the details below</p>',
-    winningScreenCouponBgColour: '#ffffff',
-    winningScreenCouponTextColour: '#000000',
-    winningScreenButtonColour: '#000000',
-    winningScreenButtonTextColour: '#ffffff',
-    winningScreenButtonText: 'Copy and use discount',
-    winningScreenIcon:
-      'https://storage.googleapis.com/bik-widget-mfe/bap%2Fpost-play-screen-assets%2Fimages%2Fbik%2FconfettiOne.png',
-    widgetName: 'Scratch the card sxmo',
-    backgroundType: 'colour',
-    backgroundColour: '#ffffff',
-    fontFamily: {
-      name: 'Inter',
-      link: 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap',
-    },
-    fontColour: '#000000',
-    multiLingualConfigurations: {
-      ENGLISH: {
-        cardTitle: 'Scratch & Win!',
-        postPlayScreenTitle:
-          '<p><strong>Special prize only for you!</strong></p>',
-        postPlayScreenSubTitle: '<p>You have won discount code</p>',
-        postPlayScreenButtonText: 'Claim the price',
-        winningScreenTitle: '<p><strong>Congratulations!</strong></p>',
-        winningScreenSubTitle: '<p>To claim prize fill the details below</p>',
-        winningScreenButtonText: 'Copy and use discount',
-      },
-      ARABIC: {
-        cardTitle: 'خدش واربح!',
-        postPlayScreenTitle: '<p><strong>جائزة خاصة فقط لك!</strong></p>',
-        postPlayScreenSubTitle: '<p>لقد فزت برمز خصم</p>',
-        postPlayScreenButtonText: 'ادعي السعر',
-        winningScreenTitle: '<p><strong>تهانينا!</strong></p>',
-        winningScreenSubTitle:
-          '<p>للحصول على الجائزة، قم بملء التفاصيل أدناه</p>',
-        winningScreenButtonText: 'انسخ واستخدم الخصم',
-      },
-      FRENCH: {
-        cardTitle: 'Grattez et gagnez!',
-        postPlayScreenTitle:
-          '<p><strong>Prix spécial uniquement pour vous!</strong></p>',
-        postPlayScreenSubTitle: '<p>Vous avez gagné un code de réduction</p>',
-        postPlayScreenButtonText: 'Réclamer le prix',
-        winningScreenTitle: '<p><strong>Félicitations!</strong></p>',
-        winningScreenSubTitle:
-          '<p>Pour réclamer le prix, remplissez les détails ci-dessous</p>',
-        winningScreenButtonText: 'Copier et utiliser la réduction',
-      },
-      SPANISH: {
-        cardTitle: '¡Rasca y gana!',
-        postPlayScreenTitle:
-          '<p><strong>¡Premio especial solo para ti!</strong></p>',
-        postPlayScreenSubTitle: '<p>Has ganado un código de descuento</p>',
-        postPlayScreenButtonText: 'Reclama el precio',
-        winningScreenTitle: '<p><strong>¡Felicidades!</strong></p>',
-        winningScreenSubTitle:
-          '<p>Para reclamar el premio, complete los detalles a continuación</p>',
-        winningScreenButtonText: 'Copiar y usar el descuento',
-      },
-      MALAY: {
-        cardTitle: 'Gores dan Menang!',
-        postPlayScreenTitle:
-          '<p><strong>Hadiah istimewa hanya untuk anda!</strong></p>',
-        postPlayScreenSubTitle: '<p>Anda telah memenangi kod diskaun</p>',
-        postPlayScreenButtonText: 'Tuntut hadiah',
-        winningScreenTitle: '<p><strong>Tahniah!</strong></p>',
-        winningScreenSubTitle:
-          '<p>Untuk menuntut hadiah, isikan butiran di bawah</p>',
-        winningScreenButtonText: 'Salin dan gunakan diskaun',
-      },
-    },
-    discountTitle: 'af',
-  },
-  storeWidgetConfig: {
-    '/*': [
-      {
-        widgetId: 'id',
-        fabPosition: 'BOTTOM_LEFT',
-      },
-    ],
-  },
-};
-
-export default config;