@teambit/sidebar 0.0.963 → 0.0.965

package/dist/{preview-1674039846300.js → preview-1674271762484.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_sidebar@0.0.963/dist/sidebar.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_sidebar@0.0.963/dist/sidebar.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_sidebar@0.0.965/dist/sidebar.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.ui-foundation_sidebar@0.0.965/dist/sidebar.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/dist/ui/side-bar/side-bar.d.ts

@@ -1,4 +1,5 @@
 import React, { ComponentType } from 'react';
+import { DrawerType } from '@teambit/ui-foundation.ui.tree.drawer';
 import { DrawerSlot } from '../../sidebar.ui.runtime';
 export declare type SideBarProps = {
     /**
@@ -9,8 +10,12 @@ export declare type SideBarProps = {
      * slot of registered items to the main section at the top.
      */
     items?: ComponentType[];
+    /**
+     * override register drawers from the slot
+     */
+    overrideDrawerSlot?: DrawerType[];
 } & React.HTMLAttributes<HTMLDivElement>;
 /**
  * side bar component.
  */
-export declare function SideBar({ drawerSlot, items, ...rest }: SideBarProps): JSX.Element;
+export declare function SideBar({ drawerSlot, items, overrideDrawerSlot, ...rest }: SideBarProps): JSX.Element;

package/dist/ui/side-bar/side-bar.js

@@ -71,10 +71,11 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function SideBar(_ref) {
   let {
       drawerSlot,
-      items = []
+      items = [],
+      overrideDrawerSlot
     } = _ref,
-    rest = (0, _objectWithoutProperties2().default)(_ref, ["drawerSlot", "items"]);
-  const drawers = (0, _lodash().flatten)(drawerSlot.values()).filter(drawer => {
+    rest = (0, _objectWithoutProperties2().default)(_ref, ["drawerSlot", "items", "overrideDrawerSlot"]);
+  const drawers = (overrideDrawerSlot || (0, _lodash().flatten)(drawerSlot.values())).filter(drawer => {
     var _drawer$isHidden;
     return !(drawer !== null && drawer !== void 0 && (_drawer$isHidden = drawer.isHidden) !== null && _drawer$isHidden !== void 0 && _drawer$isHidden.call(drawer));
   }).sort(sortFn);

package/dist/ui/side-bar/side-bar.js.map

@@ -1 +1 @@
-{"version":3,"names":["SideBar","drawerSlot","items","rest","drawers","flatten","values","filter","drawer","isHidden","sort","sortFn","openDrawerList","onToggleDrawer","useState","map","id","handleDrawerToggle","isDrawerOpen","includes","list","concat","styles","sidebar","name","isOpen","classNames","sidebarDrawer","open","widgets","Context","first","second","order"],"sources":["side-bar.tsx"],"sourcesContent":["import React, { useState, ComponentType } from 'react';\nimport { flatten } from 'lodash';\nimport classNames from 'classnames';\nimport { MenuSection } from '@teambit/design.ui.surfaces.menu.section';\nimport { DrawerType, DrawerUI } from '@teambit/ui-foundation.ui.tree.drawer';\nimport { DrawerSlot } from '../../sidebar.ui.runtime';\nimport styles from './side-bar.module.scss';\n\nexport type SideBarProps = {\n  /**\n   * slot of registered drawers.\n   */\n  drawerSlot: DrawerSlot;\n  /**\n   * slot of registered items to the main section at the top.\n   */\n  items?: ComponentType[];\n} & React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * side bar component.\n */\nexport function SideBar({ drawerSlot, items = [], ...rest }: SideBarProps) {\n  const drawers = flatten(drawerSlot.values())\n    .filter((drawer) => !drawer?.isHidden?.())\n    .sort(sortFn);\n\n  const [openDrawerList, onToggleDrawer] = useState<(string | undefined)[]>(drawers.map((drawer) => drawer.id));\n\n  const handleDrawerToggle = (id: string) => {\n    const isDrawerOpen = openDrawerList.includes(id);\n    if (isDrawerOpen) {\n      onToggleDrawer((list) => list.filter((drawer) => drawer !== id));\n      return;\n    }\n    onToggleDrawer((list) => list.concat(id));\n  };\n\n  return (\n    <div {...rest} className={styles.sidebar}>\n      <MenuSection items={items} />\n      {drawers.map((drawer) => {\n        if (!drawer || !drawer.name) return null;\n        // consider passing collapse all as a prop so each drawer collapses itself\n        const isOpen = openDrawerList.includes(drawer.id);\n\n        return (\n          <DrawerUI\n            className={classNames(styles.sidebarDrawer, isOpen && styles.open)}\n            isOpen={isOpen}\n            onToggle={() => handleDrawerToggle(drawer.id)}\n            key={drawer.id}\n            name={drawer.name}\n            Widgets={drawer.widgets}\n            Context={drawer.Context}\n          >\n            <drawer.render />\n          </DrawerUI>\n        );\n      })}\n    </div>\n  );\n}\nfunction sortFn(first: DrawerType, second: DrawerType) {\n  // 0  - equal\n  // <0 - first < second\n  // >0 - first > second\n\n  return (first.order ?? 0) - (second.order ?? 0);\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;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAA4C;AAAA;AAa5C;AACA;AACA;AACO,SAASA,OAAO,OAAoD;EAAA,IAAnD;MAAEC,UAAU;MAAEC,KAAK,GAAG;IAA0B,CAAC;IAApBC,IAAI;EACvD,MAAMC,OAAO,GAAG,IAAAC,iBAAO,EAACJ,UAAU,CAACK,MAAM,EAAE,CAAC,CACzCC,MAAM,CAAEC,MAAM;IAAA;IAAA,OAAK,EAACA,MAAM,aAANA,MAAM,mCAANA,MAAM,CAAEC,QAAQ,6CAAhB,sBAAAD,MAAM,CAAc;EAAA,EAAC,CACzCE,IAAI,CAACC,MAAM,CAAC;EAEf,MAAM,CAACC,cAAc,EAAEC,cAAc,CAAC,GAAG,IAAAC,iBAAQ,EAAyBV,OAAO,CAACW,GAAG,CAAEP,MAAM,IAAKA,MAAM,CAACQ,EAAE,CAAC,CAAC;EAE7G,MAAMC,kBAAkB,GAAID,EAAU,IAAK;IACzC,MAAME,YAAY,GAAGN,cAAc,CAACO,QAAQ,CAACH,EAAE,CAAC;IAChD,IAAIE,YAAY,EAAE;MAChBL,cAAc,CAAEO,IAAI,IAAKA,IAAI,CAACb,MAAM,CAAEC,MAAM,IAAKA,MAAM,KAAKQ,EAAE,CAAC,CAAC;MAChE;IACF;IACAH,cAAc,CAAEO,IAAI,IAAKA,IAAI,CAACC,MAAM,CAACL,EAAE,CAAC,CAAC;EAC3C,CAAC;EAED,oBACE,mEAASb,IAAI;IAAE,SAAS,EAAEmB,wBAAM,CAACC;EAAQ,iBACvC,+BAAC,mCAAW;IAAC,KAAK,EAAErB;EAAM,EAAG,EAC5BE,OAAO,CAACW,GAAG,CAAEP,MAAM,IAAK;IACvB,IAAI,CAACA,MAAM,IAAI,CAACA,MAAM,CAACgB,IAAI,EAAE,OAAO,IAAI;IACxC;IACA,MAAMC,MAAM,GAAGb,cAAc,CAACO,QAAQ,CAACX,MAAM,CAACQ,EAAE,CAAC;IAEjD,oBACE,+BAAC,8BAAQ;MACP,SAAS,EAAE,IAAAU,qBAAU,EAACJ,wBAAM,CAACK,aAAa,EAAEF,MAAM,IAAIH,wBAAM,CAACM,IAAI,CAAE;MACnE,MAAM,EAAEH,MAAO;MACf,QAAQ,EAAE,MAAMR,kBAAkB,CAACT,MAAM,CAACQ,EAAE,CAAE;MAC9C,GAAG,EAAER,MAAM,CAACQ,EAAG;MACf,IAAI,EAAER,MAAM,CAACgB,IAAK;MAClB,OAAO,EAAEhB,MAAM,CAACqB,OAAQ;MACxB,OAAO,EAAErB,MAAM,CAACsB;IAAQ,gBAExB,+BAAC,MAAM,CAAC,MAAM,OAAG,CACR;EAEf,CAAC,CAAC,CACE;AAEV;AACA,SAASnB,MAAM,CAACoB,KAAiB,EAAEC,MAAkB,EAAE;EAAA;EACrD;EACA;EACA;;EAEA,OAAO,iBAACD,KAAK,CAACE,KAAK,uDAAI,CAAC,sBAAKD,MAAM,CAACC,KAAK,yDAAI,CAAC,CAAC;AACjD"}
+{"version":3,"names":["SideBar","drawerSlot","items","overrideDrawerSlot","rest","drawers","flatten","values","filter","drawer","isHidden","sort","sortFn","openDrawerList","onToggleDrawer","useState","map","id","handleDrawerToggle","isDrawerOpen","includes","list","concat","styles","sidebar","name","isOpen","classNames","sidebarDrawer","open","widgets","Context","first","second","order"],"sources":["side-bar.tsx"],"sourcesContent":["import React, { useState, ComponentType } from 'react';\nimport { flatten } from 'lodash';\nimport classNames from 'classnames';\nimport { MenuSection } from '@teambit/design.ui.surfaces.menu.section';\nimport { DrawerType, DrawerUI } from '@teambit/ui-foundation.ui.tree.drawer';\nimport { DrawerSlot } from '../../sidebar.ui.runtime';\nimport styles from './side-bar.module.scss';\n\nexport type SideBarProps = {\n  /**\n   * slot of registered drawers.\n   */\n  drawerSlot: DrawerSlot;\n  /**\n   * slot of registered items to the main section at the top.\n   */\n  items?: ComponentType[];\n  /**\n   * override register drawers from the slot\n   */\n  overrideDrawerSlot?: DrawerType[];\n} & React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * side bar component.\n */\nexport function SideBar({ drawerSlot, items = [], overrideDrawerSlot, ...rest }: SideBarProps) {\n  const drawers = (overrideDrawerSlot || flatten(drawerSlot.values()))\n    .filter((drawer) => !drawer?.isHidden?.())\n    .sort(sortFn);\n\n  const [openDrawerList, onToggleDrawer] = useState<(string | undefined)[]>(drawers.map((drawer) => drawer.id));\n\n  const handleDrawerToggle = (id: string) => {\n    const isDrawerOpen = openDrawerList.includes(id);\n    if (isDrawerOpen) {\n      onToggleDrawer((list) => list.filter((drawer) => drawer !== id));\n      return;\n    }\n    onToggleDrawer((list) => list.concat(id));\n  };\n\n  return (\n    <div {...rest} className={styles.sidebar}>\n      <MenuSection items={items} />\n      {drawers.map((drawer) => {\n        if (!drawer || !drawer.name) return null;\n        // consider passing collapse all as a prop so each drawer collapses itself\n        const isOpen = openDrawerList.includes(drawer.id);\n\n        return (\n          <DrawerUI\n            className={classNames(styles.sidebarDrawer, isOpen && styles.open)}\n            isOpen={isOpen}\n            onToggle={() => handleDrawerToggle(drawer.id)}\n            key={drawer.id}\n            name={drawer.name}\n            Widgets={drawer.widgets}\n            Context={drawer.Context}\n          >\n            <drawer.render />\n          </DrawerUI>\n        );\n      })}\n    </div>\n  );\n}\nfunction sortFn(first: DrawerType, second: DrawerType) {\n  // 0  - equal\n  // <0 - first < second\n  // >0 - first > second\n\n  return (first.order ?? 0) - (second.order ?? 0);\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;AACA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAEA;EAAA;EAAA;IAAA;EAAA;EAAA;AAAA;AAA4C;AAAA;AAiB5C;AACA;AACA;AACO,SAASA,OAAO,OAAwE;EAAA,IAAvE;MAAEC,UAAU;MAAEC,KAAK,GAAG,EAAE;MAAEC;IAA0C,CAAC;IAApBC,IAAI;EAC3E,MAAMC,OAAO,GAAG,CAACF,kBAAkB,IAAI,IAAAG,iBAAO,EAACL,UAAU,CAACM,MAAM,EAAE,CAAC,EAChEC,MAAM,CAAEC,MAAM;IAAA;IAAA,OAAK,EAACA,MAAM,aAANA,MAAM,mCAANA,MAAM,CAAEC,QAAQ,6CAAhB,sBAAAD,MAAM,CAAc;EAAA,EAAC,CACzCE,IAAI,CAACC,MAAM,CAAC;EAEf,MAAM,CAACC,cAAc,EAAEC,cAAc,CAAC,GAAG,IAAAC,iBAAQ,EAAyBV,OAAO,CAACW,GAAG,CAAEP,MAAM,IAAKA,MAAM,CAACQ,EAAE,CAAC,CAAC;EAE7G,MAAMC,kBAAkB,GAAID,EAAU,IAAK;IACzC,MAAME,YAAY,GAAGN,cAAc,CAACO,QAAQ,CAACH,EAAE,CAAC;IAChD,IAAIE,YAAY,EAAE;MAChBL,cAAc,CAAEO,IAAI,IAAKA,IAAI,CAACb,MAAM,CAAEC,MAAM,IAAKA,MAAM,KAAKQ,EAAE,CAAC,CAAC;MAChE;IACF;IACAH,cAAc,CAAEO,IAAI,IAAKA,IAAI,CAACC,MAAM,CAACL,EAAE,CAAC,CAAC;EAC3C,CAAC;EAED,oBACE,mEAASb,IAAI;IAAE,SAAS,EAAEmB,wBAAM,CAACC;EAAQ,iBACvC,+BAAC,mCAAW;IAAC,KAAK,EAAEtB;EAAM,EAAG,EAC5BG,OAAO,CAACW,GAAG,CAAEP,MAAM,IAAK;IACvB,IAAI,CAACA,MAAM,IAAI,CAACA,MAAM,CAACgB,IAAI,EAAE,OAAO,IAAI;IACxC;IACA,MAAMC,MAAM,GAAGb,cAAc,CAACO,QAAQ,CAACX,MAAM,CAACQ,EAAE,CAAC;IAEjD,oBACE,+BAAC,8BAAQ;MACP,SAAS,EAAE,IAAAU,qBAAU,EAACJ,wBAAM,CAACK,aAAa,EAAEF,MAAM,IAAIH,wBAAM,CAACM,IAAI,CAAE;MACnE,MAAM,EAAEH,MAAO;MACf,QAAQ,EAAE,MAAMR,kBAAkB,CAACT,MAAM,CAACQ,EAAE,CAAE;MAC9C,GAAG,EAAER,MAAM,CAACQ,EAAG;MACf,IAAI,EAAER,MAAM,CAACgB,IAAK;MAClB,OAAO,EAAEhB,MAAM,CAACqB,OAAQ;MACxB,OAAO,EAAErB,MAAM,CAACsB;IAAQ,gBAExB,+BAAC,MAAM,CAAC,MAAM,OAAG,CACR;EAEf,CAAC,CAAC,CACE;AAEV;AACA,SAASnB,MAAM,CAACoB,KAAiB,EAAEC,MAAkB,EAAE;EAAA;EACrD;EACA;EACA;;EAEA,OAAO,iBAACD,KAAK,CAACE,KAAK,uDAAI,CAAC,sBAAKD,MAAM,CAACC,KAAK,yDAAI,CAAC,CAAC;AACjD"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/sidebar",
-  "version": "0.0.963",
+  "version": "0.0.965",
   "homepage": "https://bit.dev/teambit/ui-foundation/sidebar",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.ui-foundation",
     "name": "sidebar",
-    "version": "0.0.963"
+    "version": "0.0.965"
   },
   "dependencies": {
     "classnames": "2.2.6",
@@ -14,9 +14,9 @@
     "core-js": "^3.0.0",
     "@babel/runtime": "7.20.0",
     "@teambit/harmony": "0.4.6",
-    "@teambit/component": "0.0.963",
+    "@teambit/component": "0.0.965",
     "@teambit/ui-foundation.ui.tree.drawer": "0.0.511",
-    "@teambit/ui": "0.0.963",
+    "@teambit/ui": "0.0.965",
     "@teambit/design.ui.surfaces.menu.section": "0.0.351"
   },
   "devDependencies": {
@@ -30,7 +30,7 @@
     "@types/testing-library__jest-dom": "5.9.5"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.426",
+    "@teambit/legacy": "1.0.429",
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0"
   },

package/ui/side-bar/side-bar.tsx

@@ -15,13 +15,17 @@ export type SideBarProps = {
    * slot of registered items to the main section at the top.
    */
   items?: ComponentType[];
+  /**
+   * override register drawers from the slot
+   */
+  overrideDrawerSlot?: DrawerType[];
 } & React.HTMLAttributes<HTMLDivElement>;
 
 /**
  * side bar component.
  */
-export function SideBar({ drawerSlot, items = [], ...rest }: SideBarProps) {
-  const drawers = flatten(drawerSlot.values())
+export function SideBar({ drawerSlot, items = [], overrideDrawerSlot, ...rest }: SideBarProps) {
+  const drawers = (overrideDrawerSlot || flatten(drawerSlot.values()))
     .filter((drawer) => !drawer?.isHidden?.())
     .sort(sortFn);