@appquality/unguess-design-system 3.1.2-nav-beta → 3.1.2
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 +46 -0
- package/build/index.js +36 -43
- package/build/stories/navigation/sidebar/index.stories.d.ts +0 -4
- package/package.json +1 -1
- package/yarn-error.log +0 -13958
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,49 @@
|
|
|
1
|
+
# v3.1.2 (Fri Jun 16 2023)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- Update sidebar items [#255](https://github.com/AppQuality/unguess-design-system/pull/255) ([@cannarocks](https://github.com/cannarocks) [@marcbon](https://github.com/marcbon))
|
|
6
|
+
- Reverse project accordion item [#254](https://github.com/AppQuality/unguess-design-system/pull/254) ([@cannarocks](https://github.com/cannarocks) [@marcbon](https://github.com/marcbon))
|
|
7
|
+
|
|
8
|
+
#### Authors: 2
|
|
9
|
+
|
|
10
|
+
- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
|
|
11
|
+
- Marco Bonomo ([@marcbon](https://github.com/marcbon))
|
|
12
|
+
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
# v3.0.5 (Wed May 31 2023)
|
|
16
|
+
|
|
17
|
+
#### 🐛 Bug Fix
|
|
18
|
+
|
|
19
|
+
- Colors [#253](https://github.com/AppQuality/unguess-design-system/pull/253) ([@marcbon](https://github.com/marcbon) [@cannarocks](https://github.com/cannarocks) [@iacopolea](https://github.com/iacopolea))
|
|
20
|
+
- Un 616 colors [#236](https://github.com/AppQuality/unguess-design-system/pull/236) ([@iacopolea](https://github.com/iacopolea))
|
|
21
|
+
- Update rollup configuration [#252](https://github.com/AppQuality/unguess-design-system/pull/252) ([@cannarocks](https://github.com/cannarocks))
|
|
22
|
+
- 🎨 style(input-toggle): remove width property from EditIcon component to allow for dynamic sizing [#250](https://github.com/AppQuality/unguess-design-system/pull/250) ([@marcbon](https://github.com/marcbon))
|
|
23
|
+
|
|
24
|
+
#### Authors: 3
|
|
25
|
+
|
|
26
|
+
- Iacopo Leardini ([@iacopolea](https://github.com/iacopolea))
|
|
27
|
+
- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
|
|
28
|
+
- Marco Bonomo ([@marcbon](https://github.com/marcbon))
|
|
29
|
+
|
|
30
|
+
---
|
|
31
|
+
|
|
32
|
+
# v3.0.4 (Wed May 17 2023)
|
|
33
|
+
|
|
34
|
+
#### 🐛 Bug Fix
|
|
35
|
+
|
|
36
|
+
- Fix SVGR issues [#249](https://github.com/AppQuality/unguess-design-system/pull/249) ([@marcbon](https://github.com/marcbon) [@cannarocks](https://github.com/cannarocks))
|
|
37
|
+
- Fix-svgr-viewbox [#248](https://github.com/AppQuality/unguess-design-system/pull/248) ([@marcbon](https://github.com/marcbon))
|
|
38
|
+
- 🎨 style(tabs/index.tsx): add overflow-x hidden to StyledTabPanel [#247](https://github.com/AppQuality/unguess-design-system/pull/247) ([@marcbon](https://github.com/marcbon))
|
|
39
|
+
|
|
40
|
+
#### Authors: 2
|
|
41
|
+
|
|
42
|
+
- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
|
|
43
|
+
- Marco Bonomo ([@marcbon](https://github.com/marcbon))
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
1
47
|
# v3.0.3 (Fri May 12 2023)
|
|
2
48
|
|
|
3
49
|
#### 🐛 Bug Fix
|
package/build/index.js
CHANGED
|
@@ -3348,11 +3348,12 @@ const UgProjectSubtitle = styled__default["default"](NavItemText) `
|
|
|
3348
3348
|
font-size: ${(props) => props.theme.fontSizes.sm};
|
|
3349
3349
|
`;
|
|
3350
3350
|
const UgNavItem = styled__default["default"](NavItem) `
|
|
3351
|
+
display: flex;
|
|
3351
3352
|
flex-flow: column;
|
|
3352
|
-
|
|
3353
|
-
|
|
3354
|
-
|
|
3355
|
-
padding-left: ${({ theme }) => theme.space.xxl};
|
|
3353
|
+
width: 100%;
|
|
3354
|
+
overflow: hidden;
|
|
3355
|
+
padding: ${({ theme }) => theme.space.sm} ${({ theme }) => theme.space.xs};
|
|
3356
|
+
padding-left: ${({ theme }) => theme.space.xxl};
|
|
3356
3357
|
`;
|
|
3357
3358
|
const NavItemComponent = React.forwardRef((props, ref) => jsxRuntime.jsx(UgNavItem, Object.assign({ ref: ref }, props)));
|
|
3358
3359
|
const NavItemProject = NavItemComponent;
|
|
@@ -3360,42 +3361,30 @@ NavItemProject.Title = NavItemText;
|
|
|
3360
3361
|
NavItemProject.SubTitle = UgProjectSubtitle;
|
|
3361
3362
|
|
|
3362
3363
|
const NavAccordionItem = styled__default["default"](Accordion) `
|
|
3363
|
-
opacity: 1;
|
|
3364
3364
|
${sidebarNavItemExpanded}
|
|
3365
|
-
${
|
|
3365
|
+
${props => !props.isExpanded && sidebarNavItemHidden}
|
|
3366
3366
|
order: 1;
|
|
3367
|
-
margin
|
|
3367
|
+
margin: ${({ theme }) => theme.space.xs} 0;
|
|
3368
|
+
padding-left: 8.5px;
|
|
3368
3369
|
`;
|
|
3369
3370
|
const AccordionItemHeader = styled__default["default"](Accordion.Header) `
|
|
3370
|
-
|
|
3371
|
-
|
|
3372
|
-
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
}
|
|
3377
|
-
|
|
3378
|
-
svg {
|
|
3379
|
-
width: 26px;
|
|
3371
|
+
> svg {
|
|
3372
|
+
flex-shrink: 0;
|
|
3373
|
+
|
|
3374
|
+
&:first-of-type {
|
|
3375
|
+
margin: 0 8.5px;
|
|
3376
|
+
}
|
|
3380
3377
|
}
|
|
3381
3378
|
`;
|
|
3382
3379
|
const AccordionItemPanel = styled__default["default"](Accordion.Panel) `
|
|
3383
3380
|
max-height: 180px;
|
|
3384
|
-
|
|
3385
|
-
padding-left: 5px;
|
|
3386
|
-
overflow-y: hidden;
|
|
3387
|
-
opacity: 1;
|
|
3388
|
-
&:hover {
|
|
3389
|
-
overflow-y: auto;
|
|
3390
|
-
}
|
|
3381
|
+
overflow-y: auto;
|
|
3391
3382
|
`;
|
|
3392
3383
|
const AccordionItemLabel = styled__default["default"](Accordion.Label) `
|
|
3393
|
-
padding: 12px 9px;
|
|
3394
|
-
${({ theme }) => `
|
|
3395
|
-
fill: ${getColor(theme.colors.primaryHue, 600)};
|
|
3396
|
-
font-weight: ${theme.fontWeights.medium};
|
|
3397
|
-
`}
|
|
3398
3384
|
${props => reactTheming.retrieveComponentStyles("text.primary", props)}
|
|
3385
|
+
font-weight: ${({ theme }) => theme.fontWeights.regular};
|
|
3386
|
+
padding: 0;
|
|
3387
|
+
margin: 0 8.5px;
|
|
3399
3388
|
`;
|
|
3400
3389
|
NavAccordionItem.Panel = AccordionItemPanel;
|
|
3401
3390
|
NavAccordionItem.Header = AccordionItemHeader;
|
|
@@ -3405,14 +3394,16 @@ var _path$j;
|
|
|
3405
3394
|
function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
|
|
3406
3395
|
var SvgHomeFill = function SvgHomeFill(props) {
|
|
3407
3396
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$m({
|
|
3408
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
3409
3397
|
width: 26,
|
|
3410
3398
|
height: 26,
|
|
3411
|
-
|
|
3412
|
-
|
|
3399
|
+
viewBox: "0 0 26 26",
|
|
3400
|
+
fill: "none",
|
|
3401
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
3413
3402
|
}, props), _path$j || (_path$j = /*#__PURE__*/React__namespace.createElement("path", {
|
|
3414
|
-
|
|
3415
|
-
|
|
3403
|
+
fillRule: "evenodd",
|
|
3404
|
+
clipRule: "evenodd",
|
|
3405
|
+
d: "M11.027 21H5.973C5.436 21 5 20.523 5 19.935V17.065C5 16.475 5.436 16 5.973 16H11.027C11.564 16 12 16.476 12 17.065V19.935C12 20.523 11.564 21 11.027 21ZM11.024 14H5.977C5.437 14 5 13.577 5 13.055V5.945C5 5.425 5.438 5 5.977 5H11.024C11.564 5 12 5.424 12 5.946V13.056C12 13.577 11.563 14 11.024 14ZM14.979 5H20.021C20.561 5 21 5.478 21 6.069V8.932C21 9.522 20.561 10 20.021 10H14.979C14.439 10 14 9.522 14 8.932V6.07C14 5.48 14.439 5.001 14.979 5.001M14.972 12H20.028C20.565 12 21 12.42 21 12.94V20.06C21 20.579 20.565 21 20.028 21H14.972C14.435 21 14 20.579 14 20.06V12.94C14 12.42 14.435 12 14.972 12Z",
|
|
3406
|
+
fill: "#336179"
|
|
3416
3407
|
})));
|
|
3417
3408
|
};
|
|
3418
3409
|
|
|
@@ -3420,11 +3411,11 @@ var _linearGradient, _path$i;
|
|
|
3420
3411
|
function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
|
|
3421
3412
|
var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
3422
3413
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$l({
|
|
3423
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
3424
3414
|
width: 26,
|
|
3425
3415
|
height: 26,
|
|
3426
|
-
|
|
3427
|
-
|
|
3416
|
+
viewBox: "0 0 26 26",
|
|
3417
|
+
fill: "none",
|
|
3418
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
3428
3419
|
}, props), _linearGradient || (_linearGradient = /*#__PURE__*/React__namespace.createElement("linearGradient", {
|
|
3429
3420
|
id: "unguessIconGradient"
|
|
3430
3421
|
}, /*#__PURE__*/React__namespace.createElement("stop", {
|
|
@@ -3437,7 +3428,9 @@ var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
|
3437
3428
|
stopColor: "#001825"
|
|
3438
3429
|
}))), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
|
|
3439
3430
|
fill: "url(#unguessIconGradient)",
|
|
3440
|
-
|
|
3431
|
+
fillRule: "evenodd",
|
|
3432
|
+
clipRule: "evenodd",
|
|
3433
|
+
d: "M11.027 21H5.973C5.436 21 5 20.523 5 19.935V17.065C5 16.475 5.436 16 5.973 16H11.027C11.564 16 12 16.476 12 17.065V19.935C12 20.523 11.564 21 11.027 21ZM11.024 14H5.977C5.437 14 5 13.577 5 13.055V5.945C5 5.425 5.438 5 5.977 5H11.024C11.564 5 12 5.424 12 5.946V13.056C12 13.577 11.563 14 11.024 14ZM14.979 5H20.021C20.561 5 21 5.478 21 6.069V8.932C21 9.522 20.561 10 20.021 10H14.979C14.439 10 14 9.522 14 8.932V6.07C14 5.48 14.439 5.001 14.979 5.001M14.972 12H20.028C20.565 12 21 12.42 21 12.94V20.06C21 20.579 20.565 21 20.028 21H14.972C14.435 21 14 20.579 14 20.06V12.94C14 12.42 14.435 12 14.972 12Z"
|
|
3441
3434
|
})));
|
|
3442
3435
|
};
|
|
3443
3436
|
|
|
@@ -3484,15 +3477,15 @@ var _path$h;
|
|
|
3484
3477
|
function _extends$j() { _extends$j = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
|
|
3485
3478
|
var SvgProjectsIcon = function SvgProjectsIcon(props) {
|
|
3486
3479
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
|
|
3487
|
-
width:
|
|
3488
|
-
height:
|
|
3489
|
-
viewBox: "0 0
|
|
3480
|
+
width: 26,
|
|
3481
|
+
height: 26,
|
|
3482
|
+
viewBox: "0 0 26 26",
|
|
3490
3483
|
fill: "none",
|
|
3491
3484
|
xmlns: "http://www.w3.org/2000/svg"
|
|
3492
3485
|
}, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
|
|
3493
3486
|
fillRule: "evenodd",
|
|
3494
3487
|
clipRule: "evenodd",
|
|
3495
|
-
d: "
|
|
3488
|
+
d: "M20.5 8H14.25V7.375C14.25 6.34232 13.4077 5.5 12.375 5.5H6.125C5.09232 5.5 4.25 6.34232 4.25 7.375V13.005C3.53426 13.0685 3.01354 13.7329 3.1335 14.4527L4.171 20.7027C4.27098 21.3026 4.79293 21.75 5.4 21.75H20.6C21.2071 21.75 21.729 21.3026 21.829 20.7027L22.8666 14.4523C22.9865 13.7329 22.4657 13.0685 21.75 13.005V9.25C21.75 8.55482 21.1952 8 20.5 8ZM21.633 14.25H4.36695L5.404 20.4973C5.40404 20.4974 20.6 20.5 20.6 20.5C20.5929 20.5 21.633 14.25 21.633 14.25ZM5.5 13H20.5V9.25H13V7.375C13 7.03268 12.7173 6.75 12.375 6.75H6.125C5.78268 6.75 5.5 7.03268 5.5 7.375V13Z",
|
|
3496
3489
|
fill: "#336179",
|
|
3497
3490
|
stroke: "#336179"
|
|
3498
3491
|
})));
|
|
@@ -3633,7 +3626,7 @@ const Sidebar = (_a) => {
|
|
|
3633
3626
|
}, [props.isExpanded]);
|
|
3634
3627
|
return props.isLoading ? (jsxRuntime.jsx(LoadingSidebar, Object.assign({}, props))) : (jsxRuntime.jsxs(Nav, Object.assign({}, props, { children: [jsxRuntime.jsxs(ScrollingContainer, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), showWorkspacesDropdown &&
|
|
3635
3628
|
props.workspaces &&
|
|
3636
|
-
props.workspaces.length > 1 && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(StyledNavItem, Object.assign({ title: "Workspaces", 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(SidebarLabel, Object.assign({ isExpanded: props.isExpanded }, { children: props.activityLabel || "My activity" }))), jsxRuntime.jsxs(NavItem, Object.assign({ className: "sidebar-first-level-item", title: "Home", isExpanded: props.isExpanded, isCurrent: nav === "home", onClick: () => navigate("home") }, { children: [jsxRuntime.jsx(NavItemIcon, Object.assign({ isStyled: true }, { children: nav === "home" ? jsxRuntime.jsx(SvgHomeFillStyled, {}) : jsxRuntime.jsx(SvgHomeFill, {}) })), jsxRuntime.jsx(NavItemText, { children: props.homeItemLabel || "My Campaigns" })] })), projects && projects.length ? (jsxRuntime.jsx(NavAccordionItem, Object.assign({ className: "sidebar-project-accordion-first-item", level: 4, defaultExpandedSections: defaultAccordionPanels, isExpanded: props.isExpanded, isAnimated: false }, { children: jsxRuntime.jsxs(NavAccordionItem.Section, { children: [jsxRuntime.jsxs(NavAccordionItem.Header, { children: [jsxRuntime.jsx(SvgProjectsIcon, {
|
|
3629
|
+
props.workspaces.length > 1 && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(StyledNavItem, Object.assign({ title: "Workspaces", 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(SidebarLabel, Object.assign({ isExpanded: props.isExpanded }, { children: props.activityLabel || "My activity" }))), jsxRuntime.jsxs(NavItem, Object.assign({ className: "sidebar-first-level-item", title: "Home", isExpanded: props.isExpanded, isCurrent: nav === "home", onClick: () => navigate("home") }, { children: [jsxRuntime.jsx(NavItemIcon, Object.assign({ isStyled: true }, { children: nav === "home" ? jsxRuntime.jsx(SvgHomeFillStyled, {}) : jsxRuntime.jsx(SvgHomeFill, {}) })), jsxRuntime.jsx(NavItemText, { children: props.homeItemLabel || "My Campaigns" })] })), projects && projects.length ? (jsxRuntime.jsx(NavAccordionItem, Object.assign({ className: "sidebar-project-accordion-first-item", level: 4, defaultExpandedSections: defaultAccordionPanels, isExpanded: props.isExpanded, isAnimated: false }, { children: jsxRuntime.jsxs(NavAccordionItem.Section, { children: [jsxRuntime.jsxs(NavAccordionItem.Header, { children: [jsxRuntime.jsx(SvgProjectsIcon, {}), jsxRuntime.jsxs(NavAccordionItem.Label, { children: [props.dividerLabel || "", " "] })] }), jsxRuntime.jsx(NavAccordionItem.Panel, Object.assign({ style: { padding: 0 } }, { children: projects.map((project) => (jsxRuntime.jsxs(NavItemProject, Object.assign({ className: "sidebar-project-item", isExpanded: props.isExpanded, isCurrent: nav === `projects/${project.id}` }, (nav === `projects/${project.id}` && { ref: prjRef }), { onClick: () => navigate("projects", project.id) }, { children: [jsxRuntime.jsx(NavItemProject.Title, { title: project.title, children: project.title }), jsxRuntime.jsx(NavItemProject.SubTitle, { children: project.campaigns })] }), project.id))) }))] }) }))) : null, jsxRuntime.jsx(NavDivider, { isExpanded: props.isExpanded }), jsxRuntime.jsxs(NavItem, Object.assign({ className: "sidebar-first-level-item", title: "Services", isExpanded: props.isExpanded, isCurrent: nav === "services", onClick: () => navigate("services"), style: { marginBottom: "16px" } }, { children: [jsxRuntime.jsx(NavItemIcon, Object.assign({ isStyled: true }, { children: nav === "services" ? jsxRuntime.jsx(SvgTemplatesActive, {}) : jsxRuntime.jsx(SvgTemplates, {}) })), jsxRuntime.jsx(NavItemText, { children: props.servicesItemLabel || "Services" })] })), props.tokens && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SidebarLabel, Object.assign({ isExpanded: props.isExpanded }, { children: props.walletLabel || "Wallet" })), jsxRuntime.jsx(StyledNavItem, Object.assign({ title: "Tokens", isExpanded: props.isExpanded, style: { pointerEvents: "none", paddingTop: 0 } }, { children: jsxRuntime.jsx(Card, Object.assign({ style: { padding: theme.space.sm } }, { children: jsxRuntime.jsxs(TokenContainer, { children: [jsxRuntime.jsx(SvgToken, { width: 32 }), jsxRuntime.jsx(Span, Object.assign({ isBold: true, style: {
|
|
3637
3630
|
marginLeft: theme.space.xs,
|
|
3638
3631
|
color: theme.palette.grey[800],
|
|
3639
3632
|
} }, { children: props.tokens + " " + (props.tokensLabel || "tokens") }))] }) })) }))] }))] }), jsxRuntime.jsxs(NavItem, Object.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" })] }))] })));
|
|
@@ -2,9 +2,5 @@ import { SidebarArgs } from "./_types";
|
|
|
2
2
|
interface SidebarStoryArgs extends SidebarArgs {
|
|
3
3
|
}
|
|
4
4
|
export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, SidebarStoryArgs>;
|
|
5
|
-
export declare const SingleProject: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, SidebarStoryArgs>;
|
|
6
|
-
export declare const MultipleWorkspaces: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, SidebarStoryArgs>;
|
|
7
|
-
export declare const WithTokens: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, SidebarStoryArgs>;
|
|
8
|
-
export declare const WithAll: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, SidebarStoryArgs>;
|
|
9
5
|
declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, SidebarArgs>;
|
|
10
6
|
export default _default;
|