@laerdal/life-react-components 2.3.1-dev.15.full → 2.3.1-dev.16
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.
|
@@ -16,7 +16,7 @@ var _reactRouter = require("react-router");
|
|
|
16
16
|
var _DropdownButton = _interopRequireDefault(require("../Dropdown/DropdownButton"));
|
|
17
17
|
var _styles2 = require("./styles");
|
|
18
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
-
var _excluded = ["items", "size", "homeIcon", "homeLabel", "homeUrl"];
|
|
19
|
+
var _excluded = ["items", "size", "homeIcon", "homeLabel", "lastItemAsLabel", "homeUrl"];
|
|
20
20
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
21
21
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
22
22
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
@@ -29,6 +29,8 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
29
29
|
homeIcon = _ref$homeIcon === void 0 ? true : _ref$homeIcon,
|
|
30
30
|
_ref$homeLabel = _ref.homeLabel,
|
|
31
31
|
homeLabel = _ref$homeLabel === void 0 ? 'Home' : _ref$homeLabel,
|
|
32
|
+
_ref$lastItemAsLabel = _ref.lastItemAsLabel,
|
|
33
|
+
lastItemAsLabel = _ref$lastItemAsLabel === void 0 ? false : _ref$lastItemAsLabel,
|
|
32
34
|
_ref$homeUrl = _ref.homeUrl,
|
|
33
35
|
homeUrl = _ref$homeUrl === void 0 ? '/' : _ref$homeUrl,
|
|
34
36
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
@@ -46,13 +48,28 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
46
48
|
var renderChevron = function renderChevron() {
|
|
47
49
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
48
50
|
"aria-hidden": "true",
|
|
49
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.
|
|
51
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.SystemIcons.ForwardSlash, {
|
|
50
52
|
className: "chevronicon",
|
|
51
53
|
color: _styles.COLORS.neutral_500,
|
|
52
54
|
size: chevronSize
|
|
53
55
|
})
|
|
54
56
|
});
|
|
55
57
|
};
|
|
58
|
+
var renderBreadcrumbLinkItem = function renderBreadcrumbLinkItem(index, item) {
|
|
59
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
60
|
+
children: [renderChevron(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
|
|
61
|
+
id: 'link-item-' + index,
|
|
62
|
+
onClick: function onClick(e) {
|
|
63
|
+
e.preventDefault();
|
|
64
|
+
navigateHook(item.url);
|
|
65
|
+
},
|
|
66
|
+
target: "_self",
|
|
67
|
+
variant: "default",
|
|
68
|
+
href: item.url,
|
|
69
|
+
children: item.label
|
|
70
|
+
})]
|
|
71
|
+
});
|
|
72
|
+
};
|
|
56
73
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles2.BreadcrumbContainer, _objectSpread(_objectSpread({
|
|
57
74
|
size: size,
|
|
58
75
|
"data-testid": 'breacrumbContainer'
|
|
@@ -88,35 +105,19 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
88
105
|
}),
|
|
89
106
|
onClick: navigate
|
|
90
107
|
})]
|
|
91
|
-
}) : /*#__PURE__*/(0, _jsxRuntime.
|
|
92
|
-
children:
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
children: [renderChevron(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HyperLink, {
|
|
105
|
-
id: 'link-item-' + (items.length - 2),
|
|
106
|
-
onClick: function onClick(e) {
|
|
107
|
-
e.preventDefault();
|
|
108
|
-
navigateHook(items[items.length - 2].url);
|
|
109
|
-
},
|
|
110
|
-
target: "_self",
|
|
111
|
-
variant: "default",
|
|
112
|
-
href: items[items.length - 2].url,
|
|
113
|
-
children: items[items.length - 2].label
|
|
114
|
-
})]
|
|
115
|
-
}), !!items && items.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
116
|
-
children: [renderChevron(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.LastBreadcrumbItem, {
|
|
117
|
-
size: size,
|
|
118
|
-
children: items[items.length - 1].label
|
|
119
|
-
})]
|
|
108
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
109
|
+
children: renderBreadcrumbLinkItem(items.length - 3, items[items.length - 3])
|
|
110
|
+
})), !!items && items.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
111
|
+
children: renderBreadcrumbLinkItem(items.length - 2, items[items.length - 2])
|
|
112
|
+
}), !!items && items.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
113
|
+
children: lastItemAsLabel ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
114
|
+
children: [renderChevron(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles2.LastBreadcrumbItem, {
|
|
115
|
+
size: size,
|
|
116
|
+
children: items[items.length - 1].label
|
|
117
|
+
})]
|
|
118
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
119
|
+
children: [renderBreadcrumbLinkItem(items.length - 1, items[items.length - 1]), renderChevron()]
|
|
120
|
+
})
|
|
120
121
|
})]
|
|
121
122
|
}));
|
|
122
123
|
};
|
|
@@ -124,7 +125,8 @@ Breadcrumb.propTypes = {
|
|
|
124
125
|
homeIcon: _propTypes.default.bool,
|
|
125
126
|
homeLabel: _propTypes.default.string,
|
|
126
127
|
homeUrl: _propTypes.default.string,
|
|
127
|
-
items: _propTypes.default.array
|
|
128
|
+
items: _propTypes.default.array,
|
|
129
|
+
lastItemAsLabel: _propTypes.default.bool
|
|
128
130
|
};
|
|
129
131
|
var _default = Breadcrumb;
|
|
130
132
|
exports.default = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumb.cjs","names":["Breadcrumb","items","size","Size","Small","homeIcon","homeLabel","homeUrl","rest","navigateHook","useNavigate","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","chevronSize","Medium","renderChevron","COLORS","neutral_500","e","preventDefault","neutral_600"],"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useNavigate } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from './BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\n\ntype BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({
|
|
1
|
+
{"version":3,"file":"Breadcrumb.cjs","names":["Breadcrumb","items","size","Size","Small","homeIcon","homeLabel","lastItemAsLabel","homeUrl","rest","navigateHook","useNavigate","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","chevronSize","Medium","renderChevron","COLORS","neutral_500","renderBreadcrumbLinkItem","index","item","e","preventDefault","neutral_600"],"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useNavigate } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from './BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\nimport internal from 'stream';\n\ntype BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n lastItemAsLabel?: boolean;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({\n items,\n size = Size.Small,\n homeIcon = true,\n homeLabel = 'Home',\n lastItemAsLabel = false,\n homeUrl = '/',\n ...rest\n}) => {\n const navigateHook = useNavigate();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map((x) => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => {\n navigateHook(links[0]);\n };\n\n const chevronSize = size == Size.Medium ? '24px' : size == Size.Small ? '20px' : '16px';\n const renderChevron = () => (\n <div aria-hidden=\"true\">\n <SystemIcons.ForwardSlash className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n </div>\n );\n const renderBreadcrumbLinkItem = (index: number, item: BreadcrumbItem) => {\n return (\n <>\n {renderChevron()}\n <HyperLink\n id={'link-item-' + index}\n onClick={(e) => {\n e.preventDefault();\n navigateHook(item.url);\n }}\n target=\"_self\"\n variant=\"default\"\n href={item.url}>\n {item.label}\n </HyperLink>\n </>\n );\n };\n\n return (\n <BreadcrumbContainer size={size} data-testid={'breacrumbContainer'} {...rest}>\n {homeIcon ? (\n <IconButton id=\"homeIcon\" variant=\"secondary\" shape=\"circular\" action={() => navigateHook(homeUrl)}>\n <SystemIcons.Home size={chevronSize} />\n </IconButton>\n ) : (\n <HyperLink\n id={'homelink'}\n variant=\"default\"\n href={homeUrl}\n onClick={(e) => {\n e.preventDefault();\n navigateHook(homeUrl);\n }}>\n {homeLabel}\n </HyperLink>\n )}\n\n {!!items &&\n items.length > 2 &&\n (items.length > 3 ? (\n <>\n {renderChevron()}\n <DropdownButton\n type={'icon'}\n alignLeft={true}\n items={dropdownItems}\n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate}\n />\n </>\n ) : (\n <>{renderBreadcrumbLinkItem(items.length - 3, items[items.length - 3])}</>\n ))}\n\n {!!items && items.length > 1 && <>{renderBreadcrumbLinkItem(items.length - 2, items[items.length - 2])}</>}\n\n {!!items && items.length > 0 && (\n <>\n {lastItemAsLabel ? (\n <>\n {renderChevron()}\n <LastBreadcrumbItem size={size}>{items[items.length - 1].label}</LastBreadcrumbItem>\n </>\n ) : (\n <>\n {renderBreadcrumbLinkItem(items.length - 1, items[items.length - 1])}\n {renderChevron()}\n </>\n )}\n </>\n )}\n </BreadcrumbContainer>\n );\n};\n\nexport default Breadcrumb;\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
3
|
import _pt from "prop-types";
|
|
4
|
-
var _excluded = ["items", "size", "homeIcon", "homeLabel", "homeUrl"];
|
|
4
|
+
var _excluded = ["items", "size", "homeIcon", "homeLabel", "lastItemAsLabel", "homeUrl"];
|
|
5
5
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
6
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
7
|
import * as React from 'react';
|
|
@@ -22,6 +22,8 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
22
22
|
homeIcon = _ref$homeIcon === void 0 ? true : _ref$homeIcon,
|
|
23
23
|
_ref$homeLabel = _ref.homeLabel,
|
|
24
24
|
homeLabel = _ref$homeLabel === void 0 ? 'Home' : _ref$homeLabel,
|
|
25
|
+
_ref$lastItemAsLabel = _ref.lastItemAsLabel,
|
|
26
|
+
lastItemAsLabel = _ref$lastItemAsLabel === void 0 ? false : _ref$lastItemAsLabel,
|
|
25
27
|
_ref$homeUrl = _ref.homeUrl,
|
|
26
28
|
homeUrl = _ref$homeUrl === void 0 ? '/' : _ref$homeUrl,
|
|
27
29
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
@@ -39,13 +41,28 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
39
41
|
var renderChevron = function renderChevron() {
|
|
40
42
|
return /*#__PURE__*/_jsx("div", {
|
|
41
43
|
"aria-hidden": "true",
|
|
42
|
-
children: /*#__PURE__*/_jsx(SystemIcons.
|
|
44
|
+
children: /*#__PURE__*/_jsx(SystemIcons.ForwardSlash, {
|
|
43
45
|
className: "chevronicon",
|
|
44
46
|
color: COLORS.neutral_500,
|
|
45
47
|
size: chevronSize
|
|
46
48
|
})
|
|
47
49
|
});
|
|
48
50
|
};
|
|
51
|
+
var renderBreadcrumbLinkItem = function renderBreadcrumbLinkItem(index, item) {
|
|
52
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
53
|
+
children: [renderChevron(), /*#__PURE__*/_jsx(HyperLink, {
|
|
54
|
+
id: 'link-item-' + index,
|
|
55
|
+
onClick: function onClick(e) {
|
|
56
|
+
e.preventDefault();
|
|
57
|
+
navigateHook(item.url);
|
|
58
|
+
},
|
|
59
|
+
target: "_self",
|
|
60
|
+
variant: "default",
|
|
61
|
+
href: item.url,
|
|
62
|
+
children: item.label
|
|
63
|
+
})]
|
|
64
|
+
});
|
|
65
|
+
};
|
|
49
66
|
return /*#__PURE__*/_jsxs(BreadcrumbContainer, _objectSpread(_objectSpread({
|
|
50
67
|
size: size,
|
|
51
68
|
"data-testid": 'breacrumbContainer'
|
|
@@ -81,35 +98,19 @@ var Breadcrumb = function Breadcrumb(_ref) {
|
|
|
81
98
|
}),
|
|
82
99
|
onClick: navigate
|
|
83
100
|
})]
|
|
84
|
-
}) : /*#__PURE__*/
|
|
85
|
-
children:
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
children: [renderChevron(), /*#__PURE__*/_jsx(HyperLink, {
|
|
98
|
-
id: 'link-item-' + (items.length - 2),
|
|
99
|
-
onClick: function onClick(e) {
|
|
100
|
-
e.preventDefault();
|
|
101
|
-
navigateHook(items[items.length - 2].url);
|
|
102
|
-
},
|
|
103
|
-
target: "_self",
|
|
104
|
-
variant: "default",
|
|
105
|
-
href: items[items.length - 2].url,
|
|
106
|
-
children: items[items.length - 2].label
|
|
107
|
-
})]
|
|
108
|
-
}), !!items && items.length > 0 && /*#__PURE__*/_jsxs(_Fragment, {
|
|
109
|
-
children: [renderChevron(), /*#__PURE__*/_jsx(LastBreadcrumbItem, {
|
|
110
|
-
size: size,
|
|
111
|
-
children: items[items.length - 1].label
|
|
112
|
-
})]
|
|
101
|
+
}) : /*#__PURE__*/_jsx(_Fragment, {
|
|
102
|
+
children: renderBreadcrumbLinkItem(items.length - 3, items[items.length - 3])
|
|
103
|
+
})), !!items && items.length > 1 && /*#__PURE__*/_jsx(_Fragment, {
|
|
104
|
+
children: renderBreadcrumbLinkItem(items.length - 2, items[items.length - 2])
|
|
105
|
+
}), !!items && items.length > 0 && /*#__PURE__*/_jsx(_Fragment, {
|
|
106
|
+
children: lastItemAsLabel ? /*#__PURE__*/_jsxs(_Fragment, {
|
|
107
|
+
children: [renderChevron(), /*#__PURE__*/_jsx(LastBreadcrumbItem, {
|
|
108
|
+
size: size,
|
|
109
|
+
children: items[items.length - 1].label
|
|
110
|
+
})]
|
|
111
|
+
}) : /*#__PURE__*/_jsxs(_Fragment, {
|
|
112
|
+
children: [renderBreadcrumbLinkItem(items.length - 1, items[items.length - 1]), renderChevron()]
|
|
113
|
+
})
|
|
113
114
|
})]
|
|
114
115
|
}));
|
|
115
116
|
};
|
|
@@ -117,7 +118,8 @@ Breadcrumb.propTypes = {
|
|
|
117
118
|
homeIcon: _pt.bool,
|
|
118
119
|
homeLabel: _pt.string,
|
|
119
120
|
homeUrl: _pt.string,
|
|
120
|
-
items: _pt.array
|
|
121
|
+
items: _pt.array,
|
|
122
|
+
lastItemAsLabel: _pt.bool
|
|
121
123
|
};
|
|
122
124
|
export default Breadcrumb;
|
|
123
125
|
//# sourceMappingURL=Breadcrumb.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumb.js","names":["React","COLORS","Size","SystemIcons","useNavigate","HyperLink","IconButton","DropdownButton","BreadcrumbContainer","LastBreadcrumbItem","Breadcrumb","items","size","Small","homeIcon","homeLabel","homeUrl","rest","navigateHook","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","chevronSize","Medium","renderChevron","neutral_500","e","preventDefault","neutral_600"],"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useNavigate } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from './BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\n\ntype BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({
|
|
1
|
+
{"version":3,"file":"Breadcrumb.js","names":["React","COLORS","Size","SystemIcons","useNavigate","HyperLink","IconButton","DropdownButton","BreadcrumbContainer","LastBreadcrumbItem","Breadcrumb","items","size","Small","homeIcon","homeLabel","lastItemAsLabel","homeUrl","rest","navigateHook","dropdownItems","slice","length","map","x","value","url","displayLabel","label","navigate","links","chevronSize","Medium","renderChevron","neutral_500","renderBreadcrumbLinkItem","index","item","e","preventDefault","neutral_600"],"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { COLORS } from '../styles';\nimport { Size, SystemIcons } from '..';\nimport { useNavigate } from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport { BreadcrumbItem } from './BreadcrumbItem';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport { BreadcrumbContainer, LastBreadcrumbItem } from './styles';\nimport internal from 'stream';\n\ntype BreadcrumbProps = React.HTMLAttributes<HTMLDivElement> & {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n lastItemAsLabel?: boolean;\n};\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({\n items,\n size = Size.Small,\n homeIcon = true,\n homeLabel = 'Home',\n lastItemAsLabel = false,\n homeUrl = '/',\n ...rest\n}) => {\n const navigateHook = useNavigate();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map((x) => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => {\n navigateHook(links[0]);\n };\n\n const chevronSize = size == Size.Medium ? '24px' : size == Size.Small ? '20px' : '16px';\n const renderChevron = () => (\n <div aria-hidden=\"true\">\n <SystemIcons.ForwardSlash className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n </div>\n );\n const renderBreadcrumbLinkItem = (index: number, item: BreadcrumbItem) => {\n return (\n <>\n {renderChevron()}\n <HyperLink\n id={'link-item-' + index}\n onClick={(e) => {\n e.preventDefault();\n navigateHook(item.url);\n }}\n target=\"_self\"\n variant=\"default\"\n href={item.url}>\n {item.label}\n </HyperLink>\n </>\n );\n };\n\n return (\n <BreadcrumbContainer size={size} data-testid={'breacrumbContainer'} {...rest}>\n {homeIcon ? (\n <IconButton id=\"homeIcon\" variant=\"secondary\" shape=\"circular\" action={() => navigateHook(homeUrl)}>\n <SystemIcons.Home size={chevronSize} />\n </IconButton>\n ) : (\n <HyperLink\n id={'homelink'}\n variant=\"default\"\n href={homeUrl}\n onClick={(e) => {\n e.preventDefault();\n navigateHook(homeUrl);\n }}>\n {homeLabel}\n </HyperLink>\n )}\n\n {!!items &&\n items.length > 2 &&\n (items.length > 3 ? (\n <>\n {renderChevron()}\n <DropdownButton\n type={'icon'}\n alignLeft={true}\n items={dropdownItems}\n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate}\n />\n </>\n ) : (\n <>{renderBreadcrumbLinkItem(items.length - 3, items[items.length - 3])}</>\n ))}\n\n {!!items && items.length > 1 && <>{renderBreadcrumbLinkItem(items.length - 2, items[items.length - 2])}</>}\n\n {!!items && items.length > 0 && (\n <>\n {lastItemAsLabel ? (\n <>\n {renderChevron()}\n <LastBreadcrumbItem size={size}>{items[items.length - 1].label}</LastBreadcrumbItem>\n </>\n ) : (\n <>\n {renderBreadcrumbLinkItem(items.length - 1, items[items.length - 1])}\n {renderChevron()}\n </>\n )}\n </>\n )}\n </BreadcrumbContainer>\n );\n};\n\nexport default Breadcrumb;\n"],"mappings":"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"}
|