@telia-ace/widget-types-grid 1.0.8 → 1.0.9
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}/component-platform-factory.d.ts +0 -0
- package/{lib → dist}/index.d.ts +2 -1
- package/dist/index.js +1416 -0
- package/dist/index.js.map +1 -0
- package/dist/render.js +95 -0
- package/dist/render.js.map +1 -0
- package/{lib-esm → dist}/services.d.ts +0 -0
- package/{lib-esm → dist}/site-provider.d.ts +0 -0
- package/{lib-esm → dist}/ui/animated-view.d.ts +0 -0
- package/{lib-esm → dist}/ui/component.d.ts +0 -5
- package/{lib-esm → dist}/ui/detached-component.d.ts +0 -0
- package/{lib-esm → dist}/ui/determine-slide-direction.d.ts +0 -0
- package/{lib-esm → dist}/ui/html-element-handlers.d.ts +0 -0
- package/{lib-esm → dist}/ui/index.d.ts +0 -0
- package/{lib-esm → dist}/ui/not-found.d.ts +0 -0
- package/{lib-esm → dist}/ui/prepare-dom.d.ts +0 -0
- package/{lib-esm → dist}/ui/render.d.ts +0 -0
- package/{lib-esm → dist}/ui/resolvable-component.d.ts +0 -0
- package/dist/ui/styles.d.ts +17 -0
- package/{lib-esm → dist}/ui/switch.d.ts +0 -0
- package/{lib-esm → dist}/ui/unmount.d.ts +0 -0
- package/{lib-esm → dist}/ui/use-component-node-properties.d.ts +0 -0
- package/{lib-esm → dist}/ui/use-router.d.ts +0 -0
- package/{lib-esm → dist}/ui/view-outlet.d.ts +0 -0
- package/{lib-esm → dist}/ui/view.d.ts +0 -0
- package/{lib-esm → dist}/ui/wrapper.d.ts +0 -0
- package/dist/unmount.js +4 -0
- package/dist/unmount.js.map +1 -0
- package/{lib-esm → dist}/widget.d.ts +0 -0
- package/package.json +16 -15
- package/lib/component-platform-factory.d.ts +0 -13
- package/lib/component-platform-factory.js +0 -105
- package/lib/index.js +0 -16
- package/lib/services.d.ts +0 -7
- package/lib/services.js +0 -99
- package/lib/site-provider.d.ts +0 -5
- package/lib/site-provider.js +0 -18
- package/lib/ui/animated-view.d.ts +0 -6
- package/lib/ui/animated-view.js +0 -142
- package/lib/ui/component.d.ts +0 -21
- package/lib/ui/component.js +0 -180
- package/lib/ui/detached-component.d.ts +0 -7
- package/lib/ui/detached-component.js +0 -73
- package/lib/ui/determine-slide-direction.d.ts +0 -26
- package/lib/ui/determine-slide-direction.js +0 -51
- package/lib/ui/html-element-handlers.d.ts +0 -18
- package/lib/ui/html-element-handlers.js +0 -128
- package/lib/ui/index.d.ts +0 -6
- package/lib/ui/index.js +0 -19
- package/lib/ui/not-found.d.ts +0 -6
- package/lib/ui/not-found.js +0 -83
- package/lib/ui/prepare-dom.d.ts +0 -20
- package/lib/ui/prepare-dom.js +0 -122
- package/lib/ui/render.d.ts +0 -3
- package/lib/ui/render.js +0 -11
- package/lib/ui/resolvable-component.d.ts +0 -7
- package/lib/ui/resolvable-component.js +0 -87
- package/lib/ui/switch.d.ts +0 -11
- package/lib/ui/switch.js +0 -58
- package/lib/ui/unmount.d.ts +0 -2
- package/lib/ui/unmount.js +0 -4
- package/lib/ui/use-component-node-properties.d.ts +0 -3
- package/lib/ui/use-component-node-properties.js +0 -44
- package/lib/ui/use-router.d.ts +0 -4
- package/lib/ui/use-router.js +0 -32
- package/lib/ui/view-outlet.d.ts +0 -32
- package/lib/ui/view-outlet.js +0 -151
- package/lib/ui/view.d.ts +0 -6
- package/lib/ui/view.js +0 -75
- package/lib/ui/wrapper.d.ts +0 -7
- package/lib/ui/wrapper.js +0 -108
- package/lib/widget.d.ts +0 -54
- package/lib/widget.js +0 -554
- package/lib-esm/component-platform-factory.js +0 -101
- package/lib-esm/index.d.ts +0 -4
- package/lib-esm/index.js +0 -4
- package/lib-esm/services.js +0 -67
- package/lib-esm/site-provider.js +0 -14
- package/lib-esm/ui/animated-view.js +0 -114
- package/lib-esm/ui/component.js +0 -151
- package/lib-esm/ui/detached-component.js +0 -45
- package/lib-esm/ui/determine-slide-direction.js +0 -46
- package/lib-esm/ui/html-element-handlers.js +0 -120
- package/lib-esm/ui/index.js +0 -6
- package/lib-esm/ui/not-found.js +0 -58
- package/lib-esm/ui/prepare-dom.js +0 -116
- package/lib-esm/ui/render.js +0 -6
- package/lib-esm/ui/resolvable-component.js +0 -62
- package/lib-esm/ui/switch.js +0 -53
- package/lib-esm/ui/unmount.js +0 -2
- package/lib-esm/ui/use-component-node-properties.js +0 -42
- package/lib-esm/ui/use-router.js +0 -30
- package/lib-esm/ui/view-outlet.js +0 -126
- package/lib-esm/ui/view.js +0 -70
- package/lib-esm/ui/wrapper.js +0 -80
- package/lib-esm/widget.js +0 -551
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
// tslint:disable max-line-length
|
|
2
|
-
export var renderSymbol = function (symbol) {
|
|
3
|
-
if (symbol) {
|
|
4
|
-
var type = symbol.type, content = symbol.content;
|
|
5
|
-
switch (type) {
|
|
6
|
-
case 'FontAwesome':
|
|
7
|
-
return "<i class=\"humany-icon fa fa-".concat(content, "\"></i>");
|
|
8
|
-
case 'Uri':
|
|
9
|
-
return "<i class=\"humany-icon humany-custom-icon\" style=\"background: url(".concat(content, ") no-repeat center center;background-size: contain;\"></i>");
|
|
10
|
-
default:
|
|
11
|
-
return '';
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
};
|
|
15
|
-
var triggerTabHandler = function (triggerDOMElement) {
|
|
16
|
-
var toggleTabbing = function (element, tabbing) {
|
|
17
|
-
if (!element) {
|
|
18
|
-
return;
|
|
19
|
-
}
|
|
20
|
-
if (tabbing) {
|
|
21
|
-
element.classList.add('humany-tabbing');
|
|
22
|
-
}
|
|
23
|
-
else {
|
|
24
|
-
element.classList.remove('humany-tabbing');
|
|
25
|
-
}
|
|
26
|
-
};
|
|
27
|
-
var handleKeydown = function (e) {
|
|
28
|
-
if (e.key === 'Tab') {
|
|
29
|
-
toggleTabbing(triggerDOMElement, true);
|
|
30
|
-
}
|
|
31
|
-
else if (!(e.key === 'Enter' &&
|
|
32
|
-
document.activeElement &&
|
|
33
|
-
document.activeElement.classList.contains('humany-trigger'))) {
|
|
34
|
-
toggleTabbing(triggerDOMElement, false);
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
var handleClick = function (e) {
|
|
38
|
-
if (document.activeElement &&
|
|
39
|
-
document.activeElement.classList.contains('humany-trigger') &&
|
|
40
|
-
document.activeElement.classList.contains('humany-tabbing')) {
|
|
41
|
-
return;
|
|
42
|
-
}
|
|
43
|
-
toggleTabbing(triggerDOMElement, false);
|
|
44
|
-
};
|
|
45
|
-
document.addEventListener('keydown', handleKeydown);
|
|
46
|
-
document.addEventListener('click', handleClick);
|
|
47
|
-
return function () {
|
|
48
|
-
document.removeEventListener('keydown', handleKeydown);
|
|
49
|
-
document.removeEventListener('click', handleClick);
|
|
50
|
-
};
|
|
51
|
-
};
|
|
52
|
-
export function createTriggerElement(element, options) {
|
|
53
|
-
var symbol = options.symbol, widgetName = options.widgetName, _a = options.label, label = _a === void 0 ? '' : _a, _b = options.ariaLabel, ariaLabel = _b === void 0 ? '' : _b, _c = options.tooltip, tooltip = _c === void 0 ? '' : _c;
|
|
54
|
-
element.classList.add('humany-trigger');
|
|
55
|
-
element.classList.add("humany_".concat(widgetName));
|
|
56
|
-
if (label.length) {
|
|
57
|
-
element.classList.add('humany-has-text');
|
|
58
|
-
}
|
|
59
|
-
if (ariaLabel.length && !element.getAttribute('aria-label')) {
|
|
60
|
-
element.setAttribute('aria-label', ariaLabel);
|
|
61
|
-
}
|
|
62
|
-
if (ariaLabel.length && !element.getAttribute('tabindex')) {
|
|
63
|
-
element.setAttribute('tabindex', '0');
|
|
64
|
-
}
|
|
65
|
-
if (tooltip.length && !element.getAttribute('title')) {
|
|
66
|
-
element.setAttribute('title', tooltip);
|
|
67
|
-
}
|
|
68
|
-
var symbolHtml = renderSymbol(symbol) || '';
|
|
69
|
-
element.innerHTML = "".concat(symbolHtml, "\n <span class=\"humany-close\">\n <svg width=\"18\" height=\"9\" viewBox=\"0 0 18 9\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 9C8.81794 9.00045 8.63759 8.96634 8.46939 8.89965C8.3012 8.83295 8.14851 8.735 8.02015 8.61145L0.194523 1.12367C0.068294 0.99862 -0.00155266 0.831133 2.61958e-05 0.657285C0.00160506 0.483436 0.0744832 0.317136 0.202964 0.194202C0.331445 0.0712675 0.505249 0.00153576 0.686941 2.50649e-05C0.868634 -0.00148563 1.04368 0.0653456 1.17437 0.186125L9 7.6739L16.8256 0.186125C16.9563 0.0653456 17.1314 -0.00148563 17.3131 2.50649e-05C17.4948 0.00153576 17.6686 0.0712675 17.797 0.194202C17.9255 0.317136 17.9984 0.483436 18 0.657285C18.0016 0.831133 17.9317 0.99862 17.8055 1.12367L9.97985 8.61145C9.85149 8.735 9.6988 8.83295 9.53061 8.89965C9.36241 8.96634 9.18206 9.00045 9 9Z\" fill=\"white\"/>\n </svg>\n </span>\n <span class=\"humany-loader\">\n <svg viewBox=\"25 25 50 50\">\n <circle\n cx=\"50\"\n cy=\"50\"\n r=\"20\"\n fill=\"none\"\n stroke=\"#000\"\n stroke-width=\"2\"\n stroke-miterlimit=\"10\" />\n </svg>\n </span>\n ").concat(label.length ? "<span>".concat(label, "</span>") : '');
|
|
70
|
-
setTimeout(function () { return element && element.classList.add('humany-rendered'); });
|
|
71
|
-
return triggerTabHandler(element);
|
|
72
|
-
}
|
|
73
|
-
export function setInactive(elements, title) {
|
|
74
|
-
if (elements instanceof HTMLElement) {
|
|
75
|
-
if (title) {
|
|
76
|
-
elements.setAttribute('title', title);
|
|
77
|
-
}
|
|
78
|
-
elements.classList.remove('humany-active');
|
|
79
|
-
elements.classList.remove('humany-loading');
|
|
80
|
-
}
|
|
81
|
-
else if (elements instanceof Array) {
|
|
82
|
-
elements.forEach(function (e) {
|
|
83
|
-
if (title) {
|
|
84
|
-
e.setAttribute('title', title);
|
|
85
|
-
}
|
|
86
|
-
e.classList.remove('humany-active');
|
|
87
|
-
e.classList.remove('humany-loading');
|
|
88
|
-
});
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
export function setLoading(elements) {
|
|
92
|
-
if (elements instanceof HTMLElement) {
|
|
93
|
-
elements.classList.remove('humany-active');
|
|
94
|
-
elements.classList.add('humany-loading');
|
|
95
|
-
}
|
|
96
|
-
else if (elements instanceof Array) {
|
|
97
|
-
elements.forEach(function (e) {
|
|
98
|
-
e.classList.remove('humany-active');
|
|
99
|
-
e.classList.add('humany-loading');
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
export function setActive(elements, title) {
|
|
104
|
-
if (elements instanceof HTMLElement) {
|
|
105
|
-
if (title) {
|
|
106
|
-
elements.setAttribute('title', title);
|
|
107
|
-
}
|
|
108
|
-
elements.classList.add('humany-active');
|
|
109
|
-
elements.classList.remove('humany-loading');
|
|
110
|
-
}
|
|
111
|
-
else if (elements instanceof Array) {
|
|
112
|
-
elements.forEach(function (e) {
|
|
113
|
-
if (title) {
|
|
114
|
-
e.setAttribute('title', title);
|
|
115
|
-
}
|
|
116
|
-
e.classList.add('humany-active');
|
|
117
|
-
e.classList.remove('humany-loading');
|
|
118
|
-
});
|
|
119
|
-
}
|
|
120
|
-
}
|
package/lib-esm/ui/index.js
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
export { default as AnimatedView } from './animated-view';
|
|
2
|
-
export { default as Component } from './component';
|
|
3
|
-
export { prepareDOMElements, TriggerType } from './prepare-dom';
|
|
4
|
-
export { default as ResolvableComponent } from './resolvable-component';
|
|
5
|
-
export { default as View } from './view';
|
|
6
|
-
export { default as Wrapper } from './wrapper';
|
package/lib-esm/ui/not-found.js
DELETED
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
import { useContainer } from '@telia-ace/widget-ui';
|
|
13
|
-
import React, { useContext } from 'react';
|
|
14
|
-
import { ThemeContext } from 'styled-components';
|
|
15
|
-
var DetachedComponent = React.lazy(function () { return import('./detached-component'); });
|
|
16
|
-
var NotFound = function (_a) {
|
|
17
|
-
var _b = _a.showSearch, showSearch = _b === void 0 ? false : _b;
|
|
18
|
-
var themeContext = useContext(ThemeContext);
|
|
19
|
-
var container = useContainer();
|
|
20
|
-
return (React.createElement(React.Suspense, { fallback: null },
|
|
21
|
-
React.createElement(DetachedComponent, { builder: function (components) {
|
|
22
|
-
return container.get('settings').then(function (settings) {
|
|
23
|
-
var _a;
|
|
24
|
-
var _b = Object.keys(settings.components).reduce(function (acc, key) {
|
|
25
|
-
if (settings.components[key].type === 'not-found') {
|
|
26
|
-
acc.properties = settings.components[key].properties;
|
|
27
|
-
acc.context = settings.components[key].context;
|
|
28
|
-
}
|
|
29
|
-
return acc;
|
|
30
|
-
}, { properties: {}, context: {} }), properties = _b.properties, context = _b.context;
|
|
31
|
-
properties.showSearch = showSearch;
|
|
32
|
-
var node = components.createNode('area', { detached: true });
|
|
33
|
-
node.name = 'not-found-area';
|
|
34
|
-
node.writeLayout({
|
|
35
|
-
size: 'full',
|
|
36
|
-
});
|
|
37
|
-
if (showSearch) {
|
|
38
|
-
var searchComponentProps = Object.keys(settings.components).reduce(function (acc, key) {
|
|
39
|
-
if (settings.components[key].type === 'search') {
|
|
40
|
-
return settings.components[key].properties;
|
|
41
|
-
}
|
|
42
|
-
return acc;
|
|
43
|
-
}, {});
|
|
44
|
-
var searchNode = components.createNode('search', { detached: true });
|
|
45
|
-
searchNode.writeLayout({ size: 'full' });
|
|
46
|
-
searchNode.writeProperties(__assign({ 'css-margin-bottom': ((_a = themeContext === null || themeContext === void 0 ? void 0 : themeContext.sizes) === null || _a === void 0 ? void 0 : _a.normal) || '15px' }, searchComponentProps));
|
|
47
|
-
node.appendChild(searchNode);
|
|
48
|
-
}
|
|
49
|
-
var notFoundNode = components.createNode('not-found', { detached: true });
|
|
50
|
-
notFoundNode.writeLayout({ size: 'full' });
|
|
51
|
-
notFoundNode.writeProperties(properties);
|
|
52
|
-
notFoundNode.writeContext(context);
|
|
53
|
-
node.appendChild(notFoundNode);
|
|
54
|
-
return node;
|
|
55
|
-
});
|
|
56
|
-
} })));
|
|
57
|
-
};
|
|
58
|
-
export default NotFound;
|
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
var ProvidedElements;
|
|
2
|
-
(function (ProvidedElements) {
|
|
3
|
-
ProvidedElements["None"] = "none";
|
|
4
|
-
ProvidedElements["WidgetDOM"] = "widgetDOM";
|
|
5
|
-
ProvidedElements["TriggerDOM"] = "triggerDOM";
|
|
6
|
-
ProvidedElements["Both"] = "both";
|
|
7
|
-
})(ProvidedElements || (ProvidedElements = {}));
|
|
8
|
-
export var TriggerType;
|
|
9
|
-
(function (TriggerType) {
|
|
10
|
-
TriggerType["Inline"] = "inline";
|
|
11
|
-
TriggerType["Link"] = "link";
|
|
12
|
-
TriggerType["Badge"] = "badge";
|
|
13
|
-
TriggerType["Unsupported"] = "unsupported";
|
|
14
|
-
})(TriggerType || (TriggerType = {}));
|
|
15
|
-
export var determineProvidedElements = function (widgetDOMElement, triggerDOMElement) {
|
|
16
|
-
if (widgetDOMElement && triggerDOMElement) {
|
|
17
|
-
return ProvidedElements.Both;
|
|
18
|
-
}
|
|
19
|
-
if (widgetDOMElement) {
|
|
20
|
-
return ProvidedElements.WidgetDOM;
|
|
21
|
-
}
|
|
22
|
-
if (triggerDOMElement) {
|
|
23
|
-
return ProvidedElements.TriggerDOM;
|
|
24
|
-
}
|
|
25
|
-
return ProvidedElements.None;
|
|
26
|
-
};
|
|
27
|
-
export var determineTriggerType = function (triggerDefinition) {
|
|
28
|
-
if (!triggerDefinition) {
|
|
29
|
-
return TriggerType.Inline;
|
|
30
|
-
}
|
|
31
|
-
if (typeof triggerDefinition === 'boolean' && triggerDefinition) {
|
|
32
|
-
return TriggerType.Link;
|
|
33
|
-
}
|
|
34
|
-
if (typeof triggerDefinition === 'object' && !Array.isArray(triggerDefinition)) {
|
|
35
|
-
return TriggerType.Badge;
|
|
36
|
-
}
|
|
37
|
-
return TriggerType.Unsupported;
|
|
38
|
-
};
|
|
39
|
-
export var prepareDOMElements = function (name, providedWidgetElement, providedTriggerElement, triggerDefinition, waitWithReplace) {
|
|
40
|
-
var _a, _b;
|
|
41
|
-
if (waitWithReplace === void 0) { waitWithReplace = false; }
|
|
42
|
-
var providedElements = determineProvidedElements(providedWidgetElement, providedTriggerElement);
|
|
43
|
-
var triggerType = determineTriggerType(triggerDefinition);
|
|
44
|
-
var cachedOriginals = {
|
|
45
|
-
widgetDOMElement: providedWidgetElement ? providedWidgetElement.cloneNode(true) : undefined,
|
|
46
|
-
triggerDOMElement: providedTriggerElement
|
|
47
|
-
? providedTriggerElement.cloneNode(true)
|
|
48
|
-
: undefined,
|
|
49
|
-
};
|
|
50
|
-
var output = {
|
|
51
|
-
triggerType: triggerType,
|
|
52
|
-
cachedOriginals: cachedOriginals,
|
|
53
|
-
widgetDOMElement: document.createElement('div'),
|
|
54
|
-
};
|
|
55
|
-
switch (providedElements) {
|
|
56
|
-
case ProvidedElements.Both: {
|
|
57
|
-
output.widgetDOMElement = providedWidgetElement || document.createElement('div');
|
|
58
|
-
if (triggerType !== TriggerType.Inline) {
|
|
59
|
-
output.triggerDOMElement = providedTriggerElement;
|
|
60
|
-
}
|
|
61
|
-
break;
|
|
62
|
-
}
|
|
63
|
-
case ProvidedElements.WidgetDOM: {
|
|
64
|
-
output.widgetDOMElement = providedWidgetElement || document.createElement('div');
|
|
65
|
-
if (triggerType !== TriggerType.Inline) {
|
|
66
|
-
var triggerElement = document.body.appendChild(document.createElement('a'));
|
|
67
|
-
if (triggerType === TriggerType.Link) {
|
|
68
|
-
triggerElement.innerText = name;
|
|
69
|
-
}
|
|
70
|
-
output.triggerDOMElement = triggerElement;
|
|
71
|
-
}
|
|
72
|
-
break;
|
|
73
|
-
}
|
|
74
|
-
case ProvidedElements.TriggerDOM: {
|
|
75
|
-
var widgetElement_1 = document.createElement('div');
|
|
76
|
-
output.widgetDOMElement = widgetElement_1;
|
|
77
|
-
if (triggerType === TriggerType.Inline) {
|
|
78
|
-
// replace with widgetDOMElement in the DOM
|
|
79
|
-
widgetElement_1.id = (providedTriggerElement === null || providedTriggerElement === void 0 ? void 0 : providedTriggerElement.id) || '';
|
|
80
|
-
if (waitWithReplace) {
|
|
81
|
-
widgetElement_1.style.display = 'none';
|
|
82
|
-
(_a = providedTriggerElement === null || providedTriggerElement === void 0 ? void 0 : providedTriggerElement.parentNode) === null || _a === void 0 ? void 0 : _a.appendChild(widgetElement_1);
|
|
83
|
-
output.callback = function () {
|
|
84
|
-
var _a;
|
|
85
|
-
(_a = providedTriggerElement === null || providedTriggerElement === void 0 ? void 0 : providedTriggerElement.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(widgetElement_1, providedTriggerElement);
|
|
86
|
-
widgetElement_1.style.display =
|
|
87
|
-
(providedTriggerElement === null || providedTriggerElement === void 0 ? void 0 : providedTriggerElement.style.display) || 'block';
|
|
88
|
-
};
|
|
89
|
-
}
|
|
90
|
-
else {
|
|
91
|
-
(_b = providedTriggerElement === null || providedTriggerElement === void 0 ? void 0 : providedTriggerElement.parentNode) === null || _b === void 0 ? void 0 : _b.replaceChild(widgetElement_1, providedTriggerElement);
|
|
92
|
-
}
|
|
93
|
-
output.cachedOriginals.widgetDOMElement = providedTriggerElement;
|
|
94
|
-
output.cachedOriginals.triggerDOMElement = undefined;
|
|
95
|
-
}
|
|
96
|
-
else {
|
|
97
|
-
output.widgetDOMElement = document.body.appendChild(widgetElement_1);
|
|
98
|
-
output.triggerDOMElement = providedTriggerElement;
|
|
99
|
-
}
|
|
100
|
-
break;
|
|
101
|
-
}
|
|
102
|
-
case ProvidedElements.None: {
|
|
103
|
-
var widgetElement = document.body.appendChild(document.createElement('div'));
|
|
104
|
-
output.widgetDOMElement = widgetElement;
|
|
105
|
-
if (triggerType !== TriggerType.Inline) {
|
|
106
|
-
var triggerElement = document.body.appendChild(document.createElement('a'));
|
|
107
|
-
if (triggerType === TriggerType.Link) {
|
|
108
|
-
triggerElement.innerText = name;
|
|
109
|
-
}
|
|
110
|
-
output.triggerDOMElement = triggerElement;
|
|
111
|
-
}
|
|
112
|
-
break;
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
return output;
|
|
116
|
-
};
|
package/lib-esm/ui/render.js
DELETED
|
@@ -1,62 +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 { filterCssPropsStyle, Typography, useComponent, useComponentDescriptor, } from '@telia-ace/widget-ui';
|
|
28
|
-
import { appendClassNames } from '@telia-ace/widget-utilities';
|
|
29
|
-
import React, { forwardRef, Suspense, useMemo } from 'react';
|
|
30
|
-
import styled, { css } from 'styled-components';
|
|
31
|
-
import { styling } from './component';
|
|
32
|
-
var NonResolvedComponentWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n text-align: center;\n ", "\n ", "\n ", "\n"], ["\n text-align: center;\n ", "\n ", "\n ", "\n"])), function (p) {
|
|
33
|
-
var _a, _b, _c;
|
|
34
|
-
return typeof ((_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.warning) !== 'undefined' && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n border: 2px dashed ", ";\n "], ["\n color: ", ";\n border: 2px dashed ", ";\n "])), (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.warning, (_c = p.theme.colors) === null || _c === void 0 ? void 0 : _c.warning);
|
|
35
|
-
}, function (p) {
|
|
36
|
-
return typeof p.theme.borderRadius !== 'undefined' && "border-radius: ".concat(p.theme.borderRadius, ";");
|
|
37
|
-
}, styling);
|
|
38
|
-
var ResolvableComponent = forwardRef(function (_a, ref) {
|
|
39
|
-
var _b = _a.className, className = _b === void 0 ? '' : _b, children = _a.children, other = __rest(_a, ["className", "children"]);
|
|
40
|
-
var ResolvedComponent = useComponent();
|
|
41
|
-
var _c = useComponentDescriptor(), name = _c.name, type = _c.type, id = _c.id;
|
|
42
|
-
var StyledResolvableComponent = useMemo(function () {
|
|
43
|
-
if (ResolvedComponent) {
|
|
44
|
-
return styled(ResolvedComponent)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), styling, filterCssPropsStyle);
|
|
45
|
-
}
|
|
46
|
-
return null;
|
|
47
|
-
}, [ResolvedComponent]);
|
|
48
|
-
if (typeof ResolvedComponent === 'undefined') {
|
|
49
|
-
return null;
|
|
50
|
-
}
|
|
51
|
-
if (ResolvedComponent === null || StyledResolvableComponent === null) {
|
|
52
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
53
|
-
return (React.createElement(NonResolvedComponentWrapper, __assign({}, other, { title: "type: ".concat(type, ", definition-id: ").concat(name, ", instance-id: ").concat(id), className: appendClassNames(className, 'humany-non-resolved-component') }),
|
|
54
|
-
React.createElement(Typography, { variant: "h5" }, "Non Resolved Component Type")));
|
|
55
|
-
}
|
|
56
|
-
return null;
|
|
57
|
-
}
|
|
58
|
-
return (React.createElement(Suspense, { fallback: null },
|
|
59
|
-
React.createElement(StyledResolvableComponent, __assign({ ref: ref }, other, { className: appendClassNames(className, 'humany-component', "humany-component-".concat(name)) }), children)));
|
|
60
|
-
});
|
|
61
|
-
export default ResolvableComponent;
|
|
62
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
package/lib-esm/ui/switch.js
DELETED
|
@@ -1,53 +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
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
29
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
30
|
-
if (ar || !(i in from)) {
|
|
31
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
32
|
-
ar[i] = from[i];
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
36
|
-
};
|
|
37
|
-
import React from 'react';
|
|
38
|
-
import { Route, Switch as RouteSwitch } from 'react-router';
|
|
39
|
-
var Switch = function (_a) {
|
|
40
|
-
var views = _a.views, location = _a.location, render = _a.render;
|
|
41
|
-
return (React.createElement(RouteSwitch, { location: location
|
|
42
|
-
? __assign(__assign({}, location), { pathname: location.pathname.split('?')[0] }) : location }, __spreadArray(__spreadArray([], __read(Object.keys(views).filter(function (key) { return !!views[key].path; })), false), __read(Object.keys(views).filter(function (key) { return !views[key].path; })), false).map(function (name) {
|
|
43
|
-
var path = views[name].path;
|
|
44
|
-
if (!path) {
|
|
45
|
-
return React.createElement(Route, { key: name, render: function () { return render(name); } });
|
|
46
|
-
}
|
|
47
|
-
if (Array.isArray(path)) {
|
|
48
|
-
return path.map(function (path) { return (React.createElement(Route, { key: name, exact: true, path: path, render: function () { return render(name); } })); });
|
|
49
|
-
}
|
|
50
|
-
return React.createElement(Route, { key: name, exact: true, path: path, render: function () { return render(name); } });
|
|
51
|
-
})));
|
|
52
|
-
};
|
|
53
|
-
export default Switch;
|
package/lib-esm/ui/unmount.js
DELETED
|
@@ -1,42 +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 { useComponentNode, useComponentPlatform, useIsMounted } from '@telia-ace/widget-ui';
|
|
18
|
-
import { useEffect, useState } from 'react';
|
|
19
|
-
export default (function (id) {
|
|
20
|
-
var node = useComponentNode(id);
|
|
21
|
-
var components = useComponentPlatform();
|
|
22
|
-
var _a = __read(useState({}), 2), properties = _a[0], setProperties = _a[1];
|
|
23
|
-
var isMounted = useIsMounted();
|
|
24
|
-
useEffect(function () {
|
|
25
|
-
if (node && isMounted.current) {
|
|
26
|
-
setProperties(node.attributes.properties);
|
|
27
|
-
}
|
|
28
|
-
}, [node, id, isMounted]);
|
|
29
|
-
useEffect(function () {
|
|
30
|
-
if (components) {
|
|
31
|
-
var unsubscribe_1 = components.events.subscribe('components:properties-changed', function (event, data) {
|
|
32
|
-
if (node === data.node && isMounted.current) {
|
|
33
|
-
setProperties(data.node.attributes.properties);
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
return function () {
|
|
37
|
-
unsubscribe_1();
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
|
-
}, [components, isMounted, id, node]);
|
|
41
|
-
return properties;
|
|
42
|
-
});
|
package/lib-esm/ui/use-router.js
DELETED
|
@@ -1,30 +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 { useIsMounted } from '@telia-ace/widget-ui';
|
|
18
|
-
import { useEffect, useState } from 'react';
|
|
19
|
-
export default (function (container) {
|
|
20
|
-
var _a = __read(useState(null), 2), router = _a[0], setRouter = _a[1];
|
|
21
|
-
var isMounted = useIsMounted();
|
|
22
|
-
useEffect(function () {
|
|
23
|
-
container.getAsync('router').then(function (router) {
|
|
24
|
-
if (isMounted.current) {
|
|
25
|
-
setRouter(router);
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
}, [container, isMounted]);
|
|
29
|
-
return router;
|
|
30
|
-
});
|
|
@@ -1,126 +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
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
18
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
19
|
-
if (ar || !(i in from)) {
|
|
20
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
21
|
-
ar[i] = from[i];
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
25
|
-
};
|
|
26
|
-
import { readStorage, StorageMedium } from '@telia-ace/widget-services';
|
|
27
|
-
import { notifyDataLoaded } from '@telia-ace/widget-utilities';
|
|
28
|
-
import { createTriggerElement, setActive, setLoading } from './html-element-handlers';
|
|
29
|
-
import { TriggerType } from './prepare-dom';
|
|
30
|
-
var MODALS_STORAGE_KEY = 'modals';
|
|
31
|
-
var ViewOutlet = /** @class */ (function () {
|
|
32
|
-
function ViewOutlet(container, options) {
|
|
33
|
-
this.options = options;
|
|
34
|
-
this.unsubscribe = [];
|
|
35
|
-
this.container = container.createChild(this);
|
|
36
|
-
this.container.register('widgetDOMElement', this.options.widgetDOMElement);
|
|
37
|
-
this.container.register('triggerDOMElement', this.options.triggerDOMElement);
|
|
38
|
-
var widget = this.container.get('$widget');
|
|
39
|
-
this.options.widgetDOMElement.classList.add('humany-widget');
|
|
40
|
-
this.options.widgetDOMElement.classList.add("humany_".concat(widget.name));
|
|
41
|
-
var widgetDOMElements = container.get('widgetDOMElements') || [];
|
|
42
|
-
container.register('widgetDOMElements', __spreadArray(__spreadArray([], __read(widgetDOMElements), false), [
|
|
43
|
-
this.options.widgetDOMElement,
|
|
44
|
-
], false));
|
|
45
|
-
}
|
|
46
|
-
/**
|
|
47
|
-
* Renders the view outlet to the DOM.
|
|
48
|
-
*/
|
|
49
|
-
ViewOutlet.prototype.render = function () {
|
|
50
|
-
var _this = this;
|
|
51
|
-
var _a = this.options, widgetDOMElement = _a.widgetDOMElement, triggerDOMElement = _a.triggerDOMElement;
|
|
52
|
-
var widget = this.container.get('$widget');
|
|
53
|
-
if (widgetDOMElement.getAttribute('data-rendered') === 'true') {
|
|
54
|
-
return Promise.resolve();
|
|
55
|
-
}
|
|
56
|
-
if (triggerDOMElement && this.options.triggerType === TriggerType.Badge) {
|
|
57
|
-
setLoading(triggerDOMElement);
|
|
58
|
-
}
|
|
59
|
-
return import('./render')
|
|
60
|
-
.then(function (module) { return module.default(_this.container, widgetDOMElement); })
|
|
61
|
-
.then(function () {
|
|
62
|
-
widgetDOMElement.setAttribute('data-rendered', 'true');
|
|
63
|
-
if (triggerDOMElement && _this.options.triggerType === TriggerType.Badge) {
|
|
64
|
-
var tooltip = _this.options.triggerOptions.openTooltip;
|
|
65
|
-
setActive(triggerDOMElement, tooltip);
|
|
66
|
-
}
|
|
67
|
-
notifyDataLoaded(_this.container, widgetDOMElement);
|
|
68
|
-
var widgets = _this.container.get('$environment').widgets.all();
|
|
69
|
-
readStorage(_this.container, MODALS_STORAGE_KEY, StorageMedium.Session).then(function (modals) {
|
|
70
|
-
if (modals) {
|
|
71
|
-
modals.forEach(function (modal) {
|
|
72
|
-
if (widgets.find(function (w) { return w.name === modal.name && w.state === 'activated'; })) {
|
|
73
|
-
widget.events.dispatch('widget:modal-opened', modal);
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
});
|
|
79
|
-
};
|
|
80
|
-
ViewOutlet.prototype.renderBadge = function (options) {
|
|
81
|
-
var triggerDOMElement = this.options.triggerDOMElement;
|
|
82
|
-
if (!triggerDOMElement) {
|
|
83
|
-
return;
|
|
84
|
-
}
|
|
85
|
-
if (!triggerDOMElement.getAttribute('role')) {
|
|
86
|
-
triggerDOMElement.setAttribute('role', 'button');
|
|
87
|
-
}
|
|
88
|
-
var name = this.container.get('$widget').name;
|
|
89
|
-
var label = options.label, symbol = options.symbol, ariaLabel = options.ariaLabel, closedTooltip = options.closedTooltip, openTooltip = options.openTooltip;
|
|
90
|
-
var triggerOptions = { closedTooltip: closedTooltip, openTooltip: openTooltip };
|
|
91
|
-
this.options.triggerOptions = triggerOptions;
|
|
92
|
-
var removeTriggerListeners = createTriggerElement(triggerDOMElement, {
|
|
93
|
-
label: label,
|
|
94
|
-
symbol: symbol,
|
|
95
|
-
ariaLabel: ariaLabel,
|
|
96
|
-
widgetName: name,
|
|
97
|
-
tooltip: closedTooltip,
|
|
98
|
-
});
|
|
99
|
-
this.unsubscribe.push(removeTriggerListeners);
|
|
100
|
-
};
|
|
101
|
-
ViewOutlet.prototype.dispose = function () {
|
|
102
|
-
var _this = this;
|
|
103
|
-
return import('./unmount').then(function (module) {
|
|
104
|
-
var _a, _b, _c, _d;
|
|
105
|
-
var _e = _this.options, triggerDOMElement = _e.triggerDOMElement, widgetDOMElement = _e.widgetDOMElement;
|
|
106
|
-
module.default(widgetDOMElement);
|
|
107
|
-
if (_this.options.cachedOriginals.widgetDOMElement) {
|
|
108
|
-
if (widgetDOMElement) {
|
|
109
|
-
(_a = widgetDOMElement.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(_this.options.cachedOriginals.widgetDOMElement, widgetDOMElement);
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
if (_this.options.cachedOriginals.triggerDOMElement) {
|
|
113
|
-
if (triggerDOMElement) {
|
|
114
|
-
(_b = triggerDOMElement.parentNode) === null || _b === void 0 ? void 0 : _b.replaceChild(_this.options.cachedOriginals.triggerDOMElement, triggerDOMElement);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
_this.unsubscribe.forEach(function (unsubscribe) {
|
|
118
|
-
unsubscribe();
|
|
119
|
-
});
|
|
120
|
-
(_c = widgetDOMElement.parentNode) === null || _c === void 0 ? void 0 : _c.removeChild(widgetDOMElement);
|
|
121
|
-
(_d = triggerDOMElement === null || triggerDOMElement === void 0 ? void 0 : triggerDOMElement.parentNode) === null || _d === void 0 ? void 0 : _d.removeChild(triggerDOMElement);
|
|
122
|
-
});
|
|
123
|
-
};
|
|
124
|
-
return ViewOutlet;
|
|
125
|
-
}());
|
|
126
|
-
export { ViewOutlet };
|