@teambit/scope 0.0.866 → 0.0.868

package/dist/scope.ui.drawer.js

@@ -37,20 +37,40 @@ function _componentUi() {
   return data;
 }
 
-function _scopeUiHooks() {
-  const data = require("@teambit/scope.ui.hooks.scope-context");
+function _uiFoundationUi() {
+  const data = require("@teambit/ui-foundation.ui.side-bar");
 
-  _scopeUiHooks = function () {
+  _uiFoundationUi = function () {
     return data;
   };
 
   return data;
 }
 
-function _uiFoundationUi() {
-  const data = require("@teambit/ui-foundation.ui.side-bar");
+function _lanesHooks() {
+  const data = require("@teambit/lanes.hooks.use-lanes");
 
-  _uiFoundationUi = function () {
+  _lanesHooks = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _lanesHooks2() {
+  const data = require("@teambit/lanes.hooks.use-lane-components");
+
+  _lanesHooks2 = function () {
+    return data;
+  };
+
+  return data;
+}
+
+function _scopeUiHooks() {
+  const data = require("@teambit/scope.ui.hooks.scope-context");
+
+  _scopeUiHooks = function () {
     return data;
   };
 
@@ -65,15 +85,28 @@ const scopeDrawer = ({
   treeWidgets,
   filtersSlot,
   drawerWidgetSlot,
-  assumeScopeInUrl = false
+  assumeScopeInUrl = false,
+  overrideUseComponents
 }) => {
-  const customScopeTreeNodeRenderer = treeNodeSlot => function TreeNode(props) {
+  const customScopeTreeNodeRenderer = (treeNodeSlot, host) => function TreeNode(props) {
     const children = props.node.children;
     if (!children) return /*#__PURE__*/_react().default.createElement(_uiFoundationUi().ComponentView, (0, _extends2().default)({}, props, {
       treeNodeSlot: treeNodeSlot
     })); // skip over scope node and render only children
 
     if (props.node.payload instanceof _uiFoundationUi().ScopePayload) {
+      const scopeNameFromNode = props.node.id.slice(0, -1);
+      const scope = host === null || host === void 0 ? void 0 : host.name;
+      /**
+       * this is only valid when viewing component from a lane
+       * if the lane component is from a different scope than the current scope
+       * show the scope node
+       */
+
+      if (scopeNameFromNode !== scope) {
+        return /*#__PURE__*/_react().default.createElement(_uiFoundationUi().ScopeTreeNode, props);
+      }
+
       return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children.map(childNode => /*#__PURE__*/_react().default.createElement(TreeNode, (0, _extends2().default)({
         key: childNode.id
       }, props, {
@@ -97,17 +130,61 @@ const scopeDrawer = ({
       filters: filtersSlot,
       drawerWidgets: drawerWidgetSlot
     },
+    useHost: () => (0, _scopeUiHooks().useScope)(),
     emptyMessage: 'Scope is empty',
-    useComponents: () => {
-      const scope = (0, _react().useContext)(_scopeUiHooks().ScopeContext);
+    // TODO: create an interface for Component host.
+    transformTree: host => {
+      return rootNode => {
+        var _rootNode$children;
+
+        const thisScopeIndex = (_rootNode$children = rootNode.children) === null || _rootNode$children === void 0 ? void 0 : _rootNode$children.findIndex(node => {
+          if (!(node.payload instanceof _uiFoundationUi().ScopePayload)) return undefined;
+          const scopeNameFromNode = node.id.slice(0, -1);
+          return scopeNameFromNode === (host === null || host === void 0 ? void 0 : host.name);
+        });
+        const thisScope = rootNode.children ? rootNode.children[thisScopeIndex || ''] : undefined;
+
+        if (thisScopeIndex && thisScopeIndex !== -1 && rootNode.children) {
+          delete rootNode.children[thisScopeIndex];
+          const children = rootNode.children.concat(thisScope.children);
+          rootNode.children = children;
+        }
+
+        return rootNode;
+      };
+    },
+    useComponents: overrideUseComponents || (() => {
+      var _lanesModel$viewedLan;
+
+      const {
+        lanesModel,
+        loading: lanesLoading
+      } = (0, _lanesHooks().useLanes)();
+      const viewedLaneId = lanesModel === null || lanesModel === void 0 ? void 0 : (_lanesModel$viewedLan = lanesModel.viewedLane) === null || _lanesModel$viewedLan === void 0 ? void 0 : _lanesModel$viewedLan.id;
+      const {
+        components: laneComponents = [],
+        loading: laneCompsLoading
+      } = (0, _lanesHooks2().useLaneComponents)(viewedLaneId !== null && viewedLaneId !== void 0 && viewedLaneId.isDefault() ? undefined : viewedLaneId);
+      const {
+        components: mainComponents
+      } = (0, _react().useContext)(_scopeUiHooks().ScopeContext); // lane components + main components
+
+      const components = mergeComponents(mainComponents, laneComponents);
       return {
-        loading: !scope,
-        components: scope.components || []
+        loading: lanesLoading || laneCompsLoading,
+        components
       };
-    }
+    })
   });
 };
 
 exports.scopeDrawer = scopeDrawer;
 
+function mergeComponents(mainComponents, laneComponents) {
+  const mainComponentsThatAreNotOnLane = mainComponents.filter(mainComponent => {
+    return !laneComponents.find(laneComponent => laneComponent.id.toStringWithoutVersion() === mainComponent.id.toStringWithoutVersion());
+  });
+  return laneComponents.concat(mainComponentsThatAreNotOnLane);
+}
+
 //# sourceMappingURL=scope.ui.drawer.js.map

package/dist/scope.ui.drawer.js.map

@@ -1 +1 @@
-{"version":3,"names":["scopeDrawer","treeWidgets","filtersSlot","drawerWidgetSlot","assumeScopeInUrl","customScopeTreeNodeRenderer","treeNodeSlot","TreeNode","props","children","node","payload","ScopePayload","map","childNode","id","ComponentsDrawer","order","name","plugins","tree","widgets","customRenderer","filters","drawerWidgets","emptyMessage","useComponents","scope","useContext","ScopeContext","loading","components"],"sources":["scope.ui.drawer.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { ComponentsDrawer, ComponentFiltersSlot, DrawerWidgetSlot } from '@teambit/component.ui.component-drawer';\nimport { ScopeContext } from '@teambit/scope.ui.hooks.scope-context';\nimport { ComponentView, NamespaceTreeNode, PayloadType, ScopePayload } from '@teambit/ui-foundation.ui.side-bar';\nimport { TreeNodeProps } from '@teambit/design.ui.tree';\nimport { SidebarSlot } from './scope.ui.runtime';\n\nexport type ScopeDrawerProps = {\n  treeWidgets: SidebarSlot;\n  filtersSlot: ComponentFiltersSlot;\n  drawerWidgetSlot: DrawerWidgetSlot;\n  assumeScopeInUrl?: boolean;\n};\n\nexport const scopeDrawer = ({\n  treeWidgets,\n  filtersSlot,\n  drawerWidgetSlot,\n  assumeScopeInUrl = false,\n}: ScopeDrawerProps) => {\n  const customScopeTreeNodeRenderer = (treeNodeSlot) =>\n    function TreeNode(props: TreeNodeProps<PayloadType>) {\n      const children = props.node.children;\n\n      if (!children) return <ComponentView {...props} treeNodeSlot={treeNodeSlot} />;\n\n      // skip over scope node and render only children\n      if (props.node.payload instanceof ScopePayload) {\n        return (\n          <>\n            {children.map((childNode) => (\n              <TreeNode key={childNode.id} {...props} node={childNode}></TreeNode>\n            ))}\n          </>\n        );\n      }\n\n      return <NamespaceTreeNode {...props} />;\n    };\n\n  return new ComponentsDrawer({\n    assumeScopeInUrl,\n    order: 0,\n    id: 'scope-components-drawer',\n    name: 'COMPONENTS',\n    plugins: {\n      tree: {\n        widgets: treeWidgets,\n        customRenderer: customScopeTreeNodeRenderer,\n      },\n      filters: filtersSlot,\n      drawerWidgets: drawerWidgetSlot,\n    },\n    emptyMessage: 'Scope is empty',\n    useComponents: () => {\n      const scope = useContext(ScopeContext);\n      return {\n        loading: !scope,\n        components: scope.components || [],\n      };\n    },\n  });\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;;;;;AAWO,MAAMA,WAAW,GAAG,CAAC;EAC1BC,WAD0B;EAE1BC,WAF0B;EAG1BC,gBAH0B;EAI1BC,gBAAgB,GAAG;AAJO,CAAD,KAKH;EACtB,MAAMC,2BAA2B,GAAIC,YAAD,IAClC,SAASC,QAAT,CAAkBC,KAAlB,EAAqD;IACnD,MAAMC,QAAQ,GAAGD,KAAK,CAACE,IAAN,CAAWD,QAA5B;IAEA,IAAI,CAACA,QAAL,EAAe,oBAAO,+BAAC,+BAAD,+BAAmBD,KAAnB;MAA0B,YAAY,EAAEF;IAAxC,GAAP,CAHoC,CAKnD;;IACA,IAAIE,KAAK,CAACE,IAAN,CAAWC,OAAX,YAA8BC,8BAAlC,EAAgD;MAC9C,oBACE,gEACGH,QAAQ,CAACI,GAAT,CAAcC,SAAD,iBACZ,+BAAC,QAAD;QAAU,GAAG,EAAEA,SAAS,CAACC;MAAzB,GAAiCP,KAAjC;QAAwC,IAAI,EAAEM;MAA9C,GADD,CADH,CADF;IAOD;;IAED,oBAAO,+BAAC,mCAAD,EAAuBN,KAAvB,CAAP;EACD,CAlBH;;EAoBA,OAAO,KAAIQ,+BAAJ,EAAqB;IAC1BZ,gBAD0B;IAE1Ba,KAAK,EAAE,CAFmB;IAG1BF,EAAE,EAAE,yBAHsB;IAI1BG,IAAI,EAAE,YAJoB;IAK1BC,OAAO,EAAE;MACPC,IAAI,EAAE;QACJC,OAAO,EAAEpB,WADL;QAEJqB,cAAc,EAAEjB;MAFZ,CADC;MAKPkB,OAAO,EAAErB,WALF;MAMPsB,aAAa,EAAErB;IANR,CALiB;IAa1BsB,YAAY,EAAE,gBAbY;IAc1BC,aAAa,EAAE,MAAM;MACnB,MAAMC,KAAK,GAAG,IAAAC,mBAAA,EAAWC,4BAAX,CAAd;MACA,OAAO;QACLC,OAAO,EAAE,CAACH,KADL;QAELI,UAAU,EAAEJ,KAAK,CAACI,UAAN,IAAoB;MAF3B,CAAP;IAID;EApByB,CAArB,CAAP;AAsBD,CAhDM"}
+{"version":3,"names":["scopeDrawer","treeWidgets","filtersSlot","drawerWidgetSlot","assumeScopeInUrl","overrideUseComponents","customScopeTreeNodeRenderer","treeNodeSlot","host","TreeNode","props","children","node","payload","ScopePayload","scopeNameFromNode","id","slice","scope","name","map","childNode","ComponentsDrawer","order","plugins","tree","widgets","customRenderer","filters","drawerWidgets","useHost","useScope","emptyMessage","transformTree","rootNode","thisScopeIndex","findIndex","undefined","thisScope","concat","useComponents","lanesModel","loading","lanesLoading","useLanes","viewedLaneId","viewedLane","components","laneComponents","laneCompsLoading","useLaneComponents","isDefault","mainComponents","useContext","ScopeContext","mergeComponents","mainComponentsThatAreNotOnLane","filter","mainComponent","find","laneComponent","toStringWithoutVersion"],"sources":["scope.ui.drawer.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { ComponentsDrawer, ComponentFiltersSlot, DrawerWidgetSlot } from '@teambit/component.ui.component-drawer';\nimport {\n  ComponentView,\n  NamespaceTreeNode,\n  PayloadType,\n  ScopePayload,\n  ScopeTreeNode,\n} from '@teambit/ui-foundation.ui.side-bar';\nimport { TreeNode as TreeNodeType, TreeNodeProps } from '@teambit/design.ui.tree';\nimport { useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { useLaneComponents } from '@teambit/lanes.hooks.use-lane-components';\nimport { ComponentModel } from '@teambit/component';\nimport { useScope, ScopeContext } from '@teambit/scope.ui.hooks.scope-context';\n// import { WorkspaceModel } from '@teambit/workspace';\nimport { SidebarSlot } from './scope.ui.runtime';\n\nexport type ScopeDrawerProps = {\n  treeWidgets: SidebarSlot;\n  filtersSlot: ComponentFiltersSlot;\n  drawerWidgetSlot: DrawerWidgetSlot;\n  assumeScopeInUrl?: boolean;\n  overrideUseComponents?: () => { components: ComponentModel[] };\n};\n\nexport const scopeDrawer = ({\n  treeWidgets,\n  filtersSlot,\n  drawerWidgetSlot,\n  assumeScopeInUrl = false,\n  overrideUseComponents,\n}: ScopeDrawerProps) => {\n  const customScopeTreeNodeRenderer = (treeNodeSlot, host?: any) =>\n    function TreeNode(props: TreeNodeProps<PayloadType>) {\n      const children = props.node.children;\n\n      if (!children) return <ComponentView {...props} treeNodeSlot={treeNodeSlot} />;\n\n      // skip over scope node and render only children\n      if (props.node.payload instanceof ScopePayload) {\n        const scopeNameFromNode = props.node.id.slice(0, -1);\n        const scope = host?.name;\n\n        /**\n         * this is only valid when viewing component from a lane\n         * if the lane component is from a different scope than the current scope\n         * show the scope node\n         */\n        if (scopeNameFromNode !== scope) {\n          return <ScopeTreeNode {...props} />;\n        }\n\n        return (\n          <>\n            {children.map((childNode) => (\n              <TreeNode key={childNode.id} {...props} node={childNode}></TreeNode>\n            ))}\n          </>\n        );\n      }\n\n      return <NamespaceTreeNode {...props} />;\n    };\n\n  return new ComponentsDrawer({\n    assumeScopeInUrl,\n    order: 0,\n    id: 'scope-components-drawer',\n    name: 'COMPONENTS',\n    plugins: {\n      tree: {\n        widgets: treeWidgets,\n        customRenderer: customScopeTreeNodeRenderer,\n      },\n      filters: filtersSlot,\n      drawerWidgets: drawerWidgetSlot,\n    },\n    useHost: () => useScope(),\n    emptyMessage: 'Scope is empty',\n    // TODO: create an interface for Component host.\n    transformTree: (host?: any) => {\n      return (rootNode: TreeNodeType) => {\n        const thisScopeIndex = rootNode.children?.findIndex((node) => {\n          if (!(node.payload instanceof ScopePayload)) return undefined;\n          const scopeNameFromNode = node.id.slice(0, -1);\n          return scopeNameFromNode === host?.name;\n        });\n\n        const thisScope = rootNode.children ? rootNode.children[thisScopeIndex || ''] : undefined;\n\n        if (thisScopeIndex && thisScopeIndex !== -1 && rootNode.children) {\n          delete rootNode.children[thisScopeIndex];\n          const children = rootNode.children.concat(thisScope.children);\n          rootNode.children = children;\n        }\n\n        return rootNode;\n      };\n    },\n    useComponents:\n      overrideUseComponents ||\n      (() => {\n        const { lanesModel, loading: lanesLoading } = useLanes();\n        const viewedLaneId = lanesModel?.viewedLane?.id;\n\n        const { components: laneComponents = [], loading: laneCompsLoading } = useLaneComponents(\n          viewedLaneId?.isDefault() ? undefined : viewedLaneId\n        );\n        const { components: mainComponents } = useContext(ScopeContext);\n        // lane components + main components\n        const components = mergeComponents(mainComponents, laneComponents);\n\n        return {\n          loading: lanesLoading || laneCompsLoading,\n          components,\n        };\n      }),\n  });\n};\n\nfunction mergeComponents(mainComponents: ComponentModel[], laneComponents: ComponentModel[]): ComponentModel[] {\n  const mainComponentsThatAreNotOnLane = mainComponents.filter((mainComponent) => {\n    return !laneComponents.find(\n      (laneComponent) => laneComponent.id.toStringWithoutVersion() === mainComponent.id.toStringWithoutVersion()\n    );\n  });\n  return laneComponents.concat(mainComponentsThatAreNotOnLane);\n}\n"],"mappings":"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"}

package/dist/scope.ui.runtime.d.ts

@@ -168,7 +168,9 @@ export declare class ScopeUI {
      */
     registerDrawerComponentFilters: (filters: ComponentFilters) => void;
     registerDrawerWidgets: (widgets: ReactNode[]) => void;
-    registerDefaultDrawers(assumeScopeInUrl?: boolean): void;
+    registerDefaultDrawers(assumeScopeInUrl?: boolean, overrideUseComponents?: () => {
+        components: ComponentModel[];
+    }): void;
     uiRoot(): UIRoot;
     listSidebarLinks(): (React.ComponentClass<{}, any> | React.FunctionComponent<{}>)[];
     /** registers available components */

package/dist/scope.ui.runtime.js

@@ -143,6 +143,16 @@ function _componentModules() {
   return data;
 }
 
+function _componentUiComponentFilters3() {
+  const data = require("@teambit/component.ui.component-filters.show-main-filter");
+
+  _componentUiComponentFilters3 = function () {
+    return data;
+  };
+
+  return data;
+}
+
 function _menu() {
   const data = require("./ui/menu");
 
@@ -293,6 +303,7 @@ class ScopeUI {
   getScope(options) {
     return /*#__PURE__*/_react().default.createElement(_scope2().Scope, {
       TargetScopeOverview: options.TargetScopeOverview,
+      scopeClassName: options.scopeClassName,
       TargetCorner: options.Corner,
       routeSlot: this.routeSlot,
       menuSlot: this.menuSlot,
@@ -306,7 +317,8 @@ class ScopeUI {
       context: this.getContext(),
       onSidebarTogglerChange: this.setSidebarToggle,
       cornerSlot: this.cornerSlot,
-      paneClassName: options.paneClassName
+      paneClassName: options.paneClassName,
+      PaneWrapper: options.PaneWrapper
     });
   }
   /**
@@ -418,12 +430,13 @@ class ScopeUI {
     return (0, _lodash().flatten)(contexts).concat(ComponentUrlFuncProvider);
   }
 
-  registerDefaultDrawers(assumeScopeInUrl = false) {
+  registerDefaultDrawers(assumeScopeInUrl = false, overrideUseComponents) {
     this.sidebar.registerDrawer((0, _scopeUi().scopeDrawer)({
       treeWidgets: this.sidebarSlot,
       filtersSlot: this.drawerComponentsFiltersSlot,
       drawerWidgetSlot: this.drawerWidgetSlot,
-      assumeScopeInUrl
+      assumeScopeInUrl,
+      overrideUseComponents
     }));
   }
 
@@ -473,7 +486,7 @@ class ScopeUI {
 
   static async provider([ui, componentUi, sidebar, commandBarUI], config, [routeSlot, menuSlot, sidebarSlot, scopeBadgeSlot, menuWidgetSlot, menuItemSlot, sidebarItemSlot, cornerSlot, overviewSlot, contextSlot, drawerWidgetSlot, componentFiltersSlot]) {
     const scopeUi = new ScopeUI(routeSlot, componentUi, menuSlot, sidebar, sidebarSlot, commandBarUI, scopeBadgeSlot, menuWidgetSlot, sidebarItemSlot, menuItemSlot, cornerSlot, overviewSlot, contextSlot, drawerWidgetSlot, componentFiltersSlot);
-    scopeUi.registerDrawerComponentFilters([_componentUiComponentFilters().DeprecateFilter, _componentUiComponentFilters2().EnvsFilter]);
+    scopeUi.registerDrawerComponentFilters([_componentUiComponentFilters().DeprecateFilter, _componentUiComponentFilters2().EnvsFilter, (0, _componentUiComponentFilters3().ShowMainFilter)(false)]);
     scopeUi.registerDrawerWidgets([/*#__PURE__*/_react().default.createElement(_componentUi().FilterWidget, {
       key: 'workspace-filter-widget'
     }), /*#__PURE__*/_react().default.createElement(_componentUi().TreeToggleWidget, {
@@ -488,7 +501,7 @@ class ScopeUI {
           exact: true,
           href: "/",
           icon: "comps"
-        }, "Gallery");
+        }, "Overview");
       }
     });
     if (ui) scopeUi.registerExplicitRoutes();

package/dist/scope.ui.runtime.js.map

@@ -1 +1 @@
-{"version":3,"names":["ScopeUI","constructor","routeSlot","componentUi","menuSlot","sidebar","sidebarSlot","commandBarUI","scopeBadgeSlot","menuWidgetSlot","sidebarItemSlot","menuItemSlot","cornerSlot","overviewSlot","contextSlot","drawerWidgetSlot","drawerComponentsFiltersSlot","routes","register","menuItems","componentTreeNodes","map","componentTreeNode","links","drawer","registerDrawer","filters","widgets","components","updateComponents","category","title","keyChar","handler","run","registerBadge","badges","getScope","options","TargetScopeOverview","Corner","listSidebarLinks","useScope","getContext","setSidebarToggle","paneClassName","registerOverviewLine","lines","registerRoutes","applyMenuRoutes","registerMenuRoutes","path","routePath","element","getMenu","ScopeAspect","id","getScopeMenu","registerExplicitRoutes","getComponentUI","registerMenuWidget","registerCorner","corner","registerComponentUrl","func","componentUrlFunc","replaceOverview","replaceDescription","replaceMetadataSection","registerMetadataItem","replaceComponentGrid","registerMetadata","addContext","context","contexts","values","ComponentUrlFuncProvider","children","flatten","concat","registerDefaultDrawers","assumeScopeInUrl","scopeDrawer","treeWidgets","filtersSlot","uiRoot","setKeyBindHandler","addCommand","action","displayName","keybinding","sorted","sort","a","b","aWeight","weight","bWeight","compact","link","component","provider","ui","config","componentFiltersSlot","scopeUi","registerDrawerComponentFilters","DeprecateFilter","EnvsFilter","registerDrawerWidgets","registerRoot","bind","registerMenuItem","showGallery","registerSidebarLink","Gallery","UIAspect","ComponentAspect","SidebarAspect","CommandBarAspect","UIRuntime","Slot","withType","addRuntime"],"sources":["scope.ui.runtime.tsx"],"sourcesContent":["import type { ComponentUI, ComponentModel } from '@teambit/component';\nimport { compact, flatten } from 'lodash';\nimport { ComponentAspect } from '@teambit/component';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SidebarAspect, SidebarUI, SidebarItem, SidebarItemSlot } from '@teambit/sidebar';\nimport { ComponentTreeNode } from '@teambit/component-tree';\nimport { UIAspect, UIRootUI as UIRoot, UIRuntime, UiUI } from '@teambit/ui';\nimport React, { ComponentType, ReactNode } from 'react';\nimport { MenuItemSlot, MenuItem } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { RouteProps } from 'react-router-dom';\nimport { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';\nimport { MenuLinkItem } from '@teambit/design.ui.surfaces.menu.link-item';\nimport CommandBarAspect, { CommandBarUI, CommandHandler } from '@teambit/command-bar';\nimport { ScopeModel } from '@teambit/scope.models.scope-model';\nimport { DrawerType } from '@teambit/ui-foundation.ui.tree.drawer';\nimport {\n  DrawerWidgetSlot,\n  FilterWidget,\n  TreeToggleWidget,\n  ComponentFiltersSlot,\n} from '@teambit/component.ui.component-drawer';\nimport { ComponentFilters } from '@teambit/component.ui.component-filters.component-filter-context';\nimport { DeprecateFilter } from '@teambit/component.ui.component-filters.deprecate-filter';\nimport { EnvsFilter } from '@teambit/component.ui.component-filters.env-filter';\nimport { ComponentUrlResolver, ComponentUrlProvider } from '@teambit/component.modules.component-url';\nimport { ScopeMenu, ScopeUseBox } from './ui/menu';\nimport { ScopeAspect } from './scope.aspect';\nimport { Scope } from './ui/scope';\nimport { scopeDrawer } from './scope.ui.drawer';\nimport { GetScopeOptions } from './get-scope-options';\n\nexport type ScopeBadge = ComponentType;\n\nexport type ScopeBadgeSlot = SlotRegistry<ScopeBadge[]>;\n\nexport type ContextSlot = SlotRegistry<ScopeContextType[]>;\n\nexport type ScopeContextType = ComponentType<{ scope: ScopeModel; children: ReactNode }>;\n\nexport type SidebarSlot = SlotRegistry<ComponentTreeNode>;\n\nexport type ScopeOverview = ComponentType;\n\nexport type ScopeOverviewSlot = SlotRegistry<ScopeOverview>;\n\nexport type Corner = ComponentType;\n\nexport type CornerSlot = SlotRegistry<Corner>;\n\nexport type OverviewLine = ComponentType;\n\nexport type OverviewLineSlot = SlotRegistry<OverviewLine[]>;\n\nexport type ScopeUIConfig = {\n  showGallery: boolean;\n};\n\nexport class ScopeUI {\n  constructor(\n    /**\n     * route slot.\n     */\n    private routeSlot: RouteSlot,\n\n    /**\n     * component ui extension.\n     */\n    private componentUi: ComponentUI,\n    /**\n     * menu slot\n     */\n    private menuSlot: RouteSlot,\n\n    private sidebar: SidebarUI,\n\n    private sidebarSlot: SidebarSlot,\n\n    private commandBarUI: CommandBarUI,\n\n    private scopeBadgeSlot: ScopeBadgeSlot,\n\n    private menuWidgetSlot: MenuWidgetSlot,\n\n    /**\n     * sidebar link slot\n     */\n    private sidebarItemSlot: SidebarItemSlot,\n\n    /**\n     * main dropdown item slot\n     */\n    private menuItemSlot: MenuItemSlot,\n\n    /**\n     * corner slot\n     */\n    private cornerSlot: CornerSlot,\n\n    /**\n     * overview line slot to add new lines beneath the overview section\n     */\n    private overviewSlot: OverviewLineSlot,\n\n    /**\n     * add a new context to ui\n     */\n    private contextSlot: ContextSlot,\n    private drawerWidgetSlot: DrawerWidgetSlot,\n    private drawerComponentsFiltersSlot: ComponentFiltersSlot\n  ) {}\n\n  private setSidebarToggle: (updated: CommandHandler) => void = () => {};\n\n  /**\n   * register a new badge into the scope overview.\n   */\n  registerBadge(...badges: ScopeBadge[]) {\n    this.scopeBadgeSlot.register(badges);\n    return this;\n  }\n\n  getScope(options: GetScopeOptions) {\n    return (\n      <Scope\n        TargetScopeOverview={options.TargetScopeOverview}\n        TargetCorner={options.Corner}\n        routeSlot={this.routeSlot}\n        menuSlot={this.menuSlot}\n        sidebar={<this.sidebar.render items={this.listSidebarLinks()} />}\n        scopeUi={this}\n        userUseScopeQuery={options.useScope}\n        badgeSlot={this.scopeBadgeSlot}\n        overviewLineSlot={this.overviewSlot}\n        context={this.getContext()}\n        onSidebarTogglerChange={this.setSidebarToggle}\n        cornerSlot={this.cornerSlot}\n        paneClassName={options.paneClassName}\n      />\n    );\n  }\n\n  /**\n   * register a new line beneath the scope overview section.\n   */\n  registerOverviewLine(...lines: OverviewLine[]) {\n    this.overviewSlot.register(lines);\n    return this;\n  }\n\n  /**\n   * register a route to the scope.\n   */\n  registerRoutes(routes: RouteProps[]) {\n    this.routeSlot.register(routes);\n    return this;\n  }\n\n  registerMenuRoutes = (routes: RouteProps[]) => {\n    this.menuSlot.register(routes);\n    return this;\n  };\n\n  private applyMenuRoutes() {\n    this.registerMenuRoutes([\n      {\n        path: this.componentUi.routePath,\n        element: this.componentUi.getMenu(ScopeAspect.id),\n      },\n      {\n        path: '/',\n        element: this.getScopeMenu(),\n      },\n    ]);\n  }\n\n  getScopeMenu() {\n    return <ScopeMenu widgetSlot={this.menuWidgetSlot} menuItemSlot={this.menuItemSlot} />;\n  }\n\n  private registerExplicitRoutes() {\n    this.applyMenuRoutes();\n    this.registerRoutes([\n      {\n        path: this.componentUi.routePath,\n        element: this.componentUi.getComponentUI(ScopeAspect.id),\n      },\n    ]);\n  }\n\n  registerMenuWidget(...menuItems: MenuWidget[]) {\n    this.menuWidgetSlot.register(menuItems);\n  }\n\n  registerCorner(corner: Corner) {\n    this.cornerSlot.register(corner);\n  }\n\n  private componentUrlFunc: ComponentUrlResolver | undefined;\n  registerComponentUrl(func: ComponentUrlResolver) {\n    this.componentUrlFunc = func;\n  }\n\n  /**\n   * register a scope overview.\n   */\n  replaceOverview() {}\n\n  /**\n   * register description.\n   */\n  replaceDescription() {}\n\n  /**\n   * register metadata section.\n   */\n  replaceMetadataSection() {}\n\n  /**\n   * register a metadata item.\n   */\n  registerMetadataItem() {}\n\n  replaceComponentGrid() {}\n\n  /**\n   * register metadata.\n   */\n  registerMetadata() {}\n\n  /**\n   * add a new context to the scope.\n   */\n  addContext(...context: ScopeContextType[]) {\n    this.contextSlot.register(context);\n    return this;\n  }\n\n  private getContext() {\n    const contexts = this.contextSlot.values();\n    // eslint-disable-next-line react/prop-types\n    const ComponentUrlFuncProvider: ScopeContextType = ({ children }) => (\n      <ComponentUrlProvider value={this.componentUrlFunc}>{children}</ComponentUrlProvider>\n    );\n\n    return flatten(contexts).concat(ComponentUrlFuncProvider);\n  }\n\n  registerMenuItem = (menuItems: MenuItem[]) => {\n    this.menuItemSlot.register(menuItems);\n  };\n\n  /**\n   * register a sidebar Widget for the scope\n   */\n  registerSidebarWidget = (componentTreeNodes: ComponentTreeNode[]) => {\n    componentTreeNodes.map((componentTreeNode) => this.sidebarSlot.register(componentTreeNode));\n    return this;\n  };\n\n  /**\n   * register a sidebar link to the section above the drawers\n   */\n  registerSidebarLink = (...links: SidebarItem[]) => {\n    this.sidebarItemSlot.register(links);\n  };\n\n  registerDrawers = (...drawer: DrawerType[]) => {\n    this.sidebar.registerDrawer(...drawer);\n    return this;\n  };\n\n  /**\n   * register component filters\n   */\n  registerDrawerComponentFilters = (filters: ComponentFilters) => {\n    this.drawerComponentsFiltersSlot.register(filters);\n  };\n\n  registerDrawerWidgets = (widgets: ReactNode[]) => {\n    this.drawerWidgetSlot.register(widgets);\n  };\n\n  registerDefaultDrawers(assumeScopeInUrl = false) {\n    this.sidebar.registerDrawer(\n      scopeDrawer({\n        treeWidgets: this.sidebarSlot,\n        filtersSlot: this.drawerComponentsFiltersSlot,\n        drawerWidgetSlot: this.drawerWidgetSlot,\n        assumeScopeInUrl,\n      })\n    );\n  }\n\n  uiRoot(): UIRoot {\n    this.registerDefaultDrawers();\n    const [setKeyBindHandler] = this.commandBarUI.addCommand({\n      id: 'sidebar.toggle', // TODO - extract to a component!\n      action: () => {},\n      displayName: 'Toggle component list',\n      keybinding: 'alt+s',\n    });\n    this.setSidebarToggle = setKeyBindHandler;\n\n    return {\n      routes: [\n        {\n          path: '/*',\n          element: (\n            <Scope\n              routeSlot={this.routeSlot}\n              menuSlot={this.menuSlot}\n              sidebar={<this.sidebar.render items={this.listSidebarLinks()} />}\n              scopeUi={this}\n              badgeSlot={this.scopeBadgeSlot}\n              overviewLineSlot={this.overviewSlot}\n              context={this.getContext()}\n              onSidebarTogglerChange={this.setSidebarToggle}\n              cornerSlot={this.cornerSlot}\n            />\n          ),\n        },\n      ],\n    };\n  }\n\n  listSidebarLinks() {\n    const links = flatten(this.sidebarItemSlot.values());\n    const sorted = links.sort((a, b) => {\n      const aWeight = a?.weight || 0;\n      const bWeight = b?.weight || 0;\n      return aWeight - bWeight;\n    });\n\n    return compact(sorted.map((link) => {\n      return link.component;\n    }));\n  }\n\n  /** registers available components */\n  setComponents = (components: ComponentModel[]) => {\n    this.componentUi.updateComponents(components);\n  };\n\n  private menuItems: MenuItem[] = [\n    {\n      category: 'general',\n      title: 'Open command bar',\n      keyChar: 'mod+k',\n      handler: () => this.commandBarUI?.run('command-bar.open'),\n    },\n    {\n      category: 'general',\n      title: 'Toggle component list',\n      keyChar: 'alt+s',\n      handler: () => this.commandBarUI?.run('sidebar.toggle'),\n    },\n  ];\n\n  static dependencies = [UIAspect, ComponentAspect, SidebarAspect, CommandBarAspect];\n  static runtime = UIRuntime;\n  static slots = [\n    Slot.withType<RouteProps>(),\n    Slot.withType<RouteProps>(),\n    Slot.withType<ComponentTreeNode>(),\n    Slot.withType<ScopeBadge>(),\n    Slot.withType<ScopeOverview>(),\n    Slot.withType<MenuWidget[]>(),\n    Slot.withType<MenuItemSlot>(),\n    Slot.withType<CornerSlot>(),\n    Slot.withType<OverviewLineSlot>(),\n    Slot.withType<SidebarItemSlot>(),\n    Slot.withType<ContextSlot>(),\n    Slot.withType<DrawerWidgetSlot>(),\n    Slot.withType<ComponentFiltersSlot>(),\n  ];\n\n  static defaultConfig = {\n    showGallery: true,\n  };\n\n  static async provider(\n    [ui, componentUi, sidebar, commandBarUI]: [UiUI, ComponentUI, SidebarUI, CommandBarUI],\n    config: ScopeUIConfig,\n    [\n      routeSlot,\n      menuSlot,\n      sidebarSlot,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      menuItemSlot,\n      sidebarItemSlot,\n      cornerSlot,\n      overviewSlot,\n      contextSlot,\n      drawerWidgetSlot,\n      componentFiltersSlot,\n    ]: [\n      RouteSlot,\n      RouteSlot,\n      SidebarSlot,\n      ScopeBadgeSlot,\n      MenuWidgetSlot,\n      MenuItemSlot,\n      SidebarItemSlot,\n      CornerSlot,\n      OverviewLineSlot,\n      ContextSlot,\n      DrawerWidgetSlot,\n      ComponentFiltersSlot\n    ]\n  ) {\n    const scopeUi = new ScopeUI(\n      routeSlot,\n      componentUi,\n      menuSlot,\n      sidebar,\n      sidebarSlot,\n      commandBarUI,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      sidebarItemSlot,\n      menuItemSlot,\n      cornerSlot,\n      overviewSlot,\n      contextSlot,\n      drawerWidgetSlot,\n      componentFiltersSlot\n    );\n    scopeUi.registerDrawerComponentFilters([DeprecateFilter, EnvsFilter]);\n    scopeUi.registerDrawerWidgets([\n      <FilterWidget key={'workspace-filter-widget'} />,\n      <TreeToggleWidget key={'workspace-tree-toggle-widget'} />,\n    ]);\n    if (ui) ui.registerRoot(scopeUi.uiRoot.bind(scopeUi));\n    scopeUi.registerMenuItem(scopeUi.menuItems);\n    scopeUi.registerMenuWidget(() => <ScopeUseBox />);\n    if (config.showGallery)\n      scopeUi.registerSidebarLink({\n        component: function Gallery() {\n          return (\n            <MenuLinkItem exact href=\"/\" icon=\"comps\">\n              Gallery\n            </MenuLinkItem>\n          );\n        },\n      });\n    if (ui) scopeUi.registerExplicitRoutes();\n\n    return scopeUi;\n  }\n}\n\nexport default ScopeUI;\n\nScopeAspect.addRuntime(ScopeUI);\n"],"mappings":"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"}
+{"version":3,"names":["ScopeUI","constructor","routeSlot","componentUi","menuSlot","sidebar","sidebarSlot","commandBarUI","scopeBadgeSlot","menuWidgetSlot","sidebarItemSlot","menuItemSlot","cornerSlot","overviewSlot","contextSlot","drawerWidgetSlot","drawerComponentsFiltersSlot","routes","register","menuItems","componentTreeNodes","map","componentTreeNode","links","drawer","registerDrawer","filters","widgets","components","updateComponents","category","title","keyChar","handler","run","registerBadge","badges","getScope","options","TargetScopeOverview","scopeClassName","Corner","listSidebarLinks","useScope","getContext","setSidebarToggle","paneClassName","PaneWrapper","registerOverviewLine","lines","registerRoutes","applyMenuRoutes","registerMenuRoutes","path","routePath","element","getMenu","ScopeAspect","id","getScopeMenu","registerExplicitRoutes","getComponentUI","registerMenuWidget","registerCorner","corner","registerComponentUrl","func","componentUrlFunc","replaceOverview","replaceDescription","replaceMetadataSection","registerMetadataItem","replaceComponentGrid","registerMetadata","addContext","context","contexts","values","ComponentUrlFuncProvider","children","flatten","concat","registerDefaultDrawers","assumeScopeInUrl","overrideUseComponents","scopeDrawer","treeWidgets","filtersSlot","uiRoot","setKeyBindHandler","addCommand","action","displayName","keybinding","sorted","sort","a","b","aWeight","weight","bWeight","compact","link","component","provider","ui","config","componentFiltersSlot","scopeUi","registerDrawerComponentFilters","DeprecateFilter","EnvsFilter","ShowMainFilter","registerDrawerWidgets","registerRoot","bind","registerMenuItem","showGallery","registerSidebarLink","Gallery","UIAspect","ComponentAspect","SidebarAspect","CommandBarAspect","UIRuntime","Slot","withType","addRuntime"],"sources":["scope.ui.runtime.tsx"],"sourcesContent":["import type { ComponentUI, ComponentModel } from '@teambit/component';\nimport { compact, flatten } from 'lodash';\nimport { ComponentAspect } from '@teambit/component';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SidebarAspect, SidebarUI, SidebarItem, SidebarItemSlot } from '@teambit/sidebar';\nimport { ComponentTreeNode } from '@teambit/component-tree';\nimport { UIAspect, UIRootUI as UIRoot, UIRuntime, UiUI } from '@teambit/ui';\nimport React, { ComponentType, ReactNode } from 'react';\nimport { MenuItemSlot, MenuItem } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { RouteProps } from 'react-router-dom';\nimport { MenuWidget, MenuWidgetSlot } from '@teambit/ui-foundation.ui.menu';\nimport { MenuLinkItem } from '@teambit/design.ui.surfaces.menu.link-item';\nimport CommandBarAspect, { CommandBarUI, CommandHandler } from '@teambit/command-bar';\nimport { ScopeModel } from '@teambit/scope.models.scope-model';\nimport { DrawerType } from '@teambit/ui-foundation.ui.tree.drawer';\nimport {\n  DrawerWidgetSlot,\n  FilterWidget,\n  TreeToggleWidget,\n  ComponentFiltersSlot,\n} from '@teambit/component.ui.component-drawer';\nimport { ComponentFilters } from '@teambit/component.ui.component-filters.component-filter-context';\nimport { DeprecateFilter } from '@teambit/component.ui.component-filters.deprecate-filter';\nimport { EnvsFilter } from '@teambit/component.ui.component-filters.env-filter';\nimport { ComponentUrlResolver, ComponentUrlProvider } from '@teambit/component.modules.component-url';\nimport { ShowMainFilter } from '@teambit/component.ui.component-filters.show-main-filter';\nimport { ScopeMenu, ScopeUseBox } from './ui/menu';\nimport { ScopeAspect } from './scope.aspect';\nimport { Scope } from './ui/scope';\nimport { scopeDrawer } from './scope.ui.drawer';\nimport { GetScopeOptions } from './get-scope-options';\n\nexport type ScopeBadge = ComponentType;\n\nexport type ScopeBadgeSlot = SlotRegistry<ScopeBadge[]>;\n\nexport type ContextSlot = SlotRegistry<ScopeContextType[]>;\n\nexport type ScopeContextType = ComponentType<{ scope: ScopeModel; children: ReactNode }>;\n\nexport type SidebarSlot = SlotRegistry<ComponentTreeNode>;\n\nexport type ScopeOverview = ComponentType;\n\nexport type ScopeOverviewSlot = SlotRegistry<ScopeOverview>;\n\nexport type Corner = ComponentType;\n\nexport type CornerSlot = SlotRegistry<Corner>;\n\nexport type OverviewLine = ComponentType;\n\nexport type OverviewLineSlot = SlotRegistry<OverviewLine[]>;\n\nexport type ScopeUIConfig = {\n  showGallery: boolean;\n};\n\nexport class ScopeUI {\n  constructor(\n    /**\n     * route slot.\n     */\n    private routeSlot: RouteSlot,\n\n    /**\n     * component ui extension.\n     */\n    private componentUi: ComponentUI,\n    /**\n     * menu slot\n     */\n    private menuSlot: RouteSlot,\n\n    private sidebar: SidebarUI,\n\n    private sidebarSlot: SidebarSlot,\n\n    private commandBarUI: CommandBarUI,\n\n    private scopeBadgeSlot: ScopeBadgeSlot,\n\n    private menuWidgetSlot: MenuWidgetSlot,\n\n    /**\n     * sidebar link slot\n     */\n    private sidebarItemSlot: SidebarItemSlot,\n\n    /**\n     * main dropdown item slot\n     */\n    private menuItemSlot: MenuItemSlot,\n\n    /**\n     * corner slot\n     */\n    private cornerSlot: CornerSlot,\n\n    /**\n     * overview line slot to add new lines beneath the overview section\n     */\n    private overviewSlot: OverviewLineSlot,\n\n    /**\n     * add a new context to ui\n     */\n    private contextSlot: ContextSlot,\n    private drawerWidgetSlot: DrawerWidgetSlot,\n    private drawerComponentsFiltersSlot: ComponentFiltersSlot\n  ) {}\n\n  private setSidebarToggle: (updated: CommandHandler) => void = () => {};\n\n  /**\n   * register a new badge into the scope overview.\n   */\n  registerBadge(...badges: ScopeBadge[]) {\n    this.scopeBadgeSlot.register(badges);\n    return this;\n  }\n\n  getScope(options: GetScopeOptions) {\n    return (\n      <Scope\n        TargetScopeOverview={options.TargetScopeOverview}\n        scopeClassName={options.scopeClassName}\n        TargetCorner={options.Corner}\n        routeSlot={this.routeSlot}\n        menuSlot={this.menuSlot}\n        sidebar={<this.sidebar.render items={this.listSidebarLinks()} />}\n        scopeUi={this}\n        userUseScopeQuery={options.useScope}\n        badgeSlot={this.scopeBadgeSlot}\n        overviewLineSlot={this.overviewSlot}\n        context={this.getContext()}\n        onSidebarTogglerChange={this.setSidebarToggle}\n        cornerSlot={this.cornerSlot}\n        paneClassName={options.paneClassName}\n        PaneWrapper={options.PaneWrapper}\n      />\n    );\n  }\n\n  /**\n   * register a new line beneath the scope overview section.\n   */\n  registerOverviewLine(...lines: OverviewLine[]) {\n    this.overviewSlot.register(lines);\n    return this;\n  }\n\n  /**\n   * register a route to the scope.\n   */\n  registerRoutes(routes: RouteProps[]) {\n    this.routeSlot.register(routes);\n    return this;\n  }\n\n  registerMenuRoutes = (routes: RouteProps[]) => {\n    this.menuSlot.register(routes);\n    return this;\n  };\n\n  private applyMenuRoutes() {\n    this.registerMenuRoutes([\n      {\n        path: this.componentUi.routePath,\n        element: this.componentUi.getMenu(ScopeAspect.id),\n      },\n      {\n        path: '/',\n        element: this.getScopeMenu(),\n      },\n    ]);\n  }\n\n  getScopeMenu() {\n    return <ScopeMenu widgetSlot={this.menuWidgetSlot} menuItemSlot={this.menuItemSlot} />;\n  }\n\n  private registerExplicitRoutes() {\n    this.applyMenuRoutes();\n    this.registerRoutes([\n      {\n        path: this.componentUi.routePath,\n        element: this.componentUi.getComponentUI(ScopeAspect.id),\n      },\n    ]);\n  }\n\n  registerMenuWidget(...menuItems: MenuWidget[]) {\n    this.menuWidgetSlot.register(menuItems);\n  }\n\n  registerCorner(corner: Corner) {\n    this.cornerSlot.register(corner);\n  }\n\n  private componentUrlFunc: ComponentUrlResolver | undefined;\n  registerComponentUrl(func: ComponentUrlResolver) {\n    this.componentUrlFunc = func;\n  }\n\n  /**\n   * register a scope overview.\n   */\n  replaceOverview() {}\n\n  /**\n   * register description.\n   */\n  replaceDescription() {}\n\n  /**\n   * register metadata section.\n   */\n  replaceMetadataSection() {}\n\n  /**\n   * register a metadata item.\n   */\n  registerMetadataItem() {}\n\n  replaceComponentGrid() {}\n\n  /**\n   * register metadata.\n   */\n  registerMetadata() {}\n\n  /**\n   * add a new context to the scope.\n   */\n  addContext(...context: ScopeContextType[]) {\n    this.contextSlot.register(context);\n    return this;\n  }\n\n  private getContext() {\n    const contexts = this.contextSlot.values();\n    // eslint-disable-next-line react/prop-types\n    const ComponentUrlFuncProvider: ScopeContextType = ({ children }) => (\n      <ComponentUrlProvider value={this.componentUrlFunc}>{children}</ComponentUrlProvider>\n    );\n\n    return flatten(contexts).concat(ComponentUrlFuncProvider);\n  }\n\n  registerMenuItem = (menuItems: MenuItem[]) => {\n    this.menuItemSlot.register(menuItems);\n  };\n\n  /**\n   * register a sidebar Widget for the scope\n   */\n  registerSidebarWidget = (componentTreeNodes: ComponentTreeNode[]) => {\n    componentTreeNodes.map((componentTreeNode) => this.sidebarSlot.register(componentTreeNode));\n    return this;\n  };\n\n  /**\n   * register a sidebar link to the section above the drawers\n   */\n  registerSidebarLink = (...links: SidebarItem[]) => {\n    this.sidebarItemSlot.register(links);\n  };\n\n  registerDrawers = (...drawer: DrawerType[]) => {\n    this.sidebar.registerDrawer(...drawer);\n    return this;\n  };\n\n  /**\n   * register component filters\n   */\n  registerDrawerComponentFilters = (filters: ComponentFilters) => {\n    this.drawerComponentsFiltersSlot.register(filters);\n  };\n\n  registerDrawerWidgets = (widgets: ReactNode[]) => {\n    this.drawerWidgetSlot.register(widgets);\n  };\n\n  registerDefaultDrawers(assumeScopeInUrl = false, overrideUseComponents?: () => { components: ComponentModel[] }) {\n    this.sidebar.registerDrawer(\n      scopeDrawer({\n        treeWidgets: this.sidebarSlot,\n        filtersSlot: this.drawerComponentsFiltersSlot,\n        drawerWidgetSlot: this.drawerWidgetSlot,\n        assumeScopeInUrl,\n        overrideUseComponents,\n      })\n    );\n  }\n\n  uiRoot(): UIRoot {\n    this.registerDefaultDrawers();\n    const [setKeyBindHandler] = this.commandBarUI.addCommand({\n      id: 'sidebar.toggle', // TODO - extract to a component!\n      action: () => {},\n      displayName: 'Toggle component list',\n      keybinding: 'alt+s',\n    });\n    this.setSidebarToggle = setKeyBindHandler;\n\n    return {\n      routes: [\n        {\n          path: '/*',\n          element: (\n            <Scope\n              routeSlot={this.routeSlot}\n              menuSlot={this.menuSlot}\n              sidebar={<this.sidebar.render items={this.listSidebarLinks()} />}\n              scopeUi={this}\n              badgeSlot={this.scopeBadgeSlot}\n              overviewLineSlot={this.overviewSlot}\n              context={this.getContext()}\n              onSidebarTogglerChange={this.setSidebarToggle}\n              cornerSlot={this.cornerSlot}\n            />\n          ),\n        },\n      ],\n    };\n  }\n\n  listSidebarLinks() {\n    const links = flatten(this.sidebarItemSlot.values());\n    const sorted = links.sort((a, b) => {\n      const aWeight = a?.weight || 0;\n      const bWeight = b?.weight || 0;\n      return aWeight - bWeight;\n    });\n\n    return compact(\n      sorted.map((link) => {\n        return link.component;\n      })\n    );\n  }\n\n  /** registers available components */\n  setComponents = (components: ComponentModel[]) => {\n    this.componentUi.updateComponents(components);\n  };\n\n  private menuItems: MenuItem[] = [\n    {\n      category: 'general',\n      title: 'Open command bar',\n      keyChar: 'mod+k',\n      handler: () => this.commandBarUI?.run('command-bar.open'),\n    },\n    {\n      category: 'general',\n      title: 'Toggle component list',\n      keyChar: 'alt+s',\n      handler: () => this.commandBarUI?.run('sidebar.toggle'),\n    },\n  ];\n\n  static dependencies = [UIAspect, ComponentAspect, SidebarAspect, CommandBarAspect];\n  static runtime = UIRuntime;\n  static slots = [\n    Slot.withType<RouteProps>(),\n    Slot.withType<RouteProps>(),\n    Slot.withType<ComponentTreeNode>(),\n    Slot.withType<ScopeBadge>(),\n    Slot.withType<ScopeOverview>(),\n    Slot.withType<MenuWidget[]>(),\n    Slot.withType<MenuItemSlot>(),\n    Slot.withType<CornerSlot>(),\n    Slot.withType<OverviewLineSlot>(),\n    Slot.withType<SidebarItemSlot>(),\n    Slot.withType<ContextSlot>(),\n    Slot.withType<DrawerWidgetSlot>(),\n    Slot.withType<ComponentFiltersSlot>(),\n  ];\n\n  static defaultConfig = {\n    showGallery: true,\n  };\n\n  static async provider(\n    [ui, componentUi, sidebar, commandBarUI]: [UiUI, ComponentUI, SidebarUI, CommandBarUI],\n    config: ScopeUIConfig,\n    [\n      routeSlot,\n      menuSlot,\n      sidebarSlot,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      menuItemSlot,\n      sidebarItemSlot,\n      cornerSlot,\n      overviewSlot,\n      contextSlot,\n      drawerWidgetSlot,\n      componentFiltersSlot,\n    ]: [\n      RouteSlot,\n      RouteSlot,\n      SidebarSlot,\n      ScopeBadgeSlot,\n      MenuWidgetSlot,\n      MenuItemSlot,\n      SidebarItemSlot,\n      CornerSlot,\n      OverviewLineSlot,\n      ContextSlot,\n      DrawerWidgetSlot,\n      ComponentFiltersSlot\n    ]\n  ) {\n    const scopeUi = new ScopeUI(\n      routeSlot,\n      componentUi,\n      menuSlot,\n      sidebar,\n      sidebarSlot,\n      commandBarUI,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      sidebarItemSlot,\n      menuItemSlot,\n      cornerSlot,\n      overviewSlot,\n      contextSlot,\n      drawerWidgetSlot,\n      componentFiltersSlot\n    );\n    scopeUi.registerDrawerComponentFilters([DeprecateFilter, EnvsFilter, ShowMainFilter(false)]);\n    scopeUi.registerDrawerWidgets([\n      <FilterWidget key={'workspace-filter-widget'} />,\n      <TreeToggleWidget key={'workspace-tree-toggle-widget'} />,\n    ]);\n    if (ui) ui.registerRoot(scopeUi.uiRoot.bind(scopeUi));\n    scopeUi.registerMenuItem(scopeUi.menuItems);\n    scopeUi.registerMenuWidget(() => <ScopeUseBox />);\n    if (config.showGallery)\n      scopeUi.registerSidebarLink({\n        component: function Gallery() {\n          return (\n            <MenuLinkItem exact href=\"/\" icon=\"comps\">\n              Overview\n            </MenuLinkItem>\n          );\n        },\n      });\n    if (ui) scopeUi.registerExplicitRoutes();\n\n    return scopeUi;\n  }\n}\n\nexport default ScopeUI;\n\nScopeAspect.addRuntime(ScopeUI);\n"],"mappings":"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"}

package/dist/ui/scope.d.ts

@@ -1,6 +1,6 @@
+import { ComponentType, ReactNode } from 'react';
 import 'reset-css';
 import { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
-import { ComponentType } from 'react';
 import ScopeUI, { ScopeBadgeSlot, ScopeContextType, CornerSlot, OverviewLineSlot } from '../scope.ui.runtime';
 import { ScopeModel } from '..';
 export declare type ScopeProps = {
@@ -19,8 +19,12 @@ export declare type ScopeProps = {
     onSidebarTogglerChange: (callback: () => void) => void;
     TargetCorner?: ComponentType;
     paneClassName?: string;
+    scopeClassName?: string;
+    PaneWrapper?: ComponentType<{
+        children: ReactNode;
+    }>;
 };
 /**
  * root component of the scope
  */
-export declare function Scope({ routeSlot, menuSlot, sidebar, scopeUi, badgeSlot, overviewLineSlot, cornerSlot, context, paneClassName, TargetScopeOverview, TargetCorner, onSidebarTogglerChange, userUseScopeQuery, }: ScopeProps): JSX.Element;
+export declare function Scope({ routeSlot, menuSlot, sidebar, scopeUi, badgeSlot, overviewLineSlot, cornerSlot, PaneWrapper, context, paneClassName, TargetScopeOverview, TargetCorner, onSidebarTogglerChange, userUseScopeQuery, scopeClassName, }: ScopeProps): JSX.Element;

package/dist/ui/scope.js

@@ -9,8 +9,28 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Scope = Scope;
 
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+
+  _react = function () {
+    return data;
+  };
+
+  return data;
+}
+
 require("reset-css");
 
+function _classnames() {
+  const data = _interopRequireDefault(require("classnames"));
+
+  _classnames = function () {
+    return data;
+  };
+
+  return data;
+}
+
 function _baseUiSurfacesSplitPane() {
   const data = require("@teambit/base-ui.surfaces.split-pane.split-pane");
 
@@ -91,16 +111,6 @@ function _uiFoundationUi3() {
   return data;
 }
 
-function _react() {
-  const data = _interopRequireWildcard(require("react"));
-
-  _react = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _reactRouterDom() {
   const data = require("react-router-dom");
 
@@ -176,12 +186,14 @@ function Scope({
   badgeSlot,
   overviewLineSlot,
   cornerSlot,
+  PaneWrapper,
   context = [],
   paneClassName,
   TargetScopeOverview,
   TargetCorner,
   onSidebarTogglerChange,
-  userUseScopeQuery
+  userUseScopeQuery,
+  scopeClassName
 }) {
   const {
     scope
@@ -205,7 +217,7 @@ function Scope({
   }, /*#__PURE__*/_react().default.createElement(_baseUiUtils().Composer, {
     components: Context
   }, /*#__PURE__*/_react().default.createElement("div", {
-    className: _scopeModule().default.scope
+    className: (0, _classnames().default)(_scopeModule().default.scope, scopeClassName)
   }, /*#__PURE__*/_react().default.createElement(_uiFoundationUi2().TopBar, {
     className: _scopeModule().default.topbar,
     Corner: () => {
@@ -230,8 +242,10 @@ function Scope({
     ,
     onClick: handleSidebarToggle,
     tooltipContent: `${isSidebarOpen ? 'Hide' : 'Show'} side panel`
-  })), /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane().Pane, {
-    className: paneClassName
+  })), /*#__PURE__*/_react().default.createElement(PaneContainer, {
+    Wrapper: PaneWrapper
+  }, /*#__PURE__*/_react().default.createElement(_baseUiSurfacesSplitPane().Pane, {
+    className: (0, _classnames().default)(paneClassName, _scopeModule().default.pane)
   }, /*#__PURE__*/_react().default.createElement(_uiFoundationUiReactRouter().SlotRouter, {
     slot: routeSlot
   }, /*#__PURE__*/_react().default.createElement(_reactRouterDom().Route, {
@@ -241,7 +255,15 @@ function Scope({
       overviewSlot: overviewLineSlot,
       TargetOverview: TargetScopeOverview
     })
-  })))))));
+  }))))))));
+}
+
+function PaneContainer({
+  children,
+  Wrapper
+}) {
+  if (!Wrapper) return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children);
+  return /*#__PURE__*/_react().default.createElement(Wrapper, null, children);
 }
 
 //# sourceMappingURL=scope.js.map

package/dist/ui/scope.js.map

@@ -1 +1 @@
-{"version":3,"names":["Scope","routeSlot","menuSlot","sidebar","scopeUi","badgeSlot","overviewLineSlot","cornerSlot","context","paneClassName","TargetScopeOverview","TargetCorner","onSidebarTogglerChange","userUseScopeQuery","scope","useScopeQuery","isMobile","useIsMobile","isSidebarOpen","handleSidebarToggle","useReducer","x","sidebarOpenness","Layout","row","right","CornerOverride","values","setComponents","components","Context","map","ctx","styles","topbar","name","whiteCorner","main","splitter","e","stopPropagation"],"sources":["scope.tsx"],"sourcesContent":["import 'reset-css';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { RouteSlot, SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { Corner } from '@teambit/ui-foundation.ui.corner';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { TopBar } from '@teambit/ui-foundation.ui.top-bar';\nimport { Composer, ComponentTuple } from '@teambit/base-ui.utils.composer';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport React, { useReducer, ComponentType } from 'react';\nimport { Route } from 'react-router-dom';\nimport { useIsMobile } from '@teambit/ui-foundation.ui.hooks.use-is-mobile';\nimport { ScopeProvider } from '@teambit/scope.ui.hooks.scope-context';\nimport { useScopeQuery } from '@teambit/scope.ui.hooks.use-scope';\nimport { ScopeOverview } from './scope-overview';\nimport styles from './scope.module.scss';\nimport ScopeUI, { ScopeBadgeSlot, ScopeContextType, CornerSlot, OverviewLineSlot } from '../scope.ui.runtime';\nimport { ScopeModel } from '..';\n\nexport type ScopeProps = {\n  routeSlot: RouteSlot;\n  menuSlot: RouteSlot;\n  sidebar: JSX.Element;\n  scopeUi: ScopeUI;\n  badgeSlot: ScopeBadgeSlot;\n  overviewLineSlot: OverviewLineSlot;\n  cornerSlot: CornerSlot;\n  context: ScopeContextType[];\n  TargetScopeOverview?: ComponentType;\n  userUseScopeQuery?: () => { scope: ScopeModel | undefined };\n  onSidebarTogglerChange: (callback: () => void) => void;\n  TargetCorner?: ComponentType;\n  paneClassName?: string;\n};\n\n/**\n * root component of the scope\n */\nexport function Scope({\n  routeSlot,\n  menuSlot,\n  sidebar,\n  scopeUi,\n  badgeSlot,\n  overviewLineSlot,\n  cornerSlot,\n  context = [],\n  paneClassName,\nTargetScopeOverview,\n  TargetCorner,\n  onSidebarTogglerChange,\n  userUseScopeQuery,\n}: ScopeProps) {\n  const { scope } = userUseScopeQuery ? userUseScopeQuery() : useScopeQuery();\n  const isMobile = useIsMobile();\n  const [isSidebarOpen, handleSidebarToggle] = useReducer((x) => !x, !isMobile);\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.right;\n  if (!scope) {\n    return <FullLoader />;\n  }\n  const CornerOverride = TargetCorner || cornerSlot?.values()[0];\n  scopeUi.setComponents(scope.components);\n  const Context = context.map((ctx) => [ctx, { scope }] as ComponentTuple);\n\n  onSidebarTogglerChange(handleSidebarToggle);\n\n  return (\n    <ScopeProvider scope={scope}>\n      <Composer components={Context}>\n        <div className={styles.scope}>\n          <TopBar\n            className={styles.topbar}\n            Corner={() => {\n              if (CornerOverride) return <CornerOverride />;\n              return <Corner name={scope.name} className={styles.whiteCorner} />;\n            }}\n            menu={menuSlot}\n          />\n\n          <SplitPane className={styles.main} size={264} layout={sidebarOpenness}>\n            <Pane className={styles.sidebar}>{sidebar}</Pane>\n            <HoverSplitter className={styles.splitter}>\n              <Collapser\n                isOpen={isSidebarOpen}\n                onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n                onClick={handleSidebarToggle}\n                tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side panel`}\n              />\n            </HoverSplitter>\n            <Pane className={paneClassName}>\n              <SlotRouter slot={routeSlot}>\n                <Route\n                  index\n                  element={\n                    <ScopeOverview\n                      badgeSlot={badgeSlot}\n                      overviewSlot={overviewLineSlot}\n                      TargetOverview={TargetScopeOverview}\n                    />\n                  }\n                />\n              </SlotRouter>\n            </Pane>\n          </SplitPane>\n        </div>\n      </Composer>\n    </ScopeProvider>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["Scope","routeSlot","menuSlot","sidebar","scopeUi","badgeSlot","overviewLineSlot","cornerSlot","PaneWrapper","context","paneClassName","TargetScopeOverview","TargetCorner","onSidebarTogglerChange","userUseScopeQuery","scopeClassName","scope","useScopeQuery","isMobile","useIsMobile","isSidebarOpen","handleSidebarToggle","useReducer","x","sidebarOpenness","Layout","row","right","CornerOverride","values","setComponents","components","Context","map","ctx","classNames","styles","topbar","name","whiteCorner","main","splitter","e","stopPropagation","pane","PaneContainer","children","Wrapper"],"sources":["scope.tsx"],"sourcesContent":["import React, { useReducer, ComponentType, ReactNode } from 'react';\nimport 'reset-css';\nimport classNames from 'classnames';\nimport { SplitPane, Pane, Layout } from '@teambit/base-ui.surfaces.split-pane.split-pane';\nimport { RouteSlot, SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { Corner } from '@teambit/ui-foundation.ui.corner';\nimport { Collapser } from '@teambit/ui-foundation.ui.buttons.collapser';\nimport { HoverSplitter } from '@teambit/base-ui.surfaces.split-pane.hover-splitter';\nimport { TopBar } from '@teambit/ui-foundation.ui.top-bar';\nimport { Composer, ComponentTuple } from '@teambit/base-ui.utils.composer';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport { Route } from 'react-router-dom';\nimport { useIsMobile } from '@teambit/ui-foundation.ui.hooks.use-is-mobile';\nimport { ScopeProvider } from '@teambit/scope.ui.hooks.scope-context';\nimport { useScopeQuery } from '@teambit/scope.ui.hooks.use-scope';\nimport { ScopeOverview } from './scope-overview';\nimport styles from './scope.module.scss';\nimport ScopeUI, { ScopeBadgeSlot, ScopeContextType, CornerSlot, OverviewLineSlot } from '../scope.ui.runtime';\nimport { ScopeModel } from '..';\n\nexport type ScopeProps = {\n  routeSlot: RouteSlot;\n  menuSlot: RouteSlot;\n  sidebar: JSX.Element;\n  scopeUi: ScopeUI;\n  badgeSlot: ScopeBadgeSlot;\n  overviewLineSlot: OverviewLineSlot;\n  cornerSlot: CornerSlot;\n  context: ScopeContextType[];\n  TargetScopeOverview?: ComponentType;\n  userUseScopeQuery?: () => { scope: ScopeModel | undefined };\n  onSidebarTogglerChange: (callback: () => void) => void;\n  TargetCorner?: ComponentType;\n  paneClassName?: string;\n  scopeClassName?: string;\n  PaneWrapper?: ComponentType<{ children: ReactNode }>;\n};\n\n/**\n * root component of the scope\n */\nexport function Scope({\n  routeSlot,\n  menuSlot,\n  sidebar,\n  scopeUi,\n  badgeSlot,\n  overviewLineSlot,\n  cornerSlot,\n  PaneWrapper,\n  context = [],\n  paneClassName,\n  TargetScopeOverview,\n  TargetCorner,\n  onSidebarTogglerChange,\n  userUseScopeQuery,\n  scopeClassName,\n}: ScopeProps) {\n  const { scope } = userUseScopeQuery ? userUseScopeQuery() : useScopeQuery();\n  const isMobile = useIsMobile();\n  const [isSidebarOpen, handleSidebarToggle] = useReducer((x) => !x, !isMobile);\n  const sidebarOpenness = isSidebarOpen ? Layout.row : Layout.right;\n  if (!scope) {\n    return <FullLoader />;\n  }\n  const CornerOverride = TargetCorner || cornerSlot?.values()[0];\n  scopeUi.setComponents(scope.components);\n  const Context = context.map((ctx) => [ctx, { scope }] as ComponentTuple);\n\n  onSidebarTogglerChange(handleSidebarToggle);\n\n  return (\n    <ScopeProvider scope={scope}>\n      <Composer components={Context}>\n        <div className={classNames(styles.scope, scopeClassName)}>\n          <TopBar\n            className={styles.topbar}\n            Corner={() => {\n              if (CornerOverride) return <CornerOverride />;\n              return <Corner name={scope.name} className={styles.whiteCorner} />;\n            }}\n            menu={menuSlot}\n          />\n\n          <SplitPane className={styles.main} size={264} layout={sidebarOpenness}>\n            <Pane className={styles.sidebar}>{sidebar}</Pane>\n            <HoverSplitter className={styles.splitter}>\n              <Collapser\n                isOpen={isSidebarOpen}\n                onMouseDown={(e) => e.stopPropagation()} // avoid split-pane drag\n                onClick={handleSidebarToggle}\n                tooltipContent={`${isSidebarOpen ? 'Hide' : 'Show'} side panel`}\n              />\n            </HoverSplitter>\n            <PaneContainer Wrapper={PaneWrapper}>\n              <Pane className={classNames(paneClassName, styles.pane)}>\n                <SlotRouter slot={routeSlot}>\n                  <Route\n                    index\n                    element={\n                      <ScopeOverview\n                        badgeSlot={badgeSlot}\n                        overviewSlot={overviewLineSlot}\n                        TargetOverview={TargetScopeOverview}\n                      />\n                    }\n                  />\n                </SlotRouter>\n              </Pane>\n            </PaneContainer>\n          </SplitPane>\n        </div>\n      </Composer>\n    </ScopeProvider>\n  );\n}\n\nfunction PaneContainer({\n  children,\n  Wrapper,\n}: {\n  children: ReactNode;\n  Wrapper?: ComponentType<{ children: ReactNode }>;\n}) {\n  if (!Wrapper) return <>{children}</>;\n  return <Wrapper>{children}</Wrapper>;\n}\n"],"mappings":"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"}

package/dist/ui/scope.module.scss

@@ -40,3 +40,7 @@
 
   height: 100%;
 }
+
+.pane {
+  height: 100%;
+}