@telia-ace/widget-conversation 1.0.0

package/lib-esm/conversation-controller.js

@@ -0,0 +1,294 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { FormBuilder } from '@telia-ace/widget-forms';
+import { uuid } from '@telia-ace/widget-utilities';
+import { ConversationProvider } from './conversation-provider';
+import { User } from './user';
+var ConversationEntry = /** @class */ (function () {
+    function ConversationEntry(writer) {
+        this.writer = writer;
+    }
+    ConversationEntry.prototype.update = function (content) {
+        var normalized = typeof content === 'string' ? { body: content } : content;
+        this.writer(normalized);
+    };
+    ConversationEntry.prototype.remove = function () {
+        this.writer(null);
+    };
+    return ConversationEntry;
+}());
+export { ConversationEntry };
+export var ConversationMessageType;
+(function (ConversationMessageType) {
+    ConversationMessageType["User"] = "user";
+    ConversationMessageType["Agent"] = "agent";
+    ConversationMessageType["System"] = "system";
+})(ConversationMessageType || (ConversationMessageType = {}));
+export var getNormalizedMessageSettings = function (settings) {
+    var content;
+    var key = uuid();
+    var timestamp = Date.now();
+    if (typeof settings === 'string') {
+        content = { body: settings };
+    }
+    else if (settings.type) {
+        content = __assign({}, settings);
+    }
+    else {
+        content = {
+            body: settings.body,
+            actions: settings.actions,
+            title: settings.title,
+        };
+        if (settings.key) {
+            key = settings.key;
+        }
+        if (settings.timestamp) {
+            timestamp = settings.timestamp;
+        }
+        if (settings.form) {
+            var builder = FormBuilder.create(key);
+            settings.form(builder);
+            var builtForm = builder.get();
+            content.form = builtForm;
+        }
+        if (settings.timestamp === null) {
+            timestamp = null;
+        }
+    }
+    return { content: content, key: key, timestamp: timestamp };
+};
+var removeTypingState = function (typingActors, sender) {
+    if (!sender) {
+        return;
+    }
+    var senderString = JSON.stringify(sender);
+    var indexToRemove = typingActors.findIndex(function (item) {
+        return senderString === JSON.stringify(item);
+    });
+    if (indexToRemove > -1) {
+        return typingActors.splice(indexToRemove, 1);
+    }
+};
+/**
+ * Manages the stream of messages inside a `ConversationComponent` and provides external read-write
+ * access to it as well as exposing emitted actions.
+ */
+var ConversationController = /** @class */ (function () {
+    function ConversationController(container, id) {
+        var _this = this;
+        this.container = container;
+        this.id = id;
+        this.formHandlers = {};
+        /**
+         * Represents the current end user.
+         */
+        this.user = new User(this);
+        this.providers = [];
+        this.active = false;
+        this.registeredProviders = [];
+        this.loaders = 0;
+        this.componentMounted = false;
+        this.messages = [];
+        this.typingActors = [];
+        this.print = function (settings) {
+            var normalized = getNormalizedMessageSettings(settings);
+            return _this.createEntry(normalized.key, normalized.content, ConversationMessageType.System, undefined, normalized.timestamp);
+        };
+        var widget = container.get('$widget');
+        this.events = widget.events.createChild(this);
+    }
+    ConversationController.prototype.setProviders = function (providers) {
+        var _this = this;
+        var removed = [];
+        var added = [];
+        // remove
+        this.providers
+            .reduce(function (acc, provider) {
+            if (providers.indexOf(provider) === -1) {
+                acc.push(provider);
+            }
+            return acc;
+        }, [])
+            .forEach(function (providerToRemove) {
+            var indexToRemove = _this.providers.indexOf(providerToRemove);
+            if (indexToRemove > -1) {
+                removed.push(providerToRemove);
+                _this.providers.splice(indexToRemove, 1);
+            }
+        });
+        // add
+        providers.forEach(function (provider) {
+            if (_this.providers.indexOf(provider) === -1) {
+                added.push(provider);
+                _this.providers.push(provider);
+            }
+        });
+        if (added.length || removed.length) {
+            this.events.dispatch('conversation:providers-changed', { added: added, removed: removed });
+        }
+    };
+    ConversationController.prototype.createProvider = function (name) {
+        var index = this.providerIndex(name);
+        if (index > -1) {
+            return this.registeredProviders[index];
+        }
+        var provider = ConversationProvider.create(name, this.container, this);
+        this.registeredProviders.push(provider);
+        return provider;
+    };
+    ConversationController.prototype.providerIndex = function (name) {
+        return this.registeredProviders.findIndex(function (p) { return p.name === name; });
+    };
+    ConversationController.prototype.dispose = function () {
+        this.registeredProviders.forEach(function (provider) { return provider.dispose(); });
+        this.messages = [];
+        this.events.dispatch('conversation:controller-disposed', this);
+        this.active = false;
+    };
+    ConversationController.prototype.onDispose = function (fn) {
+        return this.events.subscribe('conversation:controller-disposed', fn);
+    };
+    ConversationController.prototype.onStarted = function (fn) {
+        return this.events.subscribe('conversation:started', fn);
+    };
+    ConversationController.prototype.disposeProvider = function (target) {
+        var index = this.providerIndex(target.name);
+        index > -1 && this.registeredProviders.splice(index, 1);
+        this.events.dispatch('conversation:providers-changed', { removed: [target.name] });
+        if (!this.registeredProviders.length) {
+            this.dispose();
+        }
+    };
+    ConversationController.prototype.onProvidersChange = function (fn) {
+        return this.events.subscribe('conversation:providers-changed', fn);
+    };
+    ConversationController.prototype.setComponentMountedState = function (mounted) {
+        if (this.componentMounted === mounted) {
+            return;
+        }
+        this.componentMounted = mounted;
+        if (mounted) {
+            this.events.dispatch('conversation:unread-message', false);
+            this.events.dispatch('conversation:started', true);
+            this.active = true;
+        }
+        this.events.dispatch('conversation:component-mount-changed', mounted);
+    };
+    ConversationController.prototype.getComponentMountedState = function () {
+        return this.componentMounted;
+    };
+    ConversationController.prototype.onUnreadMessage = function (fn) {
+        return this.events.subscribe('conversation:unread-message', fn);
+    };
+    ConversationController.prototype.createEntry = function (key, content, type, sender, timestamp) {
+        var _this = this;
+        var message = {
+            key: key,
+            content: content,
+            type: type,
+            sender: sender || null,
+            timestamp: timestamp || timestamp === null ? timestamp : Date.now(),
+        };
+        this.messages.push(message);
+        message.type === ConversationMessageType.Agent &&
+            removeTypingState(this.typingActors, sender);
+        var entry = new ConversationEntry(function (updated) {
+            if (updated !== null) {
+                var _a = updated.timestamp, updatedTimestamp = _a === void 0 ? undefined : _a, content_1 = __rest(updated, ["timestamp"]);
+                message.content = content_1;
+                if (updatedTimestamp) {
+                    message.timestamp = updatedTimestamp;
+                }
+            }
+            else {
+                var indexToRemove = _this.messages.indexOf(message);
+                message.content = null;
+                if (indexToRemove > -1) {
+                    _this.messages.splice(indexToRemove, 1);
+                }
+            }
+            _this.events.dispatch('conversation:message-updated', { message: message });
+            _this.update();
+        });
+        this.events.dispatch('conversation:message-created', { message: message });
+        this.update();
+        if (!this.componentMounted) {
+            this.events.dispatch('conversation:unread-message', true);
+        }
+        return entry;
+    };
+    ConversationController.prototype.update = function () {
+        this.events.dispatch('conversation:updated', {
+            messages: this.messages,
+            loading: this.loaders > 0,
+            typingActors: this.typingActors,
+        });
+    };
+    ConversationController.prototype.getMessageStream = function () {
+        return {
+            messages: this.messages,
+            loading: this.loaders > 0,
+            typingActors: this.typingActors,
+        };
+    };
+    ConversationController.prototype.setTypingState = function (sender, type) {
+        var _this = this;
+        if (this.typingActors.indexOf(sender) === -1) {
+            this.typingActors.push(sender);
+            this.update();
+        }
+        return function () {
+            removeTypingState(_this.typingActors, sender);
+            _this.update();
+        };
+    };
+    /**
+     * Displays a loader in the conversation.
+     */
+    ConversationController.prototype.loader = function () {
+        var _this = this;
+        this.loaders = this.loaders + 1;
+        var dismissed = false;
+        if (this.loaders === 1) {
+            this.update();
+        }
+        return function () {
+            if (!dismissed) {
+                dismissed = true;
+                _this.loaders = _this.loaders - 1;
+                if (_this.loaders === 0) {
+                    _this.update();
+                }
+            }
+        };
+    };
+    ConversationController.prototype.submitForm = function (key, handler) {
+        this.formHandlers[key] = __assign(__assign({}, this.formHandlers[key]), { submit: handler });
+    };
+    ConversationController.prototype.validateForm = function (key, handler) {
+        this.formHandlers[key] = __assign(__assign({}, this.formHandlers[key]), { validate: handler });
+    };
+    return ConversationController;
+}());
+export { ConversationController };

package/lib-esm/conversation-form-adapter.d.ts

@@ -0,0 +1,7 @@
+import { ConversationPlatform } from '.';
+export declare class ConversationFormAdapter {
+    private platform;
+    constructor(platform: ConversationPlatform);
+    submit: (invoke: any, cancel: any) => (contactMethod: any) => Promise<any>;
+    updateContactMethod: (contactMethod: any, errors?: any) => void;
+}

package/lib-esm/conversation-form-adapter.js

@@ -0,0 +1,85 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var ConversationFormAdapter /*implements Adapter*/ = /** @class */ (function () {
+    function ConversationFormAdapter(platform) {
+        var _this = this;
+        this.platform = platform;
+        this.submit = function (invoke /*InvokeAdapterDelegate*/, cancel /*CancelAdapterDelegate*/) {
+            return function (contactMethod) { return __awaiter(_this, void 0, void 0, function () { return __generator(this, function (_a) {
+                return [2 /*return*/];
+            }); }); };
+        };
+        // this.platform.container
+        //   .getAsync('data')
+        //   .then((dataSource: any/* DataSource */) =>
+        //     dataSource
+        //       .read()
+        //       .then((entries: any) => {
+        //         const { entryId } = contactMethod;
+        //         const entry = entries.find((e: any) => e.id === entryId);
+        //         if (entry) {
+        //           const { submit, validate } = this.platform.formHandlers[entry.content.key];
+        //           const { values } = { values: {} }/*extractFormValues(contactMethod.body.form)*/;
+        //           if (validate) {
+        //             return validate(values)
+        //               .then((result) => {
+        //                 const { valid, errors } = result;
+        //                 if (valid) {
+        //                   return submit(values)
+        //                     .then(() => {
+        //                       this.updateContactMethod(contactMethod);
+        //                       return {};
+        //                     });
+        //                 }
+        //                 this.updateContactMethod(contactMethod, errors);
+        //                 return {};
+        //               });
+        //           }
+        //           return submit(values)
+        //             .then(() => {
+        //               this.updateContactMethod(contactMethod);
+        //               return {};
+        //             });
+        //         }
+        //         return {};
+        //       }),
+        // )
+        this.updateContactMethod = function (contactMethod, errors) { };
+    }
+    return ConversationFormAdapter;
+}());
+export { ConversationFormAdapter };

package/lib-esm/conversation-platform.d.ts

@@ -0,0 +1,49 @@
+import { ComponentNodeController, ComponentPlatform } from '@telia-ace/widget-core';
+import { RouteData } from '@telia-ace/widget-routing';
+import { Container, EventManager, EventSubscriptionCancellation } from '@webprovisions/platform';
+import { ConversationController } from './conversation-controller';
+import { ConversationProvider } from './conversation-provider';
+export declare type ConversationHandler = (conversation: ConversationProvider, component: ComponentNodeController) => void | (() => void);
+export declare type UnregisterControllerDelegate = () => void;
+export declare type ConversationProviderRegistration = {
+    name: string;
+    handler: ConversationHandler;
+};
+export declare enum ConversationEndedBehavior {
+    Deactivate = "deactivate",
+    Navigate = "navigate",
+    None = "none"
+}
+export declare type SessionInfo = {
+    id?: string;
+    route?: RouteData;
+    conversationEndedBehavior?: ConversationEndedBehavior;
+};
+export declare class ConversationPlatform {
+    private container;
+    private components;
+    events: EventManager;
+    private controllers;
+    private providers;
+    private disposeProviders;
+    private subscriptions;
+    private storageWriter;
+    private router;
+    private buttonQuery;
+    private sessionInfo;
+    constructor(container: Container, components: ComponentPlatform);
+    initialize(): void;
+    addSubscription(sub: EventSubscriptionCancellation): void;
+    static getInstance(container: Container, key?: string): Promise<ConversationPlatform>;
+    navigateToConversationIfActive(id: string): Promise<void>;
+    setConversationEndedBehavior(behavior: ConversationEndedBehavior): Promise<void>;
+    createController(id: string): ConversationController;
+    registerProvider(name: string, handler: ConversationHandler): void;
+    registerController(conversation: ConversationController, component: ComponentNodeController): boolean;
+    private writeToComponents;
+    private invokeHandler;
+    getComponentRoute(): Promise<RouteData | undefined>;
+    dispose(): void;
+    static handleContactMethodClick(event: any, container: Container, contactMethod: any, callback?: Function): Promise<void>;
+    static handleContactMethodSubmit(container: Container, contactMethod: any): Promise<any>;
+}