@ukic/web-components 3.13.0 → 3.14.0

package/dist/core/p-614953c5.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icSideNavigationCss","IcSideNavigationStyle0","SideNavigation","constructor","hostRef","this","ANIMATION_DURATION","parseInt","getCssProperty","IC_NAVIGATION_ITEM","resizeObserver","COLLAPSED_ICON_LABELS_END","COLLAPSED_ICON_LABELS_START","deviceSize","getCurrentDeviceSize","deviceSizeAppTitle","DEVICE_SIZES","S","foregroundColor","getBrandForegroundAppearance","hasSecondaryNavigation","menuExpanded","menuOpen","closeOnNavItemClick","collapsedIconLabels","disableAutoParentStyling","disableTopBarBehaviour","expanded","href","inline","shortAppTitle","static","emitSideNavigationExpanded","objDetails","icSideNavExpanded","emit","sideNavExpanded","sideNavMobile","toggleMenu","setMobileMenuAriaAttributes","arrangeSlottedNavigationItem","setToggleMenuFlyoutMenuVisibility","sideNav","_a","el","shadowRoot","querySelector","sideNavInner","bottomWrapper","menuVisibilityVisible","classList","add","setTimeout","remove","menuButton","setAttribute","setAndRemoveNoWrapAfterMenuExpanded","appTitle","toggleMenuExpanded","_b","style","setProperty","_d","_c","addEventListener","e","propertyName","displayTooltipWithExpandedLongLabel","animateCollapsedIconLabels","setExpandedButtonHeight","navItems","querySelectorAll","forEach","navItem","isNamedSlot","isSlotUsed","isUnnamedSlot","children","getAttribute","navItemSlot","iconWrapper","document","createElement","icon","badge","label","textContent","trim","icTypography","position","height","append","styleSlottedCollapsedIconLabels","styleSlottedIconLabels","marginTop","whiteSpace","overflow","textOverflow","appStatusWrapper","offsetHeight","opacity","visibility","transition","transitionHandler","type","primaryNavigationWrapper","secondaryNavigationWrapper","classToRemove","classToAdd","transitionEndHandler","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","scrollWidth","clearTimeout","setMenuExpanded","handleNavItemClicked","setParentPaddingTop","value","parentElement","setParentPaddingLeft","renderAppTitle","isAppNameSubtitleVariant","displayShortAppTitle","isEmptyString","h","variant","undefined","resizeObserverCallback","currSize","isSDeviceEnableTop","topBarHeight","scrollHeight","notSmallDisableTop","L","M","runResizeObserver","ResizeObserver","observe","body","box","setCollapsedIconLabels","styleSlottedCollapsedIconLabel","dynamicSlottedIcTypographyComps","contains","renderTopBar","isSDevice","hasTitle","isPropDefined","Component","attrs","class","id","size","theme","monochrome","onClick","ariaOwnsId","ref","slot","innerHTML","closeIcon","menuIcon","assign","name","watchExpandedHandler","componentWillLoad","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","propName","disconnectedCallback","disconnect","removeEventListener","brandChangeHandler","detail","mode","render","status","version","isSDeviceDisableTop","isMdDevice","isLgDevice","displayExpandBtn","topBarProps","Host","key","IcBrandForegroundEnum","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  --ic-typography-color: currentcolor;\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  --keyline-lighten: var(--ic-space-1px) solid var(--ic-side-navigation-keyline);\n  --keyline-darken: var(--ic-space-1px) solid var(--ic-state-layer-darken-20);\n  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);\n  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);\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-side-navigation-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-side-navigation-background);\n  z-index: var(--ic-z-index-side-navigation);\n}\n\n:host(.ic-side-navigation-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-side-navigation-background);\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 4rem;\n  overflow: auto;\n}\n\n:host(.ic-side-navigation-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(:has(.xs-menu-open, .xs-menu-close)) ::slotted(ic-navigation-item) {\n  --navigation-item-side-nav-right: var(--ic-space-xl);\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(--keyline-lighten);\n  bottom: 0;\n  left: 0;\n  z-index: 2;\n  background-color: var(--ic-side-navigation-background);\n  display: flex;\n  flex-direction: column;\n}\n\n:host(.ic-side-navigation-inline) .bottom-wrapper {\n  position: sticky;\n}\n\n:host(.ic-side-navigation-dark) .bottom-wrapper {\n  border-top: var(--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-side-navigation-background);\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  border-bottom: var(--keyline-lighten);\n  box-shadow: var(--ic-elevation-overlay);\n  z-index: 2;\n  overflow: hidden;\n  visibility: visible;\n}\n\n:host(.ic-side-navigation-inline) .top-bar {\n  position: absolute;\n}\n\n:host(.ic-side-navigation-dark) .top-bar {\n  border-bottom: var(--keyline-darken);\n}\n\n.top-bar.dark a:focus {\n  box-shadow: var(--ic-border-focus);\n}\n\n.app-title-wrapper {\n  display: flex;\n  margin-left: var(--ic-space-xs);\n  border-left: var(--keyline-lighten);\n  padding-left: var(--ic-space-xxs);\n  color: var(--ic-side-navigation-text);\n  align-items: center;\n}\n\n:host(.ic-side-navigation-dark) .app-title-wrapper {\n  border-left: var(--keyline-darken);\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-side-navigation-text);\n}\n\n:host .title-link:visited,\n:host .title-link:active {\n  color: var(--ic-side-navigation-text);\n}\n\nslot[name=\"app-title\"]::slotted(a),\nslot[name=\"app-icon\"]::slotted(a) {\n  color: var(--ic-side-navigation-text);\n  outline: none;\n  text-decoration: none;\n  display: flex;\n}\n\nslot[name=\"app-title\"]::slotted(ic-typography),\nslot[name=\"app-title\"]::slotted(a) {\n  margin-left: var(--ic-space-xs) !important;\n}\n\nslot[name=\"app-title\"]::slotted(a) {\n  font: var(--ic-font-subtitle-small);\n}\n\n@media screen and (min-width: 577px) {\n  :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(ic-typography),\n  :host(.sm-collapsed) slot[name=\"app-title\"]::slotted(a) {\n    position: absolute;\n    left: -9999px;\n    opacity: 0;\n    transition: opacity var(--ic-easing-transition-slow);\n  }\n\n  :host(.sm-collapsed) slot[name=\"app-title\"]:dir(rtl)::slotted(ic-typography),\n  :host(.sm-collapsed) slot[name=\"app-title\"]:dir(rtl)::slotted(a) {\n    right: -9999px;\n  }\n\n  :host(.sm-expanded) slot[name=\"app-title\"]::slotted(a) {\n    font: var(--ic-font-h3) !important;\n    font-weight: var(--ic-font-weight-semibold) !important;\n    margin-left: var(--ic-space-xs) !important;\n  }\n}\n\n:host .title-link:hover {\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-side-navigation-hover);\n}\n\n:host .title-link:active {\n  background-color: var(--ic-side-navigation-pressed);\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-side-navigation-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-side-navigation-text);\n  color: var(--ic-side-navigation-status-tag-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(.ic-side-navigation-dark) .app-status-wrapper .app-status {\n  --ic-typography-color: var(--ic-architectural-white);\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-justify-content: space-between;\n  --navigation-group-hover: var(--ic-side-navigation-hover);\n  --navigation-group-text-hover: var(--ic-side-navigation-text);\n  --navigation-item-child-height: 3.5rem;\n  --navigation-item-child-active: var(--ic-action-dark-bg-pressed);\n  --navigation-item-child-color: var(--ic-side-navigation-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-justify-content: flex-start;\n  --navigation-item-min-height: 56px;\n  --navigation-item-height: auto;\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}\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.app-title-show {\n  min-width: 15.5rem;\n}\n\n:host(.side-display) {\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:host(.side-display) .app-icon-container {\n  height: 40px;\n  display: flex;\n  align-items: center;\n}\n\n:host(.side-display) .top-bar {\n  --side-navigation-height: var(--sm-side-navigation-top-bar-height);\n\n  position: relative;\n  padding: 0;\n  box-shadow: none;\n}\n\n:host(.ic-side-navigation-inline.side-display) .top-bar {\n  position: sticky;\n}\n\n:host(.anchor-right.side-display) .top-bar {\n  box-shadow: 0.188rem 0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.anchor-right.side-display) .bottom-wrapper {\n  box-shadow: 0.188rem -0.188rem 0.5rem rgb(0 0 0 / 20%);\n}\n\n:host(.side-display) .side-navigation,\n:host(.side-display) .top-bar {\n  width: var(--sm-side-navigation-top-bar-height);\n}\n\n:host(.sm-collapsed.side-display) {\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.side-display) {\n  width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-expanded.side-display) {\n  width: var(--side-navigation-width);\n  transition: width var(--ic-easing-transition-slow);\n  box-shadow: var(--ic-elevation-overlay);\n}\n\n:host(.side-display) .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(.ic-side-navigation-inline.side-display) .side-navigation {\n  position: relative;\n}\n\n:host(.anchor-right.side-display) .side-navigation {\n  left: auto;\n  right: 0;\n}\n\n:host(.side-display) .app-title-wrapper {\n  margin-left: 0;\n  border-left: none;\n  padding: var(--ic-space-xs) var(--ic-space-sm);\n}\n\n:host(.side-display) .app-title-wrapper ::slotted(svg) {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n}\n\n:host(.side-display) .app-title-wrapper ic-typography {\n  font-weight: var(--ic-font-weight-semibold);\n}\n\n:host(.sm-collapsed.side-display) .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-collapsed.side-display) .app-title-wrapper ic-typography:dir(rtl) {\n  right: -9999px;\n}\n\n:host(.sm-expanded.side-display) ic-typography {\n  position: relative;\n  left: 0;\n}\n\n:host(.sm-expanded.side-display) :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.side-display) :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.side-display) :is(.side-navigation, .top-bar) {\n  left: auto;\n  right: 0;\n}\n\n:host(.side-display) .app-status-wrapper,\n:host(.sm-collapsed.side-display) .app-status-wrapper {\n  display: none;\n  margin-left: 0;\n}\n\n:host(.sm-expanded.side-display) .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:host(.side-display) .bottom-side-nav {\n  justify-items: flex-end;\n  align-items: flex-end;\n  justify-content: flex-end;\n  display: flex;\n  outline: none;\n}\n\n:host(.side-display) .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-side-navigation-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.side-display) .bottom-side-nav .menu-expand-button {\n  height: 100%;\n}\n\n:host(.side-display) .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:host(.side-display) .bottom-side-nav .menu-expand-button:hover {\n  background-color: var(--ic-side-navigation-hover);\n}\n\n:host(.side-display) .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.side-display) .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.side-display) .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.side-display)\n  .bottom-side-nav\n  .menu-expand-button\n  svg {\n  transform: scaleX(-1);\n}\n\n:host(.anchor-right.sm-expanded.side-display)\n  .bottom-side-nav\n  .menu-expand-button\n  svg {\n  transform: scaleX(1);\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item) {\n  --navigation-item-label-opacity: 1;\n}\n\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-item),\n:host(.sm-collapsed.side-display) ::slotted(ic-navigation-group) {\n  --navigation-item-label-opacity: 0;\n  --navigation-item-min-height: 3.5rem;\n  --navigation-item-height: 3.5rem;\n}\n\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-item),\n:host(.sm-expanded.side-display) ::slotted(ic-navigation-group) {\n  --navigation-item-label-opacity: 1;\n  --navigation-item-height: auto;\n  --navigation-item-min-height: 3.5rem;\n  --navigation-item-width: 20rem;\n  --navigation-item-side-nav-right: var(--ic-space-xl);\n  --navigation-group-width: 20rem;\n}\n\n:host(.sm-collapsed.side-display) ::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.side-display) ::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-display) .side-navigation,\n:host(.sm-collapsed.collapsed-labels.side-display) .top-bar {\n  width: var(--sm-side-navigation-collapsed-labels-width);\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .menu-expand-button {\n  padding: 0;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display) .app-title-wrapper {\n  width: 100%;\n  justify-content: center;\n}\n\n:host(.sm-collapsed.collapsed-labels.side-display)\n  ::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.side-display) .bottom-side-nav .menu-expand-button {\n  justify-content: center;\n}\n\n:host(.side-display) .collapsed-icon-labels-start {\n  visibility: hidden;\n  opacity: 0;\n}\n\n:host(.side-display) .collapsed-icon-labels-end {\n  visibility: visible;\n  opacity: 1;\n  transition: visibility 0s, opacity var(--ic-easing-transition-slow);\n}\n\n/* Media Queries */\n\n@media screen and (max-width: 419px) {\n  .top-bar {\n    height: var(--side-navigation-height);\n  }\n}\n\n@media screen and (max-width: 319px) {\n  .side-navigation {\n    width: 100%;\n  }\n}\n\n@media screen and (min-width: 340px) {\n  .app-icon-container {\n    display: flex;\n  }\n}\n\n@media screen and (min-width: 993px) {\n  :host(.side-display) {\n    position: sticky;\n    left: auto;\n    top: 0;\n    bottom: 0;\n  }\n\n  :host(.sm-expanded.side-display) {\n    box-shadow: none;\n  }\n}\n\n@media (forced-colors: active) {\n  .side-navigation,\n  .top-bar {\n    border-right: var(--ic-border-hc);\n  }\n\n  .menu-expand-button {\n    color: Highlight !important;\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  Event,\n  EventEmitter,\n  Watch,\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  getBrandForegroundAppearance,\n  getCssProperty,\n  hasClassificationBanner,\n  onComponentRequiredPropUndefined,\n  isEmptyString,\n  isPropDefined,\n} from \"../../utils/helpers\";\nimport {\n  IcBrand,\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n} from \"../../utils/types\";\nimport { IcTopBar, IcExpandedDetail } 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 = null;\n  private COLLAPSED_ICON_LABELS_END = \"collapsed-icon-labels-end\";\n  private COLLAPSED_ICON_LABELS_START = \"collapsed-icon-labels-start\";\n  private menuButton?: HTMLIcButtonElement;\n\n  @Element() el: HTMLIcSideNavigationElement;\n\n  @State() deviceSize: number = getCurrentDeviceSize();\n  @State() deviceSizeAppTitle: number = DEVICE_SIZES.S;\n  @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\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 side navigation will close when a navigation item is clicked. This behaviour is only applicable on larger device sizes.\n   */\n  @Prop() closeOnNavItemClick?: boolean = false;\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 not display as a top bar on small devices.\n   */\n  @Prop() disableTopBarBehaviour?: boolean = false;\n\n  /**\n   * If `true`, the side navigation will display in an expanded state.\n   */\n  @Prop() expanded?: boolean = false;\n\n  @Watch(\"expanded\")\n  watchExpandedHandler(): void {\n    this.toggleMenuExpanded(this.expanded!);\n  }\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  /**\n   * Emitted when the side navigation is collapsed and expanded.\n   */\n  @Event() icSideNavExpanded: EventEmitter<IcExpandedDetail>;\n\n  componentWillLoad(): void {\n    this.setMenuExpanded(this.expanded!);\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:\n        this.deviceSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour,\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    if (this.closeOnNavItemClick) {\n      this.el.addEventListener(\n        \"navItemClicked\",\n        this.handleNavItemClicked as EventListener\n      );\n    }\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    if (this.closeOnNavItemClick) {\n      this.el.removeEventListener(\n        \"navItemClicked\",\n        this.handleNavItemClicked as EventListener\n      );\n    }\n  }\n\n  @Listen(\"brandChange\", { target: \"document\" })\n  brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n    this.foregroundColor = detail.mode;\n  }\n\n  private emitSideNavigationExpanded = (objDetails: {\n    sideNavExpanded: boolean;\n    sideNavMobile?: boolean;\n  }): void => {\n    this.icSideNavExpanded.emit({\n      sideNavExpanded: objDetails.sideNavExpanded,\n      sideNavMobile: !!objDetails.sideNavMobile,\n    });\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    if (this.menuButton) {\n      this.menuButton.setAttribute(\"aria-expanded\", `${menuOpen}`);\n      this.menuButton.setAttribute(\n        \"aria-label\",\n        `${menuOpen ? \"Close\" : \"Open\"} navigation menu`\n      );\n    }\n  };\n\n  private setAndRemoveNoWrapAfterMenuExpanded = () => {\n    const appTitle =\n      this.el.shadowRoot?.querySelector(\".title-link ic-typography\") ||\n      this.el.querySelector(\"[slot='app-title']\");\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 = (expanded: boolean): void => {\n    this.menuExpanded = expanded;\n\n    if (this.menuExpanded) {\n      this.setAndRemoveNoWrapAfterMenuExpanded();\n      this.el.shadowRoot\n        ?.querySelector(\".app-title-inner-wrapper\")\n        ?.classList.add(\"app-title-show\");\n    } else {\n      this.el.style.setProperty(\"--navigation-item-width\", \"320px\");\n      this.el.shadowRoot\n        ?.querySelector(\".app-title-inner-wrapper\")\n        ?.classList.remove(\"app-title-show\");\n\n      this.el.addEventListener(\"transitionend\", (e) => {\n        if (e.propertyName === \"width\") {\n          this.el.style.setProperty(\"--navigation-item-width\", null);\n        }\n      });\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/collapsed 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    navItems.forEach((navItem) => {\n      const isNamedSlot = isSlotUsed(navItem, \"navigation-item\");\n      const isUnnamedSlot =\n        navItem.children[0] && !navItem.children[0].getAttribute(\"slot\");\n      if (isNamedSlot || isUnnamedSlot) {\n        let navItemSlot;\n        if (isNamedSlot) {\n          navItemSlot = navItem.querySelector(\"[slot='navigation-item']\");\n        } else {\n          navItemSlot = navItem.children[0];\n        }\n        const iconWrapper = document.createElement(\"div\");\n        const icon = navItemSlot?.querySelector(\"svg\");\n        const badge = navItemSlot?.querySelector(\"ic-badge\");\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.position = \"relative\";\n        iconWrapper.style.height = \"var(--ic-space-lg)\";\n\n        icon && iconWrapper.append(icon);\n        badge && iconWrapper.append(badge);\n\n        if (label) {\n          icTypography.textContent = label;\n        }\n\n        if (navItemSlot) {\n          navItemSlot.textContent = \"\";\n          navItemSlot.append(iconWrapper);\n          navItemSlot.append(icTypography);\n        }\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    if (navItemLink && navItemSVG) {\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    return 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 (\n              icTypographyScrollWidth &&\n              icTypographyScrollWidth > sideNavWidth - paddingIconDelta\n            ) {\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  private handleNavItemClicked = () => {\n    if (\n      !this.menuOpen &&\n      this.deviceSize > DEVICE_SIZES.S &&\n      this.menuExpanded\n    ) {\n      setTimeout(() => {\n        this.toggleMenuExpanded(false);\n      }, 0);\n    }\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    const isSDeviceEnableTop =\n      currSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour;\n\n    if (!this.disableAutoParentStyling) {\n      const topBarHeight =\n        this.el.shadowRoot?.querySelector(\".top-bar\")?.scrollHeight;\n      this.setParentPaddingTop(isSDeviceEnableTop ? `${topBarHeight}px` : \"0\");\n      if (isSDeviceEnableTop) this.setParentPaddingLeft(\"0\");\n      if (isSDeviceEnableTop && this.inline) {\n        this.el.parentElement?.style.setProperty(\n          \"height\",\n          `calc(100% - ${topBarHeight}px)`\n        );\n      } else if (!isSDeviceEnableTop) {\n        this.el.parentElement?.style.setProperty(\"height\", \"100%\");\n      }\n    }\n\n    const notSmallDisableTop =\n      currSize > DEVICE_SIZES.S || this.disableTopBarBehaviour;\n\n    if (!this.disableAutoParentStyling) {\n      const paddingLeft = `calc(var(--ic-space-xxl) ${\n        this.collapsedIconLabels ? \"* 2\" : \"+ var(--ic-space-xs)\"\n      })`;\n\n      if (currSize > DEVICE_SIZES.L) {\n        this.setParentPaddingTop(\"0\");\n        this.setParentPaddingLeft(\"0\");\n      } else if (\n        notSmallDisableTop &&\n        currSize <= DEVICE_SIZES.M &&\n        this.static\n      ) {\n        this.setParentPaddingLeft(paddingLeft);\n      } else if (notSmallDisableTop && currSize <= DEVICE_SIZES.L) {\n        this.setParentPaddingLeft(\n          this.static && this.menuExpanded\n            ? \"calc(var(--ic-space-xl) * 10)\"\n            : paddingLeft\n        );\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 !== \"\" && isPropDefined(this.appTitle);\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              theme={\n                foregroundColor == \"default\" || foregroundColor == \"light\"\n                  ? \"light\"\n                  : \"dark\"\n              }\n              monochrome\n              onClick={this.toggleMenu}\n              ariaOwnsId=\"side-navigation\"\n              aria-haspopup=\"true\"\n              aria-expanded=\"false\"\n              ref={(el) => (this.menuButton = el)}\n            >\n              <span\n                class=\"mobile-top-bar-menu-icon\"\n                slot=\"left-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              <div class=\"app-title-inner-wrapper\">\n                {isSlotUsed(this.el, \"app-title\") ? (\n                  <slot name=\"app-title\"></slot>\n                ) : (\n                  this.renderAppTitle(isAppNameSubtitleVariant)\n                )}\n              </div>\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 =\n      !this.disableTopBarBehaviour && this.deviceSize === DEVICE_SIZES.S;\n    const isSDeviceDisableTop =\n      this.disableTopBarBehaviour && 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 =\n      isMdDevice || isSDeviceDisableTop || (isLgDevice && !this.static);\n\n    const topBarProps: IcTopBar = {\n      isSDevice,\n      foregroundColor,\n      menuOpen,\n      href: href!,\n      isAppNameSubtitleVariant,\n      appTitle: 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          \"side-display\":\n            this.deviceSize > DEVICE_SIZES.S || !!this.disableTopBarBehaviour,\n          [`ic-side-navigation-${IcBrandForegroundEnum.Dark}`]:\n            foregroundColor === IcBrandForegroundEnum.Dark,\n          [\"collapsed-labels\"]:\n            !isSDevice && !menuExpanded && !!collapsedIconLabels,\n          [\"ic-side-navigation-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(!this.menuExpanded)}\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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","ignoreList":[]}

package/dist/core/p-62b9e7bf.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as o,g as r}from"./p-8e4e97b4.js";import{e as s,r as n,o as a,i as c}from"./p-a5658054.js";import{C as u}from"./p-c2e091d7.js";import{C as l}from"./p-3b185c32.js";import"./p-bddf799a.js";const p='/*! 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 ::part(button){color:var(--ic-popover-menu-item-check);--ic-typography-color:var(--ic-popover-menu-item-check);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(.ic-menu-item-disabled) ::part(button){color:var(--ic-popover-menu-item-check-disabled) !important;--ic-typography-color:var(--ic-popover-menu-item-check-disabled) !important;pointer-events:none}:host(.ic-menu-item-disabled) .menu-item-label,:host(.ic-menu-item-disabled) .shortcut,:host(.ic-menu-item-disabled) .menu-item-description{--ic-typography-color:var(--ic-popover-menu-item-label-disabled) !important}:host(.ic-menu-item-variant-destructive) ::part(button){color:var(--ic-popover-menu-destructive-item-icon);--ic-typography-color:var(--ic-popover-menu-destructive-item-label)}:host ::part(button):hover{background-color:var(--ic-popover-background-hover)}:host ::part(button):focus-visible,:host ::part(button):focus{color:var(--ic-popover-menu-item-icon-focused);--ic-typography-color:purple;background-color:var(--ic-popover-background-focus);box-shadow:none}:host(.ic-menu-item-disabled) ::part(button):focus-visible,:host(.ic-menu-item-disabled) ::part(button):focus{color:var(--ic-popover-menu-item-icon-disabled) !important;--ic-typography-color:orange !important}:host(.ic-menu-item-variant-destructive) ::part(button):focus-visible,:host(.ic-menu-item-variant-destructive) ::part(button):focus{background-color:var(--ic-popover-destructive-background-focus)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{--ic-typography-color:var(--ic-popover-menu-item-label-focused)}:host(.ic-menu-item-disabled) ic-button:focus-within .focus-border{border-color:var(--ic-popover-menu-border)}:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,:host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description{--ic-typography-color:var(--ic-popover-menu-item-label-disabled) !important}:host ::part(button):active{background-color:var(--ic-popover-background-pressed);color:var(--ic-popover-menu-item-label) !important;--ic-typography-color:var(--ic-popover-menu-item-label) !important}:host(.ic-menu-item-variant-destructive) ::part(button):active{background-color:var(--ic-popover-background-pressed);color:var(--ic-popover-menu-destructive-item-label) !important;--ic-typography-color:var(\n    --ic-popover-menu-destructive-item-label\n  ) !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{--ic-typography-color:var(--ic-popover-menu-item-description)}.shortcut{--ic-typography-color:var(--ic-popover-menu-item-shortcut);display:flex;flex:min-content}:host(.ic-menu-item-variant-destructive) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{--ic-typography-color:var(--ic-popover-menu-item-label)}ic-button:active .menu-item-description{--ic-typography-color:var(--ic-popover-menu-item-description)}ic-button:active .shortcut{--ic-typography-color:var(--ic-popover-menu-item-shortcut)}:host(.ic-menu-item-variant-destructive) ic-button:active .menu-item-label{--ic-typography-color:var(\n    --ic-popover-menu-destructive-item-label\n  ) !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(.ic-menu-item-disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.ic-menu-item-disabled) .menu-item-info,:host(.ic-menu-item-disabled) .menu-item-label,:host(.ic-menu-item-disabled) .shortcut,:host(.ic-menu-item-disabled) .menu-item-description,:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-info,:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,:host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description{--ic-typography-color:GrayText !important}:host(.ic-menu-item-disabled) ::part(button):focus-visible,:host(.ic-menu-item-disabled) ::part(button):focus{outline-color:GrayText !important}}';const m=p;const d=class{constructor(i){e(this,i);this.childBlur=t(this,"childBlur",7);this.handleMenuItemClick=t(this,"handleMenuItemClick",7);this.icToggleChecked=t(this,"icToggleChecked",7);this.triggerPopoverMenuInstance=t(this,"triggerPopoverMenuInstance",7);this.checked=false;this.disabled=false;this.variant="default";this.handleClick=e=>{if(s(this.submenuTriggerFor)){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){e.preventDefault();this.checked=!this.checked;this.icToggleChecked.emit({checked:this.checked})}this.handleMenuItemClick.emit(this.el)};this.getMenuItemAriaLabel=()=>{let e=this.label;if(s(this.description)){e=`${e}, ${this.description}`}if(s(this.keyboardShortcutLabel)){e=`${e}, ${this.keyboardShortcutLabel}`}if(this.variant==="destructive"){e=`${e}, destructive`}if(s(this.submenuTriggerFor)){e=`${e}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){e="Go back to parent menu"}const t=this.el.parentElement;if(t&&t.tagName==="IC-MENU-GROUP"&&t.label){return`${e}, ${t.label} menu group`}else{return e}}}watchDisabledHandler(){n(this.disabled,this.el)}componentWillLoad(){if(s(this.submenuTriggerFor)&&this.variant!=="default"){this.variant="default"}n(this.disabled,this.el)}componentDidLoad(){a([{prop:this.label,propName:"label"}],"Menu Item")}handleHostClick(e){if(this.disabled){e.stopImmediatePropagation()}}render(){const e=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcutLabel&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcutLabel)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["ic-menu-item-disabled"]:!!this.disabled,[`ic-menu-item-variant-${this.variant}`]:this.variant!==undefined}},i("ic-button",{fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:s(this.href),hreflang:s(this.hreflang),target:s(this.target),rel:s(this.rel),referrerpolicy:this.referrerpolicy,role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"?this.checked?"true":"false":undefined,"aria-label":this.getMenuItemAriaLabel(),"aria-haspopup":s(this.submenuTriggerFor)||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false},i("div",{class:"focus-border"},c(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.checked},"aria-hidden":"true",innerHTML:u}),s(this.submenuTriggerFor)&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:l}))))}static get delegatesFocus(){return true}get el(){return r(this)}static get watchers(){return{disabled:["watchDisabledHandler"]}}};d.style=m;export{d as ic_menu_item};
+//# sourceMappingURL=p-62b9e7bf.entry.js.map

package/dist/core/p-62b9e7bf.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icMenuItemCss","IcMenuItemStyle0","MenuItem","constructor","hostRef","this","checked","disabled","variant","handleClick","e","isPropDefined","submenuTriggerFor","triggerPopoverMenuInstance","emit","preventDefault","icToggleChecked","handleMenuItemClick","el","getMenuItemAriaLabel","ariaLabel","label","description","keyboardShortcutLabel","classList","contains","parentEl","parentElement","tagName","watchDisabledHandler","removeDisabledFalse","componentWillLoad","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","handleHostClick","stopImmediatePropagation","render","MenuItemInformation","h","class","Host","undefined","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","role","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\n:host ::part(button) {\n  color: var(--ic-popover-menu-item-check);\n\n  --ic-typography-color: var(--ic-popover-menu-item-check);\n\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(.ic-menu-item-disabled) ::part(button) {\n  color: var(--ic-popover-menu-item-check-disabled) !important;\n\n  --ic-typography-color: var(--ic-popover-menu-item-check-disabled) !important;\n\n  pointer-events: none;\n}\n\n:host(.ic-menu-item-disabled) .menu-item-label,\n:host(.ic-menu-item-disabled) .shortcut,\n:host(.ic-menu-item-disabled) .menu-item-description {\n  --ic-typography-color: var(--ic-popover-menu-item-label-disabled) !important;\n}\n\n:host(.ic-menu-item-variant-destructive) ::part(button) {\n  color: var(--ic-popover-menu-destructive-item-icon);\n\n  --ic-typography-color: var(--ic-popover-menu-destructive-item-label);\n}\n\n:host ::part(button):hover {\n  background-color: var(--ic-popover-background-hover);\n}\n\n:host ::part(button):focus-visible,\n:host ::part(button):focus {\n  color: var(--ic-popover-menu-item-icon-focused);\n\n  --ic-typography-color: purple;\n\n  background-color: var(--ic-popover-background-focus);\n  box-shadow: none;\n}\n\n:host(.ic-menu-item-disabled) ::part(button):focus-visible,\n:host(.ic-menu-item-disabled) ::part(button):focus {\n  color: var(--ic-popover-menu-item-icon-disabled) !important;\n\n  --ic-typography-color: orange !important;\n}\n\n:host(.ic-menu-item-variant-destructive) ::part(button):focus-visible,\n:host(.ic-menu-item-variant-destructive) ::part(button):focus {\n  background-color: var(--ic-popover-destructive-background-focus);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n  --ic-typography-color: var(--ic-popover-menu-item-label-focused);\n}\n\n:host(.ic-menu-item-disabled) ic-button:focus-within .focus-border {\n  border-color: var(--ic-popover-menu-border);\n}\n\n:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,\n:host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,\n:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description {\n  --ic-typography-color: var(--ic-popover-menu-item-label-disabled) !important;\n}\n\n:host ::part(button):active {\n  background-color: var(--ic-popover-background-pressed);\n  color: var(--ic-popover-menu-item-label) !important;\n\n  --ic-typography-color: var(--ic-popover-menu-item-label) !important;\n}\n\n:host(.ic-menu-item-variant-destructive) ::part(button):active {\n  background-color: var(--ic-popover-background-pressed);\n  color: var(--ic-popover-menu-destructive-item-label) !important;\n\n  --ic-typography-color: var(\n    --ic-popover-menu-destructive-item-label\n  ) !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  --ic-typography-color: var(--ic-popover-menu-item-description);\n}\n\n.shortcut {\n  --ic-typography-color: var(--ic-popover-menu-item-shortcut);\n\n  display: flex;\n  flex: min-content;\n}\n\n:host(.ic-menu-item-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  --ic-typography-color: var(--ic-popover-menu-item-label);\n}\n\nic-button:active .menu-item-description {\n  --ic-typography-color: var(--ic-popover-menu-item-description);\n}\n\nic-button:active .shortcut {\n  --ic-typography-color: var(--ic-popover-menu-item-shortcut);\n}\n\n:host(.ic-menu-item-variant-destructive) ic-button:active .menu-item-label {\n  --ic-typography-color: var(\n    --ic-popover-menu-destructive-item-label\n  ) !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(.ic-menu-item-disabled) ic-button:focus-within .focus-border {\n    border-color: GrayText;\n  }\n\n  :host(.ic-menu-item-disabled) .menu-item-info,\n  :host(.ic-menu-item-disabled) .menu-item-label,\n  :host(.ic-menu-item-disabled) .shortcut,\n  :host(.ic-menu-item-disabled) .menu-item-description,\n  :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-info,\n  :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,\n  :host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,\n  :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description {\n    --ic-typography-color: GrayText !important;\n  }\n\n  :host(.ic-menu-item-disabled) ::part(button):focus-visible,\n  :host(.ic-menu-item-disabled) ::part(button):focus {\n    outline-color: GrayText !important;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  Event,\n  EventEmitter,\n  Listen,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n  isPropDefined,\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  /**\n   * If `true`, the menu item will be in a checked state. This is only applicable when variant is set to `toggle`.\n   */\n  @Prop({ mutable: true, reflect: true }) checked?: 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  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\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() keyboardShortcutLabel?: 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<HTMLIcMenuItemElement>;\n\n  /**\n   * Emitted when the user clicks a menu item that is set to the toggle variant.\n   */\n  @Event() icToggleChecked: EventEmitter<{\n    checked: 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 (isPropDefined(this.submenuTriggerFor) && 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 (isPropDefined(this.submenuTriggerFor)) {\n      this.triggerPopoverMenuInstance.emit();\n    } else if (this.variant === \"toggle\") {\n      e.preventDefault();\n      this.checked = !this.checked;\n      this.icToggleChecked.emit({\n        checked: this.checked,\n      });\n    }\n    this.handleMenuItemClick.emit(this.el);\n  };\n\n  private getMenuItemAriaLabel = (): string => {\n    let ariaLabel = this.label;\n\n    if (isPropDefined(this.description)) {\n      ariaLabel = `${ariaLabel}, ${this.description}`;\n    }\n\n    if (isPropDefined(this.keyboardShortcutLabel)) {\n      ariaLabel = `${ariaLabel}, ${this.keyboardShortcutLabel}`;\n    }\n\n    if (this.variant === \"destructive\") {\n      ariaLabel = `${ariaLabel}, destructive`;\n    }\n\n    if (isPropDefined(this.submenuTriggerFor)) {\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 = this.el.parentElement;\n\n    if (\n      parentEl &&\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 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.keyboardShortcutLabel && (\n              <ic-typography variant=\"caption\" class=\"shortcut\">\n                {this.keyboardShortcutLabel}\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          [\"ic-menu-item-disabled\"]: !!this.disabled,\n          [`ic-menu-item-variant-${this.variant}`]: this.variant !== undefined,\n        }}\n      >\n        <ic-button\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={this.referrerpolicy}\n          role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n          aria-disabled={`${this.disabled}`}\n          aria-checked={\n            this.variant === \"toggle\"\n              ? this.checked\n                ? \"true\"\n                : \"false\"\n              : undefined\n          }\n          aria-label={this.getMenuItemAriaLabel()}\n          aria-haspopup={\n            isPropDefined(this.submenuTriggerFor) ||\n            this.el.classList.contains(\"ic-popover-submenu-back-button\")\n              ? \"menu\"\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.checked,\n                }}\n                aria-hidden=\"true\"\n                innerHTML={Check}\n              />\n            )}\n            {isPropDefined(this.submenuTriggerFor) && (\n              <span\n                class={{ [\"submenu-icon\"]: true }}\n                aria-hidden=\"true\"\n                innerHTML={Chevron}\n              />\n            )}\n          </div>\n        </ic-button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/{p-05036675.entry.js → p-6996e94f.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as t,f as i,h as a,H as s,g as r}from"./p-8e4e97b4.js";import{K as o,F as n,r as l,E as c,l as d,w as h,k as u,o as b,J as p,q as f,m,n as x,i as v}from"./p-b57e59b7.js";import{e as g,I as y}from"./p-bddf799a.js";const w='/*! 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-helpertext-padding:var(--ic-space-xs);--border-color:var(--ic-text-field-border-neutral);--border-color-hover:var(--ic-text-field-border-neutral-hover);--border-color-pressed:var(--ic-text-field-border-neutral-pressed);--border-color-disabled:var(--ic-text-field-border-disabled);--border-color-error:var(--ic-text-field-border-error);--border-color-error-hover:var(--ic-text-field-border-error-hover);--border-color-error-pressed:var(--ic-text-field-border-error-pressed);--border-color-success:var(--ic-text-field-border-success);--border-color-success-hover:var(--ic-text-field-border-success-hover);--border-color-success-pressed:var(--ic-text-field-border-success-pressed);--border-color-warning:var(--ic-text-field-border-warning);--border-color-warning-hover:var(--ic-text-field-border-warning-hover);--border-color-warning-pressed:var(--ic-text-field-border-warning-pressed);--ic-input-label-text-color:var(--ic-text-field-label);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle);--ic-input-validation-status-text-color:var(--ic-text-field-state-text);--ic-input-validation-error:var(--ic-text-field-state-icon-error);--ic-input-validation-warning-icon-color:var(\n    --ic-text-field-state-icon-warning\n  );--ic-input-validation-success-icon-color:var(\n    --ic-text-field-state-icon-success\n  );--ic-input-component-container-success-icon-inline-color:var(\n    --ic-text-field-state-icon-success\n  )}:host(.ic-text-field-disabled){--ic-input-label-text-color:var(--ic-text-field-label-disabled);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle-disabled);--text-field-placeholder-color:var(\n    --ic-text-field-text-area-placeholder-text-disabled\n  )}:host(.ic-text-field-full-width){width:100%}::-moz-placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}::placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}input,textarea{border:0;border-radius:var(--ic-border-radius);color:var(--text-field-text-color, var(--ic-text-field-text));background-color:var(--input-bg-color, var(--ic-text-field-background));line-height:1.5rem;letter-spacing:0.005rem;width:100%;padding-right:var(--ic-space-xs);padding-left:var(--ic-space-xs);caret-color:var(\n    --text-field-typing-cursor,\n    var(--ic-text-field-typing-cursor)\n  )}textarea{min-height:var(--ic-space-lg);resize:vertical;padding-top:0.375rem}input:focus,textarea:focus{border:0;outline:0}input:disabled,textarea:disabled{color:var(\n    --text-field-disabled-text-color,\n    var(--ic-text-field-text-disabled)\n  )}input.readonly,textarea.readonly{color:var(--ic-text-field-read-only-input-text-internal);background:transparent}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}textarea.no-resize{resize:none}.char-count-text{--ic-typography-color:var(--ic-text-field-character-limit);padding-right:var(--ic-space-xxxs)}:host(.ic-text-field-disabled) .char-count-text{--ic-typography-color:var(--ic-text-field-character-limit-disabled)}.no-left-pad{padding-left:0}::slotted([slot="icon"]){fill:var(--ic-text-field-text-disabled)}.has-value ::slotted([slot="icon"]){fill:var(--ic-text-field-input-internal-icon)}.char-count{margin-right:calc(-1 * var(--ic-space-xxxs))}.remaining-char-count-desc{position:absolute;left:-9999px}.show-validation{margin-top:var(--ic-space-xs)}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-results-button,input[type="search"]::-webkit-search-results-decoration{display:none}input[type="search"].truncate-value{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}@media (forced-colors: active){input.readonly,textarea.readonly{color:canvastext}.has-value ::slotted([slot="icon"]){fill:currentcolor}}';const k=w;let z=0;const C=[...y,"title"];const $=class{constructor(a){e(this,a);this.getValidationText=t(this,"getValidationText",7);this.icBlur=t(this,"icBlur",7);this.icChange=t(this,"icChange",7);this.icFocus=t(this,"icFocus",7);this.icInput=t(this,"icInput",7);this.icKeydown=t(this,"icKeydown",7);this.icScroll=t(this,"icScroll",7);this.inheritedAttributes={};this.hostMutationObserver=null;this.numChars=0;this.maxCharactersReached=false;this.maxCharactersWarning=false;this.minCharactersUnattained=false;this.maxValueExceeded=false;this.minValueUnattained=false;this.isFocussed=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autofocus=false;this.disabled=false;this.fullWidth=false;this.helperText="";this.hideCharCount=false;this.hideLabel=false;this.hiddenInput=true;this.inputId=`ic-text-field-input-${z++}`;this.inputmode="text";this.maxCharacters=0;this.maxCharactersMessage=`Maximum input is ${this.maxCharacters} characters`;this.maxMessage=`Maximum value of ${this.max} exceeded`;this.minCharacters=0;this.minCharactersMessage=`Minimum input is ${this.minCharacters} characters`;this.minMessage=`Minimum value of ${this.min} not met`;this.name=this.inputId;this.placeholder="";this.readonly=false;this.required=false;this.resize=false;this.rows=1;this.size="medium";this.spellcheck=false;this.theme="inherit";this.truncateValue=false;this.type="text";this.validationAriaLive="default";this.validationInline=false;this.validationInlineInternal=false;this.validationStatus="";this.validationText="";this.debounce=0;this.value="";this.initialValue=this.value;this.checkChildHydration=()=>{var e,t;if(this.hideLabel||((t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("ic-typography"))===null||t===void 0?void 0:t.classList.contains("hydrated"))){this.setFocus();clearInterval(this.interval)}};this.getNumberOfCharacters=e=>e!==null&&e!==undefined?e.length:0;this.getMaxValueExceeded=e=>{this.numChars=this.getNumberOfCharacters(e);if(this.type==="number"){this.minValueUnattained=!!e&&Number(e)<Number(this.min);this.maxValueExceeded=Number(e)>Number(this.max)}};this.getMaxCharactersReached=e=>{this.numChars=this.getNumberOfCharacters(e);this.maxCharactersReached=this.maxCharacters>0&&this.numChars>=this.maxCharacters;if(this.maxCharactersWarning&&!this.maxCharactersReached){this.maxCharactersWarning=false}};this.onInput=e=>{this.value=e.target.value;this.icInput.emit({value:this.value})};this.onBlur=e=>{const t=e.target;t.removeEventListener("wheel",this.onWheel);const{value:i}=t;this.numChars=i.length;this.minCharactersUnattained=this.minCharacters>0&&this.numChars<this.minCharacters;this.icBlur.emit({value:i});this.isFocussed=false};this.onFocus=e=>{const t=e.target;t.addEventListener("wheel",this.onWheel);this.icFocus.emit({value:t.value});this.isFocussed=true};this.onTextAreaScroll=()=>{this.icScroll.emit()};this.onWheel=e=>{const t=e.target;if(t.type==="number"){t.blur();setTimeout((()=>{t.focus()}),0)}};this.hasStatus=e=>e!==""&&!this.disabled;this.handleFormReset=()=>{this.value=this.initialValue};this.showValidationMargin=()=>{const e=this.readonly?0:this.maxCharacters;const t=o(this.validationStatus)||o(this.validationText);const i=this.minValueUnattained||this.maxValueExceeded;const a=e>0||this.minCharactersUnattained;return(!t||i||a)&&!this.validationInlineInternal};this.hostMutationCallback=e=>{let t=false;e.forEach((({attributeName:e,type:i,addedNodes:a,removedNodes:s})=>{if(e&&C.includes(e)){const i=this.el.getAttribute(e);if(i){this.inheritedAttributes[e]=i}t=true}else if(i==="childList"){t=n(a,s,"icon")}}));if(t){i(this)}}}watchDisabledHandler(){l(this.disabled,this.el)}debounceChanged(){this.icChange=c(this.icChange,this.debounce)}watchValueHandler(e){let t;if(this.maxCharacters>0){t=e.substring(0,this.maxCharacters);if(t.length<e.length){this.maxCharactersWarning=true}this.value=t}else{t=e}if(this.inputEl&&this.inputEl.value!==t){this.inputEl.value=t}this.getMaxValueExceeded(t);this.getMaxCharactersReached(t);this.icChange.emit({value:t})}connectedCallback(){this.debounceChanged()}disconnectedCallback(){var e;d(this.el,this.handleFormReset);(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentWillLoad(){if(this.value!==this.initialValue){this.watchValueHandler(this.value)}else if(this.maxCharacters>0){this.value=this.value.substring(0,this.maxCharacters)}this.getMaxValueExceeded(this.value);this.getMaxCharactersReached(this.value);this.inheritedAttributes=h(this.el,C);if(this.readonly){this.maxValueExceeded=false;this.minValueUnattained=false}u(this.el,this.handleFormReset);l(this.disabled,this.el)}componentDidLoad(){b([{prop:this.label,propName:"label"}],"Text Field");if(this.validationInlineInternal){this.getValidationText.emit({value:this.validationText})}this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{attributes:true,childList:true});if(this.autofocus&&!this.disabled&&!this.readonly){this.interval=setInterval(this.checkChildHydration,50)}}handleKeyDown(e){this.icKeydown.emit({event:e});if(!e.ctrlKey&&!g.includes(e.key)){this.maxCharactersWarning=this.maxCharactersReached}}async setFocus(){var e;(e=this.inputEl)===null||e===void 0?void 0:e.focus()}render(){const{inputId:e,name:t,label:i,required:r,size:o,placeholder:n,helperText:l,hideCharCount:c,rows:d,resize:h,disabled:u,value:b,min:g,max:y,numChars:w,readonly:k,maxCharacters:z,maxCharactersMessage:C,maxCharactersWarning:$,maxCharactersReached:I,maxMessage:M,minCharacters:L,minCharactersMessage:F,minCharactersUnattained:N,minMessage:T,minValueUnattained:j,maxValueExceeded:q,validationAriaLive:V,validationStatus:D,validationText:H,validationInline:W,validationInlineInternal:B,spellcheck:O,inputmode:S,fullWidth:A,truncateValue:E,hiddenInput:K,theme:U,hideLabel:_,type:J,autocapitalize:R,ariaActiveDescendant:G,inheritedAttributes:P,ariaExpanded:Q,ariaOwns:X,autocomplete:Y,role:Z,isFocussed:ee}=this;const te=this.el;const ie=k||u;const ae=q||j||N||$?$?p.Warning:p.Error:D;const se=$?C:q?M:j?T:N?F:H;const re=k?0:z;const oe=V==="default"?$||q||j||ae===p.Error?"assertive":"polite":V;const ne=this.hasStatus(ae)&&!(ae==p.Success&&W)&&!B;const le=d>1;const ce=z>0?`${e}-char-count-desc`:"";const de=re-w;const he=z>0?`${e}-remaining-char-count-desc`:"";const ue=`${de} character${de===1?"":"s"} remaining.`;const be=`${ce} ${w>0?he:""} ${f(this.el,e,l!=="",ne)}`.trim();const pe=ie&&!k;const fe=!!this.el.querySelector(`[slot="icon"]`)&&!pe;const me=`${ae===p.Error}`;K?m(this.el,b,t,ie):x(this.el);return a(s,{key:"985b46adc3cee088de75766a4230042e4af8c9c3",class:{"ic-text-field-full-width":A,"ic-text-field-disabled":ie,[`ic-theme-${U}`]:U!=="inherit"}},a("ic-input-container",{key:"4b9794b880ab440c1c2e6cf2072c13d9d88cc1fa",readonly:k,disabled:ie},!_&&a("ic-input-label",{key:"6ccf8091d697ddce0dade9a81d38e7bc17315da9",for:e,label:i,helperText:l,required:r,disabled:pe,readonly:k},a("slot",{key:"0ecf6a100c43efdca46f3b7c03ac6a5a8f7cc972",name:"helper-text",slot:"helper-text"})),a("ic-input-component-container",{key:"a1d649e733cab8590b92db3c0ecda49ea021103f",size:o,validationStatus:ae,multiLine:le,disabled:ie,readonly:k,validationInline:W,fullWidth:A},fe&&a("span",{key:"d3228d1ab97951891316b60608ce8a9fbe6295bb",class:{readonly:k,"has-value":this.getNumberOfCharacters(b)>0},slot:"left-icon"},a("slot",{key:"ea62e21d7abc5048da1a8e9a15f5a5a535c963b3",name:"icon"})),!le?a("input",Object.assign({id:e,name:t,ref:e=>this.inputEl=e,type:J,min:g,max:y,value:b,class:{"no-left-pad":!fe&&k,readonly:k,"truncate-value":E},placeholder:n?n:"",required:r,disabled:ie,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,"aria-label":i,"aria-describedby":be,"aria-invalid":me,"aria-activedescendant":G,"aria-expanded":Q,"aria-owns":X,autocomplete:Y,autocapitalize:R,spellcheck:O,inputmode:S,role:Z||undefined,maxlength:I?z:undefined,minlength:N?L:undefined},P)):a("textarea",Object.assign({id:e,class:{"no-resize":h===false||!!k,"no-left-pad":!fe&&!!k,readonly:!!k},name:t,ref:e=>this.inputEl=e,value:b,rows:d,required:r,disabled:ie,placeholder:n,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,onScroll:this.onTextAreaScroll,"aria-label":i,"aria-describedby":be,"aria-invalid":me,autocomplete:Y,autocapitalize:R,spellcheck:O,inputmode:S,maxlength:I?z:undefined,minlength:N?L:undefined},P)),v(te,"clear-button")&&a("slot",{key:"e02f69a6fd4c654b7f3b5f1593f7a29c7412d10f",name:"clear-button"}),v(te,"search-submit-button")&&a("slot",{key:"2e32b1afd58a382a804a356537489efa523009ce",name:"search-submit-button"})),v(te,"menu")&&a("slot",{key:"1cbac8ded359309907e51f16033b03d266eb8828",name:"menu"}),a("ic-input-validation",{key:"55a5e1762111cb2715679f6263719924b098acd4",class:{"show-validation":this.showValidationMargin()},status:this.hasStatus(ae)===false||ae===p.Success&&W||B?"":ae,message:ne?se:"",ariaLiveMode:oe,for:e,fullWidth:A},!k&&re>0&&a("div",{key:"ce76d39f556c5cf5ab0e97abb93e243cb0153f54",slot:"validation-message-adornment"},!c&&a("ic-typography",{key:"49a4898f4b336ca7e1ced4550a9494c5505a78a6",variant:"caption",class:"char-count-text"},a("span",{key:"2b714b46208c477500494f1f43d919f972501f9b",class:"char-count"},w,"/",re)),a("span",{key:"3559afb42041b8bb3080ae5bd015bc76a9af3b2d",class:"remaining-char-count-desc","aria-live":"polite",hidden:!ee,id:he},ue),a("span",{key:"9f98def180554d1dc13e05d6cefac85fd91638bb",hidden:true,id:ce},"Field can contain a maximum of ",re," characters.")))))}get el(){return r(this)}static get watchers(){return{disabled:["watchDisabledHandler"],debounce:["debounceChanged"],value:["watchValueHandler"]}}};$.style=k;export{$ as ic_text_field};
-//# sourceMappingURL=p-05036675.entry.js.map
+import{r as e,c as t,f as i,h as a,H as s,g as r}from"./p-8e4e97b4.js";import{L as o,F as n,r as l,E as c,l as d,w as h,k as u,o as b,K as p,q as f,m,n as v,i as x}from"./p-a5658054.js";import{e as g,I as y}from"./p-bddf799a.js";const w='/*! 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-helpertext-padding:var(--ic-space-xs);--border-color:var(--ic-text-field-border-neutral);--border-color-hover:var(--ic-text-field-border-neutral-hover);--border-color-pressed:var(--ic-text-field-border-neutral-pressed);--border-color-disabled:var(--ic-text-field-border-disabled);--border-color-error:var(--ic-text-field-border-error);--border-color-error-hover:var(--ic-text-field-border-error-hover);--border-color-error-pressed:var(--ic-text-field-border-error-pressed);--border-color-success:var(--ic-text-field-border-success);--border-color-success-hover:var(--ic-text-field-border-success-hover);--border-color-success-pressed:var(--ic-text-field-border-success-pressed);--border-color-warning:var(--ic-text-field-border-warning);--border-color-warning-hover:var(--ic-text-field-border-warning-hover);--border-color-warning-pressed:var(--ic-text-field-border-warning-pressed);--ic-input-label-text-color:var(--ic-text-field-label);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle);--ic-input-validation-status-text-color:var(--ic-text-field-state-text);--ic-input-validation-error:var(--ic-text-field-state-icon-error);--ic-input-validation-warning-icon-color:var(\n    --ic-text-field-state-icon-warning\n  );--ic-input-validation-success-icon-color:var(\n    --ic-text-field-state-icon-success\n  );--ic-input-component-container-success-icon-inline-color:var(\n    --ic-text-field-state-icon-success\n  )}:host(.ic-text-field-disabled){--ic-input-label-text-color:var(--ic-text-field-label-disabled);--ic-input-label-helper-text-color:var(--ic-text-field-subtitle-disabled);--text-field-placeholder-color:var(\n    --ic-text-field-text-area-placeholder-text-disabled\n  )}:host(.ic-text-field-full-width){width:100%}::-moz-placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}::placeholder{color:var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );opacity:1}input,textarea{border:0;border-radius:var(--ic-border-radius);color:var(--text-field-text-color, var(--ic-text-field-text));background-color:var(--input-bg-color, var(--ic-text-field-background));line-height:1.5rem;letter-spacing:0.005rem;width:100%;padding-right:var(--ic-space-xs);padding-left:var(--ic-space-xs);caret-color:var(\n    --text-field-typing-cursor,\n    var(--ic-text-field-typing-cursor)\n  )}textarea{min-height:var(--ic-space-lg);resize:vertical;padding-top:0.375rem}input:focus,textarea:focus{border:0;outline:0}input:disabled,textarea:disabled{color:var(\n    --text-field-disabled-text-color,\n    var(--ic-text-field-text-disabled)\n  )}input.readonly,textarea.readonly{color:var(--ic-text-field-read-only-input-text-internal);background:transparent}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}textarea.no-resize{resize:none}.char-count-text{--ic-typography-color:var(--ic-text-field-character-limit);padding-right:var(--ic-space-xxxs)}:host(.ic-text-field-disabled) .char-count-text{--ic-typography-color:var(--ic-text-field-character-limit-disabled)}.no-left-pad{padding-left:0}::slotted([slot="icon"]){fill:var(--ic-text-field-text-disabled)}.has-value ::slotted([slot="icon"]){fill:var(--ic-text-field-input-internal-icon)}.char-count{margin-right:calc(-1 * var(--ic-space-xxxs))}.remaining-char-count-desc{position:absolute;left:-9999px}.show-validation{margin-top:var(--ic-space-xs)}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-results-button,input[type="search"]::-webkit-search-results-decoration{display:none}input[type="search"].truncate-value{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}@media (forced-colors: active){input.readonly,textarea.readonly{color:canvastext}.has-value ::slotted([slot="icon"]){fill:currentcolor}}';const k=w;let z=0;const C=[...y,"title"];const $=class{constructor(a){e(this,a);this.getValidationText=t(this,"getValidationText",7);this.icBlur=t(this,"icBlur",7);this.icChange=t(this,"icChange",7);this.icFocus=t(this,"icFocus",7);this.icInput=t(this,"icInput",7);this.icKeydown=t(this,"icKeydown",7);this.icScroll=t(this,"icScroll",7);this.inheritedAttributes={};this.hostMutationObserver=null;this.numChars=0;this.maxCharactersReached=false;this.maxCharactersWarning=false;this.minCharactersUnattained=false;this.maxValueExceeded=false;this.minValueUnattained=false;this.isFocussed=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autofocus=false;this.disabled=false;this.fullWidth=false;this.helperText="";this.hideCharCount=false;this.hideLabel=false;this.hiddenInput=true;this.inputId=`ic-text-field-input-${z++}`;this.inputmode="text";this.maxCharacters=0;this.maxCharactersMessage=`Maximum input is ${this.maxCharacters} characters`;this.maxMessage=`Maximum value of ${this.max} exceeded`;this.minCharacters=0;this.minCharactersMessage=`Minimum input is ${this.minCharacters} characters`;this.minMessage=`Minimum value of ${this.min} not met`;this.name=this.inputId;this.placeholder="";this.readonly=false;this.required=false;this.resize=false;this.rows=1;this.size="medium";this.spellcheck=false;this.theme="inherit";this.truncateValue=false;this.type="text";this.validationAriaLive="default";this.validationInline=false;this.validationInlineInternal=false;this.validationStatus="";this.validationText="";this.debounce=0;this.value="";this.initialValue=this.value;this.checkChildHydration=()=>{var e,t;if(this.hideLabel||((t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("ic-typography"))===null||t===void 0?void 0:t.classList.contains("hydrated"))){this.setFocus();clearInterval(this.interval)}};this.getNumberOfCharacters=e=>e!==null&&e!==undefined?e.length:0;this.getMaxValueExceeded=e=>{this.numChars=this.getNumberOfCharacters(e);if(this.type==="number"){this.minValueUnattained=!!e&&Number(e)<Number(this.min);this.maxValueExceeded=Number(e)>Number(this.max)}};this.getMaxCharactersReached=e=>{this.numChars=this.getNumberOfCharacters(e);this.maxCharactersReached=this.maxCharacters>0&&this.numChars>=this.maxCharacters;if(this.maxCharactersWarning&&!this.maxCharactersReached){this.maxCharactersWarning=false}};this.onInput=e=>{this.value=e.target.value;this.icInput.emit({value:this.value})};this.onBlur=e=>{const t=e.target;t.removeEventListener("wheel",this.onWheel);const{value:i}=t;this.numChars=i.length;this.minCharactersUnattained=this.minCharacters>0&&this.numChars<this.minCharacters;this.icBlur.emit({value:i});this.isFocussed=false};this.onFocus=e=>{const t=e.target;t.addEventListener("wheel",this.onWheel);this.icFocus.emit({value:t.value});this.isFocussed=true};this.onTextAreaScroll=()=>{this.icScroll.emit()};this.onWheel=e=>{const t=e.target;if(t.type==="number"){t.blur();setTimeout((()=>{t.focus()}),0)}};this.hasStatus=e=>e!==""&&!this.disabled;this.handleFormReset=()=>{this.value=this.initialValue};this.showValidationMargin=()=>{const e=this.readonly?0:this.maxCharacters;const t=o(this.validationStatus)||o(this.validationText);const i=this.minValueUnattained||this.maxValueExceeded;const a=e>0||this.minCharactersUnattained;return(!t||i||a)&&!this.validationInlineInternal};this.hostMutationCallback=e=>{let t=false;e.forEach((({attributeName:e,type:i,addedNodes:a,removedNodes:s})=>{if(e&&C.includes(e)){const i=this.el.getAttribute(e);if(i){this.inheritedAttributes[e]=i}t=true}else if(i==="childList"){t=n(a,s,"icon")}}));if(t){i(this)}}}watchDisabledHandler(){l(this.disabled,this.el)}debounceChanged(){this.icChange=c(this.icChange,this.debounce)}watchValueHandler(e){let t;if(this.maxCharacters>0){t=e.substring(0,this.maxCharacters);if(t.length<e.length){this.maxCharactersWarning=true}this.value=t}else{t=e}if(this.inputEl&&this.inputEl.value!==t){this.inputEl.value=t}this.getMaxValueExceeded(t);this.getMaxCharactersReached(t);this.icChange.emit({value:t})}connectedCallback(){this.debounceChanged()}disconnectedCallback(){var e;d(this.el,this.handleFormReset);(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentWillLoad(){if(this.value!==this.initialValue){this.watchValueHandler(this.value)}else if(this.maxCharacters>0){this.value=this.value.substring(0,this.maxCharacters)}this.getMaxValueExceeded(this.value);this.getMaxCharactersReached(this.value);this.inheritedAttributes=h(this.el,C);if(this.readonly){this.maxValueExceeded=false;this.minValueUnattained=false}u(this.el,this.handleFormReset);l(this.disabled,this.el)}componentDidLoad(){b([{prop:this.label,propName:"label"}],"Text Field");if(this.validationInlineInternal){this.getValidationText.emit({value:this.validationText})}this.hostMutationObserver=new MutationObserver(this.hostMutationCallback);this.hostMutationObserver.observe(this.el,{attributes:true,childList:true});if(this.autofocus&&!this.disabled&&!this.readonly){this.interval=setInterval(this.checkChildHydration,50)}}handleKeyDown(e){var t,i;this.icKeydown.emit({event:e,cursorPosition:(t=this.inputEl.selectionStart)!==null&&t!==void 0?t:0,selectionEnd:(i=this.inputEl.selectionEnd)!==null&&i!==void 0?i:0});if(!e.ctrlKey&&!g.includes(e.key)){this.maxCharactersWarning=this.maxCharactersReached}}async setFocus(){var e;(e=this.inputEl)===null||e===void 0?void 0:e.focus()}render(){const{inputId:e,name:t,label:i,required:r,size:o,placeholder:n,helperText:l,hideCharCount:c,rows:d,resize:h,disabled:u,value:b,min:g,max:y,numChars:w,readonly:k,maxCharacters:z,maxCharactersMessage:C,maxCharactersWarning:$,maxCharactersReached:I,maxMessage:M,minCharacters:L,minCharactersMessage:F,minCharactersUnattained:N,minMessage:T,minValueUnattained:j,maxValueExceeded:q,validationAriaLive:V,validationStatus:D,validationText:H,validationInline:W,validationInlineInternal:B,spellcheck:E,inputmode:O,fullWidth:S,truncateValue:A,hiddenInput:K,theme:U,hideLabel:_,type:P,autocapitalize:R,ariaActiveDescendant:G,inheritedAttributes:J,ariaExpanded:Q,ariaOwns:X,autocomplete:Y,role:Z,isFocussed:ee}=this;const te=this.el;const ie=k||u;const ae=q||j||N||$?$?p.Warning:p.Error:D;const se=$?C:q?M:j?T:N?F:H;const re=k?0:z;const oe=V==="default"?$||q||j||ae===p.Error?"assertive":"polite":V;const ne=this.hasStatus(ae)&&!(ae==p.Success&&W)&&!B;const le=d>1;const ce=z>0?`${e}-char-count-desc`:"";const de=re-w;const he=z>0?`${e}-remaining-char-count-desc`:"";const ue=`${de} character${de===1?"":"s"} remaining.`;const be=`${ce} ${w>0?he:""} ${f(this.el,e,l!=="",ne)}`.trim();const pe=ie&&!k;const fe=!!this.el.querySelector(`[slot="icon"]`)&&!pe;const me=`${ae===p.Error}`;K?m(this.el,b,t,ie):v(this.el);return a(s,{key:"1b376250d6e147cac7b9dbb15ae5eb7a2ba6aefe",class:{"ic-text-field-full-width":S,"ic-text-field-disabled":ie,[`ic-theme-${U}`]:U!=="inherit"}},a("ic-input-container",{key:"ef66c6d29dd16f57af7d10d177210c63979ad106",readonly:k,disabled:ie},!_&&a("ic-input-label",{key:"2c4e3c9f6580a1d68983758214be4be7d5c9c762",for:e,label:i,helperText:l,required:r,disabled:pe,readonly:k},a("slot",{key:"c0a2199348d4157e67deca641480e2c2d3d16550",name:"helper-text",slot:"helper-text"})),a("ic-input-component-container",{key:"5bcfba3d42c94cf7abc8f7ad2ba29b5b80ffe511",size:o,validationStatus:ae,multiLine:le,disabled:ie,readonly:k,validationInline:W,fullWidth:S},fe&&a("span",{key:"d98d07fb64f7cdfed8d66860b4df4a1b64174a24",class:{readonly:k,"has-value":this.getNumberOfCharacters(b)>0},slot:"left-icon"},a("slot",{key:"8508568fb8dada7941c0ac9f938f6a71892e06ff",name:"icon"})),!le?a("input",Object.assign({id:e,name:t,ref:e=>this.inputEl=e,type:P,min:g,max:y,value:b,class:{"no-left-pad":!fe&&k,readonly:k,"truncate-value":A},placeholder:n?n:"",required:r,disabled:ie,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,"aria-label":i,"aria-describedby":be,"aria-invalid":me,"aria-activedescendant":G,"aria-expanded":Q,"aria-owns":X,autocomplete:Y,autocapitalize:R,spellcheck:E,inputmode:O,role:Z||undefined,maxlength:I?z:undefined,minlength:N?L:undefined},J)):a("textarea",Object.assign({id:e,class:{"no-resize":h===false||!!k,"no-left-pad":!fe&&!!k,readonly:!!k},name:t,ref:e=>this.inputEl=e,value:b,rows:d,required:r,disabled:ie,placeholder:n,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,onScroll:this.onTextAreaScroll,"aria-label":i,"aria-describedby":be,"aria-invalid":me,autocomplete:Y,autocapitalize:R,spellcheck:E,inputmode:O,maxlength:I?z:undefined,minlength:N?L:undefined},J)),x(te,"clear-button")&&a("slot",{key:"91761fa97b0bb02a095968b7e204ebb93c3cdebf",name:"clear-button"}),x(te,"search-submit-button")&&a("slot",{key:"656d028a1add45972896a170347b0733f1794eec",name:"search-submit-button"})),x(te,"menu")&&a("slot",{key:"f305e73e1035983c26fd6f738a46446c43a81245",name:"menu"}),a("ic-input-validation",{key:"85a6ff5809be1edcc921c46a6a415e5739c14baa",class:{"show-validation":this.showValidationMargin()},status:this.hasStatus(ae)===false||ae===p.Success&&W||B?"":ae,message:ne?se:"",ariaLiveMode:oe,for:e,fullWidth:S},!k&&re>0&&a("div",{key:"13e0c01a4525d51b9515cbc04667c21fa918736d",slot:"validation-message-adornment"},!c&&a("ic-typography",{key:"9038017ea03a0c6b8ea32fd102b012a28af8503f",variant:"caption",class:"char-count-text"},a("span",{key:"5b13ff51491f886e705726616c439ecb8d8d00bc",class:"char-count"},w,"/",re)),a("span",{key:"8c4e2f4f749838d382fc06d5cec08dec0ba88d43",class:"remaining-char-count-desc","aria-live":"polite",hidden:!ee,id:he},ue),a("span",{key:"d66957769eb0962af90f9933339aeecf961fc690",hidden:true,id:ce},"Field can contain a maximum of ",re," characters.")))))}get el(){return r(this)}static get watchers(){return{disabled:["watchDisabledHandler"],debounce:["debounceChanged"],value:["watchValueHandler"]}}};$.style=k;export{$ as ic_text_field};
+//# sourceMappingURL=p-6996e94f.entry.js.map

package/dist/core/p-6996e94f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icTextFieldCss","IcTextFieldStyle0","inputIds","MUTABLE_ATTRIBUTES","IC_INHERITED_ARIA","TextField","constructor","hostRef","this","inheritedAttributes","hostMutationObserver","numChars","maxCharactersReached","maxCharactersWarning","minCharactersUnattained","maxValueExceeded","minValueUnattained","isFocussed","autocapitalize","autocomplete","autocorrect","autofocus","disabled","fullWidth","helperText","hideCharCount","hideLabel","hiddenInput","inputId","inputmode","maxCharacters","maxCharactersMessage","maxMessage","max","minCharacters","minCharactersMessage","minMessage","min","name","placeholder","readonly","required","resize","rows","size","spellcheck","theme","truncateValue","type","validationAriaLive","validationInline","validationInlineInternal","validationStatus","validationText","debounce","value","initialValue","checkChildHydration","_b","_a","el","shadowRoot","querySelector","classList","contains","setFocus","clearInterval","interval","getNumberOfCharacters","undefined","length","getMaxValueExceeded","Number","getMaxCharactersReached","onInput","ev","target","icInput","emit","onBlur","removeEventListener","onWheel","icBlur","onFocus","addEventListener","icFocus","onTextAreaScroll","icScroll","blur","setTimeout","focus","hasStatus","status","handleFormReset","showValidationMargin","maxNumChars","emptyString","isEmptyString","valueOutsideRange","charsOutsideRange","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","addedNodes","removedNodes","includes","attribute","getAttribute","checkSlotInChildMutations","forceUpdate","watchDisabledHandler","removeDisabledFalse","debounceChanged","icChange","debounceEvent","watchValueHandler","newValue","substring","inputEl","connectedCallback","disconnectedCallback","removeFormResetListener","disconnect","componentWillLoad","inheritAttributes","addFormResetListener","componentDidLoad","onComponentRequiredPropUndefined","prop","label","propName","getValidationText","MutationObserver","observe","attributes","childList","setInterval","handleKeyDown","icKeydown","event","cursorPosition","selectionStart","selectionEnd","ctrlKey","IGNORED_KEYBOARD_CHARACTERS","key","render","ariaActiveDescendant","ariaExpanded","ariaOwns","role","disabledMode","currentStatus","IcInformationStatus","Warning","Error","currentValidationText","messageAriaLive","showStatusText","Success","multiline","hiddenCharCountDescId","charsRemaining","remainingCharCountDescId","remainingCharCountDesc","describedBy","getInputDescribedByText","trim","disabledText","showLeftIcon","invalid","renderHiddenInput","removeHiddenInput","h","Host","class","for","slot","multiLine","Object","assign","id","ref","maxlength","minlength","onScroll","isSlotUsed","message","ariaLiveMode","variant","hidden"],"sources":["src/components/ic-text-field/ic-text-field.css?tag=ic-text-field&encapsulation=shadow","src/components/ic-text-field/ic-text-field.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --input-width: Width of the input field\n   */\n  display: block;\n\n  --ic-input-label-helpertext-padding: var(--ic-space-xs);\n  --border-color: var(--ic-text-field-border-neutral);\n  --border-color-hover: var(--ic-text-field-border-neutral-hover);\n  --border-color-pressed: var(--ic-text-field-border-neutral-pressed);\n  --border-color-disabled: var(--ic-text-field-border-disabled);\n  --border-color-error: var(--ic-text-field-border-error);\n  --border-color-error-hover: var(--ic-text-field-border-error-hover);\n  --border-color-error-pressed: var(--ic-text-field-border-error-pressed);\n  --border-color-success: var(--ic-text-field-border-success);\n  --border-color-success-hover: var(--ic-text-field-border-success-hover);\n  --border-color-success-pressed: var(--ic-text-field-border-success-pressed);\n  --border-color-warning: var(--ic-text-field-border-warning);\n  --border-color-warning-hover: var(--ic-text-field-border-warning-hover);\n  --border-color-warning-pressed: var(--ic-text-field-border-warning-pressed);\n  --ic-input-label-text-color: var(--ic-text-field-label);\n  --ic-input-label-helper-text-color: var(--ic-text-field-subtitle);\n  --ic-input-validation-status-text-color: var(--ic-text-field-state-text);\n  --ic-input-validation-error: var(--ic-text-field-state-icon-error);\n  --ic-input-validation-warning-icon-color: var(\n    --ic-text-field-state-icon-warning\n  );\n  --ic-input-validation-success-icon-color: var(\n    --ic-text-field-state-icon-success\n  );\n  --ic-input-component-container-success-icon-inline-color: var(\n    --ic-text-field-state-icon-success\n  );\n}\n\n:host(.ic-text-field-disabled) {\n  --ic-input-label-text-color: var(--ic-text-field-label-disabled);\n  --ic-input-label-helper-text-color: var(--ic-text-field-subtitle-disabled);\n  --text-field-placeholder-color: var(\n    --ic-text-field-text-area-placeholder-text-disabled\n  );\n}\n\n:host(.ic-text-field-full-width) {\n  width: 100%;\n}\n\n::placeholder {\n  color: var(\n    --text-field-placeholder-color,\n    var(--ic-text-field-placeholder-text)\n  );\n  opacity: 1;\n}\n\ninput,\ntextarea {\n  border: 0;\n  border-radius: var(--ic-border-radius);\n  color: var(--text-field-text-color, var(--ic-text-field-text));\n  background-color: var(--input-bg-color, var(--ic-text-field-background));\n  line-height: 1.5rem;\n  letter-spacing: 0.005rem;\n  width: 100%;\n  padding-right: var(--ic-space-xs);\n  padding-left: var(--ic-space-xs);\n  caret-color: var(\n    --text-field-typing-cursor,\n    var(--ic-text-field-typing-cursor)\n  );\n}\n\ntextarea {\n  min-height: var(--ic-space-lg);\n  resize: vertical;\n  padding-top: 0.375rem;\n}\n\ninput:focus,\ntextarea:focus {\n  border: 0;\n  outline: 0;\n}\n\ninput:disabled,\ntextarea:disabled {\n  color: var(\n    --text-field-disabled-text-color,\n    var(--ic-text-field-text-disabled)\n  );\n}\n\ninput.readonly,\ntextarea.readonly {\n  color: var(--ic-text-field-read-only-input-text-internal);\n  background: transparent;\n}\n\n/* Chrome, Safari, Edge */\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n/* Firefox */\ninput[type=\"number\"] {\n  -moz-appearance: textfield;\n}\n\ntextarea.no-resize {\n  resize: none;\n}\n\n.char-count-text {\n  --ic-typography-color: var(--ic-text-field-character-limit);\n\n  padding-right: var(--ic-space-xxxs);\n}\n\n:host(.ic-text-field-disabled) .char-count-text {\n  --ic-typography-color: var(--ic-text-field-character-limit-disabled);\n}\n\n.no-left-pad {\n  padding-left: 0;\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-text-field-text-disabled);\n}\n\n.has-value ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-text-field-input-internal-icon);\n}\n\n.char-count {\n  margin-right: calc(-1 * var(--ic-space-xxxs));\n}\n\n.remaining-char-count-desc {\n  position: absolute;\n  left: -9999px;\n}\n\n.show-validation {\n  margin-top: var(--ic-space-xs);\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n  display: none;\n}\n\ninput[type=\"search\"].truncate-value {\n  width: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n@media (forced-colors: active) {\n  input.readonly,\n  textarea.readonly {\n    color: canvastext;\n  }\n\n  .has-value ::slotted([slot=\"icon\"]) {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  h,\n  forceUpdate,\n} from \"@stencil/core\";\nimport {\n  IcInformationStatus,\n  IcAutocompleteTypes,\n  IcAutocorrectStates,\n  IcInformationStatusOrEmpty,\n  IcValueEventDetail,\n  IcSizesNoLarge,\n  IcThemeMode,\n  IcValidationAriaLive,\n} from \"../../utils/types\";\nimport {\n  inheritAttributes,\n  debounceEvent,\n  getInputDescribedByText,\n  renderHiddenInput,\n  isEmptyString,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n  isSlotUsed,\n  removeDisabledFalse,\n  checkSlotInChildMutations,\n  removeHiddenInput,\n} from \"../../utils/helpers\";\nimport {\n  IC_INHERITED_ARIA,\n  IGNORED_KEYBOARD_CHARACTERS,\n} from \"../../utils/constants\";\nimport {\n  IcAriaAutocompleteTypes,\n  IcTextFieldInputModes,\n  IcTextFieldKeydownEventDetail,\n  IcTextFieldTypes,\n} from \"./ic-text-field.types\";\n\nlet inputIds = 0;\nconst MUTABLE_ATTRIBUTES = [...IC_INHERITED_ARIA, \"title\"];\n\n/**\n * @slot helper-text - Content is set as the helper text for the text field.\n * @slot icon - Content will be placed to the left of the text input.\n */\n@Component({\n  tag: \"ic-text-field\",\n  styleUrl: \"ic-text-field.css\",\n  shadow: true,\n})\nexport class TextField {\n  private inheritedAttributes: { [k: string]: string } = {};\n  private inputEl: HTMLInputElement | HTMLTextAreaElement;\n  private hostMutationObserver: MutationObserver | null = null;\n  private interval: ReturnType<typeof setInterval>;\n\n  @Element() el: HTMLIcTextFieldElement;\n\n  @State() numChars: number = 0;\n  @State() maxCharactersReached: boolean = false;\n  @State() maxCharactersWarning: boolean = false;\n  @State() minCharactersUnattained: boolean = false;\n  @State() maxValueExceeded: boolean = false;\n  @State() minValueUnattained: boolean = false;\n  @State() isFocussed: boolean = false;\n\n  /**\n   * @slot clear-button - an ic-button clear component will render as an end adornment to the input.\n   * @slot search-submit-button - an ic-button search submit component will render as an end adornment to the input.\n   * @slot menu - an ic-menu component will appear below the input.\n   */\n\n  /**\n   * @internal The active element when focus is on the ic-menu items.\n   */\n  @Prop() ariaActiveDescendant?: string;\n\n  /**\n   * @internal Used to identify whether inputting any text triggers more predictions\n   */\n  @Prop() ariaAutocomplete?: IcAriaAutocompleteTypes;\n\n  /**\n   * @internal Used to identify if the slotted menu is rendered\n   */\n  @Prop() ariaExpanded: string | null;\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaOwns?: string;\n\n  /**\n   * The automatic capitalisation of the text value as it is entered/edited by the user.\n   * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n   */\n  @Prop() autocapitalize = \"off\";\n\n  /**\n   * The state of autocompletion the browser can apply on the text value.\n   */\n  @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n  /**\n   * The state of autocorrection the browser can apply when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n  /**\n   * If `true`, the form control will have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el as HTMLElement);\n  }\n\n  /**\n   * Specify whether the text field fills the full width of the container.\n   * If `true`, this overrides the --input-width CSS variable.\n   */\n  @Prop() fullWidth = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText = \"\";\n\n  /**\n   * If `true`, the character count which is displayed when `maxCharacters` is set will be visually hidden.\n   */\n  @Prop() hideCharCount = false;\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 = false;\n\n  /**\n   * @internal If `true`, the hidden form input will stop rendering for form submission.\n   */\n  @Prop() hiddenInput = true;\n\n  /**\n   * The ID for the input.\n   */\n  @Prop() inputId = `ic-text-field-input-${inputIds++}`;\n\n  /**\n   * A hint to the browser for which keyboard to display.\n   * Possible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n   * `\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n   */\n  @Prop() inputmode: IcTextFieldInputModes = \"text\";\n\n  /**\n   * The label for the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The maximum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of max value in `helperText` or `label`)\n   */\n  @Prop() max?: string | number;\n\n  /**\n   * The count of characters in the field. Will display a warning if the bound is reached. (NOTE: If the value of the text field has been set using the `value` prop, it will be truncated to this number of characters)\n   */\n  @Prop() maxCharacters = 0;\n\n  /**\n   * The text to display as the warning message when the maximum number of characters (the `maxCharacters` prop value) is reached.\n   */\n  // prettier-ignore\n  @Prop() maxCharactersMessage = `Maximum input is ${this.maxCharacters} characters`;\n\n  /**\n   * The text to display as the error message when the maximum value (the `max` prop value) has been exceeded.\n   */\n  @Prop() maxMessage = `Maximum value of ${this.max} exceeded`;\n\n  /**\n   * The minimum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of min value in `helperText` or `label`)\n   */\n  @Prop() min?: string | number;\n\n  /**\n   * The minimum number of characters that can be entered in the field.\n   */\n  @Prop() minCharacters = 0;\n\n  /**\n   * The text to display as the error message when the minimum number of characters (the `minCharacters` prop value) has not been met.\n   */\n  // prettier-ignore\n  @Prop() minCharactersMessage = `Minimum input is ${this.minCharacters} characters`;\n\n  /**\n   * The text to display as the error message when the minimum value (the `min` prop value) has not been met.\n   */\n  @Prop() minMessage = `Minimum value of ${this.min} not met`;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name = this.inputId;\n\n  /**\n   * The placeholder value to be displayed.\n   */\n  @Prop() placeholder = \"\";\n\n  /**\n   * If `true`, the read only state will be set.\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * If `true`, the input will require a value.\n   */\n  @Prop() required = false;\n\n  /**\n   * If `true`, the multiline text area will be resizeable.\n   */\n  @Prop() resize = false;\n\n  /**\n   * @internal Used to set the role if not default textbox;\n   */\n  @Prop() role: string | null;\n\n  /**\n   * The number of rows to transform the text field into a text area with a specific height.\n   */\n  @Prop() rows = 1;\n\n  /**\n   * The size of the text field component.\n   */\n  @Prop() size: IcSizesNoLarge = \"medium\";\n\n  /**\n   * If `true`, the value of the text field will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck = false;\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme: IcThemeMode = \"inherit\";\n\n  /**\n   * @internal If `true`, an ellipsis will be displayed at the end of the value if the value is longer than the container.\n   */\n  @Prop() truncateValue = false;\n\n  /**\n   * The type of control to display. The default type is text.\n   */\n  @Prop() type: IcTextFieldTypes = \"text\";\n\n  /**\n   * The value of the `aria-live` attribute on the validation message. When set to \"default\", the `aria-live` value will be handled automatically, e.g. \"assertive\" for `validation-status=\"error\"`.\n   */\n  @Prop() validationAriaLive: IcValidationAriaLive = \"default\";\n\n  /**\n   * If `true`, the icon in input control will be displayed - only applies when validationStatus ='success'.\n   */\n  @Prop() validationInline = false;\n\n  /**\n   *  @internal If `true`, the validation will display inline.\n   */\n  @Prop() validationInlineInternal = false;\n\n  /**\n   * The validation state - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The text to display as the validation message.\n   */\n  @Prop() validationText: string = \"\";\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop() debounce = 0;\n  @Watch(\"debounce\")\n  private debounceChanged() {\n    this.icChange = debounceEvent(this.icChange, this.debounce);\n  }\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value = \"\";\n  @State() initialValue = this.value;\n  @Watch(\"value\")\n  private watchValueHandler(newValue: string): void {\n    let value;\n\n    if (this.maxCharacters > 0) {\n      value = newValue.substring(0, this.maxCharacters);\n      if (value.length < newValue.length) {\n        this.maxCharactersWarning = true;\n      }\n      this.value = value;\n    } else {\n      value = newValue;\n    }\n\n    if (this.inputEl && this.inputEl.value !== value) {\n      this.inputEl.value = value;\n    }\n\n    this.getMaxValueExceeded(value);\n\n    this.getMaxCharactersReached(value);\n\n    this.icChange.emit({ value });\n  }\n\n  /**\n   * @internal Emitted when the validationInlineInternal is `true`\n   */\n  @Event() getValidationText: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input loses focus.\n   */\n  @Event() icBlur: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input gains focus.\n   */\n  @Event() icFocus: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keydown event occurred.\n   */\n  @Event() icKeydown: EventEmitter<IcTextFieldKeydownEventDetail>;\n\n  /**\n   * Emitted when the textarea variant is scrolled.\n   */\n  @Event() icScroll: EventEmitter;\n\n  connectedCallback(): void {\n    this.debounceChanged();\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.el as HTMLElement, this.handleFormReset);\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    if (this.value !== this.initialValue) {\n      this.watchValueHandler(this.value);\n    } else if (this.maxCharacters > 0) {\n      this.value = this.value.substring(0, this.maxCharacters);\n    }\n\n    this.getMaxValueExceeded(this.value);\n    this.getMaxCharactersReached(this.value);\n\n    this.inheritedAttributes = inheritAttributes(\n      this.el as HTMLElement,\n      MUTABLE_ATTRIBUTES\n    );\n\n    if (this.readonly) {\n      this.maxValueExceeded = false;\n      this.minValueUnattained = false;\n    }\n\n    addFormResetListener(this.el as HTMLElement, this.handleFormReset);\n\n    removeDisabledFalse(this.disabled, this.el as HTMLElement);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Text Field\"\n    );\n    if (this.validationInlineInternal) {\n      this.getValidationText.emit({ value: this.validationText });\n    }\n\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, {\n      attributes: true,\n      childList: true,\n    });\n\n    if (this.autofocus && !this.disabled && !this.readonly) {\n      this.interval = setInterval(this.checkChildHydration, 50);\n    }\n  }\n\n  private checkChildHydration = () => {\n    if (\n      this.hideLabel ||\n      this.el.shadowRoot\n        ?.querySelector(\"ic-typography\")\n        ?.classList.contains(\"hydrated\")\n    ) {\n      this.setFocus();\n      clearInterval(this.interval);\n    }\n  };\n\n  @Listen(\"keydown\", {})\n  handleKeyDown(ev: KeyboardEvent): void {\n    this.icKeydown.emit({\n      event: ev,\n      cursorPosition: this.inputEl.selectionStart ?? 0,\n      selectionEnd: this.inputEl.selectionEnd ?? 0,\n    });\n\n    if (!ev.ctrlKey && !IGNORED_KEYBOARD_CHARACTERS.includes(ev.key)) {\n      this.maxCharactersWarning = this.maxCharactersReached;\n    }\n  }\n\n  /**\n   * Sets focus on the native `input`.\n   */\n\n  @Method()\n  async setFocus(): Promise<void> {\n    this.inputEl?.focus();\n  }\n\n  private getNumberOfCharacters = (value: string) =>\n    value !== null && value !== undefined ? value.length : 0;\n\n  private getMaxValueExceeded = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    if (this.type === \"number\") {\n      this.minValueUnattained = !!value && Number(value) < Number(this.min);\n      this.maxValueExceeded = Number(value) > Number(this.max);\n    }\n  };\n\n  private getMaxCharactersReached = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    this.maxCharactersReached =\n      this.maxCharacters > 0 && this.numChars >= this.maxCharacters;\n\n    if (this.maxCharactersWarning && !this.maxCharactersReached) {\n      this.maxCharactersWarning = false;\n    }\n  };\n\n  private onInput = (ev: Event) => {\n    this.value = (ev.target as HTMLInputElement).value;\n    this.icInput.emit({ value: this.value });\n  };\n\n  private onBlur = (ev: Event) => {\n    const target = ev.target as HTMLInputElement;\n    target.removeEventListener(\"wheel\", this.onWheel);\n    const { value } = target;\n    this.numChars = value.length;\n    this.minCharactersUnattained =\n      this.minCharacters > 0 && this.numChars < this.minCharacters;\n    this.icBlur.emit({ value });\n    this.isFocussed = false;\n  };\n\n  private onFocus = (ev: Event) => {\n    const target = ev.target as HTMLInputElement;\n    target.addEventListener(\"wheel\", this.onWheel);\n    this.icFocus.emit({ value: target.value });\n    this.isFocussed = true;\n  };\n\n  private onTextAreaScroll = () => {\n    this.icScroll.emit();\n  };\n\n  private onWheel = (ev: WheelEvent) => {\n    const target = ev.target as HTMLInputElement;\n    if (target.type === \"number\") {\n      target.blur();\n      setTimeout(() => {\n        target.focus();\n      }, 0);\n    }\n  };\n\n  private hasStatus = (status: IcInformationStatusOrEmpty) =>\n    status !== \"\" && !this.disabled;\n\n  private handleFormReset = (): void => {\n    this.value = this.initialValue;\n  };\n\n  private showValidationMargin = (): boolean => {\n    const maxNumChars = this.readonly ? 0 : this.maxCharacters;\n    const emptyString =\n      isEmptyString(this.validationStatus) ||\n      isEmptyString(this.validationText);\n    const valueOutsideRange = this.minValueUnattained || this.maxValueExceeded;\n    const charsOutsideRange = maxNumChars > 0 || this.minCharactersUnattained;\n    return (\n      (!emptyString || valueOutsideRange || charsOutsideRange) &&\n      !this.validationInlineInternal\n    );\n  };\n\n  // triggered when attributes of host element change\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(\n      ({ attributeName, type, addedNodes, removedNodes }) => {\n        if (attributeName && MUTABLE_ATTRIBUTES.includes(attributeName)) {\n          const attribute = this.el.getAttribute(attributeName);\n          if (attribute) {\n            this.inheritedAttributes[attributeName] = attribute;\n          }\n          forceComponentUpdate = true;\n        } else if (type === \"childList\") {\n          forceComponentUpdate = checkSlotInChildMutations(\n            addedNodes,\n            removedNodes,\n            \"icon\"\n          );\n        }\n      }\n    );\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  render() {\n    const {\n      inputId,\n      name,\n      label,\n      required,\n      size,\n      placeholder,\n      helperText,\n      hideCharCount,\n      rows,\n      resize,\n      disabled,\n      value,\n      min,\n      max,\n      numChars,\n      readonly,\n      maxCharacters,\n      maxCharactersMessage,\n      maxCharactersWarning,\n      maxCharactersReached,\n      maxMessage,\n      minCharacters,\n      minCharactersMessage,\n      minCharactersUnattained,\n      minMessage,\n      minValueUnattained,\n      maxValueExceeded,\n      validationAriaLive,\n      validationStatus,\n      validationText,\n      validationInline,\n      validationInlineInternal,\n      spellcheck,\n      inputmode,\n      fullWidth,\n      truncateValue,\n      hiddenInput,\n      theme,\n      hideLabel,\n      type,\n      autocapitalize,\n      ariaActiveDescendant,\n      inheritedAttributes,\n      ariaExpanded,\n      ariaOwns,\n      autocomplete,\n      role,\n      isFocussed,\n    } = this;\n\n    const el = this.el as HTMLElement;\n\n    const disabledMode = readonly || disabled;\n\n    const currentStatus =\n      maxValueExceeded ||\n      minValueUnattained ||\n      minCharactersUnattained ||\n      maxCharactersWarning\n        ? maxCharactersWarning\n          ? IcInformationStatus.Warning\n          : IcInformationStatus.Error\n        : validationStatus;\n\n    const currentValidationText = maxCharactersWarning\n      ? maxCharactersMessage\n      : maxValueExceeded\n      ? maxMessage\n      : minValueUnattained\n      ? minMessage\n      : minCharactersUnattained\n      ? minCharactersMessage\n      : validationText;\n\n    const maxNumChars = readonly ? 0 : maxCharacters;\n    const messageAriaLive =\n      validationAriaLive === \"default\"\n        ? maxCharactersWarning ||\n          maxValueExceeded ||\n          minValueUnattained ||\n          currentStatus === IcInformationStatus.Error\n          ? \"assertive\"\n          : \"polite\"\n        : validationAriaLive;\n\n    const showStatusText =\n      this.hasStatus(currentStatus) &&\n      !(currentStatus == IcInformationStatus.Success && validationInline) &&\n      !validationInlineInternal;\n\n    const multiline = rows > 1;\n\n    const hiddenCharCountDescId =\n      maxCharacters > 0 ? `${inputId}-char-count-desc` : \"\";\n\n    const charsRemaining = maxNumChars - numChars;\n    const remainingCharCountDescId =\n      maxCharacters > 0 ? `${inputId}-remaining-char-count-desc` : \"\";\n    const remainingCharCountDesc = `${charsRemaining} character${\n      charsRemaining === 1 ? \"\" : \"s\"\n    } remaining.`;\n\n    const describedBy = `${hiddenCharCountDescId} ${\n      numChars > 0 ? remainingCharCountDescId : \"\"\n    } ${getInputDescribedByText(\n      this.el,\n      inputId,\n      helperText !== \"\",\n      showStatusText\n    )}`.trim();\n\n    const disabledText = disabledMode && !readonly;\n    const showLeftIcon =\n      !!this.el.querySelector(`[slot=\"icon\"]`) && !disabledText;\n\n    const invalid = `${currentStatus === IcInformationStatus.Error}`;\n\n    hiddenInput\n      ? renderHiddenInput(this.el as HTMLElement, value, name, disabledMode)\n      : removeHiddenInput(this.el as HTMLElement);\n\n    return (\n      <Host\n        class={{\n          \"ic-text-field-full-width\": fullWidth,\n          \"ic-text-field-disabled\": disabledMode,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <ic-input-container readonly={readonly} disabled={disabledMode}>\n          {!hideLabel && (\n            <ic-input-label\n              for={inputId}\n              label={label}\n              helperText={helperText}\n              required={required}\n              disabled={disabledText}\n              readonly={readonly}\n            >\n              <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n            </ic-input-label>\n          )}\n\n          <ic-input-component-container\n            size={size}\n            validationStatus={currentStatus}\n            multiLine={multiline}\n            disabled={disabledMode}\n            readonly={readonly}\n            validationInline={validationInline}\n            fullWidth={fullWidth}\n          >\n            {showLeftIcon && (\n              <span\n                class={{\n                  readonly,\n                  \"has-value\": this.getNumberOfCharacters(value) > 0,\n                }}\n                slot=\"left-icon\"\n              >\n                <slot name=\"icon\" />\n              </span>\n            )}\n\n            {!multiline ? (\n              <input\n                id={inputId}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLInputElement)}\n                type={type}\n                min={min}\n                max={max}\n                value={value}\n                class={{\n                  \"no-left-pad\": !showLeftIcon && readonly,\n                  readonly,\n                  \"truncate-value\": truncateValue,\n                }}\n                placeholder={placeholder ? placeholder : \"\"}\n                required={required}\n                disabled={disabledMode}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                aria-activedescendant={ariaActiveDescendant}\n                aria-expanded={ariaExpanded}\n                aria-owns={ariaOwns}\n                autocomplete={autocomplete}\n                autocapitalize={autocapitalize}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                role={role || undefined}\n                maxlength={maxCharactersReached ? maxCharacters : undefined}\n                minlength={minCharactersUnattained ? minCharacters : undefined}\n                {...inheritedAttributes}\n              ></input>\n            ) : (\n              <textarea\n                id={inputId}\n                class={{\n                  \"no-resize\": resize === false || !!readonly,\n                  \"no-left-pad\": !showLeftIcon && !!readonly,\n                  readonly: !!readonly,\n                }}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLTextAreaElement)}\n                value={value}\n                rows={rows}\n                required={required}\n                disabled={disabledMode}\n                placeholder={placeholder}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                onScroll={this.onTextAreaScroll}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                autocomplete={autocomplete}\n                autocapitalize={autocapitalize}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                maxlength={maxCharactersReached ? maxCharacters : undefined}\n                minlength={minCharactersUnattained ? minCharacters : undefined}\n                {...inheritedAttributes}\n              ></textarea>\n            )}\n            {isSlotUsed(el, \"clear-button\") && (\n              <slot name=\"clear-button\"></slot>\n            )}\n            {isSlotUsed(el, \"search-submit-button\") && (\n              <slot name=\"search-submit-button\"></slot>\n            )}\n          </ic-input-component-container>\n          {isSlotUsed(el, \"menu\") && <slot name=\"menu\"></slot>}\n          <ic-input-validation\n            class={{ \"show-validation\": this.showValidationMargin() }}\n            status={\n              this.hasStatus(currentStatus) === false ||\n              (currentStatus === IcInformationStatus.Success &&\n                validationInline) ||\n              validationInlineInternal\n                ? \"\"\n                : currentStatus\n            }\n            message={showStatusText ? currentValidationText : \"\"}\n            ariaLiveMode={messageAriaLive}\n            for={inputId}\n            fullWidth={fullWidth}\n          >\n            {!readonly && maxNumChars > 0 && (\n              <div slot=\"validation-message-adornment\">\n                {!hideCharCount && (\n                  <ic-typography variant=\"caption\" class=\"char-count-text\">\n                    <span class=\"char-count\">\n                      {numChars}/{maxNumChars}\n                    </span>\n                  </ic-typography>\n                )}\n                <span\n                  class=\"remaining-char-count-desc\"\n                  aria-live=\"polite\"\n                  hidden={!isFocussed}\n                  id={remainingCharCountDescId}\n                >\n                  {remainingCharCountDesc}\n                </span>\n                <span hidden={true} id={hiddenCharCountDescId}>\n                  Field can contain a maximum of {maxNumChars} characters.\n                </span>\n              </div>\n            )}\n          </ic-input-validation>\n        </ic-input-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/{p-cc00cbce.entry.js → p-6e61c48a.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as a,H as i,g as e}from"./p-8e4e97b4.js";import{o as l,S as r,T as o,J as n}from"./p-b57e59b7.js";import{w as s,g as c,s as p}from"./p-bddf799a.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs);--ic-typography-color:var(\n    --ic-input-label-text-color,\n    var(--ic-color-text-primary)\n  )}ic-input-label.with-helper{margin-bottom:0}ic-input-label.ic-input-label-readonly{--ic-typography-color:var(--ic-input-label-readonly-typography-color)}ic-input-label .helpertext,ic-input-label .helpertext ::slotted(*){margin-top:var(--ic-space-xxxs);padding-bottom:var(--ic-input-label-helpertext-padding, 0);--ic-typography-color:var(\n    --ic-input-label-helper-text-color,\n    var(--ic-color-text-secondary)\n  )}ic-input-label .helpertext-normal{--ic-typography-color:var(\n    --ic-input-label-helper-text-color,\n    var(--ic-color-text-secondary)\n  )}ic-input-label .helpertext-readonly{--ic-typography-color:var(--ic-input-label-readonly-helpertext-color)}ic-input-label .readonly-label{--ic-typography-color:var(--ic-input-label-readonly-label-color)}ic-input-label .error-label{--ic-typography-color:var(--ic-input-label-error-label-color)}";const u=d;const h=class{constructor(a){t(this,a);this.disabled=false;this.helperText="";this.hideLabel=false;this.readonly=false;this.required=false;this.status="";this.useLabelTag=true;this.isHelperTextSlotUsed=t=>{const a=t===null||t===void 0?void 0:t.assignedElements();if(a&&a.length){for(const t of a){if(t.tagName==="SLOT"){if(this.isHelperTextSlotUsed(t)){return true}}else{return true}}}return false}}componentDidLoad(){l([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:e,label:l,required:o,helperText:n,status:s,hideLabel:c,useLabelTag:p}=this;const d=o?l+" *":l;const u=this.for&&r(this.for);const h={helpertext:true,"helpertext-normal":!t&&!e,"helpertext-readonly":e};const b=this.el.querySelector("slot[name='helper-text']");return a(i,{key:"b4ae951684bc9fbacd077fd7586a60a680cb1114",class:{"ic-input-label-disabled":!!t,"ic-input-label-readonly":e,"with-helper":this.isHelperTextSlotUsed(b)||n!==""}},!c&&a("ic-typography",{key:"dd5d6d73707aadd9cc59225224fffadefecda9c7",variant:"label",class:{"readonly-label":e,"error-label":s==="error"&&!(e||t)}},e||!p?`${d}`:a("label",{htmlFor:this.for},d)),this.isHelperTextSlotUsed(b)?a("span",{id:u,class:h},a("slot",{name:"helper-text"})):n!==""&&a("ic-typography",{variant:"caption",class:h},a("span",{id:u},n)))}get el(){return e(this)}};h.style=u;const b="ic-input-validation{width:var(--input-width, 20rem);display:flex}ic-input-validation.ic-input-validation-with-status{margin-top:var(--ic-space-xs)}ic-input-validation.ic-input-validation-full-width{width:100%}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-input-validation-success-icon-color)}ic-input-validation span.icon-error>svg{fill:var(--ic-input-validation-error, var(--ic-atoms-status-icon-error))}ic-input-validation span.icon-warning>svg{fill:var(--ic-input-validation-warning-icon-color)}ic-input-validation .statustext{flex-grow:1;color:var(\n    --ic-input-validation-status-text-color,\n    var(--ic-color-text-primary)\n  );--ic-typography-color:var(\n    --ic-input-validation-status-text-color,\n    var(--ic-color-text-primary)\n  )}ic-input-validation .sr-only{position:absolute;left:-9999px}";const v=b;const y={[n.Warning]:s,[n.Error]:c,[n.Success]:p};const f="​";const g=class{constructor(a){t(this,a);this.ariaLiveMode="polite";this.fullWidth=false;this.status=""}watchMessageHandler(t){this.messageEl.textContent=f;setTimeout((()=>{this.messageEl.textContent=t}),200)}componentDidLoad(){l([{prop:this.message,propName:"message"}],"Input Validation");this.messageEl.textContent=f}render(){const{ariaLiveMode:t,fullWidth:e,status:l,message:r}=this;const n=l!==""?y[l]:"";return a(i,{key:"f1ba7e992a65cbd63d86411844668a0db4944cf2",class:{[`ic-input-validation-${l}`]:l!=="","ic-input-validation-full-width":!!e,"ic-input-validation-with-status":l!==""}},n!==""&&a("span",{key:"43bf05c319e9f4cdb7f6e5affd403d745b7dac00",class:{"status-icon":true,[`icon-${l}`]:true},innerHTML:n}),a("ic-typography",{key:"8d0f570e79158d1add1410653c8bbdb5e052aaa3",variant:"caption",class:"statustext"},a("span",{key:"c363e60a30ef571a63779ed77a7e4e8358444d5f",id:this.for&&o(this.for)},r),a("span",{key:"53959e2fb2d6b51aaa5eca1f9526f0a6e55b5bea",ref:t=>this.messageEl=t,class:"sr-only","aria-live":t})),a("slot",{key:"861c3d827e89d6e4c917cb6d584e7d3ec6a5c27a",name:"validation-message-adornment"}))}get el(){return e(this)}static get watchers(){return{message:["watchMessageHandler"]}}};g.style=v;export{h as ic_input_label,g as ic_input_validation};
-//# sourceMappingURL=p-cc00cbce.entry.js.map
+import{r as t,h as a,H as i,g as e}from"./p-8e4e97b4.js";import{o as l,S as r,T as o,K as n}from"./p-a5658054.js";import{w as s,g as c,s as p}from"./p-bddf799a.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs);--ic-typography-color:var(\n    --ic-input-label-text-color,\n    var(--ic-color-text-primary)\n  )}ic-input-label.with-helper{margin-bottom:0}ic-input-label.ic-input-label-readonly{--ic-typography-color:var(--ic-input-label-readonly-typography-color)}ic-input-label .helpertext,ic-input-label .helpertext ::slotted(*){margin-top:var(--ic-space-xxxs);padding-bottom:var(--ic-input-label-helpertext-padding, 0);--ic-typography-color:var(\n    --ic-input-label-helper-text-color,\n    var(--ic-color-text-secondary)\n  )}ic-input-label .helpertext-normal{--ic-typography-color:var(\n    --ic-input-label-helper-text-color,\n    var(--ic-color-text-secondary)\n  )}ic-input-label .helpertext-readonly{--ic-typography-color:var(--ic-input-label-readonly-helpertext-color)}ic-input-label .readonly-label{--ic-typography-color:var(--ic-input-label-readonly-label-color)}ic-input-label .error-label{--ic-typography-color:var(--ic-input-label-error-label-color)}";const u=d;const h=class{constructor(a){t(this,a);this.disabled=false;this.helperText="";this.hideLabel=false;this.readonly=false;this.required=false;this.status="";this.useLabelTag=true;this.isHelperTextSlotUsed=t=>{const a=t===null||t===void 0?void 0:t.assignedElements();if(a&&a.length){for(const t of a){if(t.tagName==="SLOT"){if(this.isHelperTextSlotUsed(t)){return true}}else{return true}}}return false}}componentDidLoad(){l([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:e,label:l,required:o,helperText:n,status:s,hideLabel:c,useLabelTag:p}=this;const d=o?l+" *":l;const u=this.for&&r(this.for);const h={helpertext:true,"helpertext-normal":!t&&!e,"helpertext-readonly":e};const b=this.el.querySelector("slot[name='helper-text']");return a(i,{key:"632235f5528b1ee7cbdc981b1fd8f83f81317ac5",class:{"ic-input-label-disabled":!!t,"ic-input-label-readonly":e,"with-helper":this.isHelperTextSlotUsed(b)||n!==""}},!c&&a("ic-typography",{key:"4d5ffe88dcfd61697ac5c10bbfe72da69d6cd09e",variant:"label",class:{"readonly-label":e,"error-label":s==="error"&&!(e||t)}},e||!p?`${d}`:a("label",{htmlFor:this.for},d)),this.isHelperTextSlotUsed(b)?a("span",{id:u,class:h},a("slot",{name:"helper-text"})):n!==""&&a("ic-typography",{variant:"caption",class:h},a("span",{id:u},n)))}get el(){return e(this)}};h.style=u;const b="ic-input-validation{width:var(--input-width, 20rem);display:flex}ic-input-validation.ic-input-validation-with-status{margin-top:var(--ic-space-xs)}ic-input-validation.ic-input-validation-full-width{width:100%}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-input-validation-success-icon-color)}ic-input-validation span.icon-error>svg{fill:var(--ic-input-validation-error, var(--ic-atoms-status-icon-error))}ic-input-validation span.icon-warning>svg{fill:var(--ic-input-validation-warning-icon-color)}ic-input-validation .statustext{flex-grow:1;color:var(\n    --ic-input-validation-status-text-color,\n    var(--ic-color-text-primary)\n  );--ic-typography-color:var(\n    --ic-input-validation-status-text-color,\n    var(--ic-color-text-primary)\n  )}ic-input-validation .sr-only{position:absolute;left:-9999px}";const v=b;const y={[n.Warning]:s,[n.Error]:c,[n.Success]:p};const f="​";const g=class{constructor(a){t(this,a);this.ariaLiveMode="polite";this.fullWidth=false;this.status=""}watchMessageHandler(t){this.messageEl.textContent=f;setTimeout((()=>{this.messageEl.textContent=t}),200)}componentDidLoad(){l([{prop:this.message,propName:"message"}],"Input Validation");this.messageEl.textContent=f}render(){const{ariaLiveMode:t,fullWidth:e,status:l,message:r}=this;const n=l!==""?y[l]:"";return a(i,{key:"71585fc1ea14fdb61bb1557d2da4df16b26cfc0d",class:{[`ic-input-validation-${l}`]:l!=="","ic-input-validation-full-width":!!e,"ic-input-validation-with-status":l!==""}},n!==""&&a("span",{key:"4cbb1c03f511ea994a7ef9af769bd1040d9a4b26",class:{"status-icon":true,[`icon-${l}`]:true},innerHTML:n}),a("ic-typography",{key:"89de4e97c599c21ab5d28fb5d2cad72af25d0142",variant:"caption",class:"statustext"},a("span",{key:"ea899c6c80ca2036ab6388f7814ea5022b9681b3",id:this.for&&o(this.for)},r),a("span",{key:"f77fea85dda248f4e1b0d1cb4ee390926fe67116",ref:t=>this.messageEl=t,class:"sr-only","aria-live":t})),a("slot",{key:"39452a262baec0db33f97951762ddc6b1e33b26b",name:"validation-message-adornment"}))}get el(){return e(this)}static get watchers(){return{message:["watchMessageHandler"]}}};g.style=v;export{h as ic_input_label,g as ic_input_validation};
+//# sourceMappingURL=p-6e61c48a.entry.js.map