@ukic/web-components 2.1.0-beta.9 → 2.3.0

package/dist/core/p-d592006b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icSideNavigationCss","SideNavigation","this","ANIMATION_DURATION","parseInt","getCssProperty","IC_NAVIGATION_ITEM","resizeObserver","COLLAPSED_ICON_LABELS_END","COLLAPSED_ICON_LABELS_START","emitSideNavigationExpanded","objDetails","event","CustomEvent","detail","sideNavExpanded","sideNavMobile","el","dispatchEvent","toggleMenu","menuOpen","setMobileMenuAriaAttributes","arrangeSlottedNavigationItem","setToggleMenuFlyoutMenuVisibility","sideNav","shadowRoot","querySelector","sideNavInner","bottomWrapper","menuVisibilityVisible","classList","add","setTimeout","remove","nativeButton","setAttribute","setAndRemoveNoWrapAfterMenuExpanded","appTitle","toggleMenuExpanded","menuExpanded","displayTooltipWithExpandedLongLabel","collapsedIconLabels","animateCollapsedIconLabels","setExpandedButtonHeight","navItems","querySelectorAll","forEach","navItem","hasUsedSlot","isSlotUsed","navItemSlot","iconWrapper","document","createElement","icon","label","textContent","trim","icTypography","style","height","append","styleSlottedCollapsedIconLabels","styleSlottedIconLabels","marginTop","whiteSpace","overflow","textOverflow","appStatusWrapper","offsetHeight","setProperty","opacity","visibility","transition","transitionHandler","type","primaryNavigationWrapper","secondaryNavigationWrapper","classToRemove","classToAdd","transitionEndHandler","addEventListener","paddingIconWidth","navItemLink","navItemSVG","navStyles","gap","window","getComputedStyle","iconWidth","width","paddingLeft","Object","values","reduce","prev","curr","timer","sideNavWidth","clientWidth","navigationItems","Array","from","paddingIconDelta","length","navigationItem","icTypographyScrollWidth","_a","scrollWidth","_b","clearTimeout","setMenuExpanded","expanded","setParentPaddingTop","value","parentElement","setParentPaddingLeft","renderAppTitle","isAppNameSubtitleVariant","displayShortAppTitle","deviceSize","DEVICE_SIZES","S","isEmptyString","shortAppTitle","h","variant","undefined","resizeObserverCallback","currSize","disableAutoParentStyling","topBarHeight","scrollHeight","inline","L","M","static","runResizeObserver","ResizeObserver","getCurrentDeviceSize","deviceSizeAppTitle","observe","body","box","setCollapsedIconLabels","styleSlottedCollapsedIconLabel","dynamicSlottedIcTypographyComps","contains","renderTopBar","isSDevice","foregroundColor","href","hasTitle","Component","attrs","class","id","size","appearance","onClick","slot","innerHTML","closeIcon","menuIcon","assign","name","XL","getThemeForegroundColor","componentWillLoad","hasSecondaryNavigation","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","propName","disconnectedCallback","disconnect","removeEventListener","themeChangeHandler","ev","theme","mode","render","status","version","isMdDevice","isLgDevice","displayExpandBtn","topBarProps","Host","IcThemeForegroundEnum","Dark","hasClassificationBanner","chevronIcon"],"sources":["./src/components/ic-side-navigation/ic-side-navigation.css?tag=ic-side-navigation&encapsulation=shadow","./src/components/ic-side-navigation/ic-side-navigation.tsx"],"sourcesContent":["/**\n * @prop --ic-z-index-side-navigation: z-index of side navigation panel\n */\n\n:host {\n  display: block;\n\n  --side-navigation-position: fixed;\n  --side-navigation-position-left: 0;\n  --side-navigation-position-top: var(--ic-space-xxl);\n  --side-navigation-height: var(--ic-space-xxl);\n  --sm-side-navigation-top-bar-height: 3.5rem;\n  --sm-side-navigation-collapsed-labels-width: 6rem;\n  --sm-side-navigation-expand-transition-duration: var(\n    --ic-transition-duration-slow\n  );\n  --side-navigation-width: 20rem;\n  --sm-side-navigation-bottom-bar-height: 3.5rem;\n\n  z-index: var(--ic-z-index-side-navigation);\n}\n\n:host > * {\n  box-sizing: border-box;\n}\n\n.side-navigation {\n  display: flex;\n  flex-direction: column;\n  width: var(--side-navigation-width);\n  color: var(--ic-theme-text);\n  position: var(--side-navigation-position);\n  top: var(--side-navigation-position-top);\n  left: calc(var(--side-navigation-width) * -1);\n  bottom: 0;\n  background-color: var(--ic-theme-primary);\n  z-index: var(--ic-z-index-side-navigation);\n}\n\n:host(.inline) .side-navigation {\n  position: absolute;\n  height: 100%;\n}\n\n:host(.anchor-right) .side-navigation {\n  right: calc(var(--side-navigation-width) * -1);\n}\n\n.classification-spacing {\n  margin-bottom: var(--ic-space-lg);\n}\n\n.navigation-list {\n  padding: 0;\n  margin: 0;\n  list-style: none;\n}\n\n.side-navigation-inner {\n  background-color: var(--ic-theme-primary);\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 0;\n  overflow: auto;\n}\n\n:host(.inline) .side-navigation-inner {\n  flex: 1;\n}\n\n:host(.xs-menu-open) .side-navigation {\n  transition: left var(--ic-easing-transition-slow);\n  left: 0;\n}\n\n:host(.xs-menu-close) .side-navigation {\n  left: calc(var(--side-navigation-width) * -1);\n  transition: left var(--ic-easing-transition-slow);\n}\n\n:host(.xs-menu-close) .side-navigation > * {\n  visibility: hidden;\n}\n\n:host(.anchor-right.xs-menu-open) .side-navigation {\n  right: 0;\n  left: auto;\n}\n\n:host(.anchor-right.xs-menu-close) .side-navigation {\n  right: calc(var(--side-navigation-width) * -1);\n  left: auto;\n  transition: right var(--ic-easing-transition-slow);\n}\n\n.bottom-wrapper {\n  border-top: var(--ic-keyline-lighten);\n  bottom: 0;\n  left: 0;\n  z-index: 2;\n  box-shadow: -0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n  background-color: var(--ic-theme-primary);\n  display: flex;\n  flex-direction: column;\n}\n\n:host(.inline) .bottom-wrapper {\n  position: sticky;\n}\n\n:host(.dark) .bottom-wrapper {\n  border-top: var(--ic-keyline-darken);\n}\n\n/* Mobile Top Bar */\n\n.top-bar {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  min-height: var(--side-navigation-height);\n  padding: var(--ic-space-xs);\n  box-sizing: border-box;\n  background-color: var(--ic-theme-primary);\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  border-bottom: var(--ic-keyline-darken);\n  box-shadow: var(--ic-elevation-overlay);\n  z-index: 2;\n  overflow: hidden;\n  visibility: visible;\n}\n\n:host(.inline) .top-bar {\n  position: absolute;\n}\n\n.top-bar.dark a:focus {\n  box-shadow: var(--ic-border-focus);\n}\n\n.top-bar.light {\n  border-bottom: var(--ic-keyline-lighten);\n}\n\n.app-title-wrapper {\n  display: flex;\n  margin-left: var(--ic-space-xs);\n  border-left: var(--ic-keyline-darken);\n  padding-left: var(--ic-space-xxs);\n  color: var(--ic-theme-text);\n  align-items: center;\n}\n\n.app-title-wrapper ic-typography h1 {\n  margin: 0;\n}\n\n@media screen and (min-width: 340px) {\n  .app-title-wrapper ic-typography {\n    margin-left: var(--ic-space-xs);\n  }\n}\n\n:host .title-link {\n  display: flex;\n  align-items: center;\n  transition: box-shadow var(--ic-easing-transition-fast),\n    background-color var(--ic-easing-transition-fast);\n  text-decoration: none;\n  padding: var(--ic-space-xxs);\n  color: var(--ic-theme-text);\n}\n\n:host .title-link:visited,\n:host .title-link:active {\n  color: var(--ic-theme-text);\n}\n\nslot[name=\"app-title\"]::slotted(a),\nslot[name=\"app-icon\"]::slotted(a) {\n  color: var(--ic-theme-text);\n  outline: none;\n  text-decoration: none;\n}\n\n:host .title-link:hover {\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-theme-hover);\n}\n\n:host .title-link:active {\n  background-color: var(--ic-theme-active);\n}\n\n:host .title-link:focus,\n:host .title-link:focus-within {\n  border-radius: var(--ic-border-radius);\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n  background-color: transparent;\n}\n\n:host .title-link ic-typography {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.app-title-wrapper ::slotted(svg) {\n  fill: var(--ic-theme-text);\n}\n\n.app-icon-container {\n  display: none;\n}\n\n.button-label {\n  display: flex;\n  align-items: center;\n}\n\n.mobile-top-bar-menu-icon {\n  display: flex;\n}\n\n.menu-button {\n  width: 6.5rem;\n}\n\n.app-status-wrapper {\n  inset: 0 var(--ic-space-sm) 0 3.5rem;\n  width: auto;\n  display: flex;\n  gap: var(--ic-space-xs);\n  padding: var(--ic-space-sm) 0;\n  justify-content: flex-end;\n  align-items: flex-end;\n  pointer-events: none;\n  height: fit-content;\n  margin: 0 var(--ic-space-xs);\n}\n\n.app-status-wrapper .app-version {\n  display: flex;\n  overflow-wrap: break-word;\n  padding-bottom: var(--ic-space-xxs);\n}\n\n.app-status-wrapper .app-status {\n  display: flex;\n  border-radius: 1rem;\n  background-color: var(--ic-theme-text);\n  color: var(--ic-color-primary-text);\n  padding: var(--ic-space-xxs) var(--ic-space-lg);\n  min-width: 1rem;\n}\n\n.app-status-wrapper .app-status-text {\n  overflow-wrap: break-word;\n}\n\n:host(.dark) .app-status-wrapper .app-status {\n  color: var(--ic-color-white-text);\n}\n\n.navigation-landmark-title {\n  position: absolute;\n  width: var(--ic-space-1px);\n  height: var(--ic-space-1px);\n  padding: 0;\n  margin: calc(-1 * var(--ic-space-1px));\n  overflow: hidden;\n}\n\n/* Navigation Group */\n\n::slotted(ic-navigation-group) {\n  --navigation-group-height: 2.75rem;\n  --navigation-group-width: 100%;\n  --navigation-group-justify-content: space-between;\n  --navigation-group-hover: var(--ic-theme-hover);\n  --navigation-group-text-hover: var(--ic-theme-text);\n  --navigation-item-child-height: 3.5rem;\n  --navigation-item-child-active: var(--ic-action-dark-bg-active);\n  --navigation-item-child-color: var(--ic-theme-text);\n  --navigation-group-expand-toggle-padding: 0.25rem;\n}\n\n/* Navigation Items */\n\n::slotted(ic-navigation-item),\n::slotted(ic-navigation-group) {\n  --navigation-item-height: 3.5rem;\n  --navigation-item-width: auto;\n  --navigation-item-justify-content: flex-start;\n}\n\n/* Toggle Chevron */\n\n.bottom-side-nav {\n  position: relative;\n  align-content: flex-end;\n  min-height: var(--sm-side-navigation-top-bar-height);\n}\n\n.bottom-side-nav ic-divider {\n  position: absolute;\n  top: 0;\n  width: 100%;\n}\n\n.primary-navigation {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n\n  /* Hide scrollbar when required but keep functionality */\n  scrollbar-width: none;\n}\n\n.primary-navigation::-webkit-scrollbar {\n  display: none;\n}\n\n.primary-navigation,\n.secondary-navigation {\n  overflow-x: hidden;\n}\n\n.bottom-side-nav .menu-expand-button {\n  position: absolute;\n  display: none;\n}\n\n.menu-visibility-visible {\n  visibility: visible;\n  width: 100%;\n}\n\n/* Media Queries */\n\n@media screen and (min-width: 340px) {\n  .app-icon-container {\n    display: flex;\n  }\n}\n\n@media screen and (min-width: 577px) {\n  :host {\n    display: flex;\n    flex-direction: column;\n    height: 100vh;\n    position: var(--side-navigation-position);\n    left: 0;\n    top: 0;\n    bottom: 0;\n  }\n\n  .app-icon-container {\n    padding: var(--ic-space-xxs) 0;\n  }\n\n  .top-bar {\n    --side-navigation-height: var(--sm-side-navigation-top-bar-height);\n\n    position: relative;\n    padding: 0;\n    box-shadow: -0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n  }\n\n  :host(.inline) .top-bar {\n    position: sticky;\n  }\n\n  :host(.anchor-right) .top-bar {\n    box-shadow: 0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n  }\n\n  :host(.anchor-right) .bottom-wrapper {\n    box-shadow: 0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n  }\n\n  .side-navigation,\n  .top-bar {\n    width: var(--sm-side-navigation-top-bar-height);\n  }\n\n  :host(.sm-collapsed) {\n    width: var(--sm-side-navigation-top-bar-height);\n    transition: width var(--ic-easing-transition-slow);\n  }\n\n  :host(.sm-collapsed.collapsed-labels) {\n    width: var(--sm-side-navigation-collapsed-labels-width);\n  }\n\n  :host(.sm-expanded) {\n    width: var(--side-navigation-width);\n    transition: width var(--ic-easing-transition-slow);\n    box-shadow: var(--ic-elevation-overlay);\n  }\n\n  .side-navigation {\n    --side-navigation-position-top: 0;\n\n    flex: 1;\n    position: relative;\n    top: auto;\n    left: auto;\n    bottom: auto;\n  }\n\n  :host(.inline) .side-navigation {\n    position: relative;\n  }\n\n  :host(.anchor-right) .side-navigation {\n    left: auto;\n    right: 0;\n  }\n\n  .app-title-wrapper {\n    margin-left: 0;\n    border-left: none;\n    padding: var(--ic-space-sm);\n  }\n\n  .app-title-wrapper ::slotted(svg) {\n    height: var(--ic-space-lg);\n    width: var(--ic-space-lg);\n  }\n\n  .app-title-wrapper ic-typography {\n    margin: calc(-1 * 0.281rem) 0 calc(-1 * 0.281rem) var(--ic-space-md);\n    font-weight: var(--ic-font-weight-semibold);\n  }\n\n  :host(.sm-collapsed) .app-title-wrapper ic-typography {\n    position: absolute;\n    left: -9999px;\n    opacity: 0;\n    transition: opacity var(--ic-easing-transition-slow);\n  }\n\n  :host(.sm-expanded) ic-typography {\n    position: relative;\n    left: 0;\n  }\n\n  :host(.sm-expanded) :is(.side-navigation, .top-bar) {\n    width: var(--side-navigation-width);\n    transition: width var(--ic-easing-transition-slow);\n  }\n\n  :host(.sm-collapsed) :is(.side-navigation, .top-bar) {\n    width: var(--sm-side-navigation-top-bar-height);\n    transition: width var(--ic-easing-transition-slow);\n  }\n\n  :host(.anchor-right.sm-expanded) :is(.side-navigation, .top-bar) {\n    left: auto;\n    right: 0;\n  }\n\n  .app-status-wrapper,\n  :host(.sm-collapsed) .app-status-wrapper {\n    display: none;\n    margin-left: 0;\n  }\n\n  :host(.sm-expanded) .app-status-wrapper {\n    display: flex;\n    max-width: 16rem;\n    margin-right: calc(var(--ic-space-xxxs) + var(--ic-space-xs));\n  }\n\n  .bottom-side-nav {\n    justify-items: flex-end;\n    align-items: flex-end;\n    justify-content: flex-end;\n    display: flex;\n  }\n\n  .bottom-side-nav .menu-expand-button {\n    padding-left: var(--ic-space-md);\n    height: var(--sm-side-navigation-top-bar-height);\n    width: 100%;\n    color: var(--ic-theme-text);\n    background-color: transparent;\n    outline: var(--ic-hc-focus-outline);\n    border: none;\n    cursor: pointer;\n    display: flex;\n    transition: var(--ic-easing-transition-fast);\n  }\n\n  :host(.sm-expanded) .bottom-side-nav .menu-expand-button {\n    height: 100%;\n  }\n\n  .bottom-side-nav .menu-expand-button svg {\n    justify-items: flex-start;\n    align-self: center;\n    display: inline-block;\n    width: var(--ic-space-lg);\n    height: var(--ic-space-lg);\n  }\n\n  .bottom-side-nav .menu-expand-button:hover {\n    background-color: var(--ic-theme-hover);\n  }\n\n  :host .bottom-side-nav {\n    outline: none;\n  }\n\n  :host .bottom-side-nav .menu-expand-button:focus {\n    box-shadow: var(--ic-border-focus-inset);\n    border-radius: var(--ic-border-radius-inset);\n    background-color: transparent;\n  }\n\n  :host(.sm-collapsed) .bottom-side-nav .menu-expand-button svg {\n    transform: scaleX(1);\n    transition: transform var(--ic-easing-transition-slow);\n  }\n\n  :host(.sm-expanded) .bottom-side-nav .menu-expand-button svg {\n    transform: scaleX(-1);\n    transition: transform var(--ic-easing-transition-slow);\n    align-self: flex-end;\n    margin-bottom: 0.875rem;\n  }\n\n  :host(.anchor-right.sm-collapsed) .bottom-side-nav .menu-expand-button svg {\n    transform: scaleX(-1);\n  }\n\n  :host(.anchor-right.sm-expanded) .bottom-side-nav .menu-expand-button svg {\n    transform: scaleX(1);\n  }\n\n  :host(.sm-collapsed) ::slotted(ic-navigation-item) {\n    --navigation-item-label-opacity: 1;\n  }\n\n  :host(.sm-collapsed) ::slotted(ic-navigation-item),\n  :host(.sm-collapsed) ::slotted(ic-navigation-group) {\n    --navigation-item-label-opacity: 0;\n  }\n\n  :host(.sm-expanded) ::slotted(ic-navigation-item),\n  :host(.sm-expanded) ::slotted(ic-navigation-group) {\n    --navigation-item-label-opacity: 1;\n  }\n\n  :host(.sm-collapsed) ::slotted(ic-navigation-group) {\n    --navigation-group-title-position: absolute;\n    --navigation-group-title-position-left: -9999px;\n    --navigation-group-title-opacity: none;\n  }\n\n  :host(.sm-expanded) ::slotted(ic-navigation-group) {\n    --navigation-group-title-position: relative;\n    --navigation-group-title-position-left: 0;\n    --navigation-group-expand-toggle-padding: 0.25rem;\n    --navigation-group-title-opacity: flex;\n  }\n\n  :host(.sm-collapsed.collapsed-labels) .side-navigation,\n  :host(.sm-collapsed.collapsed-labels) .top-bar {\n    width: var(--sm-side-navigation-collapsed-labels-width);\n  }\n\n  :host(.sm-collapsed.collapsed-labels) .menu-expand-button {\n    padding: 0;\n  }\n\n  :host(.sm-collapsed.collapsed-labels) .app-title-wrapper {\n    width: 100%;\n    justify-content: center;\n  }\n\n  :host(.sm-collapsed.collapsed-labels) ::slotted(ic-navigation-group) {\n    --navigation-group-justify-content: center;\n    --navigation-item-label-opacity: 1;\n    --navigation-group-item-min-width: 100%;\n    --navigation-group-expand-toggle-padding: 1rem;\n  }\n\n  :host(.collapsed-labels) .bottom-side-nav .menu-expand-button {\n    justify-content: center;\n  }\n\n  :host .collapsed-icon-labels-start {\n    visibility: hidden;\n    opacity: 0;\n  }\n\n  :host .collapsed-icon-labels-end {\n    visibility: visible;\n    opacity: 1;\n    transition: visibility 0s, opacity var(--ic-easing-transition-slow);\n  }\n}\n\n@media screen and (min-width: 993px) {\n  :host {\n    position: sticky;\n    left: auto;\n    top: 0;\n    bottom: 0;\n  }\n\n  :host(.sm-expanded) {\n    box-shadow: none;\n  }\n}\n\n@media (forced-colors: active) {\n  .side-navigation,\n  .top-bar {\n    border-right: var(--ic-hc-border);\n  }\n\n  slot[name=\"app-icon\"]::slotted(svg) {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Element,\n  Listen,\n} from \"@stencil/core\";\n\nimport menuIcon from \"../../assets/hamburger-menu-icon.svg\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport {\n  getCurrentDeviceSize,\n  DEVICE_SIZES,\n  checkResizeObserver,\n  isSlotUsed,\n  getThemeForegroundColor,\n  getCssProperty,\n  hasClassificationBanner,\n  onComponentRequiredPropUndefined,\n  isEmptyString,\n} from \"../../utils/helpers\";\nimport {\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcTopBar } from \"./ic-side-navigation.types\";\n\n/**\n * @slot app-icon - Content will be rendered adjacent to the app title at the very top of the side navigation.\n * @slot app-title - Handle routing by nesting a route in the app title.\n * @slot primary-navigation - Content will be rendered at the top of the side navigation.\n * @slot secondary-navigation - Content will be rendered at the bottom of the side navigation.\n */\n\n@Component({\n  tag: \"ic-side-navigation\",\n  styleUrl: \"ic-side-navigation.css\",\n  shadow: true,\n})\nexport class SideNavigation {\n  private ANIMATION_DURATION =\n    parseInt(getCssProperty(\"--ic-transition-duration-slow\")) || 0;\n  private IC_NAVIGATION_ITEM: string = \"ic-navigation-item\";\n  private resizeObserver: ResizeObserver = null;\n  private COLLAPSED_ICON_LABELS_END = \"collapsed-icon-labels-end\";\n  private COLLAPSED_ICON_LABELS_START = \"collapsed-icon-labels-start\";\n\n  @Element() el: HTMLIcSideNavigationElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() deviceSizeAppTitle = DEVICE_SIZES.S;\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n  @State() hasSecondaryNavigation: boolean = false;\n  @State() menuExpanded: boolean = false;\n  @State() menuOpen: boolean = false;\n\n  /**\n   * The app title to be displayed. This is required, unless a slotted app title link is used.\n   */\n  @Prop() appTitle: string;\n\n  /**\n   * If `true`, the icon and label will appear when side navigation is collapsed.\n   */\n  @Prop() collapsedIconLabels: boolean = false;\n\n  /**\n   * If `true`, automatic parent wrapper styling will be disabled.\n   */\n  @Prop() disableAutoParentStyling: boolean = false;\n\n  /**\n   * If `true`, the side navigation will load in an expanded state.\n   */\n  @Prop() expanded: boolean = false;\n\n  /**\n   * The URL that the app title link points to.\n   */\n  @Prop() href: string = \"/\";\n\n  /**\n   * @internal If `true`, side navigation will be contained by its parent element.\n   */\n  @Prop() inline: boolean = false;\n\n  /**\n   * The short title of the app to be displayed at small screen sizes in place of the app title.\n   */\n  @Prop() shortAppTitle: string = \"\";\n\n  /**\n   * If `true`, the menu expand button will be removed (PLEASE NOTE: This takes effect on screen sizes 992px and above).\n   */\n  @Prop() static: boolean = false;\n\n  /**\n   * The status of the app to be displayed.\n   */\n  @Prop() status: string;\n\n  /**\n   * The version of the app to be displayed.\n   */\n  @Prop() version: string;\n\n  componentWillLoad(): void {\n    if (this.expanded) {\n      this.setMenuExpanded(true);\n    } else {\n      this.setMenuExpanded(false);\n    }\n\n    if (this.collapsedIconLabels) {\n      this.setCollapsedIconLabels();\n    }\n\n    this.hasSecondaryNavigation = isSlotUsed(this.el, \"secondary-navigation\");\n  }\n\n  componentDidLoad(): void {\n    this.emitSideNavigationExpanded({\n      sideNavExpanded: this.menuExpanded,\n      sideNavMobile: this.deviceSize === DEVICE_SIZES.S,\n    });\n\n    checkResizeObserver(this.runResizeObserver);\n    this.styleSlottedCollapsedIconLabel();\n    this.arrangeSlottedNavigationItem(this.menuExpanded);\n    this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n    this.setExpandedButtonHeight();\n\n    !isSlotUsed(this.el, \"app-title\") &&\n      onComponentRequiredPropUndefined(\n        [{ prop: this.appTitle, propName: \"app-title\" }],\n        \"Side Navigation\"\n      );\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n\n    this.el.removeEventListener(\"transitionend\", this.transitionEndHandler);\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  private emitSideNavigationExpanded = (objDetails: {\n    sideNavExpanded: boolean;\n    sideNavMobile?: boolean;\n  }): void => {\n    const event = new CustomEvent(\"sideNavExpanded\", {\n      detail: {\n        sideNavExpanded: objDetails.sideNavExpanded,\n        sideNavMobile: objDetails.sideNavMobile,\n      },\n    });\n    this.el.dispatchEvent(event);\n  };\n\n  private toggleMenu = (): void => {\n    this.menuOpen = !this.menuOpen;\n    this.setMobileMenuAriaAttributes(this.menuOpen);\n\n    this.arrangeSlottedNavigationItem(this.menuOpen);\n\n    this.setToggleMenuFlyoutMenuVisibility(this.menuOpen);\n\n    this.emitSideNavigationExpanded({\n      sideNavExpanded: this.menuOpen,\n      sideNavMobile: true,\n    });\n  };\n\n  private setToggleMenuFlyoutMenuVisibility = (menuOpen: boolean) => {\n    const sideNav = this.el.shadowRoot.querySelector(\n      \"#side-navigation\"\n    ) as HTMLDivElement;\n    const sideNavInner = sideNav.querySelector(\n      \".side-navigation-inner\"\n    ) as HTMLElement;\n    const bottomWrapper = sideNav.querySelector(\n      \".bottom-wrapper\"\n    ) as HTMLElement;\n\n    const menuVisibilityVisible = \"menu-visibility-visible\";\n\n    if (menuOpen) {\n      bottomWrapper.classList.add(menuVisibilityVisible);\n      sideNavInner.classList.add(menuVisibilityVisible);\n    } else {\n      setTimeout(() => {\n        sideNavInner.classList.remove(menuVisibilityVisible);\n        bottomWrapper.classList.remove(menuVisibilityVisible);\n      }, this.ANIMATION_DURATION);\n    }\n  };\n\n  private setMobileMenuAriaAttributes = (menuOpen: boolean) => {\n    const nativeButton = this.el.shadowRoot\n      .querySelector(\"#menu-button\")\n      .shadowRoot.querySelector(\"button\");\n\n    if (menuOpen) {\n      nativeButton.setAttribute(\"aria-expanded\", \"true\");\n      nativeButton.setAttribute(\"aria-label\", \"Close navigation menu\");\n    } else {\n      nativeButton.setAttribute(\"aria-expanded\", \"false\");\n      nativeButton.setAttribute(\"aria-label\", \"Open navigation menu\");\n    }\n  };\n\n  private setAndRemoveNoWrapAfterMenuExpanded = () => {\n    const appTitle = this.el.shadowRoot.querySelector(\n      \".title-link ic-typography\"\n    );\n\n    appTitle.classList.add(\"ic-typography-no-wrap\");\n\n    setTimeout(() => {\n      appTitle.classList.remove(\"ic-typography-no-wrap\");\n    }, this.ANIMATION_DURATION);\n  };\n\n  private toggleMenuExpanded = (): void => {\n    this.menuExpanded = !this.menuExpanded;\n\n    if (this.menuExpanded) {\n      this.setAndRemoveNoWrapAfterMenuExpanded();\n    }\n\n    this.arrangeSlottedNavigationItem(this.menuExpanded);\n\n    this.displayTooltipWithExpandedLongLabel(this.menuExpanded);\n\n    if (this.collapsedIconLabels) {\n      this.animateCollapsedIconLabels();\n    }\n\n    this.setExpandedButtonHeight();\n    this.emitSideNavigationExpanded({ sideNavExpanded: this.menuExpanded });\n  };\n\n  /**\n   * In order to style nested slotted elements (e.g. using React Router components), this method\n   * rearranges the a tag and labels and adds inline styling expand/collaped animations as external CSS classes are not\n   * do not take affect.\n   * @param menuExpanded boolean - true or false depending on side navigation state\n   */\n  private arrangeSlottedNavigationItem = (menuExpanded?: boolean) => {\n    const navItems = this.el.querySelectorAll(\"ic-navigation-item\");\n\n    navItems.forEach((navItem) => {\n      const hasUsedSlot = isSlotUsed(navItem, \"navigation-item\");\n\n      if (hasUsedSlot) {\n        const navItemSlot = navItem.querySelector(\"[slot='navigation-item']\");\n        const iconWrapper = document.createElement(\"div\");\n        const icon = navItemSlot.querySelector(\"svg\");\n        const label = navItem.textContent.trim();\n        const icTypography = document.createElement(\"ic-typography\");\n        icTypography.classList.add(\n          \"ic-typography-label\",\n          \"hydrated\",\n          \"navigation-item-side-nav-slotted-text\"\n        );\n\n        iconWrapper.style.height = \"var(--ic-space-lg)\";\n        iconWrapper.append(icon);\n\n        navItemSlot.textContent = \"\";\n\n        icTypography.textContent = label;\n\n        navItemSlot.append(iconWrapper);\n        navItemSlot.append(icTypography);\n\n        if (this.collapsedIconLabels) {\n          this.styleSlottedCollapsedIconLabels(menuExpanded, icTypography);\n        } else {\n          this.styleSlottedIconLabels(menuExpanded, icTypography);\n        }\n      }\n    });\n  };\n\n  private styleSlottedCollapsedIconLabels = (\n    menuExpanded: boolean,\n    icTypography: HTMLIcTypographyElement\n  ) => {\n    if (menuExpanded) {\n      icTypography.style.marginTop = \"0\";\n      icTypography.style.whiteSpace = \"nowrap\";\n      icTypography.style.overflow = \"hidden\";\n      icTypography.style.textOverflow = \"ellipsis\";\n    } else {\n      icTypography.style.marginTop = \"10px\";\n      icTypography.style.whiteSpace = \"nowrap\";\n      icTypography.style.overflow = \"hidden\";\n      icTypography.style.textOverflow = \"ellipsis\";\n    }\n  };\n\n  private setExpandedButtonHeight = () => {\n    const appStatusWrapper = this.el.shadowRoot.querySelector(\n      \"#side-navigation > .bottom-wrapper > .bottom-side-nav > .app-status-wrapper\"\n    ) as HTMLDivElement;\n\n    if (appStatusWrapper.offsetHeight !== 0) {\n      this.el.style.setProperty(\n        \"--sm-side-navigation-bottom-bar-height\",\n        `${appStatusWrapper.offsetHeight}px`\n      );\n    }\n  };\n\n  private styleSlottedIconLabels = (\n    menuExpanded: boolean,\n    icTypography: HTMLSpanElement\n  ) => {\n    if (menuExpanded) {\n      icTypography.style.opacity = \"1\";\n      icTypography.style.visibility = \"visible\";\n      icTypography.style.transition =\n        \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n    } else {\n      icTypography.style.opacity = \"0\";\n      icTypography.style.visibility = \"hidden\";\n      icTypography.style.transition =\n        \"visibility 0s, opacity var(--ic-easing-transition-slow)\";\n    }\n  };\n\n  private transitionHandler = (type: string) => {\n    const primaryNavigationWrapper = this.el.shadowRoot.querySelector(\n      \".primary-navigation\"\n    );\n\n    const secondaryNavigationWrapper = this.el.shadowRoot.querySelector(\n      \".bottom-wrapper > .secondary-navigation\"\n    );\n\n    const classToRemove =\n      type === \"start\"\n        ? this.COLLAPSED_ICON_LABELS_END\n        : this.COLLAPSED_ICON_LABELS_START;\n\n    const classToAdd =\n      type === \"start\"\n        ? this.COLLAPSED_ICON_LABELS_START\n        : this.COLLAPSED_ICON_LABELS_END;\n\n    if (primaryNavigationWrapper) {\n      primaryNavigationWrapper.classList.remove(classToRemove);\n      primaryNavigationWrapper.classList.add(classToAdd);\n    }\n\n    if (secondaryNavigationWrapper) {\n      secondaryNavigationWrapper.classList.remove(classToRemove);\n      secondaryNavigationWrapper.classList.add(classToAdd);\n    }\n  };\n\n  private transitionEndHandler = () => {\n    this.transitionHandler(\"end\");\n  };\n\n  private animateCollapsedIconLabels = () => {\n    this.transitionHandler(\"start\");\n    this.transitionEndHandler();\n\n    this.el.addEventListener(\"transitionend\", this.transitionEndHandler);\n  };\n\n  private paddingIconWidth = (\n    navItems: HTMLIcNavigationItemElement[]\n  ): number => {\n    const navItemLink =\n      (navItems[0].shadowRoot &&\n        (navItems[0].shadowRoot.querySelector(\"ic-tooltip a\") ||\n          navItems[0].shadowRoot.querySelector(\"ic-tooltip div\"))) ||\n      navItems[0].querySelector(\"a\") ||\n      navItems[0].querySelector(\"div\");\n    const navItemSVG = navItems[0].querySelector(\"svg\");\n\n    const navStyles = {\n      gap: window.getComputedStyle(navItemLink).gap,\n      iconWidth: window.getComputedStyle(navItemSVG).width,\n      paddingLeft: window.getComputedStyle(navItemLink).paddingLeft,\n    };\n\n    return Object.values(navStyles).reduce((prev, curr) => {\n      return (prev += parseInt(curr));\n    }, 0);\n  };\n\n  private displayTooltipWithExpandedLongLabel = (menuExpanded: boolean) => {\n    let timer;\n\n    if (menuExpanded) {\n      timer = setTimeout(() => {\n        const sideNavWidth = this.el.clientWidth;\n\n        const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n          this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n        );\n\n        const paddingIconDelta = navigationItems.length\n          ? this.paddingIconWidth(navigationItems)\n          : 0;\n\n        navigationItems.forEach(\n          (navigationItem: HTMLIcNavigationItemElement) => {\n            const icTypographyScrollWidth =\n              (\n                navigationItem.shadowRoot &&\n                navigationItem.shadowRoot.querySelector(\n                  \"ic-tooltip .link ic-typography.ic-typography-label\"\n                )\n              )?.scrollWidth ||\n              navigationItem.querySelector(\"ic-typography.ic-typography-label\")\n                ?.scrollWidth;\n\n            if (icTypographyScrollWidth > sideNavWidth - paddingIconDelta) {\n              navigationItem.setAttribute(\"display-navigation-tooltip\", \"true\");\n            }\n          }\n        );\n      }, this.ANIMATION_DURATION);\n    } else {\n      clearTimeout(timer);\n\n      const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n        this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n      );\n      navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n        navigationItem.setAttribute(\"display-navigation-tooltip\", \"false\");\n      });\n    }\n  };\n\n  private setMenuExpanded = (expanded: boolean): void => {\n    this.menuExpanded = expanded;\n  };\n\n  /**\n   * As the mobile top bar is fixed, a padding top is required\n   * to push main content down the height of the mobile top bar\n   * @param value - padding-top css value\n   */\n  private setParentPaddingTop = (value: string) => {\n    this.el.parentElement.style.setProperty(\"padding-top\", value);\n  };\n\n  private setParentPaddingLeft = (value: string) => {\n    this.el.parentElement.style.setProperty(\"padding-left\", value);\n  };\n\n  private renderAppTitle = (isAppNameSubtitleVariant: boolean) => {\n    const displayShortAppTitle =\n      this.deviceSize <= DEVICE_SIZES.S && !isEmptyString(this.shortAppTitle);\n    return (\n      <ic-typography\n        variant={\n          displayShortAppTitle || isAppNameSubtitleVariant\n            ? \"subtitle-small\"\n            : \"h3\"\n        }\n        aria-label={\n          displayShortAppTitle\n            ? `${this.appTitle} (${this.shortAppTitle})`\n            : undefined\n        }\n      >\n        <h1>{displayShortAppTitle ? this.shortAppTitle : this.appTitle}</h1>\n      </ic-typography>\n    );\n  };\n\n  private resizeObserverCallback = (currSize: number) => {\n    this.deviceSize = currSize;\n\n    if (currSize === DEVICE_SIZES.S) {\n      if (!this.disableAutoParentStyling) {\n        const topBarHeight =\n          this.el.shadowRoot.querySelector(\".top-bar\").scrollHeight;\n        this.setParentPaddingTop(`${topBarHeight}px`);\n        this.setParentPaddingLeft(\"0\");\n\n        if (this.inline) {\n          this.el.parentElement.style.setProperty(\n            \"height\",\n            `calc(100% - ${topBarHeight}px)`\n          );\n        }\n      }\n      this.emitSideNavigationExpanded({\n        sideNavExpanded: this.menuExpanded,\n        sideNavMobile: true,\n      });\n    } else {\n      if (!this.disableAutoParentStyling) {\n        this.setParentPaddingTop(\"0\");\n        this.el.parentElement.style.setProperty(\"height\", \"100%\");\n      }\n      this.emitSideNavigationExpanded({\n        sideNavExpanded: this.menuExpanded,\n        sideNavMobile: false,\n      });\n    }\n\n    let paddingLeft;\n\n    if (this.collapsedIconLabels) {\n      paddingLeft = \"calc(var(--ic-space-xxl) * 2)\";\n    } else {\n      paddingLeft = \"calc(var(--ic-space-xxl) + var(--ic-space-xs))\";\n    }\n\n    if (currSize > DEVICE_SIZES.L) {\n      if (!this.disableAutoParentStyling) {\n        this.setParentPaddingTop(\"0\");\n        this.setParentPaddingLeft(\"0\");\n      }\n    } else if (\n      currSize > DEVICE_SIZES.S &&\n      currSize <= DEVICE_SIZES.M &&\n      this.static &&\n      !this.disableAutoParentStyling\n    ) {\n      this.setParentPaddingLeft(paddingLeft);\n    } else if (\n      currSize > DEVICE_SIZES.S &&\n      currSize <= DEVICE_SIZES.L &&\n      !this.disableAutoParentStyling\n    ) {\n      if (this.static && this.menuExpanded) {\n        this.setParentPaddingLeft(\"calc(var(--ic-space-xl) * 10)\");\n      } else {\n        this.setParentPaddingLeft(paddingLeft);\n      }\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      const currSize = getCurrentDeviceSize();\n      this.deviceSizeAppTitle = currSize;\n      this.resizeObserverCallback(currSize);\n    });\n\n    this.resizeObserver.observe(document.body, { box: \"content-box\" });\n  };\n\n  private setCollapsedIconLabels = () => {\n    const navigationItems: HTMLIcNavigationItemElement[] = Array.from(\n      this.el.querySelectorAll(this.IC_NAVIGATION_ITEM)\n    );\n    navigationItems.forEach((navigationItem: HTMLIcNavigationItemElement) => {\n      navigationItem.setAttribute(\"collapsed-icon-label\", \"true\");\n    });\n  };\n\n  private styleSlottedCollapsedIconLabel = () => {\n    const dynamicSlottedIcTypographyComps: HTMLIcTypographyElement[] =\n      Array.from(\n        this.el.querySelectorAll(\".navigation-item-side-nav-slotted-text\")\n      );\n\n    dynamicSlottedIcTypographyComps.forEach((icTypography) => {\n      if (\n        icTypography?.parentElement?.parentElement?.classList.contains(\n          \"navigation-item-side-nav-collapsed-with-label\"\n        )\n      ) {\n        icTypography.style.whiteSpace = \"nowrap\";\n        icTypography.style.overflow = \"hidden\";\n        icTypography.style.textOverflow = \"ellipsis\";\n        icTypography.style.marginTop = \"10px\";\n      }\n    });\n  };\n\n  private renderTopBar = ({\n    isSDevice,\n    foregroundColor,\n    menuOpen,\n    href,\n    isAppNameSubtitleVariant,\n  }: IcTopBar) => {\n    const hasTitle = this.appTitle !== \"\" && this.appTitle !== undefined;\n\n    const Component = isSlotUsed(this.el, \"app-title\") ? \"div\" : \"a\";\n\n    const attrs = Component == \"a\" && {\n      href: href,\n    };\n\n    return (\n      <div\n        class={{\n          \"top-bar\": true,\n          [this.foregroundColor]: true,\n        }}\n      >\n        {isSDevice && (\n          <nav\n            aria-labelledby=\"menu-navigation-toggle-button-landmark\"\n            aria-hidden=\"false\"\n          >\n            <ic-button\n              aria-label=\"Open navigation menu\"\n              class=\"menu-button\"\n              id=\"menu-button\"\n              variant=\"secondary\"\n              size=\"small\"\n              full-width=\"true\"\n              appearance={foregroundColor}\n              onClick={this.toggleMenu}\n              aria-owns=\"side-navigation\"\n              aria-haspopup=\"true\"\n              aria-expanded=\"false\"\n            >\n              <span\n                class=\"mobile-top-bar-menu-icon\"\n                slot=\"icon\"\n                innerHTML={menuOpen ? closeIcon : menuIcon}\n              ></span>\n              {menuOpen ? \"Close\" : \"Menu\"}\n            </ic-button>\n            <span\n              id=\"menu-navigation-toggle-button-landmark\"\n              class=\"navigation-landmark-title\"\n              aria-hidden=\"true\"\n            >\n              Navigation menu toggle button\n            </span>\n          </nav>\n        )}\n        <div class=\"app-title-wrapper\">\n          {(hasTitle || isSlotUsed(this.el, \"app-title\")) && (\n            <Component {...attrs} class=\"title-link\">\n              <div class=\"app-icon-container\" aria-hidden=\"true\">\n                <slot name=\"app-icon\"></slot>\n              </div>\n              {isSlotUsed(this.el, \"app-title\") ? (\n                <slot name=\"app-title\"></slot>\n              ) : (\n                this.renderAppTitle(isAppNameSubtitleVariant)\n              )}\n            </Component>\n          )}\n        </div>\n      </div>\n    );\n  };\n\n  render() {\n    const {\n      appTitle,\n      menuOpen,\n      foregroundColor,\n      menuExpanded,\n      href,\n      status,\n      version,\n      collapsedIconLabels,\n      inline,\n    } = this;\n\n    const isSDevice = this.deviceSize === DEVICE_SIZES.S;\n    const isMdDevice = this.deviceSize === DEVICE_SIZES.M;\n    const isLgDevice = this.deviceSize >= DEVICE_SIZES.L;\n    const isAppNameSubtitleVariant = this.deviceSizeAppTitle === DEVICE_SIZES.S;\n    const displayExpandBtn = isMdDevice || (isLgDevice && !this.static);\n\n    const topBarProps: IcTopBar = {\n      isSDevice,\n      foregroundColor,\n      menuOpen,\n      href,\n      isAppNameSubtitleVariant,\n      appTitle,\n    };\n\n    return (\n      <Host\n        class={{\n          \"xs-menu-open\": menuOpen && isSDevice,\n          \"xs-menu-close\": !menuOpen && isSDevice,\n          \"sm-collapsed\": !isSDevice && !menuExpanded,\n          \"sm-expanded\": !isSDevice && menuExpanded,\n          [IcThemeForegroundEnum.Dark]:\n            foregroundColor === IcThemeForegroundEnum.Dark,\n          [\"collapsed-labels\"]:\n            !isSDevice && !menuExpanded && collapsedIconLabels,\n          [\"inline\"]: inline,\n        }}\n      >\n        {isSDevice && this.renderTopBar({ ...topBarProps })}\n        <div class=\"side-navigation\" id=\"side-navigation\">\n          {!isSDevice && this.renderTopBar({ ...topBarProps })}\n          <div class=\"side-navigation-inner\">\n            {isSlotUsed(this.el, \"primary-navigation\") && (\n              <nav\n                class=\"primary-navigation\"\n                aria-labelledby=\"primary-navigation-landmark\"\n              >\n                <span\n                  aria-hidden=\"true\"\n                  class=\"navigation-landmark-title\"\n                  id=\"primary-navigation-landmark\"\n                >\n                  Primary\n                </span>\n                <ul class=\"navigation-list\">\n                  <slot name=\"primary-navigation\"></slot>\n                </ul>\n              </nav>\n            )}\n          </div>\n          <div\n            class={{\n              [\"bottom-wrapper\"]: true,\n              [\"classification-spacing\"]: hasClassificationBanner(),\n            }}\n          >\n            {isSlotUsed(this.el, \"secondary-navigation\") && (\n              <nav\n                class=\"secondary-navigation\"\n                aria-labelledby=\"secondary-navigation-landmark\"\n              >\n                <span\n                  aria-hidden=\"true\"\n                  class=\"navigation-landmark-title\"\n                  id=\"secondary-navigation-landmark\"\n                >\n                  Secondary\n                </span>\n                <ul class=\"navigation-list\">\n                  <slot name=\"secondary-navigation\"></slot>\n                </ul>\n              </nav>\n            )}\n            <div class=\"bottom-side-nav\">\n              {this.hasSecondaryNavigation && <ic-divider></ic-divider>}\n              {displayExpandBtn && (\n                <button\n                  class=\"menu-expand-button\"\n                  innerHTML={chevronIcon}\n                  onClick={this.toggleMenuExpanded}\n                  aria-label={`${\n                    menuExpanded ? \"Collapse\" : \"Expand\"\n                  } side navigation`}\n                ></button>\n              )}\n              <div class=\"app-status-wrapper\">\n                {status !== \"\" && (\n                  <div\n                    class={{\n                      [\"app-status\"]: true,\n                    }}\n                  >\n                    <ic-typography\n                      aria-label=\"app tag\"\n                      variant=\"label-uppercase\"\n                      class=\"app-status-text\"\n                    >\n                      {status}\n                    </ic-typography>\n                  </div>\n                )}\n                {version !== \"\" && (\n                  <ic-typography\n                    variant=\"label\"\n                    class=\"app-version\"\n                    aria-label=\"app version\"\n                  >\n                    {version}\n                  </ic-typography>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-da3bd896.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as s,g as o}from"./p-69920d86.js";import{r as a,i as n,a as r,f as l,k as h}from"./p-dd980be4.js";import"./p-6f57b13c.js";const d='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block}ic-input-label.error{color:var(--ic-status-error)}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}.radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host(.small) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host([orientation="horizontal"]) .radio-buttons-container{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.small[orientation="horizontal"]) .radio-buttons-container{gap:var(--ic-space-xl)}';const c=class{constructor(e){t(this,e);this.icChange=i(this,"icChange",7);this.handleKeyDown=t=>{switch(t.key){case"ArrowDown":case"ArrowRight":this.radioOptions[this.getNextItemToSelect(this.selectedChild,true)].click();t.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.radioOptions[this.getNextItemToSelect(this.selectedChild,false)].click();t.preventDefault()}};this.getNextItemToSelect=(t,i)=>{const e=this.radioOptions.length-1;if(t<1){t=0}let s=i?t+1:t-1;if(s<0){s=e}else if(s>e){s=0}if(this.radioOptions[s].disabled){s=this.getNextItemToSelect(s,i)}return s};this.checkedValue="";this.selectedChild=-1;this.disabled=false;this.helperText=undefined;this.hideLabel=false;this.label=undefined;this.name=undefined;this.orientation="vertical";this.required=false;this.small=false;this.validationStatus="";this.validationText=""}componentWillLoad(){a(this.disabled,this.host)}componentDidLoad(){this.radioOptions=Array.from(this.host.querySelectorAll("ic-radio-option"));this.radioOptions.forEach(((t,i)=>{if(!t.selected){t.selected=this.checkedValue===t.value}t.name=this.name;t.groupLabel=this.label;if(t.selected){this.selectedChild=i;this.checkedValue=t.value}}));this.radioOptions[0].shadowRoot.querySelector("input").tabIndex=this.selectedChild>0?-1:0;if(this.orientation==="horizontal"&&this.radioOptions!==undefined&&(this.radioOptions.length>2||this.radioOptions.length===2&&(n(this.radioOptions[0],"additional-field")||n(this.radioOptions[1],"additional-field")))){this.orientation="vertical"}r([{prop:this.label,propName:"label"},{prop:this.name,propName:"name"}],"Radio Group")}selectHandler(t){var i;this.checkedValue=t.detail.value;const e=t.target;this.icChange.emit({value:this.checkedValue,selectedOption:{radio:e,textFieldValue:(i=e===null||e===void 0?void 0:e.querySelector("ic-text-field"))===null||i===void 0?void 0:i.value}});if(this.radioOptions!==undefined){this.radioOptions.forEach(((t,i)=>{t.selected=this.checkedValue===t.value;if(t.selected){this.selectedChild=i}}));this.radioOptions[0].shadowRoot.querySelector("input").tabIndex=this.selectedChild>0?-1:0}}changeHandler(){const t=this.radioOptions.findIndex((t=>t.selected));if(t<0){this.radioOptions[0].shadowRoot.querySelector("input").tabIndex=0;this.selectedChild=t}}render(){l(true,this.host,this.name,this.checkedValue,this.disabled);return e(s,{onKeyDown:this.handleKeyDown,class:{small:this.small}},e("div",{role:"radiogroup","aria-label":`${this.label}${this.required?", required":""}`},!this.hideLabel&&e("ic-input-label",{class:{[`${this.validationStatus}`]:true},label:this.label,helperText:this.helperText,required:this.required,disabled:this.disabled}),e("div",{class:"radio-buttons-container"},e("slot",null))),h(this.validationStatus,this.disabled)&&e("ic-input-validation",{ariaLiveMode:"polite",status:this.validationStatus,message:this.validationText}))}get host(){return o(this)}};c.style=d;export{c as ic_radio_group};
+//# sourceMappingURL=p-da3bd896.entry.js.map

package/dist/core/p-da3bd896.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icRadioGroupCss","RadioGroup","this","handleKeyDown","event","key","radioOptions","getNextItemToSelect","selectedChild","click","preventDefault","currentItem","movingDown","numRadios","length","nextItem","disabled","componentWillLoad","removeDisabledFalse","host","componentDidLoad","Array","from","querySelectorAll","forEach","radioOption","index","selected","checkedValue","value","name","groupLabel","label","shadowRoot","querySelector","tabIndex","orientation","undefined","isSlotUsed","onComponentRequiredPropUndefined","prop","propName","selectHandler","detail","selectedOption","target","icChange","emit","radio","textFieldValue","_a","changeHandler","findIndex","render","renderHiddenInput","h","Host","onKeyDown","class","small","role","required","hideLabel","validationStatus","helperText","hasValidationStatus","ariaLiveMode","status","message","validationText"],"sources":["./src/components/ic-radio-group/ic-radio-group.css?tag=ic-radio-group&encapsulation=shadow","./src/components/ic-radio-group/ic-radio-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\nic-input-label.error {\n  color: var(--ic-status-error);\n}\n\nic-input-validation {\n  margin-top: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-validation {\n  margin-top: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-label ic-typography {\n  margin-bottom: var(--ic-space-sm);\n}\n\n:host(.small) ic-input-label ic-typography {\n  margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n.radio-buttons-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ic-space-xxs);\n}\n\n:host(.small) .radio-buttons-container {\n  gap: var(--ic-space-xxxs);\n}\n\n:host([orientation=\"horizontal\"]) .radio-buttons-container {\n  display: flex;\n  flex-direction: row;\n  gap: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.small[orientation=\"horizontal\"]) .radio-buttons-container {\n  gap: var(--ic-space-xl);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Listen,\n  Element,\n  Event,\n  EventEmitter,\n} from \"@stencil/core\";\nimport {\n  hasValidationStatus,\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n  renderHiddenInput,\n} from \"../../utils/helpers\";\nimport {\n  IcInformationStatusOrEmpty,\n  IcOrientation,\n  IcValueEventDetail,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-radio-group.types\";\n\n@Component({\n  tag: \"ic-radio-group\",\n  styleUrl: \"ic-radio-group.css\",\n  shadow: true,\n})\nexport class RadioGroup {\n  private radioOptions: HTMLIcRadioOptionElement[];\n\n  @Element() host: HTMLIcRadioGroupElement;\n\n  @State() checkedValue: string = \"\";\n  @State() selectedChild: number = -1;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText: string;\n\n  /**\n   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel: boolean = false;\n\n  /**\n   * The label for the radio group to be displayed.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The name for the radio group to differentiate from other groups.\n   */\n  @Prop() name!: string;\n\n  /**\n   * The orientation of the radio buttons in the radio group. If there are more than two radio buttons in a radio group or either of the radio buttons use the `additional-field` slot, then the orientation will always be vertical.\n   */\n  @Prop({ reflect: true, mutable: true }) orientation: IcOrientation =\n    \"vertical\";\n\n  /**\n   * If `true`, the radio group will require a value.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * If `true`, the small styling will be applied to the radio group.\n   */\n  @Prop() small: boolean = false;\n  /**\n   * The validation status - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n  /**\n   * The validation text - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationText: string = \"\";\n\n  /**\n   * Emitted when a user selects a radio.\n   */\n  @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.host);\n  }\n\n  componentDidLoad(): void {\n    this.radioOptions = Array.from(\n      this.host.querySelectorAll(\"ic-radio-option\")\n    );\n\n    this.radioOptions.forEach((radioOption, index) => {\n      if (!radioOption.selected) {\n        radioOption.selected = this.checkedValue === radioOption.value;\n      }\n      radioOption.name = this.name;\n      radioOption.groupLabel = this.label;\n      if (radioOption.selected) {\n        this.selectedChild = index;\n        this.checkedValue = radioOption.value;\n      }\n    });\n    this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n      this.selectedChild > 0 ? -1 : 0;\n\n    if (\n      this.orientation === \"horizontal\" &&\n      this.radioOptions !== undefined &&\n      (this.radioOptions.length > 2 ||\n        (this.radioOptions.length === 2 &&\n          (isSlotUsed(this.radioOptions[0], \"additional-field\") ||\n            isSlotUsed(this.radioOptions[1], \"additional-field\"))))\n    ) {\n      this.orientation = \"vertical\";\n    }\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.label, propName: \"label\" },\n        { prop: this.name, propName: \"name\" },\n      ],\n      \"Radio Group\"\n    );\n  }\n\n  @Listen(\"icCheck\")\n  selectHandler(event: CustomEvent<IcValueEventDetail>): void {\n    this.checkedValue = event.detail.value;\n    const selectedOption = event.target as HTMLIcRadioOptionElement;\n    this.icChange.emit({\n      value: this.checkedValue,\n      selectedOption: {\n        radio: selectedOption,\n        textFieldValue: selectedOption?.querySelector(\"ic-text-field\")?.value,\n      },\n    });\n\n    if (this.radioOptions !== undefined) {\n      this.radioOptions.forEach((radioOption, index) => {\n        radioOption.selected = this.checkedValue === radioOption.value;\n        if (radioOption.selected) {\n          this.selectedChild = index;\n        }\n      });\n      this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex =\n        this.selectedChild > 0 ? -1 : 0;\n    }\n  }\n\n  @Listen(\"icSelectedChange\")\n  changeHandler(): void {\n    const selectedOption = this.radioOptions.findIndex(\n      (radioOption) => radioOption.selected\n    );\n    if (selectedOption < 0) {\n      this.radioOptions[0].shadowRoot.querySelector(\"input\").tabIndex = 0;\n      this.selectedChild = selectedOption;\n    }\n  }\n\n  private handleKeyDown = (event: KeyboardEvent): void => {\n    switch (event.key) {\n      case \"ArrowDown\":\n      case \"ArrowRight\":\n        this.radioOptions[\n          this.getNextItemToSelect(this.selectedChild, true)\n        ].click();\n        event.preventDefault();\n        break;\n      case \"ArrowUp\":\n      case \"ArrowLeft\":\n        this.radioOptions[\n          this.getNextItemToSelect(this.selectedChild, false)\n        ].click();\n        event.preventDefault();\n    }\n  };\n\n  private getNextItemToSelect = (\n    currentItem: number,\n    movingDown: boolean\n  ): number => {\n    const numRadios = this.radioOptions.length - 1;\n\n    if (currentItem < 1) {\n      currentItem = 0;\n    }\n\n    let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n    //check if wrap around necessary\n    if (nextItem < 0) {\n      nextItem = numRadios;\n    } else if (nextItem > numRadios) {\n      nextItem = 0;\n    }\n\n    //if next item is disabled then find next\n    if (this.radioOptions[nextItem].disabled) {\n      nextItem = this.getNextItemToSelect(nextItem, movingDown);\n    }\n\n    return nextItem;\n  };\n\n  render() {\n    renderHiddenInput(\n      true,\n      this.host,\n      this.name,\n      this.checkedValue,\n      this.disabled\n    );\n\n    return (\n      <Host onKeyDown={this.handleKeyDown} class={{ small: this.small }}>\n        <div\n          role=\"radiogroup\"\n          aria-label={`${this.label}${this.required ? \", required\" : \"\"}`}\n        >\n          {!this.hideLabel && (\n            <ic-input-label\n              class={{ [`${this.validationStatus}`]: true }}\n              label={this.label}\n              helperText={this.helperText}\n              required={this.required}\n              disabled={this.disabled}\n            ></ic-input-label>\n          )}\n          <div class=\"radio-buttons-container\">\n            <slot></slot>\n          </div>\n        </div>\n        {hasValidationStatus(this.validationStatus, this.disabled) && (\n          <ic-input-validation\n            ariaLiveMode=\"polite\"\n            status={this.validationStatus}\n            message={this.validationText}\n          ></ic-input-validation>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-da5fc036.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as e,h as t,g as a}from"./p-69920d86.js";import{r as o,a as s,i as r}from"./p-dd980be4.js";import"./p-6f57b13c.js";const c=`<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59L13.59 5L15 6.41L11.41 10L15 13.59Z" fill="currentColor"/>\n</svg>\n`;const n='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:inline-block}.chip{display:flex;padding:var(--ic-space-xxs);font-size:0.875rem;border-radius:var(--ic-space-md);text-align:left;text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative}.chip.small{padding:var(--ic-space-xxxs);border-radius:calc(var(--ic-space-md) - var(--ic-space-xxxs))}.chip.large{padding:var(--ic-space-xs);border-radius:calc(var(--ic-space-md) + var(--ic-space-xxs))}.label{padding:0 var(--ic-space-xs)}.chip.hovered:not(:focus-within){background-color:var(--ic-architectural-300)}.chip:focus-within{box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);z-index:1}.chip.outline.hovered:not(:focus-within){background-color:var(--ic-action-dark-bg-hover)}ic-tooltip:focus-within{z-index:1}.filled{background-color:var(--ic-architectural-200);color:black;border:none}.filled.disabled{background-color:var(--ic-architectural-100)}.outline{color:var(--ic-architectural-900);border:var(--ic-space-1px) solid var(--ic-architectural-900);padding:calc(var(--ic-space-xxs) - var(--ic-space-1px))}.outline.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.outline.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.outline.disabled{border:var(--ic-border-disabled);background:none}.chip.disabled ic-typography{color:var(--ic-architectural-200)}.dismiss-icon{border:none;border-radius:50%;padding:0;background:none;cursor:pointer;margin:var(--ic-space-xxxs);height:calc(var(--ic-space-lg) - var(--ic-space-xxs));width:calc(var(--ic-space-lg) - var(--ic-space-xxs))}.dismiss-icon:focus{outline:var(--ic-hc-focus-outline)}.dismiss-icon[disabled]{pointer-events:none;color:var(--ic-architectural-200)}.icon{padding:var(--ic-space-xxxs);box-sizing:border-box}.icon,ic-tooltip{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chip.disabled path,.chip.disabled ::slotted(svg){fill:var(--ic-architectural-200)}@media (forced-colors: active){.chip{border:var(--ic-hc-border)}.filled.small{padding:calc(var(--ic-space-xxxs) - var(--ic-space-1px))}.filled{padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}.filled.large{padding:calc(var(--ic-space-xs) - var(--ic-space-1px))}.chip.disabled{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.chip.disabled ic-typography{color:GrayText}.chip.disabled path,.chip.disabled ::slotted(svg){fill:GrayText}.chip:focus-within{outline:none;border-color:Highlight}}';const l=class{constructor(t){i(this,t);this.dismiss=e(this,"dismiss",7);this.icDismiss=e(this,"icDismiss",7);this.dismissAction=()=>{this.dismiss.emit();this.icDismiss.emit()};this.mouseEnterHandler=()=>{this.isHovered=true};this.mouseLeaveHandler=()=>{this.isHovered=false};this.isHovered=false;this.visible=true;this.appearance="filled";this.disabled=false;this.dismissible=false;this.label=undefined;this.size="default"}componentWillLoad(){o(this.disabled,this.el)}componentDidLoad(){var i;this.dismissible&&((i=this.el.shadowRoot.querySelector("span.ic-tooltip-label"))===null||i===void 0?void 0:i.setAttribute("aria-hidden","true"));s([{prop:this.label,propName:"label"}],"Chip")}handleClick(){this.visible=!this.visible}async setFocus(){if(this.el.shadowRoot.querySelector("button")){this.el.shadowRoot.querySelector("button").focus()}}render(){const{label:i,appearance:e,size:a,dismissible:o,visible:s,disabled:n,isHovered:l}=this;return s&&t("div",{class:{["chip"]:true,[`${e}`]:true,[`${a}`]:true,["disabled"]:n,["dismissible"]:o,["hovered"]:l}},r(this.el,"icon")&&t("div",{class:"icon"},t("slot",{name:"icon"})),t("ic-typography",{variant:"label","apply-vertical-margins":false,class:"label"},t("span",null,i)),o&&t("ic-tooltip",{label:"Dismiss",target:"dismiss-icon",class:{["tooltip-disabled"]:n}},t("button",{id:"dismiss-icon",class:{["dismiss-icon"]:true},"aria-label":`Dismiss ${i} chip`,disabled:n,tabindex:n?-1:0,onClick:this.dismissAction,onMouseEnter:this.mouseEnterHandler,onMouseLeave:this.mouseLeaveHandler,innerHTML:c})))}static get delegatesFocus(){return true}get el(){return a(this)}};l.style=n;export{l as ic_chip};
+//# sourceMappingURL=p-da5fc036.entry.js.map

package/dist/core/p-da5fc036.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icChipCss","Chip","this","dismissAction","dismiss","emit","icDismiss","mouseEnterHandler","isHovered","mouseLeaveHandler","componentWillLoad","removeDisabledFalse","disabled","el","componentDidLoad","dismissible","_a","shadowRoot","querySelector","setAttribute","onComponentRequiredPropUndefined","prop","label","propName","handleClick","visible","async","focus","render","appearance","size","h","class","isSlotUsed","name","variant","target","id","tabindex","onClick","onMouseEnter","onMouseLeave","innerHTML","dismissIcon"],"sources":["./src/components/ic-chip/ic-chip.css?tag=ic-chip&encapsulation=shadow","./src/components/ic-chip/ic-chip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: inline-block;\n}\n\n.chip {\n  display: flex;\n  padding: var(--ic-space-xxs);\n  font-size: 0.875rem;\n  border-radius: var(--ic-space-md);\n  text-align: left;\n  text-decoration: none;\n  transition: var(--ic-easing-transition-fast);\n  position: relative;\n}\n\n.chip.small {\n  padding: var(--ic-space-xxxs);\n  border-radius: calc(var(--ic-space-md) - var(--ic-space-xxxs));\n}\n\n.chip.large {\n  padding: var(--ic-space-xs);\n  border-radius: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n.label {\n  padding: 0 var(--ic-space-xs);\n}\n\n.chip.hovered:not(:focus-within) {\n  background-color: var(--ic-architectural-300);\n}\n\n.chip:focus-within {\n  box-shadow: var(--ic-border-focus);\n  outline: var(--ic-hc-focus-outline);\n  z-index: 1;\n}\n\n.chip.outline.hovered:not(:focus-within) {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\nic-tooltip:focus-within {\n  z-index: 1;\n}\n\n.filled {\n  background-color: var(--ic-architectural-200);\n  color: black;\n  border: none;\n}\n\n.filled.disabled {\n  background-color: var(--ic-architectural-100);\n}\n\n.outline {\n  color: var(--ic-architectural-900);\n  border: var(--ic-space-1px) solid var(--ic-architectural-900);\n  padding: calc(var(--ic-space-xxs) - var(--ic-space-1px));\n}\n\n.outline.small {\n  padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n}\n\n.outline.large {\n  padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n.outline.disabled {\n  border: var(--ic-border-disabled);\n  background: none;\n}\n\n.chip.disabled ic-typography {\n  color: var(--ic-architectural-200);\n}\n\n.dismiss-icon {\n  border: none;\n  border-radius: 50%;\n  padding: 0;\n  background: none;\n  cursor: pointer;\n  margin: var(--ic-space-xxxs);\n  height: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n  width: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n}\n\n.dismiss-icon:focus {\n  outline: var(--ic-hc-focus-outline);\n}\n\n.dismiss-icon[disabled] {\n  pointer-events: none;\n  color: var(--ic-architectural-200);\n}\n\n.icon {\n  padding: var(--ic-space-xxxs);\n  box-sizing: border-box;\n}\n\n.icon,\nic-tooltip {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.chip.disabled path,\n.chip.disabled ::slotted(svg) {\n  fill: var(--ic-architectural-200);\n}\n\n@media (forced-colors: active) {\n  .chip {\n    border: var(--ic-hc-border);\n  }\n\n  .filled.small {\n    padding: calc(var(--ic-space-xxxs) - var(--ic-space-1px));\n  }\n\n  .filled {\n    padding: calc(var(--ic-space-xxxs) + var(--ic-space-1px));\n  }\n\n  .filled.large {\n    padding: calc(var(--ic-space-xs) - var(--ic-space-1px));\n  }\n\n  .chip.disabled {\n    appearance: none;\n    border-color: GrayText;\n  }\n\n  .chip.disabled ic-typography {\n    color: GrayText;\n  }\n\n  .chip.disabled path,\n  .chip.disabled ::slotted(svg) {\n    fill: GrayText;\n  }\n\n  .chip:focus-within {\n    outline: none;\n    border-color: Highlight;\n  }\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Listen,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n} from \"@stencil/core\";\nimport {\n  onComponentRequiredPropUndefined,\n  isSlotUsed,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcChipAppearance } from \"./ic-chip.types\";\nimport { IcSizes } from \"../../utils/types\";\nimport dismissIcon from \"../../assets/dismiss-icon.svg\";\n\n/**\n * @slot icon - Content will be rendered at the start of the chip.\n */\n@Component({\n  tag: \"ic-chip\",\n  styleUrl: \"ic-chip.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Chip {\n  @Element() el: HTMLIcChipElement;\n\n  @State() isHovered: boolean = false;\n  @State() visible: boolean = true;\n\n  /**\n   * The emphasis of the chip.\n   */\n  @Prop() appearance?: IcChipAppearance = \"filled\";\n\n  /**\n   * If `true`, the chip will appear disabled.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * If `true`, the chip will have a close button at the end to dismiss it.\n   */\n  @Prop() dismissible?: boolean = false;\n\n  /**\n   * The text rendered within the chip.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The size of the chip.\n   */\n  @Prop() size?: IcSizes = \"default\";\n\n  /**\n   * @deprecated This event should not be used anymore. Use icDismiss instead.\n   */\n  @Event() dismiss: EventEmitter<void>;\n\n  /**\n   * Is emitted when the user dismisses the chip.\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    this.dismissible &&\n      this.el.shadowRoot\n        .querySelector(\"span.ic-tooltip-label\")\n        ?.setAttribute(\"aria-hidden\", \"true\");\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Chip\"\n    );\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleClick(): void {\n    this.visible = !this.visible;\n  }\n\n  /**\n   * Sets focus on the chip.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el.shadowRoot.querySelector(\"button\")) {\n      this.el.shadowRoot.querySelector(\"button\").focus();\n    }\n  }\n\n  private dismissAction = (): void => {\n    this.dismiss.emit();\n    this.icDismiss.emit();\n  };\n\n  private mouseEnterHandler = (): void => {\n    this.isHovered = true;\n  };\n\n  private mouseLeaveHandler = (): void => {\n    this.isHovered = false;\n  };\n\n  render() {\n    const {\n      label,\n      appearance,\n      size,\n      dismissible,\n      visible,\n      disabled,\n      isHovered,\n    } = this;\n\n    return (\n      visible && (\n        <div\n          class={{\n            [\"chip\"]: true,\n            [`${appearance}`]: true,\n            [`${size}`]: true,\n            [\"disabled\"]: disabled,\n            [\"dismissible\"]: dismissible,\n            [\"hovered\"]: isHovered,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && (\n            <div class=\"icon\">\n              <slot name=\"icon\" />\n            </div>\n          )}\n          <ic-typography\n            variant=\"label\"\n            apply-vertical-margins={false}\n            class=\"label\"\n          >\n            <span>{label}</span>\n          </ic-typography>\n          {dismissible && (\n            <ic-tooltip\n              label=\"Dismiss\"\n              target=\"dismiss-icon\"\n              class={{ [\"tooltip-disabled\"]: disabled }}\n            >\n              <button\n                id=\"dismiss-icon\"\n                class={{\n                  [\"dismiss-icon\"]: true,\n                }}\n                aria-label={`Dismiss ${label} chip`}\n                disabled={disabled}\n                tabindex={disabled ? -1 : 0}\n                onClick={this.dismissAction}\n                onMouseEnter={this.mouseEnterHandler}\n                onMouseLeave={this.mouseLeaveHandler}\n                innerHTML={dismissIcon}\n              ></button>\n            </ic-tooltip>\n          )}\n        </div>\n      )\n    );\n  }\n}\n"],"mappings":"0cAAA,MAAMA,EAAY,8tJ,MC8BLC,EAAI,M,+FAuEPC,KAAAC,cAAgB,KACtBD,KAAKE,QAAQC,OACbH,KAAKI,UAAUD,MAAM,EAGfH,KAAAK,kBAAoB,KAC1BL,KAAKM,UAAY,IAAI,EAGfN,KAAAO,kBAAoB,KAC1BP,KAAKM,UAAY,KAAK,E,eA9EM,M,aACF,K,gBAKY,S,cAKX,M,iBAKG,M,+BAUP,S,CAYzBE,oBACEC,EAAoBT,KAAKU,SAAUV,KAAKW,G,CAG1CC,mB,MACEZ,KAAKa,eACHC,EAAAd,KAAKW,GAAGI,WACLC,cAAc,4BAAwB,MAAAF,SAAA,SAAAA,EACrCG,aAAa,cAAe,SAClCC,EACE,CAAC,CAAEC,KAAMnB,KAAKoB,MAAOC,SAAU,UAC/B,O,CAKJC,cACEtB,KAAKuB,SAAWvB,KAAKuB,O,CAOvBC,iBACE,GAAIxB,KAAKW,GAAGI,WAAWC,cAAc,UAAW,CAC9ChB,KAAKW,GAAGI,WAAWC,cAAc,UAAUS,O,EAiB/CC,SACE,MAAMN,MACJA,EAAKO,WACLA,EAAUC,KACVA,EAAIf,YACJA,EAAWU,QACXA,EAAOb,SACPA,EAAQJ,UACRA,GACEN,KAEJ,OACEuB,GACEM,EAAA,OACEC,MAAO,CACL,CAAC,QAAS,KACV,CAAC,GAAGH,KAAe,KACnB,CAAC,GAAGC,KAAS,KACb,CAAC,YAAalB,EACd,CAAC,eAAgBG,EACjB,CAAC,WAAYP,IAGdyB,EAAW/B,KAAKW,GAAI,SACnBkB,EAAA,OAAKC,MAAM,QACTD,EAAA,QAAMG,KAAK,UAGfH,EAAA,iBACEI,QAAQ,QAAO,yBACS,MACxBH,MAAM,SAEND,EAAA,YAAOT,IAERP,GACCgB,EAAA,cACET,MAAM,UACNc,OAAO,eACPJ,MAAO,CAAE,CAAC,oBAAqBpB,IAE/BmB,EAAA,UACEM,GAAG,eACHL,MAAO,CACL,CAAC,gBAAiB,MACnB,aACW,WAAWV,SACvBV,SAAUA,EACV0B,SAAU1B,GAAY,EAAI,EAC1B2B,QAASrC,KAAKC,cACdqC,aAActC,KAAKK,kBACnBkC,aAAcvC,KAAKO,kBACnBiC,UAAWC,K"}

package/dist/core/p-dd980be4.js

@@ -0,0 +1,2 @@
+import{I as n}from"./p-6f57b13c.js";const t=`<svg aria-labelledby="error-title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#000000">\n    <title id="error-title">Error</title>\n    <g id="close-octagon">\n        <path id="Vector" d="M8.77 3L3.5 8.27V15.73L8.77 21H16.23L21.5 15.73V8.27L16.23 3M8.91 7L12.5 10.59L16.09 7L17.5 8.41L13.91 12L17.5 15.59L16.09 17L12.5 13.41L8.91 17L7.5 15.59L11.09 12L7.5 8.41" />\n    </g>\n</svg>\n`;const e=`<svg aria-labelledby="info-title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#000000">\n    <title id="info-title">For your information</title>\n    <g id="info">\n        <path id="Vector" d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 17C11.45 17 11 16.55 11 16V12C11 11.45 11.45 11 12 11C12.55 11 13 11.45 13 12V16C13 16.55 12.55 17 12 17ZM13 9H11V7H13V9Z" />\n    </g>\n</svg>\n`;const r=`<svg aria-labelledby="neutral-title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#000000">\n<title id="neutral-title">Neutral</title>\n    <g id="Icon">\n        <path id="Vector" d="M19.5 3H5.5C4.4 3 3.5 3.9 3.5 5V19C3.5 20.1 4.4 21 5.5 21H19.5C20.6 21 21.5 20.1 21.5 19V5C21.5 3.9 20.6 3 19.5 3ZM12.51 18C11.81 18 11.25 17.44 11.25 16.74C11.25 16.03 11.81 15.49 12.51 15.49C13.22 15.49 13.76 16.03 13.76 16.74C13.75 17.43 13.22 18 12.51 18ZM15.52 10.6C14.76 11.71 14.04 12.06 13.65 12.77C13.55 12.95 13.49 13.09 13.46 13.4C13.41 13.85 13.01 14.18 12.56 14.18H12.5C11.98 14.18 11.57 13.74 11.62 13.22C11.65 12.88 11.73 12.53 11.92 12.19C12.41 11.32 13.34 10.8 13.88 10.03C14.45 9.22 14.13 7.7 12.51 7.7C11.8 7.7 11.33 8.06 11.04 8.49C10.79 8.85 10.35 9.02 9.94 8.85C9.41 8.64 9.22 8 9.54 7.54C10.15 6.65 11.17 6 12.49 6C13.97 6 14.98 6.67 15.5 7.52C15.94 8.24 16.2 9.59 15.52 10.6Z" />\n    </g>\n</svg>\n`;const i=`<svg aria-labelledby="success-title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#000000">\n    <title id="success-title">Success</title>\n    <g id="check_circle">\n        <path id="Vector" d="M12.5 2C6.98 2 2.5 6.48 2.5 12C2.5 17.52 6.98 22 12.5 22C18.02 22 22.5 17.52 22.5 12C22.5 6.48 18.02 2 12.5 2ZM9.79 16.29L6.2 12.7C5.81 12.31 5.81 11.68 6.2 11.29C6.59 10.9 7.22 10.9 7.61 11.29L10.5 14.17L17.38 7.29C17.77 6.9 18.4 6.9 18.79 7.29C19.18 7.68 19.18 8.31 18.79 8.7L11.2 16.29C10.82 16.68 10.18 16.68 9.79 16.29Z" />\n    </g>\n</svg>\n`;const s=`<svg aria-labelledby="warning-title" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#000000">\n    <title id="warning-title">Warning</title>\n    <g id="warning">\n        <path id="Vector" d="M4.47 20.5037H19.53C21.07 20.5037 22.03 18.8337 21.26 17.5037L13.73 4.49375C12.96 3.16375 11.04 3.16375 10.27 4.49375L2.74 17.5037C1.97 18.8337 2.93 20.5037 4.47 20.5037ZM12 13.5037C11.45 13.5037 11 13.0537 11 12.5037V10.5037C11 9.95375 11.45 9.50375 12 9.50375C12.55 9.50375 13 9.95375 13 10.5037V12.5037C13 13.0537 12.55 13.5037 12 13.5037ZM13 17.5037H11V15.5037H13V17.5037Z" />\n    </g>\n</svg>\n`;const a={neutral:{icon:r,ariaLabel:"Neutral"},info:{icon:e,ariaLabel:"For your information"},warning:{icon:s,ariaLabel:"Warning"},error:{icon:t,ariaLabel:"Error"},success:{icon:i,ariaLabel:"Success"}};const o=["aria-atomic","aria-busy","aria-controls","aria-current","aria-describedby","aria-description","aria-details","aria-disabled","aria-dropeffect","aria-errormessage","aria-flowto","aria-grabbed","aria-haspopup","aria-hidden","aria-invalid","aria-keyshortcuts","aria-label","aria-labelledby","aria-live","aria-owns","aria-relevant","aria-roledescription"];const l={XS:576,S:768,M:992,L:1200,XL:99999};const c=["ic-hero","ic-top-navigation","ic-footer","ic-side-navigation","ic-alert"];const u=["ic-alert"];const d={"ic-alert":["ic-link"]};const p=136.701;const f=130;const b=133.3505;const g=(n,t=[])=>{const e={};t.forEach((t=>{if(n.hasAttribute(t)){const r=n.getAttribute(t);if(r!==null){e[t]=n.getAttribute(t)}n.removeAttribute(t)}}));return e};const C=(n,t)=>{const e=n._original||n;return{_original:n,emit:v(e.emit.bind(e),t)}};const v=(n,t=0)=>{let e;return(...r)=>{clearTimeout(e);e=setTimeout(n,t,...r)}};const m=(n,t,e,r,i)=>{if(e!==undefined&&(n||L(t))){const n=t.querySelectorAll("input.ic-input");const s=Array.from(n);const a=s.filter((n=>t===n.parentElement));let o=a[0];if(o===null||o===undefined){o=t.ownerDocument.createElement("input");o.type="hidden";o.classList.add("ic-input");t.appendChild(o)}o.disabled=i;o.name=e;o.value=r||""}};const w=n=>{const t=n.querySelectorAll("input.ic-input");const e=Array.from(t);const r=e.filter((t=>n===t.parentElement));const i=r[0];i===null||i===void 0?void 0:i.remove()};const L=n=>!!n.shadowRoot&&!!n.attachShadow;const y=n=>n+"-helper-text";const h=n=>n+"-validation-text";const N=(n,t,e)=>`${t?y(n):""} ${e?h(n):""}`.trim();const x=(t,e=null)=>{var r;const i=t.parentElement||t.getRootNode().host.parentElement;const s=i.closest(c.join(","));if(s!==null){const i=s.tagName.toLowerCase();const a=t.tagName.toLowerCase();if((r=d[i])===null||r===void 0?void 0:r.includes(a)){return n.Default}else if(e!==null&&!u.includes(i)){return e}else if(s.classList.contains(n.Dark)){return n.Dark}return n.Light}return n.Default};const V=()=>{let n=false;if("maxTouchPoints"in navigator){n=navigator.maxTouchPoints>0}return n};const I=(n,t)=>{const e=document.createElement("button");e.setAttribute("type",t.type);e.style.display="none";n.appendChild(e);e.click();e.remove()};const M=n=>{if(!n){return true}return n.trim().length===0};const k=(n,t)=>{var e;const r=[];if(t.length>0&&t.map){t.map((n=>{if(n.children){n.children.map((n=>r.push(n)))}else{r.push(n)}}));return(e=r.find((t=>t.value===n)))===null||e===void 0?void 0:e.label}return undefined};const A=(n,t,e,r)=>{let i;if(r==="anywhere"){i=n.filter((n=>{var r;if(t){return n.label.toLowerCase().includes(e.toLowerCase())||((r=n.description)===null||r===void 0?void 0:r.toLowerCase().includes(e.toLowerCase()))}else{return n.label.toLowerCase().includes(e.toLowerCase())}}))}else{i=n.filter((n=>{var r;if(t){return n.label.toLowerCase().startsWith(e.toLowerCase())||((r=n.description)===null||r===void 0?void 0:r.toLowerCase().startsWith(e.toLowerCase()))}else{return n.label.toLowerCase().startsWith(e.toLowerCase())}}))}return i};const H=n=>window.matchMedia(`(max-width: ${n}px)`).matches;const T=()=>{if(H(F.S)){return F.S}if(H(F.M)){return F.M}if(H(F.L)){return F.L}if(H(F.XL)){return F.XL}return F.UNDEFINED};const Z=n=>getComputedStyle(document.documentElement).getPropertyValue(n);const E=()=>{const n=Z("--ic-theme-primary-r");const t=Z("--ic-theme-primary-g");const e=Z("--ic-theme-primary-b");return(parseInt(n)*299+parseInt(t)*587+parseInt(e)*114)/1e3};const $=()=>E()>b?n.Dark:n.Light;const S=(n,t)=>{if(n&&n.querySelector){return n.querySelector(`[slot="${t}"]`)}return null};const O=(n,t)=>S(n,t)!==null;const B=(n,t)=>{const e=S(n,t);if(e){return G(e)}return null};const G=n=>{const t=n.firstElementChild;if(t!==null){const n=t.assignedElements?t.assignedElements():t.childNodes;return n.length?n:null}else{return n===null?null:[n]}};const D=n=>{let t={navType:"",parent:null};switch(K(n)){case"IC-NAVIGATION-GROUP":t=D(n.parentElement);break;case"IC-TOP-NAVIGATION":t={navType:"top",parent:Q(n)};break;case"IC-SIDE-NAVIGATION":t={navType:"side",parent:Q(n)};break;case"IC-PAGE-HEADER":t={navType:"page-header",parent:null};break}return t};const F={XS:Number(Z("--ic-breakpoint-xs").replace("px","")),S:Number(Z("--ic-breakpoint-sm").replace("px","")),M:Number(Z("--ic-breakpoint-md").replace("px","")),L:Number(Z("--ic-breakpoint-lg").replace("px","")),XL:Number(Z("--ic-breakpoint-xl").replace("px","")),UNDEFINED:1200};const P=(n,t)=>n!==""&&!t;const R=(n,t)=>Array.from(n.children).some((n=>n.getAttribute("slot")===t));const X=(n,t,e)=>{if(n===undefined&&t!==n){e()}};const W=(n,t)=>{for(let e=0;e<n.length;e++){const{prop:r,propName:i}=n[e];if(r===null||r===undefined){console.error(`No ${i} specified for ${t} component - prop '${i}' (web components) / '${j(i)}' (react) required`)}}};const j=n=>{n=n.toLowerCase();const t=n.split("-");let e=t[0];for(let n=1;n<t.length;n++){e+=t[n].substring(0,1).toUpperCase()+t[n].substring(1)}return e};const q=n=>{if(typeof window!=="undefined"&&typeof window.ResizeObserver!=="undefined"){n()}};const U=function(n){return parseInt(n,16)};const _=n=>{let t;if(n.length===4){t=n.replace("#","").split("");return{r:U(t[0]+t[0]),g:U(t[1]+t[1]),b:U(t[2]+t[2]),a:1}}else{return{r:U(n.slice(1,3)),g:U(n.slice(3,5)),b:U(n.slice(5)),a:1}}};const z=n=>{const t=n.slice(3,4);let e;if(t.toLowerCase()==="a"){e={r:null,g:null,b:null,a:null};const t=n.substring(5,n.length-1).replace(/ /g,"").split(",");e.r=Number(t[0]);e.g=Number(t[1]);e.b=Number(t[2]);e.a=Number(t[3])}else{e={r:null,g:null,b:null,a:1};const t=n.substring(4,n.length-1).replace(/ /g,"").split(",");e.r=Number(t[0]);e.g=Number(t[1]);e.b=Number(t[2])}return e};const J=n=>n.scrollWidth>n.clientWidth;const K=n=>n.parentElement.tagName;const Q=n=>n.parentElement;const Y=()=>document.querySelector("ic-classification-banner:not([inline='true'])")?true:false;const nn=n=>n.closest("FORM");const tn=(n,t)=>{const e=nn(n);if(e!==null){e.addEventListener("reset",t)}};const en=(n,t)=>{const e=nn(n);if(e!==null){e.removeEventListener("reset",t)}};const rn=(n,t=16)=>{const e=parseInt(n);return`${1/t*e}rem`};const sn=(n,t)=>{if(!n){t.removeAttribute("disabled")}};export{Z as A,M as B,rn as C,F as D,E,p as F,_ as G,z as H,l as I,S as J,Q as K,C as L,i as M,J as N,y as O,h as P,s as Q,t as R,a as V,f as W,W as a,x as b,q as c,tn as d,en as e,m as f,T as g,w as h,R as i,N as j,P as k,$ as l,Y as m,g as n,X as o,o as p,D as q,sn as r,O as s,K as t,G as u,B as v,A as w,I as x,k as y,V as z};
+//# sourceMappingURL=p-dd980be4.js.map

package/dist/core/p-dd980be4.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["VARIANT_ICONS","neutral","icon","neutralIcon","ariaLabel","info","infoIcon","warning","warningIcon","error","errorIcon","success","successIcon","IC_INHERITED_ARIA","IC_DEVICE_SIZES","XS","S","M","L","XL","IC_BLOCK_COLOR_COMPONENTS","IC_FIXED_COLOR_COMPONENTS","IC_BLOCK_COLOR_EXCEPTIONS","BLACK_MIN_COLOR_BRIGHTNESS","WHITE_MAX_COLOR_BRIGHTNESS","DARK_MODE_THRESHOLD","inheritAttributes","element","attributes","attributeObject","forEach","attr","hasAttribute","value","getAttribute","removeAttribute","debounceEvent","event","wait","original","_original","emit","debounce","bind","func","timer","args","clearTimeout","setTimeout","renderHiddenInput","always","container","name","disabled","undefined","hasShadowDom","inputs","querySelectorAll","inputEls","Array","from","filtered","filter","el","parentElement","input","ownerDocument","createElement","type","classList","add","appendChild","removeHiddenInput","remove","shadowRoot","attachShadow","getInputHelperTextID","id","getInputValidationTextID","getInputDescribedByText","inputId","helperText","validationText","trim","getThemeFromContext","themeFromEvent","getRootNode","host","blockColorParent","closest","join","parentTag","tagName","toLowerCase","currentTag","_a","includes","IcThemeForegroundEnum","Default","contains","Dark","Light","isMobileOrTablet","navigator","maxTouchPoints","handleHiddenFormButtonClick","form","button","hiddenFormButton","document","setAttribute","style","display","click","isEmptyString","length","getLabelFromValue","options","ungroupedOptions","map","option","children","push","find","label","getFilteredMenuOptions","includeDescriptions","searchString","position","rawFilteredOptions","description","startsWith","deviceSizeMatches","size","window","matchMedia","matches","getCurrentDeviceSize","DEVICE_SIZES","UNDEFINED","getCssProperty","cssVar","getComputedStyle","documentElement","getPropertyValue","getThemeColorBrightness","themeRed","themeGreen","themeBlue","parseInt","getThemeForegroundColor","getSlot","querySelector","slotHasContent","getSlotContent","slot","getSlotElements","slotContent","firstElementChild","elements","assignedElements","childNodes","getNavItemParentDetails","navType","parent","getParentElementType","getParentElement","Number","replace","hasValidationStatus","status","isSlotUsed","slotName","some","child","onComponentPropUndefinedChange","oldValue","newValue","callback","onComponentRequiredPropUndefined","props","component","i","prop","propName","console","kebabToCamelCase","kebabCase","individualWords","split","camelCase","substring","toUpperCase","checkResizeObserver","callbackFn","ResizeObserver","hex2dec","v","hexToRgba","hex","c","r","g","b","a","slice","rgbaStrToObj","rgbaStr","fourthChar","colorRGBA","rgba","rgb","elementOverflowsX","scrollWidth","clientWidth","hasClassificationBanner","getForm","addFormResetListener","addEventListener","removeFormResetListener","removeEventListener","pxToRem","px","base","tempPx","removeDisabledFalse"],"sources":["./src/utils/constants.ts","./src/utils/helpers.ts"],"sourcesContent":["import errorIcon from \"../assets/error-icon.svg\";\nimport infoIcon from \"../assets/info-icon.svg\";\nimport neutralIcon from \"../assets/neutral-icon.svg\";\nimport successIcon from \"../assets/success-icon.svg\";\nimport warningIcon from \"../assets/warning-icon.svg\";\n\n// Global status icons\nexport const VARIANT_ICONS = {\n  neutral: {\n    icon: neutralIcon,\n    ariaLabel: \"Neutral\",\n  },\n  info: {\n    icon: infoIcon,\n    ariaLabel: \"For your information\",\n  },\n  warning: {\n    icon: warningIcon,\n    ariaLabel: \"Warning\",\n  },\n  error: {\n    icon: errorIcon,\n    ariaLabel: \"Error\",\n  },\n  success: {\n    icon: successIcon,\n    ariaLabel: \"Success\",\n  },\n};\n\n// Global ARIA attributes\nexport const IC_INHERITED_ARIA = [\n  \"aria-atomic\",\n  \"aria-busy\",\n  \"aria-controls\",\n  \"aria-current\",\n  \"aria-describedby\",\n  \"aria-description\",\n  \"aria-details\",\n  \"aria-disabled\",\n  \"aria-dropeffect\",\n  \"aria-errormessage\",\n  \"aria-flowto\",\n  \"aria-grabbed\",\n  \"aria-haspopup\",\n  \"aria-hidden\",\n  \"aria-invalid\",\n  \"aria-keyshortcuts\",\n  \"aria-label\",\n  \"aria-labelledby\",\n  \"aria-live\",\n  \"aria-owns\",\n  \"aria-relevant\",\n  \"aria-roledescription\",\n];\n\nexport const IC_DEVICE_SIZES = {\n  XS: 576,\n  S: 768,\n  M: 992,\n  L: 1200,\n  XL: 99999,\n};\n\nexport const IC_BLOCK_COLOR_COMPONENTS = [\n  \"ic-hero\",\n  \"ic-top-navigation\",\n  \"ic-footer\",\n  \"ic-side-navigation\",\n  \"ic-alert\",\n];\n\nexport const IC_FIXED_COLOR_COMPONENTS = [\"ic-alert\"];\n\nexport interface IcColorExceptions {\n  [details: string]: string[];\n}\n\nexport const IC_BLOCK_COLOR_EXCEPTIONS: IcColorExceptions = {\n  \"ic-alert\": [\"ic-link\"],\n};\n\n/* Range within which the chosen theme colour would not have a sufficient brightness difference with either of the black or white foreground colours\n * The brightness difference must be greater than 125 to provide good colour visibility\n * Calculated by:\n * - Using the brightness formula for both colours: https://www.w3.org/TR/AERT/#color-contrast\n * - Adding 125 to the brightness of the black foreground colour - RGB(11, 12, 12)\n * - Subtracting 125 from the brightness of the white foreground colour - RGB(255, 255, 255)\n */\nexport const BLACK_MIN_COLOR_BRIGHTNESS = 136.701;\nexport const WHITE_MAX_COLOR_BRIGHTNESS = 130;\n","import { EventEmitter } from \"@stencil/core\";\nimport {\n  IcCallbackFunctionNoReturn,\n  IcInformationStatusOrEmpty,\n  IcNavParentDetails,\n  IcPropObject,\n  IcSearchMatchPositions,\n  IcColorRGBA,\n} from \"./types\";\n\nimport {\n  IcMenuOption,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../utils/types\";\nimport {\n  IC_BLOCK_COLOR_COMPONENTS,\n  IC_BLOCK_COLOR_EXCEPTIONS,\n  IC_FIXED_COLOR_COMPONENTS,\n} from \"./constants\";\n\nconst DARK_MODE_THRESHOLD = 133.3505;\n\n/**\n * Used to inherit global attributes set on the host. Called in componentWillLoad and assigned\n * to a variable that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\nexport const inheritAttributes = (\n  element: HTMLElement,\n  attributes: string[] = []\n): { [key: string]: unknown } => {\n  const attributeObject: { [key: string]: unknown } = {};\n\n  attributes.forEach((attr) => {\n    if (element.hasAttribute(attr)) {\n      const value = element.getAttribute(attr);\n      if (value !== null) {\n        attributeObject[attr] = element.getAttribute(attr);\n      }\n      element.removeAttribute(attr);\n    }\n  });\n\n  return attributeObject;\n};\n\nexport const debounceEvent = (\n  event: EventEmitter,\n  wait: number\n): EventEmitter => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const original = (event as any)._original || event;\n  return {\n    _original: event,\n    emit: debounce(original.emit.bind(original), wait),\n  } as EventEmitter;\n};\n\nexport const debounce = (\n  func: (...args: unknown[]) => void,\n  wait = 0\n): unknown => {\n  let timer: ReturnType<typeof setTimeout>;\n  return (...args: unknown[]) => {\n    clearTimeout(timer);\n    timer = setTimeout(func, wait, ...args);\n  };\n};\n\n/**\n * This method is used to add a hidden input to a host element that contains\n * a Shadow DOM. It does not add the input inside of the Shadow root which\n * allows it to be picked up inside of forms. It should contain the same\n * values as the host element.\n *\n * @param always Add a hidden input even if the container does not use Shadow\n * @param container The element where the input will be added\n * @param name The name of the input\n * @param value The value of the input\n * @param disabled If true, the input is disabled\n */\nexport const renderHiddenInput = (\n  always: boolean,\n  container: HTMLElement,\n  name: string,\n  value: string | undefined | null,\n  disabled: boolean\n): void => {\n  if (name !== undefined && (always || hasShadowDom(container))) {\n    const inputs = container.querySelectorAll(\"input.ic-input\");\n    const inputEls = Array.from(inputs);\n    const filtered = inputEls.filter((el) => container === el.parentElement);\n\n    let input = filtered[0] as HTMLInputElement;\n    if (input === null || input === undefined) {\n      input = container.ownerDocument.createElement(\"input\");\n      input.type = \"hidden\";\n      input.classList.add(\"ic-input\");\n      container.appendChild(input);\n    }\n    input.disabled = disabled;\n    input.name = name;\n    input.value = value || \"\";\n  }\n};\n\nexport const removeHiddenInput = (container: HTMLElement): void => {\n  const inputs = container.querySelectorAll(\"input.ic-input\");\n  const inputEls = Array.from(inputs);\n  const filtered = inputEls.filter((el) => container === el.parentElement);\n  const input = filtered[0] as HTMLInputElement;\n  input?.remove();\n};\n\nexport const hasShadowDom = (el: HTMLElement): boolean => {\n  return !!el.shadowRoot && !!el.attachShadow;\n};\n\nexport const getInputHelperTextID = (id: string): string => {\n  return id + \"-helper-text\";\n};\n\nexport const getInputValidationTextID = (id: string): string => {\n  return id + \"-validation-text\";\n};\n\nexport const getInputDescribedByText = (\n  inputId: string,\n  helperText: boolean,\n  validationText: boolean\n): string => {\n  return `${helperText ? getInputHelperTextID(inputId) : \"\"} ${\n    validationText ? getInputValidationTextID(inputId) : \"\"\n  }`.trim();\n};\n\n/**\n * This method helps to understand the context in which a component exists,\n * to assist with choosing appropriate foreground colours to use. For example,\n * this method will help you use the 'white' version of a button if it's within\n * a block colour element using white foreground text.\n *\n * This only works for components/elements passed via <slot> and not if they\n * are part of an IC component.\n *\n * \"\"\n * @returns IcThemeForeground depending on the context\n */\nexport const getThemeFromContext = (\n  el: Element,\n  themeFromEvent: IcThemeForeground = null\n): IcThemeForeground => {\n  const parentElement =\n    el.parentElement || (<ShadowRoot>el.getRootNode()).host.parentElement;\n  const blockColorParent = parentElement.closest(\n    IC_BLOCK_COLOR_COMPONENTS.join(\",\")\n  );\n\n  // If within a block color component\n  if (blockColorParent !== null) {\n    const parentTag = blockColorParent.tagName.toLowerCase();\n    const currentTag = el.tagName.toLowerCase();\n\n    if (IC_BLOCK_COLOR_EXCEPTIONS[parentTag]?.includes(currentTag)) {\n      return IcThemeForegroundEnum.Default;\n    } else if (\n      themeFromEvent !== null &&\n      !IC_FIXED_COLOR_COMPONENTS.includes(parentTag)\n    ) {\n      return themeFromEvent;\n    } else if (\n      blockColorParent.classList.contains(IcThemeForegroundEnum.Dark)\n    ) {\n      return IcThemeForegroundEnum.Dark;\n    }\n\n    return IcThemeForegroundEnum.Light;\n  }\n\n  return IcThemeForegroundEnum.Default;\n};\n\nexport const isMobileOrTablet = (): boolean => {\n  let isMobileOrTablet = false;\n  if (\"maxTouchPoints\" in navigator) {\n    isMobileOrTablet = navigator.maxTouchPoints > 0;\n  }\n  return isMobileOrTablet;\n};\n\n/**\n * Will create a button within the lightDOM which interacts with the parent form.\n * This is required as buttons within the shadowDOM will not invoke a submit or reset\n *\n * @param form - parent form element which contains shadowDom button\n * @param button - shadowDOM button\n */\nexport const handleHiddenFormButtonClick = (\n  form: HTMLFormElement,\n  button: HTMLIcButtonElement | HTMLButtonElement\n): void => {\n  const hiddenFormButton = document.createElement(\"button\");\n\n  hiddenFormButton.setAttribute(\"type\", button.type);\n  hiddenFormButton.style.display = \"none\";\n\n  form.appendChild(hiddenFormButton);\n\n  hiddenFormButton.click();\n  hiddenFormButton.remove();\n};\n\nexport const isEmptyString = (value: string): boolean => {\n  if (!value) {\n    return true;\n  }\n\n  return value.trim().length === 0;\n};\n\n/**\n * Extracts the label using the value from an object. Requires the object to have a label and value property.\n * @param value - value from object\n * @param options - list of menu items\n * @returns - label corresponding to value\n */\nexport const getLabelFromValue = (\n  value: string,\n  options: IcMenuOption[]\n): string | undefined => {\n  const ungroupedOptions: IcMenuOption[] = [];\n  if (options.length > 0 && options.map) {\n    options.map((option) => {\n      if (option.children) {\n        option.children.map((option: IcMenuOption) =>\n          ungroupedOptions.push(option)\n        );\n      } else {\n        ungroupedOptions.push(option);\n      }\n    });\n    return ungroupedOptions.find((option) => option.value === value)?.label;\n  }\n\n  return undefined;\n};\n\n/**\n * Filters the options based on the search string.\n * @param options - array of options\n * @param includeDescriptions - determines whether option descriptions are included when filtering options\n * @param searchString - string used to filter the options\n * @param position - whether the search string matches the start of or anywhere in the options\n * @returns filtered array of options\n */\nexport const getFilteredMenuOptions = (\n  options: IcMenuOption[],\n  includeDescriptions: boolean,\n  searchString: string,\n  position: IcSearchMatchPositions\n): IcMenuOption[] => {\n  let rawFilteredOptions;\n\n  if (position === \"anywhere\") {\n    rawFilteredOptions = options.filter((option) => {\n      if (includeDescriptions) {\n        return (\n          option.label.toLowerCase().includes(searchString.toLowerCase()) ||\n          option.description?.toLowerCase().includes(searchString.toLowerCase())\n        );\n      } else {\n        return option.label.toLowerCase().includes(searchString.toLowerCase());\n      }\n    });\n  } else {\n    rawFilteredOptions = options.filter((option) => {\n      if (includeDescriptions) {\n        return (\n          option.label.toLowerCase().startsWith(searchString.toLowerCase()) ||\n          option.description\n            ?.toLowerCase()\n            .startsWith(searchString.toLowerCase())\n        );\n      } else {\n        return option.label\n          .toLowerCase()\n          .startsWith(searchString.toLowerCase());\n      }\n    });\n  }\n\n  return rawFilteredOptions;\n};\n\nexport const deviceSizeMatches = (size: number): boolean =>\n  window.matchMedia(`(max-width: ${size}px)`).matches;\n\nexport const getCurrentDeviceSize = (): number => {\n  if (deviceSizeMatches(DEVICE_SIZES.S)) {\n    return DEVICE_SIZES.S;\n  }\n  if (deviceSizeMatches(DEVICE_SIZES.M)) {\n    return DEVICE_SIZES.M;\n  }\n  if (deviceSizeMatches(DEVICE_SIZES.L)) {\n    return DEVICE_SIZES.L;\n  }\n  if (deviceSizeMatches(DEVICE_SIZES.XL)) {\n    return DEVICE_SIZES.XL;\n  }\n  //fallback needed as all of above get initialised to 0 in jest tests\n  return DEVICE_SIZES.UNDEFINED;\n};\n\nexport const getCssProperty = (cssVar: string): string => {\n  return getComputedStyle(document.documentElement).getPropertyValue(cssVar);\n};\n\n/**\n * Returns the brightness of the theme colour, calculated by using the theme RGB CSS values by:\n * - Multiplying each RGB value by a set number: https://www.w3.org/TR/AERT/#color-contrast\n * - Adding them together and dividing by 1000\n * This is a similar calculation to its CSS counterpart: \"--ic-theme-text\"\n * @returns number representing the brightness of the theme colour\n */\nexport const getThemeColorBrightness = (): number => {\n  const themeRed = getCssProperty(\"--ic-theme-primary-r\");\n  const themeGreen = getCssProperty(\"--ic-theme-primary-g\");\n  const themeBlue = getCssProperty(\"--ic-theme-primary-b\");\n  return (\n    (parseInt(themeRed) * 299 +\n      parseInt(themeGreen) * 587 +\n      parseInt(themeBlue) * 114) /\n    1000\n  );\n};\n\n/**\n * Returns if dark or light foreground colors should be used for color contrast reasons\n * @returns \"dark\" or \"light\"\n */\nexport const getThemeForegroundColor = (): IcThemeForeground => {\n  return getThemeColorBrightness() > DARK_MODE_THRESHOLD\n    ? IcThemeForegroundEnum.Dark\n    : IcThemeForegroundEnum.Light;\n};\n\nexport const getSlot = (element: HTMLElement, name: string): Element | null => {\n  if (element && element.querySelector) {\n    return element.querySelector(`[slot=\"${name}\"]`);\n  }\n  return null;\n};\n\nexport const slotHasContent = (element: HTMLElement, name: string): boolean =>\n  getSlot(element, name) !== null;\n\nexport const getSlotContent = (\n  element: HTMLElement,\n  name: string\n): Element[] | NodeListOf<ChildNode> | null => {\n  const slot = getSlot(element, name);\n  if (slot) {\n    return getSlotElements(slot);\n  }\n\n  return null;\n};\n\nexport const getSlotElements = (\n  slot: Element\n): NodeListOf<ChildNode> | Element[] => {\n  const slotContent = slot.firstElementChild as HTMLSlotElement;\n\n  if (slotContent !== null) {\n    const elements = slotContent.assignedElements\n      ? slotContent.assignedElements()\n      : slotContent.childNodes;\n    return elements.length ? elements : null;\n  } else {\n    //check for single element\n    return slot === null ? null : [slot];\n  }\n};\n\nexport const getNavItemParentDetails = (\n  el: HTMLElement\n): IcNavParentDetails => {\n  let navType: IcNavParentDetails = { navType: \"\", parent: null };\n  switch (getParentElementType(el)) {\n    case \"IC-NAVIGATION-GROUP\":\n      navType = getNavItemParentDetails(el.parentElement);\n      break;\n    case \"IC-TOP-NAVIGATION\":\n      navType = { navType: \"top\", parent: getParentElement(el) };\n      break;\n    case \"IC-SIDE-NAVIGATION\":\n      navType = { navType: \"side\", parent: getParentElement(el) };\n      break;\n    case \"IC-PAGE-HEADER\":\n      navType = { navType: \"page-header\", parent: null };\n      break;\n  }\n  return navType;\n};\n\nexport const DEVICE_SIZES = {\n  XS: Number(getCssProperty(\"--ic-breakpoint-xs\").replace(\"px\", \"\")), // 0\n  S: Number(getCssProperty(\"--ic-breakpoint-sm\").replace(\"px\", \"\")), // 576\n  M: Number(getCssProperty(\"--ic-breakpoint-md\").replace(\"px\", \"\")), // 768\n  L: Number(getCssProperty(\"--ic-breakpoint-lg\").replace(\"px\", \"\")), // 992\n  XL: Number(getCssProperty(\"--ic-breakpoint-xl\").replace(\"px\", \"\")), // 1200\n  UNDEFINED: 1200,\n};\n\nexport const hasValidationStatus = (\n  status: IcInformationStatusOrEmpty,\n  disabled: boolean\n): boolean => {\n  return status !== \"\" && !disabled;\n};\n\nexport const isSlotUsed = (element: HTMLElement, slotName: string): boolean => {\n  return Array.from(element.children).some(\n    (child) => child.getAttribute(\"slot\") === slotName\n  );\n};\n\n// added as a common method to allow detection of gatsby hydration issue, where (camelCase) props are initially undefined & then update\n// with a value. Allows a callback function to be executed when this is the case\nexport const onComponentPropUndefinedChange = (\n  oldValue: string | undefined,\n  newValue: string | undefined,\n  callback: IcCallbackFunctionNoReturn\n): void => {\n  if (oldValue === undefined && newValue !== oldValue) {\n    callback();\n  }\n};\n\nexport const onComponentRequiredPropUndefined = (\n  props: IcPropObject[],\n  component: string\n): void => {\n  for (let i = 0; i < props.length; i++) {\n    const { prop, propName } = props[i];\n    if (prop === null || prop === undefined) {\n      console.error(\n        `No ${propName} specified for ${component} component - prop '${propName}' (web components) / '${kebabToCamelCase(\n          propName\n        )}' (react) required`\n      );\n    }\n  }\n};\n\nexport const kebabToCamelCase = (kebabCase: string): string => {\n  kebabCase = kebabCase.toLowerCase();\n  const individualWords: string[] = kebabCase.split(\"-\");\n  let camelCase = individualWords[0];\n  for (let i = 1; i < individualWords.length; i++) {\n    camelCase +=\n      individualWords[i].substring(0, 1).toUpperCase() +\n      individualWords[i].substring(1);\n  }\n  return camelCase;\n};\n\nexport const checkResizeObserver = (\n  callbackFn: IcCallbackFunctionNoReturn\n): void => {\n  if (\n    typeof window !== \"undefined\" &&\n    typeof window.ResizeObserver !== \"undefined\"\n  ) {\n    callbackFn();\n  }\n};\n\nconst hex2dec = function (v: string) {\n  return parseInt(v, 16);\n};\n\nexport const hexToRgba = (hex: string): IcColorRGBA => {\n  let c;\n  if (hex.length === 4) {\n    c = hex.replace(\"#\", \"\").split(\"\");\n    return {\n      r: hex2dec(c[0] + c[0]),\n      g: hex2dec(c[1] + c[1]),\n      b: hex2dec(c[2] + c[2]),\n      a: 1,\n    };\n  } else {\n    return {\n      r: hex2dec(hex.slice(1, 3)),\n      g: hex2dec(hex.slice(3, 5)),\n      b: hex2dec(hex.slice(5)),\n      a: 1,\n    };\n  }\n};\n\nexport const rgbaStrToObj = (rgbaStr: string): IcColorRGBA => {\n  const fourthChar = rgbaStr.slice(3, 4);\n  let colorRGBA: IcColorRGBA;\n  if (fourthChar.toLowerCase() === \"a\") {\n    colorRGBA = { r: null, g: null, b: null, a: null };\n    const rgba = rgbaStr\n      .substring(5, rgbaStr.length - 1)\n      .replace(/ /g, \"\")\n      .split(\",\");\n    colorRGBA.r = Number(rgba[0]);\n    colorRGBA.g = Number(rgba[1]);\n    colorRGBA.b = Number(rgba[2]);\n    colorRGBA.a = Number(rgba[3]);\n  } else {\n    colorRGBA = { r: null, g: null, b: null, a: 1 };\n    const rgb = rgbaStr\n      .substring(4, rgbaStr.length - 1)\n      .replace(/ /g, \"\")\n      .split(\",\");\n    colorRGBA.r = Number(rgb[0]);\n    colorRGBA.g = Number(rgb[1]);\n    colorRGBA.b = Number(rgb[2]);\n  }\n\n  return colorRGBA;\n};\n\nexport const elementOverflowsX = (element: HTMLElement): boolean => {\n  return element.scrollWidth > element.clientWidth;\n};\n/**\n *\n * @param child - The child element\n * @returns string\n */\nexport const getParentElementType = (child: HTMLElement): string =>\n  child.parentElement.tagName;\n\nexport const getParentElement = (child: HTMLElement): HTMLElement =>\n  child.parentElement;\n\nexport const hasClassificationBanner = (): boolean => {\n  return document.querySelector(\"ic-classification-banner:not([inline='true'])\")\n    ? true\n    : false;\n};\n\nexport const getForm = (el: HTMLElement): HTMLFormElement | null => {\n  return el.closest(\"FORM\");\n};\n\nexport const addFormResetListener = (\n  el: HTMLElement,\n  callbackFn: IcCallbackFunctionNoReturn\n): void => {\n  const form = getForm(el);\n  if (form !== null) {\n    form.addEventListener(\"reset\", callbackFn);\n  }\n};\n\nexport const removeFormResetListener = (\n  el: HTMLElement,\n  callbackFn: IcCallbackFunctionNoReturn\n): void => {\n  const form = getForm(el);\n  if (form !== null) {\n    form.removeEventListener(\"reset\", callbackFn);\n  }\n};\n\nexport const pxToRem = (px: string, base = 16): string => {\n  const tempPx = parseInt(px);\n  return `${(1 / base) * tempPx}rem`;\n};\n\nexport const removeDisabledFalse = (\n  disabled: boolean,\n  element: HTMLElement\n): void => {\n  if (!disabled) {\n    element.removeAttribute(\"disabled\");\n  }\n};\n"],"mappings":"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"}

package/dist/core/p-e14bc195.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as i,g as o}from"./p-69920d86.js";import{i as a,D as s,g as n,s as l,c as r}from"./p-dd980be4.js";import"./p-6f57b13c.js";const d='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{position:relative;display:block}.data{display:flex;align-items:center}.text-cells{display:flex;flex-grow:1;min-width:0}.label{width:12.5rem;min-width:12.5rem;margin-right:var(--ic-space-md);color:var(--ic-color-tertiary-text)}.value{flex-grow:1}slot[name="value"]::slotted(ic-text-field[readonly][hide-label]){margin-top:calc(var(--ic-space-xs) * -1)}slot[name="value"]::slotted(ic-text-field[small][readonly][hide-label]){margin-top:calc(var(--ic-space-xxs) * -1)}slot[name="value"]::slotted(ic-text-field[readonly][hide-label][rows]){margin-top:calc(var(--ic-space-xxs) * -1 - var(--ic-space-xxxs))}.end-component{width:-moz-fit-content;width:fit-content;margin-left:3.5rem}.divider{margin-top:var(--ic-space-md);height:var(--ic-space-1px);background-color:var(--ic-architectural-300)}:host(.small) .divider{margin-top:var(--ic-space-xs)}:host(.breakpoint-medium) .label{width:10rem;min-width:10rem}:host(.breakpoint-xs) .text-cells{flex-direction:column}:host(.breakpoint-xs) .label{width:8rem;margin-bottom:var(--ic-space-xs)}:host(.breakpoint-xs) .value{max-width:95%}:host(.breakpoint-xs) .end-component{margin-left:0}@media (forced-colors: active){.divider{background-color:canvastext}}';const c=class{constructor(i){e(this,i);this.hasEndComponent=false;this.resizeObserver=null;this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.checkLabelAbove()}));this.resizeObserver.observe(this.el)};this.renderLabel=e=>{if(a(this.el,"label")){return t("div",{class:"label"},t("slot",{name:"label"}))}else if(e){return t("div",{class:"label"},t("ic-typography",{variant:this.entitySize==="xs"?"label":"subtitle-large"},e))}return null};this.deviceSize=s.XL;this.entitySize=undefined;this.label=undefined;this.small=false;this.value=undefined}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentWillLoad(){this.deviceSize=n();this.hasEndComponent=l(this.el,"end-component");this.checkLabelAbove()}componentDidLoad(){r(this.runResizeObserver);if(this.hasEndComponent){this.labelEndComponent()}}checkLabelAbove(){var e;const t=(e=this.el.shadowRoot.querySelector(".data"))===null||e===void 0?void 0:e.clientWidth;if(t){if(t+46<s.S){this.entitySize="xs"}else if(t+46<s.M){this.entitySize="m"}else{this.entitySize="xl"}}}labelEndComponent(){const e=this.el.shadowRoot.querySelectorAll("slot[name=end-component]");e.forEach((e=>e.setAttribute("aria-label","for "+this.label+" row")))}render(){const{label:e,value:o,small:a}=this;return t(i,{class:{["small"]:a,["breakpoint-medium"]:this.entitySize==="m",["breakpoint-xs"]:this.entitySize==="xs"},role:"listitem"},t("div",{class:"data"},t("div",{class:"text-cells"},this.renderLabel(e),t("div",{class:"value"},t("slot",{name:"value"},t("ic-typography",{variant:"body"},o)))),this.hasEndComponent&&t("div",{class:"end-component"},t("div",{role:"cell"},t("slot",{name:"end-component"})))),t("div",{class:"divider"}))}get el(){return o(this)}};c.style=d;export{c as ic_data_row};
+//# sourceMappingURL=p-e14bc195.entry.js.map

package/dist/core/p-e14bc195.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icDataRowCss","DataRow","this","hasEndComponent","resizeObserver","runResizeObserver","ResizeObserver","checkLabelAbove","observe","el","renderLabel","label","isSlotUsed","h","class","name","variant","entitySize","DEVICE_SIZES","XL","disconnectedCallback","disconnect","componentWillLoad","deviceSize","getCurrentDeviceSize","slotHasContent","componentDidLoad","checkResizeObserver","labelEndComponent","rowSize","_a","shadowRoot","querySelector","clientWidth","S","M","component","querySelectorAll","forEach","child","setAttribute","render","value","small","Host","role"],"sources":["./src/components/ic-data-row/ic-data-row.css?tag=ic-data-row&encapsulation=shadow","./src/components/ic-data-row/ic-data-row.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  position: relative;\n  display: block;\n}\n\n.data {\n  display: flex;\n  align-items: center;\n}\n\n.text-cells {\n  display: flex;\n  flex-grow: 1;\n  min-width: 0;\n}\n\n.label {\n  width: 12.5rem;\n  min-width: 12.5rem;\n  margin-right: var(--ic-space-md);\n  color: var(--ic-color-tertiary-text);\n}\n\n.value {\n  flex-grow: 1;\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label]) {\n  margin-top: calc(var(--ic-space-xs) * -1);\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[small][readonly][hide-label]) {\n  margin-top: calc(var(--ic-space-xxs) * -1);\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label][rows]) {\n  margin-top: calc(var(--ic-space-xxs) * -1 - var(--ic-space-xxxs));\n}\n\n.end-component {\n  width: fit-content;\n  margin-left: 3.5rem;\n}\n\n.divider {\n  margin-top: var(--ic-space-md);\n  height: var(--ic-space-1px);\n  background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n  margin-top: var(--ic-space-xs);\n}\n\n:host(.breakpoint-medium) .label {\n  width: 10rem;\n  min-width: 10rem;\n}\n\n:host(.breakpoint-xs) .text-cells {\n  flex-direction: column;\n}\n\n:host(.breakpoint-xs) .label {\n  width: 8rem;\n  margin-bottom: var(--ic-space-xs);\n}\n\n:host(.breakpoint-xs) .value {\n  max-width: 95%;\n}\n\n:host(.breakpoint-xs) .end-component {\n  margin-left: 0;\n}\n\n@media (forced-colors: active) {\n  .divider {\n    background-color: canvastext;\n  }\n}\n","import { Component, Element, Host, Prop, h, State } from \"@stencil/core\";\nimport {\n  checkResizeObserver,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  isSlotUsed,\n  slotHasContent,\n} from \"../../utils/helpers\";\n\n/**\n * @slot label - Content will be rendered in the leftmost cell.\n * @slot value - Content will be rendered to the right of the label.\n * @slot end-component - Content will be displayed in the rightmost cell.\n */\n@Component({\n  tag: \"ic-data-row\",\n  styleUrl: \"ic-data-row.css\",\n  shadow: true,\n})\nexport class DataRow {\n  private hasEndComponent: boolean = false;\n  private resizeObserver: ResizeObserver = null;\n\n  @Element() el: HTMLIcDataRowElement;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n  @State() entitySize: \"xl\" | \"m\" | \"xs\";\n\n  /**\n   * The label in the leftmost cell of the row.\n   */\n  @Prop() label: string;\n\n  /**\n   * If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.\n   */\n  @Prop() small: boolean = false;\n\n  /**\n   * The value of the middle (right if no end-component supplied) cell of the row.\n   */\n  @Prop() value: string;\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n    this.hasEndComponent = slotHasContent(this.el, \"end-component\");\n    this.checkLabelAbove();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n    if (this.hasEndComponent) {\n      this.labelEndComponent();\n    }\n  }\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.checkLabelAbove();\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  private checkLabelAbove() {\n    const rowSize = this.el.shadowRoot.querySelector(\".data\")?.clientWidth;\n    if (rowSize) {\n      if (rowSize + 46 < DEVICE_SIZES.S) {\n        this.entitySize = \"xs\";\n      } else if (rowSize + 46 < DEVICE_SIZES.M) {\n        this.entitySize = \"m\";\n      } else {\n        this.entitySize = \"xl\";\n      }\n    }\n  }\n\n  /**\n   * Renders the label either as a ic-typography or slot. Slotted content takes precedence.\n   * @param label string - label of value\n   * @returns HTMLDivElement - returns label as slot or ic-typography with label as textContent\n   */\n  private renderLabel = (label: string) => {\n    if (isSlotUsed(this.el, \"label\")) {\n      return (\n        <div class=\"label\">\n          <slot name=\"label\"></slot>\n        </div>\n      );\n    } else if (label) {\n      return (\n        <div class=\"label\">\n          <ic-typography\n            variant={this.entitySize === \"xs\" ? \"label\" : \"subtitle-large\"}\n          >\n            {label}\n          </ic-typography>\n        </div>\n      );\n    }\n\n    return null;\n  };\n\n  private labelEndComponent(): void {\n    const component = this.el.shadowRoot.querySelectorAll(\n      \"slot[name=end-component]\"\n    );\n\n    component.forEach((child: HTMLElement) =>\n      child.setAttribute(\"aria-label\", \"for \" + this.label + \" row\")\n    );\n  }\n\n  render() {\n    const { label, value, small } = this;\n\n    return (\n      <Host\n        class={{\n          [\"small\"]: small,\n          [\"breakpoint-medium\"]: this.entitySize === \"m\",\n          [\"breakpoint-xs\"]: this.entitySize === \"xs\",\n        }}\n        role=\"listitem\"\n      >\n        <div class=\"data\">\n          <div class=\"text-cells\">\n            {this.renderLabel(label)}\n            <div class=\"value\">\n              <slot name=\"value\">\n                <ic-typography variant=\"body\">{value}</ic-typography>\n              </slot>\n            </div>\n          </div>\n          {this.hasEndComponent && (\n            <div class=\"end-component\">\n              <div role=\"cell\">\n                <slot name=\"end-component\"></slot>\n              </div>\n            </div>\n          )}\n        </div>\n        <div class=\"divider\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"iJAAA,MAAMA,EAAe,mhH,MCmBRC,EAAO,M,yBACVC,KAAAC,gBAA2B,MAC3BD,KAAAE,eAAiC,KAyCjCF,KAAAG,kBAAoB,KAC1BH,KAAKE,eAAiB,IAAIE,gBAAe,KACvCJ,KAAKK,iBAAiB,IAGxBL,KAAKE,eAAeI,QAAQN,KAAKO,GAAG,EAqB9BP,KAAAQ,YAAeC,IACrB,GAAIC,EAAWV,KAAKO,GAAI,SAAU,CAChC,OACEI,EAAA,OAAKC,MAAM,SACTD,EAAA,QAAME,KAAK,U,MAGV,GAAIJ,EAAO,CAChB,OACEE,EAAA,OAAKC,MAAM,SACTD,EAAA,iBACEG,QAASd,KAAKe,aAAe,KAAO,QAAU,kBAE7CN,G,CAMT,OAAO,IAAI,E,gBAlFiBO,EAAaC,G,0DAWlB,M,qBAOzBC,uBACE,GAAIlB,KAAKE,iBAAmB,KAAM,CAChCF,KAAKE,eAAeiB,Y,EAIxBC,oBACEpB,KAAKqB,WAAaC,IAClBtB,KAAKC,gBAAkBsB,EAAevB,KAAKO,GAAI,iBAC/CP,KAAKK,iB,CAGPmB,mBACEC,EAAoBzB,KAAKG,mBACzB,GAAIH,KAAKC,gBAAiB,CACxBD,KAAK0B,mB,EAYDrB,kB,MACN,MAAMsB,GAAUC,EAAA5B,KAAKO,GAAGsB,WAAWC,cAAc,YAAQ,MAAAF,SAAA,SAAAA,EAAEG,YAC3D,GAAIJ,EAAS,CACX,GAAIA,EAAU,GAAKX,EAAagB,EAAG,CACjChC,KAAKe,WAAa,I,MACb,GAAIY,EAAU,GAAKX,EAAaiB,EAAG,CACxCjC,KAAKe,WAAa,G,KACb,CACLf,KAAKe,WAAa,I,GAgChBW,oBACN,MAAMQ,EAAYlC,KAAKO,GAAGsB,WAAWM,iBACnC,4BAGFD,EAAUE,SAASC,GACjBA,EAAMC,aAAa,aAAc,OAAStC,KAAKS,MAAQ,S,CAI3D8B,SACE,MAAM9B,MAAEA,EAAK+B,MAAEA,EAAKC,MAAEA,GAAUzC,KAEhC,OACEW,EAAC+B,EAAI,CACH9B,MAAO,CACL,CAAC,SAAU6B,EACX,CAAC,qBAAsBzC,KAAKe,aAAe,IAC3C,CAAC,iBAAkBf,KAAKe,aAAe,MAEzC4B,KAAK,YAELhC,EAAA,OAAKC,MAAM,QACTD,EAAA,OAAKC,MAAM,cACRZ,KAAKQ,YAAYC,GAClBE,EAAA,OAAKC,MAAM,SACTD,EAAA,QAAME,KAAK,SACTF,EAAA,iBAAeG,QAAQ,QAAQ0B,MAIpCxC,KAAKC,iBACJU,EAAA,OAAKC,MAAM,iBACTD,EAAA,OAAKgC,KAAK,QACRhC,EAAA,QAAME,KAAK,qBAKnBF,EAAA,OAAKC,MAAM,Y"}

package/dist/core/p-e2fdb944.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as s,g as o}from"./p-69920d86.js";import{c as a}from"./p-f2c6a143.js";import{i as n,V as r,a as c,J as d}from"./p-dd980be4.js";import{I as l}from"./p-6f57b13c.js";const h='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{--bottom-position:var(--ic-space-xl);position:fixed;bottom:var(--bottom-position);left:50%;transform:translate(-50%);animation:fadein var(--ic-transition-duration-slow) ease-in-out;z-index:var(--ic-z-index-toast)}:host(.hidden){display:none;animation:fadeout var(--ic-transition-duration-slow) ease-in-out}.container{max-width:32.5rem;min-width:18rem;box-shadow:var(--ic-elevation-overlay);min-height:3.5rem;background-color:var(--ic-architectural-800);color:var(--ic-color-white-text);display:flex;align-items:center;position:relative;border-radius:var(--ic-border-radius)}.toast-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);position:absolute;border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs)}.divider-neutral{background-color:var(--ic-status-unknown)}.divider-info{background-color:var(--ic-status-info-contrast)}.divider-warning{background-color:var(--ic-status-warning-contrast)}.divider-error{background-color:var(--ic-status-error-contrast)}.divider-success{background-color:var(--ic-status-success-contrast)}.toast-icon,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}:host([variant="neutral"]) .toast-icon svg,::slotted(svg){fill:var(--ic-status-unknown)}:host([variant="info"]) .toast-icon svg{fill:var(--ic-status-info-contrast)}:host([variant="warning"]) .toast-icon svg{fill:var(--ic-status-warning-contrast)}:host([variant="error"]) .toast-icon svg{fill:var(--ic-status-error-contrast)}:host([variant="success"]) .toast-icon svg{fill:var(--ic-status-success-contrast)}.toast-content{margin-left:var(--ic-space-xs);width:100%}.no-icon{margin-left:var(--ic-space-md)}.toast-message{padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}.toast-action-container{padding-bottom:var(--ic-space-md)}ic-button,.toast-dismiss-timer{padding:var(--ic-space-xs)}@media (max-width: 576px){:host{--bottom-position:var(--ic-space-lg);width:calc(100% - 2 * var(--ic-space-md))}}@media (min-width: 993px){:host{--bottom-position:calc(var(--ic-space-xl) + var(--ic-space-xs))}}@media (forced-colors: active){.container{border:var(--ic-hc-border)}}@keyframes fadein{from{bottom:0;opacity:0}to{bottom:var(--bottom-position);opacity:1}}@keyframes fadeout{from{bottom:var(--bottom-position);opacity:1}to{bottom:0;opacity:0}}';const u=1e3;const m=70;const p=140;const b=class{constructor(e){t(this,e);this.icDismiss=i(this,"icDismiss",7);this.interactiveElements=[];this.dismissAction=()=>{this.icDismiss.emit()};this.handleProgressChange=()=>{this.timerProgress-=u/this.autoDismissTimeout*100};this.timerProgress=100;this.visible=false;this.autoDismissTimeout=5e3;this.dismissButtonAriaLabel="dismiss";this.dismissMode="manual";this.heading=undefined;this.message=undefined;this.neutralIconAriaLabel=undefined;this.variant=undefined}disconnectedCallback(){window.clearTimeout(this.dismissTimeout);window.clearInterval(this.timerRefreshInterval)}componentWillLoad(){var t,i;this.handleLongText(this.heading.length>m,((t=this.message)===null||t===void 0?void 0:t.length)>p);if(this.autoDismissTimeout<5e3)this.autoDismissTimeout=5e3;if(n(this.el,"action"))this.dismissMode="manual";this.isManual=this.dismissMode==="manual";if(n(this.el,"neutral-icon"))this.variant="neutral";if(this.variant==="neutral"){this.neutralVariantLabel=(i=this.neutralIconAriaLabel)!==null&&i!==void 0?i:r[this.variant].ariaLabel}if(this.isManual){this.el.setAttribute("aria-label",this.variant?this.neutralVariantLabel||r[this.variant].ariaLabel:this.heading);(this.variant||this.message)&&this.el.setAttribute("aria-description",this.variant?`${this.heading}${this.message!==undefined?`. ${this.message}`:""}`:this.message)}}componentDidLoad(){c([{prop:this.heading,propName:"heading"}],"Toast");const t=d(this.el,"action");const i=this.el.shadowRoot.querySelector("ic-button");if(t)this.interactiveElements.push(t);if(i)this.interactiveElements.push(i)}handleDismiss(){this.visible=false;clearInterval(this.timerRefreshInterval);this.timerProgress=100}handleKeyboard(t){if(this.isManual&&this.visible){switch(t.key){case"Tab":t.preventDefault();this.findNextInteractiveElement(t.shiftKey).setFocus();break;case"Escape":!t.repeat&&this.dismissAction();t.stopImmediatePropagation();break}}}handleTimer(t){if(!this.isManual){switch(t.type){case"mouseenter":window.clearTimeout(this.dismissTimeout);window.clearInterval(this.timerRefreshInterval);this.timerProgress=100;break;case"mouseleave":this.dismissTimeout=window.setTimeout(this.dismissAction,this.autoDismissTimeout);this.timerRefreshInterval=window.setInterval(this.handleProgressChange,u);break}}}async setVisible(){if(!this.visible)this.visible=true;if(!this.isManual){this.dismissTimeout=window.setTimeout(this.dismissAction,this.autoDismissTimeout);this.timerRefreshInterval=window.setInterval(this.handleProgressChange,u);return null}else{window.setTimeout((()=>this.interactiveElements[0].setFocus()),200);return document.activeElement}}handleLongText(t,i){if(i||t){console.error(`Too many characters in toast ${t?"heading":""}${t&&i?" and ":""}${i?"message":""}. Refer to character limits specified in the prop description`)}}findNextInteractiveElement(t){const i=this.interactiveElements[0];const e=this.interactiveElements[this.interactiveElements.length-1];const s=t?i:e;const o=t?e:i;if(this.isActive(s))return o;let a;const n=this.interactiveElements.some(((t,i)=>{if(!this.isActive(t))return false;a=i;return true}));if(!n)return i;return this.interactiveElements[a+(t?-1:1)]}isActive(t){if(t===this.el)return!!this.el.shadowRoot.activeElement;return document.activeElement===t}render(){const{variant:t,heading:i,message:o,visible:c,isManual:d,dismissButtonAriaLabel:h}=this;return e(s,{class:{["hidden"]:!c},role:d?"dialog":"status"},e("div",{class:"container"},t&&c&&e("div",{class:"toast-icon-container"},e("div",{class:{["divider"]:true,[`divider-${t}`]:true}}),t==="neutral"?e("slot",{name:"neutral-icon"}):e("span",{class:"toast-icon",innerHTML:r[t].icon})),e("div",{class:{["toast-content"]:true,["no-icon"]:t==="neutral"&&!n(this.el,"neutral-icon")}},e("div",{class:"toast-message"},e("ic-typography",{variant:"subtitle-large"},c&&e("h5",null,i)),o&&e("ic-typography",{variant:"body"},c&&e("p",null,o))),n(this.el,"action")&&e("div",{class:"toast-action-container"},e("slot",{name:"action"}))),!d?e("ic-loading-indicator",{class:"toast-dismiss-timer",appearance:"light",size:"icon",progress:this.timerProgress}):e("ic-button",{id:"dismiss-button",innerHTML:a,onClick:this.dismissAction,variant:"icon",appearance:l.Light,"aria-label":h})))}get el(){return o(this)}};b.style=h;export{b as ic_toast};
+//# sourceMappingURL=p-e2fdb944.entry.js.map

package/dist/core/p-e2fdb944.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icToastCss","AUTO_DISMISS_TIMER_REFRESH_RATE_MS","TOAST_HEADING_CHAR_LIMIT","TOAST_MESSAGE_CHAR_LIMIT","Toast","this","interactiveElements","dismissAction","icDismiss","emit","handleProgressChange","timerProgress","autoDismissTimeout","disconnectedCallback","window","clearTimeout","dismissTimeout","clearInterval","timerRefreshInterval","componentWillLoad","handleLongText","heading","length","_a","message","isSlotUsed","el","dismissMode","isManual","variant","neutralVariantLabel","_b","neutralIconAriaLabel","VARIANT_ICONS","ariaLabel","setAttribute","undefined","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","actionContent","getSlot","dismissButton","shadowRoot","querySelector","push","handleDismiss","visible","handleKeyboard","ev","key","preventDefault","findNextInteractiveElement","shiftKey","setFocus","repeat","stopImmediatePropagation","handleTimer","type","setTimeout","setInterval","async","document","activeElement","headingTooLong","messageTooLong","console","error","isBackwards","first","last","source","target","isActive","currentIndex","found","some","index","targetEl","render","dismissButtonAriaLabel","h","Host","class","role","name","innerHTML","icon","appearance","size","progress","id","closeIcon","onClick","IcThemeForegroundEnum","Light"],"sources":["./src/components/ic-toast/ic-toast.css?tag=ic-toast&encapsulation=shadow","./src/components/ic-toast/ic-toast.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-toast: z-index of toast\n */\n\n:host {\n  --bottom-position: var(--ic-space-xl);\n\n  position: fixed;\n  bottom: var(--bottom-position);\n  left: 50%;\n  transform: translate(-50%);\n  animation: fadein var(--ic-transition-duration-slow) ease-in-out;\n  z-index: var(--ic-z-index-toast);\n}\n\n:host(.hidden) {\n  display: none;\n  animation: fadeout var(--ic-transition-duration-slow) ease-in-out;\n}\n\n.container {\n  max-width: 32.5rem;\n  min-width: 18rem;\n  box-shadow: var(--ic-elevation-overlay);\n  min-height: 3.5rem;\n  background-color: var(--ic-architectural-800);\n  color: var(--ic-color-white-text);\n  display: flex;\n  align-items: center;\n  position: relative;\n  border-radius: var(--ic-border-radius);\n}\n\n.toast-icon-container {\n  height: 100%;\n  display: flex;\n  align-items: center;\n}\n\n.divider {\n  height: 100%;\n  width: var(--ic-space-xs);\n  position: absolute;\n  border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n}\n\n.divider-neutral {\n  background-color: var(--ic-status-unknown);\n}\n\n.divider-info {\n  background-color: var(--ic-status-info-contrast);\n}\n\n.divider-warning {\n  background-color: var(--ic-status-warning-contrast);\n}\n\n.divider-error {\n  background-color: var(--ic-status-error-contrast);\n}\n\n.divider-success {\n  background-color: var(--ic-status-success-contrast);\n}\n\n.toast-icon,\n::slotted(svg) {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  margin-left: var(--ic-space-md);\n}\n\n:host([variant=\"neutral\"]) .toast-icon svg,\n::slotted(svg) {\n  fill: var(--ic-status-unknown);\n}\n\n:host([variant=\"info\"]) .toast-icon svg {\n  fill: var(--ic-status-info-contrast);\n}\n\n:host([variant=\"warning\"]) .toast-icon svg {\n  fill: var(--ic-status-warning-contrast);\n}\n\n:host([variant=\"error\"]) .toast-icon svg {\n  fill: var(--ic-status-error-contrast);\n}\n\n:host([variant=\"success\"]) .toast-icon svg {\n  fill: var(--ic-status-success-contrast);\n}\n\n.toast-content {\n  margin-left: var(--ic-space-xs);\n  width: 100%;\n}\n\n.no-icon {\n  margin-left: var(--ic-space-md);\n}\n\n.toast-message {\n  padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n.toast-action-container {\n  padding-bottom: var(--ic-space-md);\n}\n\nic-button,\n.toast-dismiss-timer {\n  padding: var(--ic-space-xs);\n}\n\n@media (max-width: 576px) {\n  :host {\n    --bottom-position: var(--ic-space-lg);\n\n    width: calc(100% - 2 * var(--ic-space-md));\n  }\n}\n\n@media (min-width: 993px) {\n  :host {\n    --bottom-position: calc(var(--ic-space-xl) + var(--ic-space-xs));\n  }\n}\n\n@media (forced-colors: active) {\n  .container {\n    border: var(--ic-hc-border);\n  }\n}\n\n@keyframes fadein {\n  from {\n    bottom: 0;\n    opacity: 0;\n  }\n\n  to {\n    bottom: var(--bottom-position);\n    opacity: 1;\n  }\n}\n\n@keyframes fadeout {\n  from {\n    bottom: var(--bottom-position);\n    opacity: 1;\n  }\n\n  to {\n    bottom: 0;\n    opacity: 0;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { VARIANT_ICONS } from \"../../utils/constants\";\nimport {\n  getSlot,\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport {\n  IcActivationTypes,\n  IcStatusVariants,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { ActionAreaElementTypes } from \"./ic-toast.types\";\n\nconst AUTO_DISMISS_TIMER_REFRESH_RATE_MS = 1000;\nconst TOAST_HEADING_CHAR_LIMIT = 70;\nconst TOAST_MESSAGE_CHAR_LIMIT = 140;\n\n/**\n * @slot action - IcButton or IcLink is placed below header and message. If used will default toast to manual `dismiss` type.\n * @slot neutral-icon - A custom neutral icon is placed on the left side of the component. If used will default toast to `neutral` variant.\n */\n@Component({\n  tag: \"ic-toast\",\n  styleUrl: \"ic-toast.css\",\n  shadow: true,\n})\nexport class Toast {\n  private dismissTimeout: number;\n  private interactiveElements: ActionAreaElementTypes[] = [];\n  private isManual: boolean;\n  private neutralVariantLabel: string;\n  private timerRefreshInterval: number;\n\n  @Element() el: HTMLIcToastElement;\n\n  @State() timerProgress = 100;\n  @State() visible = false;\n\n  /**\n   * If toast dismissMode is set to `automatic`, use this prop to define the time before the toast dismisses (in MILLISECONDS)\n   * (NOTE: Has a minimum value of `5000ms`)\n   */\n  @Prop({ mutable: true }) autoDismissTimeout? = 5000;\n\n  /**\n   * If toast can be manually dismissed, this prop sets a custom aria-label for the ic-button component\n   */\n  @Prop() dismissButtonAriaLabel? = \"dismiss\";\n\n  /**\n   * How the toast will be dismissed. If manual will display a dismiss button.\n   */\n  @Prop({ mutable: true }) dismissMode?: IcActivationTypes = \"manual\";\n\n  /**\n   * The title to display at the start of the toast. (NOTE: Should be no more than `70` characters)\n   */\n  @Prop() heading!: string;\n\n  /**\n   * The main body message of the toast. (NOTE: Should be no more than `140` characters)\n   */\n  @Prop() message?: string;\n\n  /**\n   * Provides a custom alt-text to be announced to screen readers, if slotting a custom neutral icon\n   */\n  @Prop() neutralIconAriaLabel?: string;\n\n  /**\n   * The variant of the toast being rendered\n   */\n  @Prop({ mutable: true }) variant?: IcStatusVariants;\n\n  /**\n   * Is emitted when the user dismisses the toast\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    window.clearTimeout(this.dismissTimeout);\n    window.clearInterval(this.timerRefreshInterval);\n  }\n\n  componentWillLoad(): void {\n    this.handleLongText(\n      this.heading.length > TOAST_HEADING_CHAR_LIMIT,\n      this.message?.length > TOAST_MESSAGE_CHAR_LIMIT\n    );\n\n    if (this.autoDismissTimeout < 5000) this.autoDismissTimeout = 5000;\n\n    if (isSlotUsed(this.el, \"action\")) this.dismissMode = \"manual\";\n    this.isManual = this.dismissMode === \"manual\";\n\n    if (isSlotUsed(this.el, \"neutral-icon\")) this.variant = \"neutral\";\n    if (this.variant === \"neutral\") {\n      this.neutralVariantLabel =\n        this.neutralIconAriaLabel ?? VARIANT_ICONS[this.variant].ariaLabel;\n    }\n\n    if (this.isManual) {\n      this.el.setAttribute(\n        \"aria-label\",\n        this.variant\n          ? this.neutralVariantLabel || VARIANT_ICONS[this.variant].ariaLabel\n          : this.heading\n      );\n      (this.variant || this.message) &&\n        this.el.setAttribute(\n          \"aria-description\",\n          this.variant\n            ? `${this.heading}${\n                this.message !== undefined ? `. ${this.message}` : \"\"\n              }`\n            : this.message\n        );\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.heading, propName: \"heading\" }],\n      \"Toast\"\n    );\n    const actionContent = getSlot(this.el, \"action\") as ActionAreaElementTypes;\n    const dismissButton = this.el.shadowRoot.querySelector(\"ic-button\");\n    if (actionContent) this.interactiveElements.push(actionContent);\n    if (dismissButton) this.interactiveElements.push(dismissButton);\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleDismiss(): void {\n    this.visible = false;\n    clearInterval(this.timerRefreshInterval);\n    this.timerProgress = 100;\n  }\n\n  @Listen(\"keydown\", { target: \"document\" })\n  handleKeyboard(ev: KeyboardEvent): void {\n    if (this.isManual && this.visible) {\n      switch (ev.key) {\n        case \"Tab\":\n          ev.preventDefault();\n          this.findNextInteractiveElement(ev.shiftKey).setFocus();\n          break;\n        case \"Escape\":\n          !ev.repeat && this.dismissAction();\n          ev.stopImmediatePropagation();\n          break;\n      }\n    }\n  }\n\n  @Listen(\"mouseenter\")\n  @Listen(\"mouseleave\")\n  handleTimer(ev: MouseEvent): void {\n    if (!this.isManual) {\n      switch (ev.type) {\n        case \"mouseenter\":\n          window.clearTimeout(this.dismissTimeout);\n          window.clearInterval(this.timerRefreshInterval);\n          this.timerProgress = 100;\n          break;\n        case \"mouseleave\":\n          this.dismissTimeout = window.setTimeout(\n            this.dismissAction,\n            this.autoDismissTimeout\n          );\n          this.timerRefreshInterval = window.setInterval(\n            this.handleProgressChange,\n            AUTO_DISMISS_TIMER_REFRESH_RATE_MS\n          );\n          break;\n      }\n    }\n  }\n\n  /**\n   * Used to display the individual toast\n   * @returns The element that previously had focus before the toast appeared\n   */\n  @Method()\n  async setVisible(): Promise<HTMLElement> {\n    if (!this.visible) this.visible = true;\n    if (!this.isManual) {\n      this.dismissTimeout = window.setTimeout(\n        this.dismissAction,\n        this.autoDismissTimeout\n      );\n      this.timerRefreshInterval = window.setInterval(\n        this.handleProgressChange,\n        AUTO_DISMISS_TIMER_REFRESH_RATE_MS\n      );\n      return null;\n    } else {\n      window.setTimeout(() => this.interactiveElements[0].setFocus(), 200);\n      return document.activeElement as HTMLElement;\n    }\n  }\n\n  private dismissAction = (): void => {\n    this.icDismiss.emit();\n  };\n\n  private handleProgressChange = () => {\n    this.timerProgress -=\n      (AUTO_DISMISS_TIMER_REFRESH_RATE_MS / this.autoDismissTimeout) * 100;\n  };\n\n  private handleLongText(\n    headingTooLong: boolean,\n    messageTooLong?: boolean\n  ): void {\n    if (messageTooLong || headingTooLong) {\n      console.error(\n        `Too many characters in toast ${headingTooLong ? \"heading\" : \"\"}${\n          headingTooLong && messageTooLong ? \" and \" : \"\"\n        }${\n          messageTooLong ? \"message\" : \"\"\n        }. Refer to character limits specified in the prop description`\n      );\n    }\n  }\n\n  private findNextInteractiveElement(\n    isBackwards: boolean\n  ): ActionAreaElementTypes {\n    const first = this.interactiveElements[0];\n    const last = this.interactiveElements[this.interactiveElements.length - 1];\n\n    const source = isBackwards ? first : last;\n    const target = isBackwards ? last : first;\n    if (this.isActive(source)) return target;\n\n    let currentIndex: number;\n    const found = this.interactiveElements.some((el, index) => {\n      if (!this.isActive(el)) return false;\n      currentIndex = index;\n      return true;\n    });\n\n    if (!found) return first;\n    return this.interactiveElements[currentIndex + (isBackwards ? -1 : 1)];\n  }\n\n  private isActive(targetEl: HTMLElement): boolean {\n    if (targetEl === this.el) return !!this.el.shadowRoot.activeElement;\n    return document.activeElement === targetEl;\n  }\n\n  render() {\n    const {\n      variant,\n      heading,\n      message,\n      visible,\n      isManual,\n      dismissButtonAriaLabel,\n    } = this;\n    return (\n      <Host\n        class={{ [\"hidden\"]: !visible }}\n        role={isManual ? \"dialog\" : \"status\"}\n      >\n        <div class=\"container\">\n          {variant && visible && (\n            <div class=\"toast-icon-container\">\n              <div\n                class={{\n                  [\"divider\"]: true,\n                  [`divider-${variant}`]: true,\n                }}\n              ></div>\n              {variant === \"neutral\" ? (\n                <slot name=\"neutral-icon\" />\n              ) : (\n                <span\n                  class=\"toast-icon\"\n                  innerHTML={VARIANT_ICONS[variant].icon}\n                ></span>\n              )}\n            </div>\n          )}\n          <div\n            class={{\n              [\"toast-content\"]: true,\n              [\"no-icon\"]:\n                variant === \"neutral\" && !isSlotUsed(this.el, \"neutral-icon\"),\n            }}\n          >\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                {visible && <h5>{heading}</h5>}\n              </ic-typography>\n              {message && (\n                <ic-typography variant=\"body\">\n                  {visible && <p>{message}</p>}\n                </ic-typography>\n              )}\n            </div>\n            {isSlotUsed(this.el, \"action\") && (\n              <div class=\"toast-action-container\">\n                <slot name=\"action\" />\n              </div>\n            )}\n          </div>\n          {!isManual ? (\n            <ic-loading-indicator\n              class=\"toast-dismiss-timer\"\n              appearance=\"light\"\n              size=\"icon\"\n              progress={this.timerProgress}\n            ></ic-loading-indicator>\n          ) : (\n            <ic-button\n              id=\"dismiss-button\"\n              innerHTML={closeIcon}\n              onClick={this.dismissAction}\n              variant=\"icon\"\n              appearance={IcThemeForegroundEnum.Light}\n              aria-label={dismissButtonAriaLabel}\n            ></ic-button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-e328bd2d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as o,g as s}from"./p-69920d86.js";import{r as n,a,i as r,K as c}from"./p-dd980be4.js";import{C as l}from"./p-8c7f4343.js";import{C as u}from"./p-06321d19.js";import"./p-6f57b13c.js";const d='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}li{list-style:none;padding:0}:host::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled)::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"])::part(button){color:var(--ic-action-destructive)}:host::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host::part(button):focus-visible,:host::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host([variant="destructive"])::part(button):focus-visible,:host([variant="destructive"])::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant="destructive"])::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant="destructive"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant="destructive"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host::part(button){border:canvas}:host::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{outline-color:GrayText !important}}';const h=class{constructor(i){t(this,i);this.childBlur=e(this,"childBlur",7);this.handleMenuItemClick=e(this,"handleMenuItemClick",7);this.triggerPopoverMenuInstance=e(this,"triggerPopoverMenuInstance",7);this.handleClick=t=>{if(this.submenuTriggerFor!==undefined){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){t.preventDefault();this.toggleChecked?this.toggleChecked=false:this.toggleChecked=true}this.handleMenuItemClick.emit({label:this.label,hasSubMenu:!!this.el.submenuTriggerFor})};this.getMenuItemAriaLabel=()=>{let t=this.label;if(this.description!==undefined){t=`${t}, ${this.description}`}if(this.keyboardShortcut!==undefined){t=`${t}, ${this.keyboardShortcut}`}if(this.variant==="destructive"){t=`${t}, destructive`}if(this.submenuTriggerFor!==undefined){t=`${t}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){t="Go back to parent menu"}const e=c(this.el);if(e.tagName==="IC-MENU-GROUP"&&e.label){return`${t}, ${e.label} menu group`}else{return t}};this.toggleChecked=false;this.description=undefined;this.disabled=false;this.href=undefined;this.hreflang=undefined;this.keyboardShortcut=undefined;this.label=undefined;this.referrerpolicy=undefined;this.rel=undefined;this.submenuTriggerFor=undefined;this.target=undefined;this.variant="default"}componentWillLoad(){if(this.submenuTriggerFor!==undefined&&this.variant!=="default"){this.variant="default"}n(this.disabled,this.el)}componentDidLoad(){a([{prop:this.label,propName:"label"}],"Menu Item")}handleHostClick(t){if(this.disabled){t.stopImmediatePropagation()}}render(){const t=t=>t!==undefined?t:null;const e=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcut&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcut)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["disabled"]:this.disabled}},i("li",{role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"&&this.toggleChecked===true?true:this.variant==="toggle"&&this.toggleChecked===false?false:undefined},i("ic-button",{disableTooltip:true,fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:t(this.href),hreflang:t(this.hreflang),target:t(this.target),rel:t(this.rel),referrerpolicy:this.referrerpolicy!==undefined?this.referrerpolicy:null,"aria-disabled":`${this.disabled}`,"aria-label":this.getMenuItemAriaLabel(),"aria-controls":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false,"aria-haspopup":this.submenuTriggerFor!==undefined||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false,"aria-owns":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false},i("div",{class:"focus-border"},r(this.el,"icon")&&i("span",{class:"icon"},i("slot",{name:"icon"})),i(e,null),this.variant==="toggle"&&i("span",{class:{["check-icon"]:true,["hide"]:!this.toggleChecked},"aria-hidden":"true",innerHTML:l}),this.submenuTriggerFor!==undefined&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:u})))))}static get delegatesFocus(){return true}get el(){return s(this)}};h.style=d;export{h as ic_menu_item};
+//# sourceMappingURL=p-e328bd2d.entry.js.map

package/dist/core/p-e328bd2d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icMenuItemCss","MenuItem","this","handleClick","e","submenuTriggerFor","undefined","triggerPopoverMenuInstance","emit","variant","preventDefault","toggleChecked","handleMenuItemClick","label","hasSubMenu","el","getMenuItemAriaLabel","ariaLabel","description","keyboardShortcut","classList","contains","parentEl","getParentElement","tagName","componentWillLoad","removeDisabledFalse","disabled","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","handleHostClick","stopImmediatePropagation","render","isPropDefined","MenuItemInformation","h","class","Host","role","disableTooltip","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","isSlotUsed","name","innerHTML","Check","Chevron"],"sources":["./src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","./src/components/ic-menu-item/ic-menu-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n  list-style: none;\n  padding: 0;\n}\n\n:host::part(button) {\n  color: var(--ic-color-primary-text);\n  padding: calc(var(--ic-space-xxxs) / 2);\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: 0;\n  min-height: 2.5rem;\n  height: auto;\n}\n\n.focus-border {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: var(--ic-border-radius);\n  margin: calc(var(--ic-space-xxxs) / 2);\n  padding: var(--ic-space-xxs);\n  border: var(--ic-space-xxxs) dashed transparent;\n\n  --icon-height: auto;\n}\n\n:host(.disabled)::part(button) {\n  color: var(--ic-architectural-200) !important;\n  pointer-events: none;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n  color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button) {\n  color: var(--ic-action-destructive);\n}\n\n:host::part(button):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host::part(button):focus-visible,\n:host::part(button):focus {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-focus-blue);\n  box-shadow: none;\n}\n\n:host(.disabled)::part(button):focus-visible,\n:host(.disabled)::part(button):focus {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):focus-visible,\n:host([variant=\"destructive\"])::part(button):focus {\n  background-color: var(--ic-action-destructive);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n  color: var(--ic-color-white-text);\n}\n\n:host(.disabled) ic-button:focus-within .focus-border {\n  border-color: var(--ic-architectural-white);\n}\n\n:host(.disabled) ic-button:focus-within .menu-item-label,\n:host(.disabled) ic-button:focus-within .shortcut,\n:host(.disabled) ic-button:focus-within .menu-item-description {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-color-primary-text) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-action-destructive) !important;\n}\n\n.menu-item-info {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  align-items: baseline;\n  white-space: pre-line;\n  text-align: left;\n}\n\n.menu-labels {\n  display: flex;\n  align-items: baseline;\n  gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.shortcut {\n  color: var(--ic-color-tertiary-text);\n  display: flex;\n  flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n  text-transform: uppercase;\n  font-weight: 600;\n  letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n  color: var(--ic-color-primary-text);\n}\n\nic-button:active .menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\nic-button:active .shortcut {\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n  color: var(--ic-action-destructive) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n  visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  :host::part(button) {\n    border: canvas;\n  }\n\n  :host::part(button):focus-visible {\n    outline: var(--ic-space-xxxs) solid transparent;\n  }\n\n  .focus-border {\n    border-color: canvas;\n  }\n\n  :host(.disabled) ic-button:focus-within .focus-border {\n    border-color: GrayText;\n  }\n\n  :host(.disabled) .menu-item-info,\n  :host(.disabled) .menu-item-label,\n  :host(.disabled) .shortcut,\n  :host(.disabled) .menu-item-description,\n  :host(.disabled) ic-button:focus-within .menu-item-info,\n  :host(.disabled) ic-button:focus-within .menu-item-label,\n  :host(.disabled) ic-button:focus-within .shortcut,\n  :host(.disabled) ic-button:focus-within .menu-item-description {\n    color: GrayText !important;\n  }\n\n  :host(.disabled)::part(button):focus-visible,\n  :host(.disabled)::part(button):focus {\n    outline-color: GrayText !important;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Event,\n  EventEmitter,\n  Listen,\n} from \"@stencil/core\";\nimport {\n  getParentElement,\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n  tag: \"ic-menu-item\",\n  styleUrl: \"ic-menu-item.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class MenuItem {\n  @Element() el: HTMLIcMenuItemElement;\n\n  @State() toggleChecked: boolean = false;\n\n  /**\n   * The description displayed in the menu item, below the label.\n   */\n  @Prop() description?: string;\n\n  /**\n   * If `true`, the menu item will be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * The URL that the link points to. This will render the menu item as an \"a\" tag.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n\n  /**\n   * The label describing the keyboard shortcut for a menu item's action.\n   */\n  @Prop() keyboardShortcut?: string;\n\n  /**\n   * The label to display in the menu item.\n   */\n  @Prop() label!: string;\n\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n\n  /**\n   * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n   */\n  @Prop() submenuTriggerFor?: string;\n\n  /**\n   * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n\n  /**\n   * The variant of the menu item.\n   */\n  @Prop({ mutable: true, reflect: true }) variant: IcMenuItemVariants =\n    \"default\";\n\n  /**\n   * @internal Emitted when item loses focus.\n   */\n  @Event() childBlur: EventEmitter<void>;\n\n  /**\n   * @internal Emitted when the user clicks a menu item.\n   */\n  @Event() handleMenuItemClick: EventEmitter<{\n    label: string;\n    hasSubMenu: boolean;\n  }>;\n\n  /**\n   * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n   */\n  @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n\n  componentWillLoad(): void {\n    // This ensures that trigger menu items are always set to the default variant\n    if (this.submenuTriggerFor !== undefined && this.variant !== \"default\") {\n      this.variant = \"default\";\n    }\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Menu Item\"\n    );\n  }\n\n  @Listen(\"click\", { capture: true })\n  handleHostClick(e: Event): void {\n    if (this.disabled) {\n      e.stopImmediatePropagation();\n    }\n  }\n\n  private handleClick = (e: Event): void => {\n    if (this.submenuTriggerFor !== undefined) {\n      this.triggerPopoverMenuInstance.emit();\n    } else if (this.variant === \"toggle\") {\n      e.preventDefault();\n      this.toggleChecked\n        ? (this.toggleChecked = false)\n        : (this.toggleChecked = true);\n    }\n    this.handleMenuItemClick.emit({\n      label: this.label,\n      hasSubMenu: !!this.el.submenuTriggerFor,\n    });\n  };\n\n  private getMenuItemAriaLabel = (): string => {\n    let ariaLabel = this.label;\n\n    if (this.description !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.description}`;\n    }\n\n    if (this.keyboardShortcut !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;\n    }\n\n    if (this.variant === \"destructive\") {\n      ariaLabel = `${ariaLabel}, destructive`;\n    }\n\n    if (this.submenuTriggerFor !== undefined) {\n      ariaLabel = `${ariaLabel}, triggers submenu`;\n    }\n\n    if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n      ariaLabel = \"Go back to parent menu\";\n    }\n    const parentEl = getParentElement(this.el);\n\n    if (\n      parentEl.tagName === \"IC-MENU-GROUP\" &&\n      (parentEl as HTMLIcMenuGroupElement).label\n    ) {\n      return `${ariaLabel}, ${\n        (parentEl as HTMLIcMenuGroupElement).label\n      } menu group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  render() {\n    // A helper function that checks if a prop has been defined\n    const isPropDefined = (prop: string) => {\n      return prop !== undefined ? prop : null;\n    };\n\n    // A sub-component to layout the menu information correctly in ic-button\n    const MenuItemInformation = () => {\n      return (\n        <div class=\"menu-item-info\">\n          <div class=\"menu-labels\">\n            <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n            {this.keyboardShortcut && (\n              <ic-typography variant=\"caption\" class=\"shortcut\">\n                {this.keyboardShortcut}\n              </ic-typography>\n            )}\n          </div>\n          {this.description && (\n            <ic-typography class=\"menu-item-description\" variant=\"caption\">\n              {this.description}\n            </ic-typography>\n          )}\n        </div>\n      );\n    };\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: this.disabled,\n        }}\n      >\n        <li\n          role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n          aria-disabled={`${this.disabled}`}\n          aria-checked={\n            this.variant === \"toggle\" && this.toggleChecked === true\n              ? true\n              : this.variant === \"toggle\" && this.toggleChecked === false\n              ? false\n              : undefined\n          }\n        >\n          <ic-button\n            disableTooltip\n            fullWidth\n            variant=\"tertiary\"\n            onClick={this.handleClick}\n            href={isPropDefined(this.href)}\n            hreflang={isPropDefined(this.hreflang)}\n            target={isPropDefined(this.target)}\n            rel={isPropDefined(this.rel)}\n            referrerpolicy={\n              this.referrerpolicy !== undefined ? this.referrerpolicy : null\n            }\n            aria-disabled={`${this.disabled}`}\n            aria-label={this.getMenuItemAriaLabel()}\n            aria-controls={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n            aria-haspopup={\n              this.submenuTriggerFor !== undefined ||\n              this.el.classList.contains(\"ic-popover-submenu-back-button\")\n                ? \"menu\"\n                : false\n            }\n            aria-owns={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n          >\n            <div class=\"focus-border\">\n              {isSlotUsed(this.el, \"icon\") && (\n                <span class=\"icon\">\n                  <slot name=\"icon\"></slot>\n                </span>\n              )}\n              <MenuItemInformation />\n              {this.variant === \"toggle\" && (\n                <span\n                  class={{\n                    [\"check-icon\"]: true,\n                    [\"hide\"]: !this.toggleChecked,\n                  }}\n                  aria-hidden=\"true\"\n                  innerHTML={Check}\n                />\n              )}\n              {this.submenuTriggerFor !== undefined && (\n                <span\n                  class={{ [\"submenu-icon\"]: true }}\n                  aria-hidden=\"true\"\n                  innerHTML={Chevron}\n                />\n              )}\n            </div>\n          </ic-button>\n        </li>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oNAAA,MAAMA,EAAgB,s+L,MCgCTC,EAAQ,M,8LAqGXC,KAAAC,YAAeC,IACrB,GAAIF,KAAKG,oBAAsBC,UAAW,CACxCJ,KAAKK,2BAA2BC,M,MAC3B,GAAIN,KAAKO,UAAY,SAAU,CACpCL,EAAEM,iBACFR,KAAKS,cACAT,KAAKS,cAAgB,MACrBT,KAAKS,cAAgB,I,CAE5BT,KAAKU,oBAAoBJ,KAAK,CAC5BK,MAAOX,KAAKW,MACZC,aAAcZ,KAAKa,GAAGV,mBACtB,EAGIH,KAAAc,qBAAuB,KAC7B,IAAIC,EAAYf,KAAKW,MAErB,GAAIX,KAAKgB,cAAgBZ,UAAW,CAClCW,EAAY,GAAGA,MAAcf,KAAKgB,a,CAGpC,GAAIhB,KAAKiB,mBAAqBb,UAAW,CACvCW,EAAY,GAAGA,MAAcf,KAAKiB,kB,CAGpC,GAAIjB,KAAKO,UAAY,cAAe,CAClCQ,EAAY,GAAGA,gB,CAGjB,GAAIf,KAAKG,oBAAsBC,UAAW,CACxCW,EAAY,GAAGA,qB,CAGjB,GAAIf,KAAKa,GAAGK,UAAUC,SAAS,kCAAmC,CAChEJ,EAAY,wB,CAEd,MAAMK,EAAWC,EAAiBrB,KAAKa,IAEvC,GACEO,EAASE,UAAY,iBACpBF,EAAoCT,MACrC,CACA,MAAO,GAAGI,MACPK,EAAoCT,kB,KAElC,CACL,OAAOI,C,sBAjJuB,M,yCAUL,M,sNA8C3B,S,CAoBFQ,oBAEE,GAAIvB,KAAKG,oBAAsBC,WAAaJ,KAAKO,UAAY,UAAW,CACtEP,KAAKO,QAAU,S,CAEjBiB,EAAoBxB,KAAKyB,SAAUzB,KAAKa,G,CAG1Ca,mBACEC,EACE,CAAC,CAAEC,KAAM5B,KAAKW,MAAOkB,SAAU,UAC/B,Y,CAKJC,gBAAgB5B,GACd,GAAIF,KAAKyB,SAAU,CACjBvB,EAAE6B,0B,EAuDNC,SAEE,MAAMC,EAAiBL,GACdA,IAASxB,UAAYwB,EAAO,KAIrC,MAAMM,EAAsB,IAExBC,EAAA,OAAKC,MAAM,kBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,iBAAeC,MAAM,mBAAmBpC,KAAKW,OAC5CX,KAAKiB,kBACJkB,EAAA,iBAAe5B,QAAQ,UAAU6B,MAAM,YACpCpC,KAAKiB,mBAIXjB,KAAKgB,aACJmB,EAAA,iBAAeC,MAAM,wBAAwB7B,QAAQ,WAClDP,KAAKgB,cAOhB,OACEmB,EAACE,EAAI,CACHD,MAAO,CACL,CAAC,YAAapC,KAAKyB,WAGrBU,EAAA,MACEG,KAAMtC,KAAKO,UAAY,SAAW,mBAAqB,WAAU,gBAClD,GAAGP,KAAKyB,WAAU,eAE/BzB,KAAKO,UAAY,UAAYP,KAAKS,gBAAkB,KAChD,KACAT,KAAKO,UAAY,UAAYP,KAAKS,gBAAkB,MACpD,MACAL,WAGN+B,EAAA,aACEI,eAAc,KACdC,UAAS,KACTjC,QAAQ,WACRkC,QAASzC,KAAKC,YACdyC,KAAMT,EAAcjC,KAAK0C,MACzBC,SAAUV,EAAcjC,KAAK2C,UAC7BC,OAAQX,EAAcjC,KAAK4C,QAC3BC,IAAKZ,EAAcjC,KAAK6C,KACxBC,eACE9C,KAAK8C,iBAAmB1C,UAAYJ,KAAK8C,eAAiB,KAAI,gBAEjD,GAAG9C,KAAKyB,WAAU,aACrBzB,KAAKc,uBAAsB,gBAErCd,KAAKG,oBAAsBC,UACvB,sBAAsBJ,KAAKG,oBAC3B,MAAK,gBAGTH,KAAKG,oBAAsBC,WAC3BJ,KAAKa,GAAGK,UAAUC,SAAS,kCACvB,OACA,MAAK,YAGTnB,KAAKG,oBAAsBC,UACvB,sBAAsBJ,KAAKG,oBAC3B,OAGNgC,EAAA,OAAKC,MAAM,gBACRW,EAAW/C,KAAKa,GAAI,SACnBsB,EAAA,QAAMC,MAAM,QACVD,EAAA,QAAMa,KAAK,UAGfb,EAACD,EAAmB,MACnBlC,KAAKO,UAAY,UAChB4B,EAAA,QACEC,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,SAAUpC,KAAKS,eACjB,cACW,OACZwC,UAAWC,IAGdlD,KAAKG,oBAAsBC,WAC1B+B,EAAA,QACEC,MAAO,CAAE,CAAC,gBAAiB,MAAM,cACrB,OACZa,UAAWE,O"}

package/dist/core/p-e9c864ac.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as r,H as t,g as s}from"./p-69920d86.js";import{C as i}from"./p-06321d19.js";import{i as a}from"./p-dd980be4.js";import"./p-6f57b13c.js";const c=`<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" fill="currentColor"/>\n</svg>\n`;const o=':host{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}:host .breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}:host .chevron{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host .chevron svg{color:var(--ic-architectural-400)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-hyperlink)}:host(.back){display:flex;align-items:center}:host(.back) .chevron{display:none}ic-link{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current="page"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper){margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb){border:none;background-color:transparent;color:var(--ic-hyperlink);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}@media (forced-colors: active){.back-icon svg{color:currentcolor}}@supports (text-decoration-thickness: 25%){ic-link{--breadcrumb-link-display:flex}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const n=class{constructor(t){e(this,t);this.renderDefaultBreadcrumb=(e,t,s,i)=>{const o=t!==null&&t!==undefined&&t!=="";if(e&&o){return r("span",{class:{"current-page-container":e}},a(this.el,"icon")&&r("slot",{name:"icon"}),t)}return r("ic-link",{href:i,class:"breadcrumb-link","aria-describedby":this.showBackIcon&&s&&s},this.showBackIcon&&r("div",{class:"back-icon",innerHTML:c}),a(this.el,"icon")&&r("slot",{name:"icon"}),t)};this.setSlottedCurrentPageClass=()=>{const e=this.el.querySelector("ic-link");const r="current-page";if(e){e.classList.remove(r);if(this.current){const t=e.classList.contains(r);if(!t){e.classList.add("breadcrumb-link",r)}}}};this.current=false;this.href=undefined;this.pageTitle=undefined;this.showBackIcon=false}componentWillRender(){this.setSlottedCurrentPageClass()}async setFocus(){if(this.el.shadowRoot.querySelector("ic-link")){this.el.shadowRoot.querySelector("ic-link").focus()}}render(){const{current:e,href:s,pageTitle:a}=this;const c=`${a&&a.toLowerCase().replace(" ","-")}-describedby`;const o=a!==null&&a!==undefined&&a!=="";const n=s!==null&&s!==undefined&&s!=="";return r(t,{class:{back:this.showBackIcon},"aria-current":e&&"page",role:"listitem"},r("div",{class:"breadcrumb"},r("span",{innerHTML:i,class:"chevron","aria-hidden":"true"}),this.showBackIcon&&c&&r("span",{id:c,class:"hide"},`Back to ${a}`),o&&n?this.renderDefaultBreadcrumb(e,a,c,s):r("slot",null)))}static get delegatesFocus(){return true}get el(){return s(this)}};n.style=o;export{n as ic_breadcrumb};
+//# sourceMappingURL=p-e9c864ac.entry.js.map

package/dist/core/p-e9c864ac.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icBreadcrumbCss","Breadcrumb","this","renderDefaultBreadcrumb","current","pageTitle","describedById","href","hasPageTitle","undefined","h","class","isSlotUsed","el","name","showBackIcon","innerHTML","backIcon","setSlottedCurrentPageClass","icLink","querySelector","currentPage","classList","remove","hasCurrentPageClass","contains","add","componentWillRender","async","shadowRoot","focus","render","toLowerCase","replace","hasHref","Host","back","role","chevronIcon","id"],"sources":["./src/components/ic-breadcrumb/ic-breadcrumb.css?tag=ic-breadcrumb&encapsulation=shadow","./src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"sourcesContent":[":host {\n  display: block;\n  margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n:host .breadcrumb {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  gap: var(--ic-space-xs);\n  min-height: var(--ic-space-lg);\n}\n\n:host .chevron {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n:host .chevron svg {\n  color: var(--ic-architectural-400);\n}\n\n:host(:first-child) .chevron {\n  display: none;\n}\n\n.back-icon svg {\n  color: var(--ic-hyperlink);\n}\n\n:host(.back) {\n  display: flex;\n  align-items: center;\n}\n\n:host(.back) .chevron {\n  display: none;\n}\n\nic-link {\n  --breadcrumb-link-display: inline-flex;\n  --breadcrumb-link-align-items: center;\n  --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) {\n  margin-right: var(--ic-space-xs) !important;\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {\n  border: none;\n  background-color: transparent;\n  color: var(--ic-hyperlink);\n  text-decoration: underline;\n  font-weight: var(--ic-font-weight-bold);\n  cursor: pointer;\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n  outline: var(--ic-hc-focus-outline);\n  border-bottom: 0.25rem solid !important;\n  margin-bottom: -0.25rem !important;\n  text-decoration: none;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n  display: none;\n}\n\n@media (forced-colors: active) {\n  .back-icon svg {\n    color: currentcolor;\n  }\n}\n\n@supports (text-decoration-thickness: 25%) {\n  ic-link {\n    --breadcrumb-link-display: flex;\n  }\n\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n    text-decoration-line: underline;\n    text-decoration-thickness: 25%;\n    text-underline-offset: 25%;\n    border-bottom: 0 !important;\n    margin-bottom: 0 !important;\n  }\n}\n","import { Component, Host, Prop, h, Element, Method } from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-breadcrumb\",\n  styleUrl: \"ic-breadcrumb.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Breadcrumb {\n  @Element() el: HTMLIcBreadcrumbElement;\n\n  /**\n   * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n   */\n\n  /**\n   * If `true`, aria-current will be set on the breadcrumb.\n   */\n  @Prop() current?: boolean = false;\n\n  /**\n   * The URL that the breadcrumb link points to.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The title of the breadcrumb.\n   */\n  @Prop() pageTitle!: string;\n\n  /**\n   * @internal If `true`, back icon will be displayed.\n   */\n  @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n  componentWillRender(): void {\n    this.setSlottedCurrentPageClass();\n  }\n\n  /**\n   * Sets focus on the breadcrumb.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el.shadowRoot.querySelector(\"ic-link\")) {\n      this.el.shadowRoot.querySelector(\"ic-link\").focus();\n    }\n  }\n\n  private renderDefaultBreadcrumb = (\n    current: boolean,\n    pageTitle: string,\n    describedById: string,\n    href: string\n  ): IcBreadcrumbDefault => {\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n\n    if (current && hasPageTitle) {\n      return (\n        <span\n          class={{\n            \"current-page-container\": current,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n          {pageTitle}\n        </span>\n      );\n    }\n\n    return (\n      <ic-link\n        href={href}\n        class=\"breadcrumb-link\"\n        aria-describedby={this.showBackIcon && describedById && describedById}\n      >\n        {this.showBackIcon && (\n          <div class=\"back-icon\" innerHTML={backIcon}></div>\n        )}\n        {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n        {pageTitle}\n      </ic-link>\n    );\n  };\n\n  private setSlottedCurrentPageClass = () => {\n    const icLink = this.el.querySelector(\"ic-link\");\n    const currentPage = \"current-page\";\n    if (icLink) {\n      icLink.classList.remove(currentPage);\n      if (this.current) {\n        const hasCurrentPageClass = icLink.classList.contains(currentPage);\n        if (!hasCurrentPageClass) {\n          icLink.classList.add(\"breadcrumb-link\", currentPage);\n        }\n      }\n    }\n  };\n\n  render() {\n    const { current, href, pageTitle } = this;\n    const describedById = `${\n      pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n    }-describedby`;\n\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n    const hasHref = href !== null && href !== undefined && href !== \"\";\n\n    return (\n      <Host\n        class={{\n          back: this.showBackIcon,\n        }}\n        aria-current={current && \"page\"}\n        role=\"listitem\"\n      >\n        <div class=\"breadcrumb\">\n          <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n          {this.showBackIcon && describedById && (\n            <span\n              id={describedById}\n              class=\"hide\"\n            >{`Back to ${pageTitle}`}</span>\n          )}\n          {hasPageTitle && hasHref ? (\n            this.renderDefaultBreadcrumb(\n              current,\n              pageTitle,\n              describedById,\n              href\n            )\n          ) : (\n            <slot />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yVAAA,MAAMA,EAAkB,i1D,MCcXC,EAAU,M,yBAyCbC,KAAAC,wBAA0B,CAChCC,EACAC,EACAC,EACAC,KAEA,MAAMC,EACJH,IAAc,MAAQA,IAAcI,WAAaJ,IAAc,GAEjE,GAAID,GAAWI,EAAc,CAC3B,OACEE,EAAA,QACEC,MAAO,CACL,yBAA0BP,IAG3BQ,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,E,CAKP,OACEK,EAAA,WACEH,KAAMA,EACNI,MAAM,kBAAiB,mBACLT,KAAKa,cAAgBT,GAAiBA,GAEvDJ,KAAKa,cACJL,EAAA,OAAKC,MAAM,YAAYK,UAAWC,IAEnCL,EAAWV,KAAKW,GAAI,SAAWH,EAAA,QAAMI,KAAK,SAC1CT,EACO,EAINH,KAAAgB,2BAA6B,KACnC,MAAMC,EAASjB,KAAKW,GAAGO,cAAc,WACrC,MAAMC,EAAc,eACpB,GAAIF,EAAQ,CACVA,EAAOG,UAAUC,OAAOF,GACxB,GAAInB,KAAKE,QAAS,CAChB,MAAMoB,EAAsBL,EAAOG,UAAUG,SAASJ,GACtD,IAAKG,EAAqB,CACxBL,EAAOG,UAAUI,IAAI,kBAAmBL,E,kBA5EpB,M,+DAeqB,K,CAEjDM,sBACEzB,KAAKgB,4B,CAOPU,iBACE,GAAI1B,KAAKW,GAAGgB,WAAWT,cAAc,WAAY,CAC/ClB,KAAKW,GAAGgB,WAAWT,cAAc,WAAWU,O,EAuDhDC,SACE,MAAM3B,QAAEA,EAAOG,KAAEA,EAAIF,UAAEA,GAAcH,KACrC,MAAMI,EAAgB,GACpBD,GAAaA,EAAU2B,cAAcC,QAAQ,IAAK,mBAGpD,MAAMzB,EACJH,IAAc,MAAQA,IAAcI,WAAaJ,IAAc,GACjE,MAAM6B,EAAU3B,IAAS,MAAQA,IAASE,WAAaF,IAAS,GAEhE,OACEG,EAACyB,EAAI,CACHxB,MAAO,CACLyB,KAAMlC,KAAKa,cACZ,eACaX,GAAW,OACzBiC,KAAK,YAEL3B,EAAA,OAAKC,MAAM,cACTD,EAAA,QAAMM,UAAWsB,EAAa3B,MAAM,UAAS,cAAa,SACzDT,KAAKa,cAAgBT,GACpBI,EAAA,QACE6B,GAAIjC,EACJK,MAAM,QACN,WAAWN,KAEdG,GAAgB0B,EACfhC,KAAKC,wBACHC,EACAC,EACAC,EACAC,GAGFG,EAAA,c"}

package/dist/core/p-f2c6a143.js

@@ -0,0 +1,2 @@
+const n=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">\n    <path d="M0 0h24v24H0z" fill="none"/>\n    <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>\n    <title>close icon</title>\n</svg>\n`;export{n as c};
+//# sourceMappingURL=p-f2c6a143.js.map

package/dist/core/p-f2c6a143.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":""}