@trops/dash-core 0.1.277 → 0.1.278

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import * as DashReact from '@trops/dash-react';
-import { isObject, ThemeContext, deepCopy, MainSection, getUUID, getStylesForItem, themeObjects, Heading, SearchInput, ButtonIcon, SubHeading3, InputText, Button, FontAwesomeIcon, Tag, Modal, Sidebar, Paragraph, Panel, Stepper, Tag2, Tag3, Card2, Card3, Heading3, MenuItem3, FormLabel, SelectMenu, Switch, SelectInput, CodeEditorInline, SettingsModal, SubHeading2, tailwindHeightFractions, Menu3, Panel3, DropdownPanel, MenuItem2, ButtonIcon2, DragComponent, ConfirmationModal, DropComponent, getStyleName, capitalizeFirstLetter, colorTypes, getCSSStyleForClassname, Panel2, Heading2, SubHeading, Paragraph2, Paragraph3, Button2, Button3, MenuItem, ButtonIcon3, DashPanel, colorNames, shades, themeVariants, Tabs3, DataList, Checkbox, StatCard, Card, Tabs, Accordion, Alert, Toast, ProgressBar, Toggle, Breadcrumbs, Tabs2, Accordion2, Alert2, Toast2, ProgressBar2, Toggle2, Breadcrumbs2, Accordion3, Alert3, Toast3, ProgressBar3, Toggle3, Breadcrumbs3, ThemeFromUrlPane, TextArea, Icon2, AlgoliaSearchBox, CommandPalette, EmptyState, Navbar, withRouter, Menu as Menu$1 } from '@trops/dash-react';
+import { isObject, ThemeContext, deepCopy, MainSection, getUUID, getStylesForItem, themeObjects, Heading, SearchInput, ButtonIcon, SubHeading3, InputText, Button, FontAwesomeIcon, Tag, Modal, Sidebar, Paragraph, Panel, Stepper, Tag2, Tag3, Card2, Card3, Heading3, MenuItem3, FormLabel, SelectMenu, Switch, SelectInput, CodeEditorInline, SettingsModal, SubHeading2, tailwindHeightFractions, Menu3, Panel3, DropdownPanel, MenuItem2, ButtonIcon2, DragComponent, ConfirmationModal, DropComponent, getStyleName, capitalizeFirstLetter, colorTypes, getCSSStyleForClassname, Panel2, Heading2, SubHeading, Paragraph2, Paragraph3, Button2, Button3, MenuItem, ButtonIcon3, DashPanel, colorNames, shades, themeVariants, Tabs3, DataList, Checkbox, StatCard, Card, Tabs, Accordion, Alert, Toast, ProgressBar, Toggle, Breadcrumbs, Tabs2, Accordion2, Alert2, Toast2, ProgressBar2, Toggle2, Breadcrumbs2, Accordion3, Alert3, Toast3, ProgressBar3, Toggle3, Breadcrumbs3, ThemeFromUrlPane, TextArea, Icon2, AlgoliaSearchBox, CommandPalette, useSidebar, EmptyState, Navbar, withRouter, Menu as Menu$1 } from '@trops/dash-react';
 export * from '@trops/dash-react';
 export { ThemeContext } from '@trops/dash-react';
 import _typeof from '@babel/runtime/helpers/typeof';
@@ -47968,27 +47968,33 @@ var DashTabBar = function DashTabBar(_ref) {
   });
 };
 
-var DashSidebar = function DashSidebar(_ref) {
-  var collapsed = _ref.collapsed,
-    onCollapsedChange = _ref.onCollapsedChange,
-    _ref$workspaces = _ref.workspaces,
-    workspaces = _ref$workspaces === void 0 ? [] : _ref$workspaces,
-    _ref$menuItems = _ref.menuItems,
-    menuItems = _ref$menuItems === void 0 ? [] : _ref$menuItems,
-    _ref$activeTabId = _ref.activeTabId,
-    activeTabId = _ref$activeTabId === void 0 ? null : _ref$activeTabId,
-    _ref$recentDashboards = _ref.recentDashboards,
-    recentDashboards = _ref$recentDashboards === void 0 ? [] : _ref$recentDashboards,
-    _ref$authStatus = _ref.authStatus,
-    authStatus = _ref$authStatus === void 0 ? "loading" : _ref$authStatus,
-    _ref$authProfile = _ref.authProfile,
-    authProfile = _ref$authProfile === void 0 ? null : _ref$authProfile,
-    onOpenWorkspace = _ref.onOpenWorkspace,
-    onNewDashboard = _ref.onNewDashboard,
-    onOpenSettings = _ref.onOpenSettings,
-    onOpenCommandPalette = _ref.onOpenCommandPalette,
-    onSignIn = _ref.onSignIn,
-    onSignOut = _ref.onSignOut;
+var CollapsibleContent = function CollapsibleContent(_ref) {
+  var children = _ref.children;
+  var _useSidebar = useSidebar(),
+    collapsed = _useSidebar.collapsed;
+  return collapsed ? null : children;
+};
+var DashSidebar = function DashSidebar(_ref2) {
+  var collapsed = _ref2.collapsed,
+    onCollapsedChange = _ref2.onCollapsedChange,
+    _ref2$workspaces = _ref2.workspaces,
+    workspaces = _ref2$workspaces === void 0 ? [] : _ref2$workspaces,
+    _ref2$menuItems = _ref2.menuItems,
+    menuItems = _ref2$menuItems === void 0 ? [] : _ref2$menuItems,
+    _ref2$activeTabId = _ref2.activeTabId,
+    activeTabId = _ref2$activeTabId === void 0 ? null : _ref2$activeTabId,
+    _ref2$recentDashboard = _ref2.recentDashboards,
+    recentDashboards = _ref2$recentDashboard === void 0 ? [] : _ref2$recentDashboard,
+    _ref2$authStatus = _ref2.authStatus,
+    authStatus = _ref2$authStatus === void 0 ? "loading" : _ref2$authStatus,
+    _ref2$authProfile = _ref2.authProfile,
+    authProfile = _ref2$authProfile === void 0 ? null : _ref2$authProfile,
+    onOpenWorkspace = _ref2.onOpenWorkspace,
+    onNewDashboard = _ref2.onNewDashboard,
+    onOpenSettings = _ref2.onOpenSettings,
+    onOpenCommandPalette = _ref2.onOpenCommandPalette,
+    onSignIn = _ref2.onSignIn,
+    onSignOut = _ref2.onSignOut;
   var _useContext = useContext(ThemeContext),
     themeVariant = _useContext.themeVariant,
     changeThemeVariant = _useContext.changeThemeVariant;
@@ -48018,9 +48024,11 @@ var DashSidebar = function DashSidebar(_ref) {
     children: [/*#__PURE__*/jsx(Sidebar.Header, {
       children: /*#__PURE__*/jsxs("div", {
         className: "flex items-center justify-between",
-        children: [!collapsed && /*#__PURE__*/jsx("span", {
-          className: "font-bold text-lg tracking-tight opacity-80",
-          children: "Dash."
+        children: [/*#__PURE__*/jsx(CollapsibleContent, {
+          children: /*#__PURE__*/jsx("span", {
+            className: "font-bold text-lg tracking-tight opacity-80",
+            children: "Dash."
+          })
         }), /*#__PURE__*/jsx(Sidebar.Trigger, {})]
       })
     }), /*#__PURE__*/jsxs(Sidebar.Content, {
@@ -48031,25 +48039,27 @@ var DashSidebar = function DashSidebar(_ref) {
         }),
         onClick: onOpenCommandPalette,
         children: "Search"
-      }), !collapsed && visibleRecents.length > 0 && /*#__PURE__*/jsx(Sidebar.Group, {
-        label: "Recents",
-        children: visibleRecents.map(function (recent) {
-          var ws = workspaces.find(function (w) {
-            return w.id === recent.workspaceId;
-          });
-          return /*#__PURE__*/jsx(Sidebar.Item, {
-            icon: /*#__PURE__*/jsx(FontAwesomeIcon, {
-              icon: "clock-rotate-left",
-              className: "h-3.5 w-3.5"
-            }),
-            active: recent.workspaceId === activeTabId,
-            onClick: function onClick() {
-              return ws && onOpenWorkspace(ws);
-            },
-            children: (recent.name || "Untitled").replace(/^./, function (c) {
-              return c.toUpperCase();
-            })
-          }, recent.workspaceId);
+      }), /*#__PURE__*/jsx(CollapsibleContent, {
+        children: visibleRecents.length > 0 && /*#__PURE__*/jsx(Sidebar.Group, {
+          label: "Recents",
+          children: visibleRecents.map(function (recent) {
+            var ws = workspaces.find(function (w) {
+              return w.id === recent.workspaceId;
+            });
+            return /*#__PURE__*/jsx(Sidebar.Item, {
+              icon: /*#__PURE__*/jsx(FontAwesomeIcon, {
+                icon: "clock-rotate-left",
+                className: "h-3.5 w-3.5"
+              }),
+              active: recent.workspaceId === activeTabId,
+              onClick: function onClick() {
+                return ws && onOpenWorkspace(ws);
+              },
+              children: (recent.name || "Untitled").replace(/^./, function (c) {
+                return c.toUpperCase();
+              })
+            }, recent.workspaceId);
+          })
         })
       }), /*#__PURE__*/jsx(Sidebar.Group, {
         label: "Dashboards",
@@ -48061,7 +48071,7 @@ var DashSidebar = function DashSidebar(_ref) {
           onClick: onNewDashboard,
           children: "New Dashboard"
         })
-      }), !collapsed && /*#__PURE__*/jsxs(Fragment, {
+      }), /*#__PURE__*/jsxs(CollapsibleContent, {
         children: [menuItems.map(function (menuItem) {
           var folderWorkspaces = workspacesForFolder(menuItem.id);
           var folderIcon = menuItem.icon || menuItem.folder || "folder";
@@ -48117,15 +48127,15 @@ var DashSidebar = function DashSidebar(_ref) {
     })]
   });
 };
-var FooterPopover = function FooterPopover(_ref2) {
-  var collapsed = _ref2.collapsed,
-    themeVariant = _ref2.themeVariant,
-    changeThemeVariant = _ref2.changeThemeVariant,
-    authStatus = _ref2.authStatus,
-    authProfile = _ref2.authProfile,
-    onOpenSettings = _ref2.onOpenSettings,
-    onSignIn = _ref2.onSignIn,
-    onSignOut = _ref2.onSignOut;
+var FooterPopover = function FooterPopover(_ref3) {
+  var collapsed = _ref3.collapsed,
+    themeVariant = _ref3.themeVariant,
+    changeThemeVariant = _ref3.changeThemeVariant,
+    authStatus = _ref3.authStatus,
+    authProfile = _ref3.authProfile,
+    onOpenSettings = _ref3.onOpenSettings,
+    onSignIn = _ref3.onSignIn,
+    onSignOut = _ref3.onSignOut;
   var buttonRef = useRef(null);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -48169,10 +48179,10 @@ var FooterPopover = function FooterPopover(_ref2) {
   }
   return /*#__PURE__*/jsx(Popover, {
     className: "relative",
-    children: function children(_ref3) {
+    children: function children(_ref4) {
       var _rect$left;
-      var open = _ref3.open,
-        close = _ref3.close;
+      var open = _ref4.open,
+        close = _ref4.close;
       var rect = open && buttonRef.current ? buttonRef.current.getBoundingClientRect() : null;
       return /*#__PURE__*/jsxs(Fragment, {
         children: [/*#__PURE__*/jsxs(Popover.Button, {
@@ -48253,12 +48263,12 @@ var FooterPopover = function FooterPopover(_ref2) {
     }
   });
 };
-var PopoverItem = function PopoverItem(_ref4) {
-  var icon = _ref4.icon,
-    label = _ref4.label,
-    onClick = _ref4.onClick,
-    _ref4$active = _ref4.active,
-    active = _ref4$active === void 0 ? false : _ref4$active;
+var PopoverItem = function PopoverItem(_ref5) {
+  var icon = _ref5.icon,
+    label = _ref5.label,
+    onClick = _ref5.onClick,
+    _ref5$active = _ref5.active,
+    active = _ref5$active === void 0 ? false : _ref5$active;
   return /*#__PURE__*/jsxs("button", {
     type: "button",
     onClick: onClick,