Using NPM

Install the Corgi Widget package via npm:

npm install corgi-widget

Example of using Corgi Widget in a JavaScript file:

import CorgiWidget from 'corgi-widget';

document.addEventListener('DOMContentLoaded', () => {
    CorgiWidget.initializeWidget();
});

Add the widget to your HTML:

<div id="corgi-widget" corgi-partner="1" corgi-style="popup"></div>

General Example for Web Frameworks

The Corgi Widget can be used in various web frameworks and libraries. The general approach involves importing the widget and initializing it in the appropriate lifecycle hook of the framework you are using.

Example Using React:

1. Create a React Component: Create a React component that initializes the widget. For example, create a file named CorgiWidgetComponent.jsx:

import React, { useEffect } from 'react';
import CorgiWidget from 'corgi-widget';

const CorgiWidgetComponent = () => {
    useEffect(() => {
        CorgiWidget.initializeWidget();
    }, []);

    return (
        <div id="corgi-widget" corgi-partner="1" corgi-style="popup"></div>
    );
};

export default CorgiWidgetComponent;

1. Include the Component in Your Application: Use the CorgiWidgetComponent in your main application component. For example, update App.jsx:

import React from 'react';
import CorgiWidgetComponent from './CorgiWidgetComponent';

const App = () => {
    return (
        <div>
            <h1>Corgi Widget Test</h1>
            <CorgiWidgetComponent />
        </div>
    );
};

export default App;