@telia-ace/knowledge-widget-adapters 1.0.1

package/lib/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/contact-methods/platform.js

@@ -0,0 +1,256 @@
+"use strict";
+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 };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContactMethodTrackTypes = void 0;
+var knowledge_widget_core_1 = require("@telia-ace/knowledge-widget-core");
+var react_1 = require("react");
+var email_1 = require("./email");
+var ContactMethodTrackTypes;
+(function (ContactMethodTrackTypes) {
+    ContactMethodTrackTypes["ContactMethodValidate"] = "contact-method-validate";
+    ContactMethodTrackTypes["ContactMethodComplete"] = "contact-method-complete";
+})(ContactMethodTrackTypes = exports.ContactMethodTrackTypes || (exports.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 knowledge_widget_core_1.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 (0, email_1.defaultValidate)(_this.container, cm); }, onEvaluate: function (cm) { return (0, email_1.defaultEvaluate)(_this.container, cm); }, onComplete: function (cm) { return (0, email_1.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, (0, react_1.lazy)(function () { return render; })));
+            }
+        });
+    };
+    ContactMethodPlatform.prototype.dispose = function () {
+        this.subs.forEach(function (s) { return s(); });
+    };
+    return ContactMethodPlatform;
+}());
+exports.default = ContactMethodPlatform;

package/lib/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/contact-methods/ui/confirmation.js

@@ -0,0 +1,47 @@
+"use strict";
+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);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
+var React = __importStar(require("react"));
+var styled_components_1 = __importStar(require("styled-components"));
+var Confirmation = function (props) { return (React.createElement(StyledParagraph, __assign({}, props, { className: "humany-confirmation" }))); };
+exports.default = Confirmation;
+var StyledParagraph = (0, styled_components_1.default)(knowledge_widget_ui_1.Paragraph)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), (0, knowledge_widget_ui_1.headingElement)('h1', (0, styled_components_1.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/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/contact-methods/ui/contact-list.js

@@ -0,0 +1,61 @@
+"use strict";
+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);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.contactItemList = void 0;
+var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
+var widget_utilities_1 = require("@telia-ace/widget-utilities");
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importStar(require("styled-components"));
+var contact_method_1 = __importDefault(require("./contact-method"));
+exports.contactItemList = (0, styled_components_1.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"])), knowledge_widget_ui_1.itemList, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, (0, knowledge_widget_ui_1.headingElement)('h1', (0, styled_components_1.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 = (0, styled_components_1.default)(knowledge_widget_ui_1.ItemList)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n"], ["\n    ", "\n"])), exports.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_1.default.createElement(StyledItemList, { header: header, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-list'), items: contactMethods, renderItem: function (cm) { return (react_1.default.createElement("li", { key: cm.id, "data-contact-method": cm.id },
+            react_1.default.createElement(contact_method_1.default, __assign({}, cm, { action: action, dispatch: dispatch, guideId: guideId })))); } }, children));
+};
+exports.default = ContactList;
+var templateObject_1, templateObject_2, templateObject_3;

package/lib/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/contact-methods/ui/contact-method.js

@@ -0,0 +1,110 @@
+"use strict";
+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);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.contactLink = void 0;
+var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
+var widget_utilities_1 = require("@telia-ace/widget-utilities");
+var react_1 = __importStar(require("react"));
+var styled_components_1 = __importStar(require("styled-components"));
+var description_1 = __importDefault(require("./description"));
+var ContactMethod = function (props) {
+    var ResolvedComponent = (0, knowledge_widget_ui_1.useComponent)(props.clientName);
+    var _a = (0, knowledge_widget_ui_1.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_1.default.createElement(NonResolvedContactMethodWrapper, { title: "client-name: ".concat(props.clientName, ", id: ").concat(props.id), className: "humany-non-resolved-contact-method" },
+                react_1.default.createElement(knowledge_widget_ui_1.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: (0, widget_utilities_1.createParams)({
+                    contactCategory: contactCategory,
+                    guideId: guideId,
+                    guideCategory: guideCategory,
+                    phrase: phrase,
+                    contactMethod: id,
+                    uriName: (0, widget_utilities_1.formatUrl)(title),
+                }),
+            };
+        return (react_1.default.createElement(StyledLink, __assign({ title: title, "aria-label": title, className: className, disabled: disabled, description: description, "data-client-name": clientName }, extraProps, linkProps),
+            symbol && react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: symbol }),
+            description ? (react_1.default.createElement("div", { className: "humany-contact-link-rich-content" },
+                react_1.default.createElement(StyledTitle, null, title),
+                react_1.default.createElement(description_1.default, { html: description, htmlParseInstruction: htmlParseInstruction }))) : (react_1.default.createElement(StyledTitle, null, title))));
+    };
+    return props.expanded ? (react_1.default.createElement(react_1.Suspense, { fallback: null },
+        react_1.default.createElement(ResolvedComponent, __assign({}, props, { renderDefault: renderLink })))) : (renderLink());
+};
+exports.default = ContactMethod;
+exports.contactLink = (0, styled_components_1.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 = (0, styled_components_1.default)(knowledge_widget_ui_1.StyledText)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    line-height: 30px;\n"], ["\n    line-height: 30px;\n"])));
+var StyledLink = (0, styled_components_1.default)(knowledge_widget_ui_1.Link)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    ", "\n\n    &:focus {\n        ", ";\n    }\n"], ["\n    ", "\n\n    &:focus {\n        ", ";\n    }\n"])), exports.contactLink, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.borderTabStyle; });
+var NonResolvedContactMethodWrapper = styled_components_1.default.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/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/contact-methods/ui/description.js

@@ -0,0 +1,13 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
+var styled_components_1 = __importDefault(require("styled-components"));
+exports.default = (0, styled_components_1.default)(knowledge_widget_ui_1.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"])), knowledge_widget_ui_1.genericHtml, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.borderTabStyle; }, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.linkTabStyle; });
+var templateObject_1;

package/lib/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;