globuswebcomponents 0.7.4 → 0.7.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1378,6 +1378,7 @@ const GbSidebar = class {
1378
1378
  constructor(hostRef) {
1379
1379
  index.registerInstance(this, hostRef);
1380
1380
  this.sidebarItemClicked = index.createEvent(this, "sidebarItemClicked", 7);
1381
+ this.sidebarState = index.createEvent(this, "sidebarState", 7);
1381
1382
  this.state = undefined;
1382
1383
  this.category = undefined;
1383
1384
  this.showSecondCategory = false;
@@ -1417,11 +1418,13 @@ const GbSidebar = class {
1417
1418
  if (this.state === 'expanded') {
1418
1419
  this.state = 'collapsed';
1419
1420
  }
1421
+ this.sidebarState.emit('collapsed');
1420
1422
  }
1421
1423
  expandSideBar() {
1422
1424
  if (this.state === 'collapsed') {
1423
1425
  this.state = 'expanded';
1424
1426
  }
1427
+ this.sidebarState.emit('expanded');
1425
1428
  }
1426
1429
  async sideBarItemClicked(index) {
1427
1430
  this.activeIndex = index;
@@ -1445,7 +1448,7 @@ const GbSidebar = class {
1445
1448
  const logoSrc = index.getAssetPath(`assets/globus_bank_logo.svg`);
1446
1449
  const blueLogoSrc = index.getAssetPath(`assets/globus_bank_logo_blue.svg`);
1447
1450
  const whiteLogoSrc = index.getAssetPath(`assets/globus_bank_logo_white.svg`);
1448
- return (index.h("div", { key: '2f9265c934c3f4dddc1fd2f119690d7dd3e04089', class: `sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (index.h("div", { key: '56067a416cac36390f28da3554eab2ffb986b62c', class: "pattern" }, index.h("img", { key: 'e87935b2330fc0bacc2445883ffa3ee9753e125d', src: patternSrc, alt: "" }))), index.h("div", { key: 'd7c651a03f0de0a038da557f21a960d3c5041278', class: "nav" }, index.h("div", { key: 'cf575d0819ecab751c9956898d6fc7e9e2faee5b', class: `sidebar_header ${this.state}` }, index.h("div", { key: '730975241ede9529ccdd2cc1e18b6f79eb66c20c', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && index.h(index.Fragment, null, this.category === 'plain_background' ? index.h("img", { src: blueLogoSrc }) : index.h("img", { src: whiteLogoSrc })), this.state === 'collapsed' && index.h("img", { key: 'df535344d2caabaabcf4a57c75a0e8e157b915ce', src: logoSrc, alt: "" })), index.h("div", { key: 'a18550cffb54f41657f163515826a83e2fa71fe6', class: `collapse_button ${this.state}` }, index.h("gb-collapse-button", { key: '6641429be1d6c32ddc562ccacf5ffa74332b7039', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: 'bfdd5108ea6eab63bd56c799ec57b637968bd32b', class: "navigation" }, index.h("div", { key: '8496f8d3196c76d97d70ddd71907925b5413da17', class: "item" }, index.h("gb-side-bar-item", { key: '5d697d11ed1744997dbbd3310c172b630c76086f', state: this.activeIndex === 0 ? 'active' : 'default', icon: this.firstItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(0), label: this.firstItemLabel }), index.h("gb-side-bar-item", { key: '8dbd3089b632f7067ce5f84319327f245e9cbde7', state: this.activeIndex === 1 ? 'active' : 'default', icon: this.secondItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(1), label: this.secondItemLabel }), this.thirdItemLabel && (index.h("gb-side-bar-item", { key: '8f8b634c3ef3f748f1c39798f64371815a3d9158', state: this.activeIndex === 2 ? 'active' : 'default', icon: this.thirdItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(2), label: this.thirdItemLabel })), this.fourthItemLabel && (index.h("gb-side-bar-item", { key: 'e2ef5660d338cc06807969c342be6179e73e5bb8', state: this.activeIndex === 3 ? 'active' : 'default', icon: this.fourthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(3), label: this.fourthItemLabel })), this.fifthItemLabel && (index.h("gb-side-bar-item", { key: 'ff84480474accd7cbc7b24b949e3c4fb2e0d921a', state: this.activeIndex === 4 ? 'active' : 'default', icon: this.fifthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(4), label: this.fifthItemLabel })))), this.showSecondCategory && (index.h("div", { key: '75e3038156ad5b938a429f8cb094c8c9aa6d975c', class: "navigation" }, index.h("div", { key: '52c4518ff11010b7e31d477f73e60c6e38579881', class: "item" }, this.sixthItemLabel && (index.h("gb-side-bar-item", { key: '944b9c3f728a3c70996821c57f46107ab948f24c', state: this.activeIndex === 5 ? 'active' : 'default', icon: this.sixthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(5), label: this.sixthItemLabel })), this.seventhItemLabel && (index.h("gb-side-bar-item", { key: 'cb879b7cbc8f09d5bd1766bde88804130d87d7ed', state: this.activeIndex === 6 ? 'active' : 'default', icon: this.seventhItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(6), label: this.seventhItemLabel })), this.eighthItemLabel && (index.h("gb-side-bar-item", { key: '6b5fdd1fd1c2ce8ee6a164fcc4c76a8483c42b69', state: this.activeIndex === 7 ? 'active' : 'default', icon: this.eighthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(7), label: this.eighthItemLabel })), this.ninthItemLabel && (index.h("gb-side-bar-item", { key: '84bee58579a829222125f4b916f25ca410de4c6f', state: this.activeIndex === 8 ? 'active' : 'default', icon: this.ninthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(8), label: this.ninthItemLabel })), this.tenthItemLabel && (index.h("gb-side-bar-item", { key: '24b5bffc2bae13fb20d1fe1a522732cd2c6aa5b9', state: this.activeIndex === 9 ? 'active' : 'default', icon: this.tenthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(9), label: this.tenthItemLabel })))))), this.state === 'expanded' && (index.h("div", { key: 'caf65037e5b80e5442a2437a2e08440fe420cc3a', class: "application_name" }, index.h("div", { key: 'fcd55107715b24c5bb8c87508fa7185d68c4b2aa', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (index.h("div", { key: 'feb2197f78a6fc7aed90ff8e57266283d4890080', class: "application_name_pattern" }, index.h("img", { key: 'b2e3507f0c1c8df0aac3aedc6eba767b3b89910b', src: patternSrc, alt: "" }))), index.h("div", { key: '303db193d12410f48c7b4675d9dc7d73e66d10a0', class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), index.h("span", { key: 'a1f96282e931c70e152f024169cba33c4b0af2c9', class: textClass }, index.h("slot", { key: '731c3ccbf41c6579a19e35992317fd9acf139411', name: "application_name" })))))));
1451
+ return (index.h("div", { key: '08f252fb69dbba6f59ebe67e5ed911f33e5cafed', class: `sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (index.h("div", { key: 'c934040f99d0ad75db9348bc30b3d3212b0dd295', class: "pattern" }, index.h("img", { key: 'a3cca50dcd9c8bfb11c5ed1658484d3d5342f0c8', src: patternSrc, alt: "" }))), index.h("div", { key: '72ad5f54b645baec584dca8dc0af7432a1c88b86', class: "nav" }, index.h("div", { key: '357a5abe266085aa42e985cb80811f7cba41df41', class: `sidebar_header ${this.state}` }, index.h("div", { key: '07530b071ebf98f63ccf07f108063574be4cae97', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && index.h(index.Fragment, null, this.category === 'plain_background' ? index.h("img", { src: blueLogoSrc }) : index.h("img", { src: whiteLogoSrc })), this.state === 'collapsed' && index.h("img", { key: 'fdece4334e0de2cb26db7008ffaf4d2fac8eab33', src: logoSrc, alt: "" })), index.h("div", { key: '684d69afae723c3e9705ea7199ee692f79cb8f0f', class: `collapse_button ${this.state}` }, index.h("gb-collapse-button", { key: '559afb128255b7484ddd37cba1216d3f421c7550', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: '8947f051a84673f2f9f05cd2f50d88ae0c6f4b55', class: "navigation" }, index.h("div", { key: '6aec5fb634cdc6e6fe22209c401cde1fa970f6c2', class: "item" }, index.h("gb-side-bar-item", { key: '978cf6e19c4d03a9212de817cd50234a48a891c1', state: this.activeIndex === 0 ? 'active' : 'default', icon: this.firstItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(0), label: this.firstItemLabel }), index.h("gb-side-bar-item", { key: '47354e307241d1a3692a54983706cc80036177dc', state: this.activeIndex === 1 ? 'active' : 'default', icon: this.secondItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(1), label: this.secondItemLabel }), this.thirdItemLabel && (index.h("gb-side-bar-item", { key: '3751b1ac908206fa73018af5bc38c06f76bc21bb', state: this.activeIndex === 2 ? 'active' : 'default', icon: this.thirdItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(2), label: this.thirdItemLabel })), this.fourthItemLabel && (index.h("gb-side-bar-item", { key: '8db6584a0bf6b3456ac32377b7ac72d65e0c71ce', state: this.activeIndex === 3 ? 'active' : 'default', icon: this.fourthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(3), label: this.fourthItemLabel })), this.fifthItemLabel && (index.h("gb-side-bar-item", { key: 'f7365b2c6c208a6431e0503fdfdb9d02e21b7713', state: this.activeIndex === 4 ? 'active' : 'default', icon: this.fifthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(4), label: this.fifthItemLabel })))), this.showSecondCategory && (index.h("div", { key: '9c5b32f5586b2401f9e0f2035b4b584270d394ee', class: "navigation" }, index.h("div", { key: 'ff64c9ee8580356e6d63d2b6cd6012315bbded5c', class: "item" }, this.sixthItemLabel && (index.h("gb-side-bar-item", { key: '721cb1500f2add3ef863789a9f1dbd5d080f31d0', state: this.activeIndex === 5 ? 'active' : 'default', icon: this.sixthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(5), label: this.sixthItemLabel })), this.seventhItemLabel && (index.h("gb-side-bar-item", { key: '1872126515ab60268f6f0c16f67648d2fb163602', state: this.activeIndex === 6 ? 'active' : 'default', icon: this.seventhItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(6), label: this.seventhItemLabel })), this.eighthItemLabel && (index.h("gb-side-bar-item", { key: 'cacbf24446cad7447bbb86a56eaa134c94e51be1', state: this.activeIndex === 7 ? 'active' : 'default', icon: this.eighthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(7), label: this.eighthItemLabel })), this.ninthItemLabel && (index.h("gb-side-bar-item", { key: 'ea928a7805ca64639549f9a40bcc725631e72edf', state: this.activeIndex === 8 ? 'active' : 'default', icon: this.ninthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(8), label: this.ninthItemLabel })), this.tenthItemLabel && (index.h("gb-side-bar-item", { key: '4a3bb466110bb07b95908c7e0ff91951e14f0f88', state: this.activeIndex === 9 ? 'active' : 'default', icon: this.tenthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(9), label: this.tenthItemLabel })))))), this.state === 'expanded' && (index.h("div", { key: 'e18ea962bcc92237bb1c70be862a2b429a5a9368', class: "application_name" }, index.h("div", { key: 'a3a5a1bd57cf5c56a69363f5beaec96a69add4c9', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (index.h("div", { key: 'f3be98bce6726c5ba0ad91904d5691ca6a0a0117', class: "application_name_pattern" }, index.h("img", { key: '7a8be231ce577031561352d46a27856b0cb0c570', src: patternSrc, alt: "" }))), index.h("div", { key: '98f4184fd669c2d1ec7048718ff8d2a5a6163603', class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), index.h("span", { key: 'ad46d606c19d12cc7574a683e1d0375cc56b01df', class: textClass }, index.h("slot", { key: '60a986665aabad0489e19e1297d65a671de6ceda', name: "application_name" })))))));
1449
1452
  }
1450
1453
  get el() { return index.getElement(this); }
1451
1454
  };