@telia-ace/knowledge-widget-adapters 1.0.1

package/lib-esm/contact-methods/phone/index.d.ts

@@ -0,0 +1 @@
+export { default as PhonePlugin } from './phone-plugin';

package/lib-esm/contact-methods/phone/index.js

@@ -0,0 +1 @@
+export { default as PhonePlugin } from './phone-plugin';

package/lib-esm/contact-methods/phone/phone-component.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { ContactMethodProps } from '../ui';
+declare const PhoneComponent: React.SFC<ContactMethodProps>;
+export default PhoneComponent;

package/lib-esm/contact-methods/phone/phone-component.js

@@ -0,0 +1,10 @@
+import { appendClassNames } from '@telia-ace/widget-utilities';
+var PhoneComponent = function (_a) {
+    var className = _a.className, phoneNumber = _a.body.phoneNumber, _b = _a.renderDefault, renderDefault = _b === void 0 ? function () { } : _b;
+    return renderDefault({
+        title: phoneNumber,
+        className: appendClassNames(className, 'humany-contact-method-phone'),
+        href: "tel: ".concat(phoneNumber),
+    });
+};
+export default PhoneComponent;

package/lib-esm/contact-methods/phone/phone-plugin.d.ts

@@ -0,0 +1,2 @@
+import { Container } from '@webprovisions/platform';
+export default function phonePlugin(container: Container): void;

package/lib-esm/contact-methods/phone/phone-plugin.js

@@ -0,0 +1,8 @@
+export default function phonePlugin(container) {
+    container.getAsync('contactMethods').then(function (platform) {
+        platform.create({
+            clientName: 'phone.text',
+            render: import('./phone-component'),
+        });
+    });
+}

package/lib-esm/contact-methods/platform.d.ts

@@ -0,0 +1,49 @@
+import { ComponentPlatform } from '@telia-ace/knowledge-widget-core';
+import { Form } from '@telia-ace/widget-forms';
+import { Container } from '@webprovisions/platform';
+import React from 'react';
+import { ContactMethodProps } from './ui';
+export declare type ReactComponentImport = Promise<{
+    default: React.FunctionComponent<any>;
+}>;
+export declare type Click = (e: React.MouseEvent, cm: ContactMethodProps) => void;
+export declare type AdapterSettings = {
+    clientName: string;
+    render: string | ReactComponentImport;
+    handleDescription?: (cm: ContactMethodProps) => Promise<string> | string;
+    handleDisabled?: (cm: ContactMethodProps) => Promise<boolean> | boolean;
+    handleClick?: (cm: ContactMethodProps) => Promise<Click> | Click;
+    onEvaluate?: (cm: ContactMethodProps) => Promise<Form> | Form;
+    onValidate?: (cm: ContactMethodProps) => Promise<ValidationResult> | ValidationResult;
+    onSubmit?: (cm: ContactMethodProps) => Promise<string> | string;
+    onComplete?: (cm: ContactMethodProps) => Promise<void> | void;
+};
+export declare type ValidationResult = {
+    errors?: {
+        [key: string]: string;
+    };
+    errorTypes?: {
+        [key: string]: string;
+    };
+    valid: boolean;
+};
+export declare enum ContactMethodTrackTypes {
+    ContactMethodValidate = "contact-method-validate",
+    ContactMethodComplete = "contact-method-complete"
+}
+declare class ContactMethodPlatform {
+    private container;
+    private componentPlatform;
+    private adapters;
+    private subs;
+    static create(container: Container): Promise<ContactMethodPlatform>;
+    constructor(container: Container, componentPlatform: ComponentPlatform);
+    private track;
+    complete(contactMethod: ContactMethodProps): void | Promise<void>;
+    evaluate(contactMethod: ContactMethodProps): Promise<Form>;
+    validate(contactMethod: ContactMethodProps): Promise<ValidationResult>;
+    submit(contactMethod: ContactMethodProps): Promise<string>;
+    create(settings: AdapterSettings): Promise<void>;
+    dispose(): void;
+}
+export default ContactMethodPlatform;

package/lib-esm/contact-methods/platform.js

@@ -0,0 +1,253 @@
+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 __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 };
+    }
+};
+import { ComponentPlatform } from '@telia-ace/knowledge-widget-core';
+import { lazy } from 'react';
+import { defaultComplete, defaultEvaluate, defaultValidate } from './email';
+export var ContactMethodTrackTypes;
+(function (ContactMethodTrackTypes) {
+    ContactMethodTrackTypes["ContactMethodValidate"] = "contact-method-validate";
+    ContactMethodTrackTypes["ContactMethodComplete"] = "contact-method-complete";
+})(ContactMethodTrackTypes || (ContactMethodTrackTypes = {}));
+var handleContactMethod = function (adapters, contactMethod) { return __awaiter(void 0, void 0, void 0, function () {
+    var adapter, description, disabled, onClick, handleClick, handleDescription, handleDisabled;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                adapter = adapters.get(contactMethod.clientName);
+                description = contactMethod.description, disabled = contactMethod.disabled, onClick = contactMethod.onClick;
+                if (!adapter) return [3 /*break*/, 6];
+                handleClick = adapter.handleClick, handleDescription = adapter.handleDescription, handleDisabled = adapter.handleDisabled;
+                if (!(typeof handleClick === 'function')) return [3 /*break*/, 2];
+                return [4 /*yield*/, Promise.resolve(handleClick(contactMethod))];
+            case 1:
+                onClick = _a.sent();
+                _a.label = 2;
+            case 2:
+                if (!(typeof handleDescription === 'function')) return [3 /*break*/, 4];
+                return [4 /*yield*/, Promise.resolve(handleDescription(contactMethod))];
+            case 3:
+                description = _a.sent();
+                _a.label = 4;
+            case 4:
+                if (!(typeof handleDisabled === 'function')) return [3 /*break*/, 6];
+                return [4 /*yield*/, Promise.resolve(handleDisabled(contactMethod))];
+            case 5:
+                disabled = _a.sent();
+                _a.label = 6;
+            case 6: return [2 /*return*/, Promise.resolve(__assign(__assign({}, contactMethod), { description: description, disabled: disabled, onClick: onClick }))];
+        }
+    });
+}); };
+var ContactMethodPlatform = /** @class */ (function () {
+    function ContactMethodPlatform(container, componentPlatform) {
+        var _this = this;
+        this.container = container;
+        this.componentPlatform = componentPlatform;
+        this.adapters = new Map();
+        this.subs = [];
+        if (componentPlatform) {
+            var contactListComponent = componentPlatform
+                .components()
+                .ofType('contact-list')
+                .select();
+            contactListComponent.actions.watch('contact-list.fetched', function (input, next) { return __awaiter(_this, void 0, void 0, function () {
+                var contactMethods, promises;
+                var _this = this;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            contactMethods = input.contactMethods;
+                            if (!contactMethods) return [3 /*break*/, 2];
+                            promises = Promise.all(contactMethods.map(function (cm) {
+                                return handleContactMethod(_this.adapters, cm);
+                            }));
+                            return [4 /*yield*/, Promise.resolve(promises).then(function (contactMethods) {
+                                    input.contactMethods = contactMethods;
+                                })];
+                        case 1:
+                            _a.sent();
+                            _a.label = 2;
+                        case 2: return [2 /*return*/, next(input)];
+                    }
+                });
+            }); });
+            var guideComponent = componentPlatform.components().ofType('guide').select();
+            guideComponent.actions.watch('guide.fetched', function (input, next) { return __awaiter(_this, void 0, void 0, function () {
+                var contactMethods, promises;
+                var _this = this;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            contactMethods = input.contactMethods;
+                            if (!contactMethods) return [3 /*break*/, 2];
+                            promises = Promise.all(contactMethods.map(function (cm) {
+                                return handleContactMethod(_this.adapters, cm);
+                            }));
+                            return [4 /*yield*/, Promise.resolve(promises).then(function (contactMethods) {
+                                    input.contactMethods = contactMethods;
+                                })];
+                        case 1:
+                            _a.sent();
+                            _a.label = 2;
+                        case 2: return [2 /*return*/, next(input)];
+                    }
+                });
+            }); });
+            guideComponent.actions.watch('guide.handover', function (input, next) { return __awaiter(_this, void 0, void 0, function () {
+                var handoverContactMethods, promises;
+                var _this = this;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            handoverContactMethods = input.handoverContactMethods;
+                            if (!handoverContactMethods) return [3 /*break*/, 2];
+                            promises = Promise.all(handoverContactMethods.map(function (cm) {
+                                return handleContactMethod(_this.adapters, cm);
+                            }));
+                            return [4 /*yield*/, Promise.resolve(promises).then(function (handoverContactMethods) {
+                                    input.handoverContactMethods = handoverContactMethods;
+                                })];
+                        case 1:
+                            _a.sent();
+                            _a.label = 2;
+                        case 2: return [2 /*return*/, next(input)];
+                    }
+                });
+            }); });
+            var contactMethodComponent = componentPlatform
+                .components()
+                .ofType('contact-method')
+                .select();
+            contactMethodComponent.actions.watch('contact-method.fetched', function (input, next) { return __awaiter(_this, void 0, void 0, function () {
+                var contactMethod;
+                return __generator(this, function (_a) {
+                    contactMethod = input.contactMethod;
+                    if (contactMethod) {
+                        return [2 /*return*/, handleContactMethod(this.adapters, contactMethod).then(function (contactMethod) {
+                                return next(__assign(__assign({}, input), { contactMethod: contactMethod }));
+                            })];
+                    }
+                    return [2 /*return*/, next(input)];
+                });
+            }); });
+        }
+    }
+    ContactMethodPlatform.create = function (container) {
+        return ComponentPlatform.getInstance(container).then(function (platform) {
+            return new ContactMethodPlatform(container, platform);
+        });
+    };
+    ContactMethodPlatform.prototype.track = function (data, type) {
+        if (data === void 0) { data = {}; }
+        var events = this.container.get('$widget').events;
+        events.dispatch('tracking:service-client-response', {
+            type: type,
+            data: data,
+        });
+    };
+    ContactMethodPlatform.prototype.complete = function (contactMethod) {
+        var id = contactMethod.id, title = contactMethod.title, clientName = contactMethod.clientName, expanded = contactMethod.expanded, body = contactMethod.body;
+        this.track({ contactMethod: { id: id, title: title, expanded: expanded, type: clientName }, hasGuide: !!body.guideId }, ContactMethodTrackTypes.ContactMethodComplete);
+        var adapter = this.adapters.get(clientName);
+        if (adapter && adapter.onComplete) {
+            return adapter.onComplete(contactMethod);
+        }
+    };
+    ContactMethodPlatform.prototype.evaluate = function (contactMethod) {
+        var clientName = contactMethod.clientName;
+        var adapter = this.adapters.get(clientName);
+        if (adapter && adapter.onEvaluate) {
+            return Promise.resolve(adapter.onEvaluate(contactMethod));
+        }
+        return Promise.resolve(contactMethod.body.form);
+    };
+    ContactMethodPlatform.prototype.validate = function (contactMethod) {
+        var _this = this;
+        var id = contactMethod.id, title = contactMethod.title, clientName = contactMethod.clientName;
+        var adapter = this.adapters.get(clientName);
+        if (adapter && adapter.onValidate) {
+            return Promise.resolve(adapter.onValidate(contactMethod)).then(function (result) {
+                _this.track({ contactMethod: { id: id, title: title, type: clientName }, isValid: result.valid }, ContactMethodTrackTypes.ContactMethodValidate);
+                var events = _this.container.get('$widget').events;
+                events.dispatch('form:validated', { isValid: result.valid });
+                return result;
+            });
+        }
+        return Promise.resolve({ valid: true });
+    };
+    ContactMethodPlatform.prototype.submit = function (contactMethod) {
+        var _this = this;
+        var clientName = contactMethod.clientName;
+        var adapter = this.adapters.get(clientName);
+        if (adapter && adapter.onSubmit) {
+            return Promise.resolve(adapter.onSubmit(contactMethod)).then(function (result) {
+                _this.complete(contactMethod);
+                return result;
+            });
+        }
+        return Promise.resolve('');
+    };
+    ContactMethodPlatform.prototype.create = function (settings) {
+        var _this = this;
+        var clientName = settings.clientName, render = settings.render;
+        this.adapters.set(clientName, __assign({ onValidate: function (cm) { return defaultValidate(_this.container, cm); }, onEvaluate: function (cm) { return defaultEvaluate(_this.container, cm); }, onComplete: function (cm) { return defaultComplete(_this.container, cm); } }, settings));
+        return this.container.getAsync('componentResolver').then(function (resolver) {
+            if (typeof render === 'string') {
+                _this.subs.push(resolver.registerAlias(clientName, render));
+            }
+            else {
+                _this.subs.push(resolver.registerComponent(clientName, lazy(function () { return render; })));
+            }
+        });
+    };
+    ContactMethodPlatform.prototype.dispose = function () {
+        this.subs.forEach(function (s) { return s(); });
+    };
+    return ContactMethodPlatform;
+}());
+export default ContactMethodPlatform;

package/lib-esm/contact-methods/ui/confirmation.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export declare type Props = {
+    html: string;
+};
+declare const Confirmation: React.SFC<Props>;
+export default Confirmation;

package/lib-esm/contact-methods/ui/confirmation.js

@@ -0,0 +1,22 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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);
+};
+import { headingElement, Paragraph } from '@telia-ace/knowledge-widget-ui';
+import * as React from 'react';
+import styled, { css } from 'styled-components';
+var Confirmation = function (props) { return (React.createElement(StyledParagraph, __assign({}, props, { className: "humany-confirmation" }))); };
+export default Confirmation;
+var StyledParagraph = styled(Paragraph)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), headingElement('h1', css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n            font-weight: normal;\n            font-size: ", ";\n        "], ["\n            font-weight: normal;\n            font-size: ", ";\n        "])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.medium; })));
+var templateObject_1, templateObject_2;

package/lib-esm/contact-methods/ui/contact-list.d.ts

@@ -0,0 +1,15 @@
+import { DispatchAction } from '@telia-ace/knowledge-widget-ui';
+import React, { ReactNode } from 'react';
+import { ContactMethodType } from './contact-method';
+export declare const contactItemList: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<any>>;
+declare type Props = {
+    contactMethods: ContactMethodType[];
+    header?: string;
+    className?: string;
+    action?: (action: string, value?: any) => void;
+    dispatch?: DispatchAction;
+    children?: ReactNode;
+    guideId?: string;
+};
+declare const ContactList: React.SFC<Props>;
+export default ContactList;

package/lib-esm/contact-methods/ui/contact-list.js

@@ -0,0 +1,32 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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);
+};
+import { headingElement, ItemList, itemList } from '@telia-ace/knowledge-widget-ui';
+import { appendClassNames } from '@telia-ace/widget-utilities';
+import React from 'react';
+import styled, { css } from 'styled-components';
+import ContactMethod from './contact-method';
+export var contactItemList = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", "\n\n    > div {\n        padding: ", ";\n\n        ", "\n    }\n    > ul {\n        &:not(:first-child) {\n            border-top: ", ";\n        }\n\n        > li {\n            margin: 0;\n            white-space: normal;\n\n            > a {\n                overflow: hidden;\n            }\n\n            &:first-child > a {\n                border-radius: ", ";\n            }\n\n            &:last-child:not(:first-child) > a {\n                border-radius: ", ";\n            }\n\n            &:not(:last-child) {\n                border-bottom: ", ";\n            }\n\n            > div {\n                padding: ", ";\n            }\n        }\n    }\n\n    @media (hover: hover) {\n        a:hover {\n            background-color: ", ";\n        }\n    }\n"], ["\n    ", "\n\n    > div {\n        padding: ", ";\n\n        ", "\n    }\n    > ul {\n        &:not(:first-child) {\n            border-top: ", ";\n        }\n\n        > li {\n            margin: 0;\n            white-space: normal;\n\n            > a {\n                overflow: hidden;\n            }\n\n            &:first-child > a {\n                border-radius: ", ";\n            }\n\n            &:last-child:not(:first-child) > a {\n                border-radius: ", ";\n            }\n\n            &:not(:last-child) {\n                border-bottom: ", ";\n            }\n\n            > div {\n                padding: ", ";\n            }\n        }\n    }\n\n    @media (hover: hover) {\n        a:hover {\n            background-color: ", ";\n        }\n    }\n"])), itemList, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, headingElement('h1', css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n                margin: 0;\n            "], ["\n                margin: 0;\n            "])))), function (p) { return p.theme.border; }, function (p) { return "".concat(p.theme.borderRadius, " ").concat(p.theme.borderRadius, " 0 0"); }, function (p) { return "0 0 ".concat(p.theme.borderRadius, " ").concat(p.theme.borderRadius); }, function (p) { return p.theme.border; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.accent; });
+var StyledItemList = styled(ItemList)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), contactItemList);
+var ContactList = function (_a) {
+    var contactMethods = _a.contactMethods, children = _a.children, guideId = _a.guideId, dispatch = _a.dispatch, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.action, action = _c === void 0 ? function () { } : _c, _d = _a.header, header = _d === void 0 ? '' : _d;
+    if (!contactMethods.length) {
+        return null;
+    }
+    return (React.createElement(StyledItemList, { header: header, className: appendClassNames(className, 'humany-contact-list'), items: contactMethods, renderItem: function (cm) { return (React.createElement("li", { key: cm.id, "data-contact-method": cm.id },
+            React.createElement(ContactMethod, __assign({}, cm, { action: action, dispatch: dispatch, guideId: guideId })))); } }, children));
+};
+export default ContactList;
+var templateObject_1, templateObject_2, templateObject_3;

package/lib-esm/contact-methods/ui/contact-method.d.ts

@@ -0,0 +1,39 @@
+import { Symbol } from '@telia-ace/knowledge-widget-core';
+import { DispatchAction, HtmlParseInstruction } from '@telia-ace/knowledge-widget-ui';
+import React from 'react';
+export declare type ContactMethodType = {
+    id: string;
+    title: string;
+    symbol?: Symbol;
+    clientName: string;
+    expanded: boolean;
+    inline: boolean;
+    body: {
+        [key: string]: any;
+    };
+    description?: string;
+    confirmation?: string;
+    disabled?: boolean;
+    guideId?: string;
+};
+export declare type Props = Merge<ContactMethodType, {
+    className?: string;
+    onClick?: (event: React.MouseEvent, properties: Props) => void;
+    renderDefault?: (extraProps?: Partial<Props>) => any;
+    htmlParseInstruction?: HtmlParseInstruction;
+    href?: string;
+    target?: string;
+    disabled?: boolean;
+    action?: (action: string, value: any) => void;
+    dispatch?: DispatchAction;
+    symbol?: Symbol;
+    description?: string;
+    confirmation?: string;
+    guideId?: string;
+    autoFocus?: boolean;
+}>;
+declare const ContactMethod: React.FC<Props>;
+export default ContactMethod;
+export declare const contactLink: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<{
+    description?: string | undefined;
+}, any>>;

package/lib-esm/contact-methods/ui/contact-method.js

@@ -0,0 +1,81 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+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);
+};
+import { borderTabStyle, Link, StyledText, SymbolBadge, Typography, useComponent, useRouteData, } from '@telia-ace/knowledge-widget-ui';
+import { createParams, formatUrl } from '@telia-ace/widget-utilities';
+import React, { Suspense } from 'react';
+import styled, { css } from 'styled-components';
+import Description from './description';
+var ContactMethod = function (props) {
+    var ResolvedComponent = useComponent(props.clientName);
+    var _a = useRouteData().params, contactCategory = _a.contactCategory, guideCategory = _a.guideCategory, phrase = _a.phrase;
+    if (typeof ResolvedComponent === 'undefined') {
+        return null;
+    }
+    if (ResolvedComponent === null) {
+        if (process.env.NODE_ENV !== 'production') {
+            return (React.createElement(NonResolvedContactMethodWrapper, { title: "client-name: ".concat(props.clientName, ", id: ").concat(props.id), className: "humany-non-resolved-contact-method" },
+                React.createElement(Typography, { variant: "h5" }, "Non resolved Contact Method type")));
+        }
+        return null;
+    }
+    var renderLink = function (extraProps) {
+        if (extraProps === void 0) { extraProps = {}; }
+        var enhancedProps = __assign(__assign({}, props), extraProps);
+        var id = enhancedProps.id, title = enhancedProps.title, clientName = enhancedProps.clientName, symbol = enhancedProps.symbol, inline = enhancedProps.inline, _a = enhancedProps.onClick, onClick = _a === void 0 ? function () { } : _a, description = enhancedProps.description, htmlParseInstruction = enhancedProps.htmlParseInstruction, className = enhancedProps.className, disabled = enhancedProps.disabled, guideId = enhancedProps.guideId, _b = enhancedProps.dispatch, dispatch = _b === void 0 ? function () { } : _b, expanded = enhancedProps.expanded;
+        var linkProps = inline
+            ? {
+                onKeyDown: function (event) {
+                    if (event.key && event.key === 'Enter') {
+                        onClick(event, enhancedProps);
+                        if (!event.defaultPrevented) {
+                            !expanded && dispatch('expand', id);
+                        }
+                    }
+                },
+                onClick: function (event) {
+                    onClick(event, enhancedProps);
+                    if (!event.defaultPrevented) {
+                        !expanded && dispatch('expand', id);
+                    }
+                },
+            }
+            : {
+                onClick: function (event) { return onClick(event, enhancedProps); },
+                routeName: 'contact-method',
+                params: createParams({
+                    contactCategory: contactCategory,
+                    guideId: guideId,
+                    guideCategory: guideCategory,
+                    phrase: phrase,
+                    contactMethod: id,
+                    uriName: formatUrl(title),
+                }),
+            };
+        return (React.createElement(StyledLink, __assign({ title: title, "aria-label": title, className: className, disabled: disabled, description: description, "data-client-name": clientName }, extraProps, linkProps),
+            symbol && React.createElement(SymbolBadge, { symbol: symbol }),
+            description ? (React.createElement("div", { className: "humany-contact-link-rich-content" },
+                React.createElement(StyledTitle, null, title),
+                React.createElement(Description, { html: description, htmlParseInstruction: htmlParseInstruction }))) : (React.createElement(StyledTitle, null, title))));
+    };
+    return props.expanded ? (React.createElement(Suspense, { fallback: null },
+        React.createElement(ResolvedComponent, __assign({}, props, { renderDefault: renderLink })))) : (renderLink());
+};
+export default ContactMethod;
+export var contactLink = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    display: flex;\n    padding: ", ";\n    ", "\n    text-decoration: none;\n    span {\n        display: inline-block;\n        color: ", ";\n    }\n    i {\n        font-size: 30px;\n        margin: 0 ", " 0 0;\n        min-height: 30px;\n        min-width: 30px;\n        line-height: 30px;\n        display: inline-block;\n        vertical-align: bottom;\n        color: ", ";\n    }\n"], ["\n    display: flex;\n    padding: ", ";\n    ", "\n    text-decoration: none;\n    span {\n        display: inline-block;\n        color: ", ";\n    }\n    i {\n        font-size: 30px;\n        margin: 0 ", " 0 0;\n        min-height: 30px;\n        min-width: 30px;\n        line-height: 30px;\n        display: inline-block;\n        vertical-align: bottom;\n        color: ", ";\n    }\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { return (!!p.description ? '' : 'align-items: center;'); }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; });
+var StyledTitle = styled(StyledText)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    line-height: 30px;\n"], ["\n    line-height: 30px;\n"])));
+var StyledLink = styled(Link)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n\n    &:focus {\n        ", ";\n    }\n"], ["\n    ", "\n\n    &:focus {\n        ", ";\n    }\n"])), contactLink, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && borderTabStyle; });
+var NonResolvedContactMethodWrapper = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    text-align: center;\n    display: block;\n    ", "\n"], ["\n    text-align: center;\n    display: block;\n    ", "\n"])), function (p) { var _a, _b; return typeof ((_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.warning) !== 'undefined' && "color: ".concat((_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.warning, ";"); });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/lib-esm/contact-methods/ui/description.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("@telia-ace/knowledge-widget-ui").HtmlProps, "html" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement> | "htmlParseInstruction"> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+export default _default;

package/lib-esm/contact-methods/ui/description.js

@@ -0,0 +1,8 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { borderTabStyle, genericHtml, Html, linkTabStyle } from '@telia-ace/knowledge-widget-ui';
+import styled from 'styled-components';
+export default styled(Html)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", "\n    font-weight: 300;\n    line-height: 1.5em;\n    button:focus {\n        ", ";\n    }\n\n    a:focus {\n        ", ";\n    }\n"], ["\n    ", "\n    font-weight: 300;\n    line-height: 1.5em;\n    button:focus {\n        ", ";\n    }\n\n    a:focus {\n        ", ";\n    }\n"])), genericHtml, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && borderTabStyle; }, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && linkTabStyle; });
+var templateObject_1;

package/lib-esm/contact-methods/ui/form.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ContactMethodProps } from '.';
+declare const Form: React.SFC<ContactMethodProps>;
+export default Form;

package/lib-esm/contact-methods/ui/form.js

@@ -0,0 +1,49 @@
+import { FormComponent } from '@telia-ace/widget-forms';
+import React from 'react';
+/**
+ * Recursively find form component in schema
+ * @param node Form schema
+ * @param id actionKey of component to find
+ */
+var lookupComponent = function (node, id) {
+    if (node.actionKey === id) {
+        return node;
+    }
+    if (!node.properties) {
+        return null;
+    }
+    var keys = Object.keys(node.properties);
+    var result;
+    // tslint:disable-next-line:no-increment-decrement
+    for (var i = 0; i < keys.length; i++) {
+        result = lookupComponent(node.properties[keys[i]], id);
+        if (result) {
+            return result;
+        }
+    }
+    return false;
+};
+var Form = function (_a) {
+    var className = _a.className, form = _a.body.form, id = _a.id, action = _a.action, dispatch = _a.dispatch, disabled = _a.disabled, autoFocus = _a.autoFocus;
+    if (form && !disabled) {
+        var schema_1 = form.schema, layout_1 = form.layout, data = form.data;
+        var trigger_1 = dispatch || action || (function () { });
+        return (React.createElement(FormComponent, { className: className, schema: schema_1, layout: layout_1, data: data, autoFocus: autoFocus, onChange: function (event, data) {
+                var form = { schema: schema_1, layout: layout_1, data: data };
+                if (event.toString() === 'submit') {
+                    trigger_1('submit', { id: id, form: form });
+                }
+                else {
+                    var formComponent = lookupComponent(schema_1, event);
+                    if (formComponent.evaluate) {
+                        trigger_1('evaluate', { id: id, form: form });
+                    }
+                    else {
+                        trigger_1('validate', { id: id, form: form });
+                    }
+                }
+            } }));
+    }
+    return null;
+};
+export default Form;

package/lib-esm/contact-methods/ui/index.d.ts

@@ -0,0 +1,7 @@
+export { default as Confirmation } from './confirmation';
+export { contactItemList, default as ContactList } from './contact-list';
+export { contactLink, default as ContactMethod } from './contact-method';
+export type { ContactMethodType, Props as ContactMethodProps } from './contact-method';
+export { default as Description } from './description';
+export { default as Form } from './form';
+export { default as useContactMethod } from './use-contact-method';

package/lib-esm/contact-methods/ui/index.js

@@ -0,0 +1,6 @@
+export { default as Confirmation } from './confirmation';
+export { contactItemList, default as ContactList } from './contact-list';
+export { contactLink, default as ContactMethod } from './contact-method';
+export { default as Description } from './description';
+export { default as Form } from './form';
+export { default as useContactMethod } from './use-contact-method';

package/lib-esm/contact-methods/ui/use-contact-method.d.ts

@@ -0,0 +1,2 @@
+declare const useContactMethod: (clientName: string) => any | null;
+export default useContactMethod;