@telia-ace/widget-components-widget-header 1.0.5 → 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}/avatar.d.ts +0 -0
- package/{lib-esm → dist}/back.d.ts +0 -0
- package/{lib-esm → dist}/close.d.ts +0 -0
- package/{lib-esm → dist}/index.d.ts +0 -0
- package/dist/index.js +5 -0
- package/dist/index.js.map +1 -0
- package/dist/index2.js +114 -0
- package/dist/index2.js.map +1 -0
- package/{lib-esm → dist}/minimize.d.ts +0 -0
- package/{lib-esm → dist}/node.d.ts +0 -0
- package/{lib-esm → dist}/utils.d.ts +0 -0
- package/{lib-esm → dist}/widget-header-component.d.ts +0 -0
- package/{lib-esm → dist}/widget-header.d.ts +0 -0
- package/dist/widget-header.js +291 -0
- package/dist/widget-header.js.map +1 -0
- package/package.json +12 -13
- package/lib/avatar.d.ts +0 -7
- package/lib/avatar.js +0 -80
- package/lib/back.d.ts +0 -7
- package/lib/back.js +0 -13
- package/lib/close.d.ts +0 -7
- package/lib/close.js +0 -14
- package/lib/index.d.ts +0 -2
- package/lib/index.js +0 -7
- package/lib/minimize.d.ts +0 -7
- package/lib/minimize.js +0 -14
- package/lib/node.d.ts +0 -7
- package/lib/node.js +0 -91
- package/lib/utils.d.ts +0 -9
- package/lib/utils.js +0 -90
- package/lib/widget-header-component.d.ts +0 -28
- package/lib/widget-header-component.js +0 -102
- package/lib/widget-header.d.ts +0 -7
- package/lib/widget-header.js +0 -99
- package/lib-esm/avatar.js +0 -52
- package/lib-esm/back.js +0 -8
- package/lib-esm/close.js +0 -9
- package/lib-esm/index.js +0 -2
- package/lib-esm/minimize.js +0 -9
- package/lib-esm/node.js +0 -63
- package/lib-esm/utils.js +0 -84
- package/lib-esm/widget-header-component.js +0 -77
- package/lib-esm/widget-header.js +0 -71
package/lib/close.d.ts
DELETED
package/lib/close.js
DELETED
|
@@ -1,14 +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 widget_ui_1 = require("@telia-ace/widget-ui");
|
|
7
|
-
var react_1 = __importDefault(require("react"));
|
|
8
|
-
var Close = function (_a) {
|
|
9
|
-
var node = _a.node;
|
|
10
|
-
var symbol = node.symbol || { type: 'Svg', content: 'close' };
|
|
11
|
-
var size = parseInt(node === null || node === void 0 ? void 0 : node.size, 10) || 14;
|
|
12
|
-
return react_1.default.createElement(widget_ui_1.SymbolBadge, { size: size, symbol: symbol });
|
|
13
|
-
};
|
|
14
|
-
exports.default = Close;
|
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 widget_header_component_1 = __importDefault(require("./widget-header-component"));
|
|
7
|
-
exports.default = widget_header_component_1.default;
|
package/lib/minimize.d.ts
DELETED
package/lib/minimize.js
DELETED
|
@@ -1,14 +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 widget_ui_1 = require("@telia-ace/widget-ui");
|
|
7
|
-
var react_1 = __importDefault(require("react"));
|
|
8
|
-
var Minimize = function (_a) {
|
|
9
|
-
var node = _a.node;
|
|
10
|
-
var symbol = node.symbol || { type: 'Svg', content: 'minimize' };
|
|
11
|
-
var size = parseInt(node === null || node === void 0 ? void 0 : node.size, 10) || 20;
|
|
12
|
-
return react_1.default.createElement(widget_ui_1.SymbolBadge, { size: size, symbol: symbol });
|
|
13
|
-
};
|
|
14
|
-
exports.default = Minimize;
|
package/lib/node.d.ts
DELETED
package/lib/node.js
DELETED
|
@@ -1,91 +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
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
30
|
-
var t = {};
|
|
31
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
32
|
-
t[p] = s[p];
|
|
33
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
34
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
35
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
36
|
-
t[p[i]] = s[p[i]];
|
|
37
|
-
}
|
|
38
|
-
return t;
|
|
39
|
-
};
|
|
40
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
41
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
42
|
-
};
|
|
43
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
44
|
-
var widget_ui_1 = require("@telia-ace/widget-ui");
|
|
45
|
-
var react_1 = __importDefault(require("react"));
|
|
46
|
-
var styled_components_1 = __importStar(require("styled-components"));
|
|
47
|
-
var avatar_1 = __importDefault(require("./avatar"));
|
|
48
|
-
var back_1 = __importDefault(require("./back"));
|
|
49
|
-
var close_1 = __importDefault(require("./close"));
|
|
50
|
-
var minimize_1 = __importDefault(require("./minimize"));
|
|
51
|
-
var Node = function (_a) {
|
|
52
|
-
var _b = _a.className, className = _b === void 0 ? '' : _b, node = __rest(_a, ["className"]);
|
|
53
|
-
var dispatch = (0, widget_ui_1.useDispatch)();
|
|
54
|
-
var size = node.size, padding = node.padding, type = node.type, tooltip = node.tooltip, _c = node.show, show = _c === void 0 ? true : _c;
|
|
55
|
-
if (type === 'back') {
|
|
56
|
-
return (react_1.default.createElement(NodeWrapper, { size: size || '64px', padding: padding || '10px' },
|
|
57
|
-
react_1.default.createElement(widget_ui_1.TransitionComponent, { in: show, timeout: 300, transitions: {
|
|
58
|
-
enter: {
|
|
59
|
-
type: 'scale',
|
|
60
|
-
easing: 'cubic-bezier(.08,.84,.74,1.84)',
|
|
61
|
-
},
|
|
62
|
-
exit: {
|
|
63
|
-
type: 'scale',
|
|
64
|
-
easing: 'ease-out',
|
|
65
|
-
},
|
|
66
|
-
} }, function (state, css) { return (react_1.default.createElement(ActionButton, { title: tooltip, "aria-label": tooltip, animationCss: css, onClick: function () {
|
|
67
|
-
dispatch('back');
|
|
68
|
-
} },
|
|
69
|
-
react_1.default.createElement(back_1.default, { node: node }))); })));
|
|
70
|
-
}
|
|
71
|
-
if (!show) {
|
|
72
|
-
return null;
|
|
73
|
-
}
|
|
74
|
-
return (react_1.default.createElement(NodeWrapper, { size: size || '64px', padding: padding || '10px', squareRatio: type === 'avatar' },
|
|
75
|
-
type === 'avatar' && react_1.default.createElement(avatar_1.default, { node: node }),
|
|
76
|
-
type === 'close' && (react_1.default.createElement(ActionButton, { title: tooltip, "aria-label": tooltip, onClick: function () {
|
|
77
|
-
dispatch('close');
|
|
78
|
-
} },
|
|
79
|
-
react_1.default.createElement(close_1.default, { node: node }))),
|
|
80
|
-
type === 'minimize' && (react_1.default.createElement(ActionButton, { title: tooltip, "aria-label": tooltip, onClick: function () {
|
|
81
|
-
dispatch('minimize');
|
|
82
|
-
} },
|
|
83
|
-
react_1.default.createElement(minimize_1.default, { node: node })))));
|
|
84
|
-
};
|
|
85
|
-
exports.default = Node;
|
|
86
|
-
var NodeWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n flex: 1;\n max-width: ", ";\n ", "\n text-align: center;\n padding: 0 ", ";\n && {\n box-sizing: content-box;\n }\n\n svg {\n vertical-align: middle;\n }\n\n i {\n color: ", ";\n font-size: ", ";\n min-width: 1em;\n min-height: 1em;\n display: inline-block;\n }\n"], ["\n flex: 1;\n max-width: ", ";\n ", "\n text-align: center;\n padding: 0 ", ";\n && {\n box-sizing: content-box;\n }\n\n svg {\n vertical-align: middle;\n }\n\n i {\n color: ", ";\n font-size: ", ";\n min-width: 1em;\n min-height: 1em;\n display: inline-block;\n }\n"])), function (p) { return p.size; }, function (p) { return p.squareRatio && "max-height: ".concat(p.size, ";"); }, function (p) { return p.padding; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { return p.size; });
|
|
87
|
-
var ActionButton = styled_components_1.default.button(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", ";\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n &:focus {\n ", ";\n }\n"], ["\n ", ";\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n &:focus {\n ", ";\n }\n"])), function (p) { return !!p.animationCss && p.animationCss; }, function (p) {
|
|
88
|
-
var _a, _b, _c;
|
|
89
|
-
return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", ";\n border-color: ", ";\n "], ["\n ", ";\n border-color: ", ";\n "])), widget_ui_1.borderTabStyle, (_c = (_b = p.theme.accessibility) === null || _b === void 0 ? void 0 : _b.colors) === null || _c === void 0 ? void 0 : _c.inactiveText);
|
|
90
|
-
});
|
|
91
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
package/lib/utils.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { Container } from '@webprovisions/platform';
|
|
2
|
-
import { ActionNode } from './widget-header-component';
|
|
3
|
-
export declare const calculateMargin: (leftNodes: ActionNode[], rightNodes: ActionNode[], textAlign: string) => {
|
|
4
|
-
[x: string]: string;
|
|
5
|
-
};
|
|
6
|
-
export declare const createNodes: (actions: {
|
|
7
|
-
[key: string]: ActionNode;
|
|
8
|
-
}) => [ActionNode[], ActionNode[]];
|
|
9
|
-
export declare const isOnInitialRoute: (container: Container) => Promise<boolean>;
|
package/lib/utils.js
DELETED
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __read = (this && this.__read) || function (o, n) {
|
|
3
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
4
|
-
if (!m) return o;
|
|
5
|
-
var i = m.call(o), r, ar = [], e;
|
|
6
|
-
try {
|
|
7
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
8
|
-
}
|
|
9
|
-
catch (error) { e = { error: error }; }
|
|
10
|
-
finally {
|
|
11
|
-
try {
|
|
12
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
13
|
-
}
|
|
14
|
-
finally { if (e) throw e.error; }
|
|
15
|
-
}
|
|
16
|
-
return ar;
|
|
17
|
-
};
|
|
18
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
|
-
exports.isOnInitialRoute = exports.createNodes = exports.calculateMargin = void 0;
|
|
20
|
-
var widget_utilities_1 = require("@telia-ace/widget-utilities");
|
|
21
|
-
var calculateMargin = function (leftNodes, rightNodes, textAlign) {
|
|
22
|
-
var _a;
|
|
23
|
-
if (textAlign !== 'center') {
|
|
24
|
-
return {};
|
|
25
|
-
}
|
|
26
|
-
var calculate = function (nodes) {
|
|
27
|
-
return nodes.reduce(function (acc, node) {
|
|
28
|
-
var _a = __read(node.padding.split('px'), 1), padding = _a[0];
|
|
29
|
-
var _b = __read(node.size.split('px'), 1), size = _b[0];
|
|
30
|
-
return acc + (+size + +padding * 2);
|
|
31
|
-
}, 0);
|
|
32
|
-
};
|
|
33
|
-
var leftSize = calculate(leftNodes);
|
|
34
|
-
var rightSize = calculate(rightNodes);
|
|
35
|
-
var total = leftSize - rightSize;
|
|
36
|
-
if (total === 0) {
|
|
37
|
-
return {};
|
|
38
|
-
}
|
|
39
|
-
var direction = leftSize > rightSize ? 'right' : 'left';
|
|
40
|
-
return _a = {},
|
|
41
|
-
_a[direction] = "".concat(Math.abs(total), "px"),
|
|
42
|
-
_a;
|
|
43
|
-
};
|
|
44
|
-
exports.calculateMargin = calculateMargin;
|
|
45
|
-
var createNodes = function (actions) {
|
|
46
|
-
return Object.keys(actions).reduce(function (acc, key) {
|
|
47
|
-
var node = actions[key];
|
|
48
|
-
if (!node) {
|
|
49
|
-
return acc;
|
|
50
|
-
}
|
|
51
|
-
var _a = __read(acc, 2), left = _a[0], right = _a[1];
|
|
52
|
-
var arr = node.position === 'left' ? left : right;
|
|
53
|
-
var symbol = actions[key].symbol;
|
|
54
|
-
if (symbol && typeof symbol === 'string') {
|
|
55
|
-
symbol = {
|
|
56
|
-
type: 'Uri',
|
|
57
|
-
content: symbol,
|
|
58
|
-
};
|
|
59
|
-
}
|
|
60
|
-
arr.push({
|
|
61
|
-
symbol: node.symbol && typeof node.symbol === 'string'
|
|
62
|
-
? { type: 'Uri', content: node.symbol }
|
|
63
|
-
: node.symbol,
|
|
64
|
-
type: key,
|
|
65
|
-
padding: node.padding || '10px',
|
|
66
|
-
label: node.label,
|
|
67
|
-
size: node.size || '64px',
|
|
68
|
-
tooltip: node.tooltip,
|
|
69
|
-
order: node.order || 0,
|
|
70
|
-
show: node.show,
|
|
71
|
-
});
|
|
72
|
-
return acc;
|
|
73
|
-
}, [[], []]);
|
|
74
|
-
};
|
|
75
|
-
exports.createNodes = createNodes;
|
|
76
|
-
var isOnInitialRoute = function (container) {
|
|
77
|
-
return container.getAsync('router').then(function (router) {
|
|
78
|
-
if (!router) {
|
|
79
|
-
return true;
|
|
80
|
-
}
|
|
81
|
-
var initialRoute = router.getInitialRoute();
|
|
82
|
-
var _a = router.getRouteData(), name = _a.name, params = _a.params;
|
|
83
|
-
(0, widget_utilities_1.removeNullAndUndefinedValues)(params);
|
|
84
|
-
if ((initialRoute === null || initialRoute === void 0 ? void 0 : initialRoute.name) !== name || Object.keys(params).length > 0) {
|
|
85
|
-
return false;
|
|
86
|
-
}
|
|
87
|
-
return true;
|
|
88
|
-
});
|
|
89
|
-
};
|
|
90
|
-
exports.isOnInitialRoute = isOnInitialRoute;
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { Container } from '@webprovisions/platform';
|
|
2
|
-
export declare type Symbol = {
|
|
3
|
-
type: 'Uri' | 'Svg' | 'FontAwesome' | 'Text' | string;
|
|
4
|
-
content: string;
|
|
5
|
-
};
|
|
6
|
-
export declare type ActionNode = {
|
|
7
|
-
type: string;
|
|
8
|
-
label?: string;
|
|
9
|
-
position?: 'right' | 'left';
|
|
10
|
-
symbol?: Symbol;
|
|
11
|
-
size: string;
|
|
12
|
-
padding: string;
|
|
13
|
-
tooltip?: string;
|
|
14
|
-
order?: number;
|
|
15
|
-
show?: boolean;
|
|
16
|
-
};
|
|
17
|
-
export declare type WidgetHeaderComponentProps = {
|
|
18
|
-
header: string;
|
|
19
|
-
tagline: string;
|
|
20
|
-
textAlign?: string;
|
|
21
|
-
actions?: {
|
|
22
|
-
[key: string]: ActionNode;
|
|
23
|
-
};
|
|
24
|
-
tooltip?: string;
|
|
25
|
-
route?: string;
|
|
26
|
-
};
|
|
27
|
-
declare const WidgetHeaderComponent: (container: Container) => Promise<void>;
|
|
28
|
-
export default WidgetHeaderComponent;
|
|
@@ -1,102 +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 widget_core_1 = require("@telia-ace/widget-core");
|
|
43
|
-
var widget_ui_1 = require("@telia-ace/widget-ui");
|
|
44
|
-
var utils_1 = require("./utils");
|
|
45
|
-
var WidgetHeaderComponent = function (container) {
|
|
46
|
-
return (0, widget_ui_1.createReactComponent)(container, 'widget-header', Promise.resolve().then(function () { return __importStar(require('./widget-header')); }), function (component) {
|
|
47
|
-
var events = container.get('$widget').events;
|
|
48
|
-
var _a = __read((0, widget_core_1.createEventSubscriber)(events), 2), subscribe = _a[0], unsubscribe = _a[1];
|
|
49
|
-
var _b = component.properties().actions, actions = _b === void 0 ? {} : _b;
|
|
50
|
-
component.actions.create('close', function (data, options) {
|
|
51
|
-
if (options.preventDefault) {
|
|
52
|
-
return;
|
|
53
|
-
}
|
|
54
|
-
var widget = container.get('$widget');
|
|
55
|
-
return widget.invoke('close');
|
|
56
|
-
});
|
|
57
|
-
component.actions.create('back', function (data, options) {
|
|
58
|
-
if (options.preventDefault) {
|
|
59
|
-
return;
|
|
60
|
-
}
|
|
61
|
-
return container.getAsync('router').then(function (router) {
|
|
62
|
-
router.goBack();
|
|
63
|
-
});
|
|
64
|
-
});
|
|
65
|
-
component.properties(function (properties) {
|
|
66
|
-
var _a = properties.actions, actions = _a === void 0 ? {} : _a;
|
|
67
|
-
if (!actions.back) {
|
|
68
|
-
return;
|
|
69
|
-
}
|
|
70
|
-
Object.keys(actions).forEach(function (key) {
|
|
71
|
-
var node = actions[key];
|
|
72
|
-
if (key === 'back') {
|
|
73
|
-
node.show = properties.showBack;
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
return { actions: actions };
|
|
77
|
-
});
|
|
78
|
-
component.actions.create('show-back', function (showBack) {
|
|
79
|
-
component.writeProperties({ showBack: showBack });
|
|
80
|
-
});
|
|
81
|
-
if (actions.back) {
|
|
82
|
-
var showBack = function () {
|
|
83
|
-
return (0, utils_1.isOnInitialRoute)(container).then(function (onInitialRoute) {
|
|
84
|
-
return component.actions.dispatch('show-back', !onInitialRoute);
|
|
85
|
-
});
|
|
86
|
-
};
|
|
87
|
-
showBack();
|
|
88
|
-
subscribe('router:changed', showBack);
|
|
89
|
-
}
|
|
90
|
-
component.actions.create('minimize', function (data, options) {
|
|
91
|
-
if (options.preventDefault) {
|
|
92
|
-
return;
|
|
93
|
-
}
|
|
94
|
-
var widget = container.get('$widget');
|
|
95
|
-
return widget.invoke('hide');
|
|
96
|
-
});
|
|
97
|
-
return function () {
|
|
98
|
-
unsubscribe();
|
|
99
|
-
};
|
|
100
|
-
});
|
|
101
|
-
};
|
|
102
|
-
exports.default = WidgetHeaderComponent;
|
package/lib/widget-header.d.ts
DELETED
package/lib/widget-header.js
DELETED
|
@@ -1,99 +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 __read = (this && this.__read) || function (o, n) {
|
|
52
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
53
|
-
if (!m) return o;
|
|
54
|
-
var i = m.call(o), r, ar = [], e;
|
|
55
|
-
try {
|
|
56
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
57
|
-
}
|
|
58
|
-
catch (error) { e = { error: error }; }
|
|
59
|
-
finally {
|
|
60
|
-
try {
|
|
61
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
62
|
-
}
|
|
63
|
-
finally { if (e) throw e.error; }
|
|
64
|
-
}
|
|
65
|
-
return ar;
|
|
66
|
-
};
|
|
67
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
68
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
69
|
-
};
|
|
70
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
71
|
-
var widget_ui_1 = require("@telia-ace/widget-ui");
|
|
72
|
-
var widget_utilities_1 = require("@telia-ace/widget-utilities");
|
|
73
|
-
var react_1 = __importDefault(require("react"));
|
|
74
|
-
var styled_components_1 = __importStar(require("styled-components"));
|
|
75
|
-
var node_1 = __importDefault(require("./node"));
|
|
76
|
-
var utils_1 = require("./utils");
|
|
77
|
-
var WidgetHeader = function (_a) {
|
|
78
|
-
var className = _a.className, other = __rest(_a, ["className"]);
|
|
79
|
-
var _b = (0, widget_ui_1.useProperties)(), header = _b.header, tagline = _b.tagline, route = _b.route, _c = _b.tooltip, tooltip = _c === void 0 ? '' : _c, _d = _b.actions, actions = _d === void 0 ? {} : _d, _e = _b.textAlign, textAlign = _e === void 0 ? 'center' : _e;
|
|
80
|
-
var _f = __read((0, utils_1.createNodes)(actions), 2), leftNodes = _f[0], rightNodes = _f[1];
|
|
81
|
-
leftNodes.sort(function (a, b) { return (a.order || 0) - (b.order || 0); });
|
|
82
|
-
rightNodes.sort(function (a, b) { return (a.order || 0) - (b.order || 0); });
|
|
83
|
-
return (react_1.default.createElement(Wrapper, __assign({}, other, { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-widget-header') }),
|
|
84
|
-
leftNodes.map(function (node, key) { return (react_1.default.createElement(node_1.default, __assign({ key: "".concat(node.type, "+_").concat(key) }, node))); }),
|
|
85
|
-
react_1.default.createElement(MainNode, { textAlign: textAlign, margin: (0, utils_1.calculateMargin)(leftNodes, rightNodes, textAlign) },
|
|
86
|
-
route ? (react_1.default.createElement(StyledLink, { routeName: route, title: tooltip, "aria-label": tooltip },
|
|
87
|
-
react_1.default.createElement(widget_ui_1.Typography, { variant: "h1" }, header))) : (react_1.default.createElement(widget_ui_1.Typography, { variant: "h1" }, header)),
|
|
88
|
-
tagline && react_1.default.createElement(Tagline, null, tagline)),
|
|
89
|
-
rightNodes.map(function (node, key) { return (react_1.default.createElement(node_1.default, __assign({ key: "".concat(node.type, "+_").concat(key) }, node))); })));
|
|
90
|
-
};
|
|
91
|
-
exports.default = WidgetHeader;
|
|
92
|
-
var Wrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n\n ", "\n\n p {\n color: ", ";\n margin: 0;\n }\n\n svg {\n line,\n path,\n circle {\n stroke: ", ";\n }\n }\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n\n ", "\n\n p {\n color: ", ";\n margin: 0;\n }\n\n svg {\n line,\n path,\n circle {\n stroke: ", ";\n }\n }\n"])), (0, widget_ui_1.headingElement)('h1', (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-size: ", ";\n margin: 0;\n font-weight: 300;\n color: ", ";\n "], ["\n font-size: ", ";\n margin: 0;\n font-weight: 300;\n color: ", ";\n "])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.huge; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; })), function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; });
|
|
93
|
-
var Tagline = styled_components_1.default.p(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 300;\n"], ["\n font-size: ", ";\n font-weight: 300;\n"])), function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; });
|
|
94
|
-
var MainNode = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n flex: 1;\n text-align: ", ";\n\n margin-right: ", ";\n margin-left: ", ";\n"], ["\n flex: 1;\n text-align: ", ";\n\n margin-right: ", ";\n margin-left: ", ";\n"])), function (p) { return p.textAlign; }, function (p) { return p.margin.right || 0; }, function (p) { return p.margin.left || 0; });
|
|
95
|
-
var StyledLink = (0, styled_components_1.default)(widget_ui_1.Link)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n text-decoration: none;\n &:focus {\n ", "\n }\n"], ["\n text-decoration: none;\n &:focus {\n ", "\n }\n"])), (0, widget_ui_1.headingElement)('h1', (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n ", ";\n "], ["\n ", ";\n "])), function (p) {
|
|
96
|
-
var _a;
|
|
97
|
-
return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n display: inline-block;\n "], ["\n ", "\n display: inline-block;\n "])), widget_ui_1.linkTabStyle);
|
|
98
|
-
})));
|
|
99
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
package/lib-esm/avatar.js
DELETED
|
@@ -1,52 +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 { SymbolBadge } from '@telia-ace/widget-ui';
|
|
28
|
-
import React from 'react';
|
|
29
|
-
import styled, { css } from 'styled-components';
|
|
30
|
-
var Avatar = function (_a) {
|
|
31
|
-
var node = _a.node;
|
|
32
|
-
if (!node.symbol) {
|
|
33
|
-
return null;
|
|
34
|
-
}
|
|
35
|
-
var size;
|
|
36
|
-
var isSvg = node.symbol.type === 'Svg';
|
|
37
|
-
if (node.symbol.type === 'Svg') {
|
|
38
|
-
var sizeNumber = parseInt(node.size, 10);
|
|
39
|
-
if (!isNaN(sizeNumber)) {
|
|
40
|
-
size = sizeNumber;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
return React.createElement(Wrapper, { symbol: node.symbol, svg: isSvg, size: size, backgroundSize: "cover" });
|
|
44
|
-
};
|
|
45
|
-
export default Avatar;
|
|
46
|
-
var Wrapper = styled(function (_a) {
|
|
47
|
-
var svg = _a.svg, other = __rest(_a, ["svg"]);
|
|
48
|
-
return React.createElement(SymbolBadge, __assign({}, other));
|
|
49
|
-
})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n color: ", ";\n ", "\n"], ["\n color: ", ";\n ", "\n"])), function (p) { var _a; return (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text; }, function (p) {
|
|
50
|
-
return !p.svg && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 50%;\n overflow: hidden;\n "], ["\n border-radius: 50%;\n overflow: hidden;\n "])));
|
|
51
|
-
});
|
|
52
|
-
var templateObject_1, templateObject_2;
|
package/lib-esm/back.js
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { SymbolBadge } from '@telia-ace/widget-ui';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
var Back = function (_a) {
|
|
4
|
-
var node = _a.node;
|
|
5
|
-
var symbol = node.symbol || { type: 'Svg', content: 'back' };
|
|
6
|
-
return React.createElement(SymbolBadge, { size: 20, symbol: symbol });
|
|
7
|
-
};
|
|
8
|
-
export default Back;
|
package/lib-esm/close.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { SymbolBadge } from '@telia-ace/widget-ui';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
var Close = function (_a) {
|
|
4
|
-
var node = _a.node;
|
|
5
|
-
var symbol = node.symbol || { type: 'Svg', content: 'close' };
|
|
6
|
-
var size = parseInt(node === null || node === void 0 ? void 0 : node.size, 10) || 14;
|
|
7
|
-
return React.createElement(SymbolBadge, { size: size, symbol: symbol });
|
|
8
|
-
};
|
|
9
|
-
export default Close;
|
package/lib-esm/index.js
DELETED
package/lib-esm/minimize.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { SymbolBadge } from '@telia-ace/widget-ui';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
var Minimize = function (_a) {
|
|
4
|
-
var node = _a.node;
|
|
5
|
-
var symbol = node.symbol || { type: 'Svg', content: 'minimize' };
|
|
6
|
-
var size = parseInt(node === null || node === void 0 ? void 0 : node.size, 10) || 20;
|
|
7
|
-
return React.createElement(SymbolBadge, { size: size, symbol: symbol });
|
|
8
|
-
};
|
|
9
|
-
export default Minimize;
|