@mongodb-js/compass-components 0.12.0 → 0.15.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/lib/compass-font-sizes.d.ts +1 -0
- package/lib/compass-font-sizes.d.ts.map +1 -1
- package/lib/compass-font-sizes.js +2 -1
- package/lib/compass-font-sizes.js.map +1 -1
- package/lib/compass-ui-colors.d.ts +2 -0
- package/lib/compass-ui-colors.d.ts.map +1 -1
- package/lib/compass-ui-colors.js +3 -1
- package/lib/compass-ui-colors.js.map +1 -1
- package/lib/components/accordion.d.ts +5 -3
- package/lib/components/accordion.d.ts.map +1 -1
- package/lib/components/accordion.js +21 -9
- package/lib/components/accordion.js.map +1 -1
- package/lib/components/bson-value.d.ts +40 -0
- package/lib/components/bson-value.d.ts.map +1 -0
- package/lib/components/bson-value.js +208 -0
- package/lib/components/bson-value.js.map +1 -0
- package/lib/components/cancel-loader.d.ts.map +1 -1
- package/lib/components/cancel-loader.js +15 -48
- package/lib/components/cancel-loader.js.map +1 -1
- package/lib/components/checkbox.d.ts +1 -1
- package/lib/components/checkbox.d.ts.map +1 -1
- package/lib/components/checkbox.js +2 -6
- package/lib/components/checkbox.js.map +1 -1
- package/lib/components/confirmation-modal.d.ts +1 -1
- package/lib/components/confirmation-modal.d.ts.map +1 -1
- package/lib/components/confirmation-modal.js +2 -5
- package/lib/components/confirmation-modal.js.map +1 -1
- package/lib/components/document-list/auto-focus-context.d.ts +9 -0
- package/lib/components/document-list/auto-focus-context.d.ts.map +1 -0
- package/lib/components/document-list/auto-focus-context.js +10 -0
- package/lib/components/document-list/auto-focus-context.js.map +1 -0
- package/lib/components/document-list/document-actions-group.d.ts +16 -0
- package/lib/components/document-list/document-actions-group.d.ts.map +1 -0
- package/lib/components/document-list/document-actions-group.js +95 -0
- package/lib/components/document-list/document-actions-group.js.map +1 -0
- package/lib/components/document-list/document-fields-toggle-group.d.ts +11 -0
- package/lib/components/document-list/document-fields-toggle-group.d.ts.map +1 -0
- package/lib/components/document-list/document-fields-toggle-group.js +69 -0
- package/lib/components/document-list/document-fields-toggle-group.js.map +1 -0
- package/lib/components/document-list/document.d.ts +12 -0
- package/lib/components/document-list/document.d.ts.map +1 -0
- package/lib/components/document-list/document.js +90 -0
- package/lib/components/document-list/document.js.map +1 -0
- package/lib/components/document-list/element-actions.d.ts +16 -0
- package/lib/components/document-list/element-actions.d.ts.map +1 -0
- package/lib/components/document-list/element-actions.js +94 -0
- package/lib/components/document-list/element-actions.js.map +1 -0
- package/lib/components/document-list/element-editors.d.ts +33 -0
- package/lib/components/document-list/element-editors.d.ts.map +1 -0
- package/lib/components/document-list/element-editors.js +143 -0
- package/lib/components/document-list/element-editors.js.map +1 -0
- package/lib/components/document-list/element.d.ts +12 -0
- package/lib/components/document-list/element.d.ts.map +1 -0
- package/lib/components/document-list/element.js +347 -0
- package/lib/components/document-list/element.js.map +1 -0
- package/lib/components/document-list/font-awesome-icon.d.ts +14 -0
- package/lib/components/document-list/font-awesome-icon.d.ts.map +1 -0
- package/lib/components/document-list/font-awesome-icon.js +29 -0
- package/lib/components/document-list/font-awesome-icon.js.map +1 -0
- package/lib/components/document-list/index.d.ts +4 -0
- package/lib/components/document-list/index.d.ts.map +1 -0
- package/lib/components/document-list/index.js +13 -0
- package/lib/components/document-list/index.js.map +1 -0
- package/lib/components/document-list/use-force-update.d.ts +2 -0
- package/lib/components/document-list/use-force-update.d.ts.map +1 -0
- package/lib/components/document-list/use-force-update.js +13 -0
- package/lib/components/document-list/use-force-update.js.map +1 -0
- package/lib/components/document-list/use-previous.d.ts +2 -0
- package/lib/components/document-list/use-previous.d.ts.map +1 -0
- package/lib/components/document-list/use-previous.js +13 -0
- package/lib/components/document-list/use-previous.js.map +1 -0
- package/lib/components/editor.d.ts +31 -0
- package/lib/components/editor.d.ts.map +1 -0
- package/lib/components/editor.js +62 -0
- package/lib/components/editor.js.map +1 -0
- package/lib/components/error-boundary.d.ts +2 -10
- package/lib/components/error-boundary.d.ts.map +1 -1
- package/lib/components/error-boundary.js +7 -3
- package/lib/components/error-boundary.js.map +1 -1
- package/lib/components/error-warning-summary.d.ts +22 -0
- package/lib/components/error-warning-summary.d.ts.map +1 -0
- package/lib/components/error-warning-summary.js +84 -0
- package/lib/components/error-warning-summary.js.map +1 -0
- package/lib/components/file-input.d.ts +16 -15
- package/lib/components/file-input.d.ts.map +1 -1
- package/lib/components/file-input.js +21 -13
- package/lib/components/file-input.js.map +1 -1
- package/lib/components/inline-definition.js +2 -2
- package/lib/components/inline-definition.js.map +1 -1
- package/lib/components/inline-info-link.js +3 -4
- package/lib/components/inline-info-link.js.map +1 -1
- package/lib/components/leafygreen.d.ts +63 -0
- package/lib/components/leafygreen.d.ts.map +1 -0
- package/lib/components/leafygreen.js +116 -0
- package/lib/components/leafygreen.js.map +1 -0
- package/lib/components/modal-title.d.ts +5 -0
- package/lib/components/modal-title.d.ts.map +1 -0
- package/lib/components/modal-title.js +18 -0
- package/lib/components/modal-title.js.map +1 -0
- package/lib/components/modal.d.ts +1 -1
- package/lib/components/modal.d.ts.map +1 -1
- package/lib/components/modal.js +2 -5
- package/lib/components/modal.js.map +1 -1
- package/lib/components/radio-box-group.d.ts +1 -1
- package/lib/components/radio-box-group.d.ts.map +1 -1
- package/lib/components/radio-box-group.js +2 -2
- package/lib/components/radio-box-group.js.map +1 -1
- package/lib/components/resize-handle.d.ts.map +1 -1
- package/lib/components/resize-handle.js +1 -0
- package/lib/components/resize-handle.js.map +1 -1
- package/lib/components/tab-nav-bar.d.ts +14 -0
- package/lib/components/tab-nav-bar.d.ts.map +1 -0
- package/lib/components/tab-nav-bar.js +47 -0
- package/lib/components/tab-nav-bar.js.map +1 -0
- package/lib/components/toggle.d.ts +1 -1
- package/lib/components/toggle.d.ts.map +1 -1
- package/lib/components/toggle.js +2 -2
- package/lib/components/toggle.js.map +1 -1
- package/lib/components/toolbar.d.ts +10 -0
- package/lib/components/toolbar.d.ts.map +1 -0
- package/lib/components/toolbar.js +25 -0
- package/lib/components/toolbar.js.map +1 -0
- package/lib/components/tooltip.d.ts +1 -1
- package/lib/components/tooltip.d.ts.map +1 -1
- package/lib/components/tooltip.js +2 -5
- package/lib/components/tooltip.js.map +1 -1
- package/lib/components/virtual-grid.d.ts +3 -2
- package/lib/components/virtual-grid.d.ts.map +1 -1
- package/lib/components/virtual-grid.js +5 -7
- package/lib/components/virtual-grid.js.map +1 -1
- package/lib/components/workspace-container.d.ts +8 -0
- package/lib/components/workspace-container.d.ts.map +1 -0
- package/lib/components/workspace-container.js +31 -0
- package/lib/components/workspace-container.js.map +1 -0
- package/lib/components/workspace-tabs/tab.d.ts +16 -0
- package/lib/components/workspace-tabs/tab.d.ts.map +1 -0
- package/lib/components/workspace-tabs/tab.js +223 -0
- package/lib/components/workspace-tabs/tab.js.map +1 -0
- package/lib/components/workspace-tabs/workspace-tabs.d.ts +24 -0
- package/lib/components/workspace-tabs/workspace-tabs.d.ts.map +1 -0
- package/lib/components/workspace-tabs/workspace-tabs.js +175 -0
- package/lib/components/workspace-tabs/workspace-tabs.js.map +1 -0
- package/lib/hooks/use-default-action.d.ts.map +1 -1
- package/lib/hooks/use-default-action.js +1 -5
- package/lib/hooks/use-default-action.js.map +1 -1
- package/lib/hooks/use-theme.d.ts +6 -2
- package/lib/hooks/use-theme.d.ts.map +1 -1
- package/lib/hooks/use-theme.js +15 -2
- package/lib/hooks/use-theme.js.map +1 -1
- package/lib/hooks/use-virtual-grid.d.ts +3 -6
- package/lib/hooks/use-virtual-grid.d.ts.map +1 -1
- package/lib/hooks/use-virtual-grid.js +72 -42
- package/lib/hooks/use-virtual-grid.js.map +1 -1
- package/lib/hooks/use-virtual-grid.test.js +7 -6
- package/lib/hooks/use-virtual-grid.test.js.map +1 -1
- package/lib/index.d.ts +19 -22
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +29 -60
- package/lib/index.js.map +1 -1
- package/package.json +28 -16
|
@@ -43,8 +43,8 @@ const GridWithHeader = (0, react_1.forwardRef)(function GridHeader({ style, chil
|
|
|
43
43
|
...style,
|
|
44
44
|
height: style.height + headerHeight,
|
|
45
45
|
}, ...props },
|
|
46
|
-
react_1.default.createElement("div", { className: classNames === null || classNames === void 0 ? void 0 : classNames.header }, react_1.default.createElement(renderHeader, {})),
|
|
47
|
-
react_1.default.createElement("div", { ...gridProps }, itemsCount === 0 && renderEmptyList
|
|
46
|
+
react_1.default.createElement("div", { style: { height: headerHeight }, className: classNames === null || classNames === void 0 ? void 0 : classNames.header }, react_1.default.createElement(renderHeader, {})),
|
|
47
|
+
react_1.default.createElement("div", { style: { height: style.height }, ...gridProps }, itemsCount === 0 && renderEmptyList
|
|
48
48
|
? react_1.default.createElement(renderEmptyList, {})
|
|
49
49
|
: children)));
|
|
50
50
|
});
|
|
@@ -100,7 +100,7 @@ const container = (0, emotion_1.css)({
|
|
|
100
100
|
const grid = (0, emotion_1.css)({
|
|
101
101
|
position: 'relative',
|
|
102
102
|
});
|
|
103
|
-
exports.VirtualGrid = (0, react_1.forwardRef)(function VirtualGrid({ itemMinWidth, itemHeight, itemsCount, colCount: _colCount, renderItem, headerHeight = 0, renderHeader = () => null, renderEmptyList, overscanCount = 3, classNames, itemKey, ...containerProps }, ref) {
|
|
103
|
+
exports.VirtualGrid = (0, react_1.forwardRef)(function VirtualGrid({ itemMinWidth, itemHeight, itemsCount, colCount: _colCount, renderItem, headerHeight = 0, renderHeader = () => null, renderEmptyList, overscanCount = 3, classNames, itemKey, resetActiveItemOnBlur, ...containerProps }, ref) {
|
|
104
104
|
const listRef = (0, react_1.useRef)(null);
|
|
105
105
|
const [rectProps, { width: _width, height }] = (0, use_dom_rect_1.useDOMRect)();
|
|
106
106
|
const width = Math.max(_width, itemMinWidth);
|
|
@@ -115,10 +115,8 @@ exports.VirtualGrid = (0, react_1.forwardRef)(function VirtualGrid({ itemMinWidt
|
|
|
115
115
|
itemsCount,
|
|
116
116
|
colCount,
|
|
117
117
|
rowCount,
|
|
118
|
-
});
|
|
119
|
-
const rovingFocusProps = (0, use_virtual_grid_1.useVirtualRovingTabIndex)({
|
|
120
|
-
currentTabbable,
|
|
121
118
|
onFocusMove,
|
|
119
|
+
resetActiveItemOnBlur,
|
|
122
120
|
});
|
|
123
121
|
const gridContainerProps = (0, merge_props_1.mergeProps)({ ref, className: (0, emotion_1.cx)(container, classNames === null || classNames === void 0 ? void 0 : classNames.container) }, containerProps, rectProps);
|
|
124
122
|
return (react_1.default.createElement(GridContext.Provider, { value: {
|
|
@@ -134,7 +132,7 @@ exports.VirtualGrid = (0, react_1.forwardRef)(function VirtualGrid({ itemMinWidt
|
|
|
134
132
|
role: 'grid',
|
|
135
133
|
'aria-rowcount': rowCount,
|
|
136
134
|
className: (0, emotion_1.cx)(grid, classNames === null || classNames === void 0 ? void 0 : classNames.grid),
|
|
137
|
-
}, navigationProps
|
|
135
|
+
}, navigationProps),
|
|
138
136
|
itemKey,
|
|
139
137
|
renderEmptyList,
|
|
140
138
|
} },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"virtual-grid.js","sourceRoot":"","sources":["../../src/components/virtual-grid.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,+CAOe;AACf,oDAAiD;AACjD,+CAA6C;AAC7C,wDAAmD;AACnD,
|
|
1
|
+
{"version":3,"file":"virtual-grid.js","sourceRoot":"","sources":["../../src/components/virtual-grid.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type WorkspaceContainerProps = {
|
|
3
|
+
darkMode?: boolean;
|
|
4
|
+
'data-test-id'?: string;
|
|
5
|
+
};
|
|
6
|
+
declare const WorkspaceContainer: React.ComponentType<WorkspaceContainerProps & React.HTMLProps<HTMLDivElement>>;
|
|
7
|
+
export { WorkspaceContainer };
|
|
8
|
+
//# sourceMappingURL=workspace-container.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"workspace-container.d.ts","sourceRoot":"","sources":["../../src/components/workspace-container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAwB1B,aAAK,uBAAuB,GAAG;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AA0BF,QAAA,MAAM,kBAAkB,gFAAwC,CAAC;AAEjE,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.WorkspaceContainer = void 0;
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const emotion_1 = require("@leafygreen-ui/emotion");
|
|
9
|
+
const palette_1 = require("@leafygreen-ui/palette");
|
|
10
|
+
const use_theme_1 = require("../hooks/use-theme");
|
|
11
|
+
const compass_ui_colors_1 = require("../compass-ui-colors");
|
|
12
|
+
const workspaceContainerStyles = (0, emotion_1.css)({
|
|
13
|
+
height: '100%',
|
|
14
|
+
width: '100%',
|
|
15
|
+
display: 'flex',
|
|
16
|
+
overflow: 'auto',
|
|
17
|
+
});
|
|
18
|
+
const lightThemeStyles = (0, emotion_1.css)({
|
|
19
|
+
backgroundColor: compass_ui_colors_1.gray8,
|
|
20
|
+
color: palette_1.uiColors.gray.dark2,
|
|
21
|
+
});
|
|
22
|
+
const darkThemeStyles = (0, emotion_1.css)({
|
|
23
|
+
backgroundColor: palette_1.uiColors.gray.dark3,
|
|
24
|
+
color: palette_1.uiColors.white,
|
|
25
|
+
});
|
|
26
|
+
function UnthemedWorkspaceContainer({ className, darkMode, children, 'data-test-id': dataTestId, ...props }) {
|
|
27
|
+
return (react_1.default.createElement("div", { className: (0, emotion_1.cx)(workspaceContainerStyles, darkMode ? darkThemeStyles : lightThemeStyles, className), "data-test-id": dataTestId, ...props }, children));
|
|
28
|
+
}
|
|
29
|
+
const WorkspaceContainer = (0, use_theme_1.withTheme)(UnthemedWorkspaceContainer);
|
|
30
|
+
exports.WorkspaceContainer = WorkspaceContainer;
|
|
31
|
+
//# sourceMappingURL=workspace-container.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"workspace-container.js","sourceRoot":"","sources":["../../src/components/workspace-container.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,oDAAiD;AACjD,oDAAkD;AAElD,kDAA+C;AAC/C,4DAA6C;AAE7C,MAAM,wBAAwB,GAAG,IAAA,aAAG,EAAC;IACnC,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;CACjB,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAAG,IAAA,aAAG,EAAC;IAC3B,eAAe,EAAE,yBAAK;IACtB,KAAK,EAAE,kBAAQ,CAAC,IAAI,CAAC,KAAK;CAC3B,CAAC,CAAC;AAEH,MAAM,eAAe,GAAG,IAAA,aAAG,EAAC;IAC1B,eAAe,EAAE,kBAAQ,CAAC,IAAI,CAAC,KAAK;IACpC,KAAK,EAAE,kBAAQ,CAAC,KAAK;CACtB,CAAC,CAAC;AAOH,SAAS,0BAA0B,CAAC,EAClC,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,cAAc,EAAE,UAAU,EAC1B,GAAG,KAAK,EAGT;IACC,OAAO,CACL,uCACE,SAAS,EAAE,IAAA,YAAE,EACX,wBAAwB,EACxB,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,EAC7C,SAAS,CACV,kBACa,UAAU,KACpB,KAAK,IAER,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,kBAAkB,GAAG,IAAA,qBAAS,EAAC,0BAA0B,CAAC,CAAC;AAExD,gDAAkB"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { glyphs } from '@leafygreen-ui/icon';
|
|
3
|
+
declare type IconGlyph = Extract<keyof typeof glyphs, string>;
|
|
4
|
+
declare type TabProps = {
|
|
5
|
+
title: string;
|
|
6
|
+
darkMode?: boolean;
|
|
7
|
+
isSelected: boolean;
|
|
8
|
+
onSelect: () => void;
|
|
9
|
+
onClose: () => void;
|
|
10
|
+
iconGlyph: IconGlyph;
|
|
11
|
+
tabContentId: string;
|
|
12
|
+
subtitle: string;
|
|
13
|
+
};
|
|
14
|
+
declare const Tab: React.ComponentType<TabProps>;
|
|
15
|
+
export { Tab };
|
|
16
|
+
//# sourceMappingURL=tab.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../../src/components/workspace-tabs/tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AA4LlD,aAAK,SAAS,GAAG,OAAO,CAAC,MAAM,OAAO,MAAM,EAAE,MAAM,CAAC,CAAC;AAEtD,aAAK,QAAQ,GAAG;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAoHF,QAAA,MAAM,GAAG,+BAAyB,CAAC;AAEnC,OAAO,EAAE,GAAG,EAAE,CAAC"}
|
|
@@ -0,0 +1,223 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
22
|
+
exports.Tab = void 0;
|
|
23
|
+
const react_1 = __importStar(require("react"));
|
|
24
|
+
const emotion_1 = require("@leafygreen-ui/emotion");
|
|
25
|
+
const palette_1 = require("@leafygreen-ui/palette");
|
|
26
|
+
const tokens_1 = require("@leafygreen-ui/tokens");
|
|
27
|
+
const use_theme_1 = require("../../hooks/use-theme");
|
|
28
|
+
const compass_font_sizes_1 = require("../../compass-font-sizes");
|
|
29
|
+
const use_focus_hover_1 = require("../../hooks/use-focus-hover");
|
|
30
|
+
const leafygreen_1 = require("../leafygreen");
|
|
31
|
+
const merge_props_1 = require("../../utils/merge-props");
|
|
32
|
+
const use_default_action_1 = require("../../hooks/use-default-action");
|
|
33
|
+
const tabStyles = (0, emotion_1.css)({
|
|
34
|
+
border: '1px solid',
|
|
35
|
+
borderTopWidth: 0,
|
|
36
|
+
borderBottomWidth: 0,
|
|
37
|
+
transition: 'border-color .16s ease-out',
|
|
38
|
+
display: 'inline-flex',
|
|
39
|
+
flexDirection: 'row',
|
|
40
|
+
alignItems: 'center',
|
|
41
|
+
margin: 0,
|
|
42
|
+
paddingRight: tokens_1.spacing[1],
|
|
43
|
+
paddingLeft: tokens_1.spacing[3],
|
|
44
|
+
maxWidth: tokens_1.spacing[6] * 3,
|
|
45
|
+
minWidth: tokens_1.spacing[6] * 2,
|
|
46
|
+
position: 'relative',
|
|
47
|
+
color: palette_1.uiColors.gray.base,
|
|
48
|
+
outline: 'none',
|
|
49
|
+
'&:hover': {
|
|
50
|
+
cursor: 'pointer',
|
|
51
|
+
zIndex: 1,
|
|
52
|
+
transition: 'border-color .16s ease-in',
|
|
53
|
+
},
|
|
54
|
+
':not(:first-child)': {
|
|
55
|
+
marginLeft: '-1px',
|
|
56
|
+
},
|
|
57
|
+
});
|
|
58
|
+
const tabLightThemeStyles = (0, emotion_1.css)({
|
|
59
|
+
background: palette_1.uiColors.white,
|
|
60
|
+
borderColor: palette_1.uiColors.gray.light2,
|
|
61
|
+
'&:hover': {
|
|
62
|
+
borderColor: palette_1.uiColors.gray.light1,
|
|
63
|
+
},
|
|
64
|
+
});
|
|
65
|
+
const tabDarkThemeStyles = (0, emotion_1.css)({
|
|
66
|
+
backgroundColor: palette_1.uiColors.gray.dark3,
|
|
67
|
+
borderColor: palette_1.uiColors.gray.dark2,
|
|
68
|
+
'&:hover': {
|
|
69
|
+
borderColor: palette_1.uiColors.gray.dark1,
|
|
70
|
+
},
|
|
71
|
+
});
|
|
72
|
+
const selectedTabStyles = (0, emotion_1.css)({
|
|
73
|
+
'&:hover': {
|
|
74
|
+
cursor: 'default',
|
|
75
|
+
},
|
|
76
|
+
});
|
|
77
|
+
const focusedTabStyles = (0, emotion_1.css)({
|
|
78
|
+
zIndex: 3,
|
|
79
|
+
borderColor: palette_1.uiColors.focus,
|
|
80
|
+
'&::after': {
|
|
81
|
+
position: 'absolute',
|
|
82
|
+
content: '""',
|
|
83
|
+
top: 0,
|
|
84
|
+
right: 0,
|
|
85
|
+
left: 0,
|
|
86
|
+
height: '1px',
|
|
87
|
+
backgroundColor: palette_1.uiColors.focus,
|
|
88
|
+
},
|
|
89
|
+
});
|
|
90
|
+
const tabBottomBorderStyles = (0, emotion_1.css)({
|
|
91
|
+
position: 'absolute',
|
|
92
|
+
bottom: 0,
|
|
93
|
+
left: '-1px',
|
|
94
|
+
right: '-1px',
|
|
95
|
+
height: 0,
|
|
96
|
+
backgroundColor: palette_1.uiColors.green.dark1,
|
|
97
|
+
});
|
|
98
|
+
const selectedTabBottomBorderStyles = (0, emotion_1.css)({
|
|
99
|
+
height: `${tokens_1.spacing[1]}px`,
|
|
100
|
+
backgroundColor: palette_1.uiColors.green.base,
|
|
101
|
+
transition: 'height 150ms ease-out',
|
|
102
|
+
});
|
|
103
|
+
const focusedTabBottomBorderStyles = (0, emotion_1.css)({
|
|
104
|
+
height: `${tokens_1.spacing[1]}px`,
|
|
105
|
+
backgroundColor: palette_1.uiColors.focus,
|
|
106
|
+
transition: 'height 150ms ease-out',
|
|
107
|
+
});
|
|
108
|
+
const hiddenStyles = (0, emotion_1.css)({
|
|
109
|
+
visibility: 'hidden',
|
|
110
|
+
});
|
|
111
|
+
const tabIconStyles = (0, emotion_1.css)({
|
|
112
|
+
width: tokens_1.spacing[1] + tokens_1.spacing[2],
|
|
113
|
+
height: 'auto',
|
|
114
|
+
flexShrink: 0,
|
|
115
|
+
gridArea: 'icon',
|
|
116
|
+
alignSelf: 'center',
|
|
117
|
+
});
|
|
118
|
+
const tabIconSelectedLightThemeStyles = (0, emotion_1.css)({
|
|
119
|
+
color: palette_1.uiColors.green.dark2,
|
|
120
|
+
});
|
|
121
|
+
const tabIconSelectedDarkThemeStyles = (0, emotion_1.css)({
|
|
122
|
+
color: palette_1.uiColors.green.light2,
|
|
123
|
+
});
|
|
124
|
+
const tabIconFocusedStyles = (0, emotion_1.css)({
|
|
125
|
+
color: palette_1.uiColors.focus,
|
|
126
|
+
});
|
|
127
|
+
const tabTitleContainerStyles = (0, emotion_1.css)({
|
|
128
|
+
marginRight: tokens_1.spacing[1],
|
|
129
|
+
display: 'inline-grid',
|
|
130
|
+
paddingTop: tokens_1.spacing[2],
|
|
131
|
+
paddingBottom: tokens_1.spacing[1] + tokens_1.spacing[2],
|
|
132
|
+
gridTemplateAreas: `
|
|
133
|
+
'icon tabName'
|
|
134
|
+
'empty namespace'
|
|
135
|
+
`,
|
|
136
|
+
columnGap: tokens_1.spacing[2],
|
|
137
|
+
rowGap: 0,
|
|
138
|
+
});
|
|
139
|
+
const tabTitleStyles = (0, emotion_1.css)({
|
|
140
|
+
whiteSpace: 'nowrap',
|
|
141
|
+
textOverflow: 'ellipsis',
|
|
142
|
+
overflow: 'hidden',
|
|
143
|
+
fontWeight: 'bold',
|
|
144
|
+
fontSize: compass_font_sizes_1.smallFontSize,
|
|
145
|
+
gridArea: 'tabName',
|
|
146
|
+
});
|
|
147
|
+
const tabTitleDarkThemeStyles = (0, emotion_1.css)({
|
|
148
|
+
color: palette_1.uiColors.gray.base,
|
|
149
|
+
});
|
|
150
|
+
const tabTitleLightThemeStyles = (0, emotion_1.css)({
|
|
151
|
+
color: palette_1.uiColors.gray.base,
|
|
152
|
+
});
|
|
153
|
+
const tabTitleSelectedDarkThemeStyles = (0, emotion_1.css)({
|
|
154
|
+
color: palette_1.uiColors.green.light2,
|
|
155
|
+
});
|
|
156
|
+
const tabTitleSelectedLightThemeStyles = (0, emotion_1.css)({
|
|
157
|
+
color: palette_1.uiColors.green.dark2,
|
|
158
|
+
});
|
|
159
|
+
const tabTitleFocusedStyles = (0, emotion_1.css)({
|
|
160
|
+
color: palette_1.uiColors.focus,
|
|
161
|
+
});
|
|
162
|
+
const tabSubtitleStyles = (0, emotion_1.css)({
|
|
163
|
+
whiteSpace: 'nowrap',
|
|
164
|
+
textOverflow: 'ellipsis',
|
|
165
|
+
overflow: 'hidden',
|
|
166
|
+
fontSize: compass_font_sizes_1.smallFontSize,
|
|
167
|
+
lineHeight: `${tokens_1.spacing[3]}px`,
|
|
168
|
+
gridArea: 'namespace',
|
|
169
|
+
});
|
|
170
|
+
const tabSubtitleLightThemeStyles = (0, emotion_1.css)({
|
|
171
|
+
color: palette_1.uiColors.gray.base,
|
|
172
|
+
});
|
|
173
|
+
const tabSubtitleDarkThemeStyles = (0, emotion_1.css)({
|
|
174
|
+
color: palette_1.uiColors.gray.light1,
|
|
175
|
+
});
|
|
176
|
+
const tabSubtitleSelectedLightThemeStyles = (0, emotion_1.css)({
|
|
177
|
+
color: palette_1.uiColors.gray.dark1,
|
|
178
|
+
});
|
|
179
|
+
const tabSubtitleSelectedDarkThemeStyles = (0, emotion_1.css)({
|
|
180
|
+
color: palette_1.uiColors.gray.light2,
|
|
181
|
+
});
|
|
182
|
+
function UnthemedTab({ darkMode, title, isSelected, onSelect, onClose, tabContentId, iconGlyph, subtitle, }) {
|
|
183
|
+
const [focusProps, focusState] = (0, use_focus_hover_1.useFocusState)();
|
|
184
|
+
const isFocused = (0, react_1.useMemo)(() => focusState === use_focus_hover_1.FocusState.FocusVisible, [focusState]);
|
|
185
|
+
const isFocusedWithin = (0, react_1.useMemo)(() => focusState === use_focus_hover_1.FocusState.FocusWithinVisible, [focusState]);
|
|
186
|
+
const defaultActionProps = (0, use_default_action_1.useDefaultAction)(onSelect);
|
|
187
|
+
const [hoverProps, isHovered] = (0, use_focus_hover_1.useHoverState)();
|
|
188
|
+
const tabProps = (0, merge_props_1.mergeProps)(focusProps, hoverProps, defaultActionProps);
|
|
189
|
+
return (react_1.default.createElement("div", { className: (0, emotion_1.cx)(tabStyles, darkMode ? tabDarkThemeStyles : tabLightThemeStyles, {
|
|
190
|
+
[selectedTabStyles]: isSelected,
|
|
191
|
+
[focusedTabStyles]: isFocused,
|
|
192
|
+
}), "aria-selected": isSelected, role: "tab", tabIndex: isSelected ? 0 : -1, "aria-controls": tabContentId, "data-test-id": "workspace-tab-button", title: `${subtitle} - ${title}`, ...tabProps },
|
|
193
|
+
react_1.default.createElement("div", { className: tabTitleContainerStyles },
|
|
194
|
+
react_1.default.createElement(leafygreen_1.Icon, { size: "small", role: "presentation", className: (0, emotion_1.cx)(tabIconStyles, {
|
|
195
|
+
[darkMode
|
|
196
|
+
? tabIconSelectedDarkThemeStyles
|
|
197
|
+
: tabIconSelectedLightThemeStyles]: isSelected,
|
|
198
|
+
[tabIconFocusedStyles]: isFocused,
|
|
199
|
+
}), glyph: iconGlyph, "data-testid": `workspace-tab-icon-${iconGlyph}` }),
|
|
200
|
+
react_1.default.createElement("div", { className: (0, emotion_1.cx)(tabTitleStyles, darkMode ? tabTitleDarkThemeStyles : tabTitleLightThemeStyles, {
|
|
201
|
+
[darkMode
|
|
202
|
+
? tabTitleSelectedDarkThemeStyles
|
|
203
|
+
: tabTitleSelectedLightThemeStyles]: isSelected,
|
|
204
|
+
[tabTitleFocusedStyles]: isFocused,
|
|
205
|
+
}) }, title),
|
|
206
|
+
react_1.default.createElement(leafygreen_1.Body, { className: (0, emotion_1.cx)(tabSubtitleStyles, darkMode ? tabSubtitleDarkThemeStyles : tabSubtitleLightThemeStyles, {
|
|
207
|
+
[darkMode
|
|
208
|
+
? tabSubtitleSelectedDarkThemeStyles
|
|
209
|
+
: tabSubtitleSelectedLightThemeStyles]: isSelected,
|
|
210
|
+
}) }, subtitle)),
|
|
211
|
+
react_1.default.createElement(leafygreen_1.IconButton, { className: isFocusedWithin || isFocused || isHovered ? undefined : hiddenStyles, onClick: (e) => {
|
|
212
|
+
e.stopPropagation();
|
|
213
|
+
onClose();
|
|
214
|
+
}, "aria-label": "Close Tab", "data-testid": "close-workspace-tab" },
|
|
215
|
+
react_1.default.createElement(leafygreen_1.Icon, { glyph: "X", role: "presentation" })),
|
|
216
|
+
react_1.default.createElement("div", { className: (0, emotion_1.cx)(tabBottomBorderStyles, {
|
|
217
|
+
[selectedTabBottomBorderStyles]: isSelected,
|
|
218
|
+
[focusedTabBottomBorderStyles]: isFocused,
|
|
219
|
+
}) })));
|
|
220
|
+
}
|
|
221
|
+
const Tab = (0, use_theme_1.withTheme)(UnthemedTab);
|
|
222
|
+
exports.Tab = Tab;
|
|
223
|
+
//# sourceMappingURL=tab.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/components/workspace-tabs/tab.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { glyphs } from '@leafygreen-ui/icon';
|
|
3
|
+
declare type WorkspaceTabsProps = {
|
|
4
|
+
'aria-label': string;
|
|
5
|
+
darkMode?: boolean;
|
|
6
|
+
onCreateNewTab: () => void;
|
|
7
|
+
onSelectTab: (tabIndex: number) => void;
|
|
8
|
+
onCloseTab: (tabIndex: number) => void;
|
|
9
|
+
onMoveTab: (oldTabIndex: number, newTabIndex: number) => void;
|
|
10
|
+
tabs: TabProps[];
|
|
11
|
+
selectedTabIndex: number;
|
|
12
|
+
};
|
|
13
|
+
export declare type TabProps = {
|
|
14
|
+
subtitle: string;
|
|
15
|
+
tabContentId: string;
|
|
16
|
+
title: string;
|
|
17
|
+
iconGlyph: Extract<keyof typeof glyphs, string>;
|
|
18
|
+
};
|
|
19
|
+
export declare function useRovingTabIndex<T extends HTMLElement = HTMLElement>({ currentTabbable, }: {
|
|
20
|
+
currentTabbable: number;
|
|
21
|
+
}): React.HTMLProps<T>;
|
|
22
|
+
declare const WorkspaceTabs: React.ComponentType<WorkspaceTabsProps>;
|
|
23
|
+
export { WorkspaceTabs };
|
|
24
|
+
//# sourceMappingURL=workspace-tabs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"workspace-tabs.d.ts","sourceRoot":"","sources":["../../../src/components/workspace-tabs/workspace-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAKvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AA0MlD,aAAK,kBAAkB,GAAG;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,SAAS,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,gBAAgB,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,OAAO,CAAC,MAAM,OAAO,MAAM,EAAE,MAAM,CAAC,CAAC;CACjD,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,EACrE,eAAe,GAChB,EAAE;IACD,eAAe,EAAE,MAAM,CAAC;CACzB,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAyBrB;AA4ED,QAAA,MAAM,aAAa,yCAAmC,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
22
|
+
exports.WorkspaceTabs = exports.useRovingTabIndex = void 0;
|
|
23
|
+
const react_1 = __importStar(require("react"));
|
|
24
|
+
const emotion_1 = require("@leafygreen-ui/emotion");
|
|
25
|
+
const palette_1 = require("@leafygreen-ui/palette");
|
|
26
|
+
const tokens_1 = require("@leafygreen-ui/tokens");
|
|
27
|
+
const react_sortable_hoc_1 = require("react-sortable-hoc");
|
|
28
|
+
const use_theme_1 = require("../../hooks/use-theme");
|
|
29
|
+
const use_focus_hover_1 = require("../../hooks/use-focus-hover");
|
|
30
|
+
const leafygreen_1 = require("../leafygreen");
|
|
31
|
+
const merge_props_1 = require("../../utils/merge-props");
|
|
32
|
+
const compass_ui_colors_1 = require("../../compass-ui-colors");
|
|
33
|
+
const tab_1 = require("./tab");
|
|
34
|
+
const tabsContainerStyles = (0, emotion_1.css)({
|
|
35
|
+
margin: 0,
|
|
36
|
+
padding: 0,
|
|
37
|
+
flexShrink: 0,
|
|
38
|
+
position: 'relative',
|
|
39
|
+
overflow: 'overlay',
|
|
40
|
+
whiteSpace: 'nowrap',
|
|
41
|
+
borderBottom: '1px solid',
|
|
42
|
+
'::-webkit-scrollbar': {
|
|
43
|
+
':horizontal': {
|
|
44
|
+
height: tokens_1.spacing[1],
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
});
|
|
48
|
+
const tabsContainerLightStyles = (0, emotion_1.css)({
|
|
49
|
+
background: palette_1.uiColors.white,
|
|
50
|
+
borderBottomColor: palette_1.uiColors.gray.light2,
|
|
51
|
+
'::-webkit-scrollbar-thumb': {
|
|
52
|
+
backgroundColor: compass_ui_colors_1.scrollbarThumbLightTheme,
|
|
53
|
+
},
|
|
54
|
+
});
|
|
55
|
+
const tabsContainerDarkStyles = (0, emotion_1.css)({
|
|
56
|
+
backgroundColor: palette_1.uiColors.gray.dark3,
|
|
57
|
+
borderBottomColor: palette_1.uiColors.gray.dark2,
|
|
58
|
+
'::-webkit-scrollbar-thumb': {
|
|
59
|
+
backgroundColor: compass_ui_colors_1.scrollbarThumbDarkTheme,
|
|
60
|
+
},
|
|
61
|
+
});
|
|
62
|
+
const tabsListContainerStyles = (0, emotion_1.css)({
|
|
63
|
+
padding: 0,
|
|
64
|
+
paddingLeft: tokens_1.spacing[3],
|
|
65
|
+
paddingRight: tokens_1.spacing[4],
|
|
66
|
+
display: 'flex',
|
|
67
|
+
flexDirection: 'row',
|
|
68
|
+
alignItems: 'center',
|
|
69
|
+
});
|
|
70
|
+
const tabsListStyles = (0, emotion_1.css)({
|
|
71
|
+
display: 'inline-flex',
|
|
72
|
+
});
|
|
73
|
+
const newTabContainerStyles = (0, emotion_1.css)({
|
|
74
|
+
display: 'inline-flex',
|
|
75
|
+
flexDirection: 'row',
|
|
76
|
+
alignItems: 'center',
|
|
77
|
+
});
|
|
78
|
+
const createNewTabButtonStyles = (0, emotion_1.css)({
|
|
79
|
+
marginLeft: tokens_1.spacing[2],
|
|
80
|
+
marginRight: tokens_1.spacing[2],
|
|
81
|
+
});
|
|
82
|
+
const sortableItemContainerStyles = (0, emotion_1.css)({
|
|
83
|
+
display: 'inline-flex',
|
|
84
|
+
});
|
|
85
|
+
const workspaceTabsSortableCloneStyles = (0, emotion_1.css)({
|
|
86
|
+
pointerEvents: 'auto !important',
|
|
87
|
+
cursor: 'grabbing !important',
|
|
88
|
+
zIndex: 50,
|
|
89
|
+
});
|
|
90
|
+
function useTabListKeyboardNavigation({ tabsCount, onSelectTab, selectedTabIndex, }) {
|
|
91
|
+
const onKeyDown = (0, react_1.useCallback)((evt) => {
|
|
92
|
+
let nextTabbable = -1;
|
|
93
|
+
if (evt.key === 'ArrowLeft') {
|
|
94
|
+
evt.stopPropagation();
|
|
95
|
+
nextTabbable = selectedTabIndex - 1;
|
|
96
|
+
}
|
|
97
|
+
if (evt.key === 'ArrowRight') {
|
|
98
|
+
evt.stopPropagation();
|
|
99
|
+
nextTabbable = selectedTabIndex + 1;
|
|
100
|
+
}
|
|
101
|
+
if (evt.key === 'Home') {
|
|
102
|
+
evt.preventDefault();
|
|
103
|
+
evt.stopPropagation();
|
|
104
|
+
nextTabbable = 0;
|
|
105
|
+
}
|
|
106
|
+
if (evt.key === 'End') {
|
|
107
|
+
evt.preventDefault();
|
|
108
|
+
evt.stopPropagation();
|
|
109
|
+
nextTabbable = tabsCount - 1;
|
|
110
|
+
}
|
|
111
|
+
if (tabsCount > 0 &&
|
|
112
|
+
nextTabbable !== selectedTabIndex &&
|
|
113
|
+
nextTabbable >= 0 &&
|
|
114
|
+
nextTabbable < tabsCount) {
|
|
115
|
+
onSelectTab(nextTabbable);
|
|
116
|
+
}
|
|
117
|
+
}, [selectedTabIndex, tabsCount, onSelectTab]);
|
|
118
|
+
return [{ onKeyDown }];
|
|
119
|
+
}
|
|
120
|
+
const SortableItem = (0, react_sortable_hoc_1.SortableElement)(({ tab: { tabContentId, iconGlyph, subtitle, title }, tabIndex, selectedTabIndex, onSelect, onClose, }) => {
|
|
121
|
+
const onTabSelected = (0, react_1.useCallback)(() => {
|
|
122
|
+
onSelect(tabIndex);
|
|
123
|
+
}, [onSelect, tabIndex]);
|
|
124
|
+
const onTabClosed = (0, react_1.useCallback)(() => {
|
|
125
|
+
onClose(tabIndex);
|
|
126
|
+
}, [onClose, tabIndex]);
|
|
127
|
+
const isSelected = (0, react_1.useMemo)(() => selectedTabIndex === tabIndex, [selectedTabIndex, tabIndex]);
|
|
128
|
+
return (react_1.default.createElement(tab_1.Tab, { title: title, isSelected: isSelected, iconGlyph: iconGlyph, tabContentId: tabContentId, subtitle: subtitle, onSelect: onTabSelected, onClose: onTabClosed }));
|
|
129
|
+
});
|
|
130
|
+
const SortableList = (0, react_sortable_hoc_1.SortableContainer)(({ tabs, onSelect, onClose, selectedTabIndex }) => (react_1.default.createElement("div", { className: sortableItemContainerStyles }, tabs.map((tab, index) => (react_1.default.createElement(SortableItem, { key: `tab-${index}-${tab.subtitle}`, index: index, tabIndex: index, tab: tab, onSelect: onSelect, onClose: onClose, selectedTabIndex: selectedTabIndex }))))));
|
|
131
|
+
function useRovingTabIndex({ currentTabbable, }) {
|
|
132
|
+
const rootNode = (0, react_1.useRef)(null);
|
|
133
|
+
const [focusProps, focusState] = (0, use_focus_hover_1.useFocusState)();
|
|
134
|
+
const focusTabbable = (0, react_1.useCallback)(() => {
|
|
135
|
+
var _a, _b;
|
|
136
|
+
const selector = `[role="tab"]:nth-child(${currentTabbable + 1})`;
|
|
137
|
+
(_b = (_a = rootNode.current) === null || _a === void 0 ? void 0 : _a.querySelector(selector)) === null || _b === void 0 ? void 0 : _b.focus();
|
|
138
|
+
}, [rootNode, currentTabbable]);
|
|
139
|
+
(0, react_1.useEffect)(() => {
|
|
140
|
+
if ([
|
|
141
|
+
use_focus_hover_1.FocusState.Focus,
|
|
142
|
+
use_focus_hover_1.FocusState.FocusVisible,
|
|
143
|
+
use_focus_hover_1.FocusState.FocusWithin,
|
|
144
|
+
use_focus_hover_1.FocusState.FocusWithinVisible,
|
|
145
|
+
].includes(focusState)) {
|
|
146
|
+
focusTabbable();
|
|
147
|
+
}
|
|
148
|
+
}, [focusState, focusTabbable]);
|
|
149
|
+
return { ref: rootNode, ...focusProps };
|
|
150
|
+
}
|
|
151
|
+
exports.useRovingTabIndex = useRovingTabIndex;
|
|
152
|
+
function UnthemedWorkspaceTabs({ ['aria-label']: ariaLabel, darkMode, onCreateNewTab, onCloseTab, onMoveTab, onSelectTab, tabs, selectedTabIndex, }) {
|
|
153
|
+
const rovingFocusProps = useRovingTabIndex({
|
|
154
|
+
currentTabbable: selectedTabIndex,
|
|
155
|
+
});
|
|
156
|
+
const [navigationProps] = useTabListKeyboardNavigation({
|
|
157
|
+
selectedTabIndex,
|
|
158
|
+
onSelectTab,
|
|
159
|
+
tabsCount: tabs.length,
|
|
160
|
+
});
|
|
161
|
+
const tabContainerProps = (0, merge_props_1.mergeProps)(rovingFocusProps, navigationProps);
|
|
162
|
+
const onSortEnd = (0, react_1.useCallback)(({ oldIndex, newIndex }) => {
|
|
163
|
+
onMoveTab(oldIndex, newIndex);
|
|
164
|
+
}, [onMoveTab]);
|
|
165
|
+
return (react_1.default.createElement("div", { className: (0, emotion_1.cx)(tabsContainerStyles, darkMode ? tabsContainerDarkStyles : tabsContainerLightStyles) },
|
|
166
|
+
react_1.default.createElement("div", { className: tabsListContainerStyles },
|
|
167
|
+
react_1.default.createElement("div", { className: tabsListStyles, role: "tablist", "aria-label": ariaLabel, "aria-orientation": "horizontal", ...tabContainerProps },
|
|
168
|
+
react_1.default.createElement(SortableList, { onClose: onCloseTab, onSelect: onSelectTab, tabs: tabs, selectedTabIndex: selectedTabIndex, axis: "x", lockAxis: "x", lockToContainerEdges: true, lockOffset: "0%", distance: 10, onSortEnd: onSortEnd, helperClass: workspaceTabsSortableCloneStyles })),
|
|
169
|
+
react_1.default.createElement("div", { className: newTabContainerStyles },
|
|
170
|
+
react_1.default.createElement(leafygreen_1.IconButton, { className: createNewTabButtonStyles, "aria-label": "Create new tab", onClick: onCreateNewTab },
|
|
171
|
+
react_1.default.createElement(leafygreen_1.Icon, { role: "presentation", glyph: "Plus" }))))));
|
|
172
|
+
}
|
|
173
|
+
const WorkspaceTabs = (0, use_theme_1.withTheme)(UnthemedWorkspaceTabs);
|
|
174
|
+
exports.WorkspaceTabs = WorkspaceTabs;
|
|
175
|
+
//# sourceMappingURL=workspace-tabs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"workspace-tabs.js","sourceRoot":"","sources":["../../../src/components/workspace-tabs/workspace-tabs.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-default-action.d.ts","sourceRoot":"","sources":["../../src/hooks/use-default-action.ts"],"names":[],"mappings":";AAUA,wBAAgB,gBAAgB,CAAC,CAAC,EAChC,eAAe,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,GAC3E,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"use-default-action.d.ts","sourceRoot":"","sources":["../../src/hooks/use-default-action.ts"],"names":[],"mappings":";AAUA,wBAAgB,gBAAgB,CAAC,CAAC,EAChC,eAAe,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,GAC3E,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAyBzB"}
|
|
@@ -3,10 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.useDefaultAction = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
5
|
function useDefaultAction(onDefaultAction) {
|
|
6
|
-
const onMouseDown = (0, react_1.useCallback)((evt) => {
|
|
7
|
-
evt.preventDefault();
|
|
8
|
-
evt.stopPropagation();
|
|
9
|
-
}, []);
|
|
10
6
|
const onClick = (0, react_1.useCallback)((evt) => {
|
|
11
7
|
evt.stopPropagation();
|
|
12
8
|
onDefaultAction(evt);
|
|
@@ -19,7 +15,7 @@ function useDefaultAction(onDefaultAction) {
|
|
|
19
15
|
onDefaultAction(evt);
|
|
20
16
|
}
|
|
21
17
|
}, [onDefaultAction]);
|
|
22
|
-
return {
|
|
18
|
+
return { onClick, onKeyDown };
|
|
23
19
|
}
|
|
24
20
|
exports.useDefaultAction = useDefaultAction;
|
|
25
21
|
//# sourceMappingURL=use-default-action.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-default-action.js","sourceRoot":"","sources":["../../src/hooks/use-default-action.ts"],"names":[],"mappings":";;;AAAA,iCAAoC;AAUpC,SAAgB,gBAAgB,CAC9B,eAA4E;
|
|
1
|
+
{"version":3,"file":"use-default-action.js","sourceRoot":"","sources":["../../src/hooks/use-default-action.ts"],"names":[],"mappings":";;;AAAA,iCAAoC;AAUpC,SAAgB,gBAAgB,CAC9B,eAA4E;IAE5E,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,CAAC,GAAwB,EAAE,EAAE;QAC3B,GAAG,CAAC,eAAe,EAAE,CAAC;QACtB,eAAe,CAAC,GAAG,CAAC,CAAC;IACvB,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,MAAM,SAAS,GAAG,IAAA,mBAAW,EAC3B,CAAC,GAA2B,EAAE,EAAE;QAC9B,IAEE,GAAG,CAAC,MAAM,KAAK,GAAG,CAAC,aAAa;YAChC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,EAChC;YACA,GAAG,CAAC,cAAc,EAAE,CAAC;YACrB,GAAG,CAAC,eAAe,EAAE,CAAC;YACtB,eAAe,CAAC,GAAG,CAAC,CAAC;SACtB;IACH,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC;AAChC,CAAC;AA3BD,4CA2BC"}
|
package/lib/hooks/use-theme.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
2
|
+
declare enum Theme {
|
|
3
3
|
Light = "Light",
|
|
4
4
|
Dark = "Dark"
|
|
5
5
|
}
|
|
@@ -11,5 +11,9 @@ declare const ThemeProvider: ({ children, theme, }: {
|
|
|
11
11
|
theme: ThemeState;
|
|
12
12
|
}) => React.ReactElement;
|
|
13
13
|
declare function useTheme(): ThemeState;
|
|
14
|
-
|
|
14
|
+
interface WithThemeProps {
|
|
15
|
+
darkMode?: boolean;
|
|
16
|
+
}
|
|
17
|
+
declare const withTheme: <ComponentProps extends WithThemeProps = WithThemeProps>(WrappedComponent: React.ComponentType<ComponentProps & WithThemeProps>) => React.ComponentType<ComponentProps>;
|
|
18
|
+
export { Theme, ThemeProvider, useTheme, withTheme };
|
|
15
19
|
//# sourceMappingURL=use-theme.d.ts.map
|