@infineon/infineon-design-system-stencil 30.9.3--canary.1640.c246fbcdce3247ffada7a2fffa49d05593d4088f.0 → 30.9.3--canary.1678.5b4a7e71bc0aa2e3f495f00864e3c9507193dd72.0

package/dist/cjs/ifx-navbar.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"ifx-navbar.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/navigation/navbar/navbar.scss?tag=ifx-navbar&encapsulation=shadow","src/components/navigation/navbar/navbar.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  width: 100%;\n  display: block;\n}\n\n\n.navbar__wrapper {\n  font-family: var(--ifx-font-family);\n  height: 63px;\n  position: sticky;\n  //overflow: hidden;\n  z-index: 1030;\n  border-bottom: 1px solid #EEEDED;\n\n  &.fixed {\n    border-bottom: none;\n  }\n\n  // border-bottom: 1px solid #EEEDED; //when fixed is false\n}\n\n.navbar__main-container {\n  position: absolute;\n  top: 0;\n  width: 100%;\n  //overflow: hidden;\n  transition: all 1s;\n  z-index: 1020;\n\n  &.fixed {\n    position: fixed;\n\n    & .navbar__container {\n      border-bottom: 1px solid #EEEDED;\n    }\n  }\n\n  &.show {\n    height: 100vh;\n    bottom: 0;\n    background-color: tokens.$ifxColorOverlayDark;\n    transition: 1s;\n    z-index: 1;\n  }\n}\n\n.navbar__sidebar {\n  box-sizing: border-box;\n  position: fixed;\n  right: -100%;\n  top: 64px;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  // padding: 32px;\n  width: 375px;\n  height: calc(100vh - 64px);\n  background-color: tokens.$ifxColorBaseWhite;\n  transition: right 1s;\n  z-index: 1030;\n\n  &.show {\n    right: 0;\n    transition: right 1s;\n  }\n\n  & .navbar__sidebar-top-row { \n    display: flex;\n    padding: var(--borderRadius-none, 0px) var(--space-300, 24px) 30px var(--space-300, 24px);\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--space-200, 16px);\n    flex: 1 0 0;\n    align-self: stretch;\n\n    overflow-y: auto;\n\n    & .navbar__sidebar-top-row-wrapper { \n      display: flex;\n      padding-top: var(--space-200, 16px);\n      flex-direction: column;\n      align-items: flex-start;\n      align-self: stretch;\n      gap: 16px;\n\n      &.expand { \n        align-items: initial;\n      }\n\n      & .navbar__sidebar-top-row-item { \n        display: flex;\n        padding: var(--space-200, 0px) var(--space-50, 4px) var(--space-200, 0px) 0px;\n        align-items: center;\n        gap: var(--space-100, 8px);\n        align-self: stretch;\n        justify-content: space-between;\n\n        & .navbar__sidebar-top-row-item-icon-wrapper { \n          & ifx-icon { \n            vertical-align: middle;\n          }\n        }\n  \n  \n        &:hover { \n          cursor: pointer;\n        }\n  \n        & .navbar__sidebar-top-row-item-label { \n          color: var(--color-base-black, #1D1D1D);\n          font-family: \"Source Sans 3\";\n          font-size: 16px;\n          font-style: normal;\n          font-weight: 400;\n          line-height: 24px; \n        }\n  \n      }\n    }\n\n  }\n\n  & .navbar__sidebar-bottom-row { \n    //display: flex;\n    display: none;\n    padding: var(--space-150, 12px) var(--space-300, 24px) var(--space-150, 12px) var(--space-200, 16px);\n    flex-direction: column;\n    align-items: flex-start;\n    align-self: stretch;\n    background: var(--color-engineering-100, #F7F7F7);\n    border-top: 1px solid var(--color-engineering-200, #EEEDED);\n    gap: 10px;\n\n    max-height: 160px;\n    overflow-y: auto;\n\n    &.show { \n      display: flex;\n    }\n   \n\n    & .navbar__sidebar-bottom-row-item { \n      display: flex;\n      height: 40px;\n      padding-right: var(--space-50, 4px);\n      align-items: center;\n      gap: var(--space-100, 8px);\n      flex: 1 0 0;\n \n      & .navbar__sidebar-bottom-row-item-label {\n        color: var(--color-base-black, #1D1D1D);\n        font-family: \"Source Sans 3\";\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 24px; \n      }\n\n      & .navbar__sidebar-bottom-row-item-icon-wrapper { \n       display: flex;\n       align-items: center;\n      }\n    }\n\n  }\n\n\n  & .navbar__sidebar-content-products,\n  & .navbar__sidebar-content-main {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    padding: 0px;\n    gap: 24px;\n    flex: none;\n    order: 0;\n    align-self: stretch;\n    flex-grow: 0;\n\n    & .navbar__sidebar-content-products-header,\n    & .navbar__sidebar-content-about-header {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 0;\n      align-self: stretch;\n      flex-grow: 0;\n      color: #BFBBBB;\n\n      & span {\n        color: tokens.$ifxColorBaseBlack;\n        font-weight: 600;\n        font-size: 18px;\n        line-height: 28px;\n        display: flex;\n        align-items: center;\n      }\n    }\n\n    & .navbar__sidebar-content-products-menu,\n    & .navbar__sidebar-content-main-menu {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n      width: 100%;\n\n      & .navbar__sidebar-content-products-menu-item,\n      & .navbar__sidebar-content-main-menu-item {\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        padding: 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & a {\n          text-decoration: none;\n          font-style: normal;\n          font-weight: 400;\n          font-size: 16px;\n          line-height: 24px;\n          display: flex;\n          align-items: center;\n          color: tokens.$ifxColorBaseBlack;\n        }\n      }\n\n      & .navbar__sidebar-content-main-menu-item {\n        color: tokens.$ifxColorEngineering300;\n\n        & a {\n          font-style: normal;\n          font-weight: 600;\n          font-size: 18px;\n          line-height: 28px;\n          display: flex;\n          align-items: center;\n          color: tokens.$ifxColorBaseBlack;\n          flex: none;\n          order: 0;\n          flex-grow: 1;\n        }\n      }\n    }\n\n    & .navbar__sidebar-content-main-menu {\n      align-items: normal;\n    }\n  }\n}\n\n.navbar__container {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 8px 40px;\n  gap: 16px;\n  background-color: tokens.$ifxColorBaseWhite;\n  font-family: var(--ifx-font-family);\n\n  &.expanded { \n    justify-content: initial;\n  }\n\n  // &.fixed { \n  //   border-bottom: 1px solid #EEEDED; //when fixed is true\n  // }\n\n  & .navbar__container-search-field-wrapper { \n    display: none;\n\n    &.show { \n      display: flex;\n    }\n  }\n\n  & .navbar__container-left {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0;\n    gap: 16px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n    &.hide {\n      display: none;\n    }\n\n    &.expand { \n      justify-content: initial;\n      flex: 1;\n        & .navbar__container-left-content { \n          align-items: initial;\n          flex: 1;\n          & .navbar__container-left-content-navigation-group { \n            justify-content: initial;\n            flex: 1;\n            & .navbar__container-left-content-navigation-item-search-bar { \n              flex: 1;\n            }\n          }\n        }\n      \n    }\n\n    & .navbar__container-left-logo {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 0;\n      flex-grow: 0;\n\n      &.hide { \n        display: none;\n      }\n\n      & h6 {\n        position: relative;\n        margin: 0;\n        padding: 0;\n        font-style: normal;\n        font-weight: 600;\n        font-size: 16px;\n        //line-height: 24px;\n        display: flex;\n        align-items: center;\n        color: tokens.$ifxColorBaseBlack;\n        flex: none;\n        order: 1;\n        flex-grow: 0;\n      }\n\n      & .navbar__container-left-logo-default {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        padding: 12px 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & svg {\n          width: 91px;\n          height: 40px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n          vertical-align: bottom;\n        }\n      }\n\n      & .navbar__container-left-logo-divider {\n        width: 1px;\n        height: 32px;\n        background: tokens.$ifxColorEngineering200;\n        flex: none;\n        order: 2;\n        flex-grow: 0;\n      }\n    }\n\n    & .navbar__container-left-content {\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      align-items: flex-start;\n      padding: 0px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n\n      & .navbar__container-left-content-navigation-group {\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        padding: 0px;\n        gap: 4px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & .navbar__container-left-content-navigation-item-search-bar {\n          display: flex; //none\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          flex: none;\n          order: 5;\n          flex-grow: 0;\n          //width: 256px;\n          //height: 40px;\n        }\n\n        & .navbar__container-left-content-navigation-item {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          gap: 8px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n\n          & a {\n            display: flex;\n            align-items: center;\n            font-weight: 400;\n            font-size: 16px;\n            line-height: 24px;\n            color: tokens.$ifxColorBaseBlack;\n            text-decoration: none;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n          }\n        }\n      }\n    }\n  }\n\n  & .navbar__container-right {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-end;\n    padding: 0;\n    gap: 8px;\n    flex: none;\n    order: 1;\n    flex-grow: 0;\n\n    &.hide { \n      display: none;\n    }\n\n    &.expand { \n      justify-content: initial;\n      flex: 1;\n        & .navbar__container-right-content { \n          align-items: initial;\n          flex: 1;\n          & .navbar__container-right-content-navigation-group { \n            justify-content: initial;\n            flex: 1;\n            & .navbar__container-right-content-navigation-item-search-bar { \n              flex: 1;\n              & .navbar__container-right-content-navigation-item-search-bar-icon-wrapper { \n                flex: 1;\n              }\n            }\n          }\n        }\n      \n    }\n\n    & .navbar__burger-icon-wrapper {\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      align-items: center;\n      padding: 4px 0px 4px 16px;\n      border-left: 1px solid tokens.$ifxColorEngineering300;\n      gap: 16px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n      width: 41px;\n      height: 40px;\n\n      &.hide { \n        display: none;\n      }\n\n      & .navbar__burger-icon {\n        display: flex;\n        align-items: center;\n\n        &:hover { \n          cursor: pointer;\n        }\n\n        &.close {\n          display: none;\n        }\n      }\n\n      & .navbar__cross-icon {\n        display: none;\n        align-items: center;\n\n        &.show {\n          display: flex;\n\n          &:hover { \n            cursor: pointer;\n          }\n        }\n      }\n    }\n\n    & .navbar__container-right-content {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      padding: 0px;\n      flex: none;\n      order: 0;\n      flex-grow: 0;\n\n      & .navbar__container-right-content-navigation-group {\n        position: relative;\n        display: flex;\n        flex-direction: row;\n        justify-content: flex-end;\n        align-items: center;\n        padding: 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & .navbar__container-right-content-navigation-item,\n        & .navbar__container-right-content-navigation-item-profile,\n        & .navbar__container-right-content-navigation-item-search-bar {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          gap: 4px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n\n          & .navbar__container-right-content-navigation-item-search-bar-icon-wrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: center;\n            align-items: center;\n            padding: 0px;\n            gap: 8px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n            //width: 24px;\n            //height: 24px;\n            //max-width: 200px;\n\n            &.isOpen { \n              position: absolute;\n              top: 10px;\n            }\n          }\n\n          & .navbar__container-right-content-navigation-item-navigation-profile {\n            position: relative;\n            width: 24px;\n            height: 24px;\n            background: tokens.$ifxColorOcean500;\n            border-radius: 100px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n\n            & a {\n              position: absolute;\n              width: 22px;\n              height: 20px;\n              left: calc(50% - 22px/2);\n              top: calc(50% - 20px/2);\n              font-style: normal;\n              font-weight: 600;\n              font-size: 14px;\n              line-height: 20px;\n              text-decoration: none;\n              display: flex;\n              align-items: center;\n              justify-content: center;\n              text-align: center;\n              color: tokens.$ifxColorBaseWhite;\n            }\n          }\n\n          & .navbar__container-right-content-navigation-item-icon-wrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: center;\n            align-items: center;\n            padding: 0px;\n            gap: 8px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n          }\n\n          & a {\n            font-style: normal;\n            font-weight: 400;\n            font-size: 14px;\n            line-height: 20px;\n            color: tokens.$ifxColorBaseBlack;\n            text-decoration: none;\n            display: flex;\n            align-items: center;\n            flex: none;\n            order: 1;\n            flex-grow: 0;\n          }\n        }\n      }\n    }\n  }\n}\n\n//burger icon exist, and left container is gone\n@media screen and (max-width: 800px) {\n  .navbar__container {\n    padding: 0px 16px;\n    height: 64px;\n    gap: initial;\n\n    &.expanded { \n      & .navbar__container-right {\n        & .navbar__burger-icon-wrapper {\n          display: none;\n        }\n      }\n    }\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        display: none;\n      }\n\n      & .navbar__container-left-logo {\n        & .navbar__container-left-logo-divider {\n          display: none;\n        }\n      }\n    }\n\n    & .navbar__container-right {\n      flex: 1;\n    }\n  }\n\n  .navbar__sidebar {\n    width: 0;\n    transition: 1s;\n\n    // &.show {\n    //   width: 100%;\n    // }\n\n  }\n}\n\n@media screen and (max-width: 500px) {\n  .navbar__sidebar {\n    &.show {\n      width: 100%;  // 100% of viewport width\n    }\n  }\n}\n\n@media screen and (min-width: 500px) {\n  .navbar__sidebar {\n    &.show {\n      width: 50%;  // 100% of viewport width\n    }\n  }\n}\n\n//burger icon disappears\n@media screen and (min-width: 800px) {\n  .navbar__wrapper {\n    height: 63px;\n  }\n\n  .navbar__container {\n    padding: 0px 16px;\n    height: 63px;\n    gap: initial;\n\n    & .navbar__container-right {\n      & .navbar__burger-icon-wrapper {\n        display: none;\n      }\n    }\n  }\n\n  .navbar__main-container {\n    &.show {\n      height: auto;\n      background-color: inherit;\n      transition: none;\n    }\n  }\n\n  .navbar__sidebar {\n    width: 0;\n    transition: 1s;\n    &.show { \n      right: -100%;\n    }\n  }\n\n}\n\n//left container appears\n@media screen and (min-width: 1024px) {\n  .navbar__wrapper {\n    height: 72px;\n  }\n\n  .navbar__container {\n    padding: 0px 24px;\n    height: 72px;\n\n    & .navbar__container-left {\n      gap: 12px;\n      display: flex;\n\n      & .navbar__container-left-content {\n        display: flex;\n      }\n\n      & .navbar__container-left-logo-default {\n        & svg {\n          width: 72.8px;\n          height: 32px;\n        }\n      }\n    }\n  }\n\n  .navbar__main-container {\n    &.show {\n      height: auto;\n      background-color: inherit;\n      transition: none;\n    }\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .navbar__wrapper {\n    height: 80px\n  }\n\n  .navbar__container {\n    padding: 0px 32px;\n    height: 80px;\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        justify-content: inherit;\n      }\n    }\n\n    & .navbar__container-right {\n      & .navbar__container-right-content {\n        justify-content: inherit;\n      }\n    }\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .navbar__wrapper {\n    height: 80px;\n  }\n\n  .navbar__container {\n    padding: 0px 40px;\n    height: 80px;\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        justify-content: center;\n      }\n    }\n\n    & .navbar__container-right {\n      & .navbar__container-right-content {\n        justify-content: inherit;\n      }\n    }\n  }\n}","import { Component, h, Element, State, Prop, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-navbar',\n  styleUrl: 'navbar.scss',\n  shadow: true,\n})\n\nexport class Navbar {\n  @Element() el;\n  @State() main: boolean = true\n  @State() products: boolean = false\n  @State() applications: boolean = false\n  @State() design: boolean = false\n  @State() support: boolean = false\n  @State() about: boolean = false\n  @Prop() applicationName: string = \"\"\n  @State() hasLeftMenuItems: boolean = true;\n  @Prop() fixed: boolean = true;\n  @Prop() showLogoAndAppname: boolean = true;\n  @State() searchBarIsOpen: string;\n  @Prop() logoHref: string = \"\";\n  @State() internalLogoHref: string = \"\"\n  @Prop() logoHrefTarget: string = '_self';\n  @State() internalLogoHrefTarget: string = '_self';\n  @Event() ifxNavbarMobileMenuIsOpen: EventEmitter;\n\n  private addEventListenersToHandleCustomFocusState() {\n    const element = this.el.shadowRoot.firstChild;\n\n    if (!element) {\n      console.error('element not found');\n      return;\n    }\n    element.tabIndex = -1;\n\n    // Select all a elements in the navbar and set their tabIndex to -1 to make them non-focusable\n    const aElements = element.querySelectorAll('a');\n    for (let i = 0; i < aElements.length; i++) {\n      aElements[i].tabIndex = -1;\n    }\n\n    const slot = element.querySelector('slot');\n    if (slot) {\n      const assignedNodes = slot.assignedNodes();\n      for (let i = 0; i < assignedNodes.length; i++) {\n        const node = assignedNodes[i] as HTMLElement;\n        if (node.nodeName === 'IFX-NAVBAR-ITEM') {\n          const navbarItem = node as HTMLIfxNavbarItemElement;\n\n          // Get all navigation items\n          const aElements = navbarItem?.shadowRoot.querySelectorAll('a');\n          for (let i = 0; i < aElements.length; i++) {\n            aElements[i].tabIndex = -1;\n          }\n        }\n      }\n    }\n  }\n\n  @Listen('ifxNavItem') \n  clearFirstLayerMenu(event: CustomEvent) { \n    if(event.detail.action === 'hideFirstLayer') { \n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].hideComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'hideSecondLayer') { \n      const parent = event.detail.parent;\n      const children = parent.children;\n      parent.toggleFirstLayerItem('remove', 'add')\n      for(let i = 0; i < children.length; i++) { \n        if(!children[i].isSameNode(event.detail.component)) {\n          children[i].hideComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'returnToSecondLayer') { \n      const parent = event.detail.parent;\n      const children = parent.children;\n      parent.toggleFirstLayerItem('add', 'remove')\n      for(let i = 0; i < children.length; i++) { \n        if(!children[i].isSameNode(event.detail.component)) {\n          children[i].showComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'show') { \n      const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].showComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'return') { \n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].showComponent()\n        }\n      }\n    }\n  }\n\n  getWrappers() {\n    const searchBarRightWrapper = this.el.shadowRoot.querySelector('.navbar__container-right-content-navigation-item-search-bar-icon-wrapper')\n    const searchBarLeftWrapper = this.el.shadowRoot.querySelector('.navbar__container-left-content-navigation-item-search-bar')\n    const rightSideSlot = searchBarRightWrapper.querySelector('slot');\n    const leftSideSlot = searchBarLeftWrapper.querySelector('slot');\n    const rightAssignedNodes = rightSideSlot.assignedNodes();\n    const leftAssignedNodes = leftSideSlot.assignedNodes();\n    const navbarProfile = this.el.querySelector('ifx-navbar-profile');\n    const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]');\n    const rightMenuItems = this.el.querySelectorAll('[slot=\"right-item\"]');\n    const topRowWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-top-row-wrapper')\n    \n    return {rightSideSlot, leftSideSlot, rightAssignedNodes, leftAssignedNodes, navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper};\n  }\n\n  hideNavItems() {\n    const { rightAssignedNodes, leftAssignedNodes, navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper } = this.getWrappers();\n    \n    if(rightAssignedNodes.length !== 0) { \n      this.searchBarIsOpen = 'right'\n    } else if(leftAssignedNodes.length !== 0) {\n      this.searchBarIsOpen = 'left'\n    }\n\n    if(navbarProfile) { \n      navbarProfile.hideComponent()\n    }\n    \n    for(let l = 0; l < leftMenuItems.length; l++) { \n      if(!topRowWrapper.classList.contains('expand')) {\n        leftMenuItems[l].hideComponent()\n      }\n    }\n  \n    for(let r = 0; r < rightMenuItems.length; r++) { \n      if(topRowWrapper.classList.contains('expand')) {\n        if(!rightMenuItems[r].hideOnMobile) { \n          rightMenuItems[r].hideComponent()\n        }\n      } else { \n        rightMenuItems[r].hideComponent()\n      }\n    }\n  }\n\n  showNavItems() {\n    const { navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper } = this.getWrappers();\n    this.searchBarIsOpen = undefined;\n    \n    if(navbarProfile) {\n      navbarProfile.showComponent()\n    }\n    \n    for(let l = 0; l < leftMenuItems.length; l++) { \n      if(!topRowWrapper.classList.contains('expand')) {\n        leftMenuItems[l].showComponent()\n      }\n    }\n  \n    for(let r = 0; r < rightMenuItems.length; r++) { \n      if(topRowWrapper.classList.contains('expand')) {\n        if(!rightMenuItems[r].hideOnMobile) { \n          rightMenuItems[r].showComponent()\n        }\n      } else { \n        rightMenuItems[r].showComponent()\n      }\n    }\n  }\n  \n  \n  @Listen('ifxOpen')\n  handleSearchBarToggle(event: CustomEvent) {\n   \n    if(event.detail) { \n      this.hideNavItems();\n    } else if(!event.detail) {\n      this.showNavItems();\n    }\n  }\n\n  toggleClass(el, className) {\n    el.classList.toggle(className)\n  }\n\n  handleSidebar(el) {\n    const sidebarIconWrapper = el.currentTarget.closest('.navbar__burger-icon-wrapper');\n    const sidebarIconOpen = sidebarIconWrapper.querySelector('.navbar__burger-icon')\n    const sidebarIconClose = sidebarIconWrapper.querySelector('.navbar__cross-icon')\n    const mainContainer = el.currentTarget.closest('.navbar__main-container');\n    const navbarWrapper = el.currentTarget.closest('.navbar__wrapper')\n    const sidebarWrapper = navbarWrapper.querySelector('.navbar__sidebar');\n    this.toggleClass(navbarWrapper, 'show')\n    this.toggleClass(mainContainer, 'show')\n    this.toggleClass(sidebarWrapper, 'show')\n    this.toggleClass(sidebarIconOpen, 'close')\n    this.toggleClass(sidebarIconClose, 'show')\n\n    if(sidebarIconClose.classList.contains('show')) { \n      this.handleBodyScroll('hide')\n    } else { \n      this.handleBodyScroll('show')\n    }\n  }\n\n  handleBodyScroll(action) { \n    const body = this.el.closest('body')\n    if(!this.fixed && action === 'hide') { \n      body.style.overflow = 'hidden'\n    } else if(action === 'show') { \n      body.style.overflow = 'visible'\n    }\n  }\n\n  handleDropdownMenu(el) {\n    const dropdownWrapper = el.currentTarget.querySelector('.navbar__dropdown-wrapper')\n    dropdownWrapper.classList.toggle('open')\n    const iconWrapper = el.currentTarget.querySelector('a')\n    iconWrapper.classList.toggle('open')\n  }\n\n  async setItemMenuPosition() { \n    const navbarItems = this.el.querySelectorAll('ifx-navbar-item')\n    const navbarProfile = this.el.querySelector('ifx-navbar-profile')\n\n    if(navbarProfile) {\n      const itemChildren = navbarProfile.querySelectorAll('ifx-navbar-item')\n      if (itemChildren.length !== 0) {\n        itemChildren.forEach(item => { \n          item.setMenuItemPosition()\n          this.setMenuItemChildrenPosition(item)\n        })\n      }\n    }\n   \n    if(navbarItems.length !== 0) { \n      for(let i = 0; i < navbarItems.length; i++) { \n        const item = navbarItems[i];\n        const itemChildren = item.querySelectorAll('ifx-navbar-item')\n        if (itemChildren.length !== 0) {\n         const hasNestedItems = await item.setItemSideSpecifications()\n         if(hasNestedItems) { \n          itemChildren.forEach(item => { \n            item.setMenuItemPosition()\n            this.setMenuItemChildrenPosition(item)\n          })\n         }\n        }\n      }\n    }\n  }\n\n  setMenuItemChildrenPosition(item) {\n    const itemChildren = item.querySelectorAll('ifx-navbar-item');\n    if (itemChildren.length !== 0) {\n        itemChildren.forEach(subItem => { \n          subItem.setMenuItemPosition()\n          this.setMenuItemChildrenPosition(subItem)\n        })\n    }\n  }\n\n  getMediaQueryList() { \n    const mediaQueryList = window.matchMedia('(max-width: 800px)');\n    return mediaQueryList;\n  }\n\n  componentDidLoad() {\n    this.setItemMenuPosition()\n    this.addEventListenersToHandleCustomFocusState();\n\n    const mediaQueryList = this.getMediaQueryList()\n\n    if (mediaQueryList.matches) {\n      this.moveNavItemsToSidebar();\n    }\n\n  }\n\n  handleMobileMenuBottom(e) { \n    const mobileMenuBottomWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-bottom-row')\n    const slotElement = e.target;\n    const nodes = slotElement.assignedNodes();\n    if(nodes.length > 0) { \n      mobileMenuBottomWrapper.classList.add('show')\n    } else { \n      mobileMenuBottomWrapper.classList.remove('show')\n    }\n  }\n\n  handleLogoHrefAndTarget(){\n    if(this.logoHref.trim() === \"\") {\n      this.internalLogoHref = undefined;\n    }else{\n      this.internalLogoHref = this.logoHref;\n    }\n\n    if(['_self', '_blank', '_parent'].includes(this.logoHrefTarget.trim())){\n      this.internalLogoHrefTarget = this.logoHrefTarget;\n    }else{\n      this.internalLogoHrefTarget = '_self';\n    }\n  }\n\n \n  componentWillLoad() {\n    this.RemoveSpaceOnStorybookSnippet()\n    const dropdownMenu = this.el.querySelector('ifx-navbar-menu')\n    const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n    if (!leftMenuItems.length && !dropdownMenu) {\n      this.hasLeftMenuItems = false;\n    }\n    this.handleLogoHrefAndTarget();\n\n    const mediaQueryList = window.matchMedia('(max-width: 800px)');\n    mediaQueryList.addEventListener('change', (e) => this.moveNavItemsToSidebar(e));\n  }\n\n \n\n  getSearchBarLeftWrapper() { \n    const searchBarLeftWrapper = this.el.shadowRoot.querySelector('.navbar__container-left-content-navigation-item-search-bar')\n    return searchBarLeftWrapper;\n  }\n\n  getMobileMenuTop() { \n    const leftMenuItems = this.el.querySelectorAll('[slot=\"mobile-menu-top\"]');\n    return leftMenuItems;\n  }\n\n  getMobileMenuBottom() { \n    const rightMenuItems = this.el.querySelectorAll('[slot=\"mobile-menu-bottom\"]');\n    return rightMenuItems;\n  }\n\n  handleBurgerIcon() { \n    const leftMenuItems = this.getMobileMenuTop()\n    const rightMenuItems = this.getMobileMenuBottom()\n    if(!leftMenuItems.length && !rightMenuItems.length) { \n     const burgerIconWrapper = this.el.shadowRoot.querySelector('.navbar__burger-icon-wrapper')\n     this.toggleClass(burgerIconWrapper, 'hide')\n    }\n  }\n  \n  moveNavItemsToSidebar(e?: MediaQueryListEvent) {\n    const topRowWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-top-row-wrapper')\n    const mediaQueryList = this.getMediaQueryList();\n    const matches = e ? e.matches : mediaQueryList.matches;\n  \n    if (matches) {\n      /* The viewport is 800px wide or less */\n      topRowWrapper.classList.add('expand')\n      \n      //hide body scroll if sidebar was opened\n      const crossIcon = this.el.shadowRoot.querySelector('.navbar__cross-icon')\n      if(crossIcon.classList.contains('show')) { \n        this.handleBodyScroll('hide')\n      }\n      \n      //move search bar to right-side\n      const searchBarLeft = this.el.querySelector('[slot=\"search-bar-left\"]')\n      if(searchBarLeft) { \n        if(this.searchBarIsOpen) { \n          searchBarLeft.onNavbarMobile()\n        }\n        const searchBarLeftWrapper = this.getSearchBarLeftWrapper()\n        searchBarLeftWrapper.classList.add('initial')\n        searchBarLeft.setAttribute('slot', 'search-bar-right')\n      }\n      \n      //left-side\n      const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        leftMenuItems[i].setAttribute('slot', 'mobile-menu-top')\n        leftMenuItems[i].moveChildComponentsIntoSubLayerMenu()\n        if(this.searchBarIsOpen) { \n          leftMenuItems[i].showComponent()\n        }\n      }\n      \n      //right-side\n      const rightMenuItems = this.el.querySelectorAll('[slot=\"right-item\"]')\n      for(let i = 0; i < rightMenuItems.length; i++) { \n        if(rightMenuItems[i].tagName.toUpperCase() === 'IFX-NAVBAR-PROFILE') { \n          rightMenuItems[i].showLabel = false;\n        } else { \n          if(rightMenuItems[i].hideOnMobile) { \n            rightMenuItems[i].setAttribute('slot', 'mobile-menu-bottom')\n            \n            rightMenuItems[i].toggleChildren('add')\n            \n            rightMenuItems[i].showLabel = true;\n            if(this.searchBarIsOpen) { \n              rightMenuItems[i].showComponent()\n            }\n          }\n        }\n      }\n      \n      this.handleBurgerIcon()\n\n    } else {\n      /* The viewport is more than 800px wide */\n      topRowWrapper.classList.remove('expand')\n\n      //show body scroll \n      this.handleBodyScroll('show')\n\n      //return search bar to its original position\n      const searchBarLeftWrapper = this.getSearchBarLeftWrapper()\n      const leftIsInitial = searchBarLeftWrapper.classList.contains('initial')\n      const searchBarRight = this.el.querySelector('[slot=\"search-bar-right\"]')\n      if(leftIsInitial) { \n        if(this.searchBarIsOpen) { \n          searchBarRight.onNavbarMobile()\n        }\n        if(searchBarRight) { \n          searchBarRight.setAttribute('slot', 'search-bar-left')\n        }\n      }\n\n      //left-side\n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        leftMenuItems[i].setAttribute('slot', 'left-item')\n        leftMenuItems[i].moveChildComponentsBackIntoNavbar()\n      }\n\n      //right-side\n      const rightMenuItems = this.getMobileMenuBottom()\n      const navbarProfileItem = this.el.querySelector('ifx-navbar-profile')\n      if(navbarProfileItem) { \n        const showProfileItemLabel = navbarProfileItem.getAttribute('show-label');\n        navbarProfileItem.setAttribute('show-label', showProfileItemLabel)\n      }\n\n      for(let i = 0; i < rightMenuItems.length; i++) { \n        rightMenuItems[i].setAttribute('slot', 'right-item')\n\n          rightMenuItems[i].toggleChildren('remove')\n          \n          const showLabel = rightMenuItems[i].getAttribute('show-label');\n          rightMenuItems[i].setAttribute('show-label', showLabel)\n          if(this.searchBarIsOpen) { \n            rightMenuItems[i].hideComponent()\n          }\n        }\n      }\n    }\n\n  RemoveSpaceOnStorybookSnippet() { \n    let parent = this.el.parentElement;\n    if(parent) { \n      let storybookWrapper = parent.closest('.css-xzp052');\n      if(storybookWrapper) { \n        storybookWrapper.style.overflow = 'visible'\n      }\n    }\n  }\n\n\n  \n  render() {\n    return (\n      <div aria-label='a navigation navbar' class={`navbar__wrapper ${this.fixed ? 'fixed' : \"\"}`}>\n        <div class={`navbar__main-container ${this.fixed ? 'fixed' : \"\"}`}>\n          <div class={`navbar__container ${this.searchBarIsOpen ? \"expanded\" : \"\"}`}>\n            <div class={`navbar__container-left ${this.searchBarIsOpen === 'left' ? \"expand\" : this.searchBarIsOpen === 'right' ? 'hide' : \"\"}`}>\n              {this.showLogoAndAppname &&\n                <div class={`navbar__container-left-logo ${this.searchBarIsOpen === 'left' ? 'hide' : \"\"}`}>\n                  <div class=\"navbar__container-left-logo-default\">\n                    <a href={this.internalLogoHref} target = {this.internalLogoHrefTarget}>\n                      <svg width=\"91\" height=\"40\" viewBox=\"0 0 91 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                        <g clip-path=\"url(#clip0_2396_2480)\">\n                          <path d=\"M67.691 26.7766C71.0884 26.7766 72.1461 23.1841 72.1461 19.8802C72.1461 15.4536 70.2871 13.1441 67.691 13.1441C64.4219 13.1441 63.2681 16.7367 63.3001 19.9443C63.3322 23.1199 64.2296 26.7766 67.691 26.7766ZM66.0244 19.8481C66.0244 18.533 66.0244 15.4536 67.691 15.4536C69.4859 15.4536 69.4218 18.5009 69.4218 19.9123C69.4218 21.2595 69.4218 24.5313 67.7551 24.5313C65.9603 24.4992 66.0244 21.2274 66.0244 19.8481ZM57.8195 26.7766C59.1976 26.7766 60.3835 26.2313 61.5053 25.0445L60.5117 23.1841C59.7425 24.018 58.9733 24.4671 58.0438 24.4671C57.2746 24.4671 56.6336 24.018 56.249 23.2482C55.9285 22.5746 55.8644 21.8048 55.8644 20.9708V20.7142H61.6335V20.1368C61.6335 17.282 61.2809 15.7102 60.3835 14.5234C59.7104 13.6253 58.7169 13.1441 57.499 13.1441C56.2169 13.1441 55.1593 13.7215 54.39 14.8442C53.5567 16.0631 53.2042 17.699 53.2042 19.9443C53.1721 24.2426 54.8708 26.7766 57.8195 26.7766ZM57.531 15.2612C58.172 15.2612 58.5566 15.614 58.813 16.1914C59.0053 16.7046 59.1015 17.5707 59.1015 18.5971H55.8644C55.8964 16.3197 56.3772 15.2612 57.531 15.2612ZM74.2614 26.4559H76.7614V16.8329C77.3703 16.0952 78.0754 15.6782 78.5882 15.6782C78.9087 15.6782 79.2292 15.7423 79.4215 15.9989C79.6138 16.2876 79.71 16.7046 79.71 17.699V26.4559H82.21V16.5442C82.21 15.6782 82.1138 14.8121 81.601 14.1706C81.1523 13.5932 80.4472 13.2404 79.5497 13.2404C78.3959 13.2404 77.2101 13.914 76.569 14.6838C76.537 14.0102 76.3126 13.3687 76.2485 13.1441L73.9089 13.7536C74.0371 14.4593 74.2294 15.3253 74.2294 16.8971V26.4559H74.2614ZM45.2236 14.6838C45.1915 14.0102 44.9672 13.3687 44.9031 13.1441L42.5634 13.7536C42.6916 14.4593 42.8839 15.3253 42.8839 16.8971V26.4238H45.3838V16.8008C45.9928 16.0631 46.6979 15.6461 47.2107 15.6461C47.5312 15.6461 47.8517 15.7102 48.044 15.9669C48.2363 16.2555 48.3325 16.6725 48.3325 17.6669V26.4238H50.8324V16.5442C50.8324 15.6782 50.7363 14.8121 50.2235 14.1706C49.7748 13.5932 49.0696 13.2404 48.1722 13.2404C47.0505 13.2404 45.8646 13.914 45.2236 14.6838ZM14.6473 9.07042C16.1216 9.07042 17.3075 7.88359 17.3075 6.40807C17.3075 4.93256 16.1216 3.74573 14.6473 3.74573C13.173 3.74573 11.9871 4.93256 11.9871 6.40807C11.9871 7.88359 13.173 9.07042 14.6473 9.07042ZM26.9227 26.4559V16.5442C26.9227 15.6782 26.8265 14.8121 26.3137 14.1706C25.865 13.5932 25.1599 13.2404 24.2625 13.2404C23.1087 13.2404 21.9228 13.914 21.2818 14.6838C21.2497 14.0102 21.0254 13.3687 20.9613 13.1441L18.6536 13.7857C18.7818 14.4913 18.9741 15.3574 18.9741 16.9291V26.4559H21.4741V16.8329C22.0831 16.0952 22.7882 15.6782 23.301 15.6782C23.6215 15.6782 23.942 15.7423 24.1343 15.9989C24.3266 16.2876 24.4227 16.7046 24.4227 17.699V26.4559H26.9227ZM38.4289 8.36474C37.4994 8.36474 36.7622 9.10249 36.7622 10.0327C36.7622 10.9629 37.4994 11.7007 38.3968 11.7007C39.3263 11.7007 40.0634 10.9629 40.0634 10.0327C40.0634 9.10249 39.3263 8.36474 38.4289 8.36474ZM13.4614 26.4559H15.9614V10.8346L13.4614 11.1554V26.4559ZM33.8777 9.90441C34.3264 9.90441 34.7751 10.0648 35.0635 10.2893L35.7687 8.33266C35.0956 7.85151 34.3584 7.62698 33.429 7.62698C32.788 7.62698 32.1149 7.78736 31.5059 8.26851C30.897 8.78173 30.256 9.80818 30.256 11.7328C30.256 12.5667 30.288 13.4328 30.288 13.4328H29.4226V15.6461H30.288V26.4238H32.8521V15.6782H34.743L35.2238 13.4649H32.8841V11.4762C32.8841 10.5139 33.2687 9.90441 33.8777 9.90441ZM37.1468 26.4559H39.6788V13.2404L37.1468 13.5611V26.4559Z\" fill=\"#005DA9\" />\n                          <path d=\"M77.0816 33.5126C68.6203 36.0146 58.3321 37.1052 48.2682 37.1052C22.7239 37.1052 6.24986 29.5993 5.09604 19.6877C4.67938 15.9668 7.59599 12.3422 12.4677 9.26285C11.6023 8.62132 11.0575 7.59488 11.0254 6.44012C3.97427 10.161 0 15.0366 0 19.9764C0 30.9145 19.5188 40.1525 48.5246 39.7676C58.6205 39.6393 67.0498 38.1958 74.6778 35.6939C83.7482 32.7428 89.4532 28.5087 90.8313 26.6483C89.1968 28.1238 85.3186 31.0748 77.0816 33.5126ZM23.2687 4.38723C24.9674 3.80985 27.3712 3.0721 27.3712 3.0721C34.1339 1.21166 41.6017 0.121063 48.5566 0.185215C40.544 -0.295931 33.2365 0.185215 26.8584 1.33997C26.8584 1.33997 24.743 1.69281 22.4675 2.27018C22.4675 2.27018 21.3777 2.55887 20.7047 2.75133C20.0316 2.94379 19.1021 3.2004 19.1021 3.2004C18.4611 3.39286 17.8201 3.6174 17.1791 3.84193C17.8201 4.48346 18.2047 5.31745 18.2368 6.27974C19.3586 5.76652 21.5059 4.99668 23.2687 4.38723Z\" fill=\"#E30034\" />\n                        </g>\n                        <defs>\n                          <clipPath id=\"clip0_2396_2480\">\n                            <rect width=\"91\" height=\"40\" fill=\"white\" />\n                          </clipPath>\n                        </defs>\n                      </svg>\n                    </a>\n                  </div>\n                  {this.applicationName && <h6>{this.applicationName}</h6>}\n                  {this.applicationName && this.hasLeftMenuItems &&\n                    <div class=\"navbar__container-left-logo-divider\"></div>}\n                </div>}\n              <div class=\"navbar__container-left-content\">\n                <div class=\"navbar__container-left-content-navigation-group\">\n                  <slot name='left-item' />\n                  <div class=\"navbar__container-left-content-navigation-item-search-bar\">\n                    <slot name='search-bar-left' />\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class={`navbar__container-right ${this.searchBarIsOpen === 'right' ? \"expand\" : this.searchBarIsOpen === 'left' ? 'hide' : \"\"}`}>\n              <div class=\"navbar__container-right-content\">\n                <div class=\"navbar__container-right-content-navigation-group\">\n                  <div class=\"navbar__container-right-content-navigation-item-search-bar\">\n                  <div class={`navbar__container-right-content-navigation-item-search-bar-icon-wrapper`}>\n                      <slot name='search-bar-right' />\n                    </div>\n                  </div>\n                  <slot name='right-item' />\n                </div>\n              </div>\n\n              {/* MOBILE MENU BUTTON */}\n              <div class={`navbar__burger-icon-wrapper`} onClick={this.handleSidebar.bind(this)}>\n                <div class=\"navbar__burger-icon\">\n                  <ifx-icon icon=\"menu-right-24\"></ifx-icon>\n                </div>\n                <div class=\"navbar__cross-icon\">\n                  <ifx-icon icon=\"cross-24\"></ifx-icon>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        {/* SIDEBAR */}\n        <div class=\"navbar__sidebar\">\n          {/* left side ifx-navbar-item  */}\n          <div class=\"navbar__sidebar-top-row\">\n            <div class=\"navbar__sidebar-top-row-wrapper\">\n              <slot name='mobile-menu-top' />\n            </div>\n          </div>\n\n          {/* right side ifx-navbar-item  */}\n          <div class=\"navbar__sidebar-bottom-row\">\n            <slot name='mobile-menu-bottom' onSlotchange={(e) => this.handleMobileMenuBottom(e)} />\n          </div>\n          \n        </div>\n      </div>\n    );\n  }\n}"],"version":3}
+{"file":"ifx-navbar.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/navigation/navbar/navbar.scss?tag=ifx-navbar&encapsulation=shadow","src/components/navigation/navbar/navbar.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  width: 100%;\n  display: block;\n}\n\n\n.navbar__wrapper {\n  font-family: var(--ifx-font-family);\n  height: 63px;\n  position: sticky;\n  //overflow: hidden;\n  z-index: 1030;\n  border-bottom: 1px solid #EEEDED;\n\n  &.fixed {\n    border-bottom: none;\n  }\n\n  // border-bottom: 1px solid #EEEDED; //when fixed is false\n}\n\n.navbar__main-container {\n  position: absolute;\n  top: 0;\n  width: 100%;\n  //overflow: hidden;\n  transition: all 1s;\n  z-index: 1020;\n\n  &.fixed {\n    position: fixed;\n\n    & .navbar__container {\n      border-bottom: 1px solid #EEEDED;\n    }\n  }\n\n  &.show {\n    height: 100vh;\n    bottom: 0;\n    background-color: tokens.$ifxColorOverlayDark;\n    transition: 1s;\n    z-index: 1;\n  }\n}\n\n.navbar__sidebar {\n  box-sizing: border-box;\n  position: fixed;\n  right: -100%;\n  top: 64px;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  // padding: 32px;\n  width: 375px;\n  height: calc(100vh - 64px);\n  background-color: tokens.$ifxColorBaseWhite;\n  transition: right 1s;\n  z-index: 1030;\n\n  &.show {\n    right: 0;\n    transition: right 1s;\n  }\n\n  & .navbar__sidebar-top-row { \n    display: flex;\n    padding: var(--borderRadius-none, 0px) var(--space-300, 24px) 30px var(--space-300, 24px);\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--space-200, 16px);\n    flex: 1 0 0;\n    align-self: stretch;\n\n    overflow-y: auto;\n\n    & .navbar__sidebar-top-row-wrapper { \n      display: flex;\n      padding-top: var(--space-200, 16px);\n      flex-direction: column;\n      align-items: flex-start;\n      align-self: stretch;\n      gap: 16px;\n\n      &.expand { \n        align-items: initial;\n      }\n\n      & .navbar__sidebar-top-row-item { \n        display: flex;\n        padding: var(--space-200, 0px) var(--space-50, 4px) var(--space-200, 0px) 0px;\n        align-items: center;\n        gap: var(--space-100, 8px);\n        align-self: stretch;\n        justify-content: space-between;\n\n        & .navbar__sidebar-top-row-item-icon-wrapper { \n          & ifx-icon { \n            vertical-align: middle;\n          }\n        }\n  \n  \n        &:hover { \n          cursor: pointer;\n        }\n  \n        & .navbar__sidebar-top-row-item-label { \n          color: var(--color-base-black, #1D1D1D);\n          font-family: \"Source Sans 3\";\n          font-size: 16px;\n          font-style: normal;\n          font-weight: 400;\n          line-height: 24px; \n        }\n  \n      }\n    }\n\n  }\n\n  & .navbar__sidebar-bottom-row { \n    //display: flex;\n    display: none;\n    padding: var(--space-150, 12px) var(--space-300, 24px) var(--space-150, 12px) var(--space-200, 16px);\n    flex-direction: column;\n    align-items: flex-start;\n    align-self: stretch;\n    background: var(--color-engineering-100, #F7F7F7);\n    border-top: 1px solid var(--color-engineering-200, #EEEDED);\n    gap: 10px;\n\n    max-height: 160px;\n    overflow-y: auto;\n\n    &.show { \n      display: flex;\n    }\n   \n\n    & .navbar__sidebar-bottom-row-item { \n      display: flex;\n      height: 40px;\n      padding-right: var(--space-50, 4px);\n      align-items: center;\n      gap: var(--space-100, 8px);\n      flex: 1 0 0;\n \n      & .navbar__sidebar-bottom-row-item-label {\n        color: var(--color-base-black, #1D1D1D);\n        font-family: \"Source Sans 3\";\n        font-size: 16px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 24px; \n      }\n\n      & .navbar__sidebar-bottom-row-item-icon-wrapper { \n       display: flex;\n       align-items: center;\n      }\n    }\n\n  }\n\n\n  & .navbar__sidebar-content-products,\n  & .navbar__sidebar-content-main {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    padding: 0px;\n    gap: 24px;\n    flex: none;\n    order: 0;\n    align-self: stretch;\n    flex-grow: 0;\n\n    & .navbar__sidebar-content-products-header,\n    & .navbar__sidebar-content-about-header {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 0;\n      align-self: stretch;\n      flex-grow: 0;\n      color: #BFBBBB;\n\n      & span {\n        color: tokens.$ifxColorBaseBlack;\n        font-weight: 600;\n        font-size: 18px;\n        line-height: 28px;\n        display: flex;\n        align-items: center;\n      }\n    }\n\n    & .navbar__sidebar-content-products-menu,\n    & .navbar__sidebar-content-main-menu {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n      width: 100%;\n\n      & .navbar__sidebar-content-products-menu-item,\n      & .navbar__sidebar-content-main-menu-item {\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        padding: 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & a {\n          text-decoration: none;\n          font-style: normal;\n          font-weight: 400;\n          font-size: 16px;\n          line-height: 24px;\n          display: flex;\n          align-items: center;\n          color: tokens.$ifxColorBaseBlack;\n        }\n      }\n\n      & .navbar__sidebar-content-main-menu-item {\n        color: tokens.$ifxColorEngineering300;\n\n        & a {\n          font-style: normal;\n          font-weight: 600;\n          font-size: 18px;\n          line-height: 28px;\n          display: flex;\n          align-items: center;\n          color: tokens.$ifxColorBaseBlack;\n          flex: none;\n          order: 0;\n          flex-grow: 1;\n        }\n      }\n    }\n\n    & .navbar__sidebar-content-main-menu {\n      align-items: normal;\n    }\n  }\n}\n\n.navbar__container {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 8px 40px;\n  gap: 16px;\n  background-color: tokens.$ifxColorBaseWhite;\n  font-family: var(--ifx-font-family);\n\n  &.expanded { \n    justify-content: initial;\n  }\n\n  // &.fixed { \n  //   border-bottom: 1px solid #EEEDED; //when fixed is true\n  // }\n\n  & .navbar__container-search-field-wrapper { \n    display: none;\n\n    &.show { \n      display: flex;\n    }\n  }\n\n  & .navbar__container-left {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0;\n    gap: 16px;\n    flex: none;\n    order: 0;\n    flex-grow: 0;\n\n    &.hide {\n      display: none;\n    }\n\n    &.expand { \n      justify-content: initial;\n      flex: 1;\n        & .navbar__container-left-content { \n          align-items: initial;\n          flex: 1;\n          & .navbar__container-left-content-navigation-group { \n            justify-content: initial;\n            flex: 1;\n            & .navbar__container-left-content-navigation-item-search-bar { \n              flex: 1;\n            }\n          }\n        }\n      \n    }\n\n    & .navbar__container-left-logo {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      padding: 0px;\n      gap: 16px;\n      flex: none;\n      order: 0;\n      flex-grow: 0;\n\n      &.hide { \n        display: none;\n      }\n\n      & h6 {\n        position: relative;\n        margin: 0;\n        padding: 0;\n        font-style: normal;\n        font-weight: 600;\n        font-size: 16px;\n        //line-height: 24px;\n        display: flex;\n        align-items: center;\n        color: tokens.$ifxColorBaseBlack;\n        flex: none;\n        order: 1;\n        flex-grow: 0;\n      }\n\n      & .navbar__container-left-logo-default {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        padding: 12px 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & svg {\n          width: 91px;\n          height: 40px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n          vertical-align: bottom;\n        }\n      }\n\n      & .navbar__container-left-logo-divider {\n        width: 1px;\n        height: 32px;\n        background: tokens.$ifxColorEngineering200;\n        flex: none;\n        order: 2;\n        flex-grow: 0;\n      }\n    }\n\n    & .navbar__container-left-content {\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      align-items: flex-start;\n      padding: 0px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n\n      & .navbar__container-left-content-navigation-group {\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        padding: 0px;\n        gap: 4px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & .navbar__container-left-content-navigation-item-search-bar {\n          display: flex; //none\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          flex: none;\n          order: 5;\n          flex-grow: 0;\n          //width: 256px;\n          //height: 40px;\n        }\n\n        & .navbar__container-left-content-navigation-item {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          gap: 8px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n\n          & a {\n            display: flex;\n            align-items: center;\n            font-weight: 400;\n            font-size: 16px;\n            line-height: 24px;\n            color: tokens.$ifxColorBaseBlack;\n            text-decoration: none;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n          }\n        }\n      }\n    }\n  }\n\n  & .navbar__container-right {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-end;\n    padding: 0;\n    gap: 8px;\n    flex: none;\n    order: 1;\n    flex-grow: 0;\n\n    &.hide { \n      display: none;\n    }\n\n    &.expand { \n      justify-content: initial;\n      flex: 1;\n        & .navbar__container-right-content { \n          align-items: initial;\n          flex: 1;\n          & .navbar__container-right-content-navigation-group { \n            justify-content: initial;\n            flex: 1;\n            & .navbar__container-right-content-navigation-item-search-bar { \n              flex: 1;\n              & .navbar__container-right-content-navigation-item-search-bar-icon-wrapper { \n                flex: 1;\n              }\n            }\n          }\n        }\n      \n    }\n\n    & .navbar__burger-icon-wrapper {\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      align-items: center;\n      padding: 4px 0px 4px 16px;\n      border-left: 1px solid tokens.$ifxColorEngineering300;\n      gap: 16px;\n      flex: none;\n      order: 1;\n      flex-grow: 0;\n      width: 41px;\n      height: 40px;\n\n      &.hide { \n        display: none;\n      }\n\n      & .navbar__burger-icon {\n        display: flex;\n        align-items: center;\n\n        &:hover { \n          cursor: pointer;\n        }\n\n        &.close {\n          display: none;\n        }\n      }\n\n      & .navbar__cross-icon {\n        display: none;\n        align-items: center;\n\n        &.show {\n          display: flex;\n\n          &:hover { \n            cursor: pointer;\n          }\n        }\n      }\n    }\n\n    & .navbar__container-right-content {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      padding: 0px;\n      flex: none;\n      order: 0;\n      flex-grow: 0;\n\n      & .navbar__container-right-content-navigation-group {\n        position: relative;\n        display: flex;\n        flex-direction: row;\n        justify-content: flex-end;\n        align-items: center;\n        padding: 0px;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n\n        & .navbar__container-right-content-navigation-item,\n        & .navbar__container-right-content-navigation-item-profile,\n        & .navbar__container-right-content-navigation-item-search-bar {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          padding: 0px 8px;\n          gap: 4px;\n          flex: none;\n          order: 0;\n          flex-grow: 0;\n\n          & .navbar__container-right-content-navigation-item-search-bar-icon-wrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: center;\n            align-items: center;\n            padding: 0px;\n            gap: 8px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n            //width: 24px;\n            //height: 24px;\n            //max-width: 200px;\n\n            &.isOpen { \n              position: absolute;\n              top: 10px;\n            }\n          }\n\n          & .navbar__container-right-content-navigation-item-navigation-profile {\n            position: relative;\n            width: 24px;\n            height: 24px;\n            background: tokens.$ifxColorOcean500;\n            border-radius: 100px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n\n            & a {\n              position: absolute;\n              width: 22px;\n              height: 20px;\n              left: calc(50% - 22px/2);\n              top: calc(50% - 20px/2);\n              font-style: normal;\n              font-weight: 600;\n              font-size: 14px;\n              line-height: 20px;\n              text-decoration: none;\n              display: flex;\n              align-items: center;\n              justify-content: center;\n              text-align: center;\n              color: tokens.$ifxColorBaseWhite;\n            }\n          }\n\n          & .navbar__container-right-content-navigation-item-icon-wrapper {\n            display: flex;\n            flex-direction: row;\n            justify-content: center;\n            align-items: center;\n            padding: 0px;\n            gap: 8px;\n            flex: none;\n            order: 0;\n            flex-grow: 0;\n          }\n\n          & a {\n            font-style: normal;\n            font-weight: 400;\n            font-size: 14px;\n            line-height: 20px;\n            color: tokens.$ifxColorBaseBlack;\n            text-decoration: none;\n            display: flex;\n            align-items: center;\n            flex: none;\n            order: 1;\n            flex-grow: 0;\n          }\n        }\n      }\n    }\n  }\n}\n\n//burger icon exist, and left container is gone\n@media screen and (max-width: 800px) {\n  .navbar__container {\n    padding: 0px 16px;\n    height: 64px;\n    gap: initial;\n\n    &.expanded { \n      & .navbar__container-right {\n        & .navbar__burger-icon-wrapper {\n          display: none;\n        }\n      }\n    }\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        display: none;\n      }\n\n      & .navbar__container-left-logo {\n        & .navbar__container-left-logo-divider {\n          display: none;\n        }\n      }\n    }\n\n    & .navbar__container-right {\n      flex: 1;\n    }\n  }\n\n  .navbar__sidebar {\n    width: 0;\n    transition: 1s;\n\n    // &.show {\n    //   width: 100%;\n    // }\n\n  }\n}\n\n@media screen and (max-width: 500px) {\n  .navbar__sidebar {\n    &.show {\n      width: 100%;  // 100% of viewport width\n    }\n  }\n}\n\n@media screen and (min-width: 500px) {\n  .navbar__sidebar {\n    &.show {\n      width: 50%;  // 100% of viewport width\n    }\n  }\n}\n\n//burger icon disappears\n@media screen and (min-width: 800px) {\n  .navbar__wrapper {\n    height: 63px;\n  }\n\n  .navbar__container {\n    padding: 0px 16px;\n    height: 63px;\n    gap: initial;\n\n    & .navbar__container-right {\n      & .navbar__burger-icon-wrapper {\n        display: none;\n      }\n    }\n  }\n\n  .navbar__main-container {\n    &.show {\n      height: auto;\n      background-color: inherit;\n      transition: none;\n    }\n  }\n\n  .navbar__sidebar {\n    width: 0;\n    transition: 1s;\n    &.show { \n      right: -100%;\n    }\n  }\n\n}\n\n//left container appears\n@media screen and (min-width: 1024px) {\n  .navbar__wrapper {\n    height: 72px;\n  }\n\n  .navbar__container {\n    padding: 0px 24px;\n    height: 72px;\n\n    & .navbar__container-left {\n      gap: 12px;\n      display: flex;\n\n      & .navbar__container-left-content {\n        display: flex;\n      }\n\n      & .navbar__container-left-logo-default {\n        & svg {\n          width: 72.8px;\n          height: 32px;\n        }\n      }\n    }\n  }\n\n  .navbar__main-container {\n    &.show {\n      height: auto;\n      background-color: inherit;\n      transition: none;\n    }\n  }\n}\n\n@media screen and (min-width: 1200px) {\n  .navbar__wrapper {\n    height: 80px\n  }\n\n  .navbar__container {\n    padding: 0px 32px;\n    height: 80px;\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        justify-content: inherit;\n      }\n    }\n\n    & .navbar__container-right {\n      & .navbar__container-right-content {\n        justify-content: inherit;\n      }\n    }\n  }\n}\n\n@media screen and (min-width: 1440px) {\n  .navbar__wrapper {\n    height: 80px;\n  }\n\n  .navbar__container {\n    padding: 0px 40px;\n    height: 80px;\n\n    & .navbar__container-left {\n      & .navbar__container-left-content {\n        justify-content: center;\n      }\n    }\n\n    & .navbar__container-right {\n      & .navbar__container-right-content {\n        justify-content: inherit;\n      }\n    }\n  }\n}","import { Component, h, Element, State, Prop, Listen, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-navbar',\n  styleUrl: 'navbar.scss',\n  shadow: true,\n})\n\nexport class Navbar {\n  @Element() el;\n  @State() main: boolean = true\n  @State() products: boolean = false\n  @State() applications: boolean = false\n  @State() design: boolean = false\n  @State() support: boolean = false\n  @State() about: boolean = false\n  @Prop() applicationName: string = \"\"\n  @State() hasLeftMenuItems: boolean = true;\n  @Prop() fixed: boolean = true;\n  @Prop() showLogoAndAppname: boolean = true;\n  @State() searchBarIsOpen: string;\n  @Prop() logoHref: string = \"\";\n  @State() internalLogoHref: string = \"\"\n  @Prop() logoHrefTarget: string = '_self';\n  @State() internalLogoHrefTarget: string = '_self';\n  @Event() ifxNavbarMobileMenuIsOpen: EventEmitter;\n\n  private addEventListenersToHandleCustomFocusState() {\n    const element = this.el.shadowRoot.firstChild;\n\n    if (!element) {\n      console.error('element not found');\n      return;\n    }\n    element.tabIndex = -1;\n\n    // Select all a elements in the navbar and set their tabIndex to -1 to make them non-focusable\n    const aElements = element.querySelectorAll('a');\n    for (let i = 0; i < aElements.length; i++) {\n      aElements[i].tabIndex = -1;\n    }\n\n    const slot = element.querySelector('slot');\n    if (slot) {\n      const assignedNodes = slot.assignedNodes();\n      for (let i = 0; i < assignedNodes.length; i++) {\n        const node = assignedNodes[i] as HTMLElement;\n        if (node.nodeName === 'IFX-NAVBAR-ITEM') {\n          const navbarItem = node as HTMLIfxNavbarItemElement;\n\n          // Get all navigation items\n          const aElements = navbarItem?.shadowRoot.querySelectorAll('a');\n          for (let i = 0; i < aElements.length; i++) {\n            aElements[i].tabIndex = -1;\n          }\n        }\n      }\n    }\n  }\n\n  @Listen('ifxNavItem') \n  clearFirstLayerMenu(event: CustomEvent) { \n    if(event.detail.action === 'hideFirstLayer') { \n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].hideComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'hideSecondLayer') { \n      const parent = event.detail.parent;\n      const children = parent.children;\n      parent.toggleFirstLayerItem('remove', 'add')\n      for(let i = 0; i < children.length; i++) { \n        if(!children[i].isSameNode(event.detail.component)) {\n          children[i].hideComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'returnToSecondLayer') { \n      const parent = event.detail.parent;\n      const children = parent.children;\n      parent.toggleFirstLayerItem('add', 'remove')\n      for(let i = 0; i < children.length; i++) { \n        if(!children[i].isSameNode(event.detail.component)) {\n          children[i].showComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'show') { \n      const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].showComponent()\n        }\n      }\n    }\n\n    if(event.detail.action === 'return') { \n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        if(!leftMenuItems[i].isSameNode(event.detail.component)) {\n          leftMenuItems[i].showComponent()\n        }\n      }\n    }\n  }\n\n  getWrappers() {\n    const searchBarRightWrapper = this.el.shadowRoot.querySelector('.navbar__container-right-content-navigation-item-search-bar-icon-wrapper')\n    const searchBarLeftWrapper = this.el.shadowRoot.querySelector('.navbar__container-left-content-navigation-item-search-bar')\n    const rightSideSlot = searchBarRightWrapper.querySelector('slot');\n    const leftSideSlot = searchBarLeftWrapper.querySelector('slot');\n    const rightAssignedNodes = rightSideSlot.assignedNodes();\n    const leftAssignedNodes = leftSideSlot.assignedNodes();\n    const navbarProfile = this.el.querySelector('ifx-navbar-profile');\n    const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]');\n    const rightMenuItems = this.el.querySelectorAll('[slot=\"right-item\"]');\n    const topRowWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-top-row-wrapper')\n    \n    return {rightSideSlot, leftSideSlot, rightAssignedNodes, leftAssignedNodes, navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper};\n  }\n\n  hideNavItems() {\n    const { rightAssignedNodes, leftAssignedNodes, navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper } = this.getWrappers();\n    \n    if(rightAssignedNodes.length !== 0) { \n      this.searchBarIsOpen = 'right'\n    } else if(leftAssignedNodes.length !== 0) {\n      this.searchBarIsOpen = 'left'\n    }\n\n    if(navbarProfile) { \n      navbarProfile.hideComponent()\n    }\n    \n    for(let l = 0; l < leftMenuItems.length; l++) { \n      if(!topRowWrapper.classList.contains('expand')) {\n        leftMenuItems[l].hideComponent()\n      }\n    }\n  \n    for(let r = 0; r < rightMenuItems.length; r++) { \n      if(topRowWrapper.classList.contains('expand')) {\n        if(!rightMenuItems[r].hideOnMobile) { \n          rightMenuItems[r].hideComponent()\n        }\n      } else { \n        rightMenuItems[r].hideComponent()\n      }\n    }\n  }\n\n  showNavItems() {\n    const { navbarProfile, leftMenuItems, rightMenuItems, topRowWrapper } = this.getWrappers();\n    this.searchBarIsOpen = undefined;\n    \n    if(navbarProfile) {\n      navbarProfile.showComponent()\n    }\n    \n    for(let l = 0; l < leftMenuItems.length; l++) { \n      if(!topRowWrapper.classList.contains('expand')) {\n        leftMenuItems[l].showComponent()\n      }\n    }\n  \n    for(let r = 0; r < rightMenuItems.length; r++) { \n      if(topRowWrapper.classList.contains('expand')) {\n        if(!rightMenuItems[r].hideOnMobile) { \n          rightMenuItems[r].showComponent()\n        }\n      } else { \n        rightMenuItems[r].showComponent()\n      }\n    }\n  }\n  \n  \n  @Listen('ifxSearchBarIsOpen')\n  handleSearchBarToggle(event: CustomEvent) {\n   \n    if(event.detail) { \n      this.hideNavItems();\n    } else if(!event.detail) {\n      this.showNavItems();\n    }\n  }\n\n  toggleClass(el, className) {\n    el.classList.toggle(className)\n  }\n\n  handleSidebar(el) {\n    const sidebarIconWrapper = el.currentTarget.closest('.navbar__burger-icon-wrapper');\n    const sidebarIconOpen = sidebarIconWrapper.querySelector('.navbar__burger-icon')\n    const sidebarIconClose = sidebarIconWrapper.querySelector('.navbar__cross-icon')\n    const mainContainer = el.currentTarget.closest('.navbar__main-container');\n    const navbarWrapper = el.currentTarget.closest('.navbar__wrapper')\n    const sidebarWrapper = navbarWrapper.querySelector('.navbar__sidebar');\n    this.toggleClass(navbarWrapper, 'show')\n    this.toggleClass(mainContainer, 'show')\n    this.toggleClass(sidebarWrapper, 'show')\n    this.toggleClass(sidebarIconOpen, 'close')\n    this.toggleClass(sidebarIconClose, 'show')\n\n    if(sidebarIconClose.classList.contains('show')) { \n      this.handleBodyScroll('hide')\n    } else { \n      this.handleBodyScroll('show')\n    }\n  }\n\n  handleBodyScroll(action) { \n    const body = this.el.closest('body')\n    if(!this.fixed && action === 'hide') { \n      body.style.overflow = 'hidden'\n    } else if(action === 'show') { \n      body.style.overflow = 'visible'\n    }\n  }\n\n  handleDropdownMenu(el) {\n    const dropdownWrapper = el.currentTarget.querySelector('.navbar__dropdown-wrapper')\n    dropdownWrapper.classList.toggle('open')\n    const iconWrapper = el.currentTarget.querySelector('a')\n    iconWrapper.classList.toggle('open')\n  }\n\n  async setItemMenuPosition() { \n    const navbarItems = this.el.querySelectorAll('ifx-navbar-item')\n    const navbarProfile = this.el.querySelector('ifx-navbar-profile')\n\n    if(navbarProfile) {\n      const itemChildren = navbarProfile.querySelectorAll('ifx-navbar-item')\n      if (itemChildren.length !== 0) {\n        itemChildren.forEach(item => { \n          item.setMenuItemPosition()\n          this.setMenuItemChildrenPosition(item)\n        })\n      }\n    }\n   \n    if(navbarItems.length !== 0) { \n      for(let i = 0; i < navbarItems.length; i++) { \n        const item = navbarItems[i];\n        const itemChildren = item.querySelectorAll('ifx-navbar-item')\n        if (itemChildren.length !== 0) {\n         const hasNestedItems = await item.setItemSideSpecifications()\n         if(hasNestedItems) { \n          itemChildren.forEach(item => { \n            item.setMenuItemPosition()\n            this.setMenuItemChildrenPosition(item)\n          })\n         }\n        }\n      }\n    }\n  }\n\n  setMenuItemChildrenPosition(item) {\n    const itemChildren = item.querySelectorAll('ifx-navbar-item');\n    if (itemChildren.length !== 0) {\n        itemChildren.forEach(subItem => { \n          subItem.setMenuItemPosition()\n          this.setMenuItemChildrenPosition(subItem)\n        })\n    }\n  }\n\n  getMediaQueryList() { \n    const mediaQueryList = window.matchMedia('(max-width: 800px)');\n    return mediaQueryList;\n  }\n\n  componentDidLoad() {\n    this.setItemMenuPosition()\n    this.addEventListenersToHandleCustomFocusState();\n\n    const mediaQueryList = this.getMediaQueryList()\n\n    if (mediaQueryList.matches) {\n      this.moveNavItemsToSidebar();\n    }\n\n  }\n\n  handleMobileMenuBottom(e) { \n    const mobileMenuBottomWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-bottom-row')\n    const slotElement = e.target;\n    const nodes = slotElement.assignedNodes();\n    if(nodes.length > 0) { \n      mobileMenuBottomWrapper.classList.add('show')\n    } else { \n      mobileMenuBottomWrapper.classList.remove('show')\n    }\n  }\n\n  handleLogoHrefAndTarget(){\n    if(this.logoHref.trim() === \"\") {\n      this.internalLogoHref = undefined;\n    }else{\n      this.internalLogoHref = this.logoHref;\n    }\n\n    if(['_self', '_blank', '_parent'].includes(this.logoHrefTarget.trim())){\n      this.internalLogoHrefTarget = this.logoHrefTarget;\n    }else{\n      this.internalLogoHrefTarget = '_self';\n    }\n  }\n\n \n  componentWillLoad() {\n    this.RemoveSpaceOnStorybookSnippet()\n    const dropdownMenu = this.el.querySelector('ifx-navbar-menu')\n    const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n    if (!leftMenuItems.length && !dropdownMenu) {\n      this.hasLeftMenuItems = false;\n    }\n    this.handleLogoHrefAndTarget();\n\n    const mediaQueryList = window.matchMedia('(max-width: 800px)');\n    mediaQueryList.addEventListener('change', (e) => this.moveNavItemsToSidebar(e));\n  }\n\n \n\n  getSearchBarLeftWrapper() { \n    const searchBarLeftWrapper = this.el.shadowRoot.querySelector('.navbar__container-left-content-navigation-item-search-bar')\n    return searchBarLeftWrapper;\n  }\n\n  getMobileMenuTop() { \n    const leftMenuItems = this.el.querySelectorAll('[slot=\"mobile-menu-top\"]');\n    return leftMenuItems;\n  }\n\n  getMobileMenuBottom() { \n    const rightMenuItems = this.el.querySelectorAll('[slot=\"mobile-menu-bottom\"]');\n    return rightMenuItems;\n  }\n\n  handleBurgerIcon() { \n    const leftMenuItems = this.getMobileMenuTop()\n    const rightMenuItems = this.getMobileMenuBottom()\n    if(!leftMenuItems.length && !rightMenuItems.length) { \n     const burgerIconWrapper = this.el.shadowRoot.querySelector('.navbar__burger-icon-wrapper')\n     this.toggleClass(burgerIconWrapper, 'hide')\n    }\n  }\n  \n  moveNavItemsToSidebar(e?: MediaQueryListEvent) {\n    const topRowWrapper = this.el.shadowRoot.querySelector('.navbar__sidebar-top-row-wrapper')\n    const mediaQueryList = this.getMediaQueryList();\n    const matches = e ? e.matches : mediaQueryList.matches;\n  \n    if (matches) {\n      /* The viewport is 800px wide or less */\n      topRowWrapper.classList.add('expand')\n      \n      //hide body scroll if sidebar was opened\n      const crossIcon = this.el.shadowRoot.querySelector('.navbar__cross-icon')\n      if(crossIcon.classList.contains('show')) { \n        this.handleBodyScroll('hide')\n      }\n      \n      //move search bar to right-side\n      const searchBarLeft = this.el.querySelector('[slot=\"search-bar-left\"]')\n      if(searchBarLeft) { \n        if(this.searchBarIsOpen) { \n          searchBarLeft.onNavbarMobile()\n        }\n        const searchBarLeftWrapper = this.getSearchBarLeftWrapper()\n        searchBarLeftWrapper.classList.add('initial')\n        searchBarLeft.setAttribute('slot', 'search-bar-right')\n      }\n      \n      //left-side\n      const leftMenuItems = this.el.querySelectorAll('[slot=\"left-item\"]')\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        leftMenuItems[i].setAttribute('slot', 'mobile-menu-top')\n        leftMenuItems[i].moveChildComponentsIntoSubLayerMenu()\n        if(this.searchBarIsOpen) { \n          leftMenuItems[i].showComponent()\n        }\n      }\n      \n      //right-side\n      const rightMenuItems = this.el.querySelectorAll('[slot=\"right-item\"]')\n      for(let i = 0; i < rightMenuItems.length; i++) { \n        if(rightMenuItems[i].tagName.toUpperCase() === 'IFX-NAVBAR-PROFILE') { \n          rightMenuItems[i].showLabel = false;\n        } else { \n          if(rightMenuItems[i].hideOnMobile) { \n            rightMenuItems[i].setAttribute('slot', 'mobile-menu-bottom')\n            \n            rightMenuItems[i].toggleChildren('add')\n            \n            rightMenuItems[i].showLabel = true;\n            if(this.searchBarIsOpen) { \n              rightMenuItems[i].showComponent()\n            }\n          }\n        }\n      }\n      \n      this.handleBurgerIcon()\n\n    } else {\n      /* The viewport is more than 800px wide */\n      topRowWrapper.classList.remove('expand')\n\n      //show body scroll \n      this.handleBodyScroll('show')\n\n      //return search bar to its original position\n      const searchBarLeftWrapper = this.getSearchBarLeftWrapper()\n      const leftIsInitial = searchBarLeftWrapper.classList.contains('initial')\n      const searchBarRight = this.el.querySelector('[slot=\"search-bar-right\"]')\n      if(leftIsInitial) { \n        if(this.searchBarIsOpen) { \n          searchBarRight.onNavbarMobile()\n        }\n        if(searchBarRight) { \n          searchBarRight.setAttribute('slot', 'search-bar-left')\n        }\n      }\n\n      //left-side\n      const leftMenuItems = this.getMobileMenuTop()\n      for(let i = 0; i < leftMenuItems.length; i++) { \n        leftMenuItems[i].setAttribute('slot', 'left-item')\n        leftMenuItems[i].moveChildComponentsBackIntoNavbar()\n      }\n\n      //right-side\n      const rightMenuItems = this.getMobileMenuBottom()\n      const navbarProfileItem = this.el.querySelector('ifx-navbar-profile')\n      if(navbarProfileItem) { \n        const showProfileItemLabel = navbarProfileItem.getAttribute('show-label');\n        navbarProfileItem.setAttribute('show-label', showProfileItemLabel)\n      }\n\n      for(let i = 0; i < rightMenuItems.length; i++) { \n        rightMenuItems[i].setAttribute('slot', 'right-item')\n\n          rightMenuItems[i].toggleChildren('remove')\n          \n          const showLabel = rightMenuItems[i].getAttribute('show-label');\n          rightMenuItems[i].setAttribute('show-label', showLabel)\n          if(this.searchBarIsOpen) { \n            rightMenuItems[i].hideComponent()\n          }\n        }\n      }\n    }\n\n  RemoveSpaceOnStorybookSnippet() { \n    let parent = this.el.parentElement;\n    if(parent) { \n      let storybookWrapper = parent.closest('.css-xzp052');\n      if(storybookWrapper) { \n        storybookWrapper.style.overflow = 'visible'\n      }\n    }\n  }\n\n\n  \n  render() {\n    return (\n      <div aria-label='a navigation navbar' class={`navbar__wrapper ${this.fixed ? 'fixed' : \"\"}`}>\n        <div class={`navbar__main-container ${this.fixed ? 'fixed' : \"\"}`}>\n          <div class={`navbar__container ${this.searchBarIsOpen ? \"expanded\" : \"\"}`}>\n            <div class={`navbar__container-left ${this.searchBarIsOpen === 'left' ? \"expand\" : this.searchBarIsOpen === 'right' ? 'hide' : \"\"}`}>\n              {this.showLogoAndAppname &&\n                <div class={`navbar__container-left-logo ${this.searchBarIsOpen === 'left' ? 'hide' : \"\"}`}>\n                  <div class=\"navbar__container-left-logo-default\">\n                    <a href={this.internalLogoHref} target = {this.internalLogoHrefTarget}>\n                      <svg width=\"91\" height=\"40\" viewBox=\"0 0 91 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                        <g clip-path=\"url(#clip0_2396_2480)\">\n                          <path d=\"M67.691 26.7766C71.0884 26.7766 72.1461 23.1841 72.1461 19.8802C72.1461 15.4536 70.2871 13.1441 67.691 13.1441C64.4219 13.1441 63.2681 16.7367 63.3001 19.9443C63.3322 23.1199 64.2296 26.7766 67.691 26.7766ZM66.0244 19.8481C66.0244 18.533 66.0244 15.4536 67.691 15.4536C69.4859 15.4536 69.4218 18.5009 69.4218 19.9123C69.4218 21.2595 69.4218 24.5313 67.7551 24.5313C65.9603 24.4992 66.0244 21.2274 66.0244 19.8481ZM57.8195 26.7766C59.1976 26.7766 60.3835 26.2313 61.5053 25.0445L60.5117 23.1841C59.7425 24.018 58.9733 24.4671 58.0438 24.4671C57.2746 24.4671 56.6336 24.018 56.249 23.2482C55.9285 22.5746 55.8644 21.8048 55.8644 20.9708V20.7142H61.6335V20.1368C61.6335 17.282 61.2809 15.7102 60.3835 14.5234C59.7104 13.6253 58.7169 13.1441 57.499 13.1441C56.2169 13.1441 55.1593 13.7215 54.39 14.8442C53.5567 16.0631 53.2042 17.699 53.2042 19.9443C53.1721 24.2426 54.8708 26.7766 57.8195 26.7766ZM57.531 15.2612C58.172 15.2612 58.5566 15.614 58.813 16.1914C59.0053 16.7046 59.1015 17.5707 59.1015 18.5971H55.8644C55.8964 16.3197 56.3772 15.2612 57.531 15.2612ZM74.2614 26.4559H76.7614V16.8329C77.3703 16.0952 78.0754 15.6782 78.5882 15.6782C78.9087 15.6782 79.2292 15.7423 79.4215 15.9989C79.6138 16.2876 79.71 16.7046 79.71 17.699V26.4559H82.21V16.5442C82.21 15.6782 82.1138 14.8121 81.601 14.1706C81.1523 13.5932 80.4472 13.2404 79.5497 13.2404C78.3959 13.2404 77.2101 13.914 76.569 14.6838C76.537 14.0102 76.3126 13.3687 76.2485 13.1441L73.9089 13.7536C74.0371 14.4593 74.2294 15.3253 74.2294 16.8971V26.4559H74.2614ZM45.2236 14.6838C45.1915 14.0102 44.9672 13.3687 44.9031 13.1441L42.5634 13.7536C42.6916 14.4593 42.8839 15.3253 42.8839 16.8971V26.4238H45.3838V16.8008C45.9928 16.0631 46.6979 15.6461 47.2107 15.6461C47.5312 15.6461 47.8517 15.7102 48.044 15.9669C48.2363 16.2555 48.3325 16.6725 48.3325 17.6669V26.4238H50.8324V16.5442C50.8324 15.6782 50.7363 14.8121 50.2235 14.1706C49.7748 13.5932 49.0696 13.2404 48.1722 13.2404C47.0505 13.2404 45.8646 13.914 45.2236 14.6838ZM14.6473 9.07042C16.1216 9.07042 17.3075 7.88359 17.3075 6.40807C17.3075 4.93256 16.1216 3.74573 14.6473 3.74573C13.173 3.74573 11.9871 4.93256 11.9871 6.40807C11.9871 7.88359 13.173 9.07042 14.6473 9.07042ZM26.9227 26.4559V16.5442C26.9227 15.6782 26.8265 14.8121 26.3137 14.1706C25.865 13.5932 25.1599 13.2404 24.2625 13.2404C23.1087 13.2404 21.9228 13.914 21.2818 14.6838C21.2497 14.0102 21.0254 13.3687 20.9613 13.1441L18.6536 13.7857C18.7818 14.4913 18.9741 15.3574 18.9741 16.9291V26.4559H21.4741V16.8329C22.0831 16.0952 22.7882 15.6782 23.301 15.6782C23.6215 15.6782 23.942 15.7423 24.1343 15.9989C24.3266 16.2876 24.4227 16.7046 24.4227 17.699V26.4559H26.9227ZM38.4289 8.36474C37.4994 8.36474 36.7622 9.10249 36.7622 10.0327C36.7622 10.9629 37.4994 11.7007 38.3968 11.7007C39.3263 11.7007 40.0634 10.9629 40.0634 10.0327C40.0634 9.10249 39.3263 8.36474 38.4289 8.36474ZM13.4614 26.4559H15.9614V10.8346L13.4614 11.1554V26.4559ZM33.8777 9.90441C34.3264 9.90441 34.7751 10.0648 35.0635 10.2893L35.7687 8.33266C35.0956 7.85151 34.3584 7.62698 33.429 7.62698C32.788 7.62698 32.1149 7.78736 31.5059 8.26851C30.897 8.78173 30.256 9.80818 30.256 11.7328C30.256 12.5667 30.288 13.4328 30.288 13.4328H29.4226V15.6461H30.288V26.4238H32.8521V15.6782H34.743L35.2238 13.4649H32.8841V11.4762C32.8841 10.5139 33.2687 9.90441 33.8777 9.90441ZM37.1468 26.4559H39.6788V13.2404L37.1468 13.5611V26.4559Z\" fill=\"#005DA9\" />\n                          <path d=\"M77.0816 33.5126C68.6203 36.0146 58.3321 37.1052 48.2682 37.1052C22.7239 37.1052 6.24986 29.5993 5.09604 19.6877C4.67938 15.9668 7.59599 12.3422 12.4677 9.26285C11.6023 8.62132 11.0575 7.59488 11.0254 6.44012C3.97427 10.161 0 15.0366 0 19.9764C0 30.9145 19.5188 40.1525 48.5246 39.7676C58.6205 39.6393 67.0498 38.1958 74.6778 35.6939C83.7482 32.7428 89.4532 28.5087 90.8313 26.6483C89.1968 28.1238 85.3186 31.0748 77.0816 33.5126ZM23.2687 4.38723C24.9674 3.80985 27.3712 3.0721 27.3712 3.0721C34.1339 1.21166 41.6017 0.121063 48.5566 0.185215C40.544 -0.295931 33.2365 0.185215 26.8584 1.33997C26.8584 1.33997 24.743 1.69281 22.4675 2.27018C22.4675 2.27018 21.3777 2.55887 20.7047 2.75133C20.0316 2.94379 19.1021 3.2004 19.1021 3.2004C18.4611 3.39286 17.8201 3.6174 17.1791 3.84193C17.8201 4.48346 18.2047 5.31745 18.2368 6.27974C19.3586 5.76652 21.5059 4.99668 23.2687 4.38723Z\" fill=\"#E30034\" />\n                        </g>\n                        <defs>\n                          <clipPath id=\"clip0_2396_2480\">\n                            <rect width=\"91\" height=\"40\" fill=\"white\" />\n                          </clipPath>\n                        </defs>\n                      </svg>\n                    </a>\n                  </div>\n                  {this.applicationName && <h6>{this.applicationName}</h6>}\n                  {this.applicationName && this.hasLeftMenuItems &&\n                    <div class=\"navbar__container-left-logo-divider\"></div>}\n                </div>}\n              <div class=\"navbar__container-left-content\">\n                <div class=\"navbar__container-left-content-navigation-group\">\n                  <slot name='left-item' />\n                  <div class=\"navbar__container-left-content-navigation-item-search-bar\">\n                    <slot name='search-bar-left' />\n                  </div>\n                </div>\n              </div>\n            </div>\n            <div class={`navbar__container-right ${this.searchBarIsOpen === 'right' ? \"expand\" : this.searchBarIsOpen === 'left' ? 'hide' : \"\"}`}>\n              <div class=\"navbar__container-right-content\">\n                <div class=\"navbar__container-right-content-navigation-group\">\n                  <div class=\"navbar__container-right-content-navigation-item-search-bar\">\n                  <div class={`navbar__container-right-content-navigation-item-search-bar-icon-wrapper`}>\n                      <slot name='search-bar-right' />\n                    </div>\n                  </div>\n                  <slot name='right-item' />\n                </div>\n              </div>\n\n              {/* MOBILE MENU BUTTON */}\n              <div class={`navbar__burger-icon-wrapper`} onClick={this.handleSidebar.bind(this)}>\n                <div class=\"navbar__burger-icon\">\n                  <ifx-icon icon=\"menu-right-24\"></ifx-icon>\n                </div>\n                <div class=\"navbar__cross-icon\">\n                  <ifx-icon icon=\"cross-24\"></ifx-icon>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        {/* SIDEBAR */}\n        <div class=\"navbar__sidebar\">\n          {/* left side ifx-navbar-item  */}\n          <div class=\"navbar__sidebar-top-row\">\n            <div class=\"navbar__sidebar-top-row-wrapper\">\n              <slot name='mobile-menu-top' />\n            </div>\n          </div>\n\n          {/* right side ifx-navbar-item  */}\n          <div class=\"navbar__sidebar-bottom-row\">\n            <slot name='mobile-menu-bottom' onSlotchange={(e) => this.handleMobileMenuBottom(e)} />\n          </div>\n          \n        </div>\n      </div>\n    );\n  }\n}"],"version":3}

package/dist/cjs/ifx-search-bar.cjs.entry.js

@@ -11,19 +11,19 @@ const SearchBar = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.ifxInput = index.createEvent(this, "ifxInput", 7);
-        this.ifxOpen = index.createEvent(this, "ifxOpen", 7);
+        this.ifxSearchBarIsOpen = index.createEvent(this, "ifxSearchBarIsOpen", 7);
         this.isOpen = true;
         this.disabled = false;
         this.handleCloseButton = () => {
             this.internalState = !this.internalState;
-            this.ifxOpen.emit(this.internalState);
+            this.ifxSearchBarIsOpen.emit(this.internalState);
         };
         this.handleFocus = () => {
             this.internalState = true;
         };
     }
     async onNavbarMobile() {
-        this.ifxOpen.emit(false);
+        this.ifxSearchBarIsOpen.emit(false);
         this.internalState = false;
     }
     handlePropChange() {
@@ -34,13 +34,13 @@ const SearchBar = class {
     }
     componentWillLoad() {
         this.setInitialState();
-        this.ifxOpen.emit(this.internalState);
+        this.ifxSearchBarIsOpen.emit(this.internalState);
     }
     handleInput(event) {
         this.value = event.detail;
     }
     render() {
-        return (index.h("div", { key: 'e1875ac2a7a96e59f77f3ecf7cc4079fe8509bf8', "aria-label": 'a search bar', "aria-disabled": this.disabled, class: `search-bar ${this.internalState ? 'open' : 'closed'}` }, this.internalState ? (index.h("div", { class: "search-bar-wrapper" }, index.h("ifx-search-field", { disabled: this.disabled, value: this.value, maxlength: this.maxlength, onIfxInput: this.handleInput.bind(this) }, index.h("ifx-icon", { icon: "search-16", slot: "search-icon" })), index.h("a", { tabindex: "-1", href: 'javascript:void(0)', onClick: this.handleCloseButton }, "Close"))) : (index.h("div", { class: "search-bar__icon-wrapper", onClick: this.handleCloseButton }, index.h("ifx-icon", { icon: "search-16" })))));
+        return (index.h("div", { key: '80312faf68e6b0af2260c977d53f23b42067813f', "aria-label": 'a search bar', "aria-disabled": this.disabled, class: `search-bar ${this.internalState ? 'open' : 'closed'}` }, this.internalState ? (index.h("div", { class: "search-bar-wrapper" }, index.h("ifx-search-field", { disabled: this.disabled, value: this.value, maxlength: this.maxlength, onIfxInput: this.handleInput.bind(this) }, index.h("ifx-icon", { icon: "search-16", slot: "search-icon" })), index.h("a", { tabindex: "-1", href: 'javascript:void(0)', onClick: this.handleCloseButton }, "Close"))) : (index.h("div", { class: "search-bar__icon-wrapper", onClick: this.handleCloseButton }, index.h("ifx-icon", { icon: "search-16" })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ifx-search-bar.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"ifx-search-bar.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,05BAA05B,CAAC;AACh7B,2BAAe,YAAY;;MCOd,SAAS;IALtB;;;;QAMU,WAAM,GAAY,IAAI,CAAC;QACvB,aAAQ,GAAY,KAAK,CAAC;QAmBlC,sBAAiB,GAAG;YAClB,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;YACzC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;SACtC,CAAA;QAkBD,gBAAW,GAAG;YACZ,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;SAC3B,CAAA;KAsBF;IAvDC,MAAM,cAAc;QAClB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;KAC5B;IAGD,gBAAgB;QACd,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;KAClC;IAOD,eAAe;QACb,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;KAClC;IAID,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;KACtC;IAGD,WAAW,CAAC,KAAkB;QAC5B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;KAC3B;IAOD,MAAM;QACJ,QACEA,gFAAgB,cAAc,mBAAgB,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,cAAc,IAAI,CAAC,aAAa,GAAG,MAAM,GAAG,QAAQ,EAAE,IACvH,IAAI,CAAC,aAAa,IACjBA,iBAAK,KAAK,EAAC,oBAAoB,IAC7BA,8BAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAC9HA,sBAAU,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,aAAa,GAAY,CACxC,EAEnBA,eAAG,QAAQ,EAAC,IAAI,EAAC,IAAI,EAAC,oBAAoB,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,YAAW,CACjF,KAENA,iBAAK,KAAK,EAAC,0BAA0B,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,IACnEA,sBAAU,IAAI,EAAC,WAAW,GAAY,CAClC,CACP,CACG,EACN;KACH;;;;;;;;;;","names":["h"],"sources":["src/components/search-bar/search-bar.scss?tag=ifx-search-bar&encapsulation=shadow","src/components/search-bar/search-bar.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  width: 100%; //revert\n  display: flex;\n}\n\n.search-bar {\n  box-sizing: border-box;\n  height: tokens.$ifxSize500;\n  background-color: tokens.$ifxColorBaseWhite;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n  font-family: var(--ifx-font-family);\n\n  &.closed {\n    display: flex;\n    width: auto;\n    justify-content: flex-start;\n  }\n\n  & .search-bar-wrapper {\n    display: flex;\n    align-items: center;\n    gap: tokens.$ifxSpace200;\n    width: 100%;\n\n    & a {\n      text-decoration: none;\n      font-size: tokens.$ifxFontSizeM;\n      font-style: normal;\n      font-weight: tokens.$ifxFontWeightSemibold;\n      line-height: tokens.$ifxLineHeightM;\n      color: tokens.$ifxColorOcean500;\n      cursor: pointer;\n    }\n\n    & ifx-search-field {\n      width: 100%;\n    }\n  }\n\n  .search-bar__icon-wrapper {\n    display: none;\n    flex-direction: row;\n    align-items: center;\n\n    & ifx-icon:hover {\n      cursor: pointer;\n    }\n  }\n\n  &.closed {\n    .search-bar__icon-wrapper {\n      display: flex;\n    }\n\n    .search-bar-wrapper {\n      display: none;\n    }\n  }\n}","import { Component, h, Prop, Event, EventEmitter, State, Watch, Element, Method } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-search-bar',\n  styleUrl: 'search-bar.scss',\n  shadow: true,\n})\nexport class SearchBar {\n  @Prop() isOpen: boolean = true;\n  @Prop() disabled: boolean = false;\n  @State() internalState: boolean;\n  @Prop({ mutable: true }) value: string;\n  @Prop() maxlength?: number;\n  @Event() ifxInput: EventEmitter;\n  @Event() ifxOpen: EventEmitter;\n  @Element() el;\n\n  @Method()\n  async onNavbarMobile() {\n    this.ifxOpen.emit(false)\n    this.internalState = false;\n  }\n\n  @Watch('isOpen')\n  handlePropChange() {\n    this.internalState = this.isOpen;\n  }\n\n  handleCloseButton = () => {\n    this.internalState = !this.internalState;\n    this.ifxOpen.emit(this.internalState)\n  }\n\n  setInitialState() {\n    this.internalState = this.isOpen;\n  }\n\n  \n\n  componentWillLoad() {\n    this.setInitialState();\n    this.ifxOpen.emit(this.internalState)\n  }\n\n\n  handleInput(event: CustomEvent) {\n    this.value = event.detail;\n  }\n\n  handleFocus = () => {\n    this.internalState = true;\n  }\n\n\n  render() {\n    return (\n      <div aria-label='a search bar' aria-disabled={this.disabled} class={`search-bar ${this.internalState ? 'open' : 'closed'}`}>\n        {this.internalState ? (\n          <div class=\"search-bar-wrapper\">\n            <ifx-search-field disabled={this.disabled} value={this.value} maxlength={this.maxlength} onIfxInput={this.handleInput.bind(this)}>\n              <ifx-icon icon=\"search-16\" slot=\"search-icon\"></ifx-icon>\n            </ifx-search-field>\n\n            <a tabindex=\"-1\" href='javascript:void(0)' onClick={this.handleCloseButton}>Close</a>\n          </div>\n        ) : (\n          <div class=\"search-bar__icon-wrapper\" onClick={this.handleCloseButton}>\n            <ifx-icon icon=\"search-16\"></ifx-icon>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"ifx-search-bar.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,05BAA05B,CAAC;AACh7B,2BAAe,YAAY;;MCOd,SAAS;IALtB;;;;QAMU,WAAM,GAAY,IAAI,CAAC;QACvB,aAAQ,GAAY,KAAK,CAAC;QAmBlC,sBAAiB,GAAG;YAClB,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;YACzC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;SACjD,CAAA;QAkBD,gBAAW,GAAG;YACZ,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;SAC3B,CAAA;KAsBF;IAvDC,MAAM,cAAc;QAClB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACnC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;KAC5B;IAGD,gBAAgB;QACd,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;KAClC;IAOD,eAAe;QACb,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;KAClC;IAID,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;KACjD;IAGD,WAAW,CAAC,KAAkB;QAC5B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;KAC3B;IAOD,MAAM;QACJ,QACEA,gFAAgB,cAAc,mBAAgB,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,cAAc,IAAI,CAAC,aAAa,GAAG,MAAM,GAAG,QAAQ,EAAE,IACvH,IAAI,CAAC,aAAa,IACjBA,iBAAK,KAAK,EAAC,oBAAoB,IAC7BA,8BAAkB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAC9HA,sBAAU,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,aAAa,GAAY,CACxC,EAEnBA,eAAG,QAAQ,EAAC,IAAI,EAAC,IAAI,EAAC,oBAAoB,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,YAAW,CACjF,KAENA,iBAAK,KAAK,EAAC,0BAA0B,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,IACnEA,sBAAU,IAAI,EAAC,WAAW,GAAY,CAClC,CACP,CACG,EACN;KACH;;;;;;;;;;","names":["h"],"sources":["src/components/search-bar/search-bar.scss?tag=ifx-search-bar&encapsulation=shadow","src/components/search-bar/search-bar.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  width: 100%; //revert\n  display: flex;\n}\n\n.search-bar {\n  box-sizing: border-box;\n  height: tokens.$ifxSize500;\n  background-color: tokens.$ifxColorBaseWhite;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n  font-family: var(--ifx-font-family);\n\n  &.closed {\n    display: flex;\n    width: auto;\n    justify-content: flex-start;\n  }\n\n  & .search-bar-wrapper {\n    display: flex;\n    align-items: center;\n    gap: tokens.$ifxSpace200;\n    width: 100%;\n\n    & a {\n      text-decoration: none;\n      font-size: tokens.$ifxFontSizeM;\n      font-style: normal;\n      font-weight: tokens.$ifxFontWeightSemibold;\n      line-height: tokens.$ifxLineHeightM;\n      color: tokens.$ifxColorOcean500;\n      cursor: pointer;\n    }\n\n    & ifx-search-field {\n      width: 100%;\n    }\n  }\n\n  .search-bar__icon-wrapper {\n    display: none;\n    flex-direction: row;\n    align-items: center;\n\n    & ifx-icon:hover {\n      cursor: pointer;\n    }\n  }\n\n  &.closed {\n    .search-bar__icon-wrapper {\n      display: flex;\n    }\n\n    .search-bar-wrapper {\n      display: none;\n    }\n  }\n}","import { Component, h, Prop, Event, EventEmitter, State, Watch, Element, Method } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-search-bar',\n  styleUrl: 'search-bar.scss',\n  shadow: true,\n})\nexport class SearchBar {\n  @Prop() isOpen: boolean = true;\n  @Prop() disabled: boolean = false;\n  @State() internalState: boolean;\n  @Prop({ mutable: true }) value: string;\n  @Prop() maxlength?: number;\n  @Event() ifxInput: EventEmitter;\n  @Event() ifxSearchBarIsOpen: EventEmitter;\n  @Element() el;\n\n  @Method()\n  async onNavbarMobile() {\n    this.ifxSearchBarIsOpen.emit(false)\n    this.internalState = false;\n  }\n\n  @Watch('isOpen')\n  handlePropChange() {\n    this.internalState = this.isOpen;\n  }\n\n  handleCloseButton = () => {\n    this.internalState = !this.internalState;\n    this.ifxSearchBarIsOpen.emit(this.internalState)\n  }\n\n  setInitialState() {\n    this.internalState = this.isOpen;\n  }\n\n  \n\n  componentWillLoad() {\n    this.setInitialState();\n    this.ifxSearchBarIsOpen.emit(this.internalState)\n  }\n\n\n  handleInput(event: CustomEvent) {\n    this.value = event.detail;\n  }\n\n  handleFocus = () => {\n    this.internalState = true;\n  }\n\n\n  render() {\n    return (\n      <div aria-label='a search bar' aria-disabled={this.disabled} class={`search-bar ${this.internalState ? 'open' : 'closed'}`}>\n        {this.internalState ? (\n          <div class=\"search-bar-wrapper\">\n            <ifx-search-field disabled={this.disabled} value={this.value} maxlength={this.maxlength} onIfxInput={this.handleInput.bind(this)}>\n              <ifx-icon icon=\"search-16\" slot=\"search-icon\"></ifx-icon>\n            </ifx-search-field>\n\n            <a tabindex=\"-1\" href='javascript:void(0)' onClick={this.handleCloseButton}>Close</a>\n          </div>\n        ) : (\n          <div class=\"search-bar__icon-wrapper\" onClick={this.handleCloseButton}>\n            <ifx-icon icon=\"search-16\"></ifx-icon>\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/ifx-sidebar-item.cjs.entry.js

@@ -14,8 +14,8 @@ const SidebarItem = class {
         this.ifxSidebarNavigationItem = index.createEvent(this, "ifxSidebarNavigationItem", 7);
         this.ifxSidebarActionItem = index.createEvent(this, "ifxSidebarActionItem", 7);
         this.icon = "";
-        this.showIcon = true;
-        this.showIconWrapper = false;
+        this.hasIcon = true;
+        this.hasIconWrapper = false;
         this.href = "";
         this.internalHref = "";
         this.target = "_self";
@@ -25,6 +25,7 @@ const SidebarItem = class {
         this.active = false; // set to true manually or by clicking on a navigation item
         this.isActionItem = false; // if an item is an action item, it can not become active
         this.internalActiveState = false;
+        this.value = "";
     }
     handleActiveChange(newValue, oldValue) {
         // If the item is an action item, ignore the active prop
@@ -45,10 +46,10 @@ const SidebarItem = class {
     }
     handleConsoleError(event) {
         if (event.detail) {
-            this.showIcon = false;
+            this.hasIcon = false;
         }
         else {
-            this.showIcon = true;
+            this.hasIcon = true;
         }
     }
     handleEventEmission() {
@@ -252,11 +253,11 @@ const SidebarItem = class {
     }
     render() {
         var _a, _b;
-        return (index.h("div", { key: 'f694b74b5953639d0e1d1cc375d5e88ae53265f7' }, index.h("a", { key: 'afcbab9a39bb119dc0a8f4a346793ca63fb9742e', tabIndex: 1, onKeyDown: (event) => this.handleKeyDown(event), href: this.internalHref, onClick: () => this.toggleSubmenu(), target: this.target, class: `sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : ""} ${this.isSubMenuItem ? 'submenu__item' : ""}` }, this.icon &&
-            index.h("div", { key: '050d6035ebdd5c901d5fa1b1040de0e7f9f9d407', class: `sidebar__nav-item-icon-wrapper ${!this.showIcon ? 'noIcon' : ""}` }, index.h("ifx-icon", { key: 'b1f21d286c355632fef8d066d2ac1c1e351d2650', icon: this.icon })), index.h("div", { key: 'a0ffe6926fb340e965c7e95f7e3f4eff104a372b', class: "sidebar__nav-item-label" }, index.h("slot", { key: '624ee2b5d9e67fe2a7357cde95a07529f335b80c' })), (this.isExpandable || ((_a = this.numberIndicator) === null || _a === void 0 ? void 0 : _a.trim())) &&
-            index.h("div", { key: '85bd348a39ab4e6cbdf41957339b98462adfa3cc', class: "sidebar__nav-item-indicator" }, this.isExpandable &&
-                index.h("span", { key: '62bc4ba74b14283331328aee22066b7d67dcf579', class: 'item__arrow-wrapper' }, index.h("ifx-icon", { key: '2c8c0010782627007f2b2d133337d87bb15f1358', icon: "chevron-down-12" })), ((_b = this.numberIndicator) === null || _b === void 0 ? void 0 : _b.trim()) && !this.isExpandable && !this.isNested &&
-                index.h("span", { key: 'd0b2640bdfc164e53c574e9ade8b27c9f61a04f9', class: 'item__number-indicator' }, index.h("ifx-number-indicator", { key: '212760cd2ce36c17236ce3f1bdbdc7632182c6d3' }, this.numberIndicator)))), this.isExpandable && index.h("ul", { key: 'cc729ba4945309755b2ab430c9cbd85f722017df', class: 'expandable__submenu' })));
+        return (index.h("div", { key: '7e8a5430fa8976204cd15dfb6dd72f2bb9361e08' }, index.h("a", { key: '897ddc916a5a348ccfedad8ddee68066fcd1bc2f', tabIndex: 1, onKeyDown: (event) => this.handleKeyDown(event), href: this.internalHref, onClick: () => this.toggleSubmenu(), target: this.target, class: `sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : ""} ${this.isSubMenuItem ? 'submenu__item' : ""}` }, this.icon &&
+            index.h("div", { key: '3e4a19b1bb290de9b368ea4487fe53039953199b', class: `sidebar__nav-item-icon-wrapper ${!this.hasIcon ? 'noIcon' : ""}` }, index.h("ifx-icon", { key: '9c0743f623b9aba7f4d481599f287256141ed22e', icon: this.icon })), index.h("div", { key: '073ef8e817fcd00af12a32ccfa2dab217b249ba3', class: "sidebar__nav-item-label" }, index.h("slot", { key: '5ccbe199e0e47d493ec0987ece9f069344991906' })), (this.isExpandable || ((_a = this.numberIndicator) === null || _a === void 0 ? void 0 : _a.trim())) &&
+            index.h("div", { key: '625d54239153b0f082fcf3f50c7f85404eb0f6f8', class: "sidebar__nav-item-indicator" }, this.isExpandable &&
+                index.h("span", { key: '7674b6448808e9d7bbbec20b2209899b399646c8', class: 'item__arrow-wrapper' }, index.h("ifx-icon", { key: '06f2d84a311adda0c69893de81ca27353be45a64', icon: "chevron-down-12" })), ((_b = this.numberIndicator) === null || _b === void 0 ? void 0 : _b.trim()) && !this.isExpandable && !this.isNested &&
+                index.h("span", { key: '4457322a749a066f34715e44dbd0bb893de9a946', class: 'item__number-indicator' }, index.h("ifx-number-indicator", { key: '6cb4f225acab0ede10a48a22d2f4f12f53edeeeb' }, this.numberIndicator)))), this.isExpandable && index.h("ul", { key: '19ca965d3cad5746b629e7e8bdf127f7bcb13482', class: 'expandable__submenu' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ifx-sidebar-item.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"ifx-sidebar-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,opHAAopH,CAAC;AAC5qH,6BAAe,cAAc;;MCMhB,WAAW;IALxB;;;;;QAOU,SAAI,GAAW,EAAE,CAAA;QAChB,aAAQ,GAAY,IAAI,CAAC;QACzB,oBAAe,GAAY,KAAK,CAAC;QAClC,SAAI,GAAW,EAAE,CAAC;QACjB,iBAAY,GAAW,EAAE,CAAC;QAC3B,WAAM,GAAW,OAAO,CAAC;QACxB,iBAAY,GAAY,KAAK,CAAC;QAC9B,aAAQ,GAAY,IAAI,CAAC;QACzB,kBAAa,GAAY,KAAK,CAAC;QAEhC,WAAM,GAAY,KAAK,CAAC;QACxB,iBAAY,GAAY,KAAK,CAAC;QAE7B,wBAAmB,GAAY,KAAK,CAAC;KA8S/C;IApSC,kBAAkB,CAAC,QAAiB,EAAE,QAAiB;;QAErD,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;YACjC,OAAO;SACR;QACD,IAAI,CAAC,mBAAmB,GAAG,QAAQ,CAAC;QACpC,IAAI,QAAQ,KAAK,QAAQ,EAAE;YACzB,IAAI,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAA;YACtD,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,QAAQ,EAAE;gBACnC,IAAI,CAAC,eAAe,CAAC,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;aACxD;YACD,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,QAAQ,EAAE;gBAClC,IAAI,CAAC,eAAe,CAAC,YAAY,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;aACrD;SACF;KACF;IAKD,kBAAkB,CAAC,KAA2B;QAC5C,IAAI,KAAK,CAAC,MAAM,EAAE;YAChB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;SACvB;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB;KACF;IAED,mBAAmB;;QAEjB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;KAClC;IAED,eAAe,CAAC,EAAE,EAAE,IAAI,EAAE,SAAS;QACjC,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,CAAA;QAC7B,IAAI,IAAI,KAAK,UAAU,EAAE;YACvB,OAAO,EAAE,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;SACxC;KACF;IAED,iBAAiB;QACf,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAA;QAClF,OAAO,iBAAiB,CAAA;KACzB;IAED,UAAU,CAAC,EAAE;QACX,OAAO,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,aAAa,CAAC,oBAAoB,CAAC,CAAA;KAC/C;IAID,mBAAmB,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE;QAC9B,MAAM,YAAY,GAAG,EAAE,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;QAC7D,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7B,OAAO,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;SAC3D;QACD,OAAO,YAAY,CAAC;KACrB;IAED,kBAAkB;QAChB,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAA;QAC1E,OAAO,WAAW,CAAC;KACpB;IAGD,aAAa;QACX,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC3C,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAChD,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;YACvD,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;;YAEjD,IAAI,CAAC,mBAAmB,EAAE,CAAC;SAC5B;aAAM;;;YAGL,IAAI,IAAI,CAAC,YAAY,EAAE;gBACrB,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBACxC,OAAO;aACR;iBAAM;gBACL,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAA;gBACvD,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;aAC7C;;YAED,IAAI,IAAI,CAAC,eAAe,EAAE;gBACxB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;aAC/B;SACF;;;KAGF;IAID,oBAAoB,CAAC,YAAY;QAC/B,MAAM,qBAAqB,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACvD,YAAY,CAAC,OAAO,CAAC,CAAC,EAAe;YACnC,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;YACvC,EAAE,CAAC,WAAW,CAAC,EAAE,CAAC,CAAA;YAClB,qBAAqB,CAAC,WAAW,CAAC,EAAE,CAAC,CAAA;SACtC,CAAC,CAAA;KACH;IAED,sBAAsB;QACpB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;QAC5C,IAAI,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,aAAa,EAAE;YACzD,OAAO,IAAI,CAAC;SACb;;YAAM,OAAO,KAAK,CAAC;KACrB;IAED,uBAAuB;QACrB,MAAM,eAAe,GAAG,IAAI,CAAC,sBAAsB,EAAE,CAAA;QACrD,IAAI,eAAe,EAAE;YACnB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;SACvB;KACF;IAED,wBAAwB;QACtB,MAAM,aAAa,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;QAC5C,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QAC1D,IAAG,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,kBAAkB,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,UAAU,EAAE,iBAAiB,CAAC,EAAE;YAC9H,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;SAC3B;aAAK;YACJ,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;SAC5B;KACF;IAED,QAAQ,CAAC,iBAAiB;QACxB,MAAM,oBAAoB,GAAG,iBAAiB,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;QACtE,MAAM,QAAQ,GAAG,oBAAoB,KAAK,MAAM,CAAC;QACjD,OAAO,QAAQ,CAAA;KAChB;IAED,gBAAgB,CAAC,EAAe;QAC9B,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,CAAC;QAErC,OAAO,aAAa,IAAI,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,aAAa,EAAE;YAC7E,IAAI,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,kBAAkB,EAAE;gBAC9D,OAAO,aAAa,CAAC;aACtB;YACD,aAAa,GAAG,aAAa,CAAC,aAAa,CAAC;SAC7C;QAED,OAAO,IAAI,CAAC;KACb;IAID,iCAAiC,CAAC,QAAQ;;QAExC,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,QAAQ;YAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YACrC,IAAI,QAAQ,EAAE;gBACZ,MAAM,MAAM,GAAG,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,UAAU,EAAE,MAAM,CAAC,CAAC;gBAClE,MAAM,qBAAqB,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBAC1D,IAAI,CAAC,MAAM,EAAE;oBACX,IAAI,CAAC,eAAe,CAAC,qBAAqB,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC;iBACtE;qBAAM;oBACL,IAAI,CAAC,eAAe,CAAC,qBAAqB,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAC;iBACzE;aACF;;YAGD,MAAM,QAAQ,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC;YAChD,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,UAAU,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;SAC1D,CAAA;;QAGD,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QACjD,aAAa,CAAC,OAAO,CAAC,CAAC,IAAI,KAAK,UAAU,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC;KAC7D;IAGD,OAAO;QACL,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACzC,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC;SAC/B;;YAAM,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC;KACtC;IAED,oBAAoB;QAClB,MAAM,eAAe,GAAG,IAAI,CAAC,sBAAsB,EAAE,CAAA;QACrD,IAAI,eAAe,EAAE;YACnB,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAA;YACxD,OAAO,YAAY,CAAC;SACrB;aAAM;YACL,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAA;YACxD,OAAO,YAAY,CAAC;SACrB;KACF;IAGD,MAAM,gBAAgB;QACpB,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAA;QAC1D,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAA;KACtD;IAGD,MAAM,UAAU,CAAC,EAAW;QACxB,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC3C,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAChD,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QACpD,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAC9C,IAAG,EAAE,EAAC;YACJ,IAAI,CAAC,eAAe,CAAC,cAAc,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAA;YAChE,IAAI,CAAC,eAAe,CAAC,QAAQ,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAA;SAC3D;KACJ;IAGD,MAAM,gBAAgB;QACpB,OAAO,IAAI,CAAC,YAAY,CAAC;KAC1B;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,mBAAmB,EAAE;YAC5B,IAAI,CAAC,gBAAgB,EAAE,CAAA;SACxB;KACF;IAED,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;YACzB,IAAI,CAAC,aAAa,EAAE,CAAA;SACrB;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAChD,IAAI,CAAC,oBAAoB,CAAC,YAAY,CAAC,CAAA;SACxC;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,MAAM,CAAC;QACvC,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC/B,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAChC,IAAI,CAAC,OAAO,EAAE,CAAA;QACd,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAChD,IAAI,YAAY,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;SAC3B;KACF;IAED,mBAAmB;;QAEjB,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE;;YAE5C,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,MAAM,CAAC;;YAGvC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;SAC7C;KACF;IAGD,MAAM;;QACJ,QACEA,oEACEA,gEAAG,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,qBAAqB,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,GAAG,iBAAiB,GAAG,EAAE,IAAI,IAAI,CAAC,aAAa,GAAG,eAAe,GAAG,EAAE,EAAE,IACxR,IAAI,CAAC,IAAI;YACRA,kEAAK,KAAK,EAAE,kCAAkC,CAAC,IAAI,CAAC,QAAQ,GAAG,QAAQ,GAAG,EAAE,EAAE,IAC5EA,uEAAU,IAAI,EAAE,IAAI,CAAC,IAAI,GAAa,CAClC,EACRA,kEAAK,KAAK,EAAC,yBAAyB,IAClCA,oEAAQ,CACJ,EAEN,CAAC,IAAI,CAAC,YAAY,KAAI,MAAA,IAAI,CAAC,eAAe,0CAAE,IAAI,EAAE,CAAA;YAChDA,kEAAK,KAAK,EAAC,6BAA6B,IACrC,IAAI,CAAC,YAAY;gBAChBA,mEAAM,KAAK,EAAC,qBAAqB,IAC/BA,uEAAU,IAAI,EAAC,iBAAiB,GAAG,CAC9B,EAGR,CAAA,MAAA,IAAI,CAAC,eAAe,0CAAE,IAAI,EAAE,KAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;gBACnEA,mEAAM,KAAK,EAAC,wBAAwB,IAClCA,qFAAuB,IAAI,CAAC,eAAe,CAAwB,CAC9D,CAEL,CAEN,EACH,IAAI,CAAC,YAAY,IAAIA,iEAAI,KAAK,EAAC,qBAAqB,GAAM,CAEvD,EACN;KACH;;;;;;;;;;","names":["h"],"sources":["src/components/navigation/sidebar/sidebar-item.scss?tag=ifx-sidebar-item&encapsulation=shadow","src/components/navigation/sidebar/sidebar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  position: relative;\n}\n\n.sidebar__nav-item,\n.sidebar__nav-item.header__section {\n  &:focus {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n\n  &:hover {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n}\n\n.sidebar__nav-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n  padding: 8px 0px;\n  gap: 4px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  cursor: pointer;\n  font-family: var(--ifx-font-family);\n\n  &.extra-padding__bottom {\n    padding: 8px 0px 16px 0px;\n  }\n\n  &.active {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &.active-section {\n    &::before {\n      content: \"\";\n      position: absolute;\n      left: -32px;\n      height: 40px;\n      width: 2px;\n      background: tokens.$ifxColorOcean500;\n    }\n  }\n\n\n  &.open {\n    padding: 8px 0px;\n\n    & .sidebar__nav-item-label {\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          transform: rotate(-180deg);\n        }\n      }\n    }\n  }\n\n  &.header__section {\n    box-sizing: padding-box;\n    border-top: 1px solid tokens.$ifxColorEngineering200;\n    padding: 16px 0px;\n    display: -webkit-flex;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: horizontal;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    \n    &.no-top-border {\n      border-top: none;\n    }\n\n    &.active-section {\n      &::before {\n        content: \"\";\n        position: absolute;\n        left: -32px;\n        height: 40px;\n        width: 2px;\n        background: tokens.$ifxColorOcean500;\n      }\n    }\n\n    &.open {\n      \n      padding: 16px 0px 8px 0px;\n\n      & .sidebar__nav-item-indicator {\n        & .item__arrow-wrapper {\n          & ifx-icon {\n            transform: rotate(-180deg);\n          }\n        }\n      }\n    }\n\n    & .sidebar__nav-item-label {\n      color: tokens.$ifxColorBaseBlack;\n      font-family: Source Sans 3;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 24px;\n    }\n  }\n\n  &.submenu__item {\n    padding: 4px 0px;\n    \n    &.extra-padding__bottom {\n      padding: 4px 0px 16px 0px;\n    }\n  }\n\n  & .sidebar__nav-item-icon-wrapper {\n    display: flex;\n    width: tokens.$ifxSize300;\n    height: tokens.$ifxSize300;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    flex-shrink: 0;\n\n    &.noIcon {\n      display: none;\n    }\n\n    & ifx-icon {\n      width: tokens.$ifxSize200;\n      height: tokens.$ifxSize200;\n    }\n  }\n\n  & .sidebar__nav-item-label {\n    font-style: normal;\n    font-weight: 400;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    display: flex;\n    align-items: center;\n    flex: none;\n    order: 1;\n    flex-grow: 1;\n    cursor: pointer;\n  }\n\n  & .sidebar__nav-item-indicator {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px 4px;\n    flex: none;\n    order: 2;\n    flex-grow: 0;\n  }\n}\n\n.expandable__submenu {\n  display: none;\n  list-style-type: none;\n  flex-direction: column;\n  padding: 0;\n  margin: 0;\n  padding-left: 40px;\n\n  &.open {\n    display: flex;\n  }\n}\n\n.header__section + .expandable__submenu{\n  padding-left: 0;\n}\n","import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-sidebar-item',\n  styleUrl: 'sidebar-item.scss',\n  shadow: true\n})\nexport class SidebarItem {\n  @Element() el;\n  @Prop() icon: string = \"\"\n  @State() showIcon: boolean = true;\n  @State() showIconWrapper: boolean = false;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\";\n  @Prop() target: string = \"_self\";\n  @State() isExpandable: boolean = false;\n  @State() isNested: boolean = true;\n  @State() isSubMenuItem: boolean = false;\n  @Prop() numberIndicator: string;\n  @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n  @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n\n  @State() internalActiveState: boolean = false;\n\n  @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n  @Prop() handleItemClick: (item: HTMLElement) => void;\n\n\n  @Watch('active')\n  handleActiveChange(newValue: boolean, oldValue: boolean) {\n    // If the item is an action item, ignore the active prop\n    if (this.isActionItem) {\n      this.internalActiveState = false;\n      return;\n    }\n    this.internalActiveState = newValue;\n    if (newValue !== oldValue) {\n      let labelElement = this.getNavItem(this.el.shadowRoot)\n      if (!this.isExpandable && !newValue) {\n        this.handleClassList(labelElement, 'remove', 'active');\n      }\n      if (!this.isExpandable && newValue) {\n        this.handleClassList(labelElement, 'add', 'active');\n      }\n    }\n  }\n\n\n\n  @Listen('consoleError')\n  handleConsoleError(event: CustomEvent<boolean>) {\n    if (event.detail) {\n      this.showIcon = false;\n    } else {\n      this.showIcon = true;\n    }\n  }\n\n  handleEventEmission() {\n    // Get the active item section\n    this.ifxSidebarMenu.emit(this.el)\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getExpandableMenu() {\n    const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n    return expandableSubmenu\n  }\n\n  getNavItem(el) {\n    return el?.querySelector('.sidebar__nav-item')\n  }\n\n\n\n  getSidebarMenuItems(el = this.el) {\n    const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n    if (sidebarItems.length === 0) {\n      return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n    }\n    return sidebarItems;\n  }\n\n  getSidebarMenuItem() {\n    const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n    return sidebarItem;\n  }\n\n\n  toggleSubmenu() {\n    if (this.isExpandable) {\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'toggle', 'open');\n      this.handleClassList(menuItem, 'toggle', 'open');\n      // Emit an event with the current component\n      this.handleEventEmission();\n    } else {\n      // If the sidebar item is not expandable, it's a leaf item without a submenu.\n      // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n      if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n        this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n        return;\n      } else { //its a navigation item which becomes active after clicking it\n        this.handleActiveChange(true, this.internalActiveState)\n        this.ifxSidebarNavigationItem.emit(this.el);\n      }\n      // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n      if (this.handleItemClick) {\n        this.handleItemClick(this.el);\n      }\n    }\n    // // Emit an event with the current component\n    // this.handleEventEmission();\n  }\n\n\n\n  handleExpandableMenu(sidebarItems) {\n    const sidebarExpandableMenu = this.getExpandableMenu();\n    sidebarItems.forEach((el: HTMLElement) => {\n      const li = document.createElement('li')\n      li.appendChild(el)\n      sidebarExpandableMenu.appendChild(li)\n    })\n  }\n\n  parentElementIsSidebar() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n      return true;\n    } else return false;\n  }\n\n  checkIfMenuItemIsNested() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      this.isNested = false;\n    }\n  }\n\n  checkIfMenuItemIsSubMenu() {\n    const parentElement = this.el.parentElement;\n    const navItem = this.getNavItem(parentElement.shadowRoot);\n    if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n      this.isSubMenuItem = true;\n    }else {\n      this.isSubMenuItem = false;\n    }\n  }\n\n  isActive(iteratedComponent) {\n    const activeAttributeValue = iteratedComponent.getAttribute('active');\n    const isActive = activeAttributeValue === 'true';\n    return isActive\n  }\n\n  getParentSection(el: HTMLElement) {\n    let parentElement = el.parentElement;\n\n    while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n      if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n        return parentElement;\n      }\n      parentElement = parentElement.parentElement;\n    }\n\n    return null;\n  }\n\n\n\n  handleBorderIndicatorDisplacement(menuItem) {\n    // Recursive function to handle each item\n    const handleItem = (item, menuItem) => {\n      const isActive = this.isActive(item);\n      if (isActive) {\n        const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n        const activeMenuItemSection = this.getActiveItemSection();\n        if (!isOpen) {\n          this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n        } else {\n          this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n        }\n      }\n\n      // Process each child item\n      const children = this.getSidebarMenuItems(item);\n      children.forEach((child) => handleItem(child, menuItem));\n    }\n\n    // Start with the top-level items\n    const topLevelItems = this.getSidebarMenuItems();\n    topLevelItems.forEach((item) => handleItem(item, menuItem));\n  }\n\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  getActiveItemSection() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    } else {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    }\n  }\n\n  @Method()\n  async setActiveClasses() {\n    const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n    this.handleClassList(activeMenuItem, 'add', 'active')\n  }\n\n  @Method()\n  async expandMenu(ac: boolean){\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'add', 'open');\n      this.handleClassList(menuItem, 'add', 'open');\n      if(ac){\n        this.handleClassList(expandableMenu, 'remove', 'active-section')\n        this.handleClassList(menuItem, 'remove', 'active-section')\n      }\n  }\n  \n  @Method()\n  async isItemExpandable(){\n    return this.isExpandable;\n  }\n\n  handleActiveState() {\n    if (this.internalActiveState) {\n      this.setActiveClasses()\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter') {\n      this.toggleSubmenu()\n    }\n  }\n\n  componentDidLoad() {\n    this.handleActiveState();\n    if (this.isExpandable) {\n      const sidebarItems = this.getSidebarMenuItems();\n      this.handleExpandableMenu(sidebarItems)\n    }\n  }\n  \n  componentWillLoad() {\n    this.internalActiveState = this.active;\n    this.checkIfMenuItemIsNested();\n    this.checkIfMenuItemIsSubMenu();\n    this.setHref()\n    const sidebarItems = this.getSidebarMenuItems();\n    if (sidebarItems.length !== 0) {\n      this.isExpandable = true;\n    } else {\n      this.isExpandable = false;\n    }\n  }\n\n  componentWillUpdate() {\n    // If the active prop has been set to true and the internalActiveState has not been set to true yet\n    if (this.active && !this.internalActiveState) {\n      // Set the internal active state to true\n      this.internalActiveState = this.active;\n\n      // Emit the event to notify the parent Sidebar\n      this.ifxSidebarNavigationItem.emit(this.el);\n    }\n  }\n\n\n  render() {\n    return (\n      <div>\n        <a tabIndex={1} onKeyDown={(event) => this.handleKeyDown(event)} href={this.internalHref} onClick={() => this.toggleSubmenu()} target={this.target} class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}>\n          {this.icon &&\n            <div class={`sidebar__nav-item-icon-wrapper ${!this.showIcon ? 'noIcon' : \"\"}`}>\n              <ifx-icon icon={this.icon}></ifx-icon>\n            </div>}\n          <div class=\"sidebar__nav-item-label\">\n            <slot />\n          </div>\n          {\n          (this.isExpandable || this.numberIndicator?.trim()) && \n            <div class=\"sidebar__nav-item-indicator\">\n              {this.isExpandable &&\n                <span class='item__arrow-wrapper'>\n                  <ifx-icon icon=\"chevron-down-12\" />\n                </span>\n              }\n\n              {this.numberIndicator?.trim() && !this.isExpandable && !this.isNested &&\n                <span class='item__number-indicator'>\n                  <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n                </span>}\n\n            </div>\n          }\n        </a>\n        {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"ifx-sidebar-item.entry.cjs.js","mappings":"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","names":["h"],"sources":["src/components/navigation/sidebar/sidebar-item.scss?tag=ifx-sidebar-item&encapsulation=shadow","src/components/navigation/sidebar/sidebar-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../../global/font.scss\";\n\n:host {\n  position: relative;\n}\n\n.sidebar__nav-item,\n.sidebar__nav-item.header__section {\n  &:focus {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n\n  &:hover {\n    outline: none;\n\n    & .sidebar__nav-item-icon-wrapper {\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-label {\n      outline: none;\n      color: tokens.$ifxColorOcean600;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          color: tokens.$ifxColorOcean600;\n        }\n      }\n    }\n  }\n}\n\n.sidebar__nav-item {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n  padding: 8px 0px;\n  gap: 4px;\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n  text-decoration: none;\n  color: tokens.$ifxColorBaseBlack;\n  cursor: pointer;\n  font-family: var(--ifx-font-family);\n\n  &.extra-padding__bottom {\n    padding: 8px 0px 16px 0px;\n  }\n\n  &.active {\n    color: tokens.$ifxColorOcean500;\n  }\n\n  &.active-section {\n    &::before {\n      content: \"\";\n      position: absolute;\n      left: -32px;\n      height: 40px;\n      width: 2px;\n      background: tokens.$ifxColorOcean500;\n    }\n  }\n\n\n  &.open {\n    padding: 8px 0px;\n\n    & .sidebar__nav-item-label {\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 24px;\n    }\n\n    & .sidebar__nav-item-indicator {\n      & .item__arrow-wrapper {\n        & ifx-icon {\n          transform: rotate(-180deg);\n        }\n      }\n    }\n  }\n\n  &.header__section {\n    box-sizing: padding-box;\n    border-top: 1px solid tokens.$ifxColorEngineering200;\n    padding: 16px 0px;\n    display: -webkit-flex;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: horizontal;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    \n    &.no-top-border {\n      border-top: none;\n    }\n\n    &.active-section {\n      &::before {\n        content: \"\";\n        position: absolute;\n        left: -32px;\n        height: 40px;\n        width: 2px;\n        background: tokens.$ifxColorOcean500;\n      }\n    }\n\n    &.open {\n      \n      padding: 16px 0px 8px 0px;\n\n      & .sidebar__nav-item-indicator {\n        & .item__arrow-wrapper {\n          & ifx-icon {\n            transform: rotate(-180deg);\n          }\n        }\n      }\n    }\n\n    & .sidebar__nav-item-label {\n      color: tokens.$ifxColorBaseBlack;\n      font-family: Source Sans 3;\n      font-size: 16px;\n      font-style: normal;\n      font-weight: 600;\n      line-height: 24px;\n    }\n  }\n\n  &.submenu__item {\n    padding: 4px 0px;\n    \n    &.extra-padding__bottom {\n      padding: 4px 0px 16px 0px;\n    }\n  }\n\n  & .sidebar__nav-item-icon-wrapper {\n    display: flex;\n    width: tokens.$ifxSize300;\n    height: tokens.$ifxSize300;\n    justify-content: center;\n    align-items: center;\n    gap: tokens.$ifxSpace100;\n    flex-shrink: 0;\n\n    &.noIcon {\n      display: none;\n    }\n\n    & ifx-icon {\n      width: tokens.$ifxSize200;\n      height: tokens.$ifxSize200;\n    }\n  }\n\n  & .sidebar__nav-item-label {\n    font-style: normal;\n    font-weight: 400;\n    font-size: tokens.$ifxFontSizeM;\n    line-height: tokens.$ifxLineHeightM;\n    display: flex;\n    align-items: center;\n    flex: none;\n    order: 1;\n    flex-grow: 1;\n    cursor: pointer;\n  }\n\n  & .sidebar__nav-item-indicator {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    padding: 0px 4px;\n    flex: none;\n    order: 2;\n    flex-grow: 0;\n  }\n}\n\n.expandable__submenu {\n  display: none;\n  list-style-type: none;\n  flex-direction: column;\n  padding: 0;\n  margin: 0;\n  padding-left: 40px;\n\n  &.open {\n    display: flex;\n  }\n}\n\n.header__section + .expandable__submenu{\n  padding-left: 0;\n}\n","import { Component, h, Prop, Element, State, Listen, Watch, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-sidebar-item',\n  styleUrl: 'sidebar-item.scss',\n  shadow: true\n})\nexport class SidebarItem {\n  @Element() el;\n  @Prop() icon: string = \"\"\n  @State() hasIcon: boolean = true;\n  @State() hasIconWrapper: boolean = false;\n  @Prop() href: string = \"\";\n  @State() internalHref: string = \"\";\n  @Prop() target: string = \"_self\";\n  @State() isExpandable: boolean = false;\n  @State() isNested: boolean = true;\n  @State() isSubMenuItem: boolean = false;\n  @Prop() numberIndicator: string;\n  @Prop() active: boolean = false; // set to true manually or by clicking on a navigation item\n  @Prop() isActionItem: boolean = false; // if an item is an action item, it can not become active\n\n  @State() internalActiveState: boolean = false;\n\n  @Event({ bubbles: true, composed: true }) ifxSidebarMenu: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarNavigationItem: EventEmitter;\n  @Event({ bubbles: true, composed: true }) ifxSidebarActionItem: EventEmitter;\n\n\n  @Prop() value: string = \"\"\n  @Prop() handleItemClick: (item: HTMLElement) => void;\n\n\n  @Watch('active')\n  handleActiveChange(newValue: boolean, oldValue: boolean) {\n    // If the item is an action item, ignore the active prop\n    if (this.isActionItem) {\n      this.internalActiveState = false;\n      return;\n    }\n    this.internalActiveState = newValue;\n    if (newValue !== oldValue) {\n      let labelElement = this.getNavItem(this.el.shadowRoot)\n      if (!this.isExpandable && !newValue) {\n        this.handleClassList(labelElement, 'remove', 'active');\n      }\n      if (!this.isExpandable && newValue) {\n        this.handleClassList(labelElement, 'add', 'active');\n      }\n    }\n  }\n\n\n\n  @Listen('consoleError')\n  handleConsoleError(event: CustomEvent<boolean>) {\n    if (event.detail) {\n      this.hasIcon = false;\n    } else {\n      this.hasIcon = true;\n    }\n  }\n\n  handleEventEmission() {\n    // Get the active item section\n    this.ifxSidebarMenu.emit(this.el)\n  }\n\n  handleClassList(el, type, className) {\n    el.classList[type](className)\n    if (type === 'contains') {\n      return el.classList.contains(className)\n    }\n  }\n\n  getExpandableMenu() {\n    const expandableSubmenu = this.el.shadowRoot.querySelector('.expandable__submenu')\n    return expandableSubmenu\n  }\n\n  getNavItem(el) {\n    return el?.querySelector('.sidebar__nav-item')\n  }\n\n\n\n  getSidebarMenuItems(el = this.el) {\n    const sidebarItems = el.querySelectorAll('ifx-sidebar-item');\n    if (sidebarItems.length === 0) {\n      return el.shadowRoot.querySelectorAll('ifx-sidebar-item');\n    }\n    return sidebarItems;\n  }\n\n  getSidebarMenuItem() {\n    const sidebarItem = this.el.shadowRoot.querySelector('.sidebar__nav-item')\n    return sidebarItem;\n  }\n\n\n  toggleSubmenu() {\n    if (this.isExpandable) {\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'toggle', 'open');\n      this.handleClassList(menuItem, 'toggle', 'open');\n      // Emit an event with the current component\n      this.handleEventEmission();\n    } else {\n      // If the sidebar item is not expandable, it's a leaf item without a submenu.\n      // Emit an event to the parent `ifx-sidebar` component to notify it that a leaf item has been clicked.\n      if (this.isActionItem) { //its an action item that eg opens an overlay etc and should not influence the active state of the item\n        this.ifxSidebarActionItem.emit(this.el); // emit new event if isActionItem is true\n        return;\n      } else { //its a navigation item which becomes active after clicking it\n        this.handleActiveChange(true, this.internalActiveState)\n        this.ifxSidebarNavigationItem.emit(this.el);\n      }\n      // If the sidebar item is selectable (not expandable), then call the handler function with the current element.\n      if (this.handleItemClick) {\n        this.handleItemClick(this.el);\n      }\n    }\n    // // Emit an event with the current component\n    // this.handleEventEmission();\n  }\n\n\n\n  handleExpandableMenu(sidebarItems) {\n    const sidebarExpandableMenu = this.getExpandableMenu();\n    sidebarItems.forEach((el: HTMLElement) => {\n      const li = document.createElement('li')\n      li.appendChild(el)\n      sidebarExpandableMenu.appendChild(li)\n    })\n  }\n\n  parentElementIsSidebar() {\n    const parentElement = this.el.parentElement;\n    if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR') {\n      return true;\n    } else return false;\n  }\n\n  checkIfMenuItemIsNested() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      this.isNested = false;\n    }\n  }\n\n  checkIfMenuItemIsSubMenu() {\n    const parentElement = this.el.parentElement;\n    const navItem = this.getNavItem(parentElement.shadowRoot);\n    if(parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM' && !this.handleClassList(navItem, 'contains', 'header__section')) {\n      this.isSubMenuItem = true;\n    }else {\n      this.isSubMenuItem = false;\n    }\n  }\n\n  isActive(iteratedComponent) {\n    const activeAttributeValue = iteratedComponent.getAttribute('active');\n    const isActive = activeAttributeValue === 'true';\n    return isActive\n  }\n\n  getParentSection(el: HTMLElement) {\n    let parentElement = el.parentElement;\n\n    while (parentElement && parentElement.tagName.toUpperCase() !== 'IFX-SIDEBAR') {\n      if (parentElement.tagName.toUpperCase() === 'IFX-SIDEBAR-ITEM') {\n        return parentElement;\n      }\n      parentElement = parentElement.parentElement;\n    }\n\n    return null;\n  }\n\n\n\n  handleBorderIndicatorDisplacement(menuItem) {\n    // Recursive function to handle each item\n    const handleItem = (item, menuItem) => {\n      const isActive = this.isActive(item);\n      if (isActive) {\n        const isOpen = this.handleClassList(menuItem, 'contains', 'open');\n        const activeMenuItemSection = this.getActiveItemSection();\n        if (!isOpen) {\n          this.handleClassList(activeMenuItemSection, 'add', 'active-section');\n        } else {\n          this.handleClassList(activeMenuItemSection, 'remove', 'active-section');\n        }\n      }\n\n      // Process each child item\n      const children = this.getSidebarMenuItems(item);\n      children.forEach((child) => handleItem(child, menuItem));\n    }\n\n    // Start with the top-level items\n    const topLevelItems = this.getSidebarMenuItems();\n    topLevelItems.forEach((item) => handleItem(item, menuItem));\n  }\n\n\n  setHref() {\n    if (this.href.toLowerCase().trim() === \"\") {\n      this.internalHref = undefined;\n    } else this.internalHref = this.href;\n  }\n\n  getActiveItemSection() {\n    const parentIsSidebar = this.parentElementIsSidebar()\n    if (parentIsSidebar) {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    } else {\n      const labelElement = this.getNavItem(this.el.shadowRoot)\n      return labelElement;\n    }\n  }\n\n  @Method()\n  async setActiveClasses() {\n    const activeMenuItem = this.getNavItem(this.el.shadowRoot)\n    this.handleClassList(activeMenuItem, 'add', 'active')\n  }\n\n  @Method()\n  async expandMenu(ac: boolean){\n      const menuItem = this.getSidebarMenuItem();\n      const expandableMenu = this.getExpandableMenu();\n      this.handleClassList(expandableMenu, 'add', 'open');\n      this.handleClassList(menuItem, 'add', 'open');\n      if(ac){\n        this.handleClassList(expandableMenu, 'remove', 'active-section')\n        this.handleClassList(menuItem, 'remove', 'active-section')\n      }\n  }\n  \n  @Method()\n  async isItemExpandable(){\n    return this.isExpandable;\n  }\n\n  handleActiveState() {\n    if (this.internalActiveState) {\n      this.setActiveClasses()\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter') {\n      this.toggleSubmenu()\n    }\n  }\n\n  componentDidLoad() {\n    this.handleActiveState();\n    if (this.isExpandable) {\n      const sidebarItems = this.getSidebarMenuItems();\n      this.handleExpandableMenu(sidebarItems)\n    }\n  }\n  \n  componentWillLoad() {\n    this.internalActiveState = this.active;\n    this.checkIfMenuItemIsNested();\n    this.checkIfMenuItemIsSubMenu();\n    this.setHref()\n    const sidebarItems = this.getSidebarMenuItems();\n    if (sidebarItems.length !== 0) {\n      this.isExpandable = true;\n    } else {\n      this.isExpandable = false;\n    }\n  }\n\n  componentWillUpdate() {\n    // If the active prop has been set to true and the internalActiveState has not been set to true yet\n    if (this.active && !this.internalActiveState) {\n      // Set the internal active state to true\n      this.internalActiveState = this.active;\n\n      // Emit the event to notify the parent Sidebar\n      this.ifxSidebarNavigationItem.emit(this.el);\n    }\n  }\n\n\n  render() {\n    return (\n      <div>\n        <a tabIndex={1} onKeyDown={(event) => this.handleKeyDown(event)} href={this.internalHref} onClick={() => this.toggleSubmenu()} target={this.target} class={`sidebar__nav-item ${!this.isNested && this.isExpandable ? 'header__section' : \"\"} ${this.isSubMenuItem ? 'submenu__item' : \"\"}`}>\n          {this.icon &&\n            <div class={`sidebar__nav-item-icon-wrapper ${!this.hasIcon ? 'noIcon' : \"\"}`}>\n              <ifx-icon icon={this.icon}></ifx-icon>\n            </div>}\n          <div class=\"sidebar__nav-item-label\">\n            <slot />\n          </div>\n          {\n          (this.isExpandable || this.numberIndicator?.trim()) && \n            <div class=\"sidebar__nav-item-indicator\">\n              {this.isExpandable &&\n                <span class='item__arrow-wrapper'>\n                  <ifx-icon icon=\"chevron-down-12\" />\n                </span>\n              }\n\n              {this.numberIndicator?.trim() && !this.isExpandable && !this.isNested &&\n                <span class='item__number-indicator'>\n                  <ifx-number-indicator>{this.numberIndicator}</ifx-number-indicator>\n                </span>}\n\n            </div>\n          }\n        </a>\n        {this.isExpandable && <ul class='expandable__submenu'></ul>}\n\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/ifx-status.cjs.entry.js

@@ -4,18 +4,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-a6167356.js');
 
-const statusCss = ":root{--ifx-font-family:\"Source Sans 3\";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-block}.container{display:flex;min-height:1.25em;align-items:center;padding:0 8px;border-radius:9999px;font-family:var(--ifx-font-family)}.container.no-border{padding:0}.container.border-orange{border:1px solid #E16B25}.container.border-ocean{border:1px solid #0A8276}.container.border-grey{border:1px solid #575352}.container.border-light-grey{border:1px solid #BFBBBB}.container.border-red{border:1px solid #CD002F}.container.border-green{border:1px solid #4CA460}.container.border-berry{border:1px solid #9C216E}.text{margin:0;padding-left:4px;font-style:normal;font-weight:600;font-size:1rem;line-height:1.25rem;display:inline;color:#1D1D1D}.dot{display:inline-block;width:8px;height:8px;border-radius:9999px}.dot.orange{background-color:#E16B25}.dot.ocean{background-color:#0A8276}.dot.grey{background-color:#575352}.dot.light-grey{background-color:#BFBBBB}.dot.red{background-color:#CD002F}.dot.green{background-color:#4CA460}.dot.berry{background-color:#9C216E}";
+const statusCss = ":root{--ifx-font-family:\"Source Sans 3\";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-block}.container{display:flex;min-height:1.25em;align-items:center;padding:0 8px;border-radius:9999px;font-family:var(--ifx-font-family)}.container.no-border{padding:0}.container.border-engineering-100{border:1px solid #F7F7F7}.container.border-engineering-200{border:1px solid #EEEDED}.container.border-engineering-300{border:1px solid #BFBBBB}.container.border-engineering-400{border:1px solid #8D8786}.container.border-engineering-500{border:1px solid #575352}.container.border-engineering-600{border:1px solid #3C3A39}.container.border-ocean-100{border:1px solid #DFF4F3}.container.border-ocean-200{border:1px solid #B8DEDA}.container.border-ocean-300{border:1px solid #6CB4AD}.container.border-ocean-400{border:1px solid #3B9B91}.container.border-ocean-500{border:1px solid #0A8276}.container.border-ocean-600{border:1px solid #08665C}.container.border-ocean-700{border:1px solid #06534B}.container.border-red-500{border:1px solid #CD002F}.container.border-red-600{border:1px solid #A2001E}.container.border-red-700{border:1px solid #900021}.container.border-orange-500{border:1px solid #E16B25}.container.border-green-500{border:1px solid #4CA460}.container.border-lawn-400{border:1px solid #B9D257}.container.border-lawn-500{border:1px solid #9BBA43}.container.border-lawn-700{border:1px solid #3C6C0F}.container.border-berry-400{border:1px solid #BE3283}.container.border-berry-500{border:1px solid #9C216E}.container.border-sun-400{border:1px solid #FF9737}.container.border-sun-500{border:1px solid #F97414}.container.border-sand-400{border:1px solid #FBE273}.container.border-sand-500{border:1px solid #FCD442}.text{margin:0;padding-left:4px;font-style:normal;font-weight:600;font-size:1rem;line-height:1.25rem;display:inline;color:#1D1D1D}.dot{display:inline-block;width:8px;height:8px;border-radius:9999px}.dot.engineering-100{background-color:#F7F7F7}.dot.engineering-200{background-color:#EEEDED}.dot.engineering-300{background-color:#BFBBBB}.dot.engineering-400{background-color:#8D8786}.dot.engineering-500{background-color:#575352}.dot.engineering-600{background-color:#3C3A39}.dot.ocean-100{background-color:#DFF4F3}.dot.ocean-200{background-color:#B8DEDA}.dot.ocean-300{background-color:#6CB4AD}.dot.ocean-400{background-color:#3B9B91}.dot.ocean-500{background-color:#0A8276}.dot.ocean-600{background-color:#08665C}.dot.ocean-700{background-color:#06534B}.dot.red-500{background-color:#CD002F}.dot.red-600{background-color:#A2001E}.dot.red-700{background-color:#900021}.dot.orange-500{background-color:#E16B25}.dot.green-500{background-color:#4CA460}.dot.lawn-400{background-color:#B9D257}.dot.lawn-500{background-color:#9BBA43}.dot.lawn-700{background-color:#3C6C0F}.dot.berry-400{background-color:#BE3283}.dot.berry-500{background-color:#9C216E}.dot.sun-400{background-color:#FF9737}.dot.sun-500{background-color:#F97414}.dot.sand-400{background-color:#FBE273}.dot.sand-500{background-color:#FCD442}";
 const IfxStatusStyle0 = statusCss;
 
 const Status = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.border = false;
-        this.color = 'orange';
+        this.color = 'orange-500';
     }
     render() {
         const containerClass = this.border ? `container border-${this.color}` : 'container no-border';
-        return (index.h("div", { key: '6e25a145cdcaee5a2137c94531b84c97b28c8a01', "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, index.h("span", { key: '5c43e25f62e1bafb8e856b786de7bc9a37e0ff4d', class: `dot ${this.color}` }), index.h("p", { key: '1d64598bbef69fc6de5e7dc529afb43f9cd0236b', class: "text" }, this.label)));
+        return (index.h("div", { key: '65a10417bf283f3312ba0cfc503dcc5289df8390', "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, index.h("span", { key: '5294071cb48aca92f02532b0ef09f3b7bd2842c8', class: `dot ${this.color}` }), index.h("p", { key: 'cf92305b5467ef56320e706be7a486f2a6cbb5a5', class: "text" }, this.label)));
     }
 };
 Status.style = IfxStatusStyle0;

package/dist/cjs/ifx-status.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"ifx-status.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,ujCAAujC,CAAC;AAC1kC,wBAAe,SAAS;;MCQX,MAAM;IANnB;;QAQU,WAAM,GAAY,KAAK,CAAC;QACxB,UAAK,GAA2E,QAAQ,CAAC;KAclG;IAVC,MAAM;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,GAAG,oBAAoB,IAAI,CAAC,KAAK,EAAE,GAAG,qBAAqB,CAAC;QAE9F,QACEA,gFAAgB,oBAAoB,gBAAa,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,cAAc,IAChFA,mEAAM,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,EAAE,GAAS,EACzCA,gEAAG,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,KAAK,CAAK,CAC5B,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/status/status.scss?tag=ifx-status&encapsulation=shadow","src/components/status/status.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-block;\n}\n\n.container {\n  display: flex;\n  min-height: 1.25em;\n  align-items: center;\n  padding: 0 tokens.$ifxSpace100;\n  border-radius: tokens.$ifxBorderRadiusRound;\n  font-family: var(--ifx-font-family);\n\n  &.no-border {\n    padding: 0; // Remove padding when border is not present\n  }\n\n  &.border-orange {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOrange500;\n  }\n\n  &.border-ocean {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean500;\n  }\n\n  &.border-grey {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering500;\n  }\n\n  &.border-light-grey {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering300;\n  }\n\n  &.border-red {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed500;\n  }\n\n  &.border-green {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorGreen500;\n  }\n\n  &.border-berry {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry500;\n  }\n\n\n}\n\n.text {\n  margin: 0;\n  padding-left: tokens.$ifxSpace50;\n  font-style: normal;\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSizeM;\n  line-height: tokens.$ifxLineHeightS;\n  display: inline;\n  color: tokens.$ifxColorBaseBlack;\n}\n\n.dot {\n  display: inline-block;\n  width: tokens.$ifxSize100;\n  height: tokens.$ifxSize100;\n  border-radius: tokens.$ifxBorderRadiusRound;\n}\n\n\n.dot {\n  &.orange {\n    background-color: tokens.$ifxColorOrange500;\n  }\n\n  &.ocean {\n    background-color: tokens.$ifxColorOcean500;\n  }\n\n  &.grey {\n    background-color: tokens.$ifxColorEngineering500;\n  }\n\n  &.light-grey {\n    background-color: tokens.$ifxColorEngineering300;\n  }\n\n  &.red {\n    background-color: tokens.$ifxColorRed500;\n  }\n\n  &.green {\n    background-color: tokens.$ifxColorGreen500;\n  }\n\n  &.berry {\n    background-color: tokens.$ifxColorBerry500;\n  }\n}","import { Component, h, Prop } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-status',\n  styleUrl: 'status.scss',\n  shadow: true\n})\n\nexport class Status {\n  @Prop() label: string;\n  @Prop() border: boolean = false;\n  @Prop() color: 'orange' | 'ocean' | 'grey' | 'light-grey' | 'red' | 'green' | 'berry' = 'orange';\n\n\n\n  render() {\n    const containerClass = this.border ? `container border-${this.color}` : 'container no-border';\n\n    return (\n      <div aria-label=\"a status indicator\" aria-value={this.label} class={containerClass}>\n        <span class={`dot ${this.color}`}></span>\n        <p class=\"text\">{this.label}</p>\n      </div>\n    );\n  }\n}"],"version":3}
+{"file":"ifx-status.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,y9FAAy9F,CAAC;AAC5+F,wBAAe,SAAS;;MCQX,MAAM;IANnB;;QAQU,WAAM,GAAY,KAAK,CAAC;QACxB,UAAK,GAAkZ,YAAY,CAAC;KAc7a;IAVC,MAAM;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,GAAG,oBAAoB,IAAI,CAAC,KAAK,EAAE,GAAG,qBAAqB,CAAC;QAE9F,QACEA,gFAAgB,oBAAoB,gBAAa,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,cAAc,IAChFA,mEAAM,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,EAAE,GAAS,EACzCA,gEAAG,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,KAAK,CAAK,CAC5B,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/status/status.scss?tag=ifx-status&encapsulation=shadow","src/components/status/status.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n  display: inline-block;\n}\n\n.container {\n  display: flex;\n  min-height: 1.25em;\n  align-items: center;\n  padding: 0 tokens.$ifxSpace100;\n  border-radius: tokens.$ifxBorderRadiusRound;\n  font-family: var(--ifx-font-family);\n\n  &.no-border {\n    padding: 0; // Remove padding when border is not present\n  }\n\n  &.border-engineering-100{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering100;\n  }\n\n  &.border-engineering-200{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering200;\n  }\n\n  &.border-engineering-300{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering300;\n  }\n\n  &.border-engineering-400{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering400;\n  }\n\n  &.border-engineering-500{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering500;\n  }\n\n  &.border-engineering-600{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering600;\n  }\n\n  &.border-ocean-100 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean100;\n  }\n\n  &.border-ocean-200 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean200;\n  }\n\n  &.border-ocean-300 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean300;\n  }\n\n  &.border-ocean-400 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean400;\n  }\n\n  &.border-ocean-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean500;\n  }\n\n  &.border-ocean-600 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean600;\n  }\n\n  &.border-ocean-700 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOcean700;\n  }\n\n  &.border-red-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed500;\n  }\n\n  &.border-red-600 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed600;\n  }\n\n  &.border-red-700 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorRed700;\n  }\n\n  &.border-orange-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorOrange500;\n  }\n\n  &.border-green-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorGreen500;\n  }\n\n  &.border-lawn-400 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn400;\n  }\n\n  &.border-lawn-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn500;\n  }\n\n  &.border-lawn-700 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorLawn700;\n  }\n\n  &.border-berry-400 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry400;\n  }\n\n  &.border-berry-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorBerry500;\n  }\n\n  &.border-sun-400 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun400;\n  }\n\n  &.border-sun-500 {\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSun500;\n  }\n\n  &.border-sand-400{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand400;\n  }\n\n  &.border-sand-500{\n    border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorSand500;\n  }\n\n\n}\n\n.text {\n  margin: 0;\n  padding-left: tokens.$ifxSpace50;\n  font-style: normal;\n  font-weight: tokens.$ifxFontWeightSemibold;\n  font-size: tokens.$ifxFontSizeM;\n  line-height: tokens.$ifxLineHeightS;\n  display: inline;\n  color: tokens.$ifxColorBaseBlack;\n}\n\n.dot {\n  display: inline-block;\n  width: tokens.$ifxSize100;\n  height: tokens.$ifxSize100;\n  border-radius: tokens.$ifxBorderRadiusRound;\n}\n\n\n.dot {\n  &.engineering-100 {\n    background-color: tokens.$ifxColorEngineering100;\n  }\n\n  &.engineering-200 {\n    background-color: tokens.$ifxColorEngineering200;\n  }\n\n  &.engineering-300 {\n    background-color: tokens.$ifxColorEngineering300;\n  }\n\n  &.engineering-400 {\n    background-color: tokens.$ifxColorEngineering400;\n  }\n\n  &.engineering-500 {\n    background-color: tokens.$ifxColorEngineering500;\n  }\n\n  &.engineering-600 {\n    background-color: tokens.$ifxColorEngineering600;\n  }\n\n  &.ocean-100 {\n    background-color: tokens.$ifxColorOcean100;\n  }\n\n  &.ocean-200 {\n    background-color: tokens.$ifxColorOcean200;\n  }\n\n  &.ocean-300 {\n    background-color: tokens.$ifxColorOcean300;\n  }\n\n  &.ocean-400 {\n    background-color: tokens.$ifxColorOcean400;\n  }\n\n  &.ocean-500 {\n    background-color: tokens.$ifxColorOcean500;\n  }\n\n  &.ocean-600 {\n    background-color: tokens.$ifxColorOcean600;\n  }\n\n  &.ocean-700 {\n    background-color: tokens.$ifxColorOcean700;\n  }\n\n  &.red-500 {\n    background-color: tokens.$ifxColorRed500;\n  }\n\n  &.red-600 {\n    background-color: tokens.$ifxColorRed600;\n  }\n\n  &.red-700 {\n    background-color: tokens.$ifxColorRed700;\n  }\n\n  &.orange-500 {\n    background-color: tokens.$ifxColorOrange500;\n  }\n\n  &.green-500 {\n    background-color: tokens.$ifxColorGreen500;\n  }\n\n  &.lawn-400{\n    background-color: tokens.$ifxColorLawn400;\n  }\n\n  &.lawn-500{\n    background-color: tokens.$ifxColorLawn500;\n  }\n\n  &.lawn-700 {\n    background-color: tokens.$ifxColorLawn700;\n  }\n\n  &.berry-400 {\n    background-color: tokens.$ifxColorBerry400;\n  }\n\n  &.berry-500 {\n    background-color: tokens.$ifxColorBerry500;\n  }\n\n  &.sun-400 {\n    background-color: tokens.$ifxColorSun400;\n  }\n\n  &.sun-500 {\n    background-color: tokens.$ifxColorSun500;\n  }\n\n  &.sand-400{\n    background-color: tokens.$ifxColorSand400;\n  }\n\n  &.sand-500{\n    background-color: tokens.$ifxColorSand500;\n  }\n}","import { Component, h, Prop } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-status',\n  styleUrl: 'status.scss',\n  shadow: true\n})\n\nexport class Status {\n  @Prop() label: string;\n  @Prop() border: boolean = false;\n  @Prop() color: 'engineering-100' | 'engineering-200' | 'engineering-300' | 'engineering-400' | 'engineering-500' | 'engineering-600' | 'ocean-100' | 'ocean-200' | 'ocean-300' | 'ocean-400' | 'ocean-500' | 'ocean-600' | 'ocean-700' | 'red-500' | 'red-600' | 'red-700' | 'orange-500' | 'green-500' | 'lawn-400' | 'lawn-500' | 'lawn-700' | 'berry-400' | 'berry-500' | 'sun-400' | 'sun-500' | 'sand-400' | 'sand-500' = 'orange-500';\n\n\n\n  render() {\n    const containerClass = this.border ? `container border-${this.color}` : 'container no-border';\n\n    return (\n      <div aria-label=\"a status indicator\" aria-value={this.label} class={containerClass}>\n        <span class={`dot ${this.color}`}></span>\n        <p class=\"text\">{this.label}</p>\n      </div>\n    );\n  }\n}"],"version":3}