@telia-ace/knowledge-widget-components-guide 1.0.6 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/{lib-esm → dist}/answer-version-picker.d.ts +0 -0
  2. package/{lib-esm → dist}/categories.d.ts +0 -0
  3. package/{lib-esm → dist}/feedback.d.ts +0 -0
  4. package/{lib-esm → dist}/functions.d.ts +0 -0
  5. package/{lib-esm → dist}/guide-component.d.ts +0 -0
  6. package/{lib-esm → dist}/guide.d.ts +0 -0
  7. package/dist/guide.js +917 -0
  8. package/dist/guide.js.map +1 -0
  9. package/{lib-esm → dist}/index.d.ts +0 -0
  10. package/dist/index.js +191 -0
  11. package/dist/index.js.map +1 -0
  12. package/{lib-esm → dist}/languages.d.ts +0 -0
  13. package/{lib-esm → dist}/toolbar.d.ts +0 -0
  14. package/{lib-esm → dist}/use-feedback.d.ts +0 -0
  15. package/package.json +15 -16
  16. package/lib/answer-version-picker.d.ts +0 -10
  17. package/lib/answer-version-picker.js +0 -75
  18. package/lib/categories.d.ts +0 -8
  19. package/lib/categories.js +0 -80
  20. package/lib/feedback.d.ts +0 -7
  21. package/lib/feedback.js +0 -34
  22. package/lib/functions.d.ts +0 -29
  23. package/lib/functions.js +0 -129
  24. package/lib/guide-component.d.ts +0 -69
  25. package/lib/guide-component.js +0 -196
  26. package/lib/guide.d.ts +0 -7
  27. package/lib/guide.js +0 -117
  28. package/lib/index.d.ts +0 -2
  29. package/lib/index.js +0 -7
  30. package/lib/languages.d.ts +0 -17
  31. package/lib/languages.js +0 -110
  32. package/lib/toolbar.d.ts +0 -8
  33. package/lib/toolbar.js +0 -62
  34. package/lib/use-feedback.d.ts +0 -4
  35. package/lib/use-feedback.js +0 -54
  36. package/lib-esm/answer-version-picker.js +0 -50
  37. package/lib-esm/categories.js +0 -52
  38. package/lib-esm/feedback.js +0 -29
  39. package/lib-esm/functions.js +0 -101
  40. package/lib-esm/guide-component.js +0 -166
  41. package/lib-esm/guide.js +0 -89
  42. package/lib-esm/index.js +0 -2
  43. package/lib-esm/languages.js +0 -85
  44. package/lib-esm/toolbar.js +0 -57
  45. package/lib-esm/use-feedback.js +0 -52
package/lib-esm/guide-component.js DELETED
@@ -1,166 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __read = (this && this.__read) || function (o, n) {
13
- var m = typeof Symbol === "function" && o[Symbol.iterator];
14
- if (!m) return o;
15
- var i = m.call(o), r, ar = [], e;
16
- try {
17
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
18
- }
19
- catch (error) { e = { error: error }; }
20
- finally {
21
- try {
22
- if (r && !r.done && (m = i["return"])) m.call(i);
23
- }
24
- finally { if (e) throw e.error; }
25
- }
26
- return ar;
27
- };
28
- import { updateForm, useExpand, useForm, } from '@telia-ace/knowledge-widget-component-utilities';
29
- import { createEventSubscriber, extendComponent, } from '@telia-ace/knowledge-widget-core';
30
- import { DataType, } from '@telia-ace/knowledge-widget-types-grid';
31
- import { createReactComponent } from '@telia-ace/knowledge-widget-ui';
32
- import * as clipboard from 'clipboard-polyfill';
33
- import useFeedback from './use-feedback';
34
- var buildPlainText = function (_a) {
35
- var title = _a.title, body = _a.body;
36
- var processedHtml = '';
37
- if (title && title.length) {
38
- processedHtml = title.trim();
39
- }
40
- if (body && body.length) {
41
- processedHtml = "".concat(processedHtml.trim(), "\n").concat(body.trim());
42
- }
43
- var div = document.createElement('div');
44
- div.innerHTML = processedHtml;
45
- var links = Array.from(div.getElementsByTagName('a'));
46
- var plainText = div.innerText;
47
- links.forEach(function (a) {
48
- plainText = plainText.replace(a.innerText, "[".concat(a.href, "] (").concat(a.innerText, ")"));
49
- });
50
- return plainText;
51
- };
52
- var buildHtml = function (_a) {
53
- var title = _a.title, body = _a.body;
54
- var processedHtml = '';
55
- if (title && title.length) {
56
- processedHtml = "<h2>".concat(title.trim(), "</h2>");
57
- }
58
- if (body && body.length) {
59
- processedHtml = "".concat(processedHtml.trim()).concat(body.trim());
60
- }
61
- return processedHtml.trim();
62
- };
63
- export var GuideComponent = function (container) {
64
- var events = container.get('$widget').events;
65
- var _a = __read(createEventSubscriber(events), 2), subscribe = _a[0], unsubscribe = _a[1];
66
- return createReactComponent(container, 'guide', import('./guide'), function (component) {
67
- var fetch = function (params) {
68
- component.writeProperties({
69
- loading: true,
70
- error: undefined,
71
- guide: undefined,
72
- });
73
- component.actions.dispatch('fetch', { params: params });
74
- };
75
- component.actions.create('copy', function (guide) {
76
- var item = new clipboard.ClipboardItem({
77
- 'text/html': new Blob([buildHtml(guide)], { type: 'text/html' }),
78
- 'text/plain': new Blob([buildPlainText(guide)], { type: 'text/plain' }),
79
- });
80
- return clipboard.write([item]).then(function () {
81
- events.dispatch('widget:menu-toggled', null);
82
- });
83
- });
84
- component.actions.create('print', function () {
85
- var elem = document.querySelector('.humany-guide .humany-paragraph');
86
- var a = window.open('', '', 'height=500, width=500');
87
- events.dispatch('widget:menu-toggled', null);
88
- if (elem && a) {
89
- a.document.write("<html><body>".concat(elem.innerHTML, "</body></html>"));
90
- a.document.close();
91
- a.print();
92
- }
93
- });
94
- component.actions.create('back', function (data, options) {
95
- if (options.preventDefault) {
96
- return;
97
- }
98
- return container.getAsync('router').then(function (router) {
99
- router.goBack();
100
- });
101
- });
102
- component.actions.create('fetch', function (_a) {
103
- var _b = _a.contactMethods, contactMethods = _b === void 0 ? [] : _b, _c = _a.dialog, dialog = _c === void 0 ? [] : _c, guide = _a.guide, error = _a.error;
104
- if (error) {
105
- return component.actions.dispatch('fetched', {
106
- error: error,
107
- guide: undefined,
108
- contactMethods: [],
109
- feedbackGiven: undefined,
110
- handoverContactMethods: [],
111
- showFeedback: false,
112
- loading: true,
113
- });
114
- }
115
- var _d = component.properties(), _e = _d.showFeedback, showFeedback = _e === void 0 ? true : _e, _f = _d.submitButtonLabel, submitButtonLabel = _f === void 0 ? 'Submit' : _f;
116
- var properties = {
117
- showFeedback: showFeedback,
118
- dialog: dialog,
119
- guide: guide,
120
- feedbackGiven: undefined,
121
- handoverContactMethods: [],
122
- contactMethods: contactMethods.map(function (cm) { return (__assign(__assign({}, cm), { body: updateForm(cm, { submit: submitButtonLabel }) })); }),
123
- };
124
- return component.actions.dispatch('fetched', __assign(__assign({}, properties), { loading: true }));
125
- });
126
- component.actions.create('fetched', function (input) {
127
- return component.writeProperties(__assign(__assign({}, input), { loading: false }));
128
- });
129
- container.getAsync('router').then(function (router) {
130
- var params = router.getRouteData().params;
131
- fetch(params);
132
- });
133
- subscribe('router:changed', function (event, _a) {
134
- var current = _a.current;
135
- fetch(current.routeData.params);
136
- });
137
- useFeedback(container, component);
138
- useForm(container, component);
139
- useExpand(component);
140
- })
141
- .then(function () {
142
- return extendComponent(container, 'guide', function (component) {
143
- component.actions.watch('guide.fetch', function (input, next) {
144
- var _a = input.params, guide = _a.guide, connection = _a.connection;
145
- if (guide) {
146
- return container
147
- .getAsync('dataClient')
148
- .then(function (dataClient) {
149
- return dataClient.fetch(DataType.Guide, { connection: connection, guideId: guide });
150
- })
151
- .then(next)
152
- .catch(function (error) {
153
- if (error) {
154
- return next(error);
155
- }
156
- });
157
- }
158
- return next(input);
159
- });
160
- });
161
- })
162
- .then(function () {
163
- unsubscribe();
164
- });
165
- };
166
- export default GuideComponent;
package/lib-esm/guide.js DELETED
@@ -1,89 +0,0 @@
1
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
2
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
- return cooked;
4
- };
5
- var __assign = (this && this.__assign) || function () {
6
- __assign = Object.assign || function(t) {
7
- for (var s, i = 1, n = arguments.length; i < n; i++) {
8
- s = arguments[i];
9
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
10
- t[p] = s[p];
11
- }
12
- return t;
13
- };
14
- return __assign.apply(this, arguments);
15
- };
16
- var __rest = (this && this.__rest) || function (s, e) {
17
- var t = {};
18
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
19
- t[p] = s[p];
20
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
21
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
22
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
23
- t[p[i]] = s[p[i]];
24
- }
25
- return t;
26
- };
27
- import { contactLink, ContactList } from '@telia-ace/knowledge-widget-adapters';
28
- import { Component, NotFound } from '@telia-ace/knowledge-widget-types-grid';
29
- import { Button, contentBox, createEmptyComponent, DialogList, genericHtml, guideRenderInstructions, headingElement, linkTabStyle, Loader, loadingOpacity, Metadata, Paragraph, useChildren, useContainer, useDispatch, useProperties, useRouteData, } from '@telia-ace/knowledge-widget-ui';
30
- import { appendClassNames } from '@telia-ace/widget-utilities';
31
- import React, { forwardRef, useCallback } from 'react';
32
- import styled, { css } from 'styled-components';
33
- import AnswerVersionPicker from './answer-version-picker';
34
- import Feedback from './feedback';
35
- import Toolbar from './toolbar';
36
- var Guide = forwardRef(function (_a, ref) {
37
- var className = _a.className, _b = _a.accordion, accordion = _b === void 0 ? false : _b, other = __rest(_a, ["className", "accordion"]);
38
- var _c = useProperties(), _d = _c.loading, loading = _d === void 0 ? false : _d, _e = _c.dialog, dialog = _e === void 0 ? [] : _e, _f = _c.contactMethods, contactMethods = _f === void 0 ? [] : _f, _g = _c.showHeader, showHeader = _g === void 0 ? true : _g, _h = _c.showAnswerVersions, showAnswerVersions = _h === void 0 ? false : _h, _j = _c.defaultAnswerVersionLabel, defaultAnswerVersionLabel = _j === void 0 ? 'Default' : _j, backButtonLabel = _c.backButtonLabel, metadataByLabel = _c.metadataByLabel, metadataModifiedLabel = _c.metadataModifiedLabel, metadataPublishedLabel = _c.metadataPublishedLabel, availablePerspectives = _c.availablePerspectives, metadata = _c.metadata, toolbar = _c.toolbar, guide = _c.guide, error = _c.error;
39
- var connection = useRouteData().params.connection;
40
- var container = useContainer();
41
- var children = useChildren();
42
- var dispatch = useDispatch();
43
- var handleBackButtonClick = useCallback(function () {
44
- dispatch('back');
45
- }, [dispatch]);
46
- if (!guide && !error && !loading) {
47
- return createEmptyComponent(container, __assign(__assign({}, other), { className: appendClassNames(className, 'humany-guide') }));
48
- }
49
- var _k = guide || {}, _l = _k.id, id = _l === void 0 ? '' : _l, _m = _k.title, title = _m === void 0 ? '' : _m, _o = _k.body, body = _o === void 0 ? '' : _o, _p = _k.translations, translations = _p === void 0 ? {} : _p;
50
- if (error && error.status === 404) {
51
- return React.createElement(NotFound, { showSearch: false });
52
- }
53
- var showBackButton = !!accordion && !!connection;
54
- var language = Object.keys(translations).find(function (key) { return translations[key] === "".concat(id); });
55
- return (React.createElement(Wrapper, __assign({ ref: ref }, other, { "data-loading": loading, className: appendClassNames(className, 'humany-guide') }),
56
- React.createElement(Content, { "data-loading": loading, accordion: accordion ? 'true' : 'false', className: "humany-guide-content" },
57
- ((showAnswerVersions && guide) || !!toolbar) && (React.createElement(Top, { className: "humany-guide-top" },
58
- showAnswerVersions && guide && (React.createElement(AnswerVersionPicker, { defaultAnswerVersionLabel: defaultAnswerVersionLabel, availablePerspectives: availablePerspectives, guide: guide })),
59
- !!toolbar && React.createElement(Toolbar, { dispatch: dispatch }))),
60
- !!(title || body) && (React.createElement(Body, { className: "humany-guide-body", accordion: accordion ? 'true' : 'false', header: (showHeader && title) || undefined, html: body, htmlParseInstruction: guideRenderInstructions(container, dialog), lang: language })),
61
- dialog && body.indexOf('h-option-link') === -1 && (React.createElement(StyledDialogList, { dialog: dialog })),
62
- React.createElement(StyledContactList, { backButtonShown: showBackButton ? 'true' : 'false', contactMethods: contactMethods, dispatch: dispatch, guideId: guide && guide.id }),
63
- !contactMethods.length && (React.createElement(Feedback, { backButtonShown: showBackButton, accordion: accordion })),
64
- showBackButton && (React.createElement(BackButton, { "aria-label": backButtonLabel, onClick: handleBackButtonClick },
65
- React.createElement(Caret, { width: "7", height: "13", viewBox: "0 0 7 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
66
- React.createElement("line", { x1: "6.64645", y1: "12.5513", x2: "0.648357", y2: "6.55319" }),
67
- React.createElement("line", { x1: "0.646447", y1: "6.64455", x2: "6.64454", y2: "0.646465" })),
68
- backButtonLabel && React.createElement("span", null, backButtonLabel))),
69
- metadata && (React.createElement(StyledMetadata, __assign({}, metadata, { modified: guide === null || guide === void 0 ? void 0 : guide.modified, published: guide === null || guide === void 0 ? void 0 : guide.published, modifiedBy: guide === null || guide === void 0 ? void 0 : guide.modifiedBy, publishedBy: guide === null || guide === void 0 ? void 0 : guide.publishedBy, byLabel: metadataByLabel, modifiedLabel: metadataModifiedLabel, publishedLabel: metadataPublishedLabel }))),
70
- children.map(function (child) { return (React.createElement(StyledComponents, __assign({ key: child.id, id: child.id, branch: "default" }, { embedded: true }))); })),
71
- React.createElement(Loader, { loading: loading })));
72
- });
73
- export default Guide;
74
- var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n min-width: 0;\n"], ["\n ", "\n min-width: 0;\n"])), loadingOpacity);
75
- var Body = styled(Paragraph)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n display: block;\n line-height: 1.6em;\n ", "\n\n p {\n font-weight: 300;\n font-size: ", ";\n color: ", ";\n a {\n display: inline;\n }\n }\n"], ["\n ", "\n ", "\n display: block;\n line-height: 1.6em;\n ", "\n\n p {\n font-weight: 300;\n font-size: ", ";\n color: ", ";\n a {\n display: inline;\n }\n }\n"])), genericHtml, function (p) { var _a; return "padding: ".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large, ";"); }, headingElement('h1', css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: normal;\n line-height: 1.6em;\n line-height: 1.6em;\n margin: 0 0 ", ";\n "], ["\n font-size: ", ";\n font-weight: normal;\n line-height: 1.6em;\n line-height: 1.6em;\n margin: 0 0 ", ";\n "])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; })), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; });
76
- var StyledContactList = styled(ContactList)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-top: ", ";\n ", "\n"], ["\n border-top: ", ";\n ", "\n"])), function (p) { return p.theme.border; }, function (p) { return p.backButtonShown === 'true' && "border-bottom: ".concat(p.theme.border, ";"); });
77
- var StyledDialogList = styled(DialogList)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n display: block;\n"], ["\n ", "\n display: block;\n"])), function (p) { var _a, _b; return "padding: 0 ".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large, " ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.large, ";"); });
78
- var Top = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n ", "\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: ", ";\n border-radius: ", " 0 0;\n background-color: #ffffff;\n"], ["\n ", "\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: ", ";\n border-radius: ", " 0 0;\n background-color: #ffffff;\n"])), function (p) { var _a, _b; return "padding: calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal, "*2) ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.large, ";"); }, function (p) { return p.theme.border; }, function (p) { return "".concat(p.theme.borderRadius, " ").concat(p.theme.borderRadius); });
79
- var Content = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", "\n display: block;\n > a {\n ", "\n }\n\n ", "\n"], ["\n ", "\n display: block;\n > a {\n ", "\n }\n\n ", "\n"])), contentBox, contactLink, function (p) {
80
- return p.accordion === 'true' && css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n white-space: normal;\n box-shadow: none;\n background-color: #fafafa;\n "], ["\n white-space: normal;\n box-shadow: none;\n background-color: #fafafa;\n "])));
81
- });
82
- var StyledMetadata = styled(Metadata)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: block;\n ", "\n font-weight: 300;\n font-size: ", ";\n color: ", ";\n border-top: ", ";\n"], ["\n display: block;\n ", "\n font-weight: 300;\n font-size: ", ";\n color: ", ";\n border-top: ", ";\n"])), function (p) { var _a, _b; return "padding: calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal, "*2) ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.large, ";"); }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { return p.theme.border; });
83
- var StyledComponents = styled(Component)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n border-top: ", ";\n"], ["\n border-top: ", ";\n"])), function (p) { return p.theme.border; });
84
- var BackButton = styled(Button)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n color: ", ";\n text-decoration: underline;\n font-size: ", ";\n span {\n font-weight: 300;\n }\n &:focus {\n ", ";\n }\n"], ["\n ", "\n color: ", ";\n text-decoration: underline;\n font-size: ", ";\n span {\n font-weight: 300;\n }\n &:focus {\n ", ";\n }\n"])), function (p) { var _a, _b; return "padding: ".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal, " calc(").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.normal, " * 2);"); }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) {
85
- var _a;
86
- return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n ", "\n padding: ", ";\n "], ["\n ", "\n padding: ", ";\n "])), linkTabStyle, function (p) { var _a, _b; return "calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " / 2) ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.small); });
87
- });
88
- var Caret = styled.svg(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n margin-right: ", ";\n line {\n stroke: ", ";\n }\n"], ["\n margin-right: ", ";\n line {\n stroke: ", ";\n }\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary; });
89
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
package/lib-esm/index.js DELETED
@@ -1,2 +0,0 @@
1
- import GuideComponent from './guide-component';
2
- export default GuideComponent;
package/lib-esm/languages.js DELETED
@@ -1,85 +0,0 @@
1
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
2
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
- return cooked;
4
- };
5
- var __assign = (this && this.__assign) || function () {
6
- __assign = Object.assign || function(t) {
7
- for (var s, i = 1, n = arguments.length; i < n; i++) {
8
- s = arguments[i];
9
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
10
- t[p] = s[p];
11
- }
12
- return t;
13
- };
14
- return __assign.apply(this, arguments);
15
- };
16
- var __rest = (this && this.__rest) || function (s, e) {
17
- var t = {};
18
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
19
- t[p] = s[p];
20
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
21
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
22
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
23
- t[p[i]] = s[p[i]];
24
- }
25
- return t;
26
- };
27
- import { PickerTypes } from '@telia-ace/knowledge-widget-core';
28
- import { DrawerAnimationType, DrawerList, DropdownList, paddedBorderTabStyle, StyledListButton, SymbolBadge, Text, TextLink, useRouteData, } from '@telia-ace/knowledge-widget-ui';
29
- import { createParams } from '@telia-ace/widget-utilities';
30
- import React, { useMemo } from 'react';
31
- import styled, { css } from 'styled-components';
32
- var getCurrentLanguageLabel = function (guide, languages) {
33
- var _a;
34
- return ((_a = languages.find(function (l) { return l.id === guide.id; })) === null || _a === void 0 ? void 0 : _a.label) || '';
35
- };
36
- var Languages = function (_a) {
37
- var header = _a.header, tooltip = _a.tooltip, _b = _a.picker, picker = _b === void 0 ? PickerTypes.NONE : _b, guide = _a.guide, other = __rest(_a, ["header", "tooltip", "picker", "guide"]);
38
- var _c = useRouteData(), name = _c.name, params = _c.params;
39
- var items = useMemo(function () {
40
- return Object.keys(guide.translations || {}).reduce(function (acc, key) {
41
- var item = {};
42
- item.key = key;
43
- item.id = (guide.translations || {})[key];
44
- item.label = other["".concat(key, "LanguageLabel")];
45
- if (item.id || item.label) {
46
- acc.push(item);
47
- }
48
- return acc;
49
- }, []);
50
- }, [guide, other]);
51
- if (!items.length) {
52
- return null;
53
- }
54
- var currentLanguage = getCurrentLanguageLabel(guide, items);
55
- var trigger = (React.createElement(Trigger, { tabIndex: 0, title: tooltip, "data-has-symbol": "true", "data-has-label": picker === PickerTypes.DROPDOWN && currentLanguage ? 'true' : 'false' },
56
- picker === PickerTypes.DROPDOWN && (React.createElement(React.Fragment, null,
57
- currentLanguage && React.createElement(LanguageButtonText, null, currentLanguage),
58
- React.createElement(LanguageCaretSymbolBadge, { symbol: { type: 'Svg', content: 'caret-down' }, size: 11 }))),
59
- picker === PickerTypes.DRAWER && (React.createElement(React.Fragment, null,
60
- React.createElement(ColoredSymbolBadge, { symbol: { type: 'Svg', content: 'language' }, size: 20 })))));
61
- var renderListItem = function (_a) {
62
- var label = _a.label, key = _a.key, id = _a.id;
63
- return (React.createElement("li", { key: key, "data-language": key },
64
- React.createElement(LanguageLink, { tabIndex: 0, text: label, routeName: name, selected: guide.id === id, params: createParams(__assign(__assign({}, params), { connection: undefined, guide: id })) })));
65
- };
66
- if (picker === PickerTypes.DROPDOWN) {
67
- return (React.createElement(StyledDropdownList, { className: "humany-guide-languages-dropdown-list", header: header, items: items, trigger: trigger, renderItem: renderListItem }));
68
- }
69
- if (picker === PickerTypes.DRAWER) {
70
- return (React.createElement(DrawerList, { className: "humany-guide-languages-drawer-list", animation: { type: DrawerAnimationType.SlideInBottom }, header: header, items: items, trigger: trigger, renderItem: renderListItem }));
71
- }
72
- return null;
73
- };
74
- export default Languages;
75
- var Trigger = styled(StyledListButton)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &&& {\n margin: 0 ", " 0 0;\n }\n"], ["\n &&& {\n margin: 0 ", " 0 0;\n }\n"])), function (p) { var _a; return "calc(".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " * 2)"); });
76
- var ColoredSymbolBadge = styled(SymbolBadge)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n circle {\n fill: ", ";\n }\n\n line,\n path,\n rect {\n stroke: ", ";\n }\n"], ["\n circle {\n fill: ", ";\n }\n\n line,\n path,\n rect {\n stroke: ", ";\n }\n"])), 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.colors) === null || _a === void 0 ? void 0 : _a.text; });
77
- var LanguageButtonText = styled(Text)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n margin: 0 ", " 0 0;\n font-size: ", ";\n"], ["\n margin: 0 ", " 0 0;\n font-size: ", ";\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; });
78
- var LanguageCaretSymbolBadge = styled(SymbolBadge)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-self: flex-end;\n stroke-width: 2px;\n stroke-linecap: round;\n\n && {\n width: 0.6em;\n height: 1em;\n }\n line {\n stroke: ", ";\n }\n"], ["\n align-self: flex-end;\n stroke-width: 2px;\n stroke-linecap: round;\n\n && {\n width: 0.6em;\n height: 1em;\n }\n line {\n stroke: ", ";\n }\n"])), function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; });
79
- var StyledDropdownList = styled(DropdownList)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: block;\n min-height: auto;\n"], ["\n display: block;\n min-height: auto;\n"])));
80
- var LanguageLink = styled(TextLink)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: ", ";\n ", "\n\n &:focus {\n ", "\n }\n"], ["\n color: ", ";\n ", "\n\n &:focus {\n ", "\n }\n"])), function (p) { var _a, _b; return (p.selected ? (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary : (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.text); }, function (p) { return p.selected && 'font-weight: bold;'; }, function (p) {
81
- var _a;
82
- return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing)
83
- ? css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n ", "\n text-decoration: underline;\n "], ["\n ", "\n text-decoration: underline;\n "])), paddedBorderTabStyle) : 'outline: none;';
84
- });
85
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
package/lib-esm/toolbar.js DELETED
@@ -1,57 +0,0 @@
1
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
2
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
- return cooked;
4
- };
5
- var __assign = (this && this.__assign) || function () {
6
- __assign = Object.assign || function(t) {
7
- for (var s, i = 1, n = arguments.length; i < n; i++) {
8
- s = arguments[i];
9
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
10
- t[p] = s[p];
11
- }
12
- return t;
13
- };
14
- return __assign.apply(this, arguments);
15
- };
16
- var __rest = (this && this.__rest) || function (s, e) {
17
- var t = {};
18
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
19
- t[p] = s[p];
20
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
21
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
22
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
23
- t[p[i]] = s[p[i]];
24
- }
25
- return t;
26
- };
27
- import { PickerTypes } from '@telia-ace/knowledge-widget-core';
28
- import { useProperties } from '@telia-ace/knowledge-widget-ui';
29
- import { appendClassNames } from '@telia-ace/widget-utilities';
30
- import React from 'react';
31
- import styled from 'styled-components';
32
- import Categories from './categories';
33
- import Functions from './functions';
34
- import Languages from './languages';
35
- var isEmpty = function (toolbar) {
36
- var _a = toolbar.allowCopy, allowCopy = _a === void 0 ? false : _a, _b = toolbar.allowPrint, allowPrint = _b === void 0 ? false : _b, _c = toolbar.guideCategories, guideCategories = _c === void 0 ? false : _c, _d = toolbar.language, language = _d === void 0 ? false : _d, _e = toolbar.showFavoriteToggle, showFavoriteToggle = _e === void 0 ? false : _e, _f = toolbar.picker, picker = _f === void 0 ? PickerTypes.NONE : _f;
37
- if ((!allowCopy && !allowPrint && !language && !showFavoriteToggle && !guideCategories) ||
38
- picker === PickerTypes.NONE) {
39
- return true;
40
- }
41
- return false;
42
- };
43
- var Toolbar = function (_a) {
44
- var _b = _a.className, className = _b === void 0 ? '' : _b, dispatch = _a.dispatch;
45
- var _c = useProperties(), toolbarLanguageHeader = _c.toolbarLanguageHeader, toolbarFunctionsHeader = _c.toolbarFunctionsHeader, toolbarLanguageTooltip = _c.toolbarLanguageTooltip, toolbarFunctionsTooltip = _c.toolbarFunctionsTooltip, toolbarFunctionsCloseButtonAriaLabel = _c.toolbarFunctionsCloseButtonAriaLabel, printActionLabel = _c.printActionLabel, copyActionLabel = _c.copyActionLabel, addFavoriteTooltip = _c.addFavoriteTooltip, removeFavoriteCancelLabel = _c.removeFavoriteCancelLabel, removeFavoriteConfirmLabel = _c.removeFavoriteConfirmLabel, removeFavoriteHeader = _c.removeFavoriteHeader, removeFavoriteLabel = _c.removeFavoriteLabel, removeFavoriteTooltip = _c.removeFavoriteTooltip, guide = _c.guide, toolbar = _c.toolbar, other = __rest(_c, ["toolbarLanguageHeader", "toolbarFunctionsHeader", "toolbarLanguageTooltip", "toolbarFunctionsTooltip", "toolbarFunctionsCloseButtonAriaLabel", "printActionLabel", "copyActionLabel", "addFavoriteTooltip", "removeFavoriteCancelLabel", "removeFavoriteConfirmLabel", "removeFavoriteHeader", "removeFavoriteLabel", "removeFavoriteTooltip", "guide", "toolbar"]);
46
- if (!guide || !toolbar || isEmpty(toolbar)) {
47
- return null;
48
- }
49
- var language = toolbar.language, guideCategories = toolbar.guideCategories, allowCopy = toolbar.allowCopy, allowPrint = toolbar.allowPrint, showFavoriteToggle = toolbar.showFavoriteToggle, picker = toolbar.picker;
50
- return (React.createElement(Wrapper, { className: appendClassNames('humany-guide-toolbar', className) },
51
- language && Object.keys(guide.translations || {}).length > 1 && (React.createElement(Languages, __assign({ guide: guide, header: toolbarLanguageHeader, tooltip: toolbarLanguageTooltip, picker: picker }, other))),
52
- guideCategories && React.createElement(Categories, { guide: guide, toolbar: toolbar }),
53
- (allowCopy || allowPrint || showFavoriteToggle) && (React.createElement(Functions, { guide: guide, header: toolbarFunctionsHeader, tooltip: toolbarFunctionsTooltip, printActionLabel: printActionLabel, copyActionLabel: copyActionLabel, addFavoriteTooltip: addFavoriteTooltip, removeFavoriteCancelLabel: removeFavoriteCancelLabel, removeFavoriteConfirmLabel: removeFavoriteConfirmLabel, removeFavoriteHeader: removeFavoriteHeader, removeFavoriteLabel: removeFavoriteLabel, removeFavoriteTooltip: removeFavoriteTooltip, toolbarFunctionsCloseButtonAriaLabel: toolbarFunctionsCloseButtonAriaLabel, allowCopy: allowCopy, allowPrint: allowPrint, showFavoriteToggle: showFavoriteToggle, picker: picker, dispatch: dispatch }))));
54
- };
55
- export default Toolbar;
56
- var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 0 0 auto;\n\n > :not(:last-child) {\n margin: 0 calc(", " * 2) 0 0;\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 0 0 auto;\n\n > :not(:last-child) {\n margin: 0 calc(", " * 2) 0 0;\n }\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; });
57
- var templateObject_1;
package/lib-esm/use-feedback.js DELETED
@@ -1,52 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- import { updateForm } from '@telia-ace/knowledge-widget-component-utilities';
13
- import { DataType, FeedbackType, } from '@telia-ace/knowledge-widget-types-grid';
14
- export default (function (container, controller) {
15
- controller.actions.create('feedback', function (input) {
16
- var type = input === 'negative' ? FeedbackType.Negative : FeedbackType.Positive;
17
- var _a = controller.properties(), guide = _a.guide, _b = _a.submitButtonLabel, submitButtonLabel = _b === void 0 ? 'Submit' : _b;
18
- if (guide) {
19
- var connection_1 = guide.connection, id_1 = guide.id, hasHandover_1 = guide.hasHandover;
20
- controller.writeProperties({
21
- feedbackGiven: input,
22
- loading: hasHandover_1 && type === FeedbackType.Negative,
23
- });
24
- var events = container.get('$widget').events;
25
- events.dispatch('tracking:feedback-given', {
26
- guide: guide,
27
- categories: guide.categories,
28
- feedbackType: type.toLowerCase(),
29
- });
30
- return container.getAsync('dataClient').then(function (dataClient) {
31
- return dataClient.feedback(id_1, connection_1, type).then(function () {
32
- if (hasHandover_1 && type === FeedbackType.Negative) {
33
- return dataClient
34
- .fetch(DataType.ContactMethods, { guideId: id_1 })
35
- .then(function (_a) {
36
- var contactMethods = _a.contactMethods;
37
- return controller.actions.dispatch('handover', {
38
- handoverContactMethods: contactMethods.map(function (cm) { return (__assign(__assign({}, cm), { body: updateForm(cm, {
39
- submit: submitButtonLabel,
40
- }) })); }),
41
- loading: false,
42
- });
43
- });
44
- }
45
- });
46
- });
47
- }
48
- });
49
- controller.actions.create('handover', function (input) {
50
- return controller.writeProperties(__assign(__assign({}, input), { loading: false }));
51
- });
52
- });