@telia-ace/knowledge-widget-components-contact-list 1.0.4 → 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.
- package/{lib-esm → dist}/contact-list-component.d.ts +0 -0
- package/{lib-esm → dist}/contact-list.d.ts +0 -0
- package/dist/contact-list.js +201 -0
- package/dist/contact-list.js.map +1 -0
- package/{lib-esm → dist}/deflection-list.d.ts +0 -0
- package/{lib-esm → dist}/index.d.ts +0 -0
- package/dist/index.js +101 -0
- package/dist/index.js.map +1 -0
- package/package.json +14 -15
- package/lib/contact-list-component.d.ts +0 -21
- package/lib/contact-list-component.js +0 -135
- package/lib/contact-list.d.ts +0 -6
- package/lib/contact-list.js +0 -69
- package/lib/deflection-list.d.ts +0 -13
- package/lib/deflection-list.js +0 -94
- package/lib/index.d.ts +0 -2
- package/lib/index.js +0 -7
- package/lib-esm/contact-list-component.js +0 -108
- package/lib-esm/contact-list.js +0 -64
- package/lib-esm/deflection-list.js +0 -66
- package/lib-esm/index.js +0 -2
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,201 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
32
|
+
import { ContactList as ContactList$1, contactItemList, contactLink } from "@telia-ace/knowledge-widget-adapters";
|
|
33
|
+
import { GuideList, contentBox, loadingOpacity, useRouteData, useComponentDescriptor, useContainer, useChildren, useDispatch, AccordionListItem, createEmptyComponent, Loader, ItemList, Link, borderTabStyle, useProperties, SymbolBadge, StyledText } from "@telia-ace/knowledge-widget-ui";
|
|
34
|
+
import { formatUrl, appendClassNames, createParams, findCategoryById } from "@telia-ace/widget-utilities";
|
|
35
|
+
import React, { useCallback } from "react";
|
|
36
|
+
import styled from "styled-components";
|
|
37
|
+
import { Component } from "@telia-ace/knowledge-widget-types-grid";
|
|
38
|
+
const DeflectionList = (_a) => {
|
|
39
|
+
var _b = _a, {
|
|
40
|
+
className,
|
|
41
|
+
guides,
|
|
42
|
+
header,
|
|
43
|
+
accordion,
|
|
44
|
+
loading,
|
|
45
|
+
route = "guide",
|
|
46
|
+
categoryTitle
|
|
47
|
+
} = _b, other = __objRest(_b, [
|
|
48
|
+
"className",
|
|
49
|
+
"guides",
|
|
50
|
+
"header",
|
|
51
|
+
"accordion",
|
|
52
|
+
"loading",
|
|
53
|
+
"route",
|
|
54
|
+
"categoryTitle"
|
|
55
|
+
]);
|
|
56
|
+
const {
|
|
57
|
+
name: routeName,
|
|
58
|
+
params: { contactCategory = 0, guide: currentGuideId }
|
|
59
|
+
} = useRouteData();
|
|
60
|
+
const { name: componentName } = useComponentDescriptor();
|
|
61
|
+
const container = useContainer();
|
|
62
|
+
const children = useChildren();
|
|
63
|
+
const dispatch = useDispatch();
|
|
64
|
+
const renderItem = useCallback((guide, index, items, defaultRenderer) => {
|
|
65
|
+
const { id, title } = guide;
|
|
66
|
+
if (accordion && currentGuideId === id) {
|
|
67
|
+
return /* @__PURE__ */ React.createElement(AccordionListItem, {
|
|
68
|
+
key: id,
|
|
69
|
+
id,
|
|
70
|
+
title,
|
|
71
|
+
route: routeName,
|
|
72
|
+
collapseUri: categoryTitle && formatUrl(categoryTitle)
|
|
73
|
+
}, children.map((child) => /* @__PURE__ */ React.createElement(Component, __spreadValues({
|
|
74
|
+
key: child.id,
|
|
75
|
+
id: child.id,
|
|
76
|
+
branch: "default"
|
|
77
|
+
}, { accordion }))));
|
|
78
|
+
}
|
|
79
|
+
return defaultRenderer ? defaultRenderer(guide, index, items, defaultRenderer) : null;
|
|
80
|
+
}, [accordion, children, currentGuideId]);
|
|
81
|
+
if (!guides.length && !loading) {
|
|
82
|
+
return createEmptyComponent(container, __spreadProps(__spreadValues({}, other), {
|
|
83
|
+
className: appendClassNames(className, "humany-deflection-list")
|
|
84
|
+
}));
|
|
85
|
+
}
|
|
86
|
+
return /* @__PURE__ */ React.createElement(StyledGuideList, __spreadProps(__spreadValues({}, other), {
|
|
87
|
+
"data-loading": loading,
|
|
88
|
+
className: appendClassNames(className, "humany-deflection-list"),
|
|
89
|
+
items: guides,
|
|
90
|
+
header,
|
|
91
|
+
expandable: !!accordion,
|
|
92
|
+
renderItem,
|
|
93
|
+
dispatch,
|
|
94
|
+
routing: {
|
|
95
|
+
guide: route
|
|
96
|
+
},
|
|
97
|
+
paramMappers: {
|
|
98
|
+
guide: ({ id, title }) => createParams({
|
|
99
|
+
contactCategory,
|
|
100
|
+
guide: id,
|
|
101
|
+
accordion: accordion ? componentName : void 0,
|
|
102
|
+
uriName: formatUrl(title)
|
|
103
|
+
})
|
|
104
|
+
}
|
|
105
|
+
}), /* @__PURE__ */ React.createElement(Loader, {
|
|
106
|
+
loading
|
|
107
|
+
}));
|
|
108
|
+
};
|
|
109
|
+
const StyledGuideList = styled(GuideList)`
|
|
110
|
+
${contentBox}
|
|
111
|
+
${loadingOpacity}
|
|
112
|
+
`;
|
|
113
|
+
const StyledContactList = styled(ContactList$1)`
|
|
114
|
+
${loadingOpacity}
|
|
115
|
+
${contentBox}
|
|
116
|
+
`;
|
|
117
|
+
const StyledItemList = styled(ItemList)`
|
|
118
|
+
${loadingOpacity}
|
|
119
|
+
${contentBox}
|
|
120
|
+
${contactItemList}
|
|
121
|
+
|
|
122
|
+
&& {
|
|
123
|
+
i {
|
|
124
|
+
font-size: 25px;
|
|
125
|
+
width: 1.28571429em;
|
|
126
|
+
text-align: center;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
`;
|
|
130
|
+
const StyledLink = styled(Link)`
|
|
131
|
+
&:focus {
|
|
132
|
+
${(p) => {
|
|
133
|
+
var _a;
|
|
134
|
+
return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && borderTabStyle;
|
|
135
|
+
}};
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
${contactLink}
|
|
139
|
+
`;
|
|
140
|
+
const ContactList = (_c) => {
|
|
141
|
+
var _d = _c, { className } = _d, other = __objRest(_d, ["className"]);
|
|
142
|
+
const dispatch = useDispatch();
|
|
143
|
+
const container = useContainer();
|
|
144
|
+
const routeData = useRouteData();
|
|
145
|
+
const {
|
|
146
|
+
deflectionHeader = "",
|
|
147
|
+
routes = {},
|
|
148
|
+
contactMethods = [],
|
|
149
|
+
categories = [],
|
|
150
|
+
guides = [],
|
|
151
|
+
deflectionAccordion = false,
|
|
152
|
+
loading = false
|
|
153
|
+
} = useProperties();
|
|
154
|
+
const { contactCategory: contactCategoryRoute, guide: guideRoute = "guide" } = routes;
|
|
155
|
+
if (!categories.length && !contactMethods.length && !loading) {
|
|
156
|
+
return createEmptyComponent(container, __spreadProps(__spreadValues({}, other), {
|
|
157
|
+
className: appendClassNames(className, "humany-contact-category-list")
|
|
158
|
+
}));
|
|
159
|
+
}
|
|
160
|
+
const {
|
|
161
|
+
name,
|
|
162
|
+
params: { contactCategory }
|
|
163
|
+
} = routeData;
|
|
164
|
+
const selectedCategory = findCategoryById(contactCategory, categories);
|
|
165
|
+
return !contactMethods.length ? /* @__PURE__ */ React.createElement(StyledItemList, __spreadProps(__spreadValues({}, other), {
|
|
166
|
+
"data-loading": loading,
|
|
167
|
+
className: appendClassNames(className, "humany-contact-category-list"),
|
|
168
|
+
items: selectedCategory && selectedCategory.items || categories,
|
|
169
|
+
renderItem: ({ id, title, symbol, matches, items }) => !!matches || items && !!items.length ? /* @__PURE__ */ React.createElement("li", {
|
|
170
|
+
key: id,
|
|
171
|
+
"data-contact-category": id
|
|
172
|
+
}, /* @__PURE__ */ React.createElement(StyledLink, {
|
|
173
|
+
routeName: contactCategoryRoute || name,
|
|
174
|
+
params: createParams({
|
|
175
|
+
contactCategory: id,
|
|
176
|
+
uriName: formatUrl(title)
|
|
177
|
+
})
|
|
178
|
+
}, symbol && /* @__PURE__ */ React.createElement(SymbolBadge, {
|
|
179
|
+
symbol
|
|
180
|
+
}), /* @__PURE__ */ React.createElement(StyledText, null, title))) : null
|
|
181
|
+
}), /* @__PURE__ */ React.createElement(Loader, {
|
|
182
|
+
loading
|
|
183
|
+
})) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(DeflectionList, {
|
|
184
|
+
className,
|
|
185
|
+
guides,
|
|
186
|
+
categoryTitle: selectedCategory && selectedCategory.title,
|
|
187
|
+
header: deflectionHeader,
|
|
188
|
+
route: guideRoute,
|
|
189
|
+
accordion: deflectionAccordion,
|
|
190
|
+
loading
|
|
191
|
+
}), /* @__PURE__ */ React.createElement(StyledContactList, {
|
|
192
|
+
"data-loading": loading,
|
|
193
|
+
className,
|
|
194
|
+
contactMethods,
|
|
195
|
+
dispatch
|
|
196
|
+
}, /* @__PURE__ */ React.createElement(Loader, {
|
|
197
|
+
loading
|
|
198
|
+
})));
|
|
199
|
+
};
|
|
200
|
+
export { ContactList as default };
|
|
201
|
+
//# sourceMappingURL=contact-list.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"contact-list.js","sources":["../src/deflection-list.tsx","../src/contact-list.tsx"],"sourcesContent":["import { Guide } from '@telia-ace/knowledge-widget-core';\r\nimport { Component } from '@telia-ace/knowledge-widget-types-grid';\r\nimport {\r\n AccordionListItem,\r\n contentBox,\r\n createEmptyComponent,\r\n GuideList,\r\n ItemRenderer,\r\n Loader,\r\n loadingOpacity,\r\n useChildren,\r\n useComponentDescriptor,\r\n useContainer,\r\n useDispatch,\r\n useRouteData,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport { appendClassNames, createParams, formatUrl } from '@telia-ace/widget-utilities';\r\nimport React, { useCallback } from 'react';\r\nimport styled from 'styled-components';\r\n\r\ntype Props = {\r\n className: string;\r\n guides: Guide[];\r\n header: string;\r\n accordion?: boolean;\r\n route?: string;\r\n loading: boolean;\r\n categoryTitle?: string;\r\n};\r\n\r\nconst DeflectionList: React.SFC<Props> = ({\r\n className,\r\n guides,\r\n header,\r\n accordion,\r\n loading,\r\n route = 'guide',\r\n categoryTitle,\r\n ...other\r\n}) => {\r\n const {\r\n name: routeName,\r\n params: { contactCategory = 0, guide: currentGuideId },\r\n } = useRouteData();\r\n const { name: componentName } = useComponentDescriptor();\r\n const container = useContainer();\r\n const children = useChildren();\r\n const dispatch = useDispatch();\r\n\r\n const renderItem: ItemRenderer = useCallback(\r\n (guide, index, items, defaultRenderer) => {\r\n const { id, title } = guide;\r\n if (accordion && currentGuideId === id) {\r\n return (\r\n <AccordionListItem\r\n key={id}\r\n id={id}\r\n title={title}\r\n route={routeName}\r\n collapseUri={categoryTitle && formatUrl(categoryTitle)}\r\n >\r\n {children.map((child) => (\r\n <Component\r\n key={child.id}\r\n id={child.id}\r\n branch=\"default\"\r\n {...{ accordion }}\r\n />\r\n ))}\r\n </AccordionListItem>\r\n );\r\n }\r\n\r\n return defaultRenderer ? defaultRenderer(guide, index, items, defaultRenderer) : null;\r\n },\r\n [accordion, children, currentGuideId]\r\n );\r\n\r\n if (!guides.length && !loading) {\r\n return createEmptyComponent(container, {\r\n ...other,\r\n className: appendClassNames(className, 'humany-deflection-list'),\r\n });\r\n }\r\n\r\n return (\r\n <StyledGuideList\r\n {...other}\r\n data-loading={loading}\r\n className={appendClassNames(className, 'humany-deflection-list')}\r\n items={guides}\r\n header={header}\r\n expandable={!!accordion}\r\n renderItem={renderItem}\r\n dispatch={dispatch}\r\n routing={{\r\n guide: route,\r\n }}\r\n paramMappers={{\r\n guide: ({ id, title }: Guide) =>\r\n createParams({\r\n contactCategory,\r\n guide: id,\r\n accordion: accordion ? componentName : undefined,\r\n uriName: formatUrl(title),\r\n }),\r\n }}\r\n >\r\n <Loader loading={loading} />\r\n </StyledGuideList>\r\n );\r\n};\r\n\r\nconst StyledGuideList = styled(GuideList)<{ 'data-loading': boolean } & any>`\r\n ${contentBox}\r\n ${loadingOpacity}\r\n`;\r\n\r\nexport default DeflectionList;\r\n","import {\r\n contactItemList,\r\n contactLink,\r\n ContactList as ContactListUi,\r\n} from '@telia-ace/knowledge-widget-adapters';\r\nimport { Category } from '@telia-ace/knowledge-widget-core';\r\nimport {\r\n borderTabStyle,\r\n contentBox,\r\n createEmptyComponent,\r\n ItemList,\r\n Link,\r\n Loader,\r\n loadingOpacity,\r\n StyledText,\r\n SymbolBadge,\r\n useContainer,\r\n useDispatch,\r\n useProperties,\r\n useRouteData,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport {\r\n appendClassNames,\r\n createParams,\r\n findCategoryById,\r\n formatUrl,\r\n} from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport { ContactListComponentProps } from './contact-list-component';\r\nimport DeflectionList from './deflection-list';\r\n\r\nconst StyledContactList = styled(ContactListUi)<any>`\r\n ${loadingOpacity}\r\n ${contentBox}\r\n`;\r\n\r\nconst StyledItemList = styled(ItemList)<any>`\r\n ${loadingOpacity}\r\n ${contentBox}\r\n ${contactItemList}\r\n\r\n && {\r\n i {\r\n font-size: 25px;\r\n width: 1.28571429em;\r\n text-align: center;\r\n }\r\n }\r\n`;\r\n\r\nconst StyledLink = styled(Link)<any>`\r\n &:focus {\r\n ${(p) => p.theme.accessibility?.isTabbing && borderTabStyle};\r\n }\r\n\r\n ${contactLink}\r\n`;\r\n\r\ntype Props = {\r\n className: string;\r\n};\r\n\r\nconst ContactList: React.SFC<Props> = ({ className, ...other }) => {\r\n const dispatch = useDispatch();\r\n const container = useContainer();\r\n const routeData = useRouteData();\r\n const {\r\n deflectionHeader = '',\r\n routes = {},\r\n contactMethods = [],\r\n categories = [],\r\n guides = [],\r\n deflectionAccordion = false,\r\n loading = false,\r\n } = useProperties<ContactListComponentProps>();\r\n\r\n const { contactCategory: contactCategoryRoute, guide: guideRoute = 'guide' } = routes;\r\n\r\n if (!categories.length && !contactMethods.length && !loading) {\r\n return createEmptyComponent(container, {\r\n ...other,\r\n className: appendClassNames(className, 'humany-contact-category-list'),\r\n });\r\n }\r\n\r\n const {\r\n name,\r\n params: { contactCategory },\r\n } = routeData;\r\n\r\n const selectedCategory: Category = findCategoryById(contactCategory, categories);\r\n\r\n return !contactMethods.length ? (\r\n <StyledItemList\r\n {...other}\r\n data-loading={loading}\r\n className={appendClassNames(className, 'humany-contact-category-list')}\r\n items={(selectedCategory && selectedCategory.items) || categories}\r\n renderItem={({ id, title, symbol, matches, items }: Category) =>\r\n !!matches || (items && !!items.length) ? (\r\n <li key={id} data-contact-category={id}>\r\n <StyledLink\r\n routeName={contactCategoryRoute || name}\r\n params={createParams({\r\n contactCategory: id,\r\n uriName: formatUrl(title),\r\n })}\r\n >\r\n {symbol && <SymbolBadge symbol={symbol} />}\r\n <StyledText>{title}</StyledText>\r\n </StyledLink>\r\n </li>\r\n ) : null\r\n }\r\n >\r\n <Loader loading={loading} />\r\n </StyledItemList>\r\n ) : (\r\n <>\r\n <DeflectionList\r\n className={className}\r\n guides={guides}\r\n categoryTitle={selectedCategory && selectedCategory.title}\r\n header={deflectionHeader}\r\n route={guideRoute}\r\n accordion={deflectionAccordion}\r\n loading={loading}\r\n />\r\n <StyledContactList\r\n data-loading={loading}\r\n className={className}\r\n contactMethods={contactMethods}\r\n dispatch={dispatch}\r\n >\r\n <Loader loading={loading} />\r\n </StyledContactList>\r\n </>\r\n );\r\n};\r\n\r\nexport default ContactList;\r\n"],"names":["ContactListUi"],"mappings":"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"}
|
|
File without changes
|
|
File without changes
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
import { updateForm, useForm, useExpand, fetchAccordionGuideIfMissing } from "@telia-ace/knowledge-widget-component-utilities";
|
|
21
|
+
import { createEventSubscriber, extendComponent } from "@telia-ace/knowledge-widget-core";
|
|
22
|
+
import { DataType } from "@telia-ace/knowledge-widget-types-grid";
|
|
23
|
+
import { createReactComponent } from "@telia-ace/knowledge-widget-ui";
|
|
24
|
+
const ContactListComponent = (container) => {
|
|
25
|
+
const { events } = container.get("$widget");
|
|
26
|
+
const [subscribe, unsubscribe] = createEventSubscriber(events);
|
|
27
|
+
return createReactComponent(container, "contact-list", import("./contact-list.js"), (component) => {
|
|
28
|
+
const fetch = (params) => {
|
|
29
|
+
component.writeProperties({ loading: true, contactMethods: [], categories: [] });
|
|
30
|
+
component.actions.dispatch("fetch", { params });
|
|
31
|
+
};
|
|
32
|
+
component.actions.create("fetch", (data) => {
|
|
33
|
+
const { submitButtonLabel = "Submit" } = component.properties();
|
|
34
|
+
const contactMethods = (data.contactMethods || []).map((cm) => __spreadProps(__spreadValues({}, cm), {
|
|
35
|
+
body: updateForm(cm, { submit: submitButtonLabel })
|
|
36
|
+
}));
|
|
37
|
+
return component.actions.dispatch("fetched", __spreadProps(__spreadValues({}, data), {
|
|
38
|
+
contactMethods,
|
|
39
|
+
loading: true
|
|
40
|
+
}));
|
|
41
|
+
});
|
|
42
|
+
component.actions.create("fetched", (input) => {
|
|
43
|
+
return component.writeProperties(__spreadProps(__spreadValues({}, input), {
|
|
44
|
+
guides: input.guides || [],
|
|
45
|
+
loading: false
|
|
46
|
+
}));
|
|
47
|
+
});
|
|
48
|
+
container.getAsync("router").then((router) => {
|
|
49
|
+
const { params } = router.getRouteData();
|
|
50
|
+
fetch(params);
|
|
51
|
+
});
|
|
52
|
+
subscribe("router:changed", (event, { current }) => {
|
|
53
|
+
fetch(current.routeData.params);
|
|
54
|
+
});
|
|
55
|
+
useForm(container, component);
|
|
56
|
+
useExpand(component);
|
|
57
|
+
}).then(() => {
|
|
58
|
+
return extendComponent(container, "contact-list", (component) => {
|
|
59
|
+
component.actions.watch("contact-list.fetch", (input, next) => {
|
|
60
|
+
const {
|
|
61
|
+
deflection = {},
|
|
62
|
+
deflectionPageSize = 5,
|
|
63
|
+
deflectionAccordion
|
|
64
|
+
} = component.properties();
|
|
65
|
+
const { params = {} } = input;
|
|
66
|
+
const {
|
|
67
|
+
contactCategory,
|
|
68
|
+
guide: guideParam,
|
|
69
|
+
accordion: accordionParam
|
|
70
|
+
} = params;
|
|
71
|
+
return container.getAsync("dataClient").then((dataClient) => {
|
|
72
|
+
return dataClient.fetch(DataType.ContactMethodCategories, {
|
|
73
|
+
contactMethodCategoryId: contactCategory
|
|
74
|
+
}).then(({ contactMethods, categories }) => {
|
|
75
|
+
var _a;
|
|
76
|
+
const deflectionKeys = Object.keys(deflection);
|
|
77
|
+
const currentCategory = deflectionKeys.length === 1 && !contactCategory ? deflectionKeys[0] : contactCategory;
|
|
78
|
+
if ((_a = deflection[currentCategory]) == null ? void 0 : _a.length) {
|
|
79
|
+
return dataClient.fetch(DataType.Guides, {
|
|
80
|
+
categories: deflection[currentCategory],
|
|
81
|
+
take: deflectionPageSize
|
|
82
|
+
}).then((data) => {
|
|
83
|
+
if (deflectionAccordion && guideParam && accordionParam === component.node.name) {
|
|
84
|
+
return fetchAccordionGuideIfMissing(data, dataClient, { guide: guideParam });
|
|
85
|
+
}
|
|
86
|
+
return new Promise((resolve) => resolve(data));
|
|
87
|
+
}).then(({ guides }) => {
|
|
88
|
+
return next({ guides, contactMethods, categories });
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
return next({ contactMethods, categories });
|
|
92
|
+
});
|
|
93
|
+
});
|
|
94
|
+
});
|
|
95
|
+
});
|
|
96
|
+
}).then(() => {
|
|
97
|
+
unsubscribe();
|
|
98
|
+
});
|
|
99
|
+
};
|
|
100
|
+
export { ContactListComponent as default };
|
|
101
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/contact-list-component.ts"],"sourcesContent":["import { ContactMethodType } from '@telia-ace/knowledge-widget-adapters';\r\nimport {\r\n fetchAccordionGuideIfMissing,\r\n updateForm,\r\n useExpand,\r\n useForm,\r\n} from '@telia-ace/knowledge-widget-component-utilities';\r\nimport {\r\n Category,\r\n createEventSubscriber,\r\n extendComponent,\r\n Guide,\r\n} from '@telia-ace/knowledge-widget-core';\r\nimport {\r\n ContactsResult,\r\n DataClient,\r\n DataType,\r\n MatchResult,\r\n} from '@telia-ace/knowledge-widget-types-grid';\r\nimport { createReactComponent } from '@telia-ace/knowledge-widget-ui';\r\nimport { FormComponentInstanceProperties } from '@telia-ace/widget-forms';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\nexport type ContactListComponentProps = {\r\n deflectionHeader?: string;\r\n deflection?: { [contactCategoryId: string]: string[] };\r\n deflectionPageSize?: number;\r\n routes?: {\r\n contactCategory?: string;\r\n guide?: string;\r\n };\r\n categories?: Category[]; // internal\r\n contactMethods?: ContactMethodType[]; // internal\r\n guides?: Guide[]; // internal\r\n deflectionAccordion?: boolean;\r\n} & FormComponentInstanceProperties;\r\n\r\nexport const ContactListComponent = (container: Container) => {\r\n const { events } = container.get('$widget');\r\n const [subscribe, unsubscribe] = createEventSubscriber(events);\r\n\r\n return createReactComponent(\r\n container,\r\n 'contact-list',\r\n import('./contact-list'),\r\n (component) => {\r\n const fetch = (params: { [key: string]: any }) => {\r\n component.writeProperties({ loading: true, contactMethods: [], categories: [] });\r\n component.actions.dispatch('fetch', { params });\r\n };\r\n\r\n component.actions.create('fetch', (data) => {\r\n const { submitButtonLabel = 'Submit' } =\r\n component.properties<ContactListComponentProps>();\r\n\r\n const contactMethods = (data.contactMethods || []).map((cm: ContactMethodType) => ({\r\n ...cm,\r\n body: updateForm(cm, { submit: submitButtonLabel }),\r\n }));\r\n\r\n return component.actions.dispatch('fetched', {\r\n ...data,\r\n contactMethods,\r\n loading: true,\r\n });\r\n });\r\n\r\n component.actions.create('fetched', (input) => {\r\n return component.writeProperties({\r\n ...input,\r\n guides: input.guides || [],\r\n loading: false,\r\n });\r\n });\r\n\r\n container.getAsync('router').then((router) => {\r\n const { params } = router.getRouteData();\r\n fetch(params);\r\n });\r\n\r\n subscribe('router:changed', (event: any, { current }: any) => {\r\n fetch(current.routeData.params);\r\n });\r\n\r\n useForm(container, component);\r\n useExpand(component);\r\n }\r\n )\r\n .then(() => {\r\n return extendComponent(container, 'contact-list', (component) => {\r\n component.actions.watch('contact-list.fetch', (input, next) => {\r\n const {\r\n deflection = {},\r\n deflectionPageSize = 5,\r\n deflectionAccordion,\r\n } = component.properties<ContactListComponentProps>();\r\n const { params = {} } = input;\r\n const {\r\n contactCategory,\r\n guide: guideParam,\r\n accordion: accordionParam,\r\n } = params;\r\n return container.getAsync('dataClient').then((dataClient: DataClient) => {\r\n return dataClient\r\n .fetch(DataType.ContactMethodCategories, {\r\n contactMethodCategoryId: contactCategory,\r\n })\r\n .then(({ contactMethods, categories }: ContactsResult) => {\r\n const deflectionKeys = Object.keys(deflection);\r\n const currentCategory =\r\n deflectionKeys.length === 1 && !contactCategory\r\n ? deflectionKeys[0]\r\n : contactCategory;\r\n\r\n if (deflection[currentCategory]?.length) {\r\n return dataClient\r\n .fetch(DataType.Guides, {\r\n categories: deflection[currentCategory],\r\n take: deflectionPageSize,\r\n })\r\n .then((data: MatchResult) => {\r\n if (\r\n deflectionAccordion &&\r\n guideParam &&\r\n accordionParam === component.node.name\r\n ) {\r\n return fetchAccordionGuideIfMissing(\r\n data,\r\n dataClient,\r\n { guide: guideParam }\r\n );\r\n }\r\n return new Promise<MatchResult>((resolve) =>\r\n resolve(data)\r\n );\r\n })\r\n .then(({ guides }: MatchResult) => {\r\n return next({ guides, contactMethods, categories });\r\n });\r\n }\r\n\r\n return next({ contactMethods, categories });\r\n });\r\n });\r\n });\r\n });\r\n })\r\n .then(() => {\r\n unsubscribe();\r\n });\r\n};\r\n\r\nexport default ContactListComponent;\r\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,36 +1,35 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@telia-ace/knowledge-widget-components-contact-list",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.8",
|
|
4
4
|
"description": "Contact list component for ACE Knowledge Widgets.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"author": "Telia Company AB",
|
|
7
7
|
"keywords": [
|
|
8
8
|
"telia"
|
|
9
9
|
],
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"module": "dist/index.js",
|
|
11
|
+
"types": "dist/index.d.ts",
|
|
12
12
|
"files": [
|
|
13
13
|
"LICENSE.txt",
|
|
14
14
|
"README.md",
|
|
15
|
-
"
|
|
16
|
-
"lib-esm/"
|
|
15
|
+
"dist/"
|
|
17
16
|
],
|
|
18
17
|
"publishConfig": {
|
|
19
18
|
"access": "public"
|
|
20
19
|
},
|
|
21
20
|
"scripts": {
|
|
22
|
-
"clean": "
|
|
23
|
-
"
|
|
21
|
+
"clean": "rimraf ./dist",
|
|
22
|
+
"precompile": "tsc -emitDeclarationOnly",
|
|
23
|
+
"compile": "vite build"
|
|
24
24
|
},
|
|
25
25
|
"sideEffects": false,
|
|
26
|
-
"typings": "lib/index.d.ts",
|
|
27
26
|
"dependencies": {
|
|
28
|
-
"@telia-ace/knowledge-widget-adapters": "^1.0.
|
|
29
|
-
"@telia-ace/knowledge-widget-component-utilities": "^1.0.
|
|
30
|
-
"@telia-ace/knowledge-widget-core": "^1.0.
|
|
31
|
-
"@telia-ace/knowledge-widget-types-grid": "^1.0.
|
|
32
|
-
"@telia-ace/knowledge-widget-ui": "^1.0.
|
|
33
|
-
"@telia-ace/widget-forms": "^1.0.
|
|
27
|
+
"@telia-ace/knowledge-widget-adapters": "^1.0.14",
|
|
28
|
+
"@telia-ace/knowledge-widget-component-utilities": "^1.0.8",
|
|
29
|
+
"@telia-ace/knowledge-widget-core": "^1.0.7",
|
|
30
|
+
"@telia-ace/knowledge-widget-types-grid": "^1.0.14",
|
|
31
|
+
"@telia-ace/knowledge-widget-ui": "^1.0.11",
|
|
32
|
+
"@telia-ace/widget-forms": "^1.0.9",
|
|
34
33
|
"@telia-ace/widget-utilities": "^1.0.1",
|
|
35
34
|
"@webprovisions/platform": "^1.1.2"
|
|
36
35
|
},
|
|
@@ -44,5 +43,5 @@
|
|
|
44
43
|
"@types/react-dom": "^16.8.0",
|
|
45
44
|
"@types/styled-components": "^5.1.7"
|
|
46
45
|
},
|
|
47
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "15dba08c1ba1c3c117353e50a2586be05a966288"
|
|
48
47
|
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { ContactMethodType } from '@telia-ace/knowledge-widget-adapters';
|
|
2
|
-
import { Category, Guide } from '@telia-ace/knowledge-widget-core';
|
|
3
|
-
import { FormComponentInstanceProperties } from '@telia-ace/widget-forms';
|
|
4
|
-
import { Container } from '@webprovisions/platform';
|
|
5
|
-
export declare type ContactListComponentProps = {
|
|
6
|
-
deflectionHeader?: string;
|
|
7
|
-
deflection?: {
|
|
8
|
-
[contactCategoryId: string]: string[];
|
|
9
|
-
};
|
|
10
|
-
deflectionPageSize?: number;
|
|
11
|
-
routes?: {
|
|
12
|
-
contactCategory?: string;
|
|
13
|
-
guide?: string;
|
|
14
|
-
};
|
|
15
|
-
categories?: Category[];
|
|
16
|
-
contactMethods?: ContactMethodType[];
|
|
17
|
-
guides?: Guide[];
|
|
18
|
-
deflectionAccordion?: boolean;
|
|
19
|
-
} & FormComponentInstanceProperties;
|
|
20
|
-
export declare const ContactListComponent: (container: Container) => Promise<void>;
|
|
21
|
-
export default ContactListComponent;
|
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
-
}
|
|
19
|
-
Object.defineProperty(o, k2, desc);
|
|
20
|
-
}) : (function(o, m, k, k2) {
|
|
21
|
-
if (k2 === undefined) k2 = k;
|
|
22
|
-
o[k2] = m[k];
|
|
23
|
-
}));
|
|
24
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
-
}) : function(o, v) {
|
|
27
|
-
o["default"] = v;
|
|
28
|
-
});
|
|
29
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
-
if (mod && mod.__esModule) return mod;
|
|
31
|
-
var result = {};
|
|
32
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
-
__setModuleDefault(result, mod);
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
37
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
38
|
-
if (!m) return o;
|
|
39
|
-
var i = m.call(o), r, ar = [], e;
|
|
40
|
-
try {
|
|
41
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
42
|
-
}
|
|
43
|
-
catch (error) { e = { error: error }; }
|
|
44
|
-
finally {
|
|
45
|
-
try {
|
|
46
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
47
|
-
}
|
|
48
|
-
finally { if (e) throw e.error; }
|
|
49
|
-
}
|
|
50
|
-
return ar;
|
|
51
|
-
};
|
|
52
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
53
|
-
exports.ContactListComponent = void 0;
|
|
54
|
-
var knowledge_widget_component_utilities_1 = require("@telia-ace/knowledge-widget-component-utilities");
|
|
55
|
-
var knowledge_widget_core_1 = require("@telia-ace/knowledge-widget-core");
|
|
56
|
-
var knowledge_widget_types_grid_1 = require("@telia-ace/knowledge-widget-types-grid");
|
|
57
|
-
var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
|
|
58
|
-
var ContactListComponent = function (container) {
|
|
59
|
-
var events = container.get('$widget').events;
|
|
60
|
-
var _a = __read((0, knowledge_widget_core_1.createEventSubscriber)(events), 2), subscribe = _a[0], unsubscribe = _a[1];
|
|
61
|
-
return (0, knowledge_widget_ui_1.createReactComponent)(container, 'contact-list', Promise.resolve().then(function () { return __importStar(require('./contact-list')); }), function (component) {
|
|
62
|
-
var fetch = function (params) {
|
|
63
|
-
component.writeProperties({ loading: true, contactMethods: [], categories: [] });
|
|
64
|
-
component.actions.dispatch('fetch', { params: params });
|
|
65
|
-
};
|
|
66
|
-
component.actions.create('fetch', function (data) {
|
|
67
|
-
var _a = component.properties().submitButtonLabel, submitButtonLabel = _a === void 0 ? 'Submit' : _a;
|
|
68
|
-
var contactMethods = (data.contactMethods || []).map(function (cm) { return (__assign(__assign({}, cm), { body: (0, knowledge_widget_component_utilities_1.updateForm)(cm, { submit: submitButtonLabel }) })); });
|
|
69
|
-
return component.actions.dispatch('fetched', __assign(__assign({}, data), { contactMethods: contactMethods, loading: true }));
|
|
70
|
-
});
|
|
71
|
-
component.actions.create('fetched', function (input) {
|
|
72
|
-
return component.writeProperties(__assign(__assign({}, input), { guides: input.guides || [], loading: false }));
|
|
73
|
-
});
|
|
74
|
-
container.getAsync('router').then(function (router) {
|
|
75
|
-
var params = router.getRouteData().params;
|
|
76
|
-
fetch(params);
|
|
77
|
-
});
|
|
78
|
-
subscribe('router:changed', function (event, _a) {
|
|
79
|
-
var current = _a.current;
|
|
80
|
-
fetch(current.routeData.params);
|
|
81
|
-
});
|
|
82
|
-
(0, knowledge_widget_component_utilities_1.useForm)(container, component);
|
|
83
|
-
(0, knowledge_widget_component_utilities_1.useExpand)(component);
|
|
84
|
-
})
|
|
85
|
-
.then(function () {
|
|
86
|
-
return (0, knowledge_widget_core_1.extendComponent)(container, 'contact-list', function (component) {
|
|
87
|
-
component.actions.watch('contact-list.fetch', function (input, next) {
|
|
88
|
-
var _a = component.properties(), _b = _a.deflection, deflection = _b === void 0 ? {} : _b, _c = _a.deflectionPageSize, deflectionPageSize = _c === void 0 ? 5 : _c, deflectionAccordion = _a.deflectionAccordion;
|
|
89
|
-
var _d = input.params, params = _d === void 0 ? {} : _d;
|
|
90
|
-
var contactCategory = params.contactCategory, guideParam = params.guide, accordionParam = params.accordion;
|
|
91
|
-
return container.getAsync('dataClient').then(function (dataClient) {
|
|
92
|
-
return dataClient
|
|
93
|
-
.fetch(knowledge_widget_types_grid_1.DataType.ContactMethodCategories, {
|
|
94
|
-
contactMethodCategoryId: contactCategory,
|
|
95
|
-
})
|
|
96
|
-
.then(function (_a) {
|
|
97
|
-
var _b;
|
|
98
|
-
var contactMethods = _a.contactMethods, categories = _a.categories;
|
|
99
|
-
var deflectionKeys = Object.keys(deflection);
|
|
100
|
-
var currentCategory = deflectionKeys.length === 1 && !contactCategory
|
|
101
|
-
? deflectionKeys[0]
|
|
102
|
-
: contactCategory;
|
|
103
|
-
if ((_b = deflection[currentCategory]) === null || _b === void 0 ? void 0 : _b.length) {
|
|
104
|
-
return dataClient
|
|
105
|
-
.fetch(knowledge_widget_types_grid_1.DataType.Guides, {
|
|
106
|
-
categories: deflection[currentCategory],
|
|
107
|
-
take: deflectionPageSize,
|
|
108
|
-
})
|
|
109
|
-
.then(function (data) {
|
|
110
|
-
if (deflectionAccordion &&
|
|
111
|
-
guideParam &&
|
|
112
|
-
accordionParam === component.node.name) {
|
|
113
|
-
return (0, knowledge_widget_component_utilities_1.fetchAccordionGuideIfMissing)(data, dataClient, { guide: guideParam });
|
|
114
|
-
}
|
|
115
|
-
return new Promise(function (resolve) {
|
|
116
|
-
return resolve(data);
|
|
117
|
-
});
|
|
118
|
-
})
|
|
119
|
-
.then(function (_a) {
|
|
120
|
-
var guides = _a.guides;
|
|
121
|
-
return next({ guides: guides, contactMethods: contactMethods, categories: categories });
|
|
122
|
-
});
|
|
123
|
-
}
|
|
124
|
-
return next({ contactMethods: contactMethods, categories: categories });
|
|
125
|
-
});
|
|
126
|
-
});
|
|
127
|
-
});
|
|
128
|
-
});
|
|
129
|
-
})
|
|
130
|
-
.then(function () {
|
|
131
|
-
unsubscribe();
|
|
132
|
-
});
|
|
133
|
-
};
|
|
134
|
-
exports.ContactListComponent = ContactListComponent;
|
|
135
|
-
exports.default = exports.ContactListComponent;
|
package/lib/contact-list.d.ts
DELETED
package/lib/contact-list.js
DELETED
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
|
-
var __assign = (this && this.__assign) || function () {
|
|
7
|
-
__assign = Object.assign || function(t) {
|
|
8
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
-
s = arguments[i];
|
|
10
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
-
t[p] = s[p];
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
};
|
|
15
|
-
return __assign.apply(this, arguments);
|
|
16
|
-
};
|
|
17
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
18
|
-
var t = {};
|
|
19
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
20
|
-
t[p] = s[p];
|
|
21
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
22
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
23
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
24
|
-
t[p[i]] = s[p[i]];
|
|
25
|
-
}
|
|
26
|
-
return t;
|
|
27
|
-
};
|
|
28
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
29
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
30
|
-
};
|
|
31
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
32
|
-
var knowledge_widget_adapters_1 = require("@telia-ace/knowledge-widget-adapters");
|
|
33
|
-
var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
|
|
34
|
-
var widget_utilities_1 = require("@telia-ace/widget-utilities");
|
|
35
|
-
var react_1 = __importDefault(require("react"));
|
|
36
|
-
var styled_components_1 = __importDefault(require("styled-components"));
|
|
37
|
-
var deflection_list_1 = __importDefault(require("./deflection-list"));
|
|
38
|
-
var StyledContactList = (0, styled_components_1.default)(knowledge_widget_adapters_1.ContactList)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), knowledge_widget_ui_1.loadingOpacity, knowledge_widget_ui_1.contentBox);
|
|
39
|
-
var StyledItemList = (0, styled_components_1.default)(knowledge_widget_ui_1.ItemList)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n\n && {\n i {\n font-size: 25px;\n width: 1.28571429em;\n text-align: center;\n }\n }\n"], ["\n ", "\n ", "\n ", "\n\n && {\n i {\n font-size: 25px;\n width: 1.28571429em;\n text-align: center;\n }\n }\n"])), knowledge_widget_ui_1.loadingOpacity, knowledge_widget_ui_1.contentBox, knowledge_widget_adapters_1.contactItemList);
|
|
40
|
-
var StyledLink = (0, styled_components_1.default)(knowledge_widget_ui_1.Link)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &:focus {\n ", ";\n }\n\n ", "\n"], ["\n &:focus {\n ", ";\n }\n\n ", "\n"])), function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.borderTabStyle; }, knowledge_widget_adapters_1.contactLink);
|
|
41
|
-
var ContactList = function (_a) {
|
|
42
|
-
var className = _a.className, other = __rest(_a, ["className"]);
|
|
43
|
-
var dispatch = (0, knowledge_widget_ui_1.useDispatch)();
|
|
44
|
-
var container = (0, knowledge_widget_ui_1.useContainer)();
|
|
45
|
-
var routeData = (0, knowledge_widget_ui_1.useRouteData)();
|
|
46
|
-
var _b = (0, knowledge_widget_ui_1.useProperties)(), _c = _b.deflectionHeader, deflectionHeader = _c === void 0 ? '' : _c, _d = _b.routes, routes = _d === void 0 ? {} : _d, _e = _b.contactMethods, contactMethods = _e === void 0 ? [] : _e, _f = _b.categories, categories = _f === void 0 ? [] : _f, _g = _b.guides, guides = _g === void 0 ? [] : _g, _h = _b.deflectionAccordion, deflectionAccordion = _h === void 0 ? false : _h, _j = _b.loading, loading = _j === void 0 ? false : _j;
|
|
47
|
-
var contactCategoryRoute = routes.contactCategory, _k = routes.guide, guideRoute = _k === void 0 ? 'guide' : _k;
|
|
48
|
-
if (!categories.length && !contactMethods.length && !loading) {
|
|
49
|
-
return (0, knowledge_widget_ui_1.createEmptyComponent)(container, __assign(__assign({}, other), { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-category-list') }));
|
|
50
|
-
}
|
|
51
|
-
var name = routeData.name, contactCategory = routeData.params.contactCategory;
|
|
52
|
-
var selectedCategory = (0, widget_utilities_1.findCategoryById)(contactCategory, categories);
|
|
53
|
-
return !contactMethods.length ? (react_1.default.createElement(StyledItemList, __assign({}, other, { "data-loading": loading, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-contact-category-list'), items: (selectedCategory && selectedCategory.items) || categories, renderItem: function (_a) {
|
|
54
|
-
var id = _a.id, title = _a.title, symbol = _a.symbol, matches = _a.matches, items = _a.items;
|
|
55
|
-
return !!matches || (items && !!items.length) ? (react_1.default.createElement("li", { key: id, "data-contact-category": id },
|
|
56
|
-
react_1.default.createElement(StyledLink, { routeName: contactCategoryRoute || name, params: (0, widget_utilities_1.createParams)({
|
|
57
|
-
contactCategory: id,
|
|
58
|
-
uriName: (0, widget_utilities_1.formatUrl)(title),
|
|
59
|
-
}) },
|
|
60
|
-
symbol && react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: symbol }),
|
|
61
|
-
react_1.default.createElement(knowledge_widget_ui_1.StyledText, null, title)))) : null;
|
|
62
|
-
} }),
|
|
63
|
-
react_1.default.createElement(knowledge_widget_ui_1.Loader, { loading: loading }))) : (react_1.default.createElement(react_1.default.Fragment, null,
|
|
64
|
-
react_1.default.createElement(deflection_list_1.default, { className: className, guides: guides, categoryTitle: selectedCategory && selectedCategory.title, header: deflectionHeader, route: guideRoute, accordion: deflectionAccordion, loading: loading }),
|
|
65
|
-
react_1.default.createElement(StyledContactList, { "data-loading": loading, className: className, contactMethods: contactMethods, dispatch: dispatch },
|
|
66
|
-
react_1.default.createElement(knowledge_widget_ui_1.Loader, { loading: loading }))));
|
|
67
|
-
};
|
|
68
|
-
exports.default = ContactList;
|
|
69
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
package/lib/deflection-list.d.ts
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { Guide } from '@telia-ace/knowledge-widget-core';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
declare type Props = {
|
|
4
|
-
className: string;
|
|
5
|
-
guides: Guide[];
|
|
6
|
-
header: string;
|
|
7
|
-
accordion?: boolean;
|
|
8
|
-
route?: string;
|
|
9
|
-
loading: boolean;
|
|
10
|
-
categoryTitle?: string;
|
|
11
|
-
};
|
|
12
|
-
declare const DeflectionList: React.SFC<Props>;
|
|
13
|
-
export default DeflectionList;
|
package/lib/deflection-list.js
DELETED
|
@@ -1,94 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
|
-
var __assign = (this && this.__assign) || function () {
|
|
7
|
-
__assign = Object.assign || function(t) {
|
|
8
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
-
s = arguments[i];
|
|
10
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
-
t[p] = s[p];
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
};
|
|
15
|
-
return __assign.apply(this, arguments);
|
|
16
|
-
};
|
|
17
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
18
|
-
if (k2 === undefined) k2 = k;
|
|
19
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
20
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
21
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
22
|
-
}
|
|
23
|
-
Object.defineProperty(o, k2, desc);
|
|
24
|
-
}) : (function(o, m, k, k2) {
|
|
25
|
-
if (k2 === undefined) k2 = k;
|
|
26
|
-
o[k2] = m[k];
|
|
27
|
-
}));
|
|
28
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
29
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
30
|
-
}) : function(o, v) {
|
|
31
|
-
o["default"] = v;
|
|
32
|
-
});
|
|
33
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
34
|
-
if (mod && mod.__esModule) return mod;
|
|
35
|
-
var result = {};
|
|
36
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
37
|
-
__setModuleDefault(result, mod);
|
|
38
|
-
return result;
|
|
39
|
-
};
|
|
40
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
41
|
-
var t = {};
|
|
42
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
43
|
-
t[p] = s[p];
|
|
44
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
45
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
46
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
47
|
-
t[p[i]] = s[p[i]];
|
|
48
|
-
}
|
|
49
|
-
return t;
|
|
50
|
-
};
|
|
51
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
52
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
53
|
-
};
|
|
54
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
55
|
-
var knowledge_widget_types_grid_1 = require("@telia-ace/knowledge-widget-types-grid");
|
|
56
|
-
var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
|
|
57
|
-
var widget_utilities_1 = require("@telia-ace/widget-utilities");
|
|
58
|
-
var react_1 = __importStar(require("react"));
|
|
59
|
-
var styled_components_1 = __importDefault(require("styled-components"));
|
|
60
|
-
var DeflectionList = function (_a) {
|
|
61
|
-
var className = _a.className, guides = _a.guides, header = _a.header, accordion = _a.accordion, loading = _a.loading, _b = _a.route, route = _b === void 0 ? 'guide' : _b, categoryTitle = _a.categoryTitle, other = __rest(_a, ["className", "guides", "header", "accordion", "loading", "route", "categoryTitle"]);
|
|
62
|
-
var _c = (0, knowledge_widget_ui_1.useRouteData)(), routeName = _c.name, _d = _c.params, _e = _d.contactCategory, contactCategory = _e === void 0 ? 0 : _e, currentGuideId = _d.guide;
|
|
63
|
-
var componentName = (0, knowledge_widget_ui_1.useComponentDescriptor)().name;
|
|
64
|
-
var container = (0, knowledge_widget_ui_1.useContainer)();
|
|
65
|
-
var children = (0, knowledge_widget_ui_1.useChildren)();
|
|
66
|
-
var dispatch = (0, knowledge_widget_ui_1.useDispatch)();
|
|
67
|
-
var renderItem = (0, react_1.useCallback)(function (guide, index, items, defaultRenderer) {
|
|
68
|
-
var id = guide.id, title = guide.title;
|
|
69
|
-
if (accordion && currentGuideId === id) {
|
|
70
|
-
return (react_1.default.createElement(knowledge_widget_ui_1.AccordionListItem, { key: id, id: id, title: title, route: routeName, collapseUri: categoryTitle && (0, widget_utilities_1.formatUrl)(categoryTitle) }, children.map(function (child) { return (react_1.default.createElement(knowledge_widget_types_grid_1.Component, __assign({ key: child.id, id: child.id, branch: "default" }, { accordion: accordion }))); })));
|
|
71
|
-
}
|
|
72
|
-
return defaultRenderer ? defaultRenderer(guide, index, items, defaultRenderer) : null;
|
|
73
|
-
}, [accordion, children, currentGuideId]);
|
|
74
|
-
if (!guides.length && !loading) {
|
|
75
|
-
return (0, knowledge_widget_ui_1.createEmptyComponent)(container, __assign(__assign({}, other), { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-deflection-list') }));
|
|
76
|
-
}
|
|
77
|
-
return (react_1.default.createElement(StyledGuideList, __assign({}, other, { "data-loading": loading, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-deflection-list'), items: guides, header: header, expandable: !!accordion, renderItem: renderItem, dispatch: dispatch, routing: {
|
|
78
|
-
guide: route,
|
|
79
|
-
}, paramMappers: {
|
|
80
|
-
guide: function (_a) {
|
|
81
|
-
var id = _a.id, title = _a.title;
|
|
82
|
-
return (0, widget_utilities_1.createParams)({
|
|
83
|
-
contactCategory: contactCategory,
|
|
84
|
-
guide: id,
|
|
85
|
-
accordion: accordion ? componentName : undefined,
|
|
86
|
-
uriName: (0, widget_utilities_1.formatUrl)(title),
|
|
87
|
-
});
|
|
88
|
-
},
|
|
89
|
-
} }),
|
|
90
|
-
react_1.default.createElement(knowledge_widget_ui_1.Loader, { loading: loading })));
|
|
91
|
-
};
|
|
92
|
-
var StyledGuideList = (0, styled_components_1.default)(knowledge_widget_ui_1.GuideList)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), knowledge_widget_ui_1.contentBox, knowledge_widget_ui_1.loadingOpacity);
|
|
93
|
-
exports.default = DeflectionList;
|
|
94
|
-
var templateObject_1;
|
package/lib/index.d.ts
DELETED
package/lib/index.js
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
var contact_list_component_1 = __importDefault(require("./contact-list-component"));
|
|
7
|
-
exports.default = contact_list_component_1.default;
|
|
@@ -1,108 +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 { fetchAccordionGuideIfMissing, 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
|
-
export var ContactListComponent = function (container) {
|
|
33
|
-
var events = container.get('$widget').events;
|
|
34
|
-
var _a = __read(createEventSubscriber(events), 2), subscribe = _a[0], unsubscribe = _a[1];
|
|
35
|
-
return createReactComponent(container, 'contact-list', import('./contact-list'), function (component) {
|
|
36
|
-
var fetch = function (params) {
|
|
37
|
-
component.writeProperties({ loading: true, contactMethods: [], categories: [] });
|
|
38
|
-
component.actions.dispatch('fetch', { params: params });
|
|
39
|
-
};
|
|
40
|
-
component.actions.create('fetch', function (data) {
|
|
41
|
-
var _a = component.properties().submitButtonLabel, submitButtonLabel = _a === void 0 ? 'Submit' : _a;
|
|
42
|
-
var contactMethods = (data.contactMethods || []).map(function (cm) { return (__assign(__assign({}, cm), { body: updateForm(cm, { submit: submitButtonLabel }) })); });
|
|
43
|
-
return component.actions.dispatch('fetched', __assign(__assign({}, data), { contactMethods: contactMethods, loading: true }));
|
|
44
|
-
});
|
|
45
|
-
component.actions.create('fetched', function (input) {
|
|
46
|
-
return component.writeProperties(__assign(__assign({}, input), { guides: input.guides || [], loading: false }));
|
|
47
|
-
});
|
|
48
|
-
container.getAsync('router').then(function (router) {
|
|
49
|
-
var params = router.getRouteData().params;
|
|
50
|
-
fetch(params);
|
|
51
|
-
});
|
|
52
|
-
subscribe('router:changed', function (event, _a) {
|
|
53
|
-
var current = _a.current;
|
|
54
|
-
fetch(current.routeData.params);
|
|
55
|
-
});
|
|
56
|
-
useForm(container, component);
|
|
57
|
-
useExpand(component);
|
|
58
|
-
})
|
|
59
|
-
.then(function () {
|
|
60
|
-
return extendComponent(container, 'contact-list', function (component) {
|
|
61
|
-
component.actions.watch('contact-list.fetch', function (input, next) {
|
|
62
|
-
var _a = component.properties(), _b = _a.deflection, deflection = _b === void 0 ? {} : _b, _c = _a.deflectionPageSize, deflectionPageSize = _c === void 0 ? 5 : _c, deflectionAccordion = _a.deflectionAccordion;
|
|
63
|
-
var _d = input.params, params = _d === void 0 ? {} : _d;
|
|
64
|
-
var contactCategory = params.contactCategory, guideParam = params.guide, accordionParam = params.accordion;
|
|
65
|
-
return container.getAsync('dataClient').then(function (dataClient) {
|
|
66
|
-
return dataClient
|
|
67
|
-
.fetch(DataType.ContactMethodCategories, {
|
|
68
|
-
contactMethodCategoryId: contactCategory,
|
|
69
|
-
})
|
|
70
|
-
.then(function (_a) {
|
|
71
|
-
var _b;
|
|
72
|
-
var contactMethods = _a.contactMethods, categories = _a.categories;
|
|
73
|
-
var deflectionKeys = Object.keys(deflection);
|
|
74
|
-
var currentCategory = deflectionKeys.length === 1 && !contactCategory
|
|
75
|
-
? deflectionKeys[0]
|
|
76
|
-
: contactCategory;
|
|
77
|
-
if ((_b = deflection[currentCategory]) === null || _b === void 0 ? void 0 : _b.length) {
|
|
78
|
-
return dataClient
|
|
79
|
-
.fetch(DataType.Guides, {
|
|
80
|
-
categories: deflection[currentCategory],
|
|
81
|
-
take: deflectionPageSize,
|
|
82
|
-
})
|
|
83
|
-
.then(function (data) {
|
|
84
|
-
if (deflectionAccordion &&
|
|
85
|
-
guideParam &&
|
|
86
|
-
accordionParam === component.node.name) {
|
|
87
|
-
return fetchAccordionGuideIfMissing(data, dataClient, { guide: guideParam });
|
|
88
|
-
}
|
|
89
|
-
return new Promise(function (resolve) {
|
|
90
|
-
return resolve(data);
|
|
91
|
-
});
|
|
92
|
-
})
|
|
93
|
-
.then(function (_a) {
|
|
94
|
-
var guides = _a.guides;
|
|
95
|
-
return next({ guides: guides, contactMethods: contactMethods, categories: categories });
|
|
96
|
-
});
|
|
97
|
-
}
|
|
98
|
-
return next({ contactMethods: contactMethods, categories: categories });
|
|
99
|
-
});
|
|
100
|
-
});
|
|
101
|
-
});
|
|
102
|
-
});
|
|
103
|
-
})
|
|
104
|
-
.then(function () {
|
|
105
|
-
unsubscribe();
|
|
106
|
-
});
|
|
107
|
-
};
|
|
108
|
-
export default ContactListComponent;
|
package/lib-esm/contact-list.js
DELETED
|
@@ -1,64 +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 { contactItemList, contactLink, ContactList as ContactListUi, } from '@telia-ace/knowledge-widget-adapters';
|
|
28
|
-
import { borderTabStyle, contentBox, createEmptyComponent, ItemList, Link, Loader, loadingOpacity, StyledText, SymbolBadge, useContainer, useDispatch, useProperties, useRouteData, } from '@telia-ace/knowledge-widget-ui';
|
|
29
|
-
import { appendClassNames, createParams, findCategoryById, formatUrl, } from '@telia-ace/widget-utilities';
|
|
30
|
-
import React from 'react';
|
|
31
|
-
import styled from 'styled-components';
|
|
32
|
-
import DeflectionList from './deflection-list';
|
|
33
|
-
var StyledContactList = styled(ContactListUi)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), loadingOpacity, contentBox);
|
|
34
|
-
var StyledItemList = styled(ItemList)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n\n && {\n i {\n font-size: 25px;\n width: 1.28571429em;\n text-align: center;\n }\n }\n"], ["\n ", "\n ", "\n ", "\n\n && {\n i {\n font-size: 25px;\n width: 1.28571429em;\n text-align: center;\n }\n }\n"])), loadingOpacity, contentBox, contactItemList);
|
|
35
|
-
var StyledLink = styled(Link)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &:focus {\n ", ";\n }\n\n ", "\n"], ["\n &:focus {\n ", ";\n }\n\n ", "\n"])), function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && borderTabStyle; }, contactLink);
|
|
36
|
-
var ContactList = function (_a) {
|
|
37
|
-
var className = _a.className, other = __rest(_a, ["className"]);
|
|
38
|
-
var dispatch = useDispatch();
|
|
39
|
-
var container = useContainer();
|
|
40
|
-
var routeData = useRouteData();
|
|
41
|
-
var _b = useProperties(), _c = _b.deflectionHeader, deflectionHeader = _c === void 0 ? '' : _c, _d = _b.routes, routes = _d === void 0 ? {} : _d, _e = _b.contactMethods, contactMethods = _e === void 0 ? [] : _e, _f = _b.categories, categories = _f === void 0 ? [] : _f, _g = _b.guides, guides = _g === void 0 ? [] : _g, _h = _b.deflectionAccordion, deflectionAccordion = _h === void 0 ? false : _h, _j = _b.loading, loading = _j === void 0 ? false : _j;
|
|
42
|
-
var contactCategoryRoute = routes.contactCategory, _k = routes.guide, guideRoute = _k === void 0 ? 'guide' : _k;
|
|
43
|
-
if (!categories.length && !contactMethods.length && !loading) {
|
|
44
|
-
return createEmptyComponent(container, __assign(__assign({}, other), { className: appendClassNames(className, 'humany-contact-category-list') }));
|
|
45
|
-
}
|
|
46
|
-
var name = routeData.name, contactCategory = routeData.params.contactCategory;
|
|
47
|
-
var selectedCategory = findCategoryById(contactCategory, categories);
|
|
48
|
-
return !contactMethods.length ? (React.createElement(StyledItemList, __assign({}, other, { "data-loading": loading, className: appendClassNames(className, 'humany-contact-category-list'), items: (selectedCategory && selectedCategory.items) || categories, renderItem: function (_a) {
|
|
49
|
-
var id = _a.id, title = _a.title, symbol = _a.symbol, matches = _a.matches, items = _a.items;
|
|
50
|
-
return !!matches || (items && !!items.length) ? (React.createElement("li", { key: id, "data-contact-category": id },
|
|
51
|
-
React.createElement(StyledLink, { routeName: contactCategoryRoute || name, params: createParams({
|
|
52
|
-
contactCategory: id,
|
|
53
|
-
uriName: formatUrl(title),
|
|
54
|
-
}) },
|
|
55
|
-
symbol && React.createElement(SymbolBadge, { symbol: symbol }),
|
|
56
|
-
React.createElement(StyledText, null, title)))) : null;
|
|
57
|
-
} }),
|
|
58
|
-
React.createElement(Loader, { loading: loading }))) : (React.createElement(React.Fragment, null,
|
|
59
|
-
React.createElement(DeflectionList, { className: className, guides: guides, categoryTitle: selectedCategory && selectedCategory.title, header: deflectionHeader, route: guideRoute, accordion: deflectionAccordion, loading: loading }),
|
|
60
|
-
React.createElement(StyledContactList, { "data-loading": loading, className: className, contactMethods: contactMethods, dispatch: dispatch },
|
|
61
|
-
React.createElement(Loader, { loading: loading }))));
|
|
62
|
-
};
|
|
63
|
-
export default ContactList;
|
|
64
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,66 +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 { Component } from '@telia-ace/knowledge-widget-types-grid';
|
|
28
|
-
import { AccordionListItem, contentBox, createEmptyComponent, GuideList, Loader, loadingOpacity, useChildren, useComponentDescriptor, useContainer, useDispatch, useRouteData, } from '@telia-ace/knowledge-widget-ui';
|
|
29
|
-
import { appendClassNames, createParams, formatUrl } from '@telia-ace/widget-utilities';
|
|
30
|
-
import React, { useCallback } from 'react';
|
|
31
|
-
import styled from 'styled-components';
|
|
32
|
-
var DeflectionList = function (_a) {
|
|
33
|
-
var className = _a.className, guides = _a.guides, header = _a.header, accordion = _a.accordion, loading = _a.loading, _b = _a.route, route = _b === void 0 ? 'guide' : _b, categoryTitle = _a.categoryTitle, other = __rest(_a, ["className", "guides", "header", "accordion", "loading", "route", "categoryTitle"]);
|
|
34
|
-
var _c = useRouteData(), routeName = _c.name, _d = _c.params, _e = _d.contactCategory, contactCategory = _e === void 0 ? 0 : _e, currentGuideId = _d.guide;
|
|
35
|
-
var componentName = useComponentDescriptor().name;
|
|
36
|
-
var container = useContainer();
|
|
37
|
-
var children = useChildren();
|
|
38
|
-
var dispatch = useDispatch();
|
|
39
|
-
var renderItem = useCallback(function (guide, index, items, defaultRenderer) {
|
|
40
|
-
var id = guide.id, title = guide.title;
|
|
41
|
-
if (accordion && currentGuideId === id) {
|
|
42
|
-
return (React.createElement(AccordionListItem, { key: id, id: id, title: title, route: routeName, collapseUri: categoryTitle && formatUrl(categoryTitle) }, children.map(function (child) { return (React.createElement(Component, __assign({ key: child.id, id: child.id, branch: "default" }, { accordion: accordion }))); })));
|
|
43
|
-
}
|
|
44
|
-
return defaultRenderer ? defaultRenderer(guide, index, items, defaultRenderer) : null;
|
|
45
|
-
}, [accordion, children, currentGuideId]);
|
|
46
|
-
if (!guides.length && !loading) {
|
|
47
|
-
return createEmptyComponent(container, __assign(__assign({}, other), { className: appendClassNames(className, 'humany-deflection-list') }));
|
|
48
|
-
}
|
|
49
|
-
return (React.createElement(StyledGuideList, __assign({}, other, { "data-loading": loading, className: appendClassNames(className, 'humany-deflection-list'), items: guides, header: header, expandable: !!accordion, renderItem: renderItem, dispatch: dispatch, routing: {
|
|
50
|
-
guide: route,
|
|
51
|
-
}, paramMappers: {
|
|
52
|
-
guide: function (_a) {
|
|
53
|
-
var id = _a.id, title = _a.title;
|
|
54
|
-
return createParams({
|
|
55
|
-
contactCategory: contactCategory,
|
|
56
|
-
guide: id,
|
|
57
|
-
accordion: accordion ? componentName : undefined,
|
|
58
|
-
uriName: formatUrl(title),
|
|
59
|
-
});
|
|
60
|
-
},
|
|
61
|
-
} }),
|
|
62
|
-
React.createElement(Loader, { loading: loading })));
|
|
63
|
-
};
|
|
64
|
-
var StyledGuideList = styled(GuideList)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), contentBox, loadingOpacity);
|
|
65
|
-
export default DeflectionList;
|
|
66
|
-
var templateObject_1;
|
package/lib-esm/index.js
DELETED