@telia-ace/knowledge-widget-components-guide-category-dropdown 1.0.6 → 1.0.10

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 (29) hide show
  1. package/{lib-esm → dist}/guide-category-dropdown-component.d.ts +0 -0
  2. package/{lib-esm → dist}/guide-category-dropdown-item.d.ts +0 -0
  3. package/{lib-esm → dist}/guide-category-dropdown-match-count.d.ts +0 -0
  4. package/{lib-esm → dist}/guide-category-dropdown.d.ts +0 -0
  5. package/dist/guide-category-dropdown.js +323 -0
  6. package/dist/guide-category-dropdown.js.map +1 -0
  7. package/{lib-esm → dist}/guide-category-dropdown.styles.d.ts +0 -0
  8. package/{lib-esm → dist}/index.d.ts +0 -0
  9. package/dist/index.js +91 -0
  10. package/dist/index.js.map +1 -0
  11. package/package.json +13 -14
  12. package/lib/guide-category-dropdown-component.d.ts +0 -16
  13. package/lib/guide-category-dropdown-component.js +0 -132
  14. package/lib/guide-category-dropdown-item.d.ts +0 -8
  15. package/lib/guide-category-dropdown-item.js +0 -50
  16. package/lib/guide-category-dropdown-match-count.d.ts +0 -4
  17. package/lib/guide-category-dropdown-match-count.js +0 -20
  18. package/lib/guide-category-dropdown.d.ts +0 -6
  19. package/lib/guide-category-dropdown.js +0 -120
  20. package/lib/guide-category-dropdown.styles.d.ts +0 -10
  21. package/lib/guide-category-dropdown.styles.js +0 -64
  22. package/lib/index.d.ts +0 -2
  23. package/lib/index.js +0 -7
  24. package/lib-esm/guide-category-dropdown-component.js +0 -107
  25. package/lib-esm/guide-category-dropdown-item.js +0 -45
  26. package/lib-esm/guide-category-dropdown-match-count.js +0 -15
  27. package/lib-esm/guide-category-dropdown.js +0 -92
  28. package/lib-esm/guide-category-dropdown.styles.js +0 -39
  29. package/lib-esm/index.js +0 -2
@@ -1,132 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __read = (this && this.__read) || function (o, n) {
26
- var m = typeof Symbol === "function" && o[Symbol.iterator];
27
- if (!m) return o;
28
- var i = m.call(o), r, ar = [], e;
29
- try {
30
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
31
- }
32
- catch (error) { e = { error: error }; }
33
- finally {
34
- try {
35
- if (r && !r.done && (m = i["return"])) m.call(i);
36
- }
37
- finally { if (e) throw e.error; }
38
- }
39
- return ar;
40
- };
41
- Object.defineProperty(exports, "__esModule", { value: true });
42
- var knowledge_widget_core_1 = require("@telia-ace/knowledge-widget-core");
43
- var knowledge_widget_types_grid_1 = require("@telia-ace/knowledge-widget-types-grid");
44
- var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
45
- var findParentAndSiblings = function (categories, root, currentCategoryId) {
46
- if (!currentCategoryId || currentCategoryId.length < 1) {
47
- return root;
48
- }
49
- return findRecursive(categories, root, null, currentCategoryId);
50
- };
51
- var findRecursive = function (categories, root, previous, currentCategoryId) {
52
- var filtered = categories.find(function (c) { return c.id === currentCategoryId; });
53
- if (filtered || !currentCategoryId) {
54
- if (!previous) {
55
- return root;
56
- }
57
- return previous;
58
- }
59
- for (var i = 0; i < categories.length; i += 1) {
60
- var cat = categories[i];
61
- if (cat.items) {
62
- var result = findRecursive(cat.items, root, cat, currentCategoryId);
63
- if (result) {
64
- return result;
65
- }
66
- }
67
- }
68
- };
69
- var filterEmptyCategories = function (category) { return category.matches && category.matches > 0; };
70
- exports.default = (function (container) {
71
- var events = container.get('$widget').events;
72
- var _a = __read((0, knowledge_widget_core_1.createEventSubscriber)(events), 2), subscribe = _a[0], unsubscribe = _a[1];
73
- return (0, knowledge_widget_ui_1.createReactComponent)(container, 'guide-category-dropdown', Promise.resolve().then(function () { return __importStar(require('./guide-category-dropdown')); }), function (component) {
74
- var fetch = function (params) {
75
- component.writeProperties({ loading: true });
76
- component.actions.dispatch('fetch', { params: params }).then(function () {
77
- component.writeProperties({ loading: false });
78
- });
79
- };
80
- component.actions.create('fetch', function (_a) {
81
- var parent = _a.parent, categories = _a.categories;
82
- component.writeProperties({
83
- parent: parent,
84
- categories: categories,
85
- loading: false,
86
- });
87
- });
88
- container.getAsync('router').then(function (router) {
89
- var params = router.getRouteData().params;
90
- fetch(params);
91
- });
92
- subscribe('router:changed', function (event, _a) {
93
- var current = _a.current;
94
- fetch(current.routeData.params);
95
- });
96
- })
97
- .then(function () {
98
- return (0, knowledge_widget_core_1.extendComponent)(container, 'guide-category-dropdown', function (component) {
99
- component.actions.watch('guide-category-dropdown.fetch', function (input, next) {
100
- var _a = component.properties(), _b = _a.matchFilters, matchFilters = _b === void 0 ? {
101
- search: false,
102
- tag: false,
103
- } : _b, rootCategoryHeader = _a.rootCategoryHeader;
104
- var _c = input.params, phrase = _c.phrase, guideCategory = _c.guideCategory, tag = _c.tag;
105
- return container.getAsync('dataClient').then(function (dataClient) {
106
- return dataClient
107
- .fetch(knowledge_widget_types_grid_1.DataType.GuideCategories, {
108
- searchPhrase: matchFilters.search ? phrase : undefined,
109
- tagId: matchFilters.tag ? tag : undefined,
110
- })
111
- .then(function (_a) {
112
- var _b;
113
- var categories = _a.categories, matches = _a.matches;
114
- var parent = findParentAndSiblings(categories, {
115
- matches: matches,
116
- id: '0',
117
- title: rootCategoryHeader,
118
- items: categories,
119
- }, guideCategory);
120
- return next({
121
- parent: parent,
122
- categories: (_b = parent === null || parent === void 0 ? void 0 : parent.items) === null || _b === void 0 ? void 0 : _b.filter(filterEmptyCategories),
123
- });
124
- });
125
- });
126
- });
127
- });
128
- })
129
- .then(function () {
130
- unsubscribe();
131
- });
132
- });
@@ -1,8 +0,0 @@
1
- import { Category } from '@telia-ace/knowledge-widget-core';
2
- import React from 'react';
3
- declare type Props = {
4
- item: Category;
5
- guideCategory: string;
6
- };
7
- declare const GuideCategoryDropdownItem: React.FC<Props>;
8
- export default GuideCategoryDropdownItem;
@@ -1,50 +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 __read = (this && this.__read) || function (o, n) {
14
- var m = typeof Symbol === "function" && o[Symbol.iterator];
15
- if (!m) return o;
16
- var i = m.call(o), r, ar = [], e;
17
- try {
18
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
19
- }
20
- catch (error) { e = { error: error }; }
21
- finally {
22
- try {
23
- if (r && !r.done && (m = i["return"])) m.call(i);
24
- }
25
- finally { if (e) throw e.error; }
26
- }
27
- return ar;
28
- };
29
- var __importDefault = (this && this.__importDefault) || function (mod) {
30
- return (mod && mod.__esModule) ? mod : { "default": mod };
31
- };
32
- Object.defineProperty(exports, "__esModule", { value: true });
33
- var knowledge_widget_component_utilities_1 = require("@telia-ace/knowledge-widget-component-utilities");
34
- var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
35
- var react_1 = __importDefault(require("react"));
36
- var guide_category_dropdown_match_count_1 = __importDefault(require("./guide-category-dropdown-match-count"));
37
- var guide_category_dropdown_styles_1 = __importDefault(require("./guide-category-dropdown.styles"));
38
- var GuideCategoryDropdownItem = function (_a) {
39
- var item = _a.item, guideCategory = _a.guideCategory;
40
- var _b = (0, knowledge_widget_ui_1.useProperties)(), _c = _b.route, route = _c === void 0 ? 'browse' : _c, _d = _b.categoryAriaLabel, categoryAriaLabel = _d === void 0 ? '' : _d, _e = _b.activeCategoryAriaLabel, activeCategoryAriaLabel = _e === void 0 ? '' : _e, _f = _b.fallbackOnInitialRoute, fallbackOnInitialRoute = _f === void 0 ? false : _f;
41
- var _g = __read((0, knowledge_widget_ui_1.useHover)(), 2), hovering = _g[0], elem = _g[1];
42
- var id = item.id, title = item.title, symbol = item.symbol, activeSymbol = item.activeSymbol;
43
- var selected = guideCategory === id;
44
- return (react_1.default.createElement("li", { ref: elem },
45
- react_1.default.createElement(guide_category_dropdown_styles_1.default.Link, __assign({}, (0, knowledge_widget_component_utilities_1.initialRouteFallback)(item, route, fallbackOnInitialRoute, 'category'), { "aria-pressed": selected, "aria-label": (selected ? activeCategoryAriaLabel : categoryAriaLabel).replace('{{category}}', title), className: "humany-guide-category-dropdown-link", "aria-current": selected, selected: selected }),
46
- (selected || hovering) && activeSymbol ? (react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: activeSymbol })) : (symbol && react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: symbol })),
47
- react_1.default.createElement(knowledge_widget_ui_1.Text, null, title),
48
- react_1.default.createElement(guide_category_dropdown_match_count_1.default, __assign({}, item)))));
49
- };
50
- exports.default = GuideCategoryDropdownItem;
@@ -1,4 +0,0 @@
1
- import { Category } from '@telia-ace/knowledge-widget-core';
2
- import React from 'react';
3
- declare const GuideCategoryDropdownMatchCount: React.FC<Category>;
4
- export default GuideCategoryDropdownMatchCount;
@@ -1,20 +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 knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
7
- var react_1 = __importDefault(require("react"));
8
- var guide_category_dropdown_styles_1 = __importDefault(require("./guide-category-dropdown.styles"));
9
- var GuideCategoryDropdownMatchCount = function (_a) {
10
- var matches = _a.matches;
11
- var _b = (0, knowledge_widget_ui_1.useProperties)().showMatchCount, showMatchCount = _b === void 0 ? false : _b;
12
- if (!showMatchCount || typeof matches === 'undefined') {
13
- return null;
14
- }
15
- return react_1.default.createElement(guide_category_dropdown_styles_1.default.MatchCount, null,
16
- "(",
17
- matches,
18
- ")");
19
- };
20
- exports.default = GuideCategoryDropdownMatchCount;
@@ -1,6 +0,0 @@
1
- import React from 'react';
2
- declare type Props = {
3
- className: string;
4
- };
5
- declare const GuideCategoryDropdown: React.SFC<Props>;
6
- export default GuideCategoryDropdown;
@@ -1,120 +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 __rest = (this && this.__rest) || function (s, e) {
37
- var t = {};
38
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
39
- t[p] = s[p];
40
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
41
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
42
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
43
- t[p[i]] = s[p[i]];
44
- }
45
- return t;
46
- };
47
- var __read = (this && this.__read) || function (o, n) {
48
- var m = typeof Symbol === "function" && o[Symbol.iterator];
49
- if (!m) return o;
50
- var i = m.call(o), r, ar = [], e;
51
- try {
52
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
53
- }
54
- catch (error) { e = { error: error }; }
55
- finally {
56
- try {
57
- if (r && !r.done && (m = i["return"])) m.call(i);
58
- }
59
- finally { if (e) throw e.error; }
60
- }
61
- return ar;
62
- };
63
- var __importDefault = (this && this.__importDefault) || function (mod) {
64
- return (mod && mod.__esModule) ? mod : { "default": mod };
65
- };
66
- Object.defineProperty(exports, "__esModule", { value: true });
67
- var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
68
- var widget_utilities_1 = require("@telia-ace/widget-utilities");
69
- var react_1 = __importStar(require("react"));
70
- var guide_category_dropdown_item_1 = __importDefault(require("./guide-category-dropdown-item"));
71
- var guide_category_dropdown_match_count_1 = __importDefault(require("./guide-category-dropdown-match-count"));
72
- var guide_category_dropdown_styles_1 = __importDefault(require("./guide-category-dropdown.styles"));
73
- var GuideCategoryDropdown = function (_a) {
74
- var className = _a.className, other = __rest(_a, ["className"]);
75
- var routeData = (0, knowledge_widget_ui_1.useRouteData)();
76
- var _b = __read((0, react_1.useState)(false), 2), togglerFocus = _b[0], setTogglerFocus = _b[1];
77
- var _c = (0, knowledge_widget_ui_1.useProperties)(), parent = _c.parent, _d = _c.route, route = _d === void 0 ? 'browse' : _d, _e = _c.categories, categories = _e === void 0 ? [] : _e, _f = _c.loading, loading = _f === void 0 ? false : _f;
78
- var container = (0, knowledge_widget_ui_1.useContainer)();
79
- var _g = __read((0, react_1.useState)(false), 2), isOpen = _g[0], setIsOpen = _g[1];
80
- var params = routeData.params;
81
- var guideCategory = params.guideCategory, tag = params.tag, phrase = params.phrase, sorting = params.sorting;
82
- (0, react_1.useEffect)(function () {
83
- if (isOpen) {
84
- setIsOpen(false);
85
- }
86
- }, [guideCategory]);
87
- if (loading || !parent || !categories.length) {
88
- return (0, knowledge_widget_ui_1.createEmptyComponent)(container, __assign(__assign({}, other), { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-guide-category-dropdown') }));
89
- }
90
- var selected = categories.find(function (category) { return category.id === guideCategory; }) || parent;
91
- var selectedSymbol = selected.activeSymbol || selected.symbol;
92
- return (react_1.default.createElement(guide_category_dropdown_styles_1.default.Wrapper, __assign({}, other, { "data-loading": false, "data-toggler-in-focus": togglerFocus, "aria-expanded": isOpen, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-guide-category-dropdown') }), isOpen ? (react_1.default.createElement(react_1.default.Fragment, null,
93
- react_1.default.createElement(guide_category_dropdown_styles_1.default.TopItem, { className: "humany-guide-category-dropdown-top-item" },
94
- react_1.default.createElement(guide_category_dropdown_styles_1.default.Link, { className: "humany-guide-category-dropdown-link", routeName: route, params: (0, widget_utilities_1.createParams)({
95
- tag: tag,
96
- phrase: phrase,
97
- sorting: sorting,
98
- guideCategory: parent.id,
99
- uriName: (0, widget_utilities_1.formatUrl)(parent.title),
100
- }), selected: false },
101
- parent.symbol ? react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: parent.symbol }) : null,
102
- react_1.default.createElement(knowledge_widget_ui_1.Text, null, parent.title),
103
- react_1.default.createElement(guide_category_dropdown_match_count_1.default, __assign({}, parent))),
104
- react_1.default.createElement(guide_category_dropdown_styles_1.default.Toggler, { onBlur: function () { return setTogglerFocus(false); }, onFocus: function () { return setTogglerFocus(true); }, className: "humany-guide-category-dropdown-toggler", onClick: function () {
105
- setIsOpen(!isOpen);
106
- }, "aria-expanded": "true", "aria-label": selected.title },
107
- react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { size: 18, symbol: { type: 'Svg', content: 'caret-up' } }))),
108
- react_1.default.createElement(guide_category_dropdown_styles_1.default.List, { className: "humany-guide-category-dropdown-open", items: categories, renderItem: function (item) { return (react_1.default.createElement(guide_category_dropdown_item_1.default, { key: item.id, item: item, guideCategory: guideCategory })); } }))) : (react_1.default.createElement(guide_category_dropdown_styles_1.default.TopItem, { className: "humany-guide-category-dropdown-top-item" },
109
- react_1.default.createElement(guide_category_dropdown_styles_1.default.Item, { className: "humany-guide-category-dropdown-item", onClick: function () {
110
- setIsOpen(!isOpen);
111
- }, selected: false },
112
- selectedSymbol ? react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { symbol: selectedSymbol }) : null,
113
- react_1.default.createElement(knowledge_widget_ui_1.Text, null, selected.title),
114
- react_1.default.createElement(guide_category_dropdown_match_count_1.default, __assign({}, selected))),
115
- react_1.default.createElement(guide_category_dropdown_styles_1.default.Toggler, { onBlur: function () { return setTogglerFocus(false); }, onFocus: function () { return setTogglerFocus(true); }, className: "humany-guide-category-dropdown-toggler", onClick: function () {
116
- setIsOpen(!isOpen);
117
- }, "aria-expanded": "false", "aria-label": selected.title },
118
- react_1.default.createElement(knowledge_widget_ui_1.SymbolBadge, { size: 18, symbol: { type: 'Svg', content: 'caret-down' } }))))));
119
- };
120
- exports.default = GuideCategoryDropdown;
@@ -1,10 +0,0 @@
1
- declare const _default: {
2
- Wrapper: any;
3
- Toggler: any;
4
- List: any;
5
- Item: any;
6
- Link: any;
7
- TopItem: any;
8
- MatchCount: any;
9
- };
10
- export default _default;
@@ -1,64 +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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
- Object.defineProperty(exports, "__esModule", { value: true });
30
- var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
31
- var styled_components_1 = __importStar(require("styled-components"));
32
- // FUTURE TODO: Look into the typescript error when removing ": any".
33
- var Wrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n ", "\n overflow: hidden;\n min-height: 50px;\n ", ";\n"], ["\n ", "\n ", "\n overflow: hidden;\n min-height: 50px;\n ", ";\n"])), knowledge_widget_ui_1.loadingOpacity, knowledge_widget_ui_1.contentBox, function (p) {
34
- var _a;
35
- return p['data-toggler-in-focus'] &&
36
- ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n && {\n ", "\n }\n "], ["\n && {\n ", "\n }\n "])), knowledge_widget_ui_1.borderTabStyle);
37
- });
38
- // FUTURE TODO: Look into the typescript error when removing ": any".
39
- var Toggler = styled_components_1.default.button(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background: none;\n border: 0;\n outline: 0;\n display: block;\n cursor: pointer;\n padding: 0;\n font-size: ", ";\n text-align: end;\n flex: 1 0 auto;\n svg {\n path,\n line {\n stroke: ", ";\n }\n }\n"], ["\n background: none;\n border: 0;\n outline: 0;\n display: block;\n cursor: pointer;\n padding: 0;\n font-size: ", ";\n text-align: end;\n flex: 1 0 auto;\n svg {\n path,\n line {\n stroke: ", ";\n }\n }\n"])), 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; });
40
- // FUTURE TODO: Look into the typescript error when removing ": any".
41
- var styling = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n font-size: ", ";\n text-align: left;\n text-align: left;\n text-decoration: none;\n font-weight: 300;\n display: flex;\n align-items: center;\n padding: ", ";\n padding-left: ", ";\n cursor: pointer;\n overflow: hidden;\n ", ";\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n i {\n margin-right: ", ";\n font-size: ", ";\n min-height: 1em;\n min-width: 1em;\n }\n"], ["\n font-size: ", ";\n text-align: left;\n text-align: left;\n text-decoration: none;\n font-weight: 300;\n display: flex;\n align-items: center;\n padding: ", ";\n padding-left: ", ";\n cursor: pointer;\n overflow: hidden;\n ", ";\n\n span {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n i {\n margin-right: ", ";\n font-size: ", ";\n min-height: 1em;\n min-width: 1em;\n }\n"])), 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.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) {
42
- var _a, _b, _c;
43
- return p.selected
44
- ? (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-left: 2px solid ", ";\n color: ", ";\n "], ["\n border-left: 2px solid ", ";\n color: ", ";\n "])), (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary, (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.primary) : (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), (_c = p.theme.colors) === null || _c === void 0 ? void 0 : _c.text);
45
- }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.medium; });
46
- // FUTURE TODO: Look into the typescript error when removing ": any".
47
- var Item = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), styling);
48
- var Link = (0, styled_components_1.default)(knowledge_widget_ui_1.Link)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", "\n &:focus {\n outline: none;\n span {\n ", ";\n }\n }\n"], ["\n ", "\n &:focus {\n outline: none;\n span {\n ", ";\n }\n }\n"])), styling, function (p) { var _a; return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && knowledge_widget_ui_1.linkTabStyle; });
49
- // FUTURE TODO: Look into the typescript error when removing ": any".
50
- var TopItem = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n padding-right: ", ";\n min-height: 52px;\n white-space: nowrap;\n\n && {\n font-weight: normal;\n\n a {\n font-weight: normal;\n }\n }\n ", " {\n font-weight: normal;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n padding-right: ", ";\n min-height: 52px;\n white-space: nowrap;\n\n && {\n font-weight: normal;\n\n a {\n font-weight: normal;\n }\n }\n ", " {\n font-weight: normal;\n }\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, Item);
51
- // FUTURE TODO: Look into the typescript error when removing ": any".
52
- var List = (0, styled_components_1.default)(knowledge_widget_ui_1.List)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: 22px;\n border-left: ", ";\n li {\n margin: 0 0 ", " -2px;\n }\n li:last-child {\n margin: 0 0 0 -2px;\n }\n flex-basis: 100%;\n border-width: 2px;\n"], ["\n ", "\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: 22px;\n border-left: ", ";\n li {\n margin: 0 0 ", " -2px;\n }\n li:last-child {\n margin: 0 0 0 -2px;\n }\n flex-basis: 100%;\n border-width: 2px;\n"])), knowledge_widget_ui_1.list, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.medium; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large; }, function (p) { return p.theme.border; }, function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.normal; });
53
- // FUTURE TODO: Look into the typescript error when removing ": any".
54
- var MatchCount = (0, styled_components_1.default)(knowledge_widget_ui_1.Text)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n margin: 0 0 0 ", ";\n"], ["\n margin: 0 0 0 ", ";\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; });
55
- exports.default = {
56
- Wrapper: Wrapper,
57
- Toggler: Toggler,
58
- List: List,
59
- Item: Item,
60
- Link: Link,
61
- TopItem: TopItem,
62
- MatchCount: MatchCount,
63
- };
64
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;
package/lib/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- import GuideCategoryDropdownComponent from './guide-category-dropdown-component';
2
- export default GuideCategoryDropdownComponent;
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 guide_category_dropdown_component_1 = __importDefault(require("./guide-category-dropdown-component"));
7
- exports.default = guide_category_dropdown_component_1.default;
@@ -1,107 +0,0 @@
1
- var __read = (this && this.__read) || function (o, n) {
2
- var m = typeof Symbol === "function" && o[Symbol.iterator];
3
- if (!m) return o;
4
- var i = m.call(o), r, ar = [], e;
5
- try {
6
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
7
- }
8
- catch (error) { e = { error: error }; }
9
- finally {
10
- try {
11
- if (r && !r.done && (m = i["return"])) m.call(i);
12
- }
13
- finally { if (e) throw e.error; }
14
- }
15
- return ar;
16
- };
17
- import { createEventSubscriber, extendComponent } from '@telia-ace/knowledge-widget-core';
18
- import { DataType } from '@telia-ace/knowledge-widget-types-grid';
19
- import { createReactComponent } from '@telia-ace/knowledge-widget-ui';
20
- var findParentAndSiblings = function (categories, root, currentCategoryId) {
21
- if (!currentCategoryId || currentCategoryId.length < 1) {
22
- return root;
23
- }
24
- return findRecursive(categories, root, null, currentCategoryId);
25
- };
26
- var findRecursive = function (categories, root, previous, currentCategoryId) {
27
- var filtered = categories.find(function (c) { return c.id === currentCategoryId; });
28
- if (filtered || !currentCategoryId) {
29
- if (!previous) {
30
- return root;
31
- }
32
- return previous;
33
- }
34
- for (var i = 0; i < categories.length; i += 1) {
35
- var cat = categories[i];
36
- if (cat.items) {
37
- var result = findRecursive(cat.items, root, cat, currentCategoryId);
38
- if (result) {
39
- return result;
40
- }
41
- }
42
- }
43
- };
44
- var filterEmptyCategories = function (category) { return category.matches && category.matches > 0; };
45
- export default (function (container) {
46
- var events = container.get('$widget').events;
47
- var _a = __read(createEventSubscriber(events), 2), subscribe = _a[0], unsubscribe = _a[1];
48
- return createReactComponent(container, 'guide-category-dropdown', import('./guide-category-dropdown'), function (component) {
49
- var fetch = function (params) {
50
- component.writeProperties({ loading: true });
51
- component.actions.dispatch('fetch', { params: params }).then(function () {
52
- component.writeProperties({ loading: false });
53
- });
54
- };
55
- component.actions.create('fetch', function (_a) {
56
- var parent = _a.parent, categories = _a.categories;
57
- component.writeProperties({
58
- parent: parent,
59
- categories: categories,
60
- loading: false,
61
- });
62
- });
63
- container.getAsync('router').then(function (router) {
64
- var params = router.getRouteData().params;
65
- fetch(params);
66
- });
67
- subscribe('router:changed', function (event, _a) {
68
- var current = _a.current;
69
- fetch(current.routeData.params);
70
- });
71
- })
72
- .then(function () {
73
- return extendComponent(container, 'guide-category-dropdown', function (component) {
74
- component.actions.watch('guide-category-dropdown.fetch', function (input, next) {
75
- var _a = component.properties(), _b = _a.matchFilters, matchFilters = _b === void 0 ? {
76
- search: false,
77
- tag: false,
78
- } : _b, rootCategoryHeader = _a.rootCategoryHeader;
79
- var _c = input.params, phrase = _c.phrase, guideCategory = _c.guideCategory, tag = _c.tag;
80
- return container.getAsync('dataClient').then(function (dataClient) {
81
- return dataClient
82
- .fetch(DataType.GuideCategories, {
83
- searchPhrase: matchFilters.search ? phrase : undefined,
84
- tagId: matchFilters.tag ? tag : undefined,
85
- })
86
- .then(function (_a) {
87
- var _b;
88
- var categories = _a.categories, matches = _a.matches;
89
- var parent = findParentAndSiblings(categories, {
90
- matches: matches,
91
- id: '0',
92
- title: rootCategoryHeader,
93
- items: categories,
94
- }, guideCategory);
95
- return next({
96
- parent: parent,
97
- categories: (_b = parent === null || parent === void 0 ? void 0 : parent.items) === null || _b === void 0 ? void 0 : _b.filter(filterEmptyCategories),
98
- });
99
- });
100
- });
101
- });
102
- });
103
- })
104
- .then(function () {
105
- unsubscribe();
106
- });
107
- });
@@ -1,45 +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 { initialRouteFallback } from '@telia-ace/knowledge-widget-component-utilities';
29
- import { SymbolBadge, Text, useHover, useProperties } from '@telia-ace/knowledge-widget-ui';
30
- import React from 'react';
31
- import GuideCategoryDropdownMatchCount from './guide-category-dropdown-match-count';
32
- import Styled from './guide-category-dropdown.styles';
33
- var GuideCategoryDropdownItem = function (_a) {
34
- var item = _a.item, guideCategory = _a.guideCategory;
35
- var _b = useProperties(), _c = _b.route, route = _c === void 0 ? 'browse' : _c, _d = _b.categoryAriaLabel, categoryAriaLabel = _d === void 0 ? '' : _d, _e = _b.activeCategoryAriaLabel, activeCategoryAriaLabel = _e === void 0 ? '' : _e, _f = _b.fallbackOnInitialRoute, fallbackOnInitialRoute = _f === void 0 ? false : _f;
36
- var _g = __read(useHover(), 2), hovering = _g[0], elem = _g[1];
37
- var id = item.id, title = item.title, symbol = item.symbol, activeSymbol = item.activeSymbol;
38
- var selected = guideCategory === id;
39
- return (React.createElement("li", { ref: elem },
40
- React.createElement(Styled.Link, __assign({}, initialRouteFallback(item, route, fallbackOnInitialRoute, 'category'), { "aria-pressed": selected, "aria-label": (selected ? activeCategoryAriaLabel : categoryAriaLabel).replace('{{category}}', title), className: "humany-guide-category-dropdown-link", "aria-current": selected, selected: selected }),
41
- (selected || hovering) && activeSymbol ? (React.createElement(SymbolBadge, { symbol: activeSymbol })) : (symbol && React.createElement(SymbolBadge, { symbol: symbol })),
42
- React.createElement(Text, null, title),
43
- React.createElement(GuideCategoryDropdownMatchCount, __assign({}, item)))));
44
- };
45
- export default GuideCategoryDropdownItem;
@@ -1,15 +0,0 @@
1
- import { useProperties } from '@telia-ace/knowledge-widget-ui';
2
- import React from 'react';
3
- import Styled from './guide-category-dropdown.styles';
4
- var GuideCategoryDropdownMatchCount = function (_a) {
5
- var matches = _a.matches;
6
- var _b = useProperties().showMatchCount, showMatchCount = _b === void 0 ? false : _b;
7
- if (!showMatchCount || typeof matches === 'undefined') {
8
- return null;
9
- }
10
- return React.createElement(Styled.MatchCount, null,
11
- "(",
12
- matches,
13
- ")");
14
- };
15
- export default GuideCategoryDropdownMatchCount;