@teambit/ui-foundation.ui.side-bar 0.0.556 → 0.0.559
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/component-tree/component-tree.tsx +2 -2
- package/component-tree/component-view/component-view.tsx +5 -5
- package/dist/component-tree/component-tree.js +2 -2
- package/dist/component-tree/component-tree.js.map +1 -1
- package/dist/component-tree/component-view/component-view.js +3 -3
- package/dist/component-tree/component-view/component-view.js.map +1 -1
- package/dist/tsconfig.json +32 -0
- package/package-tar/teambit-ui-foundation.ui.side-bar-0.0.559.tgz +0 -0
- package/package.json +4 -5
- package/{preview-1653708349111.js → preview-1654226751250.js} +0 -0
- package/tsconfig.json +6 -1
- package/package-tar/teambit-ui-foundation.ui.side-bar-0.0.556.tgz +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComponentModel } from '@teambit/component';
|
|
2
2
|
import React, { useMemo } from 'react';
|
|
3
|
-
import { useLocation } from '@teambit/base-
|
|
3
|
+
import { useLocation } from '@teambit/base-react.navigation.link';
|
|
4
4
|
import { indentStyle } from '@teambit/base-ui.graph.tree.indent';
|
|
5
5
|
import { inflateToTree, attachPayload } from '@teambit/base-ui.graph.tree.inflate-paths';
|
|
6
6
|
import { Tree, TreeNodeRenderer } from '@teambit/design.ui.tree';
|
|
@@ -22,7 +22,7 @@ export function ComponentTree({
|
|
|
22
22
|
className,
|
|
23
23
|
TreeNode = DefaultTreeNodeRenderer,
|
|
24
24
|
}: ComponentTreeProps) {
|
|
25
|
-
const { pathname } = useLocation();
|
|
25
|
+
const { pathname = '/' } = useLocation() || {};
|
|
26
26
|
|
|
27
27
|
const activeComponent = useMemo(() => {
|
|
28
28
|
const componentUrlRegex = new RegExp(componentIdUrlRegex);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ComponentTreeSlot } from '@teambit/component-tree';
|
|
2
|
-
import {
|
|
2
|
+
import { Link } from '@teambit/base-react.navigation.link';
|
|
3
3
|
import { EnvIcon } from '@teambit/envs.ui.env-icon';
|
|
4
4
|
import { DeprecationIcon } from '@teambit/component.ui.deprecation-icon';
|
|
5
5
|
import classNames from 'classnames';
|
|
@@ -36,7 +36,7 @@ export function ComponentView(props: ComponentViewProps<PayloadType>) {
|
|
|
36
36
|
const envId = ComponentID.fromString(component.environment?.id as string);
|
|
37
37
|
|
|
38
38
|
const envTooltip = (
|
|
39
|
-
<
|
|
39
|
+
<Link
|
|
40
40
|
className={styles.envLink}
|
|
41
41
|
href={ComponentUrl.toUrl(envId, { includeVersion: true })}
|
|
42
42
|
external={true}
|
|
@@ -47,11 +47,11 @@ export function ComponentView(props: ComponentViewProps<PayloadType>) {
|
|
|
47
47
|
>
|
|
48
48
|
<div className={styles.componentEnvTitle}>Environment</div>
|
|
49
49
|
<div>{component.environment?.id}</div>
|
|
50
|
-
</
|
|
50
|
+
</Link>
|
|
51
51
|
);
|
|
52
52
|
|
|
53
53
|
return (
|
|
54
|
-
<
|
|
54
|
+
<Link
|
|
55
55
|
href={`/${component.id.fullName}`}
|
|
56
56
|
className={classNames(indentClass, styles.component)}
|
|
57
57
|
activeClassName={styles.active}
|
|
@@ -71,6 +71,6 @@ export function ComponentView(props: ComponentViewProps<PayloadType>) {
|
|
|
71
71
|
{props.treeNodeSlot &&
|
|
72
72
|
props.treeNodeSlot.toArray().map(([id, treeNode]) => <treeNode.widget key={id} component={component} />)}
|
|
73
73
|
</div>
|
|
74
|
-
</
|
|
74
|
+
</Link>
|
|
75
75
|
);
|
|
76
76
|
}
|
|
@@ -21,7 +21,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
21
21
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
22
22
|
exports.ComponentTree = void 0;
|
|
23
23
|
const react_1 = __importStar(require("react"));
|
|
24
|
-
const
|
|
24
|
+
const base_react_navigation_link_1 = require("@teambit/base-react.navigation.link");
|
|
25
25
|
const base_ui_graph_tree_indent_1 = require("@teambit/base-ui.graph.tree.indent");
|
|
26
26
|
const base_ui_graph_tree_inflate_paths_1 = require("@teambit/base-ui.graph.tree.inflate-paths");
|
|
27
27
|
const design_ui_tree_1 = require("@teambit/design.ui.tree");
|
|
@@ -30,7 +30,7 @@ const payload_type_1 = require("./payload-type");
|
|
|
30
30
|
const default_tree_node_renderer_1 = require("./default-tree-node-renderer");
|
|
31
31
|
const componentIdUrlRegex = '[\\w\\/-]*[\\w-]';
|
|
32
32
|
function ComponentTree({ components, isCollapsed, className, TreeNode = default_tree_node_renderer_1.DefaultTreeNodeRenderer, }) {
|
|
33
|
-
const { pathname } = (0,
|
|
33
|
+
const { pathname = '/' } = (0, base_react_navigation_link_1.useLocation)() || {};
|
|
34
34
|
const activeComponent = (0, react_1.useMemo)(() => {
|
|
35
35
|
var _a;
|
|
36
36
|
const componentUrlRegex = new RegExp(componentIdUrlRegex);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component-tree.js","sourceRoot":"","sources":["../../component-tree/component-tree.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,+CAAuC;AACvC,
|
|
1
|
+
{"version":3,"file":"component-tree.js","sourceRoot":"","sources":["../../component-tree/component-tree.tsx"],"names":[],"mappings":"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"}
|
|
@@ -23,7 +23,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
23
23
|
};
|
|
24
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
25
|
exports.ComponentView = void 0;
|
|
26
|
-
const
|
|
26
|
+
const base_react_navigation_link_1 = require("@teambit/base-react.navigation.link");
|
|
27
27
|
const envs_ui_env_icon_1 = require("@teambit/envs.ui.env-icon");
|
|
28
28
|
const component_ui_deprecation_icon_1 = require("@teambit/component.ui.deprecation-icon");
|
|
29
29
|
const classnames_1 = __importDefault(require("classnames"));
|
|
@@ -46,13 +46,13 @@ function ComponentView(props) {
|
|
|
46
46
|
if (!(component instanceof component_1.ComponentModel))
|
|
47
47
|
return null;
|
|
48
48
|
const envId = component_1.ComponentID.fromString((_a = component.environment) === null || _a === void 0 ? void 0 : _a.id);
|
|
49
|
-
const envTooltip = (react_1.default.createElement(
|
|
49
|
+
const envTooltip = (react_1.default.createElement(base_react_navigation_link_1.Link, { className: component_view_module_scss_1.default.envLink, href: component_modules_component_url_1.ComponentUrl.toUrl(envId, { includeVersion: true }), external: true, onClick: (event) => {
|
|
50
50
|
// do not trigger component selection
|
|
51
51
|
event.stopPropagation();
|
|
52
52
|
} },
|
|
53
53
|
react_1.default.createElement("div", { className: component_view_module_scss_1.default.componentEnvTitle }, "Environment"),
|
|
54
54
|
react_1.default.createElement("div", null, (_b = component.environment) === null || _b === void 0 ? void 0 : _b.id)));
|
|
55
|
-
return (react_1.default.createElement(
|
|
55
|
+
return (react_1.default.createElement(base_react_navigation_link_1.Link, { href: `/${component.id.fullName}`, className: (0, classnames_1.default)(base_ui_graph_tree_indent_1.indentClass, component_view_module_scss_1.default.component), activeClassName: component_view_module_scss_1.default.active, onClick: handleClick },
|
|
56
56
|
react_1.default.createElement("div", { className: component_view_module_scss_1.default.left },
|
|
57
57
|
react_1.default.createElement(design_ui_tooltip_1.Tooltip, { className: component_view_module_scss_1.default.componentEnvTooltip, placement: "right", content: envTooltip },
|
|
58
58
|
react_1.default.createElement(envs_ui_env_icon_1.EnvIcon, { component: component, className: component_view_module_scss_1.default.envIcon })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component-view.js","sourceRoot":"","sources":["../../../component-tree/component-view/component-view.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AACA,
|
|
1
|
+
{"version":3,"file":"component-view.js","sourceRoot":"","sources":["../../../component-tree/component-view/component-view.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AACA,oFAA2D;AAC3D,gEAAoD;AACpD,0FAAyE;AACzE,4DAAoC;AACpC,kDAAiE;AACjE,8FAAwE;AACxE,+CAAuD;AACvD,kEAAqD;AACrD,8FAAuE;AACvE,kFAAiE;AAGjE,gDAA4C;AAC5C,8FAAkD;AAMlD,SAAgB,aAAa,CAAC,KAAsC;;IAClE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IACvB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;IAE/B,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,kBAAU,EAAC,6CAAW,CAAC,CAAC;IAE7C,MAAM,WAAW,GAAG,IAAA,mBAAW,EAC7B,CAAC,KAAsD,EAAE,EAAE;QACzD,QAAQ,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;IACvC,CAAC,EACD,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,CACpB,CAAC;IAEF,IAAI,CAAC,CAAC,SAAS,YAAY,0BAAc,CAAC;QAAE,OAAO,IAAI,CAAC;IAExD,MAAM,KAAK,GAAG,uBAAW,CAAC,UAAU,CAAC,MAAA,SAAS,CAAC,WAAW,0CAAE,EAAY,CAAC,CAAC;IAE1E,MAAM,UAAU,GAAG,CACjB,8BAAC,iCAAI,IACH,SAAS,EAAE,oCAAM,CAAC,OAAO,EACzB,IAAI,EAAE,8CAAY,CAAC,KAAK,CAAC,KAAK,EAAE,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,EACzD,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;YACjB,qCAAqC;YACrC,KAAK,CAAC,eAAe,EAAE,CAAC;QAC1B,CAAC;QAED,uCAAK,SAAS,EAAE,oCAAM,CAAC,iBAAiB,kBAAmB;QAC3D,2CAAM,MAAA,SAAS,CAAC,WAAW,0CAAE,EAAE,CAAO,CACjC,CACR,CAAC;IAEF,OAAO,CACL,8BAAC,iCAAI,IACH,IAAI,EAAE,IAAI,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,EACjC,SAAS,EAAE,IAAA,oBAAU,EAAC,uCAAW,EAAE,oCAAM,CAAC,SAAS,CAAC,EACpD,eAAe,EAAE,oCAAM,CAAC,MAAM,EAC9B,OAAO,EAAE,WAAW;QAEpB,uCAAK,SAAS,EAAE,oCAAM,CAAC,IAAI;YACzB,8BAAC,2BAAO,IAAC,SAAS,EAAE,oCAAM,CAAC,mBAAmB,EAAE,SAAS,EAAC,OAAO,EAAC,OAAO,EAAE,UAAU;gBACnF,8BAAC,0BAAO,IAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,oCAAM,CAAC,OAAO,GAAI,CACpD;YAEV,4CAAO,IAAA,kBAAO,EAAC,IAAI,CAAC,EAAE,CAAC,CAAQ,CAC3B;QAEN,uCAAK,SAAS,EAAE,oCAAM,CAAC,KAAK;YAC1B,8BAAC,+CAAe,IAAC,SAAS,EAAE,SAAS,GAAI;YAExC,KAAK,CAAC,YAAY;gBACjB,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,CAAC,EAAE,EAAE,CAAC,8BAAC,QAAQ,CAAC,MAAM,IAAC,GAAG,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC,CACtG,CACD,CACR,CAAC;AACJ,CAAC;AAvDD,sCAuDC"}
|
|
@@ -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,27 +1,26 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@teambit/ui-foundation.ui.side-bar",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.559",
|
|
4
4
|
"homepage": "https://bit.dev/teambit/ui-foundation/ui/side-bar",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"componentId": {
|
|
7
7
|
"scope": "teambit.ui-foundation",
|
|
8
8
|
"name": "ui/side-bar",
|
|
9
|
-
"version": "0.0.
|
|
9
|
+
"version": "0.0.559"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"classnames": "2.2.6",
|
|
13
13
|
"react-animate-height": "2.0.23",
|
|
14
14
|
"core-js": "^3.0.0",
|
|
15
|
+
"@teambit/base-react.navigation.link": "2.0.27",
|
|
15
16
|
"@teambit/base-ui.graph.tree.indent": "1.0.0",
|
|
16
17
|
"@teambit/base-ui.graph.tree.inflate-paths": "1.0.0",
|
|
17
18
|
"@teambit/base-ui.graph.tree.tree-context": "1.0.0",
|
|
18
|
-
"@teambit/base-ui.routing.routing-provider": "1.0.0",
|
|
19
19
|
"@teambit/base-ui.theme.colors": "1.0.0",
|
|
20
20
|
"@teambit/base-ui.graph.tree.recursive-tree": "1.0.0",
|
|
21
|
-
"@teambit/base-ui.routing.nav-link": "1.0.0",
|
|
22
21
|
"@teambit/evangelist.elements.icon": "1.0.2",
|
|
23
22
|
"@teambit/design.ui.tree": "0.0.5",
|
|
24
|
-
"@teambit/lanes.ui.lanes": "0.0.
|
|
23
|
+
"@teambit/lanes.ui.lanes": "0.0.62",
|
|
25
24
|
"@teambit/component.modules.component-url": "0.0.124",
|
|
26
25
|
"@teambit/component.ui.deprecation-icon": "0.0.493",
|
|
27
26
|
"@teambit/design.ui.tooltip": "0.0.352",
|
|
File without changes
|
package/tsconfig.json
CHANGED
|
Binary file
|