@teambit/code.ui.code-tab-page 0.0.567 → 0.0.570
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/code-tab-page.module.scss +1 -1
- package/code-tab-page.tsx +29 -5
- package/dist/code-tab-page.js +22 -3
- package/dist/code-tab-page.js.map +1 -1
- package/dist/code-tab-page.module.scss +1 -1
- package/dist/tsconfig.json +32 -0
- package/package-tar/teambit-code.ui.code-tab-page-0.0.570.tgz +0 -0
- package/package.json +12 -8
- package/preview-1656386921357.js +5 -0
- package/tsconfig.json +6 -1
- package/package-tar/teambit-code.ui.code-tab-page-0.0.567.tgz +0 -0
- package/preview-1653827208409.js +0 -1
package/code-tab-page.tsx
CHANGED
|
@@ -2,16 +2,21 @@ import { ComponentContext } from '@teambit/component';
|
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import React, { useContext, useState, HTMLAttributes, useMemo } from 'react';
|
|
4
4
|
import { flatten } from 'lodash';
|
|
5
|
+
import { Label } from '@teambit/documenter.ui.label';
|
|
5
6
|
import { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';
|
|
6
7
|
import { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';
|
|
7
8
|
import { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';
|
|
8
9
|
import { useCode } from '@teambit/code.ui.queries.get-component-code';
|
|
9
|
-
import { getFileIcon, FileIconMatch } from '@teambit/code.ui.utils.get-file-icon';
|
|
10
10
|
import type { FileIconSlot } from '@teambit/code';
|
|
11
11
|
import { CodeView } from '@teambit/code.ui.code-view';
|
|
12
12
|
import { CodeTabTree } from '@teambit/code.ui.code-tab-tree';
|
|
13
|
-
import { useCodeParams } from '@teambit/code.ui.hooks.use-code-params';
|
|
14
13
|
import { useIsMobile } from '@teambit/ui-foundation.ui.hooks.use-is-mobile';
|
|
14
|
+
import { WidgetProps } from '@teambit/ui-foundation.ui.tree.tree-node';
|
|
15
|
+
import { getFileIcon, FileIconMatch } from '@teambit/code.ui.utils.get-file-icon';
|
|
16
|
+
import { useCodeParams } from '@teambit/code.ui.hooks.use-code-params';
|
|
17
|
+
import { TreeNode } from '@teambit/design.ui.tree';
|
|
18
|
+
import { affix } from '@teambit/base-ui.utils.string.affix';
|
|
19
|
+
|
|
15
20
|
import styles from './code-tab-page.module.scss';
|
|
16
21
|
|
|
17
22
|
type CodePageProps = {
|
|
@@ -50,11 +55,30 @@ export function CodePage({ className, fileIconSlot }: CodePageProps) {
|
|
|
50
55
|
currentFile={currentFile}
|
|
51
56
|
dependencies={dependencies}
|
|
52
57
|
fileTree={fileTree}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
58
|
+
widgets={useMemo(() => [generateWidget(mainFile, devFiles)], [mainFile, devFiles])}
|
|
59
|
+
getHref={useMemo(() => (node) => `${node.id}${affix('?version=', urlParams.version)}`, [urlParams.version])}
|
|
60
|
+
getIcon={useMemo(() => generateIcon(fileIconMatchers), fileIconMatchers)}
|
|
56
61
|
/>
|
|
57
62
|
</Pane>
|
|
58
63
|
</SplitPane>
|
|
59
64
|
);
|
|
60
65
|
}
|
|
66
|
+
|
|
67
|
+
function generateWidget(mainFile?: string, devFiles?: string[]) {
|
|
68
|
+
return function Widget({ node }: WidgetProps<any>) {
|
|
69
|
+
const fileName = node?.id;
|
|
70
|
+
if (fileName === mainFile) {
|
|
71
|
+
return <Label className={styles.label}>main</Label>;
|
|
72
|
+
}
|
|
73
|
+
if (devFiles?.includes(fileName)) {
|
|
74
|
+
return <Label className={styles.label}>dev</Label>;
|
|
75
|
+
}
|
|
76
|
+
return null;
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
function generateIcon(fileIconMatchers: FileIconMatch[]) {
|
|
81
|
+
return function Icon({ id }: TreeNode) {
|
|
82
|
+
return getFileIcon(fileIconMatchers, id);
|
|
83
|
+
};
|
|
84
|
+
}
|
package/dist/code-tab-page.js
CHANGED
|
@@ -27,15 +27,17 @@ const component_1 = require("@teambit/component");
|
|
|
27
27
|
const classnames_1 = __importDefault(require("classnames"));
|
|
28
28
|
const react_1 = __importStar(require("react"));
|
|
29
29
|
const lodash_1 = require("lodash");
|
|
30
|
+
const documenter_ui_label_1 = require("@teambit/documenter.ui.label");
|
|
30
31
|
const base_ui_surfaces_split_pane_split_pane_1 = require("@teambit/base-ui.surfaces.split-pane.split-pane");
|
|
31
32
|
const base_ui_surfaces_split_pane_hover_splitter_1 = require("@teambit/base-ui.surfaces.split-pane.hover-splitter");
|
|
32
33
|
const ui_foundation_ui_buttons_collapser_1 = require("@teambit/ui-foundation.ui.buttons.collapser");
|
|
33
34
|
const code_ui_queries_get_component_code_1 = require("@teambit/code.ui.queries.get-component-code");
|
|
34
|
-
const code_ui_utils_get_file_icon_1 = require("@teambit/code.ui.utils.get-file-icon");
|
|
35
35
|
const code_ui_code_view_1 = require("@teambit/code.ui.code-view");
|
|
36
36
|
const code_ui_code_tab_tree_1 = require("@teambit/code.ui.code-tab-tree");
|
|
37
|
-
const code_ui_hooks_use_code_params_1 = require("@teambit/code.ui.hooks.use-code-params");
|
|
38
37
|
const ui_foundation_ui_hooks_use_is_mobile_1 = require("@teambit/ui-foundation.ui.hooks.use-is-mobile");
|
|
38
|
+
const code_ui_utils_get_file_icon_1 = require("@teambit/code.ui.utils.get-file-icon");
|
|
39
|
+
const code_ui_hooks_use_code_params_1 = require("@teambit/code.ui.hooks.use-code-params");
|
|
40
|
+
const base_ui_utils_string_affix_1 = require("@teambit/base-ui.utils.string.affix");
|
|
39
41
|
const code_tab_page_module_scss_1 = __importDefault(require("./code-tab-page.module.scss"));
|
|
40
42
|
function CodePage({ className, fileIconSlot }) {
|
|
41
43
|
const urlParams = (0, code_ui_hooks_use_code_params_1.useCodeParams)();
|
|
@@ -53,7 +55,24 @@ function CodePage({ className, fileIconSlot }) {
|
|
|
53
55
|
react_1.default.createElement(base_ui_surfaces_split_pane_hover_splitter_1.HoverSplitter, { className: code_tab_page_module_scss_1.default.splitter },
|
|
54
56
|
react_1.default.createElement(ui_foundation_ui_buttons_collapser_1.Collapser, { placement: "left", isOpen: isSidebarOpen, onMouseDown: (e) => e.stopPropagation(), onClick: () => setSidebarOpenness((x) => !x), tooltipContent: `${isSidebarOpen ? 'Hide' : 'Show'} file tree`, className: code_tab_page_module_scss_1.default.collapser })),
|
|
55
57
|
react_1.default.createElement(base_ui_surfaces_split_pane_split_pane_1.Pane, { className: code_tab_page_module_scss_1.default.right },
|
|
56
|
-
react_1.default.createElement(code_ui_code_tab_tree_1.CodeTabTree, { currentFile: currentFile, dependencies: dependencies, fileTree: fileTree,
|
|
58
|
+
react_1.default.createElement(code_ui_code_tab_tree_1.CodeTabTree, { currentFile: currentFile, dependencies: dependencies, fileTree: fileTree, widgets: (0, react_1.useMemo)(() => [generateWidget(mainFile, devFiles)], [mainFile, devFiles]), getHref: (0, react_1.useMemo)(() => (node) => `${node.id}${(0, base_ui_utils_string_affix_1.affix)('?version=', urlParams.version)}`, [urlParams.version]), getIcon: (0, react_1.useMemo)(() => generateIcon(fileIconMatchers), fileIconMatchers) }))));
|
|
57
59
|
}
|
|
58
60
|
exports.CodePage = CodePage;
|
|
61
|
+
function generateWidget(mainFile, devFiles) {
|
|
62
|
+
return function Widget({ node }) {
|
|
63
|
+
const fileName = node === null || node === void 0 ? void 0 : node.id;
|
|
64
|
+
if (fileName === mainFile) {
|
|
65
|
+
return react_1.default.createElement(documenter_ui_label_1.Label, { className: code_tab_page_module_scss_1.default.label }, "main");
|
|
66
|
+
}
|
|
67
|
+
if (devFiles === null || devFiles === void 0 ? void 0 : devFiles.includes(fileName)) {
|
|
68
|
+
return react_1.default.createElement(documenter_ui_label_1.Label, { className: code_tab_page_module_scss_1.default.label }, "dev");
|
|
69
|
+
}
|
|
70
|
+
return null;
|
|
71
|
+
};
|
|
72
|
+
}
|
|
73
|
+
function generateIcon(fileIconMatchers) {
|
|
74
|
+
return function Icon({ id }) {
|
|
75
|
+
return (0, code_ui_utils_get_file_icon_1.getFileIcon)(fileIconMatchers, id);
|
|
76
|
+
};
|
|
77
|
+
}
|
|
59
78
|
//# sourceMappingURL=code-tab-page.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code-tab-page.js","sourceRoot":"","sources":["../code-tab-page.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAAsD;AACtD,4DAAoC;AACpC,+CAA6E;AAC7E,mCAAiC;AACjC,4GAA0F;AAC1F,oHAAoF;AACpF,oGAAwE;AACxE,oGAAsE;
|
|
1
|
+
{"version":3,"file":"code-tab-page.js","sourceRoot":"","sources":["../code-tab-page.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"lib": [
|
|
4
|
+
"es2019",
|
|
5
|
+
"DOM",
|
|
6
|
+
"ES6",
|
|
7
|
+
"DOM.Iterable"
|
|
8
|
+
],
|
|
9
|
+
"target": "es2015",
|
|
10
|
+
"module": "CommonJS",
|
|
11
|
+
"jsx": "react",
|
|
12
|
+
"allowJs": true,
|
|
13
|
+
"composite": true,
|
|
14
|
+
"declaration": true,
|
|
15
|
+
"sourceMap": true,
|
|
16
|
+
"skipLibCheck": true,
|
|
17
|
+
"experimentalDecorators": true,
|
|
18
|
+
"outDir": "dist",
|
|
19
|
+
"moduleResolution": "node",
|
|
20
|
+
"esModuleInterop": true,
|
|
21
|
+
"rootDir": ".",
|
|
22
|
+
"resolveJsonModule": true
|
|
23
|
+
},
|
|
24
|
+
"exclude": [
|
|
25
|
+
"dist",
|
|
26
|
+
"package.json"
|
|
27
|
+
],
|
|
28
|
+
"include": [
|
|
29
|
+
"**/*",
|
|
30
|
+
"**/*.json"
|
|
31
|
+
]
|
|
32
|
+
}
|
|
Binary file
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@teambit/code.ui.code-tab-page",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.570",
|
|
4
4
|
"homepage": "https://bit.dev/teambit/code/ui/code-tab-page",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"componentId": {
|
|
7
7
|
"scope": "teambit.code",
|
|
8
8
|
"name": "ui/code-tab-page",
|
|
9
|
-
"version": "0.0.
|
|
9
|
+
"version": "0.0.570"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"classnames": "2.2.6",
|
|
@@ -14,14 +14,18 @@
|
|
|
14
14
|
"core-js": "^3.0.0",
|
|
15
15
|
"@teambit/base-ui.surfaces.split-pane.hover-splitter": "1.0.0",
|
|
16
16
|
"@teambit/base-ui.surfaces.split-pane.split-pane": "1.0.0",
|
|
17
|
-
"@teambit/
|
|
18
|
-
"@teambit/
|
|
19
|
-
"@teambit/
|
|
17
|
+
"@teambit/base-ui.utils.string.affix": "1.0.0",
|
|
18
|
+
"@teambit/documenter.ui.label": "4.0.3",
|
|
19
|
+
"@teambit/ui-foundation.ui.constants.z-indexes": "0.0.488",
|
|
20
|
+
"@teambit/code.ui.code-tab-tree": "0.0.564",
|
|
21
|
+
"@teambit/code.ui.code-view": "0.0.491",
|
|
20
22
|
"@teambit/code.ui.hooks.use-code-params": "0.0.487",
|
|
21
|
-
"@teambit/code.ui.queries.get-component-code": "0.0.
|
|
23
|
+
"@teambit/code.ui.queries.get-component-code": "0.0.489",
|
|
22
24
|
"@teambit/code.ui.utils.get-file-icon": "0.0.486",
|
|
23
|
-
"@teambit/
|
|
24
|
-
"@teambit/ui-foundation.ui.
|
|
25
|
+
"@teambit/design.ui.tree": "0.0.5",
|
|
26
|
+
"@teambit/ui-foundation.ui.buttons.collapser": "0.0.195",
|
|
27
|
+
"@teambit/ui-foundation.ui.hooks.use-is-mobile": "0.0.179",
|
|
28
|
+
"@teambit/ui-foundation.ui.tree.tree-node": "0.0.492"
|
|
25
29
|
},
|
|
26
30
|
"devDependencies": {
|
|
27
31
|
"@types/classnames": "2.2.11",
|
package/tsconfig.json
CHANGED
|
Binary file
|
package/preview-1653827208409.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
|