@appquality/unguess-design-system 2.12.11 → 2.12.13

package/.github/workflows/codeql-analysis.yml

@@ -0,0 +1,74 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL"
+
+on:
+  push:
+    branches: [ "master" ]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [ "master" ]
+  schedule:
+    - cron: '40 13 * * 1'
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript' ]
+        # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
+        # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
+
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v3
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v2
+      with:
+        languages: ${{ matrix.language }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+        
+        # Details on CodeQL's query packs refer to : https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
+        # queries: security-extended,security-and-quality
+
+        
+    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+    # If this step fails, then you should remove it and run the build manually (see below)
+    - name: Autobuild
+      uses: github/codeql-action/autobuild@v2
+
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
+
+    #   If the Autobuild fails above, remove it and uncomment the following three lines. 
+    #   modify them (or add more) to build your code if your project, please refer to the EXAMPLE below for guidance.
+
+    # - run: |
+    #   echo "Run, Build Application using script"
+    #   ./location_of_script_within_repo/buildscript.sh
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v2
+      with:
+        category: "/language:${{matrix.language}}"

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v2.12.13 (Wed Sep 28 2022)
+
+#### ⚠️ Pushed to `master`
+
+- Create codeql-analysis.yml ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
+# v2.12.12 (Tue Sep 27 2022)
+
+#### ⚠️ Pushed to `master`
+
+- feat(sidebar): add projectAccordion scroll ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
 # v2.12.11 (Wed Sep 21 2022)
 
 #### ⚠️ Pushed to `master`

package/build/index.js

@@ -2031,10 +2031,7 @@ var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject
     var theme = _a.theme;
     return theme.space.xs;
 });
-var NavItem = function (props) {
-    // const { isExpanded } = props;
-    return jsxRuntime.jsx(UgNavItem$2, __assign({}, props));
-};
+var NavItem = React.forwardRef(function (props, ref) { return jsxRuntime.jsx(UgNavItem$2, __assign({ ref: ref }, props)); });
 var templateObject_1$w, templateObject_2$h;
 
 var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject([""], [""])));
@@ -2113,7 +2110,8 @@ var UgNavItem = styled__default["default"](NavItem)(templateObject_2$g || (templ
     var theme = _a.theme;
     return theme.space.xxl;
 });
-var NavItemProject = function (props) { return jsxRuntime.jsx(UgNavItem, __assign({}, props)); };
+var NavItemComponent = React.forwardRef(function (props, ref) { return jsxRuntime.jsx(UgNavItem, __assign({ ref: ref }, props)); });
+var NavItemProject = NavItemComponent;
 NavItemProject.Title = NavItemText;
 NavItemProject.SubTitle = UgProjectSubtitle;
 var templateObject_1$s, templateObject_2$g;
@@ -2342,6 +2340,7 @@ var SidebarLabel = styled__default["default"](SM)(templateObject_4$9 || (templat
 var Sidebar = function (_a) {
     var projects = _a.projects, _b = _a.defaultAccordionPanels, defaultAccordionPanels = _b === void 0 ? [0] : _b, props = __rest(_a, ["projects", "defaultAccordionPanels"]);
     var _c = React.useState(props.currentRoute || "home"), nav = _c[0], setNav = _c[1];
+    var prjRef = React.useRef(null);
     var showWorkspacesDropdown = window.matchMedia("only screen and (max-width: ".concat(theme.breakpoints.sm, ")")).matches;
     var toggleNav = function () {
         props.onToggleMenu && props.onToggleMenu();
@@ -2356,9 +2355,18 @@ var Sidebar = function (_a) {
             paddingBottom: 0,
         }
         : {};
+    React.useEffect(function () {
+        var _a;
+        if (prjRef && prjRef.current && props.isExpanded) {
+            (_a = prjRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
+                behavior: "auto",
+                block: "end"
+            });
+        }
+    }, [props.isExpanded]);
     return props.isLoading ? (jsxRuntime.jsx(LoadingSidebar, __assign({}, props))) : (jsxRuntime.jsxs(Nav, __assign({}, props, { children: [jsxRuntime.jsxs(ScrollingContainer, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), showWorkspacesDropdown &&
                         props.workspaces &&
-                        props.workspaces.length > 1 && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(StyledNavItem, __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, __assign({ isExpanded: props.isExpanded }, { children: props.activityLabel || "My activity" }))), jsxRuntime.jsxs(NavItem, __assign({ className: "sidebar-first-level-item", title: "Home", 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" })] })), projects && projects.length ? (jsxRuntime.jsx(AccordionItem, __assign({ className: "sidebar-project-accordion-first-item", level: 4, defaultExpandedSections: defaultAccordionPanels, isExpanded: props.isExpanded }, { children: jsxRuntime.jsxs(AccordionItem.Section, { children: [jsxRuntime.jsx(AccordionItem.Header, { children: jsxRuntime.jsxs(AccordionItem.Label, { children: [props.dividerLabel || "", " ", jsxRuntime.jsx(SvgFolderIcon, { style: { marginLeft: theme.space.xs } })] }) }), jsxRuntime.jsx(AccordionItem.Panel, { children: projects.map(function (project) { return (jsxRuntime.jsxs(NavItemProject, __assign({ className: "sidebar-project-item", 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)); }) })] }) }))) : null, jsxRuntime.jsx(NavDivider, { isExpanded: props.isExpanded }), jsxRuntime.jsxs(NavItem, __assign({ className: "sidebar-first-level-item", title: "Services", isExpanded: props.isExpanded, isCurrent: nav === "services", onClick: function () { return navigate("services"); }, style: { marginBottom: "16px" } }, { children: [jsxRuntime.jsx(NavItemIcon, __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, __assign({ isExpanded: props.isExpanded }, { children: props.walletLabel || "Wallet" })), jsxRuntime.jsx(StyledNavItem, __assign({ title: "Tokens", 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: {
+                        props.workspaces.length > 1 && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(StyledNavItem, __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, __assign({ isExpanded: props.isExpanded }, { children: props.activityLabel || "My activity" }))), jsxRuntime.jsxs(NavItem, __assign({ className: "sidebar-first-level-item", title: "Home", 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" })] })), projects && projects.length ? (jsxRuntime.jsx(AccordionItem, __assign({ className: "sidebar-project-accordion-first-item", level: 4, defaultExpandedSections: defaultAccordionPanels, isExpanded: props.isExpanded }, { children: jsxRuntime.jsxs(AccordionItem.Section, { children: [jsxRuntime.jsx(AccordionItem.Header, { children: jsxRuntime.jsxs(AccordionItem.Label, { children: [props.dividerLabel || "", " ", jsxRuntime.jsx(SvgFolderIcon, { style: { marginLeft: theme.space.xs } })] }) }), jsxRuntime.jsx(AccordionItem.Panel, { children: projects.map(function (project, index) { return (jsxRuntime.jsxs(NavItemProject, __assign({ className: "sidebar-project-item", isExpanded: props.isExpanded, isCurrent: nav === "projects/".concat(project.id) }, (nav === "projects/".concat(project.id) && { ref: prjRef }), { onClick: function () { return navigate("projects", project.id); } }, (index === projects.length - 1 && { style: { marginBottom: 61 } }), { 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, __assign({ className: "sidebar-first-level-item", title: "Services", isExpanded: props.isExpanded, isCurrent: nav === "services", onClick: function () { return navigate("services"); }, style: { marginBottom: "16px" } }, { children: [jsxRuntime.jsx(NavItemIcon, __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, __assign({ isExpanded: props.isExpanded }, { children: props.walletLabel || "Wallet" })), jsxRuntime.jsx(StyledNavItem, __assign({ title: "Tokens", 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: {
                                                     marginLeft: theme.space.xs,
                                                     color: theme.palette.grey[800],
                                                 } }, { children: props.tokens + " " + (props.tokensLabel || "tokens") }))] }) })) }))] }))] }), 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" })] }))] })));

package/build/stories/navigation/nav/nav-item/navItem.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { NavItemArgs } from "./_types";
-declare const NavItem: (props: NavItemArgs) => JSX.Element;
+declare const NavItem: import("react").ForwardRefExoticComponent<NavItemArgs & import("react").RefAttributes<HTMLButtonElement>>;
 export { NavItem };

package/build/stories/navigation/nav/nav-item/navItemProject.d.ts

@@ -1,7 +1,9 @@
+/// <reference types="react" />
 import { NavItemArgs } from "./_types";
-declare const NavItemProject: {
-    (props: NavItemArgs): JSX.Element;
-    Title: (props: import("./_types").NavItemTextArgs) => JSX.Element;
-    SubTitle: import("styled-components").StyledComponent<(props: import("./_types").NavItemTextArgs) => JSX.Element, any, NavItemArgs, never>;
+import { NavItemText } from "./navItemText";
+declare const UgProjectSubtitle: import("styled-components").StyledComponent<(props: import("./_types").NavItemTextArgs) => JSX.Element, any, NavItemArgs, never>;
+declare const NavItemProject: import("react").ForwardRefExoticComponent<NavItemArgs & import("react").RefAttributes<HTMLButtonElement>> & {
+    Title: typeof NavItemText;
+    SubTitle: typeof UgProjectSubtitle;
 };
 export { NavItemProject };

package/build/stories/navigation/sidebar/index.stories.d.ts

@@ -3,6 +3,7 @@ import { SidebarArgs } from "./_types";
 interface SidebarStoryArgs extends SidebarArgs {
 }
 export declare const Default: Story<SidebarStoryArgs>;
+export declare const SingleProject: Story<SidebarStoryArgs>;
 export declare const MultipleWorkspaces: Story<SidebarStoryArgs>;
 export declare const WithTokens: Story<SidebarStoryArgs>;
 export declare const WithAll: Story<SidebarStoryArgs>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "2.12.11",
+  "version": "2.12.13",
   "dependencies": {
     "@tiptap/extension-bubble-menu": "^2.0.0-beta.61",
     "@tiptap/extension-character-count": "^2.0.0-beta.31",