@appquality/unguess-design-system 2.10.36 → 2.10.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +36 -0
- package/build/constants.d.ts +3 -0
- package/build/index.js +20 -8
- package/build/stories/navigation/sidebar/_types.d.ts +11 -6
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,39 @@
|
|
|
1
|
+
# v2.10.39 (Wed May 25 2022)
|
|
2
|
+
|
|
3
|
+
#### ⚠️ Pushed to `master`
|
|
4
|
+
|
|
5
|
+
- refactor(sidebar): update feature schema in order as defined on stoplight ([@cannarocks](https://github.com/cannarocks))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# v2.10.38 (Mon May 23 2022)
|
|
14
|
+
|
|
15
|
+
#### 🐛 Bug Fix
|
|
16
|
+
|
|
17
|
+
- feat(sidebar): add features flag to sidebar item [#61](https://github.com/AppQuality/unguess-design-system/pull/61) ([@cannarocks](https://github.com/cannarocks))
|
|
18
|
+
|
|
19
|
+
#### Authors: 1
|
|
20
|
+
|
|
21
|
+
- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
# v2.10.37 (Thu May 19 2022)
|
|
26
|
+
|
|
27
|
+
#### 🐛 Bug Fix
|
|
28
|
+
|
|
29
|
+
- fix(sidebar): fix route for navigation [#60](https://github.com/AppQuality/unguess-design-system/pull/60) ([@marcbon](https://github.com/marcbon))
|
|
30
|
+
|
|
31
|
+
#### Authors: 1
|
|
32
|
+
|
|
33
|
+
- Marco Bonomo ([@marcbon](https://github.com/marcbon))
|
|
34
|
+
|
|
35
|
+
---
|
|
36
|
+
|
|
1
37
|
# v2.10.36 (Thu May 19 2022)
|
|
2
38
|
|
|
3
39
|
#### 🐛 Bug Fix
|
package/build/index.js
CHANGED
|
@@ -2081,6 +2081,8 @@ var LoadingSidebar = function (props) {
|
|
|
2081
2081
|
};
|
|
2082
2082
|
var templateObject_1$l;
|
|
2083
2083
|
|
|
2084
|
+
var FEATURE_FLAG_CATALOG = 'catalog-pages';
|
|
2085
|
+
|
|
2084
2086
|
var TokenContainer = styled__default["default"].div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
2085
2087
|
var ScrollingContainer = styled__default["default"].div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n order: 1;\n overflow-y: auto;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n order: 1;\n overflow-y: auto;\n height: 100%;\n"])));
|
|
2086
2088
|
var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", ";\n\n &:hover,\n &:focus {\n background-color: white;\n }\n"], ["\n ", ";\n\n &:hover,\n &:focus {\n background-color: white;\n }\n"])), function (_a) {
|
|
@@ -2096,19 +2098,29 @@ var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$9 || (t
|
|
|
2096
2098
|
*/
|
|
2097
2099
|
var Sidebar = function (props) {
|
|
2098
2100
|
var _a = React.useState(props.currentRoute || "home"), nav = _a[0], setNav = _a[1];
|
|
2101
|
+
var features = props.features;
|
|
2099
2102
|
var showWorkspacesDropdown = window.matchMedia("only screen and (max-width: ".concat(theme.breakpoints.sm, ")")).matches;
|
|
2100
2103
|
var toggleNav = function () {
|
|
2101
2104
|
props.onToggleMenu && props.onToggleMenu();
|
|
2102
2105
|
};
|
|
2103
|
-
var navigate = function (route) {
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
+
var navigate = function (route, parameter) {
|
|
2107
|
+
var fullRoute = route + (parameter ? "/".concat(parameter) : "");
|
|
2108
|
+
props.onNavToggle && props.onNavToggle(route, parameter);
|
|
2109
|
+
setNav(fullRoute);
|
|
2106
2110
|
};
|
|
2107
|
-
var padding = props.tokens
|
|
2108
|
-
|
|
2109
|
-
|
|
2110
|
-
|
|
2111
|
-
|
|
2111
|
+
var padding = props.tokens
|
|
2112
|
+
? {
|
|
2113
|
+
paddingBottom: 0,
|
|
2114
|
+
}
|
|
2115
|
+
: {};
|
|
2116
|
+
return props.isLoading ? (jsxRuntime.jsx(LoadingSidebar, __assign({}, props))) : (jsxRuntime.jsxs(Nav, __assign({}, props, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), showWorkspacesDropdown &&
|
|
2117
|
+
props.workspaces &&
|
|
2118
|
+
props.workspaces.length > 1 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: padding }, { children: jsxRuntime.jsx(WorkspacesDropdown, { workspaces: props.workspaces, workspacesLabel: props.workspacesLabel, activeWorkspace: props.activeWorkspace, onWorkspaceChange: props.onWorkspaceChange, isCompact: true }) })), props.tokens && (jsxRuntime.jsx(NavDivider, { isExpanded: props.isExpanded, style: { order: 0 } }))] })), props.tokens && (jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: { pointerEvents: "none", paddingTop: 0 } }, { children: jsxRuntime.jsx(Card, __assign({ style: { padding: theme.space.sm } }, { children: jsxRuntime.jsxs(TokenContainer, { children: [jsxRuntime.jsx(SvgToken, { width: 32 }), jsxRuntime.jsx(Span, __assign({ isBold: true, style: {
|
|
2119
|
+
marginLeft: theme.space.xs,
|
|
2120
|
+
color: theme.palette.grey[800],
|
|
2121
|
+
} }, { children: props.tokens + " " + (props.tokensLabel || "tokens") }))] }) })) }))), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "home", onClick: function () { return navigate("home"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "home" ? jsxRuntime.jsx(SvgHomeFillStyled, {}) : jsxRuntime.jsx(SvgHomeFill, {}) })), jsxRuntime.jsx(NavItemText, { children: props.homeItemLabel || "My Campaigns" })] })), features &&
|
|
2122
|
+
features.find(function (feature) { return feature.slug === FEATURE_FLAG_CATALOG; }) && (jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "templates", onClick: function () { return navigate("templates"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "templates" ? (jsxRuntime.jsx(SvgTemplatesActive, {})) : (jsxRuntime.jsx(SvgTemplates, {})) })), jsxRuntime.jsx(NavItemText, { children: props.servicesItemLabel || "Templates" })] }))), jsxRuntime.jsxs(NavDivider, __assign({ isExpanded: props.isExpanded }, { children: [jsxRuntime.jsx(SvgFolderIcon, {}), " ", props.dividerLabel || ""] })), jsxRuntime.jsx(ScrollingContainer, { children: props.projects &&
|
|
2123
|
+
props.projects.map(function (project) { return (jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "projects/".concat(project.id), onClick: function () { return navigate("projects", project.id); } }, { children: [jsxRuntime.jsx(NavItemProject.Title, { title: project.title, children: project.title }), jsxRuntime.jsx(NavItemProject.SubTitle, { children: project.campaigns })] }), project.id)); }) }), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, hasBrandmark: true, title: "Be smart from the start", style: { pointerEvents: "none", paddingBottom: theme.space.md } }, { children: [jsxRuntime.jsx(NavItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }), jsxRuntime.jsx(NavItemText, { children: "UNGUESS" })] }))] })));
|
|
2112
2124
|
};
|
|
2113
2125
|
var templateObject_1$k, templateObject_2$b, templateObject_3$9;
|
|
2114
2126
|
|
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
import { WorkspaceDropdownArgs } from "../header/header-item/_types";
|
|
2
2
|
import { NavArgs } from "../nav/_types";
|
|
3
|
+
export interface ProjectItem {
|
|
4
|
+
id: string;
|
|
5
|
+
title: string;
|
|
6
|
+
campaigns: string;
|
|
7
|
+
}
|
|
8
|
+
export interface FeatureItem {
|
|
9
|
+
slug?: string;
|
|
10
|
+
name?: string;
|
|
11
|
+
}
|
|
3
12
|
export interface SidebarArgs extends NavArgs, WorkspaceDropdownArgs {
|
|
4
13
|
projects?: Array<ProjectItem>;
|
|
5
14
|
currentRoute?: string;
|
|
@@ -10,11 +19,7 @@ export interface SidebarArgs extends NavArgs, WorkspaceDropdownArgs {
|
|
|
10
19
|
tokensLabel?: string;
|
|
11
20
|
isExpanded?: boolean;
|
|
12
21
|
onToggleMenu?: () => void;
|
|
13
|
-
onNavToggle?: (route: string) => void;
|
|
22
|
+
onNavToggle?: (route: string, parameter?: string) => void;
|
|
14
23
|
isLoading?: boolean;
|
|
15
|
-
|
|
16
|
-
export interface ProjectItem {
|
|
17
|
-
id: string;
|
|
18
|
-
title: string;
|
|
19
|
-
campaigns: string;
|
|
24
|
+
features?: Array<FeatureItem>;
|
|
20
25
|
}
|