@teambit/scope 0.0.607 → 0.0.615

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

@@ -132,6 +132,10 @@ export declare class ScopeUI {
     addContext(context: ScopeContextType): void;
     getContext(): ScopeContextType | undefined;
     registerMenuItem: (menuItems: MenuItem[]) => void;
+    /**
+     * register a sidebar Widget for the scope
+     */
+    registerSidebarWidget: (componentTreeNodes: ComponentTreeNode[]) => this;
     /**
      * register a sidebar link to the section above the drawers
      */

package/dist/scope.ui.runtime.js

@@ -193,6 +193,10 @@ class ScopeUI {
     (0, _defineProperty2().default)(this, "registerMenuItem", menuItems => {
       this.menuItemSlot.register(menuItems);
     });
+    (0, _defineProperty2().default)(this, "registerSidebarWidget", componentTreeNodes => {
+      componentTreeNodes.map(componentTreeNode => this.sidebarSlot.register(componentTreeNode));
+      return this;
+    });
     (0, _defineProperty2().default)(this, "registerSidebarLink", (...links) => {
       this.sidebarItemSlot.register(links);
     });

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

@@ -1 +1 @@
-{"version":3,"sources":["scope.ui.runtime.tsx"],"names":["ScopeUI","constructor","routeSlot","componentUi","menuSlot","sidebar","sidebarSlot","commandBarUI","componentSearcher","scopeBadgeSlot","menuWidgetSlot","sidebarItemSlot","menuItemSlot","cornerSlot","overviewSlot","menuItems","register","links","components","update","category","title","keyChar","handler","run","registerBadge","badges","registerOverviewLine","lines","registerRoute","route","registerExplicitRoutes","path","routePath","children","getComponentUI","ScopeAspect","id","getMenu","exact","registerMenuWidget","registerCorner","corner","replaceOverview","replaceDescription","replaceMetadataSection","registerMetadataItem","replaceComponentGrid","registerMetadata","addContext","context","_context","getContext","undefined","uiRoot","registerDrawer","ComponentsDrawer","addSearcher","setKeyBindHandler","addCommand","displayName","keybinding","setSidebarToggle","routes","provider","ui","reactRouterUI","config","ComponentSearcher","navigateTo","scopeUi","registerMenuItem","registerRoot","bind","registerSidebarLink","UIAspect","ComponentAspect","SidebarAspect","CommandBarAspect","ReactRouterAspect","UIRuntime","Slot","withType","addRuntime"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAsBO,MAAMA,OAAN,CAAc;AACnBC,EAAAA,WAAW;AACT;AACJ;AACA;AACYC,EAAAA,SAJC;AAMT;AACJ;AACA;AACYC,EAAAA,WATC;AAUT;AACJ;AACA;AACYC,EAAAA,QAbC,EAeDC,OAfC,EAiBDC,WAjBC,EAmBDC,YAnBC,EAqBDC,iBArBC,EAuBDC,cAvBC,EAyBDC,cAzBC;AA2BT;AACJ;AACA;AACYC,EAAAA,eA9BC;AAgCT;AACJ;AACA;AACYC,EAAAA,YAnCC;AAqCT;AACJ;AACA;AACYC,EAAAA,UAxCC;AA0CT;AACJ;AACA;AACYC,EAAAA,YA7CC,EA8CT;AAAA,SA1CQZ,SA0CR,GA1CQA,SA0CR;AAAA,SArCQC,WAqCR,GArCQA,WAqCR;AAAA,SAjCQC,QAiCR,GAjCQA,QAiCR;AAAA,SA/BQC,OA+BR,GA/BQA,OA+BR;AAAA,SA7BQC,WA6BR,GA7BQA,WA6BR;AAAA,SA3BQC,YA2BR,GA3BQA,YA2BR;AAAA,SAzBQC,iBAyBR,GAzBQA,iBAyBR;AAAA,SAvBQC,cAuBR,GAvBQA,cAuBR;AAAA,SArBQC,cAqBR,GArBQA,cAqBR;AAAA,SAhBQC,eAgBR,GAhBQA,eAgBR;AAAA,SAXQC,YAWR,GAXQA,YAWR;AAAA,SANQC,UAMR,GANQA,UAMR;AAAA,SADQC,YACR,GADQA,YACR;AAAA,8DAE4D,MAAM,CAAE,CAFpE;AAAA;AAAA,8DAgGkBC,SAAD,IAA2B;AAC5C,WAAKH,YAAL,CAAkBI,QAAlB,CAA2BD,SAA3B;AACD,KAlGC;AAAA,iEAuGoB,CAAC,GAAGE,KAAJ,KAA6B;AACjD,WAAKN,eAAL,CAAqBK,QAArB,CAA8BC,KAA9B;AACD,KAzGC;AAAA,2DA8IeC,UAAD,IAAkC;AAChD,WAAKV,iBAAL,CAAuBW,MAAvB,CAA8BD,UAA9B;AACD,KAhJC;AAAA,uDAkJ8B,CAC9B;AACEE,MAAAA,QAAQ,EAAE,SADZ;AAEEC,MAAAA,KAAK,EAAE,kBAFT;AAGEC,MAAAA,OAAO,EAAE,OAHX;AAIEC,MAAAA,OAAO,EAAE;AAAA;;AAAA,qCAAM,KAAKhB,YAAX,uDAAM,mBAAmBiB,GAAnB,CAAuB,kBAAvB,CAAN;AAAA;AAJX,KAD8B,EAO9B;AACEJ,MAAAA,QAAQ,EAAE,SADZ;AAEEC,MAAAA,KAAK,EAAE,uBAFT;AAGEC,MAAAA,OAAO,EAAE,OAHX;AAIEC,MAAAA,OAAO,EAAE;AAAA;;AAAA,sCAAM,KAAKhB,YAAX,wDAAM,oBAAmBiB,GAAnB,CAAuB,gBAAvB,CAAN;AAAA;AAJX,KAP8B,CAlJ9B;AAAE;;AAIJ;AACF;AACA;AACEC,EAAAA,aAAa,CAAC,GAAGC,MAAJ,EAA0B;AACrC,SAAKjB,cAAL,CAAoBO,QAApB,CAA6BU,MAA7B;AACA,WAAO,IAAP;AACD;AAED;AACF;AACA;;;AACEC,EAAAA,oBAAoB,CAAC,GAAGC,KAAJ,EAA2B;AAC7C,SAAKd,YAAL,CAAkBE,QAAlB,CAA2BY,KAA3B;AACA,WAAO,IAAP;AACD;AAED;AACF;AACA;;;AACEC,EAAAA,aAAa,CAACC,KAAD,EAAoB;AAC/B,SAAK5B,SAAL,CAAec,QAAf,CAAwBc,KAAxB;AACA,WAAO,IAAP;AACD;;AAEOC,EAAAA,sBAAsB,GAAG;AAC/B,SAAK7B,SAAL,CAAec,QAAf,CAAwB;AACtBgB,MAAAA,IAAI,EAAE,KAAK7B,WAAL,CAAiB8B,SADD;AAEtBC,MAAAA,QAAQ,EAAE,KAAK/B,WAAL,CAAiBgC,cAAjB,CAAgCC,qBAAYC,EAA5C;AAFY,KAAxB;AAKA,SAAKjC,QAAL,CAAcY,QAAd,CAAuB,CACrB;AACEgB,MAAAA,IAAI,EAAE,KAAK7B,WAAL,CAAiB8B,SADzB;AAEEC,MAAAA,QAAQ,EAAE,KAAK/B,WAAL,CAAiBmC,OAAjB,CAAyBF,qBAAYC,EAArC;AAFZ,KADqB,EAKrB;AACEE,MAAAA,KAAK,EAAE,IADT;AAEEP,MAAAA,IAAI,EAAE,GAFR;AAGEE,MAAAA,QAAQ,eAAE,+BAAC,iBAAD;AAAW,QAAA,UAAU,EAAE,KAAKxB,cAA5B;AAA4C,QAAA,YAAY,EAAE,KAAKE;AAA/D;AAHZ,KALqB,CAAvB;AAWD;;AAED4B,EAAAA,kBAAkB,CAAC,GAAGzB,SAAJ,EAA6B;AAC7C,SAAKL,cAAL,CAAoBM,QAApB,CAA6BD,SAA7B;AACD;;AAED0B,EAAAA,cAAc,CAACC,MAAD,EAAiB;AAC7B,SAAK7B,UAAL,CAAgBG,QAAhB,CAAyB0B,MAAzB;AACD;AAED;AACF;AACA;;;AACEC,EAAAA,eAAe,GAAG,CAAE;AAEpB;AACF;AACA;;;AACEC,EAAAA,kBAAkB,GAAG,CAAE;AAEvB;AACF;AACA;;;AACEC,EAAAA,sBAAsB,GAAG,CAAE;AAE3B;AACF;AACA;;;AACEC,EAAAA,oBAAoB,GAAG,CAAE;;AAEzBC,EAAAA,oBAAoB,GAAG,CAAE;AAEzB;AACF;AACA;;;AACEC,EAAAA,gBAAgB,GAAG,CAAE;;AAIrB;AACF;AACA;AACEC,EAAAA,UAAU,CAACC,OAAD,EAA4B;AACpC,SAAKC,QAAL,GAAgB,MAAMD,OAAtB;AACD;;AAEDE,EAAAA,UAAU,GAAG;AACX,QAAI,CAAC,KAAKD,QAAV,EAAoB,OAAOE,SAAP;AACpB,WAAO,KAAKF,QAAL,EAAP;AACD;;AAaDG,EAAAA,MAAM,GAAW;AACf,SAAKjD,OAAL,CAAakD,cAAb,CAA4B,KAAIC,oCAAJ,EAAqB,KAAKlD,WAA1B,CAA5B;AACA,SAAKC,YAAL,CAAkBkD,WAAlB,CAA8B,KAAKjD,iBAAnC;AAEA,UAAM,CAACkD,iBAAD,IAAsB,KAAKnD,YAAL,CAAkBoD,UAAlB,CAA6B;AACvDtB,MAAAA,EAAE,EAAE,gBADmD;AACjC;AACtBd,MAAAA,OAAO,EAAE,MAAM,CAAE,CAFsC;AAGvDqC,MAAAA,WAAW,EAAE,uBAH0C;AAIvDC,MAAAA,UAAU,EAAE;AAJ2C,KAA7B,CAA5B;AAMA,SAAKC,gBAAL,GAAwBJ,iBAAxB;AAEA,WAAO;AACLK,MAAAA,MAAM,EAAE,CACN;AACE/B,QAAAA,IAAI,EAAE,GADR;AAEEE,QAAAA,QAAQ,eACN,+BAAC,eAAD;AACE,UAAA,SAAS,EAAE,KAAKhC,SADlB;AAEE,UAAA,QAAQ,EAAE,KAAKE,QAFjB;AAGE,UAAA,OAAO,eAAE,oCAAM,OAAN,CAAc,MAAd;AAAqB,YAAA,QAAQ,EAAE,KAAKO;AAApC,YAHX;AAIE,UAAA,OAAO,EAAE,IAJX;AAKE,UAAA,SAAS,EAAE,KAAKF,cALlB;AAME,UAAA,gBAAgB,EAAE,KAAKK,YANzB;AAOE,UAAA,OAAO,EAAE,KAAKsC,UAAL,EAPX;AAQE,UAAA,sBAAsB,EAAE,KAAKU,gBAR/B;AASE,UAAA,UAAU,EAAE,KAAKjD;AATnB;AAHJ,OADM;AADH,KAAP;AAoBD;AAED;;;AAmCqB,eAARmD,QAAQ,CACnB,CAACC,EAAD,EAAK9D,WAAL,EAAkBE,OAAlB,EAA2BE,YAA3B,EAAyC2D,aAAzC,CADmB,EAQnBC,MARmB,EASnB,CACEjE,SADF,EAEEE,QAFF,EAGEE,WAHF,EAIEG,cAJF,EAKEC,cALF,EAMEE,YANF,EAOED,eAPF,EAQEE,UARF,EASEC,YATF,CATmB,EA8BnB;AACA,UAAMN,iBAAiB,GAAG,KAAI4D,+BAAJ,EAAsBF,aAAa,CAACG,UAApC,CAA1B;AACA,UAAMC,OAAO,GAAG,IAAItE,OAAJ,CACdE,SADc,EAEdC,WAFc,EAGdC,QAHc,EAIdC,OAJc,EAKdC,WALc,EAMdC,YANc,EAOdC,iBAPc,EAQdC,cARc,EASdC,cATc,EAUdC,eAVc,EAWdC,YAXc,EAYdC,UAZc,EAadC,YAbc,CAAhB;AAeAwD,IAAAA,OAAO,CAACvC,sBAAR;AACAuC,IAAAA,OAAO,CAACC,gBAAR,CAAyBD,OAAO,CAACvD,SAAjC;AACAuD,IAAAA,OAAO,CAAC9B,kBAAR,CAA2B,mBAAM,+BAAC,mBAAD,OAAjC;AACAyB,IAAAA,EAAE,CAACO,YAAH,CAAgBF,OAAO,CAAChB,MAAR,CAAemB,IAAf,CAAoBH,OAApB,CAAhB;AACAA,IAAAA,OAAO,CAACI,mBAAR,CAA4B,mBAC1B,+BAAC,oCAAD;AAAc,MAAA,KAAK,MAAnB;AAAoB,MAAA,IAAI,EAAC,GAAzB;AAA6B,MAAA,IAAI,EAAC;AAAlC,iBADF;AAMA,WAAOJ,OAAP;AACD;;AAzRkB;;;gCAARtE,O,kBAgNW,CAAC2E,cAAD,EAAWC,4BAAX,EAA4BC,wBAA5B,EAA2CC,qBAA3C,EAA6DC,sBAA7D,C;gCAhNX/E,O,aAiNMgF,e;gCAjNNhF,O,WAkNI,CACbiF,gBAAKC,QAAL,EADa,EAEbD,gBAAKC,QAAL,EAFa,EAGbD,gBAAKC,QAAL,EAHa,EAIbD,gBAAKC,QAAL,EAJa,EAKbD,gBAAKC,QAAL,EALa,EAMbD,gBAAKC,QAAL,EANa,EAObD,gBAAKC,QAAL,EAPa,EAQbD,gBAAKC,QAAL,EARa,EASbD,gBAAKC,QAAL,EATa,EAUbD,gBAAKC,QAAL,EAVa,C;eA0EFlF,O;;;AAEfoC,qBAAY+C,UAAZ,CAAuBnF,OAAvB","sourcesContent":["import type { ComponentUI, ComponentModel } from '@teambit/component';\nimport { ComponentAspect } from '@teambit/component';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport ReactRouterAspect, { ReactRouterUI } from '@teambit/react-router';\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, ComponentSearcher, CommandHandler } from '@teambit/command-bar';\nimport { ScopeModel } from '@teambit/scope.models.scope-model';\nimport { ScopeMenu, ScopeUseBox } from './ui/menu';\nimport { ScopeAspect } from './scope.aspect';\nimport { Scope } from './ui/scope';\nimport { ComponentsDrawer } from './ui/components-drawer';\n\nexport type ScopeBadge = ComponentType;\n\nexport type ScopeBadgeSlot = SlotRegistry<ScopeBadge[]>;\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 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 componentSearcher: ComponentSearcher,\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  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  /**\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  registerRoute(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  private registerExplicitRoutes() {\n    this.routeSlot.register({\n      path: this.componentUi.routePath,\n      children: this.componentUi.getComponentUI(ScopeAspect.id),\n    });\n\n    this.menuSlot.register([\n      {\n        path: this.componentUi.routePath,\n        children: this.componentUi.getMenu(ScopeAspect.id),\n      },\n      {\n        exact: true,\n        path: '/',\n        children: <ScopeMenu widgetSlot={this.menuWidgetSlot} menuItemSlot={this.menuItemSlot} />,\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  /**\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  private _context: () => ScopeContextType;\n\n  /**\n   * add a new context to the scope.\n   */\n  addContext(context: ScopeContextType) {\n    this._context = () => context;\n  }\n\n  getContext() {\n    if (!this._context) return undefined;\n    return this._context();\n  }\n\n  registerMenuItem = (menuItems: MenuItem[]) => {\n    this.menuItemSlot.register(menuItems);\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  uiRoot(): UIRoot {\n    this.sidebar.registerDrawer(new ComponentsDrawer(this.sidebarSlot));\n    this.commandBarUI.addSearcher(this.componentSearcher);\n\n    const [setKeyBindHandler] = this.commandBarUI.addCommand({\n      id: 'sidebar.toggle', // TODO - extract to a component!\n      handler: () => {},\n      displayName: 'Toggle component list',\n      keybinding: 'alt+s',\n    });\n    this.setSidebarToggle = setKeyBindHandler;\n\n    return {\n      routes: [\n        {\n          path: '/',\n          children: (\n            <Scope\n              routeSlot={this.routeSlot}\n              menuSlot={this.menuSlot}\n              sidebar={<this.sidebar.render itemSlot={this.sidebarItemSlot} />}\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  /** registers available components */\n  setComponents = (components: ComponentModel[]) => {\n    this.componentSearcher.update(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, ReactRouterAspect];\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  ];\n\n  static async provider(\n    [ui, componentUi, sidebar, commandBarUI, reactRouterUI]: [\n      UiUI,\n      ComponentUI,\n      SidebarUI,\n      CommandBarUI,\n      ReactRouterUI\n    ],\n    config,\n    [\n      routeSlot,\n      menuSlot,\n      sidebarSlot,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      menuItemSlot,\n      sidebarItemSlot,\n      cornerSlot,\n      overviewSlot,\n    ]: [\n      RouteSlot,\n      RouteSlot,\n      SidebarSlot,\n      ScopeBadgeSlot,\n      MenuWidgetSlot,\n      MenuItemSlot,\n      SidebarItemSlot,\n      CornerSlot,\n      OverviewLineSlot\n    ]\n  ) {\n    const componentSearcher = new ComponentSearcher(reactRouterUI.navigateTo);\n    const scopeUi = new ScopeUI(\n      routeSlot,\n      componentUi,\n      menuSlot,\n      sidebar,\n      sidebarSlot,\n      commandBarUI,\n      componentSearcher,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      sidebarItemSlot,\n      menuItemSlot,\n      cornerSlot,\n      overviewSlot\n    );\n    scopeUi.registerExplicitRoutes();\n    scopeUi.registerMenuItem(scopeUi.menuItems);\n    scopeUi.registerMenuWidget(() => <ScopeUseBox />);\n    ui.registerRoot(scopeUi.uiRoot.bind(scopeUi));\n    scopeUi.registerSidebarLink(() => (\n      <MenuLinkItem exact href=\"/\" icon=\"comps\">\n        Gallery\n      </MenuLinkItem>\n    ));\n\n    return scopeUi;\n  }\n}\n\nexport default ScopeUI;\n\nScopeAspect.addRuntime(ScopeUI);\n"]}
+{"version":3,"sources":["scope.ui.runtime.tsx"],"names":["ScopeUI","constructor","routeSlot","componentUi","menuSlot","sidebar","sidebarSlot","commandBarUI","componentSearcher","scopeBadgeSlot","menuWidgetSlot","sidebarItemSlot","menuItemSlot","cornerSlot","overviewSlot","menuItems","register","componentTreeNodes","map","componentTreeNode","links","components","update","category","title","keyChar","handler","run","registerBadge","badges","registerOverviewLine","lines","registerRoute","route","registerExplicitRoutes","path","routePath","children","getComponentUI","ScopeAspect","id","getMenu","exact","registerMenuWidget","registerCorner","corner","replaceOverview","replaceDescription","replaceMetadataSection","registerMetadataItem","replaceComponentGrid","registerMetadata","addContext","context","_context","getContext","undefined","uiRoot","registerDrawer","ComponentsDrawer","addSearcher","setKeyBindHandler","addCommand","displayName","keybinding","setSidebarToggle","routes","provider","ui","reactRouterUI","config","ComponentSearcher","navigateTo","scopeUi","registerMenuItem","registerRoot","bind","registerSidebarLink","UIAspect","ComponentAspect","SidebarAspect","CommandBarAspect","ReactRouterAspect","UIRuntime","Slot","withType","addRuntime"],"mappings":"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","sourcesContent":["import type { ComponentUI, ComponentModel } from '@teambit/component';\nimport { ComponentAspect } from '@teambit/component';\nimport { Slot, SlotRegistry } from '@teambit/harmony';\nimport ReactRouterAspect, { ReactRouterUI } from '@teambit/react-router';\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, ComponentSearcher, CommandHandler } from '@teambit/command-bar';\nimport { ScopeModel } from '@teambit/scope.models.scope-model';\nimport { ScopeMenu, ScopeUseBox } from './ui/menu';\nimport { ScopeAspect } from './scope.aspect';\nimport { Scope } from './ui/scope';\nimport { ComponentsDrawer } from './ui/components-drawer';\n\nexport type ScopeBadge = ComponentType;\n\nexport type ScopeBadgeSlot = SlotRegistry<ScopeBadge[]>;\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 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 componentSearcher: ComponentSearcher,\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  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  /**\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  registerRoute(route: RouteProps) {\n    this.routeSlot.register(route);\n    return this;\n  }\n\n  private registerExplicitRoutes() {\n    this.routeSlot.register({\n      path: this.componentUi.routePath,\n      children: this.componentUi.getComponentUI(ScopeAspect.id),\n    });\n\n    this.menuSlot.register([\n      {\n        path: this.componentUi.routePath,\n        children: this.componentUi.getMenu(ScopeAspect.id),\n      },\n      {\n        exact: true,\n        path: '/',\n        children: <ScopeMenu widgetSlot={this.menuWidgetSlot} menuItemSlot={this.menuItemSlot} />,\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  /**\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  private _context: () => ScopeContextType;\n\n  /**\n   * add a new context to the scope.\n   */\n  addContext(context: ScopeContextType) {\n    this._context = () => context;\n  }\n\n  getContext() {\n    if (!this._context) return undefined;\n    return this._context();\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  uiRoot(): UIRoot {\n    this.sidebar.registerDrawer(new ComponentsDrawer(this.sidebarSlot));\n    this.commandBarUI.addSearcher(this.componentSearcher);\n\n    const [setKeyBindHandler] = this.commandBarUI.addCommand({\n      id: 'sidebar.toggle', // TODO - extract to a component!\n      handler: () => {},\n      displayName: 'Toggle component list',\n      keybinding: 'alt+s',\n    });\n    this.setSidebarToggle = setKeyBindHandler;\n\n    return {\n      routes: [\n        {\n          path: '/',\n          children: (\n            <Scope\n              routeSlot={this.routeSlot}\n              menuSlot={this.menuSlot}\n              sidebar={<this.sidebar.render itemSlot={this.sidebarItemSlot} />}\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  /** registers available components */\n  setComponents = (components: ComponentModel[]) => {\n    this.componentSearcher.update(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, ReactRouterAspect];\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  ];\n\n  static async provider(\n    [ui, componentUi, sidebar, commandBarUI, reactRouterUI]: [\n      UiUI,\n      ComponentUI,\n      SidebarUI,\n      CommandBarUI,\n      ReactRouterUI\n    ],\n    config,\n    [\n      routeSlot,\n      menuSlot,\n      sidebarSlot,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      menuItemSlot,\n      sidebarItemSlot,\n      cornerSlot,\n      overviewSlot,\n    ]: [\n      RouteSlot,\n      RouteSlot,\n      SidebarSlot,\n      ScopeBadgeSlot,\n      MenuWidgetSlot,\n      MenuItemSlot,\n      SidebarItemSlot,\n      CornerSlot,\n      OverviewLineSlot\n    ]\n  ) {\n    const componentSearcher = new ComponentSearcher(reactRouterUI.navigateTo);\n    const scopeUi = new ScopeUI(\n      routeSlot,\n      componentUi,\n      menuSlot,\n      sidebar,\n      sidebarSlot,\n      commandBarUI,\n      componentSearcher,\n      scopeBadgeSlot,\n      menuWidgetSlot,\n      sidebarItemSlot,\n      menuItemSlot,\n      cornerSlot,\n      overviewSlot\n    );\n    scopeUi.registerExplicitRoutes();\n    scopeUi.registerMenuItem(scopeUi.menuItems);\n    scopeUi.registerMenuWidget(() => <ScopeUseBox />);\n    ui.registerRoot(scopeUi.uiRoot.bind(scopeUi));\n    scopeUi.registerSidebarLink(() => (\n      <MenuLinkItem exact href=\"/\" icon=\"comps\">\n        Gallery\n      </MenuLinkItem>\n    ));\n\n    return scopeUi;\n  }\n}\n\nexport default ScopeUI;\n\nScopeAspect.addRuntime(ScopeUI);\n"]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/scope",
-  "version": "0.0.607",
+  "version": "0.0.615",
   "homepage": "https://bit.dev/teambit/scope/scope",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.scope",
     "name": "scope",
-    "version": "0.0.607"
+    "version": "0.0.615"
   },
   "dependencies": {
     "semver": "7.3.4",
@@ -25,26 +25,26 @@
     "@teambit/base-ui.graph.tree.recursive-tree": "1.0.0",
     "@teambit/scope.models.scope-model": "0.0.95",
     "@teambit/scope.ui.hooks.scope-context": "0.0.95",
-    "@teambit/component": "0.0.607",
-    "@teambit/logger": "0.0.508",
-    "@teambit/aspect-loader": "0.0.607",
-    "@teambit/builder": "0.0.607",
-    "@teambit/cli": "0.0.419",
-    "@teambit/compiler": "0.0.607",
-    "@teambit/config": "0.0.431",
-    "@teambit/envs": "0.0.607",
-    "@teambit/express": "0.0.512",
-    "@teambit/graphql": "0.0.607",
+    "@teambit/component": "0.0.615",
+    "@teambit/logger": "0.0.512",
+    "@teambit/aspect-loader": "0.0.615",
+    "@teambit/builder": "0.0.615",
+    "@teambit/cli": "0.0.423",
+    "@teambit/compiler": "0.0.615",
+    "@teambit/config": "0.0.435",
+    "@teambit/envs": "0.0.615",
+    "@teambit/express": "0.0.516",
+    "@teambit/graphql": "0.0.615",
     "@teambit/harmony.modules.requireable-component": "0.0.483",
-    "@teambit/isolator": "0.0.607",
+    "@teambit/isolator": "0.0.615",
     "@teambit/legacy-bit-id": "0.0.397",
-    "@teambit/ui": "0.0.607",
+    "@teambit/ui": "0.0.615",
     "@teambit/workspace.modules.match-pattern": "0.0.487",
-    "@teambit/command-bar": "0.0.607",
-    "@teambit/component-tree": "0.0.403",
-    "@teambit/design.ui.surfaces.menu.link-item": "0.0.375",
-    "@teambit/react-router": "0.0.607",
-    "@teambit/sidebar": "0.0.607",
+    "@teambit/command-bar": "0.0.615",
+    "@teambit/component-tree": "0.0.407",
+    "@teambit/design.ui.surfaces.menu.link-item": "0.0.377",
+    "@teambit/react-router": "0.0.615",
+    "@teambit/sidebar": "0.0.615",
     "@teambit/ui-foundation.ui.main-dropdown": "0.0.485",
     "@teambit/ui-foundation.ui.menu": "0.0.485",
     "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.487",
@@ -82,7 +82,7 @@
     "@types/node": "12.20.4"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.202",
+    "@teambit/legacy": "1.0.204",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -110,7 +110,7 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.202",
+        "@teambit/legacy": "1.0.204",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/scope.ui.runtime.tsx

@@ -185,6 +185,14 @@ export class ScopeUI {
     this.menuItemSlot.register(menuItems);
   };
 
+  /**
+   * register a sidebar Widget for the scope
+   */
+  registerSidebarWidget = (componentTreeNodes: ComponentTreeNode[]) => {
+    componentTreeNodes.map((componentTreeNode) => this.sidebarSlot.register(componentTreeNode));
+    return this;
+  };
+
   /**
    * register a sidebar link to the section above the drawers
    */