globuswebcomponents 2.4.8 → 2.5.0

package/dist/globuscomponents/p-f9532e39.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["gbSidebarCss","GbSidebar","constructor","hostRef","this","state","showSecondCategory","iconInstance","firstItemIcon","secondItemIcon","thirdItemIcon","fourthItemIcon","fifthItemIcon","sixthItemIcon","seventhItemIcon","eighthItemIcon","ninthItemIcon","tenthItemIcon","firstItemLabel","secondItemLabel","thirdItemLabel","fourthItemLabel","fifthItemLabel","sixthItemLabel","seventhItemLabel","eighthItemLabel","ninthItemLabel","tenthItemLabel","complexSidebarData","Recruitment","icon","items","label","Staff","activePrimaryItem","activeSecondaryItem","hasInfo","email","phoneNumber","theme","isDarkTheme","leadingIconSvg","loadIcon","iconName","iconPath","getAssetPath","response","fetch","svg","text","collapseSideBar","sidebarState","emit","expandSideBar","sideBarItemClicked","index","activeIndex","simpleSidebarItemClicked","handlePrimaryClick","item","_index","handleSecondaryClick","componentDidLoad","applicationName","el","querySelector","classList","add","changeTheme","window","matchMedia","matches","componentWillLoad","render","textClass","category","patternSrc","logoSrc","blueLogoSrc","whiteLogoSrc","h","Fragment","type","key","class","src","alt","color","action","onClick","xmlns","width","height","viewBox","fill","opacity","d","innerHTML","name","navItemStyle","Object","keys","map","primaryItem","secondaryItem"],"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  changeTheme() {\r\n    if (this.theme === 'system') {\r\n      if(window.matchMedia('(prefers-color-scheme: dark)').matches) {\r\n        this.isDarkTheme = true;\r\n      } else {\r\n        this.isDarkTheme = false;\r\n      }\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    this.changeTheme();\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"],"mappings":"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","ignoreList":[]}

package/dist/globuscomponents/p-fa99bc25.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as s,a,h as i,F as t,g as c}from"./p-Dlqa7tPI.js";import{S as n}from"./p-cHn6O-Kf.js";const o=".header_div{display:flex;flex-direction:column;align-items:center;width:100%;border-bottom:0.7px solid var(--color-border-subtle, #CDD5DF);background:var(--color-surface, #FFFFFF)}.content{display:flex;height:4.5rem;padding:0rem 2rem;justify-content:space-between;align-items:center;align-self:stretch}.logo{display:block}.icon_logo{display:none}.inner_content{display:flex;justify-content:flex-end;align-items:center;gap:var(--spacing-4);flex:1 0 0}.action{display:flex;gap:var(--spacing-2)}@media (max-width: 440px){.content{padding:var(--spacing-none) var(--spacing-5)}}@media (max-width: 450px){.logo{display:none}.icon_logo{display:block}}";const l=class{constructor(a){e(this,a);this.navBarItemClicked=s(this,"navBarItemClicked");this.menuClicked=s(this,"menuClicked");this.showIndicator=false;this.text=false;this.placeholder=false;this.showBorder=false;this.showNotification=false;this.showHelp=false;this.showLogo=false}applyColorToInitials(){switch(this.color){case"gray":return"gray";case"blue":return"blue";case"cyan":return"cyan";case"pink":return"pink";case"purple":return"purple";case"green":return"green";case"yellow":return"yellow"}}componentDidLoad(){const e=this.el.querySelector("[slot='initials']");if(e){e.classList.add("text-md-semi-bold");e.classList.add(this.applyColorToInitials())}}async onNavBarItemClicked(e){this.navBarItemClicked.emit(e)}async onMenuClicked(){this.menuClicked.emit()}render(){const e=a(`assets/help-circle.svg`);const s=a(`assets/notification-03.svg`);const c=a(`assets/globus_bank_logo_blue.svg`);const o=a(`assets/globus_bank_logo_white.svg`);return i("div",{key:"cc8e5f7e68a676ea97a9659c5679a59b4b2fc2e9",class:`header_div`},i("div",{key:"db288392549fdef6ff04278936d46f821f1d44c0",class:"content"},this.showLogo&&i(t,null,i("div",{key:"58bf6ac3e0bd991d052aa5520f76ff022265b1dd",class:"logo",onClick:()=>this.onNavBarItemClicked("logo")},i("img",{key:"662a3942e0970fe04b6479a27b0e63d2fc4da329",src:c,alt:""})),i("div",{key:"abadbd301df3616feb36acfce868ee2d6e662689",class:"icon_logo",onClick:()=>this.onNavBarItemClicked("logo")},i("img",{key:"98b105031e16ba5a35a8aeed7435a54c2e81db1a",src:o,alt:""}))),i("div",{key:"8cf93252dbc5e77e6f87ee73f1a8aa28bf51c0d5",class:"inner_content"},i("div",{key:"16bc1d7575890c3ef8ce65c550b0c53e754469d6",class:`action`},this.showHelp&&i("gb-header-icon",{key:"37bdeb6bfdb750237f89d2c8ff53b60e64db7842",state:n.Default,icon:e,onClick:()=>this.onNavBarItemClicked("help")}),this.showNotification&&i("gb-header-icon",{key:"b6011ed11ab5e6b3f9b7d0f0564341917adc62b0",state:this.state,icon:s,"show-indicator":this.showIndicator,onClick:()=>this.onNavBarItemClicked("notification")})),i("gb-avatar",{key:"d66884897aed7f6789137d1c09fc2ed112f9c772",size:"md",text:this.text,placeholder:this.placeholder,color:this.color,"show-border":this.showBorder,onClick:()=>this.onNavBarItemClicked("avatar")},this.text?i("slot",{slot:"initials",name:"initials"}):i("slot",{name:"image",slot:"image"})))))}get el(){return c(this)}};l.style=o;export{l as gb_header};
-//# sourceMappingURL=p-fa99bc25.entry.js.map

package/dist/globuscomponents/p-fa99bc25.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["gbHeaderCss","GbHeader","constructor","hostRef","this","showIndicator","text","placeholder","showBorder","showNotification","showHelp","showLogo","applyColorToInitials","color","componentDidLoad","initials","el","querySelector","classList","add","onNavBarItemClicked","item","navBarItemClicked","emit","onMenuClicked","menuClicked","render","helpIconSrc","getAssetPath","notificationIconSrc","logo","iconLogo","h","key","class","Fragment","onClick","src","alt","state","StateEnum","Default","icon","size","slot","name"],"sources":["src/components/gb-header/gb-header.css?tag=gb-header&encapsulation=shadow","src/components/gb-header/gb-header.tsx"],"sourcesContent":[".header_div{\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center; \r\n    width: 100%;\r\n    border-bottom: 0.7px solid var(--color-border-subtle, #CDD5DF);\r\n    background: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.content{\r\n    display: flex;\r\n    height: 4.5rem;\r\n    padding: 0rem 2rem;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    align-self: stretch;\r\n}\r\n\r\n.logo{\r\n    display: block;\r\n}\r\n\r\n.icon_logo{\r\n    display: none;\r\n}\r\n\r\n.inner_content{\r\n    display: flex;\r\n    justify-content: flex-end;\r\n    align-items: center;\r\n    gap: var(--spacing-4);\r\n    flex: 1 0 0;\r\n}\r\n\r\n.action{\r\n    display: flex;\r\n    gap: var(--spacing-2);\r\n}\r\n\r\n@media (max-width: 440px) {\r\n    .content{\r\n        padding: var(--spacing-none) var(--spacing-5);\r\n    }\r\n}\r\n\r\n@media (max-width: 450px) {\r\n    .logo{\r\n        display: none;\r\n    }\r\n\r\n    .icon_logo{\r\n        display: block;\r\n    }\r\n}","import { Component, Element, Event, EventEmitter, getAssetPath, h, Method, Prop, Fragment } from \"@stencil/core\";\r\nimport { ColorTypes, StateEnum } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-header',\r\n  styleUrl: 'gb-header.css',\r\n  shadow: true,\r\n})\r\nexport class GbHeader {\r\n  @Prop() state: StateEnum;\r\n  @Prop() showIndicator: boolean = false;\r\n  @Prop() text: boolean = false;\r\n  @Prop() placeholder: boolean = false;\r\n  @Prop() color: ColorTypes;\r\n  @Prop() showBorder: boolean = false;\r\n  @Prop() showNotification: boolean = false;\r\n  @Prop() showHelp: boolean = false;\r\n  @Prop() showLogo: boolean = false;\r\n  @Element() el: HTMLElement;\r\n  @Event() navBarItemClicked: EventEmitter<string>;\r\n  @Event() menuClicked: EventEmitter<void>;\r\n\r\n  applyColorToInitials() {\r\n    switch (this.color) {\r\n      case 'gray':\r\n        return 'gray';\r\n      case 'blue':\r\n        return 'blue';\r\n      case 'cyan':\r\n        return 'cyan';\r\n      case 'pink':\r\n        return 'pink';\r\n      case 'purple':\r\n        return 'purple';\r\n      case 'green':\r\n        return 'green';\r\n      case 'yellow':\r\n        return 'yellow';\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const initials = this.el.querySelector(\"[slot='initials']\");\r\n\r\n    if (initials) {\r\n      initials.classList.add('text-md-semi-bold');\r\n      initials.classList.add(this.applyColorToInitials());\r\n    }\r\n  }\r\n\r\n  @Method()\r\n  async onNavBarItemClicked(item: string) {\r\n    // console.log('nav-bar-item clicked');\r\n    this.navBarItemClicked.emit(item);\r\n    // console.log(index);\r\n  }\r\n\r\n  async onMenuClicked() {\r\n    this.menuClicked.emit();\r\n  }\r\n\r\n  render() {\r\n    const helpIconSrc = getAssetPath(`assets/help-circle.svg`);\r\n    const notificationIconSrc = getAssetPath(`assets/notification-03.svg`);\r\n    const logo = getAssetPath(`assets/globus_bank_logo_blue.svg`);\r\n    const iconLogo = getAssetPath(`assets/globus_bank_logo_white.svg`);\r\n\r\n    return (\r\n      <div class={`header_div`}>\r\n        <div class=\"content\">\r\n          {this.showLogo && (\r\n            <>\r\n              <div class=\"logo\" onClick={() => this.onNavBarItemClicked('logo')}>\r\n                <img src={logo} alt=\"\" />\r\n              </div>\r\n              <div class=\"icon_logo\" onClick={() => this.onNavBarItemClicked('logo')}>\r\n                <img src={iconLogo} alt=\"\" />\r\n              </div>\r\n            </>\r\n          )}\r\n          <div class=\"inner_content\">\r\n            <div class={`action`}>\r\n              {this.showHelp && <gb-header-icon state={StateEnum.Default} icon={helpIconSrc} onClick={() => this.onNavBarItemClicked('help')}></gb-header-icon>}\r\n              {this.showNotification && (\r\n                <gb-header-icon\r\n                  state={this.state}\r\n                  icon={notificationIconSrc}\r\n                  show-indicator={this.showIndicator}\r\n                  onClick={() => this.onNavBarItemClicked('notification')}\r\n                ></gb-header-icon>\r\n              )}\r\n            </div>\r\n            <gb-avatar\r\n              size=\"md\"\r\n              text={this.text}\r\n              placeholder={this.placeholder}\r\n              color={this.color}\r\n              show-border={this.showBorder}\r\n              onClick={() => this.onNavBarItemClicked('avatar')}\r\n            >\r\n              {this.text ? <slot slot=\"initials\" name=\"initials\"></slot> : <slot name=\"image\" slot=\"image\"></slot>}\r\n            </gb-avatar>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}"],"mappings":"sGAAA,MAAMA,EAAc,uoB,MCQPC,EAAQ,MALrB,WAAAC,CAAAC,G,oGAOUC,KAAaC,cAAY,MACzBD,KAAIE,KAAY,MAChBF,KAAWG,YAAY,MAEvBH,KAAUI,WAAY,MACtBJ,KAAgBK,iBAAY,MAC5BL,KAAQM,SAAY,MACpBN,KAAQO,SAAY,KA0F7B,CArFC,oBAAAC,GACE,OAAQR,KAAKS,OACX,IAAK,OACH,MAAO,OACT,IAAK,OACH,MAAO,OACT,IAAK,OACH,MAAO,OACT,IAAK,OACH,MAAO,OACT,IAAK,SACH,MAAO,SACT,IAAK,QACH,MAAO,QACT,IAAK,SACH,MAAO,S,CAIb,gBAAAC,GACE,MAAMC,EAAWX,KAAKY,GAAGC,cAAc,qBAEvC,GAAIF,EAAU,CACZA,EAASG,UAAUC,IAAI,qBACvBJ,EAASG,UAAUC,IAAIf,KAAKQ,uB,EAKhC,yBAAMQ,CAAoBC,GAExBjB,KAAKkB,kBAAkBC,KAAKF,E,CAI9B,mBAAMG,GACJpB,KAAKqB,YAAYF,M,CAGnB,MAAAG,GACE,MAAMC,EAAcC,EAAa,0BACjC,MAAMC,EAAsBD,EAAa,8BACzC,MAAME,EAAOF,EAAa,oCAC1B,MAAMG,EAAWH,EAAa,qCAE9B,OACEI,EAAA,OAAAC,IAAA,2CAAKC,MAAO,cACVF,EAAK,OAAAC,IAAA,2CAAAC,MAAM,WACR9B,KAAKO,UACJqB,EAAAG,EAAA,KACEH,EAAA,OAAAC,IAAA,2CAAKC,MAAM,OAAOE,QAAS,IAAMhC,KAAKgB,oBAAoB,SACxDY,EAAK,OAAAC,IAAA,2CAAAI,IAAKP,EAAMQ,IAAI,MAEtBN,EAAA,OAAAC,IAAA,2CAAKC,MAAM,YAAYE,QAAS,IAAMhC,KAAKgB,oBAAoB,SAC7DY,EAAK,OAAAC,IAAA,2CAAAI,IAAKN,EAAUO,IAAI,OAI9BN,EAAK,OAAAC,IAAA,2CAAAC,MAAM,iBACTF,EAAK,OAAAC,IAAA,2CAAAC,MAAO,UACT9B,KAAKM,UAAYsB,EAAgB,kBAAAC,IAAA,2CAAAM,MAAOC,EAAUC,QAASC,KAAMf,EAAaS,QAAS,IAAMhC,KAAKgB,oBAAoB,UACtHhB,KAAKK,kBACJuB,EAAA,kBAAAC,IAAA,2CACEM,MAAOnC,KAAKmC,MACZG,KAAMb,EACU,iBAAAzB,KAAKC,cACrB+B,QAAS,IAAMhC,KAAKgB,oBAAoB,mBAI9CY,EAAA,aAAAC,IAAA,2CACEU,KAAK,KACLrC,KAAMF,KAAKE,KACXC,YAAaH,KAAKG,YAClBM,MAAOT,KAAKS,MAAK,cACJT,KAAKI,WAClB4B,QAAS,IAAMhC,KAAKgB,oBAAoB,WAEvChB,KAAKE,KAAO0B,EAAM,QAAAY,KAAK,WAAWC,KAAK,aAAqBb,EAAA,QAAMa,KAAK,QAAQD,KAAK,a","ignoreList":[]}

package/dist/globuscomponents/p-fbddd3e7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["gbTextareaInputFieldCss","GbTextareaInputField","constructor","hostRef","this","destructive","placeholderText","showLabel","label","showHintText","hintText","isReadOnly","value","results","content","inputValue","selectedStaff","paddingLeft","paddingTop","show","staffInfo","selectedItems","unselectedItems","minWidth","connectedCallback","type","document","addEventListener","handleClickOutside","inputElement","handleTagInput","bind","componentDidLoad","updateInputWidth","componentWillLoad","updateSelectedItems","disconnectedCallback","removeEventListener","handleInput","textarea","style","height","scrollHeight","textareaValueChanged","emit","event","target","trim","setTimeout","length","emitInputValue","handleTagRemove","index","slice","updateStyles","resultsDisplayElement","resultsWidth","offsetWidth","inputWidth","mockStaffSearch","query","mockData","filter","staff","objectName","toLowerCase","includes","selectStaff","hiddenSpan","input","el","shadowRoot","querySelector","calculatedWidth","Math","max","width","handleWrapperClick","focus","selectDropdownItem","item","isObject","isSelected","some","i","console","log","newValue","Array","isArray","objectValues","val","primitiveValues","JSON","stringify","isTagItemSelected","contains","render","h","key","class","ref","onInput","state","placeholder","onClick","Fragment","map","size","icon","action","split","slot","part","charAt","toUpperCase","join","id","idOfInput","readOnly","onBlur","xmlns","viewBox","fill","d","stroke","StateEnum","Default","selected","objectValue"],"sources":["src/components/gb-textarea-input-field/gb-textarea-input-field.css?tag=gb-textarea-input-field&encapsulation=shadow","src/components/gb-textarea-input-field/gb-textarea-input-field.tsx"],"sourcesContent":["@import '../../global/global.css';\r\n\r\n.textarea_container{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-2);\r\n}\r\n\r\n.input_with_label{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-2);\r\n}\r\n\r\n.textarea{\r\n    border: 1px solid var(--color-border-input, #CDD5DF);\r\n    border-radius: var(--rounded-sm);\r\n    padding: 0.75rem 0.875rem;\r\n    font-family: var(--font-family-body);\r\n    resize: none;\r\n    min-height: 7.5rem;\r\n    overflow: visible;\r\n    background: transparent;\r\n    color: var(--color-text);\r\n}\r\n\r\n.default_textarea:focus{\r\n    border-color: #075DB2;\r\n    outline: #075DB2;\r\n}\r\n\r\n.textarea::placeholder{\r\n    color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.results_display {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  position: relative;\r\n  gap: 0.5rem;\r\n  width: 100%;\r\n  background-color: var(--color-surface, #FFFFFF);\r\n}\r\n\r\n.results_display.disabled{\r\n  background: var(--color-background-disabled, #F6F8FA);\r\n}\r\n\r\n.textarea_tags{\r\n  --weight: fit-content;\r\n  /* flex-direction: row-reverse; */\r\n  display: flex;\r\n  flex-direction: column;\r\n  position: relative;\r\n}\r\n\r\n.textarea.tags{\r\n    display: flex;\r\n}\r\n\r\n.input_like,\r\n.results_display{\r\n    height: fit-content;\r\n}\r\n\r\n.input_like{\r\n    border: none;\r\n    font-family: var(--font-family-body);\r\n}\r\n\r\n.input_like:focus{\r\n    outline: none;\r\n}\r\n\r\n.input_like.disabled{\r\n  background: var(--color-background-disabled, #F6F8FA);\r\n}\r\n\r\n.hidden-span {\r\n  visibility: hidden;\r\n  position: absolute;\r\n  max-width: 100%;\r\n  white-space: pre;\r\n}\r\n\r\n/* State Styles */\r\n.textarea:focus-within{\r\n    border: 1.3px solid var(--color-border-selected, #075DB2);\r\n    outline-color: transparent;\r\n}\r\n\r\n.textarea.destructive{\r\n    border: 1px solid var(--color-border-danger, #B51726);\r\n}\r\n\r\n.textarea.disabled{\r\n    background: var(--color-background-gray-subtlest, #F6F8FA);\r\n    border: 1px solid var(--color-border-disabled, #E3E8EF);\r\n    cursor: not-allowed;\r\n    pointer-events: none;\r\n}\r\n\r\n.label {\r\n    color: var(--color-text, #4B5565);\r\n}\r\n\r\n.hint_text{\r\n    color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.hint_text.destructive{\r\n    color: var(--color-border-danger, #B51726);\r\n}\r\n\r\n.dropdown_menu{\r\n    display: flex;\r\n    min-width: 100%;\r\n    width: fit-content;\r\n    max-height: 15rem;\r\n    padding: var(--spacing-none);\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n    border-radius: var(--rounded-sm);\r\n    border: 1px solid var(--color-border-subtler, #E3E8EF);\r\n    background: var(--color-surface, #FFFFFF);\r\n    box-shadow: var(--shadow-sm);\r\n    position: absolute;\r\n    z-index: 99999;\r\n    gap: var(--spacing-none);\r\n    transition: 1s ease-in-out;\r\n    overflow-y: auto;\r\n    top: 105%;\r\n}","import { Component, Element, Prop, State, h, Fragment, Event, EventEmitter, Listen, Watch } from '@stencil/core';\r\nimport { StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-textarea-input-field',\r\n  styleUrl: 'gb-textarea-input-field.css',\r\n  shadow: true,\r\n})\r\nexport class GbTextareaInputField {\r\n  @Prop() type: 'default' | 'tags';\r\n  @Prop({ mutable: true }) state: 'default' | 'filled' | 'active' | 'disabled';\r\n  @Prop() destructive: boolean = false;\r\n  @Prop() placeholderText: string = '';\r\n  @Prop() showLabel: boolean = false;\r\n  @Prop() label: string = '';\r\n  @Prop() showHintText: boolean = false;\r\n  @Prop() hintText: string = '';\r\n  @Prop({ reflect: true }) idOfInput!: string;\r\n  @Prop({ reflect: true }) isReadOnly: boolean = false;\r\n  @Prop({ mutable: true }) value: any = [\r\n    // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n    // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n    // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n    // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n    // { objectName: 'Gideon Ogunkola', objectValue: 'gideon@example.com' },\r\n  ];\r\n  @Prop() icon: 'country' | 'avatar' | 'dot' | 'false';\r\n  @Prop({ mutable: true }) results: any[] = [\r\n    // { objectName: 'John Doe', objectValue: 'john.doe@example.com' },\r\n    // { objectName: 'Jane Smith', objectValue: 'jane.smith@example.com' },\r\n    // { objectName: 'Alice Johnson', objectValue: 'alice.johnson@example.com' },\r\n    // { objectName: 'Emmanuel Kadiri', objectValue: 'kadiri2047@gmail.com' },\r\n    // { objectName: 'Gideon Ogunkola', objectValue: 'gideon@example.com' },\r\n    // 10,\r\n    // 20,\r\n    // 30,\r\n    // 40,\r\n    // 50,\r\n  ];\r\n  @Element() el: HTMLElement;\r\n  @State() content: string = '';\r\n  @State() inputValue: string = '';\r\n  @State() selectedStaff: any[] = [];\r\n  @State() paddingLeft: string = '1rem';\r\n  @State() paddingTop: string = '0rem';\r\n  @State() show: boolean = false;\r\n  @State() staffInfo: any[] = [];\r\n  @State() selectedItems: any[] = [];\r\n  @State() unselectedItems: any[] = [];\r\n  @Event() textareaValueChanged: EventEmitter<any>;\r\n\r\n  private textarea!: HTMLTextAreaElement;\r\n  inputElement!: HTMLInputElement;\r\n  resultsDisplayElement!: HTMLDivElement;\r\n  private hiddenSpan: HTMLElement;\r\n  private minWidth: number = 10;\r\n\r\n  connectedCallback() {\r\n    if (this.type === 'tags') {\r\n      document.addEventListener('click', this.handleClickOutside);\r\n      this.inputElement.addEventListener('input', this.handleTagInput.bind(this));\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    this.updateInputWidth();\r\n  }\r\n  \r\n  componentWillLoad() {\r\n    this.updateSelectedItems(this.value);\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    this.inputElement.removeEventListener('input', this.handleTagInput.bind(this));\r\n  }\r\n\r\n  handleInput() {\r\n    this.textarea.style.height = 'auto'; // Reset height to calculate the new height\r\n    this.textarea.style.height = `${this.textarea.scrollHeight - 22}px`; // Set the height to the scrollHeight\r\n    this.textareaValueChanged.emit(this.textarea.value);\r\n  }\r\n\r\n  handleTagInput(event: Event) {\r\n    const target = event.target as HTMLInputElement;\r\n    this.inputValue = target.value; // Update the value\r\n    this.textareaValueChanged.emit(this.selectedItems);\r\n\r\n    if (this.inputValue.trim() === '') {\r\n      this.show = false;\r\n      // this.results = [];\r\n      return;\r\n    }\r\n\r\n    // Simulate API call\r\n    setTimeout(() => {\r\n      // this.results = this.mockStaffSearch(this.inputValue);\r\n      this.show = this.results.length > 0;\r\n    }, 1000);\r\n\r\n    this.updateInputWidth();\r\n  }\r\n\r\n  emitInputValue() {\r\n    this.textareaValueChanged.emit(this.selectedItems);\r\n  }\r\n\r\n  handleTagRemove(index: number) {\r\n    if (this.value.length > 0) {\r\n      this.value = [...this.value.slice(0, index), ...this.value.slice(index + 1)];\r\n      this.updateStyles();\r\n      this.emitInputValue();\r\n    } else {\r\n      this.selectedItems = [...this.selectedItems.slice(0, index), ...this.selectedItems.slice(index + 1)];\r\n      this.updateStyles();\r\n      this.emitInputValue();\r\n    }\r\n  }\r\n\r\n  updateStyles() {\r\n    setTimeout(() => {\r\n      if (this.resultsDisplayElement) {\r\n        const resultsWidth = this.resultsDisplayElement.offsetWidth;\r\n        const inputWidth = this.inputElement.offsetWidth;\r\n\r\n        this.paddingLeft = this.selectedItems.length === 0 ? '1rem' : `${resultsWidth + 10}px`;\r\n\r\n        this.paddingTop = this.selectedItems.length > 2 ? '1rem' : `${inputWidth + 10}px`;\r\n      }\r\n    });\r\n\r\n    if (this.destructive) {\r\n      this.destructive = false;\r\n    }\r\n    this.inputValue = '';\r\n  }\r\n\r\n  mockStaffSearch(query: string) {\r\n    const mockData = this.results;\r\n\r\n    return mockData.filter(staff => staff.objectName.toLowerCase().includes(query.toLowerCase()));\r\n  }\r\n\r\n  selectStaff(staff: any) {\r\n    this.selectedStaff = [...this.selectedStaff, staff];\r\n    this.inputValue = '';\r\n    this.staffInfo = [];\r\n    this.updateStyles();\r\n  }\r\n\r\n  updateInputWidth() {\r\n    if (this.hiddenSpan) {\r\n      const input = this.el.shadowRoot.querySelector('input') as HTMLInputElement;\r\n\r\n      // Update input width based on span's width or use minimum width\r\n      const calculatedWidth = Math.max(this.hiddenSpan.offsetWidth + 10, this.minWidth);\r\n      input.style.width = `${calculatedWidth}px`;\r\n    }\r\n  }\r\n\r\n  handleWrapperClick() {\r\n    this.inputElement.focus(); // Focus the input field\r\n  }\r\n\r\n  selectDropdownItem(item: any) {\r\n    if (this.value.length === 0) {\r\n      const isObject = typeof item === 'object';\r\n      const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n      if (isSelected) {\r\n        // Unselect item: Move it from selectedItems to unselectedItems\r\n        this.selectedItems = this.selectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n        if (!this.unselectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item))) {\r\n          this.unselectedItems = [...this.unselectedItems, item];\r\n        }\r\n        this.textareaValueChanged.emit(this.selectedItems);\r\n      } else {\r\n        // Select item: Move it from unselectedItems to selectedItems\r\n        this.selectedItems = [...this.selectedItems, item];\r\n        this.unselectedItems = this.unselectedItems.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n        this.textareaValueChanged.emit(this.selectedItems);\r\n      }\r\n    } else {\r\n      const isObject = typeof item === 'object';\r\n      const isSelected = this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n\r\n      if (isSelected) {\r\n        this.value = this.value.filter(i => (isObject ? i.objectName !== item.objectName : i !== item));\r\n        console.log(this.value);\r\n        this.textareaValueChanged.emit(this.value);\r\n      } else {\r\n        this.value = [...this.value, item]; // Add item to array\r\n        this.textareaValueChanged.emit(this.value);\r\n      }\r\n    }\r\n\r\n    this.updateStyles();\r\n  }\r\n\r\n  @Watch('value')\r\n  updateSelectedItems(newValue: any[]) {\r\n    if (Array.isArray(newValue) && newValue.length > 0) {\r\n      this.selectedItems = [];\r\n      this.unselectedItems = [];\r\n\r\n      const objectValues = newValue.filter(val => typeof val === 'object' && val !== null);\r\n      const primitiveValues = newValue.filter(val => typeof val !== 'object');\r\n\r\n      this.selectedItems = this.results.filter(item =>\r\n        typeof item === 'object' && item !== null\r\n          ? objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) // Avoid object reference issues\r\n          : primitiveValues.includes(item),\r\n      );\r\n\r\n      this.unselectedItems = this.results.filter(item =>\r\n        typeof item === 'object' && item !== null ? !objectValues.some(val => JSON.stringify(val) === JSON.stringify(item)) : !primitiveValues.includes(item),\r\n      );\r\n    } else {\r\n      this.selectedItems = [];\r\n      this.unselectedItems = [...this.results];\r\n    }\r\n  }\r\n\r\n  isTagItemSelected(item) {\r\n    // return this.selectedStaff.some(i => i.name === item.name);\r\n\r\n    const isObject = typeof item === 'object';\r\n    return this.selectedItems.some(i => (isObject ? i.objectName === item.objectName : i === item));\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClickOutside(event: MouseEvent) {\r\n    if (this.show && !this.el.contains(event.target as Node)) {\r\n      this.show = false;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"textarea_container\">\r\n        <div class=\"input_with_label\">\r\n          {this.showLabel && <p class={`label text-sm-medium`}>{this.label}</p>}\r\n          {this.type === 'default' && (\r\n            <textarea\r\n              ref={el => (this.textarea = el as HTMLTextAreaElement)}\r\n              onInput={() => this.handleInput()}\r\n              class={`textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`}\r\n              placeholder={this.placeholderText}\r\n              value={this.inputValue}\r\n            ></textarea>\r\n          )}\r\n          {this.type === 'tags' && (\r\n            <div class=\"textarea_tags\">\r\n              <div class={`textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`} onClick={() => this.handleWrapperClick()}>\r\n                <div class={`results_display ${this.state === 'disabled' ? 'disabled' : ''}`} ref={el => (this.resultsDisplayElement = el as HTMLDivElement)}>\r\n                  {this.value.length === 0 ? (\r\n                    <>\r\n                      {this.selectedItems.map((item, index) => (\r\n                        <>\r\n                          {typeof item === 'object' ? (\r\n                            <div class=\"added_tag\" key={index}>\r\n                              <gb-tag size=\"sm\" icon={this.icon ? this.icon : 'avatar'} action=\"X_close\" onClick={() => this.handleTagRemove(index)}>\r\n                                <p class=\"text-xs-medium\">{item.objectName.split(' ')[0]}</p>\r\n                                <h1 slot=\"initials\" class=\"text-xxs-semi-bold\">\r\n                                  {item.objectName\r\n                                    .split(' ')\r\n                                    .map(part => part.charAt(0).toUpperCase())\r\n                                    .join('')}\r\n                                </h1>\r\n                              </gb-tag>\r\n                            </div>\r\n                          ) : (\r\n                            <div class=\"added_tag\" key={index}>\r\n                              <gb-tag size=\"sm\" icon={this.icon ? this.icon : 'avatar'} action=\"X_close\" onClick={() => this.handleTagRemove(index)}>\r\n                                <p class=\"text-xs-medium\">{item}</p>\r\n                              </gb-tag>\r\n                            </div>\r\n                          )}\r\n                        </>\r\n                      ))}\r\n                    </>\r\n                  ) : (\r\n                    <>\r\n                      {this.value.map((val, index) => (\r\n                        <>\r\n                          {typeof val === 'object' ? (\r\n                            <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)} key={index}>\r\n                              <h1 class=\"text-xxs-semi-bold\" slot=\"initials\">\r\n                                {val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())}\r\n                              </h1>\r\n                              <p>{val.objectName.split(' ')[0]}</p>\r\n                            </gb-tag>\r\n                          ) : (\r\n                            <gb-tag size=\"sm\" action=\"X_close\" icon={this.icon ? this.icon : 'avatar'} onClick={() => this.handleTagRemove(index)} key={index}>\r\n                              <p>{val}</p>\r\n                            </gb-tag>\r\n                          )}\r\n                        </>\r\n                      ))}\r\n                    </>\r\n                  )}\r\n                  <span class=\"hidden-span\" ref={el => (this.hiddenSpan = el as HTMLElement)}>\r\n                    {this.inputValue || '  '}\r\n                  </span>\r\n                  <div class=\"input_field\">\r\n                    <input\r\n                      id={this.idOfInput}\r\n                      class={`input_like text-md-regular ${this.state}`}\r\n                      type=\"text\"\r\n                      // placeholder={this.placeholderText}\r\n                      value={this.inputValue}\r\n                      readOnly={this.isReadOnly}\r\n                      ref={el => (this.inputElement = el as HTMLInputElement)}\r\n                      onBlur={() => this.emitInputValue()}\r\n                    />\r\n                  </div>\r\n                </div>\r\n                {this.destructive && (\r\n                  <div class=\"help_icon\">\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n                      <path\r\n                        d=\"M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z\"\r\n                        stroke=\"#B51726\"\r\n                        stroke-width=\"1.33333\"\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                      />\r\n                    </svg>\r\n                  </div>\r\n                )}\r\n              </div>\r\n              {this.show && (\r\n                <div class={`dropdown_menu`}>\r\n                  {this.results.map(item => (\r\n                    <gb-input-dropdown-menu-item\r\n                      type=\"checkbox\"\r\n                      supporting-text={true}\r\n                      state={StateEnum.Default}\r\n                      onClick={() => this.selectDropdownItem(item)}\r\n                      selected={this.isTagItemSelected(item)}\r\n                    >\r\n                      {typeof item === 'object'\r\n                        ? [<p slot=\"name\">{item.objectName}</p>, <p slot=\"supporting_text\">{item.objectValue}</p>]\r\n                        : typeof item !== 'object' && <p slot=\"name\">{item}</p>}\r\n                    </gb-input-dropdown-menu-item>\r\n                  ))}\r\n                </div>\r\n              )}\r\n            </div>\r\n          )}\r\n        </div>\r\n        {this.showHintText && <p class={`hint_text text-sm-regular ${this.destructive ? 'destructive' : ''}`}>{this.hintText}</p>}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}

package/dist/types/components/gb-top-bar/gb-top-bar.d.ts

@@ -1,30 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-import { GeneralBackgroundCategories } from '../../models/reusableModels';
-export declare class GbTopBar {
-    category: GeneralBackgroundCategories;
-    firstTabIcon: string;
-    secondTabIcon: string;
-    thirdTabIcon: string;
-    fourthTabIcon: string;
-    fifthTabIcon: string;
-    sixthTabIcon: string;
-    seventhTabIcon: string;
-    firstTabLabel: string;
-    secondTabLabel: string;
-    thirdTabLabel: string;
-    fourthTabLabel: string;
-    fifthTabLabel: string;
-    sixthTabLabel: string;
-    seventhTabLabel: string;
-    firstTabIconOnly: boolean;
-    secondTabIconOnly: boolean;
-    thirdTabIconOnly: boolean;
-    fourthTabIconOnly: boolean;
-    fifthTabIconOnly: boolean;
-    sixthTabIconOnly: boolean;
-    seventhTabIconOnly: boolean;
-    activeIndex: number;
-    topBarItemClicked: EventEmitter<number>;
-    onTabItemClicked(index: number): void;
-    render(): any;
-}