@semcore/breadcrumbs 5.49.2-prerelease.0 → 5.50.0-prerelease.0
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/CHANGELOG.md +6 -0
- package/lib/cjs/Breadcrumbs.js +48 -64
- package/lib/cjs/Breadcrumbs.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/index.js +1 -1
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/breadcrumbs.shadow.css +7 -18
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js +4 -5
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/es6/Breadcrumbs.js +47 -60
- package/lib/es6/Breadcrumbs.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/breadcrumbs.shadow.css +7 -18
- package/lib/es6/translations/__intergalactic-dynamic-locales.js +2 -2
- package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/esm/Breadcrumbs.mjs +42 -57
- package/lib/esm/style/breadcrumbs.shadow.css +7 -18
- package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +2 -2
- package/lib/types/index.d.ts +15 -15
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [5.50.0] - 2026-05-06
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version minor update due to children dependencies update (`@semcore/utils` [4.48.5 ~> 4.49.0]).
|
|
10
|
+
|
|
5
11
|
## [5.49.2] - 2025-05-13
|
|
6
12
|
|
|
7
13
|
### Changed
|
package/lib/cjs/Breadcrumbs.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
@@ -9,37 +8,34 @@ exports["default"] = void 0;
|
|
|
9
8
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
10
9
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
10
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
+
var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
|
|
12
12
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
13
|
-
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
14
13
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
-
var
|
|
16
|
-
var
|
|
17
|
-
var
|
|
18
|
-
var _flexBox = require("@semcore/flex-box");
|
|
14
|
+
var _core = require("@semcore/core");
|
|
15
|
+
var _baseComponents = require("@semcore/base-components");
|
|
16
|
+
var _i18nEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/i18nEnhance"));
|
|
19
17
|
var _m = _interopRequireDefault(require("@semcore/icon/ChevronRight/m"));
|
|
20
|
-
var
|
|
18
|
+
var _typography = require("@semcore/typography");
|
|
19
|
+
var _react = _interopRequireDefault(require("react"));
|
|
21
20
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
22
|
-
var _i18nEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/i18nEnhance"));
|
|
23
21
|
/*!__reshadow-styles__:"./style/breadcrumbs.shadow.css"*/
|
|
24
|
-
var style = (
|
|
22
|
+
var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SBreadcrumbs_lllrq_gg_{display:flex;align-items:center;padding:0;margin:0}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_{display:contents;list-style:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{margin:0 var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385));display:flex}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, color(display-p3 0.0036 0.02041 0.00996 / 0.385))}}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_:last-child{display:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_{overflow:hidden;padding:4px;margin:-4px}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{width:100%;display:block;position:relative;font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));-webkit-text-decoration:none;text-decoration:none;cursor:pointer}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));cursor:default}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}", /*__inner_css_end__*/"lllrq_gg_"),
|
|
25
23
|
/*__reshadow_css_end__*/
|
|
26
24
|
{
|
|
27
|
-
"__SBreadcrumbs": "
|
|
28
|
-
"__SListContainer": "
|
|
29
|
-
"__SSeparator": "
|
|
30
|
-
"__SListItem": "
|
|
31
|
-
"__SBreadcrumbsItem": "
|
|
32
|
-
"
|
|
33
|
-
"_active": "__active_iwoiw_gg_"
|
|
25
|
+
"__SBreadcrumbs": "___SBreadcrumbs_lllrq_gg_",
|
|
26
|
+
"__SListContainer": "___SListContainer_lllrq_gg_",
|
|
27
|
+
"__SSeparator": "___SSeparator_lllrq_gg_",
|
|
28
|
+
"__SListItem": "___SListItem_lllrq_gg_",
|
|
29
|
+
"__SBreadcrumbsItem": "___SBreadcrumbsItem_lllrq_gg_",
|
|
30
|
+
"_active": "__active_lllrq_gg_"
|
|
34
31
|
});
|
|
35
32
|
var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
36
|
-
(0, _inherits2["default"])(Breadcrumbs, _Component);
|
|
37
|
-
var _super = (0, _createSuper2["default"])(Breadcrumbs);
|
|
38
33
|
function Breadcrumbs() {
|
|
39
34
|
(0, _classCallCheck2["default"])(this, Breadcrumbs);
|
|
40
|
-
return
|
|
35
|
+
return (0, _callSuper2["default"])(this, Breadcrumbs, arguments);
|
|
41
36
|
}
|
|
42
|
-
(0,
|
|
37
|
+
(0, _inherits2["default"])(Breadcrumbs, _Component);
|
|
38
|
+
return (0, _createClass2["default"])(Breadcrumbs, [{
|
|
43
39
|
key: "getItemProps",
|
|
44
40
|
value: function getItemProps() {
|
|
45
41
|
var _this$asProps = this.asProps,
|
|
@@ -55,7 +51,7 @@ var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
|
55
51
|
value: function render() {
|
|
56
52
|
var _ref = this.asProps,
|
|
57
53
|
_ref3;
|
|
58
|
-
var SBreadcrumbs =
|
|
54
|
+
var SBreadcrumbs = _baseComponents.Box;
|
|
59
55
|
var SListContainer = 'ol';
|
|
60
56
|
var _this$asProps2 = this.asProps,
|
|
61
57
|
styles = _this$asProps2.styles,
|
|
@@ -66,7 +62,6 @@ var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
|
66
62
|
}, _ref))), /*#__PURE__*/_react["default"].createElement(SListContainer, _ref3.cn("SListContainer", {}), /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {}))));
|
|
67
63
|
}
|
|
68
64
|
}]);
|
|
69
|
-
return Breadcrumbs;
|
|
70
65
|
}(_core.Component);
|
|
71
66
|
(0, _defineProperty2["default"])(Breadcrumbs, "displayName", 'Breadcrumbs');
|
|
72
67
|
(0, _defineProperty2["default"])(Breadcrumbs, "style", style);
|
|
@@ -77,48 +72,37 @@ var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
|
77
72
|
i18n: _intergalacticDynamicLocales.localizedMessages,
|
|
78
73
|
locale: 'en'
|
|
79
74
|
});
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
"aria-current": active ? 'page' : undefined,
|
|
107
|
-
"use:tag": active ? 'span' : tag
|
|
108
|
-
}, _ref2))))), /*#__PURE__*/_react["default"].createElement(SSeparator, _ref4.cn("SSeparator", {
|
|
109
|
-
"aria-hidden": 'true'
|
|
110
|
-
}), separator));
|
|
111
|
-
}
|
|
112
|
-
}]);
|
|
113
|
-
return Item;
|
|
114
|
-
}(_core.Component);
|
|
115
|
-
(0, _defineProperty2["default"])(Item, "defaultProps", {
|
|
75
|
+
function Item(props) {
|
|
76
|
+
var _ref2 = arguments[0],
|
|
77
|
+
_ref4;
|
|
78
|
+
var SBreadcrumbsItem = _typography.Text;
|
|
79
|
+
var styles = props.styles,
|
|
80
|
+
separator = props.separator,
|
|
81
|
+
active = props.active,
|
|
82
|
+
disabled = props.disabled,
|
|
83
|
+
href = props.href,
|
|
84
|
+
tabIndex = props.tabIndex,
|
|
85
|
+
tag = props.tag,
|
|
86
|
+
_props$ellipsis = props.ellipsis,
|
|
87
|
+
ellipsis = _props$ellipsis === void 0 ? true : _props$ellipsis;
|
|
88
|
+
var SSeparator = 'div';
|
|
89
|
+
var SListItem = 'li';
|
|
90
|
+
return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(SListItem, _ref4.cn("SListItem", {}), /*#__PURE__*/_react["default"].createElement(SBreadcrumbsItem, _ref4.cn("SBreadcrumbsItem", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
|
91
|
+
"use:tabIndex": active || disabled ? -1 : tabIndex,
|
|
92
|
+
"use:href": !active && !disabled ? href : undefined,
|
|
93
|
+
"aria-current": active ? 'page' : undefined,
|
|
94
|
+
"use:tag": active ? 'span' : tag,
|
|
95
|
+
"ellipsis": ellipsis
|
|
96
|
+
}, _ref2))))), /*#__PURE__*/_react["default"].createElement(SSeparator, _ref4.cn("SSeparator", {
|
|
97
|
+
"aria-hidden": 'true'
|
|
98
|
+
}), separator));
|
|
99
|
+
}
|
|
100
|
+
Item.defaultProps = {
|
|
116
101
|
tag: 'a',
|
|
117
|
-
locale: 'en'
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
var _default = (0, _core
|
|
102
|
+
locale: 'en',
|
|
103
|
+
tabIndex: 0
|
|
104
|
+
};
|
|
105
|
+
var _default = exports["default"] = (0, _core.createComponent)(Breadcrumbs, {
|
|
121
106
|
Item: Item
|
|
122
107
|
});
|
|
123
|
-
exports["default"] = _default;
|
|
124
108
|
//# sourceMappingURL=Breadcrumbs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.js","names":["_core","
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.js","names":["_core","require","_baseComponents","_i18nEnhance","_interopRequireDefault","_m","_typography","_react","_intergalacticDynamicLocales","style","sstyled","insert","Breadcrumbs","_Component","_classCallCheck2","_callSuper2","arguments","_inherits2","_createClass2","key","value","getItemProps","_this$asProps","asProps","separator","locale","render","_ref","_ref3","SBreadcrumbs","Box","SListContainer","_this$asProps2","styles","getI18nText","Children","createElement","cn","_objectSpread2","assignProps","Component","_defineProperty2","i18nEnhance","localizedMessages","tag","i18n","Item","props","_ref2","arguments[0]","_ref4","SBreadcrumbsItem","Text","active","disabled","href","tabIndex","_props$ellipsis","ellipsis","SSeparator","SListItem","Fragment","undefined","defaultProps","_default","exports","createComponent"],"sources":["../../src/Breadcrumbs.jsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport SSeparator from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/breadcrumbs.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass Breadcrumbs extends Component {\n static displayName = 'Breadcrumbs';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages)];\n static defaultProps = {\n separator: <SSeparator />,\n tag: 'nav',\n i18n: localizedMessages,\n locale: 'en',\n };\n\n getItemProps() {\n const { separator, locale } = this.asProps;\n return {\n separator,\n locale,\n };\n }\n\n render() {\n const SBreadcrumbs = Root;\n const SListContainer = 'ol';\n const { styles, getI18nText, Children } = this.asProps;\n return sstyled(styles)(\n <SBreadcrumbs render={Box} aria-label={getI18nText('breadcrumbs')}>\n <SListContainer>\n <Children />\n </SListContainer>\n </SBreadcrumbs>,\n );\n }\n}\n\nfunction Item(props) {\n const SBreadcrumbsItem = Root;\n const { styles, separator, active, disabled, href, tabIndex, tag, ellipsis = true } = props;\n const SSeparator = 'div';\n const SListItem = 'li';\n\n return sstyled(styles)(\n <>\n <SListItem>\n <SBreadcrumbsItem\n render={Text}\n use:tabIndex={active || disabled ? -1 : tabIndex}\n use:href={!active && !disabled ? href : undefined}\n aria-current={active ? 'page' : undefined}\n use:tag={active ? 'span' : tag}\n ellipsis={ellipsis}\n />\n </SListItem>\n <SSeparator aria-hidden='true'>{separator}</SSeparator>\n </>,\n );\n}\nItem.defaultProps = {\n tag: 'a',\n locale: 'en',\n tabIndex: 0,\n};\n\nexport default createComponent(Breadcrumbs, {\n Item,\n});\n"],"mappings":"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","ignoreList":[]}
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { EllipsisSettings, SimpleHintPopperProps, BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { NSText } from '@semcore/typography';\n\nexport type BreadcrumbsProps = BoxProps & {\n /**\n * Links divider\n * */\n separator?: React.ReactNode;\n /** Specifies the locale for i18n support */\n locale?: string;\n};\n\nexport type BreadcrumbsItemProps = BoxProps & {\n /** The property is responsible for the activity of the element */\n active?: boolean;\n /** Specifies the locale for i18n support */\n locale?: string;\n /**\n * Ellipsis settings. You shouldn't use `cropPosition: middle` for breadcrumbs.\n * If you're sure you need `cropPosition: middle`, set `w` to Breadcrumbs.Item manually, for correct Ellipsis calculations.\n * @default false\n */\n} & NSText.HintProps & NSText.EllipsisProps;\n\nexport type BreadcrumbsContext = BreadcrumbsProps & {\n getItemProps: PropGetterFn;\n};\n\ndeclare const Breadcrumbs: Intergalactic.Component<'div', BreadcrumbsProps, BreadcrumbsContext> & {\n Item: Intergalactic.Component<'a', BreadcrumbsItemProps>;\n};\n\nexport default Breadcrumbs;\n"],"mappings":"","ignoreList":[]}
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Breadcrumbs","_interopRequireDefault","require"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Breadcrumbs';\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Breadcrumbs","_interopRequireDefault","require"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Breadcrumbs';\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA","ignoreList":[]}
|
|
@@ -7,13 +7,10 @@ SBreadcrumbs {
|
|
|
7
7
|
SListContainer {
|
|
8
8
|
display: contents;
|
|
9
9
|
list-style: none;
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
margin: 0;
|
|
12
|
-
padding: 0;
|
|
13
10
|
|
|
14
11
|
SSeparator {
|
|
15
12
|
margin: 0 var(--intergalactic-spacing-2x, 8px);
|
|
16
|
-
color: var(--intergalactic-icon-secondary-neutral,
|
|
13
|
+
color: var(--intergalactic-icon-secondary-neutral, oklch(0.104 0.023 162.3 / 0.385));
|
|
17
14
|
display: flex;
|
|
18
15
|
|
|
19
16
|
&:last-child {
|
|
@@ -24,9 +21,9 @@ SBreadcrumbs {
|
|
|
24
21
|
SListItem {
|
|
25
22
|
overflow: hidden;
|
|
26
23
|
|
|
27
|
-
/* we need this hack to show
|
|
28
|
-
padding:
|
|
29
|
-
margin: -
|
|
24
|
+
/* we need this hack to show outline over `overflow: hidden` element */
|
|
25
|
+
padding: 4px;
|
|
26
|
+
margin: -4px;
|
|
30
27
|
|
|
31
28
|
SBreadcrumbsItem {
|
|
32
29
|
width: 100%;
|
|
@@ -34,26 +31,18 @@ SBreadcrumbs {
|
|
|
34
31
|
position: relative;
|
|
35
32
|
font-size: var(--intergalactic-fs-200, 14px);
|
|
36
33
|
line-height: var(--intergalactic-lh-200, 142%);
|
|
37
|
-
color: var(--intergalactic-text-secondary,
|
|
34
|
+
color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
|
|
38
35
|
text-decoration: none;
|
|
39
36
|
cursor: pointer;
|
|
40
|
-
text-overflow: ellipsis;
|
|
41
|
-
white-space: nowrap;
|
|
42
|
-
overflow: hidden;
|
|
43
37
|
|
|
44
38
|
&:hover {
|
|
45
39
|
text-decoration: underline;
|
|
46
|
-
color: var(--intergalactic-text-primary,
|
|
40
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
47
41
|
}
|
|
48
42
|
}
|
|
49
43
|
|
|
50
|
-
SBreadcrumbsItem[keyboardFocused] {
|
|
51
|
-
outline: none;
|
|
52
|
-
box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
|
|
53
|
-
}
|
|
54
|
-
|
|
55
44
|
SBreadcrumbsItem[active] {
|
|
56
|
-
color: var(--intergalactic-text-primary,
|
|
45
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
57
46
|
cursor: default;
|
|
58
47
|
&:hover {
|
|
59
48
|
text-decoration: none;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
@@ -13,13 +13,13 @@ var _it = _interopRequireDefault(require("./it.json"));
|
|
|
13
13
|
var _ja = _interopRequireDefault(require("./ja.json"));
|
|
14
14
|
var _ko = _interopRequireDefault(require("./ko.json"));
|
|
15
15
|
var _nl = _interopRequireDefault(require("./nl.json"));
|
|
16
|
+
var _pl = _interopRequireDefault(require("./pl.json"));
|
|
16
17
|
var _pt = _interopRequireDefault(require("./pt.json"));
|
|
18
|
+
var _sv = _interopRequireDefault(require("./sv.json"));
|
|
17
19
|
var _tr = _interopRequireDefault(require("./tr.json"));
|
|
18
20
|
var _vi = _interopRequireDefault(require("./vi.json"));
|
|
19
21
|
var _zh = _interopRequireDefault(require("./zh.json"));
|
|
20
|
-
var
|
|
21
|
-
var _sv = _interopRequireDefault(require("./sv.json"));
|
|
22
|
-
var localizedMessages = {
|
|
22
|
+
var localizedMessages = exports.localizedMessages = {
|
|
23
23
|
de: _de["default"],
|
|
24
24
|
en: _en["default"],
|
|
25
25
|
es: _es["default"],
|
|
@@ -35,5 +35,4 @@ var localizedMessages = {
|
|
|
35
35
|
pl: _pl["default"],
|
|
36
36
|
sv: _sv["default"]
|
|
37
37
|
};
|
|
38
|
-
exports.localizedMessages = localizedMessages;
|
|
39
38
|
//# sourceMappingURL=__intergalactic-dynamic-locales.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["_de","_interopRequireDefault","require","_en","_es","_fr","_it","_ja","_ko","_nl","_pt","_tr","_vi","_zh","
|
|
1
|
+
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["_de","_interopRequireDefault","require","_en","_es","_fr","_it","_ja","_ko","_nl","_pl","_pt","_sv","_tr","_vi","_zh","localizedMessages","exports","de","en","es","fr","it","ja","ko","nl","pt","tr","vi","zh","pl","sv"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pl from './pl.json';\nimport pt from './pt.json';\nimport sv from './sv.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\n\nexport const localizedMessages = {\n de,\n en,\n es,\n fr,\n it,\n ja,\n ko,\n nl,\n pt,\n tr,\n vi,\n zh,\n pl,\n sv,\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,GAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,GAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,GAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,GAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,GAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,GAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,GAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,GAAA,GAAAR,sBAAA,CAAAC,OAAA;AACA,IAAAQ,GAAA,GAAAT,sBAAA,CAAAC,OAAA;AACA,IAAAS,GAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,GAAA,GAAAX,sBAAA,CAAAC,OAAA;AACA,IAAAW,GAAA,GAAAZ,sBAAA,CAAAC,OAAA;AACA,IAAAY,GAAA,GAAAb,sBAAA,CAAAC,OAAA;AACA,IAAAa,GAAA,GAAAd,sBAAA,CAAAC,OAAA;AAEO,IAAMc,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG;EAC/BE,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA;AACF,CAAC","ignoreList":[]}
|
package/lib/es6/Breadcrumbs.js
CHANGED
|
@@ -1,39 +1,37 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
|
2
2
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
3
3
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
4
|
+
import _callSuper from "@babel/runtime/helpers/callSuper";
|
|
4
5
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
5
|
-
import _createSuper from "@babel/runtime/helpers/createSuper";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
7
|
-
import { sstyled as _sstyled } from "@semcore/
|
|
7
|
+
import { sstyled as _sstyled } from "@semcore/core";
|
|
8
8
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
9
9
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
10
|
-
import
|
|
11
|
-
import createComponent,
|
|
12
|
-
import
|
|
10
|
+
import { Box } from '@semcore/base-components';
|
|
11
|
+
import { createComponent, Component, sstyled, Root } from '@semcore/core';
|
|
12
|
+
import i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';
|
|
13
13
|
import SSeparator from '@semcore/icon/ChevronRight/m';
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
|
|
14
|
+
import { Text } from '@semcore/typography';
|
|
15
|
+
import React from 'react';
|
|
17
16
|
/*!__reshadow-styles__:"./style/breadcrumbs.shadow.css"*/
|
|
18
|
-
var style = (
|
|
17
|
+
var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SBreadcrumbs_lllrq_gg_{display:flex;align-items:center;padding:0;margin:0}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_{display:contents;list-style:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{margin:0 var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385));display:flex}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, color(display-p3 0.0036 0.02041 0.00996 / 0.385))}}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_:last-child{display:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_{overflow:hidden;padding:4px;margin:-4px}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{width:100%;display:block;position:relative;font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));-webkit-text-decoration:none;text-decoration:none;cursor:pointer}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));cursor:default}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}", /*__inner_css_end__*/"lllrq_gg_"),
|
|
19
18
|
/*__reshadow_css_end__*/
|
|
20
19
|
{
|
|
21
|
-
"__SBreadcrumbs": "
|
|
22
|
-
"__SListContainer": "
|
|
23
|
-
"__SSeparator": "
|
|
24
|
-
"__SListItem": "
|
|
25
|
-
"__SBreadcrumbsItem": "
|
|
26
|
-
"
|
|
27
|
-
"_active": "__active_iwoiw_gg_"
|
|
20
|
+
"__SBreadcrumbs": "___SBreadcrumbs_lllrq_gg_",
|
|
21
|
+
"__SListContainer": "___SListContainer_lllrq_gg_",
|
|
22
|
+
"__SSeparator": "___SSeparator_lllrq_gg_",
|
|
23
|
+
"__SListItem": "___SListItem_lllrq_gg_",
|
|
24
|
+
"__SBreadcrumbsItem": "___SBreadcrumbsItem_lllrq_gg_",
|
|
25
|
+
"_active": "__active_lllrq_gg_"
|
|
28
26
|
});
|
|
27
|
+
import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
|
|
29
28
|
var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
30
|
-
_inherits(Breadcrumbs, _Component);
|
|
31
|
-
var _super = _createSuper(Breadcrumbs);
|
|
32
29
|
function Breadcrumbs() {
|
|
33
30
|
_classCallCheck(this, Breadcrumbs);
|
|
34
|
-
return
|
|
31
|
+
return _callSuper(this, Breadcrumbs, arguments);
|
|
35
32
|
}
|
|
36
|
-
|
|
33
|
+
_inherits(Breadcrumbs, _Component);
|
|
34
|
+
return _createClass(Breadcrumbs, [{
|
|
37
35
|
key: "getItemProps",
|
|
38
36
|
value: function getItemProps() {
|
|
39
37
|
var _this$asProps = this.asProps,
|
|
@@ -60,7 +58,6 @@ var Breadcrumbs = /*#__PURE__*/function (_Component) {
|
|
|
60
58
|
}, _ref))), /*#__PURE__*/React.createElement(SListContainer, _ref3.cn("SListContainer", {}), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))));
|
|
61
59
|
}
|
|
62
60
|
}]);
|
|
63
|
-
return Breadcrumbs;
|
|
64
61
|
}(Component);
|
|
65
62
|
_defineProperty(Breadcrumbs, "displayName", 'Breadcrumbs');
|
|
66
63
|
_defineProperty(Breadcrumbs, "style", style);
|
|
@@ -71,46 +68,36 @@ _defineProperty(Breadcrumbs, "defaultProps", {
|
|
|
71
68
|
i18n: localizedMessages,
|
|
72
69
|
locale: 'en'
|
|
73
70
|
});
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
"aria-current": active ? 'page' : undefined,
|
|
101
|
-
"use:tag": active ? 'span' : tag
|
|
102
|
-
}, _ref2))))), /*#__PURE__*/React.createElement(SSeparator, _ref4.cn("SSeparator", {
|
|
103
|
-
"aria-hidden": 'true'
|
|
104
|
-
}), separator));
|
|
105
|
-
}
|
|
106
|
-
}]);
|
|
107
|
-
return Item;
|
|
108
|
-
}(Component);
|
|
109
|
-
_defineProperty(Item, "defaultProps", {
|
|
71
|
+
function Item(props) {
|
|
72
|
+
var _ref2 = arguments[0],
|
|
73
|
+
_ref4;
|
|
74
|
+
var SBreadcrumbsItem = Text;
|
|
75
|
+
var styles = props.styles,
|
|
76
|
+
separator = props.separator,
|
|
77
|
+
active = props.active,
|
|
78
|
+
disabled = props.disabled,
|
|
79
|
+
href = props.href,
|
|
80
|
+
tabIndex = props.tabIndex,
|
|
81
|
+
tag = props.tag,
|
|
82
|
+
_props$ellipsis = props.ellipsis,
|
|
83
|
+
ellipsis = _props$ellipsis === void 0 ? true : _props$ellipsis;
|
|
84
|
+
var SSeparator = 'div';
|
|
85
|
+
var SListItem = 'li';
|
|
86
|
+
return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SListItem, _ref4.cn("SListItem", {}), /*#__PURE__*/React.createElement(SBreadcrumbsItem, _ref4.cn("SBreadcrumbsItem", _objectSpread({}, _assignProps2({
|
|
87
|
+
"use:tabIndex": active || disabled ? -1 : tabIndex,
|
|
88
|
+
"use:href": !active && !disabled ? href : undefined,
|
|
89
|
+
"aria-current": active ? 'page' : undefined,
|
|
90
|
+
"use:tag": active ? 'span' : tag,
|
|
91
|
+
"ellipsis": ellipsis
|
|
92
|
+
}, _ref2))))), /*#__PURE__*/React.createElement(SSeparator, _ref4.cn("SSeparator", {
|
|
93
|
+
"aria-hidden": 'true'
|
|
94
|
+
}), separator));
|
|
95
|
+
}
|
|
96
|
+
Item.defaultProps = {
|
|
110
97
|
tag: 'a',
|
|
111
|
-
locale: 'en'
|
|
112
|
-
|
|
113
|
-
|
|
98
|
+
locale: 'en',
|
|
99
|
+
tabIndex: 0
|
|
100
|
+
};
|
|
114
101
|
export default createComponent(Breadcrumbs, {
|
|
115
102
|
Item: Item
|
|
116
103
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.js","names":["
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.js","names":["Box","createComponent","Component","sstyled","Root","i18nEnhance","SSeparator","Text","React","style","_sstyled","insert","localizedMessages","Breadcrumbs","_Component","_classCallCheck","_callSuper","arguments","_inherits","_createClass","key","value","getItemProps","_this$asProps","asProps","separator","locale","render","_ref","_ref3","SBreadcrumbs","SListContainer","_this$asProps2","styles","getI18nText","Children","createElement","cn","_objectSpread","_assignProps","_defineProperty","tag","i18n","Item","props","_ref2","arguments[0]","_ref4","SBreadcrumbsItem","active","disabled","href","tabIndex","_props$ellipsis","ellipsis","SListItem","Fragment","_assignProps2","undefined","defaultProps"],"sources":["../../src/Breadcrumbs.jsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport SSeparator from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/breadcrumbs.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass Breadcrumbs extends Component {\n static displayName = 'Breadcrumbs';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages)];\n static defaultProps = {\n separator: <SSeparator />,\n tag: 'nav',\n i18n: localizedMessages,\n locale: 'en',\n };\n\n getItemProps() {\n const { separator, locale } = this.asProps;\n return {\n separator,\n locale,\n };\n }\n\n render() {\n const SBreadcrumbs = Root;\n const SListContainer = 'ol';\n const { styles, getI18nText, Children } = this.asProps;\n return sstyled(styles)(\n <SBreadcrumbs render={Box} aria-label={getI18nText('breadcrumbs')}>\n <SListContainer>\n <Children />\n </SListContainer>\n </SBreadcrumbs>,\n );\n }\n}\n\nfunction Item(props) {\n const SBreadcrumbsItem = Root;\n const { styles, separator, active, disabled, href, tabIndex, tag, ellipsis = true } = props;\n const SSeparator = 'div';\n const SListItem = 'li';\n\n return sstyled(styles)(\n <>\n <SListItem>\n <SBreadcrumbsItem\n render={Text}\n use:tabIndex={active || disabled ? -1 : tabIndex}\n use:href={!active && !disabled ? href : undefined}\n aria-current={active ? 'page' : undefined}\n use:tag={active ? 'span' : tag}\n ellipsis={ellipsis}\n />\n </SListItem>\n <SSeparator aria-hidden='true'>{separator}</SSeparator>\n </>,\n );\n}\nItem.defaultProps = {\n tag: 'a',\n locale: 'en',\n tabIndex: 0,\n};\n\nexport default createComponent(Breadcrumbs, {\n Item,\n});\n"],"mappings":"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","ignoreList":[]}
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { EllipsisSettings, SimpleHintPopperProps, BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { NSText } from '@semcore/typography';\n\nexport type BreadcrumbsProps = BoxProps & {\n /**\n * Links divider\n * */\n separator?: React.ReactNode;\n /** Specifies the locale for i18n support */\n locale?: string;\n};\n\nexport type BreadcrumbsItemProps = BoxProps & {\n /** The property is responsible for the activity of the element */\n active?: boolean;\n /** Specifies the locale for i18n support */\n locale?: string;\n /**\n * Ellipsis settings. You shouldn't use `cropPosition: middle` for breadcrumbs.\n * If you're sure you need `cropPosition: middle`, set `w` to Breadcrumbs.Item manually, for correct Ellipsis calculations.\n * @default false\n */\n} & NSText.HintProps & NSText.EllipsisProps;\n\nexport type BreadcrumbsContext = BreadcrumbsProps & {\n getItemProps: PropGetterFn;\n};\n\ndeclare const Breadcrumbs: Intergalactic.Component<'div', BreadcrumbsProps, BreadcrumbsContext> & {\n Item: Intergalactic.Component<'a', BreadcrumbsItemProps>;\n};\n\nexport default Breadcrumbs;\n"],"mappings":"","ignoreList":[]}
|
package/lib/es6/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Breadcrumbs';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,eAAe"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Breadcrumbs';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,eAAe","ignoreList":[]}
|
|
@@ -7,13 +7,10 @@ SBreadcrumbs {
|
|
|
7
7
|
SListContainer {
|
|
8
8
|
display: contents;
|
|
9
9
|
list-style: none;
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
margin: 0;
|
|
12
|
-
padding: 0;
|
|
13
10
|
|
|
14
11
|
SSeparator {
|
|
15
12
|
margin: 0 var(--intergalactic-spacing-2x, 8px);
|
|
16
|
-
color: var(--intergalactic-icon-secondary-neutral,
|
|
13
|
+
color: var(--intergalactic-icon-secondary-neutral, oklch(0.104 0.023 162.3 / 0.385));
|
|
17
14
|
display: flex;
|
|
18
15
|
|
|
19
16
|
&:last-child {
|
|
@@ -24,9 +21,9 @@ SBreadcrumbs {
|
|
|
24
21
|
SListItem {
|
|
25
22
|
overflow: hidden;
|
|
26
23
|
|
|
27
|
-
/* we need this hack to show
|
|
28
|
-
padding:
|
|
29
|
-
margin: -
|
|
24
|
+
/* we need this hack to show outline over `overflow: hidden` element */
|
|
25
|
+
padding: 4px;
|
|
26
|
+
margin: -4px;
|
|
30
27
|
|
|
31
28
|
SBreadcrumbsItem {
|
|
32
29
|
width: 100%;
|
|
@@ -34,26 +31,18 @@ SBreadcrumbs {
|
|
|
34
31
|
position: relative;
|
|
35
32
|
font-size: var(--intergalactic-fs-200, 14px);
|
|
36
33
|
line-height: var(--intergalactic-lh-200, 142%);
|
|
37
|
-
color: var(--intergalactic-text-secondary,
|
|
34
|
+
color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
|
|
38
35
|
text-decoration: none;
|
|
39
36
|
cursor: pointer;
|
|
40
|
-
text-overflow: ellipsis;
|
|
41
|
-
white-space: nowrap;
|
|
42
|
-
overflow: hidden;
|
|
43
37
|
|
|
44
38
|
&:hover {
|
|
45
39
|
text-decoration: underline;
|
|
46
|
-
color: var(--intergalactic-text-primary,
|
|
40
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
47
41
|
}
|
|
48
42
|
}
|
|
49
43
|
|
|
50
|
-
SBreadcrumbsItem[keyboardFocused] {
|
|
51
|
-
outline: none;
|
|
52
|
-
box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
|
|
53
|
-
}
|
|
54
|
-
|
|
55
44
|
SBreadcrumbsItem[active] {
|
|
56
|
-
color: var(--intergalactic-text-primary,
|
|
45
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
57
46
|
cursor: default;
|
|
58
47
|
&:hover {
|
|
59
48
|
text-decoration: none;
|
|
@@ -6,12 +6,12 @@ import it from './it.json';
|
|
|
6
6
|
import ja from './ja.json';
|
|
7
7
|
import ko from './ko.json';
|
|
8
8
|
import nl from './nl.json';
|
|
9
|
+
import pl from './pl.json';
|
|
9
10
|
import pt from './pt.json';
|
|
11
|
+
import sv from './sv.json';
|
|
10
12
|
import tr from './tr.json';
|
|
11
13
|
import vi from './vi.json';
|
|
12
14
|
import zh from './zh.json';
|
|
13
|
-
import pl from './pl.json';
|
|
14
|
-
import sv from './sv.json';
|
|
15
15
|
export var localizedMessages = {
|
|
16
16
|
de: de,
|
|
17
17
|
en: en,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","
|
|
1
|
+
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pl","pt","sv","tr","vi","zh","localizedMessages"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pl from './pl.json';\nimport pt from './pt.json';\nimport sv from './sv.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\n\nexport const localizedMessages = {\n de,\n en,\n es,\n fr,\n it,\n ja,\n ko,\n nl,\n pt,\n tr,\n vi,\n zh,\n pl,\n sv,\n};\n"],"mappings":"AAAA,OAAOA,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAE1B,OAAO,IAAMC,iBAAiB,GAAG;EAC/Bd,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFL,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA;AACF,CAAC","ignoreList":[]}
|
package/lib/esm/Breadcrumbs.mjs
CHANGED
|
@@ -1,44 +1,41 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
2
|
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
3
3
|
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
4
|
+
import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
4
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
5
|
-
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
|
-
import { sstyled } from "@semcore/
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { Box } from "@semcore/flex-box";
|
|
7
|
+
import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
|
|
8
|
+
import { Box } from "@semcore/base-components";
|
|
9
|
+
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
11
10
|
import SSeparator from "@semcore/icon/ChevronRight/m";
|
|
12
|
-
import
|
|
11
|
+
import { Text } from "@semcore/typography";
|
|
12
|
+
import React from "react";
|
|
13
13
|
import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
|
|
14
|
-
import i18nEnhance from "@semcore/utils/lib/enhances/i18nEnhance";
|
|
15
14
|
/*!__reshadow-styles__:"./style/breadcrumbs.shadow.css"*/
|
|
16
15
|
var style = (
|
|
17
16
|
/*__reshadow_css_start__*/
|
|
18
17
|
(sstyled.insert(
|
|
19
18
|
/*__inner_css_start__*/
|
|
20
|
-
".
|
|
19
|
+
".___SBreadcrumbs_lllrq_gg_{display:flex;align-items:center;padding:0;margin:0}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_{display:contents;list-style:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{margin:0 var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385));display:flex}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, rgba(0, 5, 2, 0.385))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_{color:var(--intergalactic-icon-secondary-neutral, color(display-p3 0.0036 0.02041 0.00996 / 0.385))}}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SSeparator_lllrq_gg_:last-child{display:none}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_{overflow:hidden;padding:4px;margin:-4px}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{width:100%;display:block;position:relative;font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));-webkit-text-decoration:none;text-decoration:none;cursor:pointer}@supports (color:color(display-p3 0 0 0%)){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}}.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));cursor:default}@media (hover:hover){.___SBreadcrumbs_lllrq_gg_ .___SListContainer_lllrq_gg_ .___SListItem_lllrq_gg_ .___SBreadcrumbsItem_lllrq_gg_.__active_lllrq_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}",
|
|
21
20
|
/*__inner_css_end__*/
|
|
22
|
-
"
|
|
21
|
+
"lllrq_gg_"
|
|
23
22
|
), /*__reshadow_css_end__*/
|
|
24
23
|
{
|
|
25
|
-
"__SBreadcrumbs": "
|
|
26
|
-
"__SListContainer": "
|
|
27
|
-
"__SSeparator": "
|
|
28
|
-
"__SListItem": "
|
|
29
|
-
"__SBreadcrumbsItem": "
|
|
30
|
-
"
|
|
31
|
-
"_active": "__active_iwoiw_gg_"
|
|
24
|
+
"__SBreadcrumbs": "___SBreadcrumbs_lllrq_gg_",
|
|
25
|
+
"__SListContainer": "___SListContainer_lllrq_gg_",
|
|
26
|
+
"__SSeparator": "___SSeparator_lllrq_gg_",
|
|
27
|
+
"__SListItem": "___SListItem_lllrq_gg_",
|
|
28
|
+
"__SBreadcrumbsItem": "___SBreadcrumbsItem_lllrq_gg_",
|
|
29
|
+
"_active": "__active_lllrq_gg_"
|
|
32
30
|
})
|
|
33
31
|
);
|
|
34
|
-
var Breadcrumbs = /* @__PURE__ */ function(_Component) {
|
|
35
|
-
_inherits(Breadcrumbs2, _Component);
|
|
36
|
-
var _super = _createSuper(Breadcrumbs2);
|
|
32
|
+
var Breadcrumbs = /* @__PURE__ */ (function(_Component) {
|
|
37
33
|
function Breadcrumbs2() {
|
|
38
34
|
_classCallCheck(this, Breadcrumbs2);
|
|
39
|
-
return
|
|
35
|
+
return _callSuper(this, Breadcrumbs2, arguments);
|
|
40
36
|
}
|
|
41
|
-
|
|
37
|
+
_inherits(Breadcrumbs2, _Component);
|
|
38
|
+
return _createClass(Breadcrumbs2, [{
|
|
42
39
|
key: "getItemProps",
|
|
43
40
|
value: function getItemProps() {
|
|
44
41
|
var _this$asProps = this.asProps, separator = _this$asProps.separator, locale = _this$asProps.locale;
|
|
@@ -54,13 +51,12 @@ var Breadcrumbs = /* @__PURE__ */ function(_Component) {
|
|
|
54
51
|
var SBreadcrumbs = Box;
|
|
55
52
|
var SListContainer = "ol";
|
|
56
53
|
var _this$asProps2 = this.asProps, styles = _this$asProps2.styles, getI18nText = _this$asProps2.getI18nText, Children = _this$asProps2.Children;
|
|
57
|
-
return _ref3 = sstyled
|
|
54
|
+
return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SBreadcrumbs, _ref3.cn("SBreadcrumbs", _objectSpread({}, assignProps({
|
|
58
55
|
"aria-label": getI18nText("breadcrumbs")
|
|
59
56
|
}, _ref))), /* @__PURE__ */ React.createElement(SListContainer, _ref3.cn("SListContainer", {}), /* @__PURE__ */ React.createElement(Children, _ref3.cn("Children", {}))));
|
|
60
57
|
}
|
|
61
58
|
}]);
|
|
62
|
-
|
|
63
|
-
}(Component);
|
|
59
|
+
})(Component);
|
|
64
60
|
_defineProperty(Breadcrumbs, "displayName", "Breadcrumbs");
|
|
65
61
|
_defineProperty(Breadcrumbs, "style", style);
|
|
66
62
|
_defineProperty(Breadcrumbs, "enhance", [i18nEnhance(localizedMessages)]);
|
|
@@ -70,41 +66,30 @@ _defineProperty(Breadcrumbs, "defaultProps", {
|
|
|
70
66
|
i18n: localizedMessages,
|
|
71
67
|
locale: "en"
|
|
72
68
|
});
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
var
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
"use:href": !active && !disabled ? href : void 0,
|
|
91
|
-
"aria-current": active ? "page" : void 0,
|
|
92
|
-
"use:tag": active ? "span" : tag
|
|
93
|
-
}, _ref2))))), /* @__PURE__ */ React.createElement(SSeparator2, _ref4.cn("SSeparator", {
|
|
94
|
-
"aria-hidden": "true"
|
|
95
|
-
}), separator));
|
|
96
|
-
}
|
|
97
|
-
}]);
|
|
98
|
-
return Item2;
|
|
99
|
-
}(Component);
|
|
100
|
-
_defineProperty(Item, "defaultProps", {
|
|
69
|
+
function Item(props) {
|
|
70
|
+
var _ref2 = arguments[0], _ref4;
|
|
71
|
+
var SBreadcrumbsItem = Text;
|
|
72
|
+
var styles = props.styles, separator = props.separator, active = props.active, disabled = props.disabled, href = props.href, tabIndex = props.tabIndex, tag = props.tag, _props$ellipsis = props.ellipsis, ellipsis = _props$ellipsis === void 0 ? true : _props$ellipsis;
|
|
73
|
+
var SSeparator2 = "div";
|
|
74
|
+
var SListItem = "li";
|
|
75
|
+
return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SListItem, _ref4.cn("SListItem", {}), /* @__PURE__ */ React.createElement(SBreadcrumbsItem, _ref4.cn("SBreadcrumbsItem", _objectSpread({}, assignProps({
|
|
76
|
+
"use:tabIndex": active || disabled ? -1 : tabIndex,
|
|
77
|
+
"use:href": !active && !disabled ? href : void 0,
|
|
78
|
+
"aria-current": active ? "page" : void 0,
|
|
79
|
+
"use:tag": active ? "span" : tag,
|
|
80
|
+
"ellipsis": ellipsis
|
|
81
|
+
}, _ref2))))), /* @__PURE__ */ React.createElement(SSeparator2, _ref4.cn("SSeparator", {
|
|
82
|
+
"aria-hidden": "true"
|
|
83
|
+
}), separator));
|
|
84
|
+
}
|
|
85
|
+
Item.defaultProps = {
|
|
101
86
|
tag: "a",
|
|
102
|
-
locale: "en"
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
const
|
|
87
|
+
locale: "en",
|
|
88
|
+
tabIndex: 0
|
|
89
|
+
};
|
|
90
|
+
const Breadcrumbs_default = createComponent(Breadcrumbs, {
|
|
106
91
|
Item
|
|
107
92
|
});
|
|
108
93
|
export {
|
|
109
|
-
|
|
94
|
+
Breadcrumbs_default as default
|
|
110
95
|
};
|
|
@@ -7,13 +7,10 @@ SBreadcrumbs {
|
|
|
7
7
|
SListContainer {
|
|
8
8
|
display: contents;
|
|
9
9
|
list-style: none;
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
margin: 0;
|
|
12
|
-
padding: 0;
|
|
13
10
|
|
|
14
11
|
SSeparator {
|
|
15
12
|
margin: 0 var(--intergalactic-spacing-2x, 8px);
|
|
16
|
-
color: var(--intergalactic-icon-secondary-neutral,
|
|
13
|
+
color: var(--intergalactic-icon-secondary-neutral, oklch(0.104 0.023 162.3 / 0.385));
|
|
17
14
|
display: flex;
|
|
18
15
|
|
|
19
16
|
&:last-child {
|
|
@@ -24,9 +21,9 @@ SBreadcrumbs {
|
|
|
24
21
|
SListItem {
|
|
25
22
|
overflow: hidden;
|
|
26
23
|
|
|
27
|
-
/* we need this hack to show
|
|
28
|
-
padding:
|
|
29
|
-
margin: -
|
|
24
|
+
/* we need this hack to show outline over `overflow: hidden` element */
|
|
25
|
+
padding: 4px;
|
|
26
|
+
margin: -4px;
|
|
30
27
|
|
|
31
28
|
SBreadcrumbsItem {
|
|
32
29
|
width: 100%;
|
|
@@ -34,26 +31,18 @@ SBreadcrumbs {
|
|
|
34
31
|
position: relative;
|
|
35
32
|
font-size: var(--intergalactic-fs-200, 14px);
|
|
36
33
|
line-height: var(--intergalactic-lh-200, 142%);
|
|
37
|
-
color: var(--intergalactic-text-secondary,
|
|
34
|
+
color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
|
|
38
35
|
text-decoration: none;
|
|
39
36
|
cursor: pointer;
|
|
40
|
-
text-overflow: ellipsis;
|
|
41
|
-
white-space: nowrap;
|
|
42
|
-
overflow: hidden;
|
|
43
37
|
|
|
44
38
|
&:hover {
|
|
45
39
|
text-decoration: underline;
|
|
46
|
-
color: var(--intergalactic-text-primary,
|
|
40
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
47
41
|
}
|
|
48
42
|
}
|
|
49
43
|
|
|
50
|
-
SBreadcrumbsItem[keyboardFocused] {
|
|
51
|
-
outline: none;
|
|
52
|
-
box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
|
|
53
|
-
}
|
|
54
|
-
|
|
55
44
|
SBreadcrumbsItem[active] {
|
|
56
|
-
color: var(--intergalactic-text-primary,
|
|
45
|
+
color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
|
|
57
46
|
cursor: default;
|
|
58
47
|
&:hover {
|
|
59
48
|
text-decoration: none;
|
|
@@ -6,12 +6,12 @@ import it from "./it.json.mjs";
|
|
|
6
6
|
import ja from "./ja.json.mjs";
|
|
7
7
|
import ko from "./ko.json.mjs";
|
|
8
8
|
import nl from "./nl.json.mjs";
|
|
9
|
+
import pl from "./pl.json.mjs";
|
|
9
10
|
import pt from "./pt.json.mjs";
|
|
11
|
+
import sv from "./sv.json.mjs";
|
|
10
12
|
import tr from "./tr.json.mjs";
|
|
11
13
|
import vi from "./vi.json.mjs";
|
|
12
14
|
import zh from "./zh.json.mjs";
|
|
13
|
-
import pl from "./pl.json.mjs";
|
|
14
|
-
import sv from "./sv.json.mjs";
|
|
15
15
|
var localizedMessages = {
|
|
16
16
|
de,
|
|
17
17
|
en,
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import type { EllipsisSettings, SimpleHintPopperProps, BoxProps } from '@semcore/base-components';
|
|
2
|
+
import type { PropGetterFn, Intergalactic } from '@semcore/core';
|
|
3
|
+
import type { NSText } from '@semcore/typography';
|
|
4
4
|
|
|
5
|
-
/** @deprecated */
|
|
6
|
-
export interface IBreadcrumbsProps extends BreadcrumbsProps, UnknownProperties {}
|
|
7
5
|
export type BreadcrumbsProps = BoxProps & {
|
|
8
6
|
/**
|
|
9
7
|
* Links divider
|
|
10
8
|
* */
|
|
11
9
|
separator?: React.ReactNode;
|
|
10
|
+
/** Specifies the locale for i18n support */
|
|
12
11
|
locale?: string;
|
|
13
12
|
};
|
|
14
13
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
14
|
+
export type BreadcrumbsItemProps = BoxProps & {
|
|
15
|
+
/** The property is responsible for the activity of the element */
|
|
16
|
+
active?: boolean;
|
|
17
|
+
/** Specifies the locale for i18n support */
|
|
18
|
+
locale?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Ellipsis settings. You shouldn't use `cropPosition: middle` for breadcrumbs.
|
|
21
|
+
* If you're sure you need `cropPosition: middle`, set `w` to Breadcrumbs.Item manually, for correct Ellipsis calculations.
|
|
22
|
+
* @default false
|
|
23
|
+
*/
|
|
24
|
+
} & NSText.HintProps & NSText.EllipsisProps;
|
|
23
25
|
|
|
24
|
-
/** @deprecated */
|
|
25
|
-
export interface IBreadcrumbsContext extends BreadcrumbsContext, UnknownProperties {}
|
|
26
26
|
export type BreadcrumbsContext = BreadcrumbsProps & {
|
|
27
27
|
getItemProps: PropGetterFn;
|
|
28
28
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/breadcrumbs",
|
|
3
3
|
"description": "Semrush Breadcrumbs Component",
|
|
4
|
-
"version": "5.
|
|
4
|
+
"version": "5.50.0-prerelease.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,12 +14,12 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/utils": "4.
|
|
18
|
-
"@semcore/icon": "4.
|
|
19
|
-
"@semcore/flex-box": "5.
|
|
17
|
+
"@semcore/utils": "4.49.0-prerelease.0",
|
|
18
|
+
"@semcore/icon": "4.63.0-prerelease.0",
|
|
19
|
+
"@semcore/flex-box": "5.42.0-prerelease.0"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
|
-
"@semcore/core": "^2.
|
|
22
|
+
"@semcore/core": "^2.40.0-prerelease.0",
|
|
23
23
|
"react": "16.8 - 18",
|
|
24
24
|
"react-dom": "16.8 - 18"
|
|
25
25
|
},
|