@appquality/unguess-design-system 3.1.2-nav-beta → 3.1.3

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 CHANGED
@@ -1,3 +1,65 @@
1
+ # v3.1.3 (Wed Aug 16 2023)
2
+
3
+ #### 🐛 Bug Fix
4
+
5
+ - Add link parse to editor [#259](https://github.com/AppQuality/unguess-design-system/pull/259) ([@iacopolea](https://github.com/iacopolea) [@marcbon](https://github.com/marcbon) [@cannarocks](https://github.com/cannarocks))
6
+ - Add link to Editor [#258](https://github.com/AppQuality/unguess-design-system/pull/258) ([@iacopolea](https://github.com/iacopolea))
7
+ - fix: accent button hover color [#256](https://github.com/AppQuality/unguess-design-system/pull/256) ([@iacopolea](https://github.com/iacopolea))
8
+
9
+ #### Authors: 3
10
+
11
+ - Iacopo Leardini ([@iacopolea](https://github.com/iacopolea))
12
+ - Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
13
+ - Marco Bonomo ([@marcbon](https://github.com/marcbon))
14
+
15
+ ---
16
+
17
+ # v3.1.2 (Fri Jun 16 2023)
18
+
19
+ #### 🐛 Bug Fix
20
+
21
+ - Update sidebar items [#255](https://github.com/AppQuality/unguess-design-system/pull/255) ([@cannarocks](https://github.com/cannarocks) [@marcbon](https://github.com/marcbon))
22
+ - Reverse project accordion item [#254](https://github.com/AppQuality/unguess-design-system/pull/254) ([@cannarocks](https://github.com/cannarocks) [@marcbon](https://github.com/marcbon))
23
+
24
+ #### Authors: 2
25
+
26
+ - Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
27
+ - Marco Bonomo ([@marcbon](https://github.com/marcbon))
28
+
29
+ ---
30
+
31
+ # v3.0.5 (Wed May 31 2023)
32
+
33
+ #### 🐛 Bug Fix
34
+
35
+ - 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))
36
+ - Un 616 colors [#236](https://github.com/AppQuality/unguess-design-system/pull/236) ([@iacopolea](https://github.com/iacopolea))
37
+ - Update rollup configuration [#252](https://github.com/AppQuality/unguess-design-system/pull/252) ([@cannarocks](https://github.com/cannarocks))
38
+ - 🎨 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))
39
+
40
+ #### Authors: 3
41
+
42
+ - Iacopo Leardini ([@iacopolea](https://github.com/iacopolea))
43
+ - Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
44
+ - Marco Bonomo ([@marcbon](https://github.com/marcbon))
45
+
46
+ ---
47
+
48
+ # v3.0.4 (Wed May 17 2023)
49
+
50
+ #### 🐛 Bug Fix
51
+
52
+ - Fix SVGR issues [#249](https://github.com/AppQuality/unguess-design-system/pull/249) ([@marcbon](https://github.com/marcbon) [@cannarocks](https://github.com/cannarocks))
53
+ - Fix-svgr-viewbox [#248](https://github.com/AppQuality/unguess-design-system/pull/248) ([@marcbon](https://github.com/marcbon))
54
+ - 🎨 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))
55
+
56
+ #### Authors: 2
57
+
58
+ - Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
59
+ - Marco Bonomo ([@marcbon](https://github.com/marcbon))
60
+
61
+ ---
62
+
1
63
  # v3.0.3 (Fri May 12 2023)
2
64
 
3
65
  #### 🐛 Bug Fix
package/build/index.js CHANGED
@@ -28,6 +28,7 @@ var reactDropdowns = require('@zendeskgarden/react-dropdowns');
28
28
  var reactForms = require('@zendeskgarden/react-forms');
29
29
  var react = require('@tiptap/react');
30
30
  var Typography = require('@tiptap/extension-typography');
31
+ var Link = require('@tiptap/extension-link');
31
32
  var StarterKit = require('@tiptap/starter-kit');
32
33
  var Placeholder = require('@tiptap/extension-placeholder');
33
34
  var CharacterCount = require('@tiptap/extension-character-count');
@@ -64,6 +65,7 @@ var UAParser__default = /*#__PURE__*/_interopDefaultLegacy(UAParser);
64
65
  var React__namespace = /*#__PURE__*/_interopNamespace(React);
65
66
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
66
67
  var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
68
+ var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
67
69
  var StarterKit__default = /*#__PURE__*/_interopDefaultLegacy(StarterKit);
68
70
  var Placeholder__default = /*#__PURE__*/_interopDefaultLegacy(Placeholder);
69
71
  var CharacterCount__default = /*#__PURE__*/_interopDefaultLegacy(CharacterCount);
@@ -438,7 +440,7 @@ const components = Object.assign(Object.assign(Object.assign(Object.assign({}, r
438
440
  "&:hover": {
439
441
  borderColor: getColor(colors.accentHue, 800),
440
442
  color: getColor(colors.accentHue, 800),
441
- backgroundColor: palette.blue[50],
443
+ backgroundColor: getColor(colors.primaryHue, 600, undefined, 0.08),
442
444
  },
443
445
  "&:active": {
444
446
  borderColor: getColor(colors.accentHue, 800),
@@ -448,7 +450,7 @@ const components = Object.assign(Object.assign(Object.assign(Object.assign({}, r
448
450
  })), (isAccent && isBasic && {
449
451
  color: getColor(colors.accentHue, 700),
450
452
  "&:hover": {
451
- backgroundColor: palette.blue[50],
453
+ backgroundColor: getColor(colors.primaryHue, 600, undefined, 0.08),
452
454
  color: getColor(colors.accentHue, 800),
453
455
  },
454
456
  "&:active": {
@@ -492,7 +494,7 @@ const components = Object.assign(Object.assign(Object.assign(Object.assign({}, r
492
494
  "&:hover": {
493
495
  borderColor: getColor(colors.accentHue, 800),
494
496
  color: getColor(colors.accentHue, 800),
495
- backgroundColor: palette.blue[50],
497
+ backgroundColor: getColor(colors.primaryHue, 600, undefined, 0.08),
496
498
  },
497
499
  "&:active": {
498
500
  borderColor: getColor(colors.accentHue, 800),
@@ -510,7 +512,7 @@ const components = Object.assign(Object.assign(Object.assign(Object.assign({}, r
510
512
  })), (isAccent && isBasic && {
511
513
  color: getColor(colors.accentHue, 700),
512
514
  "&:hover": {
513
- backgroundColor: palette.blue[50],
515
+ backgroundColor: getColor(colors.primaryHue, 600, undefined, 0.08),
514
516
  color: getColor(colors.accentHue, 800),
515
517
  },
516
518
  "&:active": {
@@ -2663,6 +2665,7 @@ const Editor = (_a) => {
2663
2665
  };
2664
2666
  const ed = react.useEditor(Object.assign({ extensions: [
2665
2667
  Typography__default["default"],
2668
+ Link__default["default"],
2666
2669
  StarterKit__default["default"],
2667
2670
  Placeholder__default["default"].configure(Object.assign({ placeholder: ({ node }) => {
2668
2671
  if (node.type.name === "heading") {
@@ -3348,11 +3351,12 @@ const UgProjectSubtitle = styled__default["default"](NavItemText) `
3348
3351
  font-size: ${(props) => props.theme.fontSizes.sm};
3349
3352
  `;
3350
3353
  const UgNavItem = styled__default["default"](NavItem) `
3354
+ display: flex;
3351
3355
  flex-flow: column;
3352
- align-items: flex-start;
3353
- padding: 12px 8px;
3354
- opacity: 1;
3355
- padding-left: ${({ theme }) => theme.space.xxl}; //Accordion Alingment
3356
+ width: 100%;
3357
+ overflow: hidden;
3358
+ padding: ${({ theme }) => theme.space.sm} ${({ theme }) => theme.space.xs};
3359
+ padding-left: ${({ theme }) => theme.space.xxl};
3356
3360
  `;
3357
3361
  const NavItemComponent = React.forwardRef((props, ref) => jsxRuntime.jsx(UgNavItem, Object.assign({ ref: ref }, props)));
3358
3362
  const NavItemProject = NavItemComponent;
@@ -3360,42 +3364,30 @@ NavItemProject.Title = NavItemText;
3360
3364
  NavItemProject.SubTitle = UgProjectSubtitle;
3361
3365
 
3362
3366
  const NavAccordionItem = styled__default["default"](Accordion) `
3363
- opacity: 1;
3364
3367
  ${sidebarNavItemExpanded}
3365
- ${(props) => !props.isExpanded && sidebarNavItemHidden}
3368
+ ${props => !props.isExpanded && sidebarNavItemHidden}
3366
3369
  order: 1;
3367
- margin-top: ${({ theme }) => theme.space.xs}px;
3370
+ margin: ${({ theme }) => theme.space.xs} 0;
3371
+ padding-left: 8.5px;
3368
3372
  `;
3369
3373
  const AccordionItemHeader = styled__default["default"](Accordion.Header) `
3370
- flex-direction: row;
3371
- border-top-left-radius: ${({ theme }) => theme.space.base * 6}px;
3372
- border-bottom-left-radius: ${({ theme }) => theme.space.base * 6}px;
3373
-
3374
- > button {
3375
- padding-right: 2px;
3376
- }
3377
-
3378
- svg {
3379
- width: 26px;
3374
+ > svg {
3375
+ flex-shrink: 0;
3376
+
3377
+ &:first-of-type {
3378
+ margin: 0 8.5px;
3379
+ }
3380
3380
  }
3381
3381
  `;
3382
3382
  const AccordionItemPanel = styled__default["default"](Accordion.Panel) `
3383
3383
  max-height: 180px;
3384
- padding: 0;
3385
- padding-left: 5px;
3386
- overflow-y: hidden;
3387
- opacity: 1;
3388
- &:hover {
3389
- overflow-y: auto;
3390
- }
3384
+ overflow-y: auto;
3391
3385
  `;
3392
3386
  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
3387
  ${props => reactTheming.retrieveComponentStyles("text.primary", props)}
3388
+ font-weight: ${({ theme }) => theme.fontWeights.regular};
3389
+ padding: 0;
3390
+ margin: 0 8.5px;
3399
3391
  `;
3400
3392
  NavAccordionItem.Panel = AccordionItemPanel;
3401
3393
  NavAccordionItem.Header = AccordionItemHeader;
@@ -3405,14 +3397,16 @@ var _path$j;
3405
3397
  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
3398
  var SvgHomeFill = function SvgHomeFill(props) {
3407
3399
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$m({
3408
- xmlns: "http://www.w3.org/2000/svg",
3409
3400
  width: 26,
3410
3401
  height: 26,
3411
- focusable: "false",
3412
- viewBox: "0 0 26 26"
3402
+ viewBox: "0 0 26 26",
3403
+ fill: "none",
3404
+ xmlns: "http://www.w3.org/2000/svg"
3413
3405
  }, props), _path$j || (_path$j = /*#__PURE__*/React__namespace.createElement("path", {
3414
- fill: "currentColor",
3415
- d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
3406
+ fillRule: "evenodd",
3407
+ clipRule: "evenodd",
3408
+ 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",
3409
+ fill: "#336179"
3416
3410
  })));
3417
3411
  };
3418
3412
 
@@ -3420,11 +3414,11 @@ var _linearGradient, _path$i;
3420
3414
  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
3415
  var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
3422
3416
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$l({
3423
- xmlns: "http://www.w3.org/2000/svg",
3424
3417
  width: 26,
3425
3418
  height: 26,
3426
- focusable: "false",
3427
- viewBox: "0 0 26 26"
3419
+ viewBox: "0 0 26 26",
3420
+ fill: "none",
3421
+ xmlns: "http://www.w3.org/2000/svg"
3428
3422
  }, props), _linearGradient || (_linearGradient = /*#__PURE__*/React__namespace.createElement("linearGradient", {
3429
3423
  id: "unguessIconGradient"
3430
3424
  }, /*#__PURE__*/React__namespace.createElement("stop", {
@@ -3437,7 +3431,9 @@ var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
3437
3431
  stopColor: "#001825"
3438
3432
  }))), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
3439
3433
  fill: "url(#unguessIconGradient)",
3440
- d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
3434
+ fillRule: "evenodd",
3435
+ clipRule: "evenodd",
3436
+ 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
3437
  })));
3442
3438
  };
3443
3439
 
@@ -3484,15 +3480,15 @@ var _path$h;
3484
3480
  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
3481
  var SvgProjectsIcon = function SvgProjectsIcon(props) {
3486
3482
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
3487
- width: 22,
3488
- height: 22,
3489
- viewBox: "0 0 22 22",
3483
+ width: 26,
3484
+ height: 26,
3485
+ viewBox: "0 0 26 26",
3490
3486
  fill: "none",
3491
3487
  xmlns: "http://www.w3.org/2000/svg"
3492
3488
  }, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
3493
3489
  fillRule: "evenodd",
3494
3490
  clipRule: "evenodd",
3495
- d: "M18.5 5H12.25V4.375C12.25 3.34232 11.4077 2.5 10.375 2.5H4.125C3.09232 2.5 2.25 3.34232 2.25 4.375V10.005C1.53426 10.0685 1.01354 10.7329 1.1335 11.4527L2.171 17.7027C2.27098 18.3026 2.79293 18.75 3.4 18.75H18.6C19.2071 18.75 19.729 18.3026 19.829 17.7027L20.8666 11.4523C20.9865 10.7329 20.4657 10.0685 19.75 10.005V6.25C19.75 5.55482 19.1952 5 18.5 5ZM19.633 11.25H2.36695L3.404 17.4973C3.40404 17.4974 18.6 17.5 18.6 17.5C18.5929 17.5 19.633 11.25 19.633 11.25ZM3.5 10H18.5V6.25H11V4.375C11 4.03268 10.7173 3.75 10.375 3.75H4.125C3.78268 3.75 3.5 4.03268 3.5 4.375V10Z",
3491
+ 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
3492
  fill: "#336179",
3497
3493
  stroke: "#336179"
3498
3494
  })));
@@ -3633,7 +3629,7 @@ const Sidebar = (_a) => {
3633
3629
  }, [props.isExpanded]);
3634
3630
  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
3631
  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, { style: { marginLeft: theme.space.xs } }), jsxRuntime.jsxs(NavAccordionItem.Label, { children: [props.dividerLabel || "", " "] })] }), jsxRuntime.jsx(NavAccordionItem.Panel, { 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: {
3632
+ 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
3633
  marginLeft: theme.space.xs,
3638
3634
  color: theme.palette.grey[800],
3639
3635
  } }, { 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;
@@ -96,16 +96,11 @@ export declare const components: {
96
96
  "&:hover"?: {
97
97
  borderColor: string | undefined;
98
98
  color: string | undefined;
99
- backgroundColor: string;
100
- "& svg"?: undefined;
101
- } | {
102
- backgroundColor: string;
103
- color: string | undefined;
104
- borderColor?: undefined;
99
+ backgroundColor: string | undefined;
105
100
  "& svg"?: undefined;
106
101
  } | {
107
102
  backgroundColor: string | undefined;
108
- color: string;
103
+ color: string | undefined;
109
104
  borderColor?: undefined;
110
105
  "& svg"?: undefined;
111
106
  } | {
@@ -148,13 +143,13 @@ export declare const components: {
148
143
  "&:hover"?: {
149
144
  borderColor: string | undefined;
150
145
  color: string | undefined;
151
- backgroundColor: string;
146
+ backgroundColor: string | undefined;
152
147
  } | {
153
148
  backgroundColor: string | undefined;
154
149
  borderColor?: undefined;
155
150
  color?: undefined;
156
151
  } | {
157
- backgroundColor: string;
152
+ backgroundColor: string | undefined;
158
153
  color: string | undefined;
159
154
  borderColor?: undefined;
160
155
  } | {
@@ -300,16 +300,11 @@ declare const theme: {
300
300
  "&:hover"?: {
301
301
  borderColor: string | undefined;
302
302
  color: string | undefined;
303
- backgroundColor: string;
304
- "& svg"?: undefined;
305
- } | {
306
- backgroundColor: string;
307
- color: string | undefined;
308
- borderColor?: undefined;
303
+ backgroundColor: string | undefined;
309
304
  "& svg"?: undefined;
310
305
  } | {
311
306
  backgroundColor: string | undefined;
312
- color: string;
307
+ color: string | undefined;
313
308
  borderColor?: undefined;
314
309
  "& svg"?: undefined;
315
310
  } | {
@@ -352,13 +347,13 @@ declare const theme: {
352
347
  "&:hover"?: {
353
348
  borderColor: string | undefined;
354
349
  color: string | undefined;
355
- backgroundColor: string;
350
+ backgroundColor: string | undefined;
356
351
  } | {
357
352
  backgroundColor: string | undefined;
358
353
  borderColor?: undefined;
359
354
  color?: undefined;
360
355
  } | {
361
- backgroundColor: string;
356
+ backgroundColor: string | undefined;
362
357
  color: string | undefined;
363
358
  borderColor?: undefined;
364
359
  } | {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@appquality/unguess-design-system",
3
- "version": "3.1.2-nav-beta",
3
+ "version": "3.1.3",
4
4
  "description": "",
5
5
  "main": "build/index.js",
6
6
  "types": "build/index.d.ts",
@@ -36,6 +36,7 @@
36
36
  "@nivo/waffle": "^0.80.0",
37
37
  "@tiptap/extension-bubble-menu": "^2.0.0-beta.61",
38
38
  "@tiptap/extension-character-count": "^2.0.0-beta.31",
39
+ "@tiptap/extension-link": "^2.0.4",
39
40
  "@tiptap/extension-placeholder": "^2.0.0-beta.53",
40
41
  "@tiptap/extension-typography": "^2.0.0-beta.22",
41
42
  "@tiptap/pm": "^2.0.3",
@@ -90,8 +91,8 @@
90
91
  "formik": "^2.2.9",
91
92
  "prop-types": "^15.8.1",
92
93
  "react": "^18.2.0",
93
- "react-scripts": "^5.0.1",
94
94
  "react-dom": "^18.2.0",
95
+ "react-scripts": "^5.0.1",
95
96
  "rimraf": "3.0.2",
96
97
  "rollup": "~2.66",
97
98
  "rollup-plugin-typescript2": "^0.34.1",