globuswebcomponents 2.4.5 → 2.4.6
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.
- package/dist/cjs/gb-avatar_35.cjs.entry.js +8 -3
- package/dist/cjs/gb-avatar_35.cjs.entry.js.map +1 -1
- package/dist/cjs/globuscomponents.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/gb-sidebar/gb-sidebar.js +11 -3
- package/dist/collection/components/gb-sidebar/gb-sidebar.js.map +1 -1
- package/dist/components/gb-sidebar.js +10 -3
- package/dist/components/gb-sidebar.js.map +1 -1
- package/dist/docs.json +1 -1
- package/dist/esm/gb-avatar_35.entry.js +8 -3
- package/dist/esm/gb-avatar_35.entry.js.map +1 -1
- package/dist/esm/globuscomponents.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/globuscomponents/globuscomponents.esm.js +1 -1
- package/dist/globuscomponents/{p-7d704241.entry.js → p-a9dc0f12.entry.js} +2 -2
- package/dist/globuscomponents/p-a9dc0f12.entry.js.map +1 -0
- package/dist/types/components/gb-sidebar/gb-sidebar.d.ts +1 -0
- package/package.json +1 -1
- package/dist/globuscomponents/p-7d704241.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"gb-sidebar.js","sourceRoot":"","sources":["../../../src/components/gb-sidebar/gb-sidebar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Fragment, State, getAssetPath, Method, Event, EventEmitter } from '@stencil/core';\r\nimport { GeneralBackgroundCategories } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-sidebar',\r\n styleUrl: 'gb-sidebar.css',\r\n shadow: true,\r\n})\r\nexport class GbSidebar {\r\n @Prop({ mutable: true }) state: 'expanded' | 'collapsed' = 'expanded';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() navItemStyle: 'standard' | 'compact';\r\n @Prop() type: 'simple' | 'complex';\r\n @Prop() showSecondCategory: boolean = false;\r\n @Prop() iconInstance: string = '';\r\n @Prop() firstItemIcon: string = '';\r\n @Prop() secondItemIcon: string = '';\r\n @Prop() thirdItemIcon: string = '';\r\n @Prop() fourthItemIcon: string = '';\r\n @Prop() fifthItemIcon: string = '';\r\n @Prop() sixthItemIcon: string = '';\r\n @Prop() seventhItemIcon: string = '';\r\n @Prop() eighthItemIcon: string = '';\r\n @Prop() ninthItemIcon: string = '';\r\n @Prop() tenthItemIcon: string = '';\r\n @Prop() firstItemLabel: string = '';\r\n @Prop() secondItemLabel: string = '';\r\n @Prop() thirdItemLabel: string = '';\r\n @Prop() fourthItemLabel: string = '';\r\n @Prop() fifthItemLabel: string = '';\r\n @Prop() sixthItemLabel: string = '';\r\n @Prop() seventhItemLabel: string = '';\r\n @Prop() eighthItemLabel: string = '';\r\n @Prop() ninthItemLabel: string = '';\r\n @Prop() tenthItemLabel: string = '';\r\n @Prop() complexSidebarData: any = {\r\n Recruitment: {\r\n icon: 'assets/user-search-01.svg', // Icon class or path for Recruitment\r\n items: [\r\n { label: 'Overview', icon: 'assets/star.svg' },\r\n { label: 'My Profile', icon: 'assets/star.svg' },\r\n { label: 'Appraisal', icon: 'assets/star.svg' },\r\n { label: 'Staff Management', icon: 'assets/star.svg' },\r\n { label: 'Leave Management', icon: 'assets/star.svg' },\r\n { label: 'Resignation Portal', icon: 'assets/star.svg' },\r\n ],\r\n },\r\n Staff: {\r\n icon: 'assets/user-account.svg',\r\n items: [\r\n { label: 'Staff Overview', icon: 'assets/star.svg' },\r\n { label: 'Payroll Management', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'Attendance', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'New', icon: 'assets/dashboard-square-03.svg' },\r\n ],\r\n },\r\n };\r\n @Prop({ mutable: true }) activeIndex: number;\r\n @Prop({ mutable: true }) activePrimaryItem: string = 'Staff';\r\n @Prop({ mutable: true }) activeSecondaryItem: string = 'Attendance Tracking';\r\n @Prop() hasInfo: boolean = false;\r\n @Prop() email: string = '';\r\n @Prop() phoneNumber: string = '';\r\n @Prop() theme: 'system' | 'light' | 'dark' = 'system';\r\n @State() isDarkTheme: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @Event() simpleSidebarItemClicked: EventEmitter<number>;\r\n @Event() secondaryItemClicked: EventEmitter<number>;\r\n @Event() primaryItemClicked: EventEmitter<{ primary: number; secondary: number }>;\r\n @Event() sidebarState: EventEmitter<string>;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n collapseSideBar() {\r\n if (this.state === 'expanded') {\r\n this.state = 'collapsed';\r\n }\r\n this.sidebarState.emit('collapsed');\r\n }\r\n\r\n expandSideBar() {\r\n if (this.state === 'collapsed') {\r\n this.state = 'expanded';\r\n }\r\n this.sidebarState.emit('expanded');\r\n }\r\n\r\n @Method()\r\n async sideBarItemClicked(index: number) {\r\n this.activeIndex = index;\r\n // console.log(index);\r\n this.simpleSidebarItemClicked.emit(index);\r\n }\r\n\r\n handlePrimaryClick(item: string, _index: number) {\r\n this.activePrimaryItem = item;\r\n this.activeSecondaryItem = this.complexSidebarData[item].items[0].label; // Reset to the first secondary item\r\n // console.log(index)\r\n }\r\n\r\n handleSecondaryClick(item: string, _index: number) {\r\n this.activeSecondaryItem = item;\r\n // console.log(index);\r\n }\r\n\r\n componentDidLoad() {\r\n const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n if (applicationName) {\r\n applicationName.classList.add('text-lg-bold');\r\n applicationName.classList.add('application_name');\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconInstance);\r\n\r\n if(this.theme === 'system') {\r\n this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches\r\n } else if(this.theme === 'light') {\r\n this.isDarkTheme = false;\r\n } else if(this.theme === 'dark') {\r\n this.isDarkTheme = true;\r\n }\r\n }\r\n\r\n render() {\r\n const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';\r\n const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);\r\n const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.type === 'simple' && (\r\n <div class={`simple_sidebar_div ${this.state} ${this.category}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"nav\">\r\n <div class={`sidebar_header ${this.state}`}>\r\n <div class={`logo_and_name ${this.state}`}>\r\n {this.state === 'expanded' && (\r\n <>\r\n {this.category === 'plain_background' && this.isDarkTheme ? (\r\n <img src={whiteLogoSrc} />\r\n ) : this.category === 'plain_background' && !this.isDarkTheme ? (\r\n <img src={blueLogoSrc} />\r\n ) : (\r\n <img src={whiteLogoSrc} />\r\n )}\r\n </>\r\n )}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n </div>\r\n <div class={`collapse_button ${this.state}`}>\r\n <gb-collapse-button\r\n color={this.category === 'plain_background' ? 'gray' : 'white'}\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 0 ? 'active' : 'default'}\r\n icon={this.firstItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(0)}\r\n label={this.firstItemLabel}\r\n ></gb-simple-side-bar-item>\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 1 ? 'active' : 'default'}\r\n icon={this.secondItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(1)}\r\n label={this.secondItemLabel}\r\n ></gb-simple-side-bar-item>\r\n {this.thirdItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 2 ? 'active' : 'default'}\r\n icon={this.thirdItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(2)}\r\n label={this.thirdItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fourthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 3 ? 'active' : 'default'}\r\n icon={this.fourthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(3)}\r\n label={this.fourthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fifthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 4 ? 'active' : 'default'}\r\n icon={this.fifthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(4)}\r\n label={this.fifthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n {this.showSecondCategory && (\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n {this.sixthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 5 ? 'active' : 'default'}\r\n icon={this.sixthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(5)}\r\n label={this.sixthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.seventhItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 6 ? 'active' : 'default'}\r\n icon={this.seventhItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(6)}\r\n label={this.seventhItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.eighthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 7 ? 'active' : 'default'}\r\n icon={this.eighthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(7)}\r\n label={this.eighthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.ninthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 8 ? 'active' : 'default'}\r\n icon={this.ninthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(8)}\r\n label={this.ninthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.tenthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 9 ? 'active' : 'default'}\r\n icon={this.tenthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(9)}\r\n label={this.tenthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n {this.state === 'expanded' && (\r\n <div class=\"application_name\">\r\n <div class={`wrapper ${this.category}`}>\r\n {this.category === 'plain_background' && (\r\n <div class=\"application_name_pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n {this.hasInfo ? (\r\n <>\r\n <div class=\"information_header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`help_icon ${this.category}`}>\r\n <path\r\n opacity=\"0.4\"\r\n d=\"M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n <path\r\n d=\"M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n </svg>\r\n <p class={`need_help ${this.category} text-lg-bold`}>Need help?</p>\r\n </div>\r\n {/* <p class={`info ${this.category} text-sm-medium`}>Info@globusbank.com</p> */}\r\n {/* <p class={`info ${this.category} text-sm-medium`}>(+234) 123 4324 122</p> */}\r\n <p class={`info ${this.category} text-sm-medium`}>{this.email}</p>\r\n <p class={`info ${this.category} text-sm-medium`}>{this.phoneNumber}</p>\r\n </>\r\n ) : (\r\n <>\r\n <div class={`application_icon ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n <span class={textClass}>\r\n <slot name=\"application_name\"></slot>\r\n </span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'complex' && (\r\n <div class={`sidebar_and_nav ${this.state}`}>\r\n <div class=\"nav_div\">\r\n <div class=\"logo_and_button\">\r\n {this.state === 'expanded' && <img src={blueLogoSrc} />}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n <gb-collapse-button\r\n color=\"gray\"\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"complex_sidebar_div\">\r\n <div class={`primary_side_menu ${this.category} ${this.navItemStyle}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"primary_side_menu_container\">\r\n {Object.keys(this.complexSidebarData).map((primaryItem, index) => (\r\n <gb-complex-primary-side-bar-item\r\n key={`${index}`} // Unique key\r\n label={primaryItem}\r\n category={this.category}\r\n item-style={this.navItemStyle}\r\n icon={this.complexSidebarData[primaryItem].icon}\r\n state={this.activePrimaryItem === primaryItem ? 'active' : 'default'}\r\n onClick={() => this.handlePrimaryClick(primaryItem, index)}\r\n ></gb-complex-primary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n <div class={`secondary_side_menu ${this.category} ${this.state}`}>\r\n <div class=\"sside_menu\">\r\n {this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (\r\n <gb-complex-secondary-side-bar-item\r\n key={`${this.activePrimaryItem}-${index}`} // Unique key\r\n type={this.state === 'expanded' ? 'full_with_label' : 'icon_only'}\r\n label={secondaryItem.label}\r\n category={this.category}\r\n icon={secondaryItem.icon}\r\n state={this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default'}\r\n onClick={() => this.handleSecondaryClick(secondaryItem.label, index)}\r\n ></gb-complex-secondary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"gb-sidebar.js","sourceRoot":"","sources":["../../../src/components/gb-sidebar/gb-sidebar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Fragment, State, getAssetPath, Method, Event, EventEmitter, Watch } from '@stencil/core';\r\nimport { GeneralBackgroundCategories } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-sidebar',\r\n styleUrl: 'gb-sidebar.css',\r\n shadow: true,\r\n})\r\nexport class GbSidebar {\r\n @Prop({ mutable: true }) state: 'expanded' | 'collapsed' = 'expanded';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() navItemStyle: 'standard' | 'compact';\r\n @Prop() type: 'simple' | 'complex';\r\n @Prop() showSecondCategory: boolean = false;\r\n @Prop() iconInstance: string = '';\r\n @Prop() firstItemIcon: string = '';\r\n @Prop() secondItemIcon: string = '';\r\n @Prop() thirdItemIcon: string = '';\r\n @Prop() fourthItemIcon: string = '';\r\n @Prop() fifthItemIcon: string = '';\r\n @Prop() sixthItemIcon: string = '';\r\n @Prop() seventhItemIcon: string = '';\r\n @Prop() eighthItemIcon: string = '';\r\n @Prop() ninthItemIcon: string = '';\r\n @Prop() tenthItemIcon: string = '';\r\n @Prop() firstItemLabel: string = '';\r\n @Prop() secondItemLabel: string = '';\r\n @Prop() thirdItemLabel: string = '';\r\n @Prop() fourthItemLabel: string = '';\r\n @Prop() fifthItemLabel: string = '';\r\n @Prop() sixthItemLabel: string = '';\r\n @Prop() seventhItemLabel: string = '';\r\n @Prop() eighthItemLabel: string = '';\r\n @Prop() ninthItemLabel: string = '';\r\n @Prop() tenthItemLabel: string = '';\r\n @Prop() complexSidebarData: any = {\r\n Recruitment: {\r\n icon: 'assets/user-search-01.svg', // Icon class or path for Recruitment\r\n items: [\r\n { label: 'Overview', icon: 'assets/star.svg' },\r\n { label: 'My Profile', icon: 'assets/star.svg' },\r\n { label: 'Appraisal', icon: 'assets/star.svg' },\r\n { label: 'Staff Management', icon: 'assets/star.svg' },\r\n { label: 'Leave Management', icon: 'assets/star.svg' },\r\n { label: 'Resignation Portal', icon: 'assets/star.svg' },\r\n ],\r\n },\r\n Staff: {\r\n icon: 'assets/user-account.svg',\r\n items: [\r\n { label: 'Staff Overview', icon: 'assets/star.svg' },\r\n { label: 'Payroll Management', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'Attendance', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'New', icon: 'assets/dashboard-square-03.svg' },\r\n ],\r\n },\r\n };\r\n @Prop({ mutable: true }) activeIndex: number;\r\n @Prop({ mutable: true }) activePrimaryItem: string = 'Staff';\r\n @Prop({ mutable: true }) activeSecondaryItem: string = 'Attendance Tracking';\r\n @Prop() hasInfo: boolean = false;\r\n @Prop() email: string = '';\r\n @Prop() phoneNumber: string = '';\r\n @Prop() theme: 'system' | 'light' | 'dark' = 'system';\r\n @State() isDarkTheme: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @Event() simpleSidebarItemClicked: EventEmitter<number>;\r\n @Event() secondaryItemClicked: EventEmitter<number>;\r\n @Event() primaryItemClicked: EventEmitter<{ primary: number; secondary: number }>;\r\n @Event() sidebarState: EventEmitter<string>;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n collapseSideBar() {\r\n if (this.state === 'expanded') {\r\n this.state = 'collapsed';\r\n }\r\n this.sidebarState.emit('collapsed');\r\n }\r\n\r\n expandSideBar() {\r\n if (this.state === 'collapsed') {\r\n this.state = 'expanded';\r\n }\r\n this.sidebarState.emit('expanded');\r\n }\r\n\r\n @Method()\r\n async sideBarItemClicked(index: number) {\r\n this.activeIndex = index;\r\n // console.log(index);\r\n this.simpleSidebarItemClicked.emit(index);\r\n }\r\n\r\n handlePrimaryClick(item: string, _index: number) {\r\n this.activePrimaryItem = item;\r\n this.activeSecondaryItem = this.complexSidebarData[item].items[0].label; // Reset to the first secondary item\r\n // console.log(index)\r\n }\r\n\r\n handleSecondaryClick(item: string, _index: number) {\r\n this.activeSecondaryItem = item;\r\n // console.log(index);\r\n }\r\n\r\n componentDidLoad() {\r\n const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n if (applicationName) {\r\n applicationName.classList.add('text-lg-bold');\r\n applicationName.classList.add('application_name');\r\n }\r\n }\r\n\r\n @Watch('theme')\r\n changeTheme() {\r\n if (this.theme === 'system') {\r\n this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;\r\n } else if (this.theme === 'light') {\r\n this.isDarkTheme = false;\r\n } else if (this.theme === 'dark') {\r\n this.isDarkTheme = true;\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconInstance);\r\n }\r\n\r\n render() {\r\n const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';\r\n const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);\r\n const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.type === 'simple' && (\r\n <div class={`simple_sidebar_div ${this.state} ${this.category}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"nav\">\r\n <div class={`sidebar_header ${this.state}`}>\r\n <div class={`logo_and_name ${this.state}`}>\r\n {this.state === 'expanded' && (\r\n <>\r\n {this.category === 'plain_background' && this.isDarkTheme ? (\r\n <img src={whiteLogoSrc} />\r\n ) : this.category === 'plain_background' && !this.isDarkTheme ? (\r\n <img src={blueLogoSrc} />\r\n ) : (\r\n <img src={whiteLogoSrc} />\r\n )}\r\n </>\r\n )}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n </div>\r\n <div class={`collapse_button ${this.state}`}>\r\n <gb-collapse-button\r\n color={this.category === 'plain_background' ? 'gray' : 'white'}\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 0 ? 'active' : 'default'}\r\n icon={this.firstItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(0)}\r\n label={this.firstItemLabel}\r\n ></gb-simple-side-bar-item>\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 1 ? 'active' : 'default'}\r\n icon={this.secondItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(1)}\r\n label={this.secondItemLabel}\r\n ></gb-simple-side-bar-item>\r\n {this.thirdItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 2 ? 'active' : 'default'}\r\n icon={this.thirdItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(2)}\r\n label={this.thirdItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fourthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 3 ? 'active' : 'default'}\r\n icon={this.fourthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(3)}\r\n label={this.fourthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fifthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 4 ? 'active' : 'default'}\r\n icon={this.fifthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(4)}\r\n label={this.fifthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n {this.showSecondCategory && (\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n {this.sixthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 5 ? 'active' : 'default'}\r\n icon={this.sixthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(5)}\r\n label={this.sixthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.seventhItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 6 ? 'active' : 'default'}\r\n icon={this.seventhItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(6)}\r\n label={this.seventhItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.eighthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 7 ? 'active' : 'default'}\r\n icon={this.eighthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(7)}\r\n label={this.eighthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.ninthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 8 ? 'active' : 'default'}\r\n icon={this.ninthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(8)}\r\n label={this.ninthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.tenthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 9 ? 'active' : 'default'}\r\n icon={this.tenthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(9)}\r\n label={this.tenthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n {this.state === 'expanded' && (\r\n <div class=\"application_name\">\r\n <div class={`wrapper ${this.category}`}>\r\n {this.category === 'plain_background' && (\r\n <div class=\"application_name_pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n {this.hasInfo ? (\r\n <>\r\n <div class=\"information_header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`help_icon ${this.category}`}>\r\n <path\r\n opacity=\"0.4\"\r\n d=\"M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n <path\r\n d=\"M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n </svg>\r\n <p class={`need_help ${this.category} text-lg-bold`}>Need help?</p>\r\n </div>\r\n {/* <p class={`info ${this.category} text-sm-medium`}>Info@globusbank.com</p> */}\r\n {/* <p class={`info ${this.category} text-sm-medium`}>(+234) 123 4324 122</p> */}\r\n <p class={`info ${this.category} text-sm-medium`}>{this.email}</p>\r\n <p class={`info ${this.category} text-sm-medium`}>{this.phoneNumber}</p>\r\n </>\r\n ) : (\r\n <>\r\n <div class={`application_icon ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n <span class={textClass}>\r\n <slot name=\"application_name\"></slot>\r\n </span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'complex' && (\r\n <div class={`sidebar_and_nav ${this.state}`}>\r\n <div class=\"nav_div\">\r\n <div class=\"logo_and_button\">\r\n {this.state === 'expanded' && <img src={blueLogoSrc} />}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n <gb-collapse-button\r\n color=\"gray\"\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"complex_sidebar_div\">\r\n <div class={`primary_side_menu ${this.category} ${this.navItemStyle}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"primary_side_menu_container\">\r\n {Object.keys(this.complexSidebarData).map((primaryItem, index) => (\r\n <gb-complex-primary-side-bar-item\r\n key={`${index}`} // Unique key\r\n label={primaryItem}\r\n category={this.category}\r\n item-style={this.navItemStyle}\r\n icon={this.complexSidebarData[primaryItem].icon}\r\n state={this.activePrimaryItem === primaryItem ? 'active' : 'default'}\r\n onClick={() => this.handlePrimaryClick(primaryItem, index)}\r\n ></gb-complex-primary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n <div class={`secondary_side_menu ${this.category} ${this.state}`}>\r\n <div class=\"sside_menu\">\r\n {this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (\r\n <gb-complex-secondary-side-bar-item\r\n key={`${this.activePrimaryItem}-${index}`} // Unique key\r\n type={this.state === 'expanded' ? 'full_with_label' : 'icon_only'}\r\n label={secondaryItem.label}\r\n category={this.category}\r\n icon={secondaryItem.icon}\r\n state={this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default'}\r\n onClick={() => this.handleSecondaryClick(secondaryItem.label, index)}\r\n ></gb-complex-secondary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"]}
|
|
@@ -114,8 +114,7 @@ const GbSidebar$1 = /*@__PURE__*/ proxyCustomElement(class GbSidebar extends H {
|
|
|
114
114
|
applicationName.classList.add('application_name');
|
|
115
115
|
}
|
|
116
116
|
}
|
|
117
|
-
|
|
118
|
-
this.loadIcon(this.iconInstance);
|
|
117
|
+
changeTheme() {
|
|
119
118
|
if (this.theme === 'system') {
|
|
120
119
|
this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
121
120
|
}
|
|
@@ -126,15 +125,21 @@ const GbSidebar$1 = /*@__PURE__*/ proxyCustomElement(class GbSidebar extends H {
|
|
|
126
125
|
this.isDarkTheme = true;
|
|
127
126
|
}
|
|
128
127
|
}
|
|
128
|
+
componentWillLoad() {
|
|
129
|
+
this.loadIcon(this.iconInstance);
|
|
130
|
+
}
|
|
129
131
|
render() {
|
|
130
132
|
const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';
|
|
131
133
|
const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);
|
|
132
134
|
const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);
|
|
133
135
|
const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);
|
|
134
136
|
const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);
|
|
135
|
-
return (h(Fragment, null, this.type === 'simple' && (h("div", { key: 'a87351447bc40299c01b4b92d387a16a5eb32383', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (h("div", { key: '30222fae39d47197382de0f5f9d17172852afb64', class: "pattern" }, h("img", { key: '1911aa4e99ee974fc00e0c3b5633ec607e947d78', src: patternSrc, alt: "" }))), h("div", { key: '84e741540e05803022b74936a6cccedbd4ca0f28', class: "nav" }, h("div", { key: '95f847326f9aa9324a56891ba7d4a8328fdac874', class: `sidebar_header ${this.state}` }, h("div", { key: '64326b2b79c0bb04dcb995fbe5aa52b909197638', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && (h(Fragment, null, this.category === 'plain_background' && this.isDarkTheme ? (h("img", { src: whiteLogoSrc })) : this.category === 'plain_background' && !this.isDarkTheme ? (h("img", { src: blueLogoSrc })) : (h("img", { src: whiteLogoSrc })))), this.state === 'collapsed' && h("img", { key: 'c537c7cb362958d96b7f4702de21cc6165313566', src: logoSrc, alt: "" })), h("div", { key: 'adbebdc33624d35f4dc23dd157163de5523287f5', class: `collapse_button ${this.state}` }, h("gb-collapse-button", { key: 'a79350363685674800d78f63f35cec443f53b20d', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '63d703845ad267f7b629bb526daf29b8e31b6d4c', class: "navigation" }, h("div", { key: 'e739f1f520a4e8254befac99b6a5fe143cb6fd84', class: "item" }, h("gb-simple-side-bar-item", { key: '53a82de2dad8c8d0917682cb1f8591f6b7040aa3', 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 }), h("gb-simple-side-bar-item", { key: '3d7dba749961b527c298f16f59cad0c4124f8960', 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 && (h("gb-simple-side-bar-item", { key: 'cd460c6cfa5e9a441722e12a285e97d155ef7380', 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 && (h("gb-simple-side-bar-item", { key: '6606100a540bc98915dc027e9398fdc6b2691ade', 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 && (h("gb-simple-side-bar-item", { key: 'df826ae14810d17ec3bc605c01b69730f4a7b438', 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 && (h("div", { key: '0775483000aae25d6bf5c35d7542958fdd91821c', class: "navigation" }, h("div", { key: 'fd1dd4ea324e4c0f92577549f459909ba5e60fd4', class: "item" }, this.sixthItemLabel && (h("gb-simple-side-bar-item", { key: '45ea2f8cab2613d0e8c03f1ea807cda0cb001f4f', 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 && (h("gb-simple-side-bar-item", { key: 'bec1a3d5732b87ac730d7a5fee79411edbbdf15e', 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 && (h("gb-simple-side-bar-item", { key: '01b38d0a03f3671f62bd75194ed8ee18604d5edc', 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 && (h("gb-simple-side-bar-item", { key: '23ada2f7ce876ea2575b7243ac97bad9c727a39e', 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 && (h("gb-simple-side-bar-item", { key: 'd77d4599da5c0b2748c94ad58d281bde5076bce5', 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' && (h("div", { key: 'fba5cc5029542df9709bd9f7a772b05cb3110c28', class: "application_name" }, h("div", { key: '167eaaae1469530b0bec87de7eba182cf245c5a8', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (h("div", { key: '4731812a9444112d37d2de592a8c51a1d747d52b', class: "application_name_pattern" }, h("img", { key: '8ca6cab53b91dd4b3c97cc0dba28672c721a485f', src: patternSrc, alt: "" }))), this.hasInfo ? (h(Fragment, null, h("div", { class: "information_header" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `help_icon ${this.category}` }, h("path", { opacity: "0.4", d: "M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z", fill: "var(--color-text-brandDarkBlue, #212C65)" }), h("path", { d: "M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z", fill: "var(--color-text-brandDarkBlue, #212C65)" })), h("p", { class: `need_help ${this.category} text-lg-bold` }, "Need help?")), h("p", { class: `info ${this.category} text-sm-medium` }, this.email), h("p", { class: `info ${this.category} text-sm-medium` }, this.phoneNumber))) : (h(Fragment, null, h("div", { class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), h("span", { class: textClass }, h("slot", { name: "application_name" }))))))))), this.type === 'complex' && (h("div", { key: '79bdfdabbfef3de5e79f881c420bf0efe67e883a', class: `sidebar_and_nav ${this.state}` }, h("div", { key: '2d8bddf89d7391e9c6dd1660607bd293c5c1d66d', class: "nav_div" }, h("div", { key: 'd1f23f8780b92bac8592cea04735fa84565635b4', class: "logo_and_button" }, this.state === 'expanded' && h("img", { key: '255a6de54cecc06887b968e2b344ab65bf30690f', src: blueLogoSrc }), this.state === 'collapsed' && h("img", { key: 'f209db42872e8c6165cca5154d8e7bb4ef845970', src: logoSrc, alt: "" }), h("gb-collapse-button", { key: '0f76149a1cf34f64ac18c15b2bab9aabdaec34d9', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: 'e0cdbf3552ba1f5caea35ce625c20dbd40643938', class: "complex_sidebar_div" }, h("div", { key: '38ccc2b4869ff65a27240d2872a12dce451ea41a', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (h("div", { key: '12dfd13a7d9d42dcf83de5f78a8344f4e44bf232', class: "pattern" }, h("img", { key: '67ebcb8e6912f6117661727501c0a2ad171dd6c9', src: patternSrc, alt: "" }))), h("div", { key: '2dbc899b3a3dce4c9d73588192177552c367e692', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index) => (h("gb-complex-primary-side-bar-item", { key: `${index}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index) }))))), h("div", { key: '29f52a15beff5128cc94c7669ddf9f6e291433ef', class: `secondary_side_menu ${this.category} ${this.state}` }, h("div", { key: '17181fb3ae81987e34be9c32f3e2b4a098b1584c', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index) }))))))))));
|
|
137
|
+
return (h(Fragment, null, this.type === 'simple' && (h("div", { key: '1c24e6e13972a1054c3cc219f1f8c96bc81f9c35', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (h("div", { key: 'f799f20aa69a4909734c9c2e3e04f1653e096174', class: "pattern" }, h("img", { key: '25653554a4ba40453794591f793d38d1ed2aa135', src: patternSrc, alt: "" }))), h("div", { key: '24b01c27b617a3746ec22f7c68271b82fd28abe7', class: "nav" }, h("div", { key: '8f0dc4ba2bd24745949d6db20ad764b74c0abebf', class: `sidebar_header ${this.state}` }, h("div", { key: '362010ece8d27ad8d1ab6228b3d20bccdec1abd6', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && (h(Fragment, null, this.category === 'plain_background' && this.isDarkTheme ? (h("img", { src: whiteLogoSrc })) : this.category === 'plain_background' && !this.isDarkTheme ? (h("img", { src: blueLogoSrc })) : (h("img", { src: whiteLogoSrc })))), this.state === 'collapsed' && h("img", { key: 'a0e6e92d7762dd64ba3c7f480c1b1ca8b0987863', src: logoSrc, alt: "" })), h("div", { key: 'd97dc8fb190dbe33cbc3e9606029bb8071270985', class: `collapse_button ${this.state}` }, h("gb-collapse-button", { key: 'c75dec3f2a943f9f803d424665ab01d257b085e6', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '5407c54642e7d7d0ba263f8a24181fc3770aaba3', class: "navigation" }, h("div", { key: 'a8497c48ea82dd1c2f62b0f3ef84d8b2dc3d6db4', class: "item" }, h("gb-simple-side-bar-item", { key: 'b0ee676cf922dccdd8a0955d4ef19f337ec8a49c', 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 }), h("gb-simple-side-bar-item", { key: '84abd00b2fbce90c69aff4dc85c37bd7af195dc4', 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 && (h("gb-simple-side-bar-item", { key: '577b94e9320f7246692b3505587902a8b97c8f7b', 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 && (h("gb-simple-side-bar-item", { key: '8f162dd10beac4810388bac56e327df2cedae626', 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 && (h("gb-simple-side-bar-item", { key: '2d96b63b7a7936c0dc3c3e42be15e2f3a8c9f9fc', 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 && (h("div", { key: 'e662c2d8f5bb9d7c5d7ea572b0597ec75afb3d54', class: "navigation" }, h("div", { key: 'ca283f32d16b44e59299aa79a5690a9884bdaa0f', class: "item" }, this.sixthItemLabel && (h("gb-simple-side-bar-item", { key: '24a0a761580e45a6073e1d38a55db3e105991d93', 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 && (h("gb-simple-side-bar-item", { key: 'cdfebd44a8f01e85f228830d78dbebcbe5c4f84c', 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 && (h("gb-simple-side-bar-item", { key: '56a6cfac44fdd83a4415e66437032cfe29f84c44', 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 && (h("gb-simple-side-bar-item", { key: 'a3a9eea18e571fe099c626511cff0dc1aaf32028', 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 && (h("gb-simple-side-bar-item", { key: '2075731212fe1879bfa0614b7d27d0b15878a58c', 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' && (h("div", { key: 'c14c0b2f5abe557d2385771e75d7db9a6d3ccc46', class: "application_name" }, h("div", { key: 'fa0e032e97cd08fc18e7078dd4426410ef557873', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (h("div", { key: 'd3c5f239ef52e7b30e6840566feaa76dea5902c1', class: "application_name_pattern" }, h("img", { key: 'e44b6da6185b63e16baac6c91dce13e038628a33', src: patternSrc, alt: "" }))), this.hasInfo ? (h(Fragment, null, h("div", { class: "information_header" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `help_icon ${this.category}` }, h("path", { opacity: "0.4", d: "M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z", fill: "var(--color-text-brandDarkBlue, #212C65)" }), h("path", { d: "M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z", fill: "var(--color-text-brandDarkBlue, #212C65)" })), h("p", { class: `need_help ${this.category} text-lg-bold` }, "Need help?")), h("p", { class: `info ${this.category} text-sm-medium` }, this.email), h("p", { class: `info ${this.category} text-sm-medium` }, this.phoneNumber))) : (h(Fragment, null, h("div", { class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), h("span", { class: textClass }, h("slot", { name: "application_name" }))))))))), this.type === 'complex' && (h("div", { key: '6cd2295b46326bfa9d4a19337ac29e4925191750', class: `sidebar_and_nav ${this.state}` }, h("div", { key: 'cdd758acbbbfc1d6c7ff5dacdb5cc5f85d6dc976', class: "nav_div" }, h("div", { key: 'f6fec7a98379454b776435e579b9ad3b9f076ac6', class: "logo_and_button" }, this.state === 'expanded' && h("img", { key: 'bbaca7c5d48e9eb7974b8bd1f443ab7bd02c9272', src: blueLogoSrc }), this.state === 'collapsed' && h("img", { key: '42c7fd23b383bf196508f2bd83f76f81e30d6d4f', src: logoSrc, alt: "" }), h("gb-collapse-button", { key: '245c965048251d5fce6d66327625c10e5ff45ade', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '1cb42f7105862b42364d2e26815422bce304dd9b', class: "complex_sidebar_div" }, h("div", { key: '26a1d8099221f59d6af0665885445454187ee571', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (h("div", { key: '62d28d0348b6c804f25d054c2bf849f5756ce964', class: "pattern" }, h("img", { key: '5d58a8e1f2b4113fac0c4cb5520650d582a4c0b6', src: patternSrc, alt: "" }))), h("div", { key: 'c577b53a7f0b7396ee0b9d517712c66809560c4a', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index) => (h("gb-complex-primary-side-bar-item", { key: `${index}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index) }))))), h("div", { key: 'aafa6d9787cf37cd0b42db34d832264b95ae4ef2', class: `secondary_side_menu ${this.category} ${this.state}` }, h("div", { key: 'f27bd9f86c130ee9bd38b54c49bdf7597490ce3d', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index) }))))))))));
|
|
136
138
|
}
|
|
137
139
|
get el() { return this; }
|
|
140
|
+
static get watchers() { return {
|
|
141
|
+
"theme": ["changeTheme"]
|
|
142
|
+
}; }
|
|
138
143
|
static get style() { return gbSidebarCss; }
|
|
139
144
|
}, [1, "gb-sidebar", {
|
|
140
145
|
"state": [1025],
|
|
@@ -174,6 +179,8 @@ const GbSidebar$1 = /*@__PURE__*/ proxyCustomElement(class GbSidebar extends H {
|
|
|
174
179
|
"isDarkTheme": [32],
|
|
175
180
|
"leadingIconSvg": [32],
|
|
176
181
|
"sideBarItemClicked": [64]
|
|
182
|
+
}, undefined, {
|
|
183
|
+
"theme": ["changeTheme"]
|
|
177
184
|
}]);
|
|
178
185
|
function defineCustomElement$1() {
|
|
179
186
|
if (typeof customElements === "undefined") {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"gb-sidebar.js","mappings":"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","names":["GbSidebar","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-sidebar/gb-sidebar.css?tag=gb-sidebar&encapsulation=shadow","src/components/gb-sidebar/gb-sidebar.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n/* Simple Sidebar Styles */\r\n.simple_sidebar_div{\r\n transition: all 0.3s ease-in-out;\r\n position: relative;\r\n height: 100vh;\r\n}\r\n\r\n.pattern{\r\n position: absolute;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n overflow: hidden;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.simple_sidebar_div .pattern img\r\n.primary_side_menu .pattern img{\r\n width: 100%;\r\n height: auto;\r\n}\r\n\r\n.simple_sidebar_div.expanded{\r\n display: inline-flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n width: 16.75rem;\r\n}\r\n\r\n.simple_sidebar_div.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n width: 5rem;\r\n}\r\n\r\n.nav{\r\n display: flex;\r\n width: 100%;\r\n flex-direction: column;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.sidebar_header.expanded{\r\n display: flex;\r\n padding: var(--spacing-none) var(--spacing-4) var(--spacing-none) var(--spacing-6);\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-top: 1rem;\r\n}\r\n\r\n.sidebar_header.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n margin-top: 1rem;\r\n gap: 1.5rem;\r\n}\r\n\r\n.logo_and_name.expanded{\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n}\r\n\r\n.logo_and_name.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.collapse_button.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.application_name{\r\n display: flex;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.wrapper{\r\n display: flex;\r\n padding: var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: flex-start;\r\n gap: var(--spacing-4);\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n position: relative;\r\n width: 13.75rem;\r\n height: auto;\r\n overflow: hidden;\r\n}\r\n\r\n.application_icon svg{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\n.application_icon.plain_background path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.plain_background path[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.colored_background path[stroke] {\r\n stroke: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_icon.colored_background path[fill] {\r\n fill: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_name_pattern{\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.application_name_pattern img{\r\n width: 100%;\r\n}\r\n\r\n.wrapper{\r\n width: 100%;\r\n}\r\n\r\n.wrapper.colored_background{\r\n border: 1px solid rgba(255, 255, 255, 0.10);\r\n background: rgba(0, 0, 0, 0.10);\r\n}\r\n\r\n.wrapper.plain_background{\r\n background: var(--color-background-gray-subtlest, #F6F8FA);\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n}\r\n\r\n.plain_background_color{\r\n color: var(--color-text-information-bold, #042F59);\r\n}\r\n\r\n.colored_background_color{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n/* Simple Sidebar Category Styles */\r\n.simple_sidebar_div.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.simple_sidebar_div.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n.item{\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n/* Complex Sidebar Styles */\r\n.sidebar_and_nav{\r\n width: fit-content;\r\n transition: all 0.3s ease-in-out;\r\n}\r\n\r\n.complex_sidebar_div{\r\n display: flex;\r\n gap: 0;\r\n width: fit-content;\r\n height: 100vh;\r\n}\r\n\r\n.primary_side_menu{\r\n position: relative;\r\n width: 6rem;\r\n}\r\n\r\n.primary_side_menu.standard{\r\n padding: var(--spacing-4) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu.compact{\r\n padding: var(--spacing-2) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu_container{\r\n width: 100%;\r\n}\r\n\r\n.nav_div{\r\n display: flex;\r\n height: 4.5rem;\r\n padding: 0.5rem var(--spacing-5) 0.5rem var(--spacing-7);\r\n align-items: center;\r\n gap: 1.5rem;\r\n flex: 1 0 0;\r\n border-bottom: 1px solid var(--color-border-subtler, #E3E8EF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.logo_and_button{\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n/* Complex Sidebar Category Styles */\r\n.primary_side_menu.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.primary_side_menu.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n/* Complex Sidebar State Styles */\r\n.secondary_side_menu{\r\n width: fit-content;\r\n}\r\n\r\n.secondary_side_menu.colored_background{\r\n background: var(--color-background-information-subtlest, #E4F0FC);\r\n}\r\n\r\n.secondary_side_menu.plain_background{\r\n background: var(--color-surface, #FFFFFF);\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n}\r\n\r\n.sside_menu{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n height: 100vh;\r\n padding: var(--spacing-4) var(--spacing-none);\r\n}\r\n\r\n.information_header{\r\n display: flex;\r\nalign-items: center;\r\ngap: var(--spacing-2);\r\nalign-self: stretch;\r\n}\r\n\r\n.help_icon.plain_background path[stroke]{\r\n stroke: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.plain_background path[fill]{\r\n fill: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.colored_background path[stroke]{\r\n stroke: var(--base-white, #FFFFFF)\r\n}\r\n\r\n.help_icon.colored_background path[fill]{\r\n fill: var(--base-white, #FFFFFF)\r\n}\r\n\r\n\r\n.need_help.plain_background{\r\n color: var(--color-text-brandDarkBlue, #212C65);\r\n}\r\n\r\n.need_help.colored_background{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.colored_background {\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.plain_background{\r\n color: var(--color-text-bold, #202939);\r\n}","import { Component, Element, h, Prop, Fragment, State, getAssetPath, Method, Event, EventEmitter } from '@stencil/core';\r\nimport { GeneralBackgroundCategories } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-sidebar',\r\n styleUrl: 'gb-sidebar.css',\r\n shadow: true,\r\n})\r\nexport class GbSidebar {\r\n @Prop({ mutable: true }) state: 'expanded' | 'collapsed' = 'expanded';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() navItemStyle: 'standard' | 'compact';\r\n @Prop() type: 'simple' | 'complex';\r\n @Prop() showSecondCategory: boolean = false;\r\n @Prop() iconInstance: string = '';\r\n @Prop() firstItemIcon: string = '';\r\n @Prop() secondItemIcon: string = '';\r\n @Prop() thirdItemIcon: string = '';\r\n @Prop() fourthItemIcon: string = '';\r\n @Prop() fifthItemIcon: string = '';\r\n @Prop() sixthItemIcon: string = '';\r\n @Prop() seventhItemIcon: string = '';\r\n @Prop() eighthItemIcon: string = '';\r\n @Prop() ninthItemIcon: string = '';\r\n @Prop() tenthItemIcon: string = '';\r\n @Prop() firstItemLabel: string = '';\r\n @Prop() secondItemLabel: string = '';\r\n @Prop() thirdItemLabel: string = '';\r\n @Prop() fourthItemLabel: string = '';\r\n @Prop() fifthItemLabel: string = '';\r\n @Prop() sixthItemLabel: string = '';\r\n @Prop() seventhItemLabel: string = '';\r\n @Prop() eighthItemLabel: string = '';\r\n @Prop() ninthItemLabel: string = '';\r\n @Prop() tenthItemLabel: string = '';\r\n @Prop() complexSidebarData: any = {\r\n Recruitment: {\r\n icon: 'assets/user-search-01.svg', // Icon class or path for Recruitment\r\n items: [\r\n { label: 'Overview', icon: 'assets/star.svg' },\r\n { label: 'My Profile', icon: 'assets/star.svg' },\r\n { label: 'Appraisal', icon: 'assets/star.svg' },\r\n { label: 'Staff Management', icon: 'assets/star.svg' },\r\n { label: 'Leave Management', icon: 'assets/star.svg' },\r\n { label: 'Resignation Portal', icon: 'assets/star.svg' },\r\n ],\r\n },\r\n Staff: {\r\n icon: 'assets/user-account.svg',\r\n items: [\r\n { label: 'Staff Overview', icon: 'assets/star.svg' },\r\n { label: 'Payroll Management', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'Attendance', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'New', icon: 'assets/dashboard-square-03.svg' },\r\n ],\r\n },\r\n };\r\n @Prop({ mutable: true }) activeIndex: number;\r\n @Prop({ mutable: true }) activePrimaryItem: string = 'Staff';\r\n @Prop({ mutable: true }) activeSecondaryItem: string = 'Attendance Tracking';\r\n @Prop() hasInfo: boolean = false;\r\n @Prop() email: string = '';\r\n @Prop() phoneNumber: string = '';\r\n @Prop() theme: 'system' | 'light' | 'dark' = 'system';\r\n @State() isDarkTheme: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @Event() simpleSidebarItemClicked: EventEmitter<number>;\r\n @Event() secondaryItemClicked: EventEmitter<number>;\r\n @Event() primaryItemClicked: EventEmitter<{ primary: number; secondary: number }>;\r\n @Event() sidebarState: EventEmitter<string>;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n collapseSideBar() {\r\n if (this.state === 'expanded') {\r\n this.state = 'collapsed';\r\n }\r\n this.sidebarState.emit('collapsed');\r\n }\r\n\r\n expandSideBar() {\r\n if (this.state === 'collapsed') {\r\n this.state = 'expanded';\r\n }\r\n this.sidebarState.emit('expanded');\r\n }\r\n\r\n @Method()\r\n async sideBarItemClicked(index: number) {\r\n this.activeIndex = index;\r\n // console.log(index);\r\n this.simpleSidebarItemClicked.emit(index);\r\n }\r\n\r\n handlePrimaryClick(item: string, _index: number) {\r\n this.activePrimaryItem = item;\r\n this.activeSecondaryItem = this.complexSidebarData[item].items[0].label; // Reset to the first secondary item\r\n // console.log(index)\r\n }\r\n\r\n handleSecondaryClick(item: string, _index: number) {\r\n this.activeSecondaryItem = item;\r\n // console.log(index);\r\n }\r\n\r\n componentDidLoad() {\r\n const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n if (applicationName) {\r\n applicationName.classList.add('text-lg-bold');\r\n applicationName.classList.add('application_name');\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconInstance);\r\n\r\n if(this.theme === 'system') {\r\n this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches\r\n } else if(this.theme === 'light') {\r\n this.isDarkTheme = false;\r\n } else if(this.theme === 'dark') {\r\n this.isDarkTheme = true;\r\n }\r\n }\r\n\r\n render() {\r\n const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';\r\n const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);\r\n const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.type === 'simple' && (\r\n <div class={`simple_sidebar_div ${this.state} ${this.category}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"nav\">\r\n <div class={`sidebar_header ${this.state}`}>\r\n <div class={`logo_and_name ${this.state}`}>\r\n {this.state === 'expanded' && (\r\n <>\r\n {this.category === 'plain_background' && this.isDarkTheme ? (\r\n <img src={whiteLogoSrc} />\r\n ) : this.category === 'plain_background' && !this.isDarkTheme ? (\r\n <img src={blueLogoSrc} />\r\n ) : (\r\n <img src={whiteLogoSrc} />\r\n )}\r\n </>\r\n )}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n </div>\r\n <div class={`collapse_button ${this.state}`}>\r\n <gb-collapse-button\r\n color={this.category === 'plain_background' ? 'gray' : 'white'}\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 0 ? 'active' : 'default'}\r\n icon={this.firstItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(0)}\r\n label={this.firstItemLabel}\r\n ></gb-simple-side-bar-item>\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 1 ? 'active' : 'default'}\r\n icon={this.secondItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(1)}\r\n label={this.secondItemLabel}\r\n ></gb-simple-side-bar-item>\r\n {this.thirdItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 2 ? 'active' : 'default'}\r\n icon={this.thirdItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(2)}\r\n label={this.thirdItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fourthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 3 ? 'active' : 'default'}\r\n icon={this.fourthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(3)}\r\n label={this.fourthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fifthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 4 ? 'active' : 'default'}\r\n icon={this.fifthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(4)}\r\n label={this.fifthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n {this.showSecondCategory && (\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n {this.sixthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 5 ? 'active' : 'default'}\r\n icon={this.sixthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(5)}\r\n label={this.sixthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.seventhItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 6 ? 'active' : 'default'}\r\n icon={this.seventhItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(6)}\r\n label={this.seventhItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.eighthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 7 ? 'active' : 'default'}\r\n icon={this.eighthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(7)}\r\n label={this.eighthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.ninthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 8 ? 'active' : 'default'}\r\n icon={this.ninthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(8)}\r\n label={this.ninthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.tenthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 9 ? 'active' : 'default'}\r\n icon={this.tenthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(9)}\r\n label={this.tenthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n {this.state === 'expanded' && (\r\n <div class=\"application_name\">\r\n <div class={`wrapper ${this.category}`}>\r\n {this.category === 'plain_background' && (\r\n <div class=\"application_name_pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n {this.hasInfo ? (\r\n <>\r\n <div class=\"information_header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`help_icon ${this.category}`}>\r\n <path\r\n opacity=\"0.4\"\r\n d=\"M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n <path\r\n d=\"M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n </svg>\r\n <p class={`need_help ${this.category} text-lg-bold`}>Need help?</p>\r\n </div>\r\n {/* <p class={`info ${this.category} text-sm-medium`}>Info@globusbank.com</p> */}\r\n {/* <p class={`info ${this.category} text-sm-medium`}>(+234) 123 4324 122</p> */}\r\n <p class={`info ${this.category} text-sm-medium`}>{this.email}</p>\r\n <p class={`info ${this.category} text-sm-medium`}>{this.phoneNumber}</p>\r\n </>\r\n ) : (\r\n <>\r\n <div class={`application_icon ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n <span class={textClass}>\r\n <slot name=\"application_name\"></slot>\r\n </span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'complex' && (\r\n <div class={`sidebar_and_nav ${this.state}`}>\r\n <div class=\"nav_div\">\r\n <div class=\"logo_and_button\">\r\n {this.state === 'expanded' && <img src={blueLogoSrc} />}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n <gb-collapse-button\r\n color=\"gray\"\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"complex_sidebar_div\">\r\n <div class={`primary_side_menu ${this.category} ${this.navItemStyle}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"primary_side_menu_container\">\r\n {Object.keys(this.complexSidebarData).map((primaryItem, index) => (\r\n <gb-complex-primary-side-bar-item\r\n key={`${index}`} // Unique key\r\n label={primaryItem}\r\n category={this.category}\r\n item-style={this.navItemStyle}\r\n icon={this.complexSidebarData[primaryItem].icon}\r\n state={this.activePrimaryItem === primaryItem ? 'active' : 'default'}\r\n onClick={() => this.handlePrimaryClick(primaryItem, index)}\r\n ></gb-complex-primary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n <div class={`secondary_side_menu ${this.category} ${this.state}`}>\r\n <div class=\"sside_menu\">\r\n {this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (\r\n <gb-complex-secondary-side-bar-item\r\n key={`${this.activePrimaryItem}-${index}`} // Unique key\r\n type={this.state === 'expanded' ? 'full_with_label' : 'icon_only'}\r\n label={secondaryItem.label}\r\n category={this.category}\r\n icon={secondaryItem.icon}\r\n state={this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default'}\r\n onClick={() => this.handleSecondaryClick(secondaryItem.label, index)}\r\n ></gb-complex-secondary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
1
|
+
{"file":"gb-sidebar.js","mappings":"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","names":["GbSidebar","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-sidebar/gb-sidebar.css?tag=gb-sidebar&encapsulation=shadow","src/components/gb-sidebar/gb-sidebar.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n/* Simple Sidebar Styles */\r\n.simple_sidebar_div{\r\n transition: all 0.3s ease-in-out;\r\n position: relative;\r\n height: 100vh;\r\n}\r\n\r\n.pattern{\r\n position: absolute;\r\n top: 0;\r\n width: 100%;\r\n height: 100%;\r\n overflow: hidden;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.simple_sidebar_div .pattern img\r\n.primary_side_menu .pattern img{\r\n width: 100%;\r\n height: auto;\r\n}\r\n\r\n.simple_sidebar_div.expanded{\r\n display: inline-flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n width: 16.75rem;\r\n}\r\n\r\n.simple_sidebar_div.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n width: 5rem;\r\n}\r\n\r\n.nav{\r\n display: flex;\r\n width: 100%;\r\n flex-direction: column;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.sidebar_header.expanded{\r\n display: flex;\r\n padding: var(--spacing-none) var(--spacing-4) var(--spacing-none) var(--spacing-6);\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-top: 1rem;\r\n}\r\n\r\n.sidebar_header.collapsed{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n margin-top: 1rem;\r\n gap: 1.5rem;\r\n}\r\n\r\n.logo_and_name.expanded{\r\n display: flex;\r\n justify-content: flex-start;\r\n align-items: center;\r\n}\r\n\r\n.logo_and_name.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.collapse_button.collapsed{\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.application_name{\r\n display: flex;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.wrapper{\r\n display: flex;\r\n padding: var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: flex-start;\r\n gap: var(--spacing-4);\r\n align-self: stretch;\r\n border-radius: var(--rounded-sm);\r\n position: relative;\r\n width: 13.75rem;\r\n height: auto;\r\n overflow: hidden;\r\n}\r\n\r\n.application_icon svg{\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n}\r\n\r\n.application_icon.plain_background path[stroke] {\r\n stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.plain_background path[fill] {\r\n fill: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon.colored_background path[stroke] {\r\n stroke: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_icon.colored_background path[fill] {\r\n fill: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.application_name_pattern{\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n mix-blend-mode: multiply;\r\n}\r\n\r\n.application_name_pattern img{\r\n width: 100%;\r\n}\r\n\r\n.wrapper{\r\n width: 100%;\r\n}\r\n\r\n.wrapper.colored_background{\r\n border: 1px solid rgba(255, 255, 255, 0.10);\r\n background: rgba(0, 0, 0, 0.10);\r\n}\r\n\r\n.wrapper.plain_background{\r\n background: var(--color-background-gray-subtlest, #F6F8FA);\r\n border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n}\r\n\r\n.plain_background_color{\r\n color: var(--color-text-information-bold, #042F59);\r\n}\r\n\r\n.colored_background_color{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n/* Simple Sidebar Category Styles */\r\n.simple_sidebar_div.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.simple_sidebar_div.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n.item{\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n/* Complex Sidebar Styles */\r\n.sidebar_and_nav{\r\n width: fit-content;\r\n transition: all 0.3s ease-in-out;\r\n}\r\n\r\n.complex_sidebar_div{\r\n display: flex;\r\n gap: 0;\r\n width: fit-content;\r\n height: 100vh;\r\n}\r\n\r\n.primary_side_menu{\r\n position: relative;\r\n width: 6rem;\r\n}\r\n\r\n.primary_side_menu.standard{\r\n padding: var(--spacing-4) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu.compact{\r\n padding: var(--spacing-2) var(--spacing-none) 0.5rem var(--spacing-none);\r\n}\r\n\r\n.primary_side_menu_container{\r\n width: 100%;\r\n}\r\n\r\n.nav_div{\r\n display: flex;\r\n height: 4.5rem;\r\n padding: 0.5rem var(--spacing-5) 0.5rem var(--spacing-7);\r\n align-items: center;\r\n gap: 1.5rem;\r\n flex: 1 0 0;\r\n border-bottom: 1px solid var(--color-border-subtler, #E3E8EF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.logo_and_button{\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n flex: 1 0 0;\r\n}\r\n\r\n/* Complex Sidebar Category Styles */\r\n.primary_side_menu.plain_background{\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.primary_side_menu.colored_background{\r\n background-image: linear-gradient(180deg, #064E94 0%, #02182E 100%);\r\n background-size: cover;\r\n}\r\n\r\n/* Complex Sidebar State Styles */\r\n.secondary_side_menu{\r\n width: fit-content;\r\n}\r\n\r\n.secondary_side_menu.colored_background{\r\n background: var(--color-background-information-subtlest, #E4F0FC);\r\n}\r\n\r\n.secondary_side_menu.plain_background{\r\n background: var(--color-surface, #FFFFFF);\r\n border-right: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n}\r\n\r\n.sside_menu{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n height: 100vh;\r\n padding: var(--spacing-4) var(--spacing-none);\r\n}\r\n\r\n.information_header{\r\n display: flex;\r\nalign-items: center;\r\ngap: var(--spacing-2);\r\nalign-self: stretch;\r\n}\r\n\r\n.help_icon.plain_background path[stroke]{\r\n stroke: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.plain_background path[fill]{\r\n fill: var(--color-text-brandDarkBlue, #212C65)\r\n}\r\n\r\n.help_icon.colored_background path[stroke]{\r\n stroke: var(--base-white, #FFFFFF)\r\n}\r\n\r\n.help_icon.colored_background path[fill]{\r\n fill: var(--base-white, #FFFFFF)\r\n}\r\n\r\n\r\n.need_help.plain_background{\r\n color: var(--color-text-brandDarkBlue, #212C65);\r\n}\r\n\r\n.need_help.colored_background{\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.colored_background {\r\n color: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.info.plain_background{\r\n color: var(--color-text-bold, #202939);\r\n}","import { Component, Element, h, Prop, Fragment, State, getAssetPath, Method, Event, EventEmitter, Watch } from '@stencil/core';\r\nimport { GeneralBackgroundCategories } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-sidebar',\r\n styleUrl: 'gb-sidebar.css',\r\n shadow: true,\r\n})\r\nexport class GbSidebar {\r\n @Prop({ mutable: true }) state: 'expanded' | 'collapsed' = 'expanded';\r\n @Prop() category: GeneralBackgroundCategories;\r\n @Prop() navItemStyle: 'standard' | 'compact';\r\n @Prop() type: 'simple' | 'complex';\r\n @Prop() showSecondCategory: boolean = false;\r\n @Prop() iconInstance: string = '';\r\n @Prop() firstItemIcon: string = '';\r\n @Prop() secondItemIcon: string = '';\r\n @Prop() thirdItemIcon: string = '';\r\n @Prop() fourthItemIcon: string = '';\r\n @Prop() fifthItemIcon: string = '';\r\n @Prop() sixthItemIcon: string = '';\r\n @Prop() seventhItemIcon: string = '';\r\n @Prop() eighthItemIcon: string = '';\r\n @Prop() ninthItemIcon: string = '';\r\n @Prop() tenthItemIcon: string = '';\r\n @Prop() firstItemLabel: string = '';\r\n @Prop() secondItemLabel: string = '';\r\n @Prop() thirdItemLabel: string = '';\r\n @Prop() fourthItemLabel: string = '';\r\n @Prop() fifthItemLabel: string = '';\r\n @Prop() sixthItemLabel: string = '';\r\n @Prop() seventhItemLabel: string = '';\r\n @Prop() eighthItemLabel: string = '';\r\n @Prop() ninthItemLabel: string = '';\r\n @Prop() tenthItemLabel: string = '';\r\n @Prop() complexSidebarData: any = {\r\n Recruitment: {\r\n icon: 'assets/user-search-01.svg', // Icon class or path for Recruitment\r\n items: [\r\n { label: 'Overview', icon: 'assets/star.svg' },\r\n { label: 'My Profile', icon: 'assets/star.svg' },\r\n { label: 'Appraisal', icon: 'assets/star.svg' },\r\n { label: 'Staff Management', icon: 'assets/star.svg' },\r\n { label: 'Leave Management', icon: 'assets/star.svg' },\r\n { label: 'Resignation Portal', icon: 'assets/star.svg' },\r\n ],\r\n },\r\n Staff: {\r\n icon: 'assets/user-account.svg',\r\n items: [\r\n { label: 'Staff Overview', icon: 'assets/star.svg' },\r\n { label: 'Payroll Management', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'Attendance', icon: 'assets/dashboard-square-03.svg' },\r\n { label: 'New', icon: 'assets/dashboard-square-03.svg' },\r\n ],\r\n },\r\n };\r\n @Prop({ mutable: true }) activeIndex: number;\r\n @Prop({ mutable: true }) activePrimaryItem: string = 'Staff';\r\n @Prop({ mutable: true }) activeSecondaryItem: string = 'Attendance Tracking';\r\n @Prop() hasInfo: boolean = false;\r\n @Prop() email: string = '';\r\n @Prop() phoneNumber: string = '';\r\n @Prop() theme: 'system' | 'light' | 'dark' = 'system';\r\n @State() isDarkTheme: boolean = false;\r\n @Element() el: HTMLElement;\r\n @State() leadingIconSvg: string = '';\r\n @Event() simpleSidebarItemClicked: EventEmitter<number>;\r\n @Event() secondaryItemClicked: EventEmitter<number>;\r\n @Event() primaryItemClicked: EventEmitter<{ primary: number; secondary: number }>;\r\n @Event() sidebarState: EventEmitter<string>;\r\n\r\n async loadIcon(iconName: string) {\r\n const iconPath = getAssetPath(`${iconName}`);\r\n const response = await fetch(iconPath);\r\n const svg = await response.text();\r\n this.leadingIconSvg = svg;\r\n }\r\n\r\n collapseSideBar() {\r\n if (this.state === 'expanded') {\r\n this.state = 'collapsed';\r\n }\r\n this.sidebarState.emit('collapsed');\r\n }\r\n\r\n expandSideBar() {\r\n if (this.state === 'collapsed') {\r\n this.state = 'expanded';\r\n }\r\n this.sidebarState.emit('expanded');\r\n }\r\n\r\n @Method()\r\n async sideBarItemClicked(index: number) {\r\n this.activeIndex = index;\r\n // console.log(index);\r\n this.simpleSidebarItemClicked.emit(index);\r\n }\r\n\r\n handlePrimaryClick(item: string, _index: number) {\r\n this.activePrimaryItem = item;\r\n this.activeSecondaryItem = this.complexSidebarData[item].items[0].label; // Reset to the first secondary item\r\n // console.log(index)\r\n }\r\n\r\n handleSecondaryClick(item: string, _index: number) {\r\n this.activeSecondaryItem = item;\r\n // console.log(index);\r\n }\r\n\r\n componentDidLoad() {\r\n const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n if (applicationName) {\r\n applicationName.classList.add('text-lg-bold');\r\n applicationName.classList.add('application_name');\r\n }\r\n }\r\n\r\n @Watch('theme')\r\n changeTheme() {\r\n if (this.theme === 'system') {\r\n this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;\r\n } else if (this.theme === 'light') {\r\n this.isDarkTheme = false;\r\n } else if (this.theme === 'dark') {\r\n this.isDarkTheme = true;\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.loadIcon(this.iconInstance);\r\n }\r\n\r\n render() {\r\n const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';\r\n const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);\r\n const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n return (\r\n <>\r\n {this.type === 'simple' && (\r\n <div class={`simple_sidebar_div ${this.state} ${this.category}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"nav\">\r\n <div class={`sidebar_header ${this.state}`}>\r\n <div class={`logo_and_name ${this.state}`}>\r\n {this.state === 'expanded' && (\r\n <>\r\n {this.category === 'plain_background' && this.isDarkTheme ? (\r\n <img src={whiteLogoSrc} />\r\n ) : this.category === 'plain_background' && !this.isDarkTheme ? (\r\n <img src={blueLogoSrc} />\r\n ) : (\r\n <img src={whiteLogoSrc} />\r\n )}\r\n </>\r\n )}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n </div>\r\n <div class={`collapse_button ${this.state}`}>\r\n <gb-collapse-button\r\n color={this.category === 'plain_background' ? 'gray' : 'white'}\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 0 ? 'active' : 'default'}\r\n icon={this.firstItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(0)}\r\n label={this.firstItemLabel}\r\n ></gb-simple-side-bar-item>\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 1 ? 'active' : 'default'}\r\n icon={this.secondItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(1)}\r\n label={this.secondItemLabel}\r\n ></gb-simple-side-bar-item>\r\n {this.thirdItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 2 ? 'active' : 'default'}\r\n icon={this.thirdItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(2)}\r\n label={this.thirdItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fourthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 3 ? 'active' : 'default'}\r\n icon={this.fourthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(3)}\r\n label={this.fourthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.fifthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 4 ? 'active' : 'default'}\r\n icon={this.fifthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(4)}\r\n label={this.fifthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n {this.showSecondCategory && (\r\n <div class=\"navigation\">\r\n <div class=\"item\">\r\n {this.sixthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 5 ? 'active' : 'default'}\r\n icon={this.sixthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(5)}\r\n label={this.sixthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.seventhItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 6 ? 'active' : 'default'}\r\n icon={this.seventhItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(6)}\r\n label={this.seventhItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.eighthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 7 ? 'active' : 'default'}\r\n icon={this.eighthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(7)}\r\n label={this.eighthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.ninthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 8 ? 'active' : 'default'}\r\n icon={this.ninthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(8)}\r\n label={this.ninthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n {this.tenthItemLabel && (\r\n <gb-simple-side-bar-item\r\n state={this.activeIndex === 9 ? 'active' : 'default'}\r\n icon={this.tenthItemIcon}\r\n category={this.category}\r\n type={this.state === 'collapsed' ? 'icon_only' : 'full_with_label'}\r\n onClick={() => this.sideBarItemClicked(9)}\r\n label={this.tenthItemLabel}\r\n ></gb-simple-side-bar-item>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n {this.state === 'expanded' && (\r\n <div class=\"application_name\">\r\n <div class={`wrapper ${this.category}`}>\r\n {this.category === 'plain_background' && (\r\n <div class=\"application_name_pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n {this.hasInfo ? (\r\n <>\r\n <div class=\"information_header\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`help_icon ${this.category}`}>\r\n <path\r\n opacity=\"0.4\"\r\n d=\"M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n <path\r\n d=\"M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z\"\r\n fill=\"var(--color-text-brandDarkBlue, #212C65)\"\r\n />\r\n </svg>\r\n <p class={`need_help ${this.category} text-lg-bold`}>Need help?</p>\r\n </div>\r\n {/* <p class={`info ${this.category} text-sm-medium`}>Info@globusbank.com</p> */}\r\n {/* <p class={`info ${this.category} text-sm-medium`}>(+234) 123 4324 122</p> */}\r\n <p class={`info ${this.category} text-sm-medium`}>{this.email}</p>\r\n <p class={`info ${this.category} text-sm-medium`}>{this.phoneNumber}</p>\r\n </>\r\n ) : (\r\n <>\r\n <div class={`application_icon ${this.category}`} innerHTML={this.leadingIconSvg}></div>\r\n <span class={textClass}>\r\n <slot name=\"application_name\"></slot>\r\n </span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n {this.type === 'complex' && (\r\n <div class={`sidebar_and_nav ${this.state}`}>\r\n <div class=\"nav_div\">\r\n <div class=\"logo_and_button\">\r\n {this.state === 'expanded' && <img src={blueLogoSrc} />}\r\n {this.state === 'collapsed' && <img src={logoSrc} alt=\"\" />}\r\n <gb-collapse-button\r\n color=\"gray\"\r\n action={this.state === 'collapsed' ? 'expand' : 'collapse'}\r\n onClick={() => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar())}\r\n ></gb-collapse-button>\r\n </div>\r\n </div>\r\n <div class=\"complex_sidebar_div\">\r\n <div class={`primary_side_menu ${this.category} ${this.navItemStyle}`}>\r\n {this.category === 'colored_background' && (\r\n <div class=\"pattern\">\r\n <img src={patternSrc} alt=\"\" />\r\n </div>\r\n )}\r\n <div class=\"primary_side_menu_container\">\r\n {Object.keys(this.complexSidebarData).map((primaryItem, index) => (\r\n <gb-complex-primary-side-bar-item\r\n key={`${index}`} // Unique key\r\n label={primaryItem}\r\n category={this.category}\r\n item-style={this.navItemStyle}\r\n icon={this.complexSidebarData[primaryItem].icon}\r\n state={this.activePrimaryItem === primaryItem ? 'active' : 'default'}\r\n onClick={() => this.handlePrimaryClick(primaryItem, index)}\r\n ></gb-complex-primary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n <div class={`secondary_side_menu ${this.category} ${this.state}`}>\r\n <div class=\"sside_menu\">\r\n {this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (\r\n <gb-complex-secondary-side-bar-item\r\n key={`${this.activePrimaryItem}-${index}`} // Unique key\r\n type={this.state === 'expanded' ? 'full_with_label' : 'icon_only'}\r\n label={secondaryItem.label}\r\n category={this.category}\r\n icon={secondaryItem.icon}\r\n state={this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default'}\r\n onClick={() => this.handleSecondaryClick(secondaryItem.label, index)}\r\n ></gb-complex-secondary-side-bar-item>\r\n ))}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n )}\r\n </>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
package/dist/docs.json
CHANGED
|
@@ -1787,8 +1787,7 @@ const GbSidebar = class {
|
|
|
1787
1787
|
applicationName.classList.add('application_name');
|
|
1788
1788
|
}
|
|
1789
1789
|
}
|
|
1790
|
-
|
|
1791
|
-
this.loadIcon(this.iconInstance);
|
|
1790
|
+
changeTheme() {
|
|
1792
1791
|
if (this.theme === 'system') {
|
|
1793
1792
|
this.isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
1794
1793
|
}
|
|
@@ -1799,15 +1798,21 @@ const GbSidebar = class {
|
|
|
1799
1798
|
this.isDarkTheme = true;
|
|
1800
1799
|
}
|
|
1801
1800
|
}
|
|
1801
|
+
componentWillLoad() {
|
|
1802
|
+
this.loadIcon(this.iconInstance);
|
|
1803
|
+
}
|
|
1802
1804
|
render() {
|
|
1803
1805
|
const textClass = this.category === 'plain_background' ? 'plain_background_color' : 'colored_background_color';
|
|
1804
1806
|
const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);
|
|
1805
1807
|
const logoSrc = getAssetPath(`assets/globus_bank_logo.svg`);
|
|
1806
1808
|
const blueLogoSrc = getAssetPath(`assets/globus_bank_logo_blue.svg`);
|
|
1807
1809
|
const whiteLogoSrc = getAssetPath(`assets/globus_bank_logo_white.svg`);
|
|
1808
|
-
return (h(Fragment, null, this.type === 'simple' && (h("div", { key: 'a87351447bc40299c01b4b92d387a16a5eb32383', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (h("div", { key: '30222fae39d47197382de0f5f9d17172852afb64', class: "pattern" }, h("img", { key: '1911aa4e99ee974fc00e0c3b5633ec607e947d78', src: patternSrc, alt: "" }))), h("div", { key: '84e741540e05803022b74936a6cccedbd4ca0f28', class: "nav" }, h("div", { key: '95f847326f9aa9324a56891ba7d4a8328fdac874', class: `sidebar_header ${this.state}` }, h("div", { key: '64326b2b79c0bb04dcb995fbe5aa52b909197638', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && (h(Fragment, null, this.category === 'plain_background' && this.isDarkTheme ? (h("img", { src: whiteLogoSrc })) : this.category === 'plain_background' && !this.isDarkTheme ? (h("img", { src: blueLogoSrc })) : (h("img", { src: whiteLogoSrc })))), this.state === 'collapsed' && h("img", { key: 'c537c7cb362958d96b7f4702de21cc6165313566', src: logoSrc, alt: "" })), h("div", { key: 'adbebdc33624d35f4dc23dd157163de5523287f5', class: `collapse_button ${this.state}` }, h("gb-collapse-button", { key: 'a79350363685674800d78f63f35cec443f53b20d', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '63d703845ad267f7b629bb526daf29b8e31b6d4c', class: "navigation" }, h("div", { key: 'e739f1f520a4e8254befac99b6a5fe143cb6fd84', class: "item" }, h("gb-simple-side-bar-item", { key: '53a82de2dad8c8d0917682cb1f8591f6b7040aa3', 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 }), h("gb-simple-side-bar-item", { key: '3d7dba749961b527c298f16f59cad0c4124f8960', 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 && (h("gb-simple-side-bar-item", { key: 'cd460c6cfa5e9a441722e12a285e97d155ef7380', 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 && (h("gb-simple-side-bar-item", { key: '6606100a540bc98915dc027e9398fdc6b2691ade', 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 && (h("gb-simple-side-bar-item", { key: 'df826ae14810d17ec3bc605c01b69730f4a7b438', 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 && (h("div", { key: '0775483000aae25d6bf5c35d7542958fdd91821c', class: "navigation" }, h("div", { key: 'fd1dd4ea324e4c0f92577549f459909ba5e60fd4', class: "item" }, this.sixthItemLabel && (h("gb-simple-side-bar-item", { key: '45ea2f8cab2613d0e8c03f1ea807cda0cb001f4f', 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 && (h("gb-simple-side-bar-item", { key: 'bec1a3d5732b87ac730d7a5fee79411edbbdf15e', 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 && (h("gb-simple-side-bar-item", { key: '01b38d0a03f3671f62bd75194ed8ee18604d5edc', 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 && (h("gb-simple-side-bar-item", { key: '23ada2f7ce876ea2575b7243ac97bad9c727a39e', 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 && (h("gb-simple-side-bar-item", { key: 'd77d4599da5c0b2748c94ad58d281bde5076bce5', 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' && (h("div", { key: 'fba5cc5029542df9709bd9f7a772b05cb3110c28', class: "application_name" }, h("div", { key: '167eaaae1469530b0bec87de7eba182cf245c5a8', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (h("div", { key: '4731812a9444112d37d2de592a8c51a1d747d52b', class: "application_name_pattern" }, h("img", { key: '8ca6cab53b91dd4b3c97cc0dba28672c721a485f', src: patternSrc, alt: "" }))), this.hasInfo ? (h(Fragment, null, h("div", { class: "information_header" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `help_icon ${this.category}` }, h("path", { opacity: "0.4", d: "M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z", fill: "var(--color-text-brandDarkBlue, #212C65)" }), h("path", { d: "M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z", fill: "var(--color-text-brandDarkBlue, #212C65)" })), h("p", { class: `need_help ${this.category} text-lg-bold` }, "Need help?")), h("p", { class: `info ${this.category} text-sm-medium` }, this.email), h("p", { class: `info ${this.category} text-sm-medium` }, this.phoneNumber))) : (h(Fragment, null, h("div", { class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), h("span", { class: textClass }, h("slot", { name: "application_name" }))))))))), this.type === 'complex' && (h("div", { key: '79bdfdabbfef3de5e79f881c420bf0efe67e883a', class: `sidebar_and_nav ${this.state}` }, h("div", { key: '2d8bddf89d7391e9c6dd1660607bd293c5c1d66d', class: "nav_div" }, h("div", { key: 'd1f23f8780b92bac8592cea04735fa84565635b4', class: "logo_and_button" }, this.state === 'expanded' && h("img", { key: '255a6de54cecc06887b968e2b344ab65bf30690f', src: blueLogoSrc }), this.state === 'collapsed' && h("img", { key: 'f209db42872e8c6165cca5154d8e7bb4ef845970', src: logoSrc, alt: "" }), h("gb-collapse-button", { key: '0f76149a1cf34f64ac18c15b2bab9aabdaec34d9', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: 'e0cdbf3552ba1f5caea35ce625c20dbd40643938', class: "complex_sidebar_div" }, h("div", { key: '38ccc2b4869ff65a27240d2872a12dce451ea41a', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (h("div", { key: '12dfd13a7d9d42dcf83de5f78a8344f4e44bf232', class: "pattern" }, h("img", { key: '67ebcb8e6912f6117661727501c0a2ad171dd6c9', src: patternSrc, alt: "" }))), h("div", { key: '2dbc899b3a3dce4c9d73588192177552c367e692', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index) => (h("gb-complex-primary-side-bar-item", { key: `${index}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index) }))))), h("div", { key: '29f52a15beff5128cc94c7669ddf9f6e291433ef', class: `secondary_side_menu ${this.category} ${this.state}` }, h("div", { key: '17181fb3ae81987e34be9c32f3e2b4a098b1584c', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index) }))))))))));
|
|
1810
|
+
return (h(Fragment, null, this.type === 'simple' && (h("div", { key: '1c24e6e13972a1054c3cc219f1f8c96bc81f9c35', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (h("div", { key: 'f799f20aa69a4909734c9c2e3e04f1653e096174', class: "pattern" }, h("img", { key: '25653554a4ba40453794591f793d38d1ed2aa135', src: patternSrc, alt: "" }))), h("div", { key: '24b01c27b617a3746ec22f7c68271b82fd28abe7', class: "nav" }, h("div", { key: '8f0dc4ba2bd24745949d6db20ad764b74c0abebf', class: `sidebar_header ${this.state}` }, h("div", { key: '362010ece8d27ad8d1ab6228b3d20bccdec1abd6', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && (h(Fragment, null, this.category === 'plain_background' && this.isDarkTheme ? (h("img", { src: whiteLogoSrc })) : this.category === 'plain_background' && !this.isDarkTheme ? (h("img", { src: blueLogoSrc })) : (h("img", { src: whiteLogoSrc })))), this.state === 'collapsed' && h("img", { key: 'a0e6e92d7762dd64ba3c7f480c1b1ca8b0987863', src: logoSrc, alt: "" })), h("div", { key: 'd97dc8fb190dbe33cbc3e9606029bb8071270985', class: `collapse_button ${this.state}` }, h("gb-collapse-button", { key: 'c75dec3f2a943f9f803d424665ab01d257b085e6', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '5407c54642e7d7d0ba263f8a24181fc3770aaba3', class: "navigation" }, h("div", { key: 'a8497c48ea82dd1c2f62b0f3ef84d8b2dc3d6db4', class: "item" }, h("gb-simple-side-bar-item", { key: 'b0ee676cf922dccdd8a0955d4ef19f337ec8a49c', 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 }), h("gb-simple-side-bar-item", { key: '84abd00b2fbce90c69aff4dc85c37bd7af195dc4', 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 && (h("gb-simple-side-bar-item", { key: '577b94e9320f7246692b3505587902a8b97c8f7b', 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 && (h("gb-simple-side-bar-item", { key: '8f162dd10beac4810388bac56e327df2cedae626', 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 && (h("gb-simple-side-bar-item", { key: '2d96b63b7a7936c0dc3c3e42be15e2f3a8c9f9fc', 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 && (h("div", { key: 'e662c2d8f5bb9d7c5d7ea572b0597ec75afb3d54', class: "navigation" }, h("div", { key: 'ca283f32d16b44e59299aa79a5690a9884bdaa0f', class: "item" }, this.sixthItemLabel && (h("gb-simple-side-bar-item", { key: '24a0a761580e45a6073e1d38a55db3e105991d93', 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 && (h("gb-simple-side-bar-item", { key: 'cdfebd44a8f01e85f228830d78dbebcbe5c4f84c', 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 && (h("gb-simple-side-bar-item", { key: '56a6cfac44fdd83a4415e66437032cfe29f84c44', 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 && (h("gb-simple-side-bar-item", { key: 'a3a9eea18e571fe099c626511cff0dc1aaf32028', 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 && (h("gb-simple-side-bar-item", { key: '2075731212fe1879bfa0614b7d27d0b15878a58c', 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' && (h("div", { key: 'c14c0b2f5abe557d2385771e75d7db9a6d3ccc46', class: "application_name" }, h("div", { key: 'fa0e032e97cd08fc18e7078dd4426410ef557873', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (h("div", { key: 'd3c5f239ef52e7b30e6840566feaa76dea5902c1', class: "application_name_pattern" }, h("img", { key: 'e44b6da6185b63e16baac6c91dce13e038628a33', src: patternSrc, alt: "" }))), this.hasInfo ? (h(Fragment, null, h("div", { class: "information_header" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `help_icon ${this.category}` }, h("path", { opacity: "0.4", d: "M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z", fill: "var(--color-text-brandDarkBlue, #212C65)" }), h("path", { d: "M11.2422 17C11.2422 17.5523 11.6899 18 12.2422 18C12.7945 18 13.2422 17.5523 13.2422 17H11.2422ZM11.2422 10C10.6899 10 10.2422 10.4477 10.2422 11C10.2422 11.5523 10.6899 12 11.2422 12V10ZM12.0957 11.1464L12.8028 10.4393L12.0957 11.1464ZM11.992 7C11.4397 7 10.992 7.44772 10.992 8C10.992 8.55228 11.4397 9 11.992 9V7ZM12.001 9C12.5533 9 13.001 8.55228 13.001 8C13.001 7.44772 12.5533 7 12.001 7V9ZM23 12C23 5.92487 18.0751 1 12 1V3C16.9706 3 21 7.02944 21 12H23ZM12 1C5.92487 1 1 5.92487 1 12H3C3 7.02944 7.02944 3 12 3V1ZM1 12C1 18.0751 5.92487 23 12 23V21C7.02944 21 3 16.9706 3 12H1ZM12 23C18.0751 23 23 18.0751 23 12H21C21 16.9706 16.9706 21 12 21V23ZM11.2422 12V17H13.2422V12H11.2422ZM11.2422 12C11.3638 12 11.4531 12.0001 11.5286 12.002C11.6046 12.0039 11.6417 12.0072 11.6576 12.0094C11.6729 12.0114 11.6408 12.009 11.5864 11.9866C11.524 11.9609 11.4526 11.9176 11.3886 11.8536L12.8028 10.4393C12.5129 10.1493 12.1711 10.0604 11.9241 10.0272C11.7058 9.99788 11.4496 10 11.2422 10V12ZM13.2422 12C13.2422 11.7926 13.2443 11.5364 13.215 11.3181C13.1818 11.0711 13.0928 10.7293 12.8028 10.4393L11.3886 11.8536C11.3246 11.7896 11.2813 11.7181 11.2556 11.6558C11.2332 11.6014 11.2307 11.5693 11.2328 11.5846C11.2349 11.6005 11.2383 11.6376 11.2402 11.7136C11.2421 11.789 11.2422 11.8784 11.2422 12H13.2422ZM11.992 9H12.001V7H11.992V9Z", fill: "var(--color-text-brandDarkBlue, #212C65)" })), h("p", { class: `need_help ${this.category} text-lg-bold` }, "Need help?")), h("p", { class: `info ${this.category} text-sm-medium` }, this.email), h("p", { class: `info ${this.category} text-sm-medium` }, this.phoneNumber))) : (h(Fragment, null, h("div", { class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), h("span", { class: textClass }, h("slot", { name: "application_name" }))))))))), this.type === 'complex' && (h("div", { key: '6cd2295b46326bfa9d4a19337ac29e4925191750', class: `sidebar_and_nav ${this.state}` }, h("div", { key: 'cdd758acbbbfc1d6c7ff5dacdb5cc5f85d6dc976', class: "nav_div" }, h("div", { key: 'f6fec7a98379454b776435e579b9ad3b9f076ac6', class: "logo_and_button" }, this.state === 'expanded' && h("img", { key: 'bbaca7c5d48e9eb7974b8bd1f443ab7bd02c9272', src: blueLogoSrc }), this.state === 'collapsed' && h("img", { key: '42c7fd23b383bf196508f2bd83f76f81e30d6d4f', src: logoSrc, alt: "" }), h("gb-collapse-button", { key: '245c965048251d5fce6d66327625c10e5ff45ade', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), h("div", { key: '1cb42f7105862b42364d2e26815422bce304dd9b', class: "complex_sidebar_div" }, h("div", { key: '26a1d8099221f59d6af0665885445454187ee571', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (h("div", { key: '62d28d0348b6c804f25d054c2bf849f5756ce964', class: "pattern" }, h("img", { key: '5d58a8e1f2b4113fac0c4cb5520650d582a4c0b6', src: patternSrc, alt: "" }))), h("div", { key: 'c577b53a7f0b7396ee0b9d517712c66809560c4a', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index) => (h("gb-complex-primary-side-bar-item", { key: `${index}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index) }))))), h("div", { key: 'aafa6d9787cf37cd0b42db34d832264b95ae4ef2', class: `secondary_side_menu ${this.category} ${this.state}` }, h("div", { key: 'f27bd9f86c130ee9bd38b54c49bdf7597490ce3d', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index) => (h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index) }))))))))));
|
|
1809
1811
|
}
|
|
1810
1812
|
get el() { return getElement(this); }
|
|
1813
|
+
static get watchers() { return {
|
|
1814
|
+
"theme": ["changeTheme"]
|
|
1815
|
+
}; }
|
|
1811
1816
|
};
|
|
1812
1817
|
GbSidebar.style = gbSidebarCss;
|
|
1813
1818
|
|