@kontent-ai/smart-link
Version:
Kontent.ai Smart Link SDK allowing to automatically inject [smart links](https://docs.kontent.ai/tutorials/develop-apps/build-strong-foundation/set-up-editing-from-preview#a-using-smart-links) to Kontent.ai according to manually specified [HTML data attri
131 lines • 5.86 kB
JavaScript
import { isInsideIFrame } from './utils/iframe';
import { DOMSmartLinkManager } from './lib/DOMSmartLinkManager';
import { createStorage } from './utils/storage';
import { IFrameCommunicator } from './lib/IFrameCommunicator';
import { IFrameMessageType, } from './lib/IFrameCommunicatorTypes';
import { watchQueryParamPresence } from './utils/queryParams';
import { defineAllRequiredWebComponents } from './web-components/components';
import { defaultConfiguration } from './utils/configuration';
import { setLogLevel, LogLevel } from './lib/Logger';
import { reload } from './utils/reload';
import { addListener, emitEvents, removeListener } from './utils/events';
export var KontentSmartLinkEvent;
(function (KontentSmartLinkEvent) {
KontentSmartLinkEvent["Refresh"] = "refresh";
KontentSmartLinkEvent["Update"] = "update";
})(KontentSmartLinkEvent || (KontentSmartLinkEvent = {}));
class KontentSmartLinkSDK {
configuration = defaultConfiguration;
iframeCommunicator;
domSmartLinkManager;
events;
queryPresenceIntervalCleanup = null;
constructor(configuration) {
this.configuration = { ...this.configuration, ...configuration };
this.events = new Map();
this.iframeCommunicator = new IFrameCommunicator();
this.domSmartLinkManager = new DOMSmartLinkManager(this.iframeCommunicator, this.configuration);
this.initialize();
}
static getSettingsStorage() {
return createStorage('kontent-smart-link:iframe-settings');
}
initialize = async () => {
await defineAllRequiredWebComponents();
const level = this.configuration.debug ? LogLevel.Debug : LogLevel.Info;
setLogLevel(level);
if (this.configuration.queryParam) {
this.queryPresenceIntervalCleanup = watchQueryParamPresence(this.configuration.queryParam, this.domSmartLinkManager.toggle);
}
else {
this.domSmartLinkManager.enable();
}
if (isInsideIFrame()) {
this.initializeIFrameCommunication();
}
};
destroy = () => {
this.events = new Map();
this.queryPresenceIntervalCleanup?.();
this.iframeCommunicator.destroy();
this.domSmartLinkManager.destroy();
};
updateConfiguration = (configuration) => {
if (configuration.queryParam !== undefined) {
if (configuration.queryParam === '') {
this.domSmartLinkManager.enable();
}
else if (configuration.queryParam !== this.configuration.queryParam) {
this.queryPresenceIntervalCleanup?.();
this.queryPresenceIntervalCleanup = watchQueryParamPresence(configuration.queryParam, this.domSmartLinkManager.toggle);
}
}
if (configuration.debug) {
setLogLevel(LogLevel.Debug);
}
// need to use .assign to prevent changing the reference of the configuration object
Object.assign(this.configuration, configuration);
};
on = (event, handler) => {
addListener(this.events, event, handler);
};
off = (event, handler) => {
removeListener(this.events, event, handler);
};
initializeIFrameCommunication = () => {
this.iframeCommunicator.initialize();
const storage = KontentSmartLinkSDK.getSettingsStorage();
const settings = storage.get();
const enabled = settings !== null ? settings?.enabled : true;
const messageData = {
enabled,
languageCodename: this.configuration.defaultDataAttributes.languageCodename ?? null,
projectId: this.configuration.defaultDataAttributes.environmentId ?? null,
supportedFeatures: {
previewIFrameCurrentUrlHandler: true,
refreshHandler: true,
updateHandler: true,
},
};
this.iframeCommunicator.sendMessageWithResponse(IFrameMessageType.Initialized, messageData, () => {
Object.assign(this.configuration, { isInsideWebSpotlight: true });
this.queryPresenceIntervalCleanup?.();
this.domSmartLinkManager.disable();
if (enabled) {
this.domSmartLinkManager.enable();
}
this.iframeCommunicator.addMessageListener(IFrameMessageType.Status, this.handleStatusMessage);
this.iframeCommunicator.addMessageListener(IFrameMessageType.RefreshPreview, this.handleRefreshMessage);
this.iframeCommunicator.addMessageListener(IFrameMessageType.UpdatePreview, this.handleUpdateMessage);
this.iframeCommunicator.addMessageListener(IFrameMessageType.PreviewIFrameCurrentUrl, this.handlePreviewIFrameCurrentUrlRequestMessage);
});
};
handleStatusMessage = (data) => {
if (!data || !this.domSmartLinkManager)
return;
this.domSmartLinkManager.toggle(data.enabled);
KontentSmartLinkSDK.getSettingsStorage().set({
enabled: data.enabled,
});
};
handleRefreshMessage = (data, metadata) => {
const isCustomRefreshHandlerImplemented = this.events.has(KontentSmartLinkEvent.Refresh);
if (isCustomRefreshHandlerImplemented) {
emitEvents(this.events, KontentSmartLinkEvent.Refresh, data, metadata, reload);
}
else {
reload();
}
};
handleUpdateMessage = (data) => {
emitEvents(this.events, KontentSmartLinkEvent.Update, data, undefined, undefined);
};
handlePreviewIFrameCurrentUrlRequestMessage = () => {
const messageData = {
previewUrl: window.location.href,
};
this.iframeCommunicator.sendMessage(IFrameMessageType.PreviewIFrameCurrentUrlResponse, messageData);
};
}
export default KontentSmartLinkSDK;
//# sourceMappingURL=sdk.js.map