@livechat/widget-vue/v2/LiveChatWidget.esm.js

This library allows to render and interact with the LiveChat Chat Widget inside a Vue 3 application

import { createWidget } from '@livechat/widget-core';

function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    enumerableOnly && (symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    })), keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = null != arguments[i] ? arguments[i] : {};
    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
      _defineProperty(target, key, source[key]);
    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
    });
  }

  return target;
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

var TextWidget = defineWidget('textapp');
var LiveChatWidget = defineWidget('livechat');

function defineWidget(product) {
  return {
    props: _objectSpread2({
      license: {
        type: String,
        required: false,
        "default": undefined
      },
      organizationId: {
        type: String,
        required: false,
        "default": undefined
      },
      group: {
        type: String,
        required: false,
        "default": undefined
      },
      visibility: {
        type: String,
        required: false,
        "default": undefined
      },
      customerName: {
        type: String,
        required: false,
        "default": undefined
      },
      customerEmail: {
        type: String,
        required: false,
        "default": undefined
      },
      sessionVariables: {
        type: Object,
        required: false,
        "default": undefined
      },
      chatBetweenGroups: {
        type: Boolean,
        required: false,
        "default": undefined
      },
      customIdentityProvider: {
        type: Function,
        required: false,
        "default": undefined
      }
    }, {
      env: {
        type: String,
        required: false,
        "default": undefined
      }
    }),
    emits: ['ready', 'new-event', 'form-submitted', 'rating-submitted', 'greeting-hidden', 'greeting-displayed', 'visibility-changed', 'customer-status-changed', 'rich-message-button-clicked', 'availability-changed'],
    data: function data() {
      return {
        widget: null
      };
    },
    watch: {
      license: 'reinitialize',
      organizationId: 'reinitialize',
      group: 'reinitialize',
      chatBetweenGroups: 'reinitialize',
      env: 'reinitialize',
      visibility: function visibility(_visibility) {
        var _this$widget;

        (_this$widget = this.widget) === null || _this$widget === void 0 ? void 0 : _this$widget.updateVisibility(_visibility);
      },
      customerName: function customerName(name) {
        var _this$widget2;

        (_this$widget2 = this.widget) === null || _this$widget2 === void 0 ? void 0 : _this$widget2.updateCustomerData({
          name: name
        });
      },
      customerEmail: function customerEmail(email) {
        var _this$widget3;

        (_this$widget3 = this.widget) === null || _this$widget3 === void 0 ? void 0 : _this$widget3.updateCustomerData({
          email: email
        });
      },
      sessionVariables: function sessionVariables(_sessionVariables) {
        var _this$widget4;

        (_this$widget4 = this.widget) === null || _this$widget4 === void 0 ? void 0 : _this$widget4.updateSessionVariables(_sessionVariables);
      }
    },
    mounted: function mounted() {
      this.setupWidget();
    },
    unmounted: function unmounted() {
      var _this$widget5;

      (_this$widget5 = this.widget) === null || _this$widget5 === void 0 ? void 0 : _this$widget5.destroy();
    },
    methods: {
      setupWidget: function setupWidget() {
        var _this = this;

        var config = {
          group: this.group,
          license: this.license,
          organizationId: this.organizationId,
          customerName: this.customerName,
          customerEmail: this.customerEmail,
          sessionVariables: this.sessionVariables,
          chatBetweenGroups: this.chatBetweenGroups,
          visibility: this.visibility,
          customIdentityProvider: this.customIdentityProvider,
          env: this.$props.env,
          onReady: function onReady(data) {
            return _this.$emit('ready', data);
          },
          onNewEvent: function onNewEvent(event) {
            return _this.$emit('new-event', event);
          },
          onFormSubmitted: function onFormSubmitted(form) {
            return _this.$emit('form-submitted', form);
          },
          onRatingSubmitted: function onRatingSubmitted(rating) {
            return _this.$emit('rating-submitted', rating);
          },
          onGreetingHidden: function onGreetingHidden(greeting) {
            return _this.$emit('greeting-hidden', greeting);
          },
          onGreetingDisplayed: function onGreetingDisplayed(greeting) {
            return _this.$emit('greeting-displayed', greeting);
          },
          onVisibilityChanged: function onVisibilityChanged(visibility) {
            return _this.$emit('visibility-changed', visibility);
          },
          onCustomerStatusChanged: function onCustomerStatusChanged(status) {
            return _this.$emit('customer-status-changed', status);
          },
          onRichMessageButtonClicked: function onRichMessageButtonClicked(button) {
            return _this.$emit('rich-message-button-clicked', button);
          },
          onAvailabilityChanged: function onAvailabilityChanged(availability) {
            return _this.$emit('availability-changed', availability);
          }
        };
        this.widget = createWidget(config);
        window.__lc.integration_name = "@livechat/widget-vue/v2";

        if (product === 'textapp') {
          window.__lc.product_name = 'text';
        }

        this.widget.init();
      },
      reinitialize: function reinitialize() {
        var _this$widget6;

        (_this$widget6 = this.widget) === null || _this$widget6 === void 0 ? void 0 : _this$widget6.destroy();
        this.setupWidget();
      }
    },
    render: function render() {
      return null;
    }
  };
}

export { LiveChatWidget, TextWidget };