@redocly/theme 0.4.8 → 0.4.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Button/Button.d.ts +2 -2
- package/Button/Button.js +7 -3
- package/Cards/Card.js +6 -13
- package/ColorModeSwitcher/ColorModeSwitcher.js +29 -18
- package/CopyButton/CopyButton.js +24 -13
- package/CopyButton/CopyButtonWrapper.d.ts +2 -2
- package/CopyButton/CopyButtonWrapper.js +25 -13
- package/EditPageButton/EditPageButton.js +4 -13
- package/Footer/CustomFooter.js +6 -15
- package/Footer/CustomFooterNavItem.js +4 -13
- package/Footer/Footer.js +6 -16
- package/Footer/FooterColumn.js +9 -18
- package/Footer/FooterColumns.js +3 -13
- package/Footer/FooterCopyright.js +2 -13
- package/JsonViewer/JsonViewer.d.ts +3 -3
- package/JsonViewer/JsonViewer.js +33 -16
- package/LastUpdated/LastUpdated.js +6 -16
- package/Layout/PageLayout.d.ts +3 -3
- package/Layout/PageLayout.js +4 -13
- package/Layout/RootLayout.d.ts +4 -4
- package/Layout/RootLayout.js +5 -13
- package/Markdown/Admonition.d.ts +2 -2
- package/Markdown/Admonition.js +5 -13
- package/Markdown/CodeSample/CodeSample.d.ts +1 -2
- package/Markdown/CodeSample/CodeSample.js +18 -4
- package/Markdown/Details.d.ts +2 -2
- package/Markdown/Details.js +4 -2
- package/Markdown/Heading.js +29 -15
- package/Markdown/MarkdownLayout.d.ts +3 -3
- package/Markdown/MarkdownLayout.js +9 -13
- package/Markdown/Mermaid.js +2 -2
- package/Markdown/Sup.js +2 -13
- package/Markdown/Tabs/Tab.js +2 -13
- package/Markdown/Tabs/Tabs.js +34 -21
- package/Navbar/MobileNavbarDropdown.js +3 -13
- package/Navbar/MobileNavbarItem.js +31 -14
- package/Navbar/MobileNavbarMenu.js +6 -15
- package/Navbar/Navbar.d.ts +4 -4
- package/Navbar/Navbar.js +12 -16
- package/Navbar/NavbarDropdown.js +3 -13
- package/Navbar/NavbarItem.js +8 -14
- package/Navbar/NavbarMenu.js +4 -15
- package/NavbarLogo/NavbarLogo.js +3 -14
- package/PageNavigation/NextPageLink.js +5 -16
- package/PageNavigation/PageNavigation.js +6 -16
- package/PageNavigation/PreviousPageLink.js +5 -16
- package/Panel/PanelComponent.d.ts +2 -1
- package/Panel/PanelComponent.js +31 -14
- package/Profile/Profile.d.ts +2 -2
- package/Profile/Profile.js +9 -15
- package/Search/Autocomplete.js +30 -3
- package/Search/ClearIcon.js +3 -2
- package/Search/Parameters.js +17 -17
- package/Search/Search.js +3 -13
- package/Search/SearchIcon.js +3 -2
- package/Search/SearchItem.js +30 -13
- package/Search/utils.js +28 -2
- package/Sidebar/ApiCallItem.js +7 -13
- package/Sidebar/ArrowBack.js +5 -13
- package/Sidebar/BackButton.d.ts +2 -2
- package/Sidebar/BackButton.js +4 -13
- package/Sidebar/Drilldown.d.ts +2 -2
- package/Sidebar/Drilldown.js +6 -2
- package/Sidebar/DrilldownMenu.d.ts +2 -2
- package/Sidebar/DrilldownMenu.js +10 -13
- package/Sidebar/DrilldownMenuItem.js +6 -13
- package/Sidebar/ExternalIcon.js +7 -13
- package/Sidebar/MenuGroup.d.ts +2 -2
- package/Sidebar/MenuGroup.js +8 -13
- package/Sidebar/MenuItem.js +7 -13
- package/Sidebar/MenuLinkItem.d.ts +2 -2
- package/Sidebar/MenuLinkItem.js +2 -2
- package/Sidebar/Separator.js +4 -13
- package/Sidebar/SidebarLayout.d.ts +3 -3
- package/Sidebar/SidebarLayout.js +9 -16
- package/SidebarLogo/SidebarLogo.js +3 -14
- package/SourceCode/SourceCode.js +31 -18
- package/TableOfContent/TableOfContent.js +36 -23
- package/Tooltip/Tooltip.d.ts +2 -1
- package/Tooltip/Tooltip.js +4 -3
- package/globalStyle.js +10 -9
- package/hooks/useDefaultThemeSettings.d.ts +2 -0
- package/hooks/useDefaultThemeSettings.js +9 -0
- package/icons/AlertIcon/AlertIcon.js +20 -17
- package/icons/ArrowIcon/ArrowIcon.js +4 -13
- package/icons/ColorModeIcon/ColorModeIcon.js +7 -15
- package/icons/ShelfIcon/ShelfIcon.d.ts +2 -2
- package/icons/ShelfIcon/ShelfIcon.js +4 -13
- package/mocks/Link.js +5 -2
- package/mocks/types.d.ts +4 -0
- package/package.json +1 -1
- package/src/Button/Button.tsx +2 -2
- package/src/Cards/Card.tsx +1 -0
- package/src/ColorModeSwitcher/ColorModeSwitcher.tsx +3 -4
- package/src/CopyButton/CopyButton.tsx +1 -1
- package/src/CopyButton/CopyButtonWrapper.tsx +1 -1
- package/src/EditPageButton/EditPageButton.tsx +1 -0
- package/src/Footer/CustomFooter.tsx +1 -0
- package/src/Footer/CustomFooterNavItem.tsx +1 -0
- package/src/Footer/Footer.tsx +3 -3
- package/src/Footer/FooterColumn.tsx +1 -0
- package/src/Footer/FooterColumns.tsx +1 -0
- package/src/Footer/FooterCopyright.tsx +1 -0
- package/src/JsonViewer/JsonViewer.tsx +1 -1
- package/src/LastUpdated/LastUpdated.tsx +3 -3
- package/src/Layout/PageLayout.tsx +6 -3
- package/src/Layout/RootLayout.tsx +4 -4
- package/src/Markdown/Admonition.tsx +2 -2
- package/src/Markdown/CodeSample/CodeSample.tsx +24 -7
- package/src/Markdown/Details.tsx +2 -2
- package/src/Markdown/Heading.tsx +1 -1
- package/src/Markdown/MarkdownLayout.tsx +3 -3
- package/src/Markdown/Mermaid.tsx +1 -0
- package/src/Markdown/Sup.tsx +1 -0
- package/src/Markdown/Tabs/Tab.tsx +1 -0
- package/src/Markdown/Tabs/Tabs.tsx +2 -1
- package/src/Navbar/MobileNavbarDropdown.tsx +1 -0
- package/src/Navbar/MobileNavbarItem.tsx +1 -1
- package/src/Navbar/MobileNavbarMenu.tsx +1 -0
- package/src/Navbar/Navbar.tsx +6 -7
- package/src/Navbar/NavbarDropdown.tsx +1 -0
- package/src/Navbar/NavbarItem.tsx +1 -0
- package/src/Navbar/NavbarMenu.tsx +1 -0
- package/src/NavbarLogo/NavbarLogo.tsx +1 -0
- package/src/PageNavigation/NextPageLink.tsx +4 -3
- package/src/PageNavigation/PageNavigation.tsx +3 -3
- package/src/PageNavigation/PreviousPageLink.tsx +4 -3
- package/src/Panel/PanelComponent.tsx +2 -2
- package/src/Profile/Profile.tsx +1 -1
- package/src/Search/Autocomplete.tsx +1 -1
- package/src/Search/ClearIcon.tsx +1 -0
- package/src/Search/Parameters.tsx +1 -0
- package/src/Search/Search.tsx +1 -0
- package/src/Search/SearchIcon.tsx +1 -0
- package/src/Search/SearchItem.tsx +1 -1
- package/src/Search/utils.tsx +1 -0
- package/src/Sidebar/ApiCallItem.tsx +1 -0
- package/src/Sidebar/ArrowBack.tsx +1 -0
- package/src/Sidebar/BackButton.tsx +5 -2
- package/src/Sidebar/Drilldown.tsx +2 -2
- package/src/Sidebar/DrilldownMenu.tsx +2 -2
- package/src/Sidebar/DrilldownMenuItem.tsx +1 -0
- package/src/Sidebar/ExternalIcon.tsx +1 -0
- package/src/Sidebar/MenuGroup.tsx +2 -2
- package/src/Sidebar/MenuItem.tsx +1 -0
- package/src/Sidebar/MenuLinkItem.tsx +5 -2
- package/src/Sidebar/Separator.tsx +1 -0
- package/src/Sidebar/SidebarLayout.tsx +5 -6
- package/src/SidebarLogo/SidebarLogo.tsx +1 -0
- package/src/SourceCode/SourceCode.tsx +1 -1
- package/src/TableOfContent/TableOfContent.tsx +3 -4
- package/src/Tooltip/Tooltip.tsx +1 -1
- package/src/globalStyle.ts +54 -0
- package/src/hooks/useDefaultThemeSettings.ts +8 -0
- package/src/icons/AlertIcon/AlertIcon.tsx +1 -0
- package/src/icons/ArrowIcon/ArrowIcon.tsx +1 -0
- package/src/icons/ColorModeIcon/ColorModeIcon.tsx +1 -0
- package/src/icons/ShelfIcon/ShelfIcon.tsx +2 -2
- package/src/mocks/Link.tsx +1 -0
- package/src/mocks/types.ts +4 -0
- package/src/types/portal/src/shared/types.d.ts +1 -2
- package/src/ui/Burger.tsx +1 -0
- package/src/ui/Dropdown.tsx +1 -1
- package/src/ui/Flex.tsx +2 -2
- package/src/ui/Tiles/ThinTile.tsx +1 -1
- package/src/ui/Tiles/WideTile.tsx +1 -1
- package/src/ui/UniversalLink.tsx +10 -9
- package/src/ui/index.tsx +3 -2
- package/ui/Burger.js +5 -13
- package/ui/Dropdown.js +32 -14
- package/ui/Flex.d.ts +2 -2
- package/ui/Flex.js +2 -2
- package/ui/Tiles/ThinTile.js +29 -13
- package/ui/Tiles/WideTile.js +29 -13
- package/ui/UniversalLink.d.ts +4 -4
- package/ui/UniversalLink.js +26 -3
- package/ui/index.d.ts +3 -3
package/Sidebar/ExternalIcon.js
CHANGED
|
@@ -3,27 +3,21 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
8
|
};
|
|
20
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
10
|
exports.ExternalIcon = void 0;
|
|
22
|
-
var
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
23
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
13
|
var Icon = function (_a) {
|
|
25
14
|
var className = _a.className;
|
|
26
|
-
return (
|
|
15
|
+
return (react_1.default.createElement("span", { "data-component-name": "Sidebar/ExternalIcon" },
|
|
16
|
+
react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", x: "0px", y: "0px", viewBox: "0 0 100 125", enableBackground: "new 0 0 100 100", className: className },
|
|
17
|
+
react_1.default.createElement("path", { d: "M-408.167-318.5" }),
|
|
18
|
+
react_1.default.createElement("line", { fill: "none", stroke: "#ffffff", strokeWidth: "0.25", strokeMiterlimit: "10", x1: "57.5", y1: "11.75", x2: "57.5", y2: "17.5" }),
|
|
19
|
+
react_1.default.createElement("path", { d: "M98.57,4.784c-0.024-0.113-0.047-0.223-0.074-0.334c-0.035-0.117-0.075-0.231-0.117-0.346 c-0.023-0.062-0.037-0.125-0.064-0.187c-0.016-0.032-0.03-0.06-0.049-0.092c-0.048-0.119-0.107-0.227-0.17-0.336 c-0.05-0.089-0.095-0.179-0.152-0.265c-0.062-0.1-0.139-0.195-0.209-0.292C97.67,2.85,97.611,2.77,97.545,2.69 c-0.081-0.092-0.172-0.178-0.258-0.262c-0.07-0.068-0.139-0.139-0.212-0.202c-0.093-0.083-0.196-0.158-0.3-0.232 c-0.08-0.058-0.152-0.114-0.236-0.163c-0.104-0.069-0.219-0.128-0.329-0.186c-0.091-0.046-0.175-0.093-0.262-0.132 c-0.044-0.019-0.081-0.043-0.121-0.061c-0.074-0.03-0.154-0.046-0.234-0.072c-0.095-0.033-0.19-0.065-0.288-0.092 c-0.123-0.034-0.246-0.059-0.369-0.083c-0.096-0.019-0.188-0.036-0.289-0.046c-0.131-0.018-0.263-0.022-0.393-0.028 c-0.064-0.002-0.12-0.012-0.186-0.012L63.77,1.305c-2.535,0.017-4.566,2.078-4.554,4.605c0.019,2.525,2.084,4.563,4.604,4.546 l19.258-0.121l-29.79,30.162c-1.112,1.126-1.526,2.678-1.233,4.118c0.174,0.863,0.596,1.691,1.272,2.357 c0.897,0.888,2.073,1.325,3.245,1.32c1.17-0.007,2.337-0.459,3.227-1.361l0.002-0.001l29.787-30.158l0.121,19.255 c0.014,2.523,2.07,4.564,4.602,4.545c1.268-0.005,2.408-0.526,3.233-1.357c0.817-0.834,1.325-1.98,1.317-3.242L98.675,5.665 c0-0.063-0.016-0.124-0.016-0.189c-0.009-0.123-0.015-0.25-0.032-0.375C98.616,4.992,98.592,4.89,98.57,4.784z" }),
|
|
20
|
+
react_1.default.createElement("path", { d: "M6.542,83.279c0,5.717,4.635,10.354,10.354,10.354l55.616,0.065c5.719,0,10.354-4.636,10.354-10.354l-0.091-40.782h6.135 v40.849c0,9.014-7.307,16.319-16.319,16.319l-56.36-0.066c-8.597,0-15.564-6.969-15.564-15.562L0.585,27.821 c0-9.014,7.306-16.32,16.32-16.32l41.138-0.084v6.142L16.98,17.535c-5.718,0-10.354,4.635-10.354,10.354L6.542,83.279z" }))));
|
|
27
21
|
};
|
|
28
22
|
exports.ExternalIcon = (0, styled_components_1.default)(Icon)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 10px;\n height: 10px;\n margin-left: 5px;\n fill: var(--sidebar-group-item-chevron-color);\n"], ["\n width: 10px;\n height: 10px;\n margin-left: 5px;\n fill: var(--sidebar-group-item-chevron-color);\n"])));
|
|
29
23
|
var templateObject_1;
|
package/Sidebar/MenuGroup.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import type { ItemState } from '../Sidebar/types/ItemState';
|
|
3
3
|
interface MenuGroupProps {
|
|
4
4
|
item: ItemState;
|
|
5
5
|
isExpanded: boolean;
|
|
6
6
|
toggleExpanded: () => void;
|
|
7
7
|
}
|
|
8
|
-
export declare function MenuGroup({ item, isExpanded, toggleExpanded, children, }: PropsWithChildren<MenuGroupProps>): JSX.Element;
|
|
8
|
+
export declare function MenuGroup({ item, isExpanded, toggleExpanded, children, }: React.PropsWithChildren<MenuGroupProps>): JSX.Element;
|
|
9
9
|
export {};
|
package/Sidebar/MenuGroup.js
CHANGED
|
@@ -3,23 +3,12 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
8
|
};
|
|
20
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
10
|
exports.MenuGroup = void 0;
|
|
22
|
-
var
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
23
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
13
|
var ArrowIcon_1 = require("../icons/ArrowIcon/ArrowIcon");
|
|
25
14
|
var MenuLinkItem_1 = require("../Sidebar/MenuLinkItem");
|
|
@@ -27,7 +16,13 @@ var MenuItemLabel_1 = require("../Sidebar/MenuItemLabel");
|
|
|
27
16
|
var SeparatorLine_1 = require("../Sidebar/SeparatorLine");
|
|
28
17
|
function MenuGroup(_a) {
|
|
29
18
|
var item = _a.item, isExpanded = _a.isExpanded, toggleExpanded = _a.toggleExpanded, children = _a.children;
|
|
30
|
-
return (
|
|
19
|
+
return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/MenuGroup" },
|
|
20
|
+
react_1.default.createElement(MenuLinkItem_1.MenuLinkItem, { item: item },
|
|
21
|
+
react_1.default.createElement(MenuGroupLabel, { onClick: toggleExpanded, isAlwaysExpanded: item.expanded === 'always', active: item.active },
|
|
22
|
+
react_1.default.createElement(MenuGroupArrow, { direction: isExpanded ? 'down' : 'right' }),
|
|
23
|
+
item.label)),
|
|
24
|
+
react_1.default.createElement(MenuWrapper, null, isExpanded ? children : null),
|
|
25
|
+
item.separatorLine ? react_1.default.createElement(SeparatorLine_1.SeparatorLine, null) : null));
|
|
31
26
|
}
|
|
32
27
|
exports.MenuGroup = MenuGroup;
|
|
33
28
|
var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
|
package/Sidebar/MenuItem.js
CHANGED
|
@@ -3,23 +3,12 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
8
|
};
|
|
20
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
10
|
exports.MenuItem = void 0;
|
|
22
|
-
var
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
23
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
13
|
var MenuLinkItem_1 = require("../Sidebar/MenuLinkItem");
|
|
25
14
|
var ExternalIcon_1 = require("../Sidebar/ExternalIcon");
|
|
@@ -27,7 +16,12 @@ var MenuItemLabel_1 = require("../Sidebar/MenuItemLabel");
|
|
|
27
16
|
var SeparatorLine_1 = require("../Sidebar/SeparatorLine");
|
|
28
17
|
function MenuItem(_a) {
|
|
29
18
|
var item = _a.item;
|
|
30
|
-
return (
|
|
19
|
+
return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/MenuItem" },
|
|
20
|
+
react_1.default.createElement(MenuLinkItem_1.MenuLinkItem, { item: item },
|
|
21
|
+
react_1.default.createElement(MenuItemLabel_1.MenuItemLabel, { active: item.active },
|
|
22
|
+
item.label,
|
|
23
|
+
item.external ? react_1.default.createElement(ExternalIcon_1.ExternalIcon, null) : null)),
|
|
24
|
+
item.separatorLine ? react_1.default.createElement(SeparatorLine_1.SeparatorLine, null) : null));
|
|
31
25
|
}
|
|
32
26
|
exports.MenuItem = MenuItem;
|
|
33
27
|
var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import type { MenuItemProps } from '../Sidebar/types/MenuItemProps';
|
|
3
|
-
export declare function MenuLinkItem({ item, children }: PropsWithChildren<MenuItemProps>): JSX.Element;
|
|
3
|
+
export declare function MenuLinkItem({ item, children, }: React.PropsWithChildren<MenuItemProps>): JSX.Element;
|
package/Sidebar/MenuLinkItem.js
CHANGED
|
@@ -19,12 +19,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
19
19
|
};
|
|
20
20
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
21
|
exports.MenuLinkItem = void 0;
|
|
22
|
-
var
|
|
22
|
+
var react_1 = __importDefault(require("react"));
|
|
23
23
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
24
|
var MenuLink_1 = require("../Sidebar/MenuLink");
|
|
25
25
|
function MenuLinkItem(_a) {
|
|
26
26
|
var item = _a.item, children = _a.children;
|
|
27
|
-
return (
|
|
27
|
+
return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/MenuLinkItem" }, item.link ? (react_1.default.createElement(MenuLink_1.MenuLink, __assign({ to: item.link }, item), children)) : (children)));
|
|
28
28
|
}
|
|
29
29
|
exports.MenuLinkItem = MenuLinkItem;
|
|
30
30
|
var Wrapper = styled_components_1.default.span(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
|
package/Sidebar/Separator.js
CHANGED
|
@@ -3,29 +3,20 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
8
|
};
|
|
20
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
10
|
exports.Separator = void 0;
|
|
22
|
-
var
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
23
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
13
|
var SeparatorLine_1 = require("../Sidebar/SeparatorLine");
|
|
25
14
|
var SeparatorItem_1 = require("../Sidebar/SeparatorItem");
|
|
26
15
|
function Separator(_a) {
|
|
27
16
|
var item = _a.item;
|
|
28
|
-
return (
|
|
17
|
+
return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/Separator" },
|
|
18
|
+
react_1.default.createElement(SeparatorItem_1.SeparatorItem, null, item.label),
|
|
19
|
+
item.separatorLine ? react_1.default.createElement(SeparatorLine_1.SeparatorLine, null) : null));
|
|
29
20
|
}
|
|
30
21
|
exports.Separator = Separator;
|
|
31
22
|
var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
interface SidebarLayoutProps {
|
|
3
|
-
versions: ReactNode;
|
|
4
|
-
menu: ReactNode;
|
|
3
|
+
versions: React.ReactNode;
|
|
4
|
+
menu: React.ReactNode;
|
|
5
5
|
}
|
|
6
6
|
export declare function SidebarLayout({ versions, menu }: SidebarLayoutProps): JSX.Element | null;
|
|
7
7
|
export {};
|
package/Sidebar/SidebarLayout.js
CHANGED
|
@@ -3,17 +3,6 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __read = (this && this.__read) || function (o, n) {
|
|
18
7
|
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
19
8
|
if (!m) return o;
|
|
@@ -35,24 +24,28 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
35
24
|
};
|
|
36
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
26
|
exports.SidebarLayout = void 0;
|
|
38
|
-
var
|
|
27
|
+
var react_1 = __importDefault(require("react"));
|
|
39
28
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
40
29
|
var Sidebar_1 = require("../Sidebar/Sidebar");
|
|
41
30
|
var useMobileMenu_1 = require("../hooks/useMobileMenu");
|
|
42
31
|
var MobileSidebarButton_1 = require("../Sidebar/MobileSidebarButton");
|
|
43
32
|
var MenuContainer_1 = require("../Sidebar/MenuContainer");
|
|
44
|
-
var hooks_1 = require("../mocks/hooks");
|
|
45
|
-
var constants_1 = require("../mocks/constants");
|
|
46
33
|
var SidebarSearch_1 = require("../Search/SidebarSearch");
|
|
34
|
+
var useDefaultThemeSettings_1 = require("../hooks/useDefaultThemeSettings");
|
|
47
35
|
function SidebarLayout(_a) {
|
|
48
36
|
var versions = _a.versions, menu = _a.menu;
|
|
49
37
|
var _b = __read((0, useMobileMenu_1.useMobileMenu)(), 2), isOpen = _b[0], setIsOpen = _b[1];
|
|
50
38
|
var toggleMenu = function () { return setIsOpen(!isOpen); };
|
|
51
|
-
var _c = (0,
|
|
39
|
+
var _c = (0, useDefaultThemeSettings_1.useDefaultThemeSettings)(), search = _c.search, sidebar = _c.sidebar;
|
|
52
40
|
if (sidebar === null || sidebar === void 0 ? void 0 : sidebar.hide) {
|
|
53
41
|
return null;
|
|
54
42
|
}
|
|
55
|
-
return (
|
|
43
|
+
return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/SidebarLayout" },
|
|
44
|
+
react_1.default.createElement(MobileSidebarButton_1.MobileSidebarButton, { opened: isOpen, onClick: toggleMenu }),
|
|
45
|
+
!(search === null || search === void 0 ? void 0 : search.hide) && (search === null || search === void 0 ? void 0 : search.placement) === 'sidebar' ? react_1.default.createElement(SidebarSearch_1.SidebarSearch, null) : null,
|
|
46
|
+
react_1.default.createElement(Sidebar_1.Sidebar, { animate: true, opened: isOpen },
|
|
47
|
+
versions,
|
|
48
|
+
react_1.default.createElement(MenuContainer_1.MenuContainer, null, menu))));
|
|
56
49
|
}
|
|
57
50
|
exports.SidebarLayout = SidebarLayout;
|
|
58
51
|
var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
|
|
@@ -3,31 +3,20 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
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
6
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
8
|
};
|
|
20
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
10
|
exports.SidebarLogo = void 0;
|
|
22
|
-
var
|
|
11
|
+
var react_1 = __importDefault(require("react"));
|
|
23
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
24
13
|
function SidebarLogo(_a) {
|
|
25
14
|
var _b = _a === void 0 ? {} : _a, imageUrl = _b.imageUrl, href = _b.href, altText = _b.altText, backgroundColor = _b.backgroundColor, dataTestId = _b.dataTestId;
|
|
26
15
|
if (!imageUrl) {
|
|
27
16
|
return null;
|
|
28
17
|
}
|
|
29
|
-
var logo =
|
|
30
|
-
return (
|
|
18
|
+
var logo = react_1.default.createElement(LogoImgEl, { src: imageUrl, alt: altText || 'logo' });
|
|
19
|
+
return (react_1.default.createElement(LogoWrap, { "data-cy": dataTestId, style: { backgroundColor: backgroundColor }, "data-component-name": "SidebarLogo/SidebarLogo" }, href ? react_1.default.createElement(Link, { href: href }, logo) : logo));
|
|
31
20
|
}
|
|
32
21
|
exports.SidebarLogo = SidebarLogo;
|
|
33
22
|
var LogoImgEl = styled_components_1.default.img(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n max-height: var(--sidebar-logo-max-height);\n max-width: var(--sidebar-logo-max-width);\n padding: var(--sidebar-logo-padding);\n width: 100%;\n display: block;\n"], ["\n max-height: var(--sidebar-logo-max-height);\n max-width: var(--sidebar-logo-max-width);\n padding: var(--sidebar-logo-padding);\n width: 100%;\n display: block;\n"])));
|
package/SourceCode/SourceCode.js
CHANGED
|
@@ -1,14 +1,26 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
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;
|
|
12
24
|
};
|
|
13
25
|
var __read = (this && this.__read) || function (o, n) {
|
|
14
26
|
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
@@ -28,15 +40,14 @@ var __read = (this && this.__read) || function (o, n) {
|
|
|
28
40
|
};
|
|
29
41
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
42
|
exports.SourceCode = exports.Code = void 0;
|
|
31
|
-
var
|
|
32
|
-
var react_1 = require("react");
|
|
43
|
+
var react_1 = __importStar(require("react"));
|
|
33
44
|
var utils_1 = require("../utils");
|
|
34
45
|
var SamplesPanelControls_1 = require("../SamplesPanelControls");
|
|
35
46
|
var CopyButton_1 = require("../CopyButton");
|
|
36
47
|
function Code(_a) {
|
|
37
48
|
var source = _a.source, lang = _a.lang, dataTestId = _a.dataTestId, withLineNumbers = _a.withLineNumbers, startLineNumber = _a.startLineNumber;
|
|
38
49
|
var highlightedCode = (0, utils_1.highlight)(source, lang);
|
|
39
|
-
return (
|
|
50
|
+
return (react_1.default.createElement(SamplesPanelControls_1.PreformattedCodeBlock, { dangerouslySetInnerHTML: {
|
|
40
51
|
__html: withLineNumbers
|
|
41
52
|
? (0, utils_1.addLineNumbers)(highlightedCode, startLineNumber)
|
|
42
53
|
: highlightedCode,
|
|
@@ -57,11 +68,13 @@ function SourceCode(_a) {
|
|
|
57
68
|
}
|
|
58
69
|
}, [source, externalSource]);
|
|
59
70
|
if (withCopyButton) {
|
|
60
|
-
return (
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
71
|
+
return (react_1.default.createElement(CopyButton_1.CopyButtonWrapper, { data: sourceCode, onCopyClick: onCopyClick, "data-component-name": "SourceCode/SourceCode" }, function (_a) {
|
|
72
|
+
var renderCopyButton = _a.renderCopyButton;
|
|
73
|
+
return (react_1.default.createElement(SamplesPanelControls_1.SampleControlsWrap, null,
|
|
74
|
+
react_1.default.createElement(SamplesPanelControls_1.SampleControls, { "data-cy": "copy-button" }, renderCopyButton()),
|
|
75
|
+
react_1.default.createElement(Code, { lang: lang, source: sourceCode, withLineNumbers: withLineNumbers, startLineNumber: startLineNumber, dataTestId: dataTestId })));
|
|
76
|
+
}));
|
|
64
77
|
}
|
|
65
|
-
return (
|
|
78
|
+
return (react_1.default.createElement(Code, { dataTestId: dataTestId, lang: lang, source: sourceCode, withLineNumbers: withLineNumbers, startLineNumber: startLineNumber, "data-component-name": "SourceCode/SourceCode" }));
|
|
66
79
|
}
|
|
67
80
|
exports.SourceCode = SourceCode;
|
|
@@ -3,36 +3,46 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
5
|
};
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
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;
|
|
16
28
|
};
|
|
17
29
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
18
30
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
19
31
|
};
|
|
20
32
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
21
33
|
exports.TableOfContent = void 0;
|
|
22
|
-
var
|
|
23
|
-
var react_1 = require("react");
|
|
34
|
+
var react_1 = __importStar(require("react"));
|
|
24
35
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
25
36
|
var utils_1 = require("./utils");
|
|
26
37
|
var useFullHeight_1 = require("../hooks/useFullHeight");
|
|
27
|
-
var hooks_1 = require("../mocks/hooks");
|
|
28
38
|
var useActiveHeading_1 = require("../hooks/useActiveHeading");
|
|
29
|
-
var
|
|
39
|
+
var useDefaultThemeSettings_1 = require("../hooks/useDefaultThemeSettings");
|
|
30
40
|
function TableOfContent(props) {
|
|
31
41
|
var _a;
|
|
32
42
|
var headings = props.headings, tocMaxDepth = props.tocMaxDepth, contentWrapper = props.contentWrapper;
|
|
33
43
|
var sidebar = (0, react_1.useRef)(null);
|
|
34
44
|
(0, useFullHeight_1.useFullHeight)(sidebar);
|
|
35
|
-
var toc = (0,
|
|
45
|
+
var toc = (0, useDefaultThemeSettings_1.useDefaultThemeSettings)().toc;
|
|
36
46
|
var displayedHeadings = (0, utils_1.getDisplayedHeadings)(headings, tocMaxDepth);
|
|
37
47
|
var leastDepth = (0, utils_1.getLeastDepth)(displayedHeadings);
|
|
38
48
|
var activeHeadingId = (0, useActiveHeading_1.useActiveHeading)(contentWrapper, (0, utils_1.getDisplayedHeadingsIds)(displayedHeadings));
|
|
@@ -45,14 +55,17 @@ function TableOfContent(props) {
|
|
|
45
55
|
if (!(headings === null || headings === void 0 ? void 0 : headings.length)) {
|
|
46
56
|
return null;
|
|
47
57
|
}
|
|
48
|
-
return (
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
58
|
+
return (react_1.default.createElement(react_1.default.Fragment, null, headings && (react_1.default.createElement(TableOfContentMenu, { "data-component-name": "TableOfContent/TableOfContent" },
|
|
59
|
+
react_1.default.createElement(TableOfContentItems, { ref: sidebar },
|
|
60
|
+
react_1.default.createElement(TocHeader, null, ((_a = toc === null || toc === void 0 ? void 0 : toc.header) === null || _a === void 0 ? void 0 : _a.label) || 'On this page'),
|
|
61
|
+
displayedHeadings.map(function (heading, idx) {
|
|
62
|
+
// TODO: not sure about !heading
|
|
63
|
+
if (!heading) {
|
|
64
|
+
return null;
|
|
65
|
+
}
|
|
66
|
+
var href = '#' + heading.id;
|
|
67
|
+
return (react_1.default.createElement(MenuItem, { key: href + idx, href: href, depth: heading.depth - leastDepth + 1 || 0, className: activeHeadingId === heading.id ? 'active' : '', dangerouslySetInnerHTML: { __html: heading.value || '' }, "data-cy": "toc-".concat(heading.value) }));
|
|
68
|
+
}))))));
|
|
56
69
|
}
|
|
57
70
|
exports.TableOfContent = TableOfContent;
|
|
58
71
|
var TocHeader = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: var(--toc-heading-font-family);\n font-size: var(--toc-heading-font-size);\n font-weight: var(--toc-heading-font-weight);\n padding: var(--toc-item-padding-vertical) var(--toc-item-padding-horizontal);\n color: var(--toc-heading-text-color);\n text-transform: uppercase;\n"], ["\n font-family: var(--toc-heading-font-family);\n font-size: var(--toc-heading-font-size);\n font-weight: var(--toc-heading-font-weight);\n padding: var(--toc-item-padding-vertical) var(--toc-item-padding-horizontal);\n color: var(--toc-heading-text-color);\n text-transform: uppercase;\n"])));
|
package/Tooltip/Tooltip.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
1
2
|
import type { PropsWithChildren, ReactNode } from 'react';
|
|
2
3
|
export interface TooltipProps {
|
|
3
4
|
tip: string | ReactNode;
|
|
@@ -9,4 +10,4 @@ export interface TooltipProps {
|
|
|
9
10
|
dataTestId?: string;
|
|
10
11
|
}
|
|
11
12
|
export declare function TooltipComponent({ children, isOpen, tip, withArrow, placement, className, width, dataTestId, }: PropsWithChildren<TooltipProps>): JSX.Element;
|
|
12
|
-
export declare const Tooltip:
|
|
13
|
+
export declare const Tooltip: React.NamedExoticComponent<React.PropsWithChildren<TooltipProps>>;
|
package/Tooltip/Tooltip.js
CHANGED
|
@@ -39,8 +39,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
39
39
|
};
|
|
40
40
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
41
41
|
exports.Tooltip = exports.TooltipComponent = void 0;
|
|
42
|
-
var
|
|
43
|
-
var react_1 = require("react");
|
|
42
|
+
var react_1 = __importStar(require("react"));
|
|
44
43
|
var styled_components_1 = __importStar(require("styled-components"));
|
|
45
44
|
var hooks_1 = require("../hooks");
|
|
46
45
|
function TooltipComponent(_a) {
|
|
@@ -64,7 +63,9 @@ function TooltipComponent(_a) {
|
|
|
64
63
|
onMouseLeave: handleClose,
|
|
65
64
|
onClick: handleClose,
|
|
66
65
|
};
|
|
67
|
-
return (
|
|
66
|
+
return (react_1.default.createElement(TooltipWrapper, __assign({ ref: ref }, controllers, { className: "tooltip-".concat(className), "data-component-name": "Tooltip/Tooltip" }),
|
|
67
|
+
children,
|
|
68
|
+
isOpened && (react_1.default.createElement(TooltipBody, { "data-cy": dataTestId || (typeof tip === 'string' ? tip : ''), placement: placement, width: width, withArrow: withArrow }, tip))));
|
|
68
69
|
}
|
|
69
70
|
exports.TooltipComponent = TooltipComponent;
|
|
70
71
|
exports.Tooltip = (0, react_1.memo)(TooltipComponent);
|