@esri/calcite-components 2.8.0-next.1 → 2.8.0-next.2

package/dist/calcite/p-de8d5e97.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["CSS","container","content","tabCss","CalciteTabStyle0","Tab","this","guid","render","id","el","h","Host","key","labeledBy","class","scale","role","tabIndex","selected","connectedCallback","parentTabsEl","closest","componentDidLoad","calciteInternalTabRegister","emit","disconnectedCallback","document","body","dispatchEvent","CustomEvent","detail","internalTabChangeHandler","event","targetTabsEl","composedPath","find","tagName","tab","getTabIndex","then","index","stopPropagation","Array","prototype","indexOf","call","nodeListToArray","parentElement","children","filter","matches","updateAriaInfo","tabIds","titleIds","ICON","chevronRight","chevronLeft","activeIndicatorContainer","containerHasEndTabTitleOverflow","containerHasStartTabTitleOverflow","scrollButton","scrollButtonContainer","scrollBackwardContainerButton","scrollForwardContainerButton","tabTitleSlotWrapper","tabNavCss","CalciteTabNavStyle0","TabNav","effectiveDir","lastScrollWheelAxis","resizeObserver","createObserver","updateScrollingState","activeIndicatorEl","updateActiveIndicator","onTabTitleWheel","preventDefault","deltaX","deltaY","x","Math","abs","y","scrollBy","scrollByX","currentTarget","requestAnimationFrame","onSlotChange","intersectionObserver","disconnect","slottedChildren","target","assignedElements","forEach","child","observe","storeContainerRef","containerEl","storeTabTitleWrapperRef","tabTitleContainerEl","root","threshold","scrollToTabTitles","direction","readTask","tabTitleContainer","containerBounds","getBoundingClientRect","tabTitles","from","querySelectorAll","reverse","closestToEdge","tabTitle","tabTitleBounds","containerEndX","width","tabTitleEndX","afterContainerEnd","crossingContainerEnd","beforeContainerStart","crossingContainerStart","scrollerButtonWidth","offsetAdjustment","offsetWidth","clientWidth","scrollTo","offsetLeft","left","behavior","scrollToNextTabTitles","scrollToPreviousTabTitles","handleTabFocus","destination","focused","focusElementInGroup","enabledTabTitles","scrollTabTitleIntoView","onTabTitleScroll","renderScrollButton","overflowDirection","bordered","messages","hasOverflowingStartTabTitle","hasOverflowingEndTabTitle","isEnd","hidden","appearance","nextTabTitles","previousTabTitles","iconFlipRtl","iconStart","kind","onClick","onMessagesChange","selectedTabIdChanged","localStorage","storageId","selectedTabId","undefined","setItem","JSON","stringify","calciteInternalTabChange","selectedTitle","getTabTitleById","selectedTitleChanged","connectLocalized","connectMessages","componentWillLoad","storageKey","getItem","storedTab","parse","setUpMessages","componentWillRender","layout","getElementDir","componentDidRender","length","every","title","getTabIdentifier","disconnectLocalized","disconnectMessages","indicatorWidth","offset","indicatorOffset","indicatorStyle","right","position","CSS_UTILITY","rtl","ref","onScroll","onWheel","onSlotchange","activeIndicatorContainerEl","style","focusPreviousTabHandler","focusNextTabHandler","focusFirstTabHandler","focusLastTabHandler","internalActivateTabHandler","activatedTabTitle","getIndexOfTabTitle","isLTR","scrollPosition","scrollLeft","overflowingStartTabTitle","overflowingEndTabTitle","activateTabHandler","calciteTabChange","internalCloseTabHandler","closedTabTitleEl","handleTabTitleClose","updateTabTitles","globalInternalTabChangeHandler","syncId","iconStartChangeHandler","effectiveLocaleChange","updateMessages","effectiveLocale","parseInt","calciteSize24","calciteSize32","calciteSize44","tabTitleScrollLeft","containerScrollLeft","navWidth","tabLeft","tabWidth","offsetRight","offsetBase","multiplier","isOverflowStart","isOverflowEnd","visibleWidth","totalContentWidth","scrollWidth","Promise","all","map","ids","filterDirectChildren","closed","selectionModified","visibleTabTitlesIndices","reduce","tabTitleIndices","totalVisibleTabTitles","closable","activateTab","closedTabTitleIndex","findIndex","nextTabTitleIndex","value","focus","closeButton","contentHasText","iconEnd","iconPresent","titleIcon","ICONS","close","tabTitleCss","CalciteTabTitleStyle0","TabTitle","closeClickHandler","closeTabTitleAndNotify","mutationObserver","updateHasText","calciteInternalTabIconChanged","selectedHandler","connectInteractive","setupTextContentObserver","parentTabNavEl","disconnectInteractive","iconStartEl","flipRtl","icon","getIconScale","iconEndEl","controls","toAriaBoolean","disabled","InteractiveContainer","hasText","renderCloseButton","type","closeButtonEl","calciteInternalTabTitleRegister","updateHostInteraction","keyDownHandler","includes","calciteInternalTabsFocusNext","calciteInternalTabsFocusPrevious","calciteInternalTabsFocusFirst","calciteInternalTabsFocusLast","userTriggered","payload","calciteInternalTabsActivate","calciteTabsActivate","textContent","trim","childList","subtree","calciteInternalTabsClose","calciteTabsClose","SLOTS","titleGroup","tabsCss","CalciteTabsStyle0","Tabs","mutationsList","mutation","nodeName","updateItems","handleInheritableProps","Fragment","name","titles","registryHandler","calciteTabTitleUnregister","tabs","calciteTabUnregister","nav","querySelector","some","sort","a","b","localeCompare","tabDomIndexes","titleDomIndexes","indexInDOM","registryIndex"],"sources":["src/components/tab/resources.ts","src/components/tab/tab.scss?tag=calcite-tab&encapsulation=shadow","src/components/tab/tab.tsx","src/components/tab-nav/resources.ts","src/components/tab-nav/tab-nav.scss?tag=calcite-tab-nav&encapsulation=shadow","src/components/tab-nav/tab-nav.tsx","src/components/tab-title/resources.ts","src/components/tab-title/tab-title.scss?tag=calcite-tab-title&encapsulation=shadow","src/components/tab-title/tab-title.tsx","src/components/tabs/resources.ts","src/components/tabs/tabs.scss?tag=calcite-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  content: \"content\",\n};\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-tab-content-block-padding: Specifies the block padding of the component's content in the `default` slot.\n */\n\n:host([selected]) {\n  section,\n  .container {\n    @apply block;\n  }\n}\n\n:host {\n  @apply hidden h-full w-full;\n}\n\n:host([selected]) {\n  @apply block h-full w-full overflow-auto;\n}\n\n.content {\n  @apply box-border;\n  padding-block: var(--calcite-internal-tab-content-block-padding);\n}\n\n.scale-s {\n  --calcite-internal-tab-content-block-padding: var(--calcite-tab-content-block-padding, theme(\"spacing.1\"));\n  @apply text-n2h;\n}\n\n.scale-m {\n  --calcite-internal-tab-content-block-padding: var(--calcite-tab-content-block-padding, theme(\"spacing.2\"));\n  @apply text-n1h;\n}\n\n.scale-l {\n  --calcite-internal-tab-content-block-padding: var(--calcite-tab-content-block-padding, theme(\"spacing.[2.5]\"));\n  @apply text-0h;\n}\n\nsection,\n.container {\n  @apply hidden h-full w-full;\n}\n\n.container {\n  @apply focus-base;\n\n  &:focus {\n    @apply focus-inset;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n} from \"@stencil/core\";\nimport { nodeListToArray } from \"../../utils/dom\";\nimport { guid } from \"../../utils/guid\";\nimport { Scale } from \"../interfaces\";\nimport { CSS } from \"./resources\";\nimport { TabChangeEventDetail } from \"./interfaces\";\n\n/**\n * @slot - A slot for adding custom content.\n */\n@Component({\n  tag: \"calcite-tab\",\n  styleUrl: \"tab.scss\",\n  shadow: true,\n})\nexport class Tab {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Specifies a unique name for the component.\n   *\n   * When specified, use the same value on the `calcite-tab-title`.\n   */\n  @Prop({ reflect: true }) tab: string;\n\n  /**\n   * When `true`, the component's contents are selected.\n   *\n   * Only one tab can be selected within the `calcite-tabs` parent.\n   */\n  @Prop({ reflect: true, mutable: true }) selected = false;\n\n  /**\n   * Specifies the size of the component inherited from the parent `calcite-tabs`, defaults to `m`.\n   *\n   * @internal\n   */\n  @Prop() scale: Scale = \"m\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const id = this.el.id || this.guid;\n\n    return (\n      <Host aria-labelledby={this.labeledBy} id={id}>\n        <div\n          class={{ [CSS.container]: true, [`scale-${this.scale}`]: true }}\n          role=\"tabpanel\"\n          tabIndex={this.selected ? 0 : -1}\n        >\n          <section class={CSS.content}>\n            <slot />\n          </section>\n        </div>\n      </Host>\n    );\n  }\n\n  connectedCallback(): void {\n    this.parentTabsEl = this.el.closest(\"calcite-tabs\");\n  }\n\n  componentDidLoad(): void {\n    this.calciteInternalTabRegister.emit();\n  }\n\n  disconnectedCallback(): void {\n    // Dispatching to body in order to be listened by other elements that are still connected to the DOM.\n    document.body?.dispatchEvent(\n      new CustomEvent(\"calciteTabUnregister\", {\n        detail: this.el,\n      }),\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabRegister: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalTabChange\", { target: \"body\" })\n  internalTabChangeHandler(event: CustomEvent<TabChangeEventDetail>): void {\n    const targetTabsEl = event\n      .composedPath()\n      .find((el: HTMLElement) => el.tagName === \"CALCITE-TABS\");\n\n    // to allow `<calcite-tabs>` to be nested we need to make sure this\n    // `calciteTabChange` event was actually fired from a within the same\n    // `<calcite-tabs>` that is the a parent of this tab.\n    if (targetTabsEl !== this.parentTabsEl) {\n      return;\n    }\n\n    if (this.tab) {\n      this.selected = this.tab === event.detail.tab;\n    } else {\n      this.getTabIndex().then((index) => {\n        this.selected = index === event.detail.tab;\n      });\n    }\n    event.stopPropagation();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Returns the index of the component item within the tab array.\n   */\n  @Method()\n  async getTabIndex(): Promise<number> {\n    return Array.prototype.indexOf.call(\n      nodeListToArray(this.el.parentElement.children).filter((el) => el.matches(\"calcite-tab\")),\n      this.el,\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTabElement;\n\n  parentTabsEl: HTMLCalciteTabsElement;\n\n  guid = `calcite-tab-title-${guid()}`;\n\n  @State() labeledBy: string;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * @param tabIds\n   * @param titleIds\n   * @internal\n   */\n  @Method()\n  async updateAriaInfo(tabIds: string[] = [], titleIds: string[] = []): Promise<void> {\n    this.labeledBy = titleIds[tabIds.indexOf(this.el.id)] || null;\n  }\n}\n","export const ICON = {\n  chevronRight: \"chevron-right\",\n  chevronLeft: \"chevron-left\",\n};\n\nexport const CSS = {\n  activeIndicatorContainer: \"tab-nav-active-indicator-container\",\n  container: \"tab-nav\",\n  containerHasEndTabTitleOverflow: \"tab-nav--end-overflow\",\n  containerHasStartTabTitleOverflow: \"tab-nav--start-overflow\",\n  scrollButton: \"scroll-button\",\n  scrollButtonContainer: \"scroll-button-container\",\n  scrollBackwardContainerButton: \"scroll-button-container--backward\",\n  scrollForwardContainerButton: \"scroll-button-container--forward\",\n  tabTitleSlotWrapper: \"tab-titles-slot-wrapper\",\n};\n",":host {\n  --calcite-internal-tab-nav-gradient-start-side: left;\n  --calcite-internal-tab-nav-gradient-end-side: right;\n\n  @apply relative flex;\n}\n\n.scale-s {\n  --calcite-internal-tab-nav-scroller-button-width: #{$calcite-size-24};\n  min-block-size: theme(\"spacing.6\");\n}\n\n.scale-m {\n  --calcite-internal-tab-nav-scroller-button-width: #{$calcite-size-32};\n  min-block-size: theme(\"spacing.8\");\n}\n\n.scale-l {\n  --calcite-internal-tab-nav-scroller-button-width: #{$calcite-size-44};\n  min-block-size: theme(\"spacing.11\");\n}\n\n.calcite--rtl {\n  --calcite-internal-tab-nav-gradient-start-side: right;\n  --calcite-internal-tab-nav-gradient-end-side: left;\n}\n\n$last-mask-color-stop-position: 51%; // we go beyond the half point to ensure the mask color stops overlap when both start and end are overflowing\n\n.tab-nav--start-overflow {\n  .tab-nav-active-indicator-container,\n  .tab-titles-slot-wrapper {\n    mask-image: linear-gradient(\n      to var(--calcite-internal-tab-nav-gradient-end-side),\n      transparent,\n      transparent var(--calcite-internal-tab-nav-scroller-button-width),\n      white var(--calcite-internal-tab-nav-scroller-button-width),\n      white $last-mask-color-stop-position\n    );\n  }\n}\n\n.tab-nav--end-overflow {\n  .tab-nav-active-indicator-container,\n  .tab-titles-slot-wrapper {\n    mask-image: linear-gradient(\n      to var(--calcite-internal-tab-nav-gradient-start-side),\n      transparent,\n      transparent var(--calcite-internal-tab-nav-scroller-button-width),\n      white var(--calcite-internal-tab-nav-scroller-button-width),\n      white $last-mask-color-stop-position\n    );\n  }\n}\n\n.tab-nav--start-overflow.tab-nav--end-overflow {\n  .tab-nav-active-indicator-container,\n  .tab-titles-slot-wrapper {\n    mask-image: linear-gradient(\n        to var(--calcite-internal-tab-nav-gradient-end-side),\n        transparent,\n        transparent var(--calcite-internal-tab-nav-scroller-button-width),\n        white var(--calcite-internal-tab-nav-scroller-button-width),\n        white $last-mask-color-stop-position,\n        transparent $last-mask-color-stop-position\n      ),\n      linear-gradient(\n        to var(--calcite-internal-tab-nav-gradient-start-side),\n        transparent,\n        transparent var(--calcite-internal-tab-nav-scroller-button-width),\n        white var(--calcite-internal-tab-nav-scroller-button-width),\n        white $last-mask-color-stop-position,\n        transparent $last-mask-color-stop-position\n      );\n  }\n}\n\n.tab-nav::-webkit-scrollbar {\n  display: none;\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n}\n\n:host([layout=\"center\"]) {\n  ::slotted(calcite-tab-title) {\n    display: flex;\n    flex-grow: 1;\n    flex-shrink: 0;\n    min-inline-size: auto;\n    white-space: nowrap;\n  }\n\n  ::slotted(calcite-tab-title[selected]) {\n    overflow: unset;\n  }\n}\n\n:host(:not([bordered])) {\n  .scale-l {\n    --calcite-internal-tab-nav-gap: var(--calcite-size-xxl);\n  }\n  .scale-m {\n    --calcite-internal-tab-nav-gap: var(--calcite-size-xl);\n  }\n  .scale-s {\n    --calcite-internal-tab-nav-gap: var(--calcite-size-lg);\n  }\n\n  .tab-titles-slot-wrapper {\n    gap: var(--calcite-internal-tab-nav-gap);\n  }\n}\n\n:host([layout=\"center\"]:not([bordered])) {\n  .tab-titles-slot-wrapper {\n    padding-inline: var(--calcite-spacing-xxl);\n  }\n}\n\n.tab-nav,\n.tab-titles-slot-wrapper {\n  @apply flex\n    w-full\n    justify-start\n    whitespace-nowrap\n    overflow-hidden;\n}\n\n// prevent indicator overflow in horizontal scrolling situations\n.tab-nav-active-indicator-container {\n  @apply absolute\n    bottom-0\n    h-0.5\n    inset-x-0\n    overflow-hidden\n    w-full;\n}\n\n.tab-nav-active-indicator {\n  @apply absolute\n    bg-brand\n    bottom-0\n    block\n    h-0.5\n    ease-out\n    transition-all;\n}\n\n.scroll-button-container {\n  @apply absolute bottom-0 top-0;\n\n  calcite-button {\n    --calcite-offset-invert-focus: 1;\n    --calcite-color-text-1: var(--calcite-color-text-3);\n\n    block-size: 100%;\n\n    &:hover {\n      --calcite-color-text-1: unset;\n      --calcite-color-foreground-1: var(--calcite-color-transparent-hover);\n      --calcite-color-foreground-3: var(--calcite-color-transparent);\n    }\n  }\n}\n\n.scroll-button-container--forward {\n  inset-inline-end: 0;\n  z-index: var(--calcite-z-index);\n}\n\n.scroll-button-container--backward {\n  inset-inline-start: 0;\n  z-index: var(--calcite-z-index);\n}\n\n:host(:not([bordered])) {\n  .scroll-button-container--backward,\n  .scroll-button-container--forward {\n    &::before {\n      background-color: var(--calcite-color-border-3);\n      content: \"\";\n      inline-size: var(--calcite-border-width-sm);\n      inset-block-start: var(--calcite-border-width-md);\n      inset-block-end: var(--calcite-border-width-md);\n      position: absolute;\n    }\n  }\n\n  .scroll-button-container--backward::before {\n    inset-inline-end: 0;\n  }\n\n  .scroll-button-container--forward::before {\n    inset-inline-start: 0;\n  }\n}\n\n:host .position-bottom .tab-nav-active-indicator {\n  inset-block-end: unset;\n  @apply top-0;\n}\n\n:host .position-bottom .tab-nav-active-indicator-container {\n  inset-block-end: unset;\n  @apply top-0;\n}\n\n:host([bordered]) .tab-nav-active-indicator-container {\n  inset-block-end: unset; // display active blue line above instead of below\n}\n\n:host([bordered]) .position-bottom .tab-nav-active-indicator-container {\n  inset-block-end: 0; // display active blue line below instead of above\n  inset-block-start: unset;\n}\n\n@media (forced-colors: active) {\n  .tab-nav-active-indicator {\n    background-color: highlight;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  readTask,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  calciteSize24,\n  calciteSize32,\n  calciteSize44,\n} from \"@esri/calcite-design-tokens/dist/es6/core\";\nimport {\n  Direction,\n  filterDirectChildren,\n  focusElementInGroup,\n  FocusElementInGroupDestination,\n  getElementDir,\n} from \"../../utils/dom\";\nimport { createObserver } from \"../../utils/observers\";\nimport { Scale } from \"../interfaces\";\nimport { TabChangeEventDetail, TabCloseEventDetail } from \"../tab/interfaces\";\nimport { TabID, TabLayout, TabPosition } from \"../tabs/interfaces\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { CSS_UTILITY } from \"../../utils/resources\";\nimport { CSS, ICON } from \"./resources\";\nimport { TabNavMessages } from \"./assets/tab-nav/t9n\";\n\n/**\n * @slot - A slot for adding `calcite-tab-title`s.\n */\n@Component({\n  tag: \"calcite-tab-nav\",\n  styleUrl: \"tab-nav.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class TabNav implements LocalizedComponent, T9nComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Specifies the name when saving selected `calcite-tab` data to `localStorage`.\n   */\n  @Prop({ reflect: true }) storageId: string;\n\n  /**\n   * Specifies text to update multiple components to keep in sync if one changes.\n   */\n  @Prop({ reflect: true }) syncId: string;\n\n  /**\n   * Specifies the component's selected `calcite-tab-title`.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedTitle: HTMLCalciteTabTitleElement = null;\n\n  /**\n   * Specifies the size of the component inherited from the parent `calcite-tabs`, defaults to `m`.\n   *\n   * @internal\n   */\n  @Prop() scale: Scale = \"m\";\n\n  /**\n   * @internal\n   */\n  @Prop({ reflect: true, mutable: true }) layout: TabLayout = \"inline\";\n\n  /**\n   * Specifies the position of `calcite-tab-nav` and `calcite-tab-title` components in relation to, and is inherited from the parent `calcite-tabs`, defaults to `top`.\n   *\n   *  @internal\n   */\n  @Prop() position: TabPosition = \"bottom\";\n\n  /**\n   * @internal\n   */\n  @Prop({ reflect: true, mutable: true }) bordered = false;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true }) indicatorOffset: number;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true }) indicatorWidth: number;\n\n  /**\n   * Made into a prop for testing purposes only.\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: TabNavMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<TabNavMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  @Watch(\"selectedTabId\")\n  async selectedTabIdChanged(): Promise<void> {\n    if (\n      localStorage &&\n      this.storageId &&\n      this.selectedTabId !== undefined &&\n      this.selectedTabId !== null\n    ) {\n      localStorage.setItem(`calcite-tab-nav-${this.storageId}`, JSON.stringify(this.selectedTabId));\n    }\n\n    this.calciteInternalTabChange.emit({\n      tab: this.selectedTabId,\n    });\n\n    this.selectedTitle = await this.getTabTitleById(this.selectedTabId);\n  }\n\n  @Watch(\"selectedTitle\")\n  selectedTitleChanged(): void {\n    this.updateActiveIndicator();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.parentTabsEl = this.el.closest(\"calcite-tabs\");\n    this.resizeObserver?.observe(this.el);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    const storageKey = `calcite-tab-nav-${this.storageId}`;\n    if (localStorage && this.storageId && localStorage.getItem(storageKey)) {\n      const storedTab = JSON.parse(localStorage.getItem(storageKey));\n      this.selectedTabId = storedTab;\n    }\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    this.scrollTabTitleIntoView(this.selectedTitle, \"instant\");\n  }\n\n  componentWillRender(): void {\n    const { parentTabsEl } = this;\n\n    this.layout = parentTabsEl?.layout;\n    this.bordered = parentTabsEl?.bordered;\n    this.effectiveDir = getElementDir(this.el);\n\n    if (this.selectedTitle) {\n      this.updateActiveIndicator();\n    }\n  }\n\n  componentDidRender(): void {\n    // if every tab title is active select the first tab.\n    if (\n      this.tabTitles.length &&\n      this.tabTitles.every((title) => !title.selected) &&\n      !this.selectedTabId\n    ) {\n      this.tabTitles[0].getTabIdentifier().then((tab) => {\n        this.calciteInternalTabChange.emit({\n          tab,\n        });\n      });\n    }\n  }\n\n  disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const width = `${this.indicatorWidth}px`;\n    const offset = `${this.indicatorOffset}px`;\n    const indicatorStyle =\n      this.effectiveDir !== \"rtl\" ? { width, left: offset } : { width, right: offset };\n\n    return (\n      <Host role=\"tablist\">\n        <div\n          class={{\n            [CSS.container]: true,\n            [CSS.containerHasStartTabTitleOverflow]: !!this.hasOverflowingStartTabTitle,\n            [CSS.containerHasEndTabTitleOverflow]: !!this.hasOverflowingEndTabTitle,\n            [`scale-${this.scale}`]: true,\n            [`position-${this.position}`]: true,\n            [CSS_UTILITY.rtl]: this.effectiveDir === \"rtl\",\n          }}\n          // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n          ref={this.storeContainerRef}\n        >\n          {this.renderScrollButton(\"start\")}\n          <div\n            class={{\n              [CSS.tabTitleSlotWrapper]: true,\n            }}\n            onScroll={this.onTabTitleScroll}\n            onWheel={this.onTabTitleWheel}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={this.storeTabTitleWrapperRef}\n          >\n            <slot onSlotchange={this.onSlotChange} />\n          </div>\n          <div\n            class={{\n              [CSS.activeIndicatorContainer]: true,\n            }}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={(el) => (this.activeIndicatorContainerEl = el)}\n          >\n            <div\n              class=\"tab-nav-active-indicator\"\n              style={indicatorStyle}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={(el) => (this.activeIndicatorEl = el as HTMLElement)}\n            />\n          </div>\n          {this.renderScrollButton(\"end\")}\n        </div>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalTabsFocusPrevious\")\n  focusPreviousTabHandler(event: CustomEvent): void {\n    this.handleTabFocus(event, event.target as HTMLCalciteTabTitleElement, \"previous\");\n  }\n\n  @Listen(\"calciteInternalTabsFocusNext\")\n  focusNextTabHandler(event: CustomEvent): void {\n    this.handleTabFocus(event, event.target as HTMLCalciteTabTitleElement, \"next\");\n  }\n\n  @Listen(\"calciteInternalTabsFocusFirst\")\n  focusFirstTabHandler(event: CustomEvent): void {\n    this.handleTabFocus(event, event.target as HTMLCalciteTabTitleElement, \"first\");\n  }\n\n  @Listen(\"calciteInternalTabsFocusLast\")\n  focusLastTabHandler(event: CustomEvent): void {\n    this.handleTabFocus(event, event.target as HTMLCalciteTabTitleElement, \"last\");\n  }\n\n  @Listen(\"calciteInternalTabsActivate\")\n  internalActivateTabHandler(event: CustomEvent<TabChangeEventDetail>): void {\n    const activatedTabTitle = event.target as HTMLCalciteTabTitleElement;\n\n    this.selectedTabId = event.detail.tab\n      ? event.detail.tab\n      : this.getIndexOfTabTitle(activatedTabTitle);\n    event.stopPropagation();\n\n    this.scrollTabTitleIntoView(activatedTabTitle);\n  }\n\n  private scrollTabTitleIntoView(\n    activatedTabTitle: HTMLCalciteTabTitleElement,\n    behavior: ScrollBehavior = \"smooth\",\n  ): void {\n    if (!activatedTabTitle) {\n      return;\n    }\n\n    readTask(() => {\n      const isLTR = this.effectiveDir === \"ltr\";\n      const tabTitleContainer = this.tabTitleContainerEl;\n      const containerBounds = tabTitleContainer.getBoundingClientRect();\n      const tabTitleBounds = activatedTabTitle.getBoundingClientRect();\n      const scrollPosition = tabTitleContainer.scrollLeft;\n      const overflowingStartTabTitle = isLTR\n        ? this.hasOverflowingStartTabTitle\n        : this.hasOverflowingEndTabTitle;\n      const overflowingEndTabTitle = isLTR\n        ? this.hasOverflowingEndTabTitle\n        : this.hasOverflowingStartTabTitle;\n\n      if (\n        tabTitleBounds.left <\n        containerBounds.left + (overflowingStartTabTitle ? this.scrollerButtonWidth : 0)\n      ) {\n        const left =\n          scrollPosition + (tabTitleBounds.left - containerBounds.left) - this.scrollerButtonWidth;\n        tabTitleContainer.scrollTo({ left, behavior });\n      } else if (\n        tabTitleBounds.right >\n        containerBounds.right - (overflowingEndTabTitle ? this.scrollerButtonWidth : 0)\n      ) {\n        const left =\n          scrollPosition +\n          (tabTitleBounds.right - containerBounds.right) +\n          this.scrollerButtonWidth;\n        tabTitleContainer.scrollTo({ left, behavior });\n      }\n    });\n  }\n\n  @Listen(\"calciteTabsActivate\")\n  activateTabHandler(event: CustomEvent<void>): void {\n    this.calciteTabChange.emit();\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteInternalTabsClose\")\n  internalCloseTabHandler(event: CustomEvent<TabCloseEventDetail>): void {\n    const closedTabTitleEl = event.target as HTMLCalciteTabTitleElement;\n    this.handleTabTitleClose(closedTabTitleEl);\n    event.stopPropagation();\n  }\n\n  /**\n   * Check for active tabs on register and update selected\n   *\n   * @param event\n   */\n  @Listen(\"calciteInternalTabTitleRegister\")\n  updateTabTitles(event: CustomEvent<TabID>): void {\n    if ((event.target as HTMLCalciteTabTitleElement).selected) {\n      this.selectedTabId = event.detail;\n    }\n  }\n\n  @Listen(\"calciteInternalTabChange\", { target: \"body\" })\n  globalInternalTabChangeHandler(event: CustomEvent<TabChangeEventDetail>): void {\n    if (\n      this.syncId &&\n      event.target !== this.el &&\n      (event.target as HTMLCalciteTabNavElement).syncId === this.syncId &&\n      this.selectedTabId !== event.detail.tab\n    ) {\n      this.selectedTabId = event.detail.tab;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteInternalTabIconChanged\")\n  iconStartChangeHandler(): void {\n    this.updateActiveIndicator();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the selected `calcite-tab` changes.\n   */\n  @Event({ cancelable: false }) calciteTabChange: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabChange: EventEmitter<TabChangeEventDetail>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTabNavElement;\n\n  @State() defaultMessages: TabNavMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() private hasOverflowingStartTabTitle = false;\n\n  @State() private hasOverflowingEndTabTitle = false;\n\n  @State() private selectedTabId: TabID;\n\n  private activeIndicatorEl: HTMLElement;\n\n  private activeIndicatorContainerEl: HTMLDivElement;\n\n  private containerEl: HTMLDivElement;\n\n  private effectiveDir: Direction = \"ltr\";\n\n  private lastScrollWheelAxis: \"x\" | \"y\" = \"x\";\n\n  private parentTabsEl: HTMLCalciteTabsElement;\n\n  private tabTitleContainerEl: HTMLDivElement;\n\n  private intersectionObserver: IntersectionObserver;\n\n  private resizeObserver = createObserver(\"resize\", () => {\n    this.updateScrollingState();\n\n    if (!this.activeIndicatorEl) {\n      return;\n    }\n\n    this.updateActiveIndicator();\n  });\n\n  private get scrollerButtonWidth(): number {\n    const { scale } = this;\n    return parseInt(scale === \"s\" ? calciteSize24 : scale === \"m\" ? calciteSize32 : calciteSize44);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private updateActiveIndicator(): void {\n    const tabTitleScrollLeft = this.tabTitleContainerEl?.scrollLeft;\n    const containerScrollLeft = this.containerEl?.scrollLeft;\n    const navWidth = this.activeIndicatorContainerEl?.offsetWidth;\n    const tabLeft = this.selectedTitle?.offsetLeft;\n    const tabWidth = this.selectedTitle?.offsetWidth;\n    const offsetRight = navWidth - tabLeft - tabWidth;\n    const offsetBase = this.effectiveDir === \"ltr\" ? tabLeft : offsetRight;\n    const multiplier = this.effectiveDir === \"ltr\" ? -1 : 1;\n\n    this.indicatorOffset = offsetBase + multiplier * (containerScrollLeft + tabTitleScrollLeft);\n    this.indicatorWidth = this.selectedTitle?.offsetWidth;\n  }\n\n  private onTabTitleWheel = (event: WheelEvent): void => {\n    event.preventDefault();\n\n    const { deltaX, deltaY } = event;\n    const x = Math.abs(deltaX);\n    const y = Math.abs(deltaY);\n\n    let scrollBy: number;\n\n    if (x === y) {\n      scrollBy = this.lastScrollWheelAxis === \"x\" ? deltaX : deltaY;\n    } else if (x > y) {\n      scrollBy = deltaX;\n      this.lastScrollWheelAxis = \"x\";\n    } else {\n      scrollBy = deltaY;\n      this.lastScrollWheelAxis = \"y\";\n    }\n\n    const scrollByX = (this.effectiveDir === \"rtl\" ? -1 : 1) * scrollBy;\n    (event.currentTarget as HTMLDivElement).scrollBy(scrollByX, 0);\n    requestAnimationFrame(() => this.updateActiveIndicator());\n  };\n\n  private onSlotChange = (event: Event): void => {\n    this.intersectionObserver?.disconnect();\n\n    const slottedChildren = (event.target as HTMLSlotElement).assignedElements();\n    slottedChildren.forEach((child) => {\n      this.intersectionObserver?.observe(child);\n    });\n  };\n\n  private storeContainerRef = (el: HTMLDivElement) => (this.containerEl = el);\n\n  private storeTabTitleWrapperRef = (el: HTMLDivElement) => {\n    this.tabTitleContainerEl = el;\n    this.intersectionObserver = createObserver(\"intersection\", () => this.updateScrollingState(), {\n      root: el,\n      threshold: [0, 0.5, 1],\n    });\n  };\n\n  private updateScrollingState(): void {\n    const tabTitleContainer = this.tabTitleContainerEl;\n\n    if (!tabTitleContainer) {\n      return;\n    }\n\n    let isOverflowStart: boolean;\n    let isOverflowEnd: boolean;\n\n    const scrollPosition = tabTitleContainer.scrollLeft;\n    const visibleWidth = tabTitleContainer.clientWidth;\n    const totalContentWidth = tabTitleContainer.scrollWidth;\n\n    if (this.effectiveDir === \"ltr\") {\n      isOverflowStart = scrollPosition > 0;\n      isOverflowEnd = scrollPosition + visibleWidth < totalContentWidth;\n    } else {\n      isOverflowStart = scrollPosition < 0;\n      isOverflowEnd = scrollPosition !== -(totalContentWidth - visibleWidth);\n    }\n\n    this.hasOverflowingStartTabTitle = isOverflowStart;\n    this.hasOverflowingEndTabTitle = isOverflowEnd;\n  }\n\n  private scrollToTabTitles = (direction: \"forward\" | \"backward\"): void => {\n    readTask(() => {\n      const tabTitleContainer = this.tabTitleContainerEl;\n      const containerBounds = tabTitleContainer.getBoundingClientRect();\n      const tabTitles = Array.from(this.el.querySelectorAll(\"calcite-tab-title\"));\n      const { effectiveDir } = this;\n\n      if (direction === \"forward\") {\n        tabTitles.reverse();\n      }\n\n      let closestToEdge: HTMLCalciteTabTitleElement = null;\n\n      tabTitles.forEach((tabTitle) => {\n        const tabTitleBounds = tabTitle.getBoundingClientRect();\n        const containerEndX = containerBounds.x + containerBounds.width;\n        const tabTitleEndX = tabTitleBounds.x + tabTitleBounds.width;\n\n        if (\n          (direction === \"forward\" && effectiveDir === \"ltr\") ||\n          (direction === \"backward\" && effectiveDir === \"rtl\")\n        ) {\n          const afterContainerEnd = tabTitleBounds.x > containerEndX;\n\n          if (afterContainerEnd) {\n            closestToEdge = tabTitle;\n          } else {\n            const crossingContainerEnd =\n              tabTitleEndX > containerEndX && tabTitleBounds.x > containerBounds.x;\n\n            if (crossingContainerEnd) {\n              closestToEdge = tabTitle;\n            }\n          }\n        } else {\n          const beforeContainerStart = tabTitleEndX < containerBounds.x;\n\n          if (beforeContainerStart) {\n            closestToEdge = tabTitle;\n          } else {\n            const crossingContainerStart =\n              tabTitleEndX < containerEndX && tabTitleBounds.x < containerBounds.x;\n\n            if (crossingContainerStart) {\n              closestToEdge = tabTitle;\n            }\n          }\n        }\n      });\n\n      if (closestToEdge) {\n        const { scrollerButtonWidth } = this;\n        const offsetAdjustment =\n          (direction === \"forward\" && effectiveDir === \"ltr\") ||\n          (direction === \"backward\" && effectiveDir === \"rtl\")\n            ? -scrollerButtonWidth\n            : closestToEdge.offsetWidth - tabTitleContainer.clientWidth + scrollerButtonWidth;\n        const scrollTo = closestToEdge.offsetLeft + offsetAdjustment;\n\n        tabTitleContainer.scrollTo({\n          left: scrollTo,\n          behavior: \"smooth\",\n        });\n      }\n    });\n  };\n\n  private scrollToNextTabTitles = (): void => this.scrollToTabTitles(\"forward\");\n\n  private scrollToPreviousTabTitles = (): void => this.scrollToTabTitles(\"backward\");\n\n  handleTabFocus = (\n    event: CustomEvent,\n    el: HTMLCalciteTabTitleElement,\n    destination: FocusElementInGroupDestination,\n  ): void => {\n    const focused = focusElementInGroup<HTMLCalciteTabTitleElement>(\n      this.enabledTabTitles,\n      el,\n      destination,\n    );\n    this.scrollTabTitleIntoView(focused, \"instant\");\n\n    event.stopPropagation();\n  };\n\n  getIndexOfTabTitle(el: HTMLCalciteTabTitleElement, tabTitles = this.tabTitles): number {\n    // In most cases, since these indexes correlate with tab contents, we want to consider all tab titles.\n    // However, when doing relative index operations, it makes sense to pass in this.enabledTabTitles as the 2nd arg.\n    return tabTitles.indexOf(el);\n  }\n\n  private onTabTitleScroll = (): void => {\n    this.updateActiveIndicator();\n    this.updateScrollingState();\n  };\n\n  async getTabTitleById(id: TabID): Promise<HTMLCalciteTabTitleElement | null> {\n    return Promise.all(this.tabTitles.map((el) => el.getTabIdentifier())).then((ids) => {\n      return this.tabTitles[ids.indexOf(id)];\n    });\n  }\n\n  get tabTitles(): HTMLCalciteTabTitleElement[] {\n    return filterDirectChildren<HTMLCalciteTabTitleElement>(this.el, \"calcite-tab-title\");\n  }\n\n  get enabledTabTitles(): HTMLCalciteTabTitleElement[] {\n    return filterDirectChildren<HTMLCalciteTabTitleElement>(\n      this.el,\n      \"calcite-tab-title:not([disabled])\",\n    ).filter((tabTitle) => !tabTitle.closed);\n  }\n\n  private handleTabTitleClose(closedTabTitleEl: HTMLCalciteTabTitleElement): void {\n    const { tabTitles } = this;\n    const selectionModified = closedTabTitleEl.selected;\n\n    const visibleTabTitlesIndices = tabTitles.reduce(\n      (tabTitleIndices: number[], tabTitle, index) =>\n        !tabTitle.closed ? [...tabTitleIndices, index] : tabTitleIndices,\n      [],\n    );\n    const totalVisibleTabTitles = visibleTabTitlesIndices.length;\n\n    if (totalVisibleTabTitles === 1 && tabTitles[visibleTabTitlesIndices[0]].closable) {\n      tabTitles[visibleTabTitlesIndices[0]].closable = false;\n      this.selectedTabId = visibleTabTitlesIndices[0];\n\n      if (selectionModified) {\n        tabTitles[visibleTabTitlesIndices[0]].activateTab();\n      }\n    } else if (totalVisibleTabTitles > 1) {\n      const closedTabTitleIndex = tabTitles.findIndex((el) => el === closedTabTitleEl);\n\n      const nextTabTitleIndex = visibleTabTitlesIndices.find(\n        (value) => value > closedTabTitleIndex,\n      );\n\n      if (this.selectedTabId === closedTabTitleIndex) {\n        this.selectedTabId = nextTabTitleIndex ? nextTabTitleIndex : totalVisibleTabTitles - 1;\n        tabTitles[this.selectedTabId].activateTab();\n      }\n    }\n\n    requestAnimationFrame(() => {\n      this.updateActiveIndicator();\n      tabTitles[this.selectedTabId].focus();\n    });\n  }\n\n  private renderScrollButton = (overflowDirection: \"start\" | \"end\"): VNode => {\n    const { bordered, messages, hasOverflowingStartTabTitle, hasOverflowingEndTabTitle, scale } =\n      this;\n    const isEnd = overflowDirection === \"end\";\n\n    return (\n      <div\n        class={{\n          [CSS.scrollButtonContainer]: true,\n          [CSS.scrollBackwardContainerButton]: !isEnd,\n          [CSS.scrollForwardContainerButton]: isEnd,\n        }}\n        hidden={(isEnd && !hasOverflowingEndTabTitle) || (!isEnd && !hasOverflowingStartTabTitle)}\n        key={overflowDirection}\n      >\n        <calcite-button\n          appearance={bordered ? \"outline-fill\" : \"transparent\"}\n          aria-label={isEnd ? messages.nextTabTitles : messages.previousTabTitles}\n          class={{\n            [CSS.scrollButton]: true,\n          }}\n          iconFlipRtl=\"both\"\n          iconStart={isEnd ? ICON.chevronRight : ICON.chevronLeft}\n          kind=\"neutral\"\n          onClick={isEnd ? this.scrollToNextTabTitles : this.scrollToPreviousTabTitles}\n          scale={scale}\n          tabIndex={-1}\n        />\n      </div>\n    );\n  };\n}\n","export const CSS = {\n  closeButton: \"close-button\",\n  container: \"container\",\n  content: \"content\",\n  contentHasText: \"content--has-text\",\n  iconEnd: \"icon-end\",\n  iconPresent: \"icon-present\",\n  iconStart: \"icon-start\",\n  titleIcon: \"calcite-tab-title--icon\",\n};\n\nexport const ICONS = {\n  close: \"x\",\n};\n",":host {\n  @apply block outline-none;\n  margin-inline-start: theme(\"margin.0\");\n}\n\n:host([layout=\"inline\"]) {\n  @apply flex-initial;\n}\n\n:host([layout=\"center\"]) {\n  @apply flex-auto;\n}\n\n.content {\n  @apply flex items-center justify-center;\n}\n\n.scale-s {\n  .content {\n    @apply text-n2h py-1;\n  }\n}\n\n.scale-m {\n  .content {\n    @apply text-n1h py-2;\n  }\n}\n\n.scale-l {\n  .content {\n    @apply text-0h py-2.5;\n  }\n}\n\n:host([closable]) .content {\n  @apply h-full box-border border-b-color-transparent;\n}\n\n:host([layout=\"inline\"]),\n:host([layout=\"center\"]) {\n  .content {\n    @apply px-1;\n  }\n}\n\n:host([layout=\"center\"]) .scale-s,\n:host([layout=\"center\"]) .scale-m,\n:host([layout=\"center\"]) .scale-l {\n  @apply justify-center my-0 text-center;\n\n  .content {\n    @apply flex-auto flex-grow;\n  }\n}\n\n.container {\n  @apply border-b-2\n  border-b-color-transparent\n  box-border\n  content-center\n  cursor-pointer\n  flex\n  focus-base\n  h-full\n  justify-between\n  px-0\n  text-color-3\n  text-n1h\n  transition-default\n  w-full;\n\n  border-block-end-style: solid;\n}\n\n:host([position=\"bottom\"]) .container {\n  @apply border-t-color-transparent\n    border-b-0\n    border-t-2;\n  border-block-start-style: solid;\n}\n\n:host([closed]) {\n  @apply hidden;\n}\n\n:host([selected]) .container {\n  @apply text-color-1 border-color-transparent;\n}\n\n:host(:focus) .container {\n  @apply focus-inset;\n\n  &:focus-within {\n    @apply focus-base;\n  }\n}\n\n:host(:active),\n:host(:focus),\n:host(:hover) {\n  a {\n    @apply text-color-1 border-color-2 no-underline;\n  }\n}\n\n@include disabled() {\n  .container {\n    @apply pointer-events-none opacity-50;\n  }\n}\n\n.calcite-tab-title--icon {\n  @apply relative\n    m-0\n    inline-flex\n    self-center;\n  & svg {\n    @apply transition-default;\n  }\n}\n\n.content--has-text {\n  @apply p-1;\n}\n\n.content--has-text .calcite-tab-title--icon.icon-start {\n  margin-inline-end: theme(\"margin.2\");\n}\n\n.content--has-text .calcite-tab-title--icon.icon-end {\n  margin-inline-start: theme(\"margin.2\");\n}\n\n.close-button {\n  @apply appearance-none\n  bg-foreground-1\n  border-none\n  content-center\n  cursor-pointer\n  flex\n  focus-base\n  items-center\n  justify-center\n  p-1\n  self-center\n  text-color-3\n  transition-default;\n\n  background-color: var(--calcite-button-transparent-1);\n  margin-inline-start: auto;\n\n  &:focus {\n    @apply focus-inset;\n\n    // ⚠️overriding outline-offset should be avoided as it won't honor --calcite-color-focus-offset-invert\n    outline-offset: -1px;\n  }\n\n  &:focus,\n  &:hover {\n    @apply text-color-1;\n    background-color: var(--calcite-color-foreground-2);\n  }\n\n  &:active {\n    @apply text-color-1;\n    background-color: var(--calcite-color-foreground-3);\n  }\n\n  & calcite-icon {\n    color: inherit;\n  }\n}\n\n// compensate for spacing when no hastext and two icons\n:host([icon-start][icon-end]) {\n  .calcite-tab-title--icon:first-child {\n    margin-inline-end: theme(\"margin.2\");\n  }\n}\n\n// bordered styles\n:host([bordered]) {\n  margin-inline-end: 0;\n}\n\n:host([bordered][selected]) {\n  box-shadow: inset 0px -2px var(--calcite-color-foreground-1);\n}\n\n:host([bordered][selected][position=\"bottom\"]) {\n  box-shadow: inset 0 2px 0 var(--calcite-color-foreground-1);\n}\n\n:host([bordered]:hover) {\n  .container {\n    background-color: var(--calcite-color-transparent-hover);\n  }\n}\n\n:host([closable]) .container,\n:host([bordered]) .container {\n  border-inline-start: 1px solid transparent;\n  border-inline-end: 1px solid transparent;\n  .close-button {\n    margin-inline: 0;\n  }\n}\n\n:host([closable][position=\"bottom\"]) .container,\n:host([bordered][position=\"bottom\"]) .container {\n  border-block-start-style: unset;\n}\n\n:host([selected][bordered]) .container {\n  border-inline-start-color: var(--calcite-color-border-1);\n  border-inline-end-color: var(--calcite-color-border-1);\n}\n\n:host([layout=\"inline\"][bordered]),\n:host([layout=\"center\"][bordered]) {\n  .scale-m {\n    .content {\n      @apply px-3;\n    }\n  }\n\n  .scale-s {\n    .content {\n      @apply px-2;\n    }\n  }\n\n  .scale-l {\n    .content {\n      @apply px-4;\n    }\n  }\n}\n\n:host([layout=\"inline\"][closable]) {\n  .scale-s,\n  .scale-m,\n  .scale-l {\n    .content {\n      padding-inline-end: 0;\n    }\n  }\n}\n\n@media (forced-colors: active) {\n  :host {\n    outline-width: 0;\n    outline-offset: 0;\n  }\n\n  :host(:focus) .container {\n    outline-color: highlight;\n  }\n\n  :host([bordered]) .container {\n    border-block-end-style: solid;\n  }\n\n  :host([bordered][position=\"bottom\"]) .container {\n    border-block-start-style: solid;\n  }\n\n  :host([bordered][selected]) .container {\n    border-block-end-style: none;\n  }\n\n  :host([bordered][position=\"bottom\"][selected]) .container {\n    border-block-start-style: none;\n  }\n\n  .close-button {\n    /* in high contrast the tab title outline covers the close button outline without a z-index */\n    @apply z-default;\n  }\n}\n\n@include base-component();\n","import {\n  Build,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { getElementDir, toAriaBoolean, nodeListToArray } from \"../../utils/dom\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { createObserver } from \"../../utils/observers\";\nimport { FlipContext, Scale } from \"../interfaces\";\nimport { TabChangeEventDetail, TabCloseEventDetail } from \"../tab/interfaces\";\nimport { TabID, TabLayout, TabPosition } from \"../tabs/interfaces\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { getIconScale } from \"../../utils/component\";\nimport { TabTitleMessages } from \"./assets/tab-title/t9n\";\nimport { CSS, ICONS } from \"./resources\";\n\n/**\n * Tab-titles are optionally individually closable.\n */\n\n/**\n * @slot - A slot for adding text.\n */\n@Component({\n  tag: \"calcite-tab-title\",\n  styleUrl: \"tab-title.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class TabTitle implements InteractiveComponent, LocalizedComponent, T9nComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component and its respective `calcite-tab` contents are selected.\n   *\n   * Only one tab can be selected within the `calcite-tabs` parent.\n   */\n  @Prop({ reflect: true, mutable: true }) selected = false;\n\n  @Watch(\"selected\")\n  selectedHandler(): void {\n    if (this.selected) {\n      this.activateTab(false);\n    }\n  }\n\n  /** When `true`, a close button is added to the component. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** When `true`, does not display or position the component. */\n  @Prop({ reflect: true, mutable: true }) closed = false;\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity.  */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Specifies an icon to display at the end of the component. */\n  @Prop({ reflect: true }) iconEnd: string;\n\n  /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl: FlipContext;\n\n  /** Specifies an icon to display at the start of the component. */\n  @Prop({ reflect: true }) iconStart: string;\n\n  /**\n   * @internal\n   */\n  @Prop({ reflect: true, mutable: true }) layout: TabLayout;\n\n  /**\n   * Specifies the position of `calcite-tab-nav` and `calcite-tab-title` components in relation to, and is inherited from the parent `calcite-tabs`, defaults to `top`.\n   *\n   *  @internal\n   */\n  @Prop() position: TabPosition = \"top\";\n\n  /**\n   * Specifies the size of the component inherited from the parent `calcite-tabs`, defaults to `m`.\n   *\n   * @internal\n   */\n  @Prop() scale: Scale = \"m\";\n\n  /**\n   * @internal\n   */\n  @Prop({ reflect: true, mutable: true }) bordered = false;\n\n  /**\n   * Specifies a unique name for the component.\n   *\n   * When specified, use the same value on the `calcite-tab`.\n   */\n  @Prop({ reflect: true }) tab: string;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: TabTitleMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<TabTitleMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n    this.setupTextContentObserver();\n    this.parentTabNavEl = this.el.closest(\"calcite-tab-nav\");\n    this.parentTabsEl = this.el.closest(\"calcite-tabs\");\n  }\n\n  disconnectedCallback(): void {\n    this.mutationObserver?.disconnect();\n    // Dispatching to body in order to be listened by other elements that are still connected to the DOM.\n    document.body?.dispatchEvent(\n      new CustomEvent(\"calciteTabTitleUnregister\", {\n        detail: this.el,\n      }),\n    );\n    this.resizeObserver?.disconnect();\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    if (Build.isBrowser) {\n      this.updateHasText();\n    }\n    if (this.tab && this.selected) {\n      this.activateTab(false);\n    }\n  }\n\n  componentWillRender(): void {\n    if (this.parentTabsEl) {\n      this.layout = this.parentTabsEl.layout;\n      this.bordered = this.parentTabsEl.bordered;\n    }\n  }\n\n  render(): VNode {\n    const { el, closed } = this;\n    const id = el.id || this.guid;\n\n    const iconStartEl = (\n      <calcite-icon\n        class={{ [CSS.titleIcon]: true, [CSS.iconStart]: true }}\n        flipRtl={this.iconFlipRtl === \"start\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconStart}\n        scale={getIconScale(this.scale)}\n      />\n    );\n\n    const iconEndEl = (\n      <calcite-icon\n        class={{ [CSS.titleIcon]: true, [CSS.iconEnd]: true }}\n        flipRtl={this.iconFlipRtl === \"end\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconEnd}\n        scale={getIconScale(this.scale)}\n      />\n    );\n\n    return (\n      <Host\n        aria-controls={this.controls}\n        aria-selected={toAriaBoolean(this.selected)}\n        id={id}\n        role=\"tab\"\n        tabIndex={this.selected && !this.disabled ? 0 : -1}\n      >\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            class={{\n              container: true,\n              [CSS.iconPresent]: !!this.iconStart || !!this.iconEnd,\n              [`scale-${this.scale}`]: true,\n            }}\n            hidden={closed}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={(el) => this.resizeObserver?.observe(el)}\n          >\n            <div class={{ [CSS.content]: true, [CSS.contentHasText]: this.hasText }}>\n              {this.iconStart ? iconStartEl : null}\n              <slot />\n              {this.iconEnd ? iconEndEl : null}\n            </div>\n            {this.renderCloseButton()}\n          </div>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  renderCloseButton(): VNode {\n    const { closable, messages } = this;\n\n    return closable ? (\n      <button\n        aria-label={messages.close}\n        class={CSS.closeButton}\n        disabled={false}\n        key={CSS.closeButton}\n        onClick={this.closeClickHandler}\n        title={messages.close}\n        type=\"button\"\n        // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n        ref={(el) => (this.closeButtonEl = el)}\n      >\n        <calcite-icon icon={ICONS.close} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  async componentDidLoad(): Promise<void> {\n    this.calciteInternalTabTitleRegister.emit(await this.getTabIdentifier());\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalTabChange\", { target: \"body\" })\n  internalTabChangeHandler(event: CustomEvent<TabChangeEventDetail>): void {\n    const targetTabsEl = event\n      .composedPath()\n      .find((el: HTMLElement) => el.tagName === \"CALCITE-TABS\");\n\n    if (targetTabsEl !== this.parentTabsEl) {\n      return;\n    }\n\n    if (this.tab) {\n      this.selected = this.tab === event.detail.tab;\n    } else {\n      this.getTabIndex().then((index) => {\n        this.selected = index === event.detail.tab;\n      });\n    }\n\n    event.stopPropagation();\n  }\n\n  @Listen(\"click\")\n  onClick(): void {\n    this.activateTab();\n  }\n\n  @Listen(\"keydown\")\n  keyDownHandler(event: KeyboardEvent): void {\n    switch (event.key) {\n      case \" \":\n      case \"Enter\":\n        if (!event.composedPath().includes(this.closeButtonEl)) {\n          this.activateTab();\n          event.preventDefault();\n        }\n        break;\n      case \"ArrowRight\":\n        event.preventDefault();\n        if (getElementDir(this.el) === \"ltr\") {\n          this.calciteInternalTabsFocusNext.emit();\n        } else {\n          this.calciteInternalTabsFocusPrevious.emit();\n        }\n        break;\n      case \"ArrowLeft\":\n        event.preventDefault();\n        if (getElementDir(this.el) === \"ltr\") {\n          this.calciteInternalTabsFocusPrevious.emit();\n        } else {\n          this.calciteInternalTabsFocusNext.emit();\n        }\n        break;\n      case \"Home\":\n        event.preventDefault();\n        this.calciteInternalTabsFocusFirst.emit();\n        break;\n      case \"End\":\n        event.preventDefault();\n        this.calciteInternalTabsFocusLast.emit();\n        break;\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Fires when a `calcite-tab` is selected.\n   */\n  @Event({ cancelable: false }) calciteTabsActivate: EventEmitter<void>;\n\n  /**\n   * Fires when a `calcite-tab` is selected (`event.details`).\n   *\n   * @see [TabChangeEventDetail](https://github.com/Esri/calcite-design-system/blob/main/src/components/tab/interfaces.ts#L1)\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabsActivate: EventEmitter<TabChangeEventDetail>;\n\n  /**\n   * Fires when a `calcite-tab` is closed.\n   */\n  @Event({ cancelable: false }) calciteTabsClose: EventEmitter<void>;\n\n  /**\n   * Fires when `calcite-tab` is closed (`event.details`).\n   *\n   * @see [TabChangeEventDetail](https://github.com/Esri/calcite-design-system/blob/main/src/components/tab/interfaces.ts)\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabsClose: EventEmitter<TabCloseEventDetail>;\n  /**\n   * @internal\n   */\n\n  @Event({ cancelable: false }) calciteInternalTabsFocusNext: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabsFocusPrevious: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabsFocusFirst: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabsFocusLast: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabTitleRegister: EventEmitter<TabID>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalTabIconChanged: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Returns the index of the title within the `calcite-tab-nav`.\n   */\n  @Method()\n  async getTabIndex(): Promise<number> {\n    return Array.prototype.indexOf.call(\n      nodeListToArray(this.el.parentElement.children).filter((el) =>\n        el.matches(\"calcite-tab-title\"),\n      ),\n      this.el,\n    );\n  }\n\n  /**\n   * @internal\n   */\n  @Method()\n  async getTabIdentifier(): Promise<TabID> {\n    return this.tab ? this.tab : this.getTabIndex();\n  }\n\n  /**\n   * @param tabIds\n   * @param titleIds\n   * @internal\n   */\n  @Method()\n  async updateAriaInfo(tabIds: string[] = [], titleIds: string[] = []): Promise<void> {\n    this.controls = tabIds[titleIds.indexOf(this.el.id)] || null;\n  }\n\n  /**\n   * This activates a tab in order for it and its associated tab-title be selected.\n   *\n   * @param userTriggered - when `true`, user-interaction events will be emitted in addition to internal events\n   * @internal\n   */\n  @Method()\n  async activateTab(userTriggered = true): Promise<void> {\n    if (this.disabled || this.closed) {\n      return;\n    }\n    const payload = { tab: this.tab };\n    this.calciteInternalTabsActivate.emit(payload);\n\n    if (userTriggered) {\n      // emit in the next frame to let internal events sync up\n      requestAnimationFrame(() => this.calciteTabsActivate.emit());\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private closeClickHandler = (): void => {\n    this.closeTabTitleAndNotify();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTabTitleElement;\n\n  /** watches for changing text content */\n  mutationObserver: MutationObserver = createObserver(\"mutation\", () => this.updateHasText());\n\n  @State() controls: string;\n\n  @State() defaultMessages: TabTitleMessages;\n\n  @State() effectiveLocale: \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  /** determine if there is slotted text for styling purposes */\n  @State() hasText = false;\n\n  closeButtonEl: HTMLButtonElement;\n\n  containerEl: HTMLDivElement;\n\n  parentTabNavEl: HTMLCalciteTabNavElement;\n\n  parentTabsEl: HTMLCalciteTabsElement;\n\n  resizeObserver = createObserver(\"resize\", () => {\n    this.calciteInternalTabIconChanged.emit();\n  });\n\n  updateHasText(): void {\n    this.hasText = this.el.textContent.trim().length > 0;\n  }\n\n  setupTextContentObserver(): void {\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n  }\n\n  closeTabTitleAndNotify(): void {\n    this.closed = true;\n    this.calciteInternalTabsClose.emit({ tab: this.tab });\n    this.calciteTabsClose.emit();\n  }\n\n  guid = `calcite-tab-title-${guid()}`;\n}\n","export const SLOTS = {\n  titleGroup: \"title-group\",\n};\n",":host {\n  @apply flex flex-col;\n}\n\n:host([bordered]) {\n  box-shadow: inset 0 1px 0 var(--calcite-color-border-1);\n  background-color: var(--calcite-color-foreground-1);\n\n  section {\n    @apply border-color-1 border border-solid;\n  }\n}\n\n:host([bordered][position=\"bottom\"]) {\n  box-shadow:\n    inset 0 1px 0 var(--calcite-color-border-1),\n    inset 0 -1px 0 var(--calcite-color-border-1);\n}\n\n:host([bordered]:not([position=\"bottom\"])) ::slotted(calcite-tab-nav) {\n  margin-block-end: -1px;\n}\n\n:host([bordered][scale=\"s\"]) section {\n  @apply p-3;\n}\n\n:host([bordered][scale=\"m\"]) section {\n  @apply p-2;\n}\n\n:host([bordered][scale=\"l\"]) section {\n  @apply p-4;\n}\n\n:host([position=\"bottom\"]) {\n  @apply flex-col-reverse;\n}\n\nsection {\n  @apply border-t-color-1\n    flex\n    flex-grow\n    overflow-hidden\n    border-t;\n  border-block-start-style: solid;\n}\n\n:host([position=\"bottom\"]) section {\n  @apply border-b-color-1\n    flex-col-reverse\n    border-t-0\n    border-b;\n}\n\n:host([position=\"bottom\"]:not([bordered])) section {\n  border-block-end-style: solid;\n}\n\n@media (forced-colors: active) {\n  :host([bordered]) section {\n    @apply border-t-0\n      border-b;\n  }\n  :host([position=\"bottom\"][bordered]) section {\n    @apply border-t\n      border-b-0;\n  }\n}\n\n@include base-component();\n","import { Component, Element, Fragment, h, Listen, Prop, State, VNode, Watch } from \"@stencil/core\";\nimport { Scale } from \"../interfaces\";\nimport { createObserver } from \"../../utils/observers\";\nimport { TabLayout, TabPosition } from \"./interfaces\";\nimport { SLOTS } from \"./resources\";\n\n/**\n * @slot - A slot for adding `calcite-tab`s.\n * @slot title-group - A slot for adding a `calcite-tab-nav`.\n */\n@Component({\n  tag: \"calcite-tabs\",\n  styleUrl: \"tabs.scss\",\n  shadow: true,\n})\nexport class Tabs {\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Specifies the layout of the `calcite-tab-nav`, justifying the `calcite-tab-title`s to the start (`\"inline\"`), or across and centered (`\"center\"`).\n   */\n  @Prop({ reflect: true }) layout: TabLayout = \"inline\";\n\n  /**\n   * Specifies the position of `calcite-tab-nav` and `calcite-tab-title` components in relation to the `calcite-tabs`.\n   */\n  @Prop({ reflect: true }) position: TabPosition = \"top\";\n\n  /**\n   * Specifies the size of the component.\n   */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  @Watch(\"position\")\n  @Watch(\"scale\")\n  handleInheritableProps(): void {\n    this.updateItems();\n  }\n\n  /**\n   * When `true`, the component will display with a folder style menu.\n   */\n  @Prop() bordered = false;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.mutationObserver.observe(this.el, { childList: true });\n    this.updateItems();\n  }\n\n  async componentWillLoad(): Promise<void> {\n    this.updateItems();\n  }\n\n  disconnectedCallback(): void {\n    this.mutationObserver?.disconnect();\n  }\n\n  render(): VNode {\n    return (\n      <Fragment>\n        <slot name={SLOTS.titleGroup} />\n        <section>\n          <slot />\n        </section>\n      </Fragment>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * @param event\n   * @internal\n   */\n  @Listen(\"calciteInternalTabTitleRegister\")\n  calciteInternalTabTitleRegister(event: CustomEvent): void {\n    this.titles = [...this.titles, event.target as HTMLCalciteTabTitleElement];\n    this.registryHandler();\n    event.stopPropagation();\n  }\n\n  /**\n   * @param event\n   * @internal\n   */\n  @Listen(\"calciteTabTitleUnregister\", { target: \"body\" })\n  calciteTabTitleUnregister(event: CustomEvent): void {\n    this.titles = this.titles.filter((el) => el !== event.detail);\n    this.registryHandler();\n    event.stopPropagation();\n  }\n\n  /**\n   * @param event\n   * @internal\n   */\n  @Listen(\"calciteInternalTabRegister\")\n  calciteInternalTabRegister(event: CustomEvent): void {\n    this.tabs = [...this.tabs, event.target as HTMLCalciteTabElement];\n    this.registryHandler();\n    event.stopPropagation();\n  }\n\n  /**\n   * @param event\n   * @internal\n   */\n  @Listen(\"calciteTabUnregister\", { target: \"body\" })\n  calciteTabUnregister(event: CustomEvent): void {\n    this.tabs = this.tabs.filter((el) => el !== event.detail);\n    this.registryHandler();\n    event.stopPropagation();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTabsElement;\n\n  /**\n   *\n   * Stores an array of ids of `<calcite-tab-titles>`s to match up ARIA\n   * attributes.\n   */\n  @State() titles: HTMLCalciteTabTitleElement[] = [];\n\n  /**\n   *\n   * Stores an array of ids of `<calcite-tab>`s to match up ARIA attributes.\n   */\n  @State() tabs: HTMLCalciteTabElement[] = [];\n\n  mutationObserver = createObserver(\"mutation\", (mutationsList: MutationRecord[]) => {\n    for (const mutation of mutationsList) {\n      const target = mutation.target as HTMLElement;\n      if (\n        target.nodeName === \"CALCITE-TAB-NAV\" ||\n        target.nodeName === \"CALCITE-TAB-TITLE\" ||\n        target.nodeName === \"CALCITE-TAB\"\n      ) {\n        this.updateItems();\n      }\n    }\n  });\n\n  private updateItems(): void {\n    const { position, scale } = this;\n\n    const nav = this.el.querySelector(\"calcite-tab-nav\");\n    if (nav) {\n      nav.position = position;\n      nav.scale = scale;\n    }\n\n    Array.from(this.el.querySelectorAll(\"calcite-tab\")).forEach((tab: HTMLCalciteTabElement) => {\n      if (tab.parentElement === this.el) {\n        tab.scale = scale;\n      }\n    });\n\n    Array.from(this.el.querySelectorAll(\"calcite-tab-nav > calcite-tab-title\")).forEach(\n      (title: HTMLCalciteTabTitleElement) => {\n        title.position = position;\n        title.scale = scale;\n      },\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   *\n   * Matches up elements from the internal `tabs` and `titles` to automatically\n   * update the ARIA attributes and link `<calcite-tab>` and\n   * `<calcite-tab-title>` components.\n   */\n  async registryHandler(): Promise<void> {\n    let tabIds;\n    let titleIds;\n\n    // determine if we are using `tab` based or `index` based tab identifiers.\n    if (this.tabs.some((el) => el.tab) || this.titles.some((el) => el.tab)) {\n      // if we are using `tab` based identifiers sort by `tab` to account for\n      // possible out of order tabs and get the id of each tab\n      tabIds = this.tabs.sort((a, b) => a.tab.localeCompare(b.tab)).map((el) => el.id);\n      titleIds = this.titles.sort((a, b) => a.tab.localeCompare(b.tab)).map((el) => el.id);\n    } else {\n      // if we are using index based tabs then the `<calcite-tab>` and\n      // `<calcite-tab-title>` might have been rendered out of order so the\n      // order of `this.tabs` and `this.titles` might not reflect the DOM state,\n      // and might not match each other so we need to get the index of all the\n      // tabs and titles in the DOM order to match them up as a source of truth\n      const tabDomIndexes = await Promise.all(this.tabs.map((el) => el.getTabIndex()));\n\n      const titleDomIndexes = await Promise.all(this.titles.map((el) => el.getTabIndex()));\n\n      // once we have the DOM order as a source of truth we can build the\n      // matching tabIds and titleIds arrays\n      tabIds = tabDomIndexes.reduce((ids, indexInDOM, registryIndex) => {\n        ids[indexInDOM] = this.tabs[registryIndex].id;\n        return ids;\n      }, []);\n\n      titleIds = titleDomIndexes.reduce((ids, indexInDOM, registryIndex) => {\n        ids[indexInDOM] = this.titles[registryIndex].id;\n        return ids;\n      }, []);\n    }\n\n    // pass all our new aria information to each `<calcite-tab>` and\n    // `<calcite-tab-title>` which will check if they can update their internal\n    // `controlled` or `labeledBy` states and re-render if necessary\n    this.tabs.forEach((el) => el.updateAriaInfo(tabIds, titleIds));\n    this.titles.forEach((el) => el.updateAriaInfo(tabIds, titleIds));\n  }\n}\n"],"mappings":"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"}

package/dist/calcite/p-df331f65.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.8.0-next.1
- */
-import{r as t,c as e,h as i,H as n,g as s}from"./p-85931c71.js";import{e as o,l as r,h as a,g as l}from"./p-fb848c65.js";import{s as c,c as h,i as d,d as u,H as b}from"./p-ae3fae00.js";import{c as p,d as m,u as f,I as g}from"./p-1b03b527.js";import{n as v}from"./p-0e53a49b.js";import{c as x,d as k,g as y}from"./p-1e6dcf63.js";import{s as w,a as z,c as j}from"./p-b5a073f3.js";import{n as I,i as E,p as C,s as D,a as W,c as L,d as B,B as $}from"./p-af8b3876.js";import{c as F}from"./p-60c275fd.js";import{C as K}from"./p-b5773566.js";import{u as V,c as N,d as P,s as A}from"./p-4781876f.js";import{g as H}from"./p-c56cce40.js";import{V as O}from"./p-519084ce.js";import{s as R}from"./p-c3e09101.js";import"./p-be664342.js";import"./p-3d0a8ad2.js";const U={loader:"loader",clearButton:"clear-button",editingEnabled:"editing-enabled",inlineChild:"inline-child",inputIcon:"icon",prefix:"prefix",suffix:"suffix",numberButtonWrapper:"number-button-wrapper",buttonItemHorizontal:"number-button-item--horizontal",wrapper:"element-wrapper",inputWrapper:"wrapper",actionWrapper:"action-wrapper",resizeIconWrapper:"resize-icon-wrapper",numberButtonItem:"number-button-item"};const M={tel:"phone",password:"lock",email:"email-address",date:"calendar",time:"clock",search:"search"};const T={action:"action"};const q=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block}:host([scale=s]) input,:host([scale=s]) .prefix,:host([scale=s]) .suffix{block-size:1.5rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=s]) textarea{block-size:1.5rem;min-block-size:1.5rem}:host([scale=s]) .number-button-wrapper,:host([scale=s]) .action-wrapper calcite-button,:host([scale=s]) .action-wrapper calcite-button button{block-size:1.5rem}:host([scale=s]) input[type=file]{block-size:1.5rem}:host([scale=s]) .clear-button{min-block-size:1.5rem;min-inline-size:1.5rem}:host([scale=s]) textarea{block-size:auto;padding-block:0.25rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]) input,:host([scale=m]) .prefix,:host([scale=m]) .suffix{block-size:2rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=m]) textarea{min-block-size:2rem}:host([scale=m]) .number-button-wrapper,:host([scale=m]) .action-wrapper calcite-button,:host([scale=m]) .action-wrapper calcite-button button{block-size:2rem}:host([scale=m]) input[type=file]{block-size:2rem}:host([scale=m]) .clear-button{min-block-size:2rem;min-inline-size:2rem}:host([scale=m]) textarea{block-size:auto;padding-block:0.5rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]) input,:host([scale=l]) .prefix,:host([scale=l]) .suffix{block-size:2.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([scale=l]) textarea{min-block-size:2.75rem}:host([scale=l]) .number-button-wrapper,:host([scale=l]) .action-wrapper calcite-button,:host([scale=l]) .action-wrapper calcite-button button{block-size:2.75rem}:host([scale=l]) input[type=file]{block-size:2.75rem}:host([scale=l]) .clear-button{min-block-size:2.75rem;min-inline-size:2.75rem}:host([scale=l]) textarea{block-size:auto;padding-block:0.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([disabled]) textarea{resize:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}textarea,input{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}input[type=search]::-webkit-search-decoration{-webkit-appearance:none}input,textarea{text-overflow:ellipsis;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}input:placeholder-shown,textarea:placeholder-shown{text-overflow:ellipsis}input:focus,textarea:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}input[readonly],textarea[readonly]{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}input[readonly]:focus,textarea[readonly]:focus{color:var(--calcite-color-text-1)}calcite-icon{color:var(--calcite-color-text-3)}textarea,input{outline-color:transparent}textarea:focus,input:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite-color-brand)));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host([status=invalid]) input,:host([status=invalid]) textarea{border-color:var(--calcite-color-status-danger)}:host([status=invalid]) input:focus,:host([status=invalid]) textarea:focus{outline:2px solid var(--calcite-color-status-danger);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host([scale=s]) .icon{inset-inline-start:0.5rem}:host([scale=m]) .icon{inset-inline-start:0.75rem}:host([scale=l]) .icon{inset-inline-start:1rem}:host([icon][scale=s]) input{padding-inline-start:2rem}:host([icon][scale=m]) input{padding-inline-start:2.5rem}:host([icon][scale=l]) input{padding-inline-start:3.5rem}.element-wrapper{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}.icon{pointer-events:none;position:absolute;display:block;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.icon,.resize-icon-wrapper{z-index:var(--calcite-z-index)}input[type=text]::-ms-clear,input[type=text]::-ms-reveal{display:none;block-size:0px;inline-size:0px}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration,input[type=date]::-webkit-clear-button,input[type=time]::-webkit-clear-button{display:none}.clear-button{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}.clear-button:hover{background-color:var(--calcite-color-foreground-2);transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.clear-button:hover calcite-icon{color:var(--calcite-color-text-1);transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.clear-button:active{background-color:var(--calcite-color-foreground-3)}.clear-button:active calcite-icon{color:var(--calcite-color-text-1)}.clear-button:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite-color-brand)));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.clear-button:disabled{opacity:var(--calcite-opacity-disabled)}.loader{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}.action-wrapper{order:7;display:flex}.prefix,.suffix{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}.prefix{order:2;border-inline-end-width:0px}.suffix{order:5;border-inline-start-width:0px}:host([alignment=start]) textarea,:host([alignment=start]) input{text-align:start}:host([alignment=end]) textarea,:host([alignment=end]) input{text-align:end}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:textfield;margin:0px}.number-button-wrapper{pointer-events:none;order:6;box-sizing:border-box;display:flex;flex-direction:column;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}:host([number-button-type=vertical]) .wrapper{flex-direction:row;display:flex}:host([number-button-type=vertical]) input,:host([number-button-type=vertical]) textarea{order:2}:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon{transform:rotate(-90deg)}:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon{transform:rotate(-90deg)}.number-button-item.number-button-item--horizontal[data-adjustment=down],.number-button-item.number-button-item--horizontal[data-adjustment=up]{order:1;max-block-size:100%;min-block-size:100%;align-self:stretch}.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon,.number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon{transform:rotate(90deg)}.number-button-item.number-button-item--horizontal[data-adjustment=down]{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);border-inline-end-width:0px}.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover{background-color:var(--calcite-color-foreground-2)}.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon{color:var(--calcite-color-text-1)}.number-button-item.number-button-item--horizontal[data-adjustment=up]{order:5}.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover{background-color:var(--calcite-color-foreground-2)}.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon{color:var(--calcite-color-text-1)}:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover{background-color:var(--calcite-color-foreground-2)}:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon{color:var(--calcite-color-text-1)}:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover{background-color:var(--calcite-color-foreground-2)}:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon{color:var(--calcite-color-text-1)}:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]{border-block-start-width:0px}.number-button-item{max-block-size:50%;min-block-size:50%;pointer-events:initial;margin:0px;box-sizing:border-box;display:flex;cursor:pointer;align-items:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);padding-block:0px;padding-inline:0.5rem;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-inline-start-width:0px}.number-button-item calcite-icon{pointer-events:none;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.number-button-item:focus{background-color:var(--calcite-color-foreground-2)}.number-button-item:focus calcite-icon{color:var(--calcite-color-text-1)}.number-button-item:active{background-color:var(--calcite-color-foreground-3)}.number-button-item:disabled{pointer-events:none}.wrapper{position:relative;display:flex;flex-direction:row;align-items:center}:input::-webkit-calendar-picker-indicator{display:none}input[type=date]::-webkit-input-placeholder{visibility:hidden !important}textarea::-webkit-resizer{position:absolute;inset-block-end:0px;box-sizing:border-box;padding-block:0px;padding-inline:0.25rem;inset-inline-end:0}.resize-icon-wrapper{inset-block-end:2px;inset-inline-end:2px;pointer-events:none;position:absolute;block-size:0.75rem;inline-size:0.75rem;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-3)}.resize-icon-wrapper calcite-icon{inset-block-end:0.25rem;inset-inline-end:0.25rem;transform:rotate(-45deg)}.calcite--rtl .resize-icon-wrapper calcite-icon{transform:rotate(45deg)}:host([type=color]) input{padding:0.25rem}:host([type=file]) input{cursor:pointer;border-width:1px;border-style:dashed;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);text-align:center}:host([type=file][scale=s]) input{padding-block:1px;padding-inline:0.5rem}:host([type=file][scale=m]) input{padding-block:0.25rem;padding-inline:0.75rem}:host([type=file][scale=l]) input{padding-block:0.5rem;padding-inline:1rem}:host(.no-bottom-border) input{border-block-end-width:0px}:host(.border-top-color-one) input{border-block-start-color:var(--calcite-color-border-1)}input.inline-child{background-color:transparent;transition:background-color, block-size, border-color, box-shadow, color, inset-block-end, inset-block-start, inset-inline-end, inset-inline-start inset-size, opacity, outline-color, transform var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}input.inline-child .editing-enabled{background-color:inherit}input.inline-child:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}.validation-container{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}:host([scale=m]) .validation-container,:host([scale=l]) .validation-container{padding-block-start:0.5rem}:host([scale=s]) .validation-container{padding-block-start:0.25rem}::slotted(input[slot=hidden-form-input]){margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}:host([hidden]){display:none}[hidden]{display:none}";const S=q;const G=class{constructor(i){t(this,i);this.calciteInternalInputFocus=e(this,"calciteInternalInputFocus",6);this.calciteInternalInputBlur=e(this,"calciteInternalInputBlur",6);this.calciteInputInput=e(this,"calciteInputInput",7);this.calciteInputChange=e(this,"calciteInputChange",6);this.childElType="input";this.previousValueOrigin="initial";this.mutationObserver=F("mutation",(()=>this.setDisabledAction()));this.userChangedValue=false;this.keyDownHandler=t=>{if(this.readOnly||this.disabled||t.defaultPrevented){return}if(this.isClearable&&t.key==="Escape"){this.clearInputValue(t);t.preventDefault()}if(t.key==="Enter"){if(c(this)){t.preventDefault()}}};this.clearInputValue=t=>{this.setValue({committing:true,nativeEvent:t,origin:"user",value:""})};this.emitChangeIfUserModified=()=>{if(this.previousValueOrigin==="user"&&this.value!==this.previousEmittedValue){this.calciteInputChange.emit();this.setPreviousEmittedValue(this.value)}};this.inputBlurHandler=()=>{window.clearInterval(this.nudgeNumberValueIntervalId);this.calciteInternalInputBlur.emit();this.emitChangeIfUserModified()};this.clickHandler=t=>{if(this.disabled){return}const e=o(this.el,"action");if(t.target!==e){this.setFocus()}};this.inputFocusHandler=()=>{this.calciteInternalInputFocus.emit()};this.inputChangeHandler=()=>{if(this.type==="file"){this.files=this.childEl.files}};this.inputInputHandler=t=>{if(this.disabled||this.readOnly){return}this.setValue({nativeEvent:t,origin:"user",value:t.target.value})};this.inputKeyDownHandler=t=>{if(this.disabled||this.readOnly){return}if(t.key==="Enter"){this.emitChangeIfUserModified()}};this.inputNumberInputHandler=t=>{if(this.disabled||this.readOnly){return}if(this.value==="Infinity"||this.value==="-Infinity"){return}const e=t.target.value;I.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator};const i=I.delocalize(e);if(t.inputType==="insertFromPaste"){if(!E(i)){t.preventDefault()}this.setValue({nativeEvent:t,origin:"user",value:C(i)});this.childNumberEl.value=this.displayedValue}else{this.setValue({nativeEvent:t,origin:"user",value:i})}};this.inputNumberKeyDownHandler=t=>{if(this.type!=="number"||this.disabled||this.readOnly){return}if(this.value==="Infinity"||this.value==="-Infinity"){t.preventDefault();if(t.key==="Backspace"||t.key==="Delete"){this.clearInputValue(t)}return}if(t.key==="ArrowUp"){t.preventDefault();this.nudgeNumberValue("up",t);return}if(t.key==="ArrowDown"){this.nudgeNumberValue("down",t);return}const e=[...v,"ArrowLeft","ArrowRight","Backspace","Delete","Enter","Escape","Tab"];if(t.altKey||t.ctrlKey||t.metaKey){return}const i=t.shiftKey&&t.key==="Tab";if(e.includes(t.key)||i){if(t.key==="Enter"){this.emitChangeIfUserModified()}return}I.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator};if(t.key===I.decimal){if(!this.value&&!this.childNumberEl.value){return}if(this.value&&this.childNumberEl.value.indexOf(I.decimal)===-1){return}}if(/[eE]/.test(t.key)){if(!this.value&&!this.childNumberEl.value){return}if(this.value&&!/[eE]/.test(this.childNumberEl.value)){return}}if(t.key==="-"){if(!this.value&&!this.childNumberEl.value){return}if(this.value&&this.childNumberEl.value.split("-").length<=2){return}}t.preventDefault()};this.nudgeNumberValue=(t,e)=>{if(e instanceof KeyboardEvent&&e.repeat||this.type!=="number"){return}const i=this.maxString?parseFloat(this.maxString):null;const n=this.minString?parseFloat(this.minString):null;const s=150;this.incrementOrDecrementNumberValue(t,i,n,e);if(this.nudgeNumberValueIntervalId){window.clearInterval(this.nudgeNumberValueIntervalId)}let o=true;this.nudgeNumberValueIntervalId=window.setInterval((()=>{if(o){o=false;return}this.incrementOrDecrementNumberValue(t,i,n,e)}),s)};this.numberButtonPointerUpAndOutHandler=()=>{window.clearInterval(this.nudgeNumberValueIntervalId)};this.numberButtonPointerDownHandler=t=>{if(!r(t)){return}t.preventDefault();const e=t.target.dataset.adjustment;if(!this.disabled){this.nudgeNumberValue(e,t)}};this.onHiddenFormInputInput=t=>{if(t.target.name===this.name){this.setValue({value:t.target.value,origin:"direct"})}this.setFocus();t.stopPropagation()};this.setChildElRef=t=>{this.childEl=t};this.setChildNumberElRef=t=>{this.childNumberEl=t};this.setInputValue=t=>{if(this.type==="text"&&!this.childEl){return}if(this.type==="number"&&!this.childNumberEl){return}this[`child${this.type==="number"?"Number":""}El`].value=t};this.setPreviousEmittedValue=t=>{this.previousEmittedValue=this.normalizeValue(t)};this.setPreviousValue=t=>{this.previousValue=this.normalizeValue(t)};this.setValue=({committing:t=false,nativeEvent:e,origin:i,previousValue:n,value:s})=>{this.setPreviousValue(n??this.value);this.previousValueOrigin=i;if(this.type==="number"){I.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator,signDisplay:"never"};const t=this.previousValue?.length>s.length||this.value?.length>s.length;const e=s.charAt(s.length-1)===".";const n=e&&t?s:D(s);const o=s&&!n?E(this.previousValue)?this.previousValue:"":n;let r=I.localize(o);if(i!=="connected"&&!e){r=W(r,o,I)}this.displayedValue=e&&t?`${r}${I.decimal}`:r;this.userChangedValue=i==="user"&&this.value!==o;this.value=["-","."].includes(o)?"":o}else{this.userChangedValue=i==="user"&&this.value!==s;this.value=s}if(i==="direct"){this.setInputValue(s);this.previousEmittedValue=s}if(e){const e=this.calciteInputInput.emit();if(e.defaultPrevented){this.value=this.previousValue;this.displayedValue=this.type==="number"?I.localize(this.previousValue):this.previousValue}else if(t){this.emitChangeIfUserModified()}}};this.inputKeyUpHandler=()=>{window.clearInterval(this.nudgeNumberValueIntervalId)};this.alignment="start";this.autofocus=false;this.clearable=false;this.disabled=false;this.form=undefined;this.groupSeparator=false;this.icon=undefined;this.iconFlipRtl=false;this.label=undefined;this.loading=false;this.numberingSystem=undefined;this.localeFormat=false;this.max=undefined;this.min=undefined;this.maxLength=undefined;this.minLength=undefined;this.validationMessage=undefined;this.validationIcon=undefined;this.name=undefined;this.numberButtonType="vertical";this.placeholder=undefined;this.prefixText=undefined;this.readOnly=false;this.required=false;this.scale="m";this.status="idle";this.step=undefined;this.autocomplete=undefined;this.pattern=undefined;this.accept=undefined;this.multiple=false;this.inputMode="text";this.enterKeyHint=undefined;this.suffixText=undefined;this.editingEnabled=false;this.type="text";this.value="";this.files=undefined;this.messages=undefined;this.messageOverrides=undefined;this.defaultMessages=undefined;this.effectiveLocale="";this.displayedValue=undefined;this.slottedActionElDisabledInternally=false}disabledWatcher(){this.setDisabledAction()}maxWatcher(){this.maxString=this.max?.toString()||null}minWatcher(){this.minString=this.min?.toString()||null}onMessagesChange(){}valueWatcher(t,e){if(!this.userChangedValue){if(this.type==="number"&&(t==="Infinity"||t==="-Infinity")){this.displayedValue=t;this.previousEmittedValue=t;return}this.setValue({origin:"direct",previousValue:e,value:t==null||t==""?"":this.type==="number"?E(t)?t:this.previousValue||"":t});this.warnAboutInvalidNumberValue(t)}this.userChangedValue=false}updateRequestedIcon(){this.requestedIcon=a(M,this.icon,this.type)}get isClearable(){return!this.isTextarea&&(this.clearable||this.type==="search")&&this.value?.length>0}get isTextarea(){return this.childElType==="textarea"}effectiveLocaleChange(){V(this,this.effectiveLocale)}connectedCallback(){p(this);L(this);N(this);this.inlineEditableEl=this.el.closest("calcite-inline-editable");if(this.inlineEditableEl){this.editingEnabled=this.inlineEditableEl.editingEnabled||false}x(this);h(this);this.mutationObserver?.observe(this.el,{childList:true});this.setDisabledAction();this.el.addEventListener(d,this.onHiddenFormInputInput)}disconnectedCallback(){m(this);k(this);u(this);B(this);P(this);this.mutationObserver?.disconnect();this.el.removeEventListener(d,this.onHiddenFormInputInput)}async componentWillLoad(){w(this);this.childElType=this.type==="textarea"?"textarea":"input";this.maxString=this.max?.toString();this.minString=this.min?.toString();this.requestedIcon=a(M,this.icon,this.type);await A(this);this.setPreviousEmittedValue(this.value);this.setPreviousValue(this.value);if(this.type==="number"){if(this.value==="Infinity"||this.value==="-Infinity"){this.displayedValue=this.value;this.previousEmittedValue=this.value}else{this.warnAboutInvalidNumberValue(this.value);this.setValue({origin:"connected",value:E(this.value)?this.value:""})}}}componentDidLoad(){z(this)}componentShouldUpdate(t,e,i){if(this.type==="number"&&i==="value"&&t&&!E(t)){this.setValue({origin:"reset",value:e});return false}return true}componentDidRender(){f(this)}async setFocus(){await j(this);if(this.type==="number"){this.childNumberEl?.focus()}else{this.childEl?.focus()}}async selectText(){if(this.type==="number"){this.childNumberEl?.select()}else{this.childEl?.select()}}onLabelClick(){this.setFocus()}incrementOrDecrementNumberValue(t,e,i,n){const{value:s}=this;if(s==="Infinity"||s==="-Infinity"){return}const o=t==="up"?1:-1;const r=this.step==="any"?1:Math.abs(this.step||1);const a=new $(s!==""?s:"0");const l=a.add(`${r*o}`);const c=()=>typeof i==="number"&&!isNaN(i)&&l.subtract(`${i}`).isNegative;const h=()=>typeof e==="number"&&!isNaN(e)&&!l.subtract(`${e}`).isNegative;const d=c()?`${i}`:h()?`${e}`:l.toString();this.setValue({committing:true,nativeEvent:n,origin:"user",value:d})}syncHiddenFormInput(t){R(this.type,this,t)}setDisabledAction(){const t=o(this.el,"action");if(!t){return}if(this.disabled){if(t.getAttribute("disabled")==null){this.slottedActionElDisabledInternally=true}t.setAttribute("disabled","")}else if(this.slottedActionElDisabledInternally){t.removeAttribute("disabled");this.slottedActionElDisabledInternally=false}}normalizeValue(t){return this.type==="number"?E(t)?t:"":t}warnAboutInvalidNumberValue(t){if(this.type==="number"&&t&&!E(t)){console.warn(`The specified value "${t}" cannot be parsed, or is out of range.`)}}render(){const t=l(this.el);const e=i("div",{key:"a8d5e1855eb1e51784f0a0b82c183707d05207e5",class:U.loader},i("calcite-progress",{key:"cb85d88550d446d244235e40f92a9a9c9ab8551d",label:this.messages.loading,type:"indeterminate"}));const s=i("button",{key:"366f919b839d39de6570befeb3a9307a9b27461e","aria-label":this.messages.clear,class:U.clearButton,disabled:this.disabled||this.readOnly,onClick:this.clearInputValue,tabIndex:-1,type:"button"},i("calcite-icon",{key:"58d373ee7776c11c6783db42b0fd59ec3f494163",icon:"x",scale:H(this.scale)}));const o=i("calcite-icon",{key:"75509f5dd49dfe17d86a8f056dc35e244727ab8c",class:U.inputIcon,flipRtl:this.iconFlipRtl,icon:this.requestedIcon,scale:H(this.scale)});const r=this.numberButtonType==="horizontal";const a=i("button",{key:"25ddada4213615e9b051532740af4e0d7f1257ab","aria-hidden":"true",class:{[U.numberButtonItem]:true,[U.buttonItemHorizontal]:r},"data-adjustment":"up",disabled:this.disabled||this.readOnly,onPointerDown:this.numberButtonPointerDownHandler,onPointerOut:this.numberButtonPointerUpAndOutHandler,onPointerUp:this.numberButtonPointerUpAndOutHandler,tabIndex:-1,type:"button"},i("calcite-icon",{key:"715562367a60394b10245ca5b5b05a6a85404dbb",icon:"chevron-up",scale:H(this.scale)}));const c=i("button",{key:"424fa2ee5ae412e16ea234f95c7646508c6f5af7","aria-hidden":"true",class:{[U.numberButtonItem]:true,[U.buttonItemHorizontal]:r},"data-adjustment":"down",disabled:this.disabled||this.readOnly,onPointerDown:this.numberButtonPointerDownHandler,onPointerOut:this.numberButtonPointerUpAndOutHandler,onPointerUp:this.numberButtonPointerUpAndOutHandler,tabIndex:-1,type:"button"},i("calcite-icon",{key:"4025ea83ccbeb20456e11d276f1415f1d97f12f3",icon:"chevron-down",scale:H(this.scale)}));const h=i("div",{key:"bb52ef49148a6aebebd1caae862f5eff75ba7ca8",class:U.numberButtonWrapper},a,c);const d=i("div",{key:"d5d6b4851049359344a8a99b461d31d3ce7195a3",class:U.prefix},this.prefixText);const u=i("div",{key:"0926f89c5307a0b50d69c8a03b66e66dbf6a6bf9",class:U.suffix},this.suffixText);const p=this.type==="number"?i("input",{accept:this.accept,"aria-label":y(this),autocomplete:this.autocomplete,autofocus:this.autofocus?true:null,defaultValue:this.defaultValue,disabled:this.disabled?true:null,enterKeyHint:this.enterKeyHint,inputMode:this.inputMode,key:"localized-input",maxLength:this.maxLength,minLength:this.minLength,multiple:this.multiple,name:undefined,onBlur:this.inputBlurHandler,onFocus:this.inputFocusHandler,onInput:this.inputNumberInputHandler,onKeyDown:this.inputNumberKeyDownHandler,onKeyUp:this.inputKeyUpHandler,pattern:this.pattern,placeholder:this.placeholder||"",readOnly:this.readOnly,type:"text",value:this.displayedValue,ref:this.setChildNumberElRef}):null;const m=this.type!=="number"?[i(this.childElType,{accept:this.accept,"aria-label":y(this),autocomplete:this.autocomplete,autofocus:this.autofocus?true:null,class:{[U.editingEnabled]:this.editingEnabled,[U.inlineChild]:!!this.inlineEditableEl},defaultValue:this.defaultValue,disabled:this.disabled?true:null,enterKeyHint:this.enterKeyHint,inputMode:this.inputMode,max:this.maxString,maxLength:this.maxLength,min:this.minString,minLength:this.minLength,multiple:this.multiple,name:this.name,onBlur:this.inputBlurHandler,onChange:this.inputChangeHandler,onFocus:this.inputFocusHandler,onInput:this.inputInputHandler,onKeyDown:this.inputKeyDownHandler,onKeyUp:this.inputKeyUpHandler,pattern:this.pattern,placeholder:this.placeholder||"",readOnly:this.readOnly,required:this.required?true:null,step:this.step,tabIndex:this.disabled||this.inlineEditableEl&&!this.editingEnabled?-1:null,type:this.type,value:this.value,ref:this.setChildElRef}),this.isTextarea?i("div",{class:U.resizeIconWrapper},i("calcite-icon",{icon:"chevron-down",scale:H(this.scale)})):null]:null;return i(n,{key:"cd8b74a52e178fd32c6cd2fa18df79b77c29b253",onClick:this.clickHandler,onKeyDown:this.keyDownHandler},i(g,{key:"98baf4288e5585725f2edc771d7f5daeb655d351",disabled:this.disabled},i("div",{key:"94e8ed48e1b0f0fcff0282c93d21e783243b72da",class:{[U.inputWrapper]:true,[K.rtl]:t==="rtl"}},this.type==="number"&&this.numberButtonType==="horizontal"&&!this.readOnly?c:null,this.prefixText?d:null,i("div",{key:"33fe2b4c7a65e676aba3c300920f07c47c07e87e",class:U.wrapper},p,m,this.isClearable?s:null,this.requestedIcon?o:null,this.loading?e:null),i("div",{key:"810a9f418412069018e4d4195e5977de4f5b69d9",class:U.actionWrapper},i("slot",{key:"dd37f8a6d8e0a652ea6c0ab8f4f296f586eb2d60",name:T.action})),this.type==="number"&&this.numberButtonType==="vertical"&&!this.readOnly?h:null,this.suffixText?u:null,this.type==="number"&&this.numberButtonType==="horizontal"&&!this.readOnly?a:null,i(b,{key:"dde32e2dcf1f230b09f7d355090473125bbd6e4a",component:this})),this.validationMessage&&this.status==="invalid"?i(O,{icon:this.validationIcon,message:this.validationMessage,scale:this.scale,status:this.status}):null))}static get assetsDirs(){return["assets"]}get el(){return s(this)}static get watchers(){return{disabled:["disabledWatcher"],max:["maxWatcher"],min:["minWatcher"],messageOverrides:["onMessagesChange"],value:["valueWatcher"],icon:["updateRequestedIcon"],type:["updateRequestedIcon"],effectiveLocale:["effectiveLocaleChange"]}}};G.style=S;export{G as calcite_input};
-//# sourceMappingURL=p-df331f65.entry.js.map

package/dist/calcite/p-df331f65.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["CSS","loader","clearButton","editingEnabled","inlineChild","inputIcon","prefix","suffix","numberButtonWrapper","buttonItemHorizontal","wrapper","inputWrapper","actionWrapper","resizeIconWrapper","numberButtonItem","INPUT_TYPE_ICONS","tel","password","email","date","time","search","SLOTS","action","inputCss","CalciteInputStyle0","Input","this","childElType","previousValueOrigin","mutationObserver","createObserver","setDisabledAction","userChangedValue","keyDownHandler","event","readOnly","disabled","defaultPrevented","isClearable","key","clearInputValue","preventDefault","submitForm","nativeEvent","setValue","committing","origin","value","emitChangeIfUserModified","previousEmittedValue","calciteInputChange","emit","setPreviousEmittedValue","inputBlurHandler","window","clearInterval","nudgeNumberValueIntervalId","calciteInternalInputBlur","clickHandler","slottedActionEl","getSlotted","el","target","setFocus","inputFocusHandler","calciteInternalInputFocus","inputChangeHandler","type","files","childEl","inputInputHandler","inputKeyDownHandler","inputNumberInputHandler","numberStringFormatter","numberFormatOptions","locale","effectiveLocale","numberingSystem","useGrouping","groupSeparator","delocalizedValue","delocalize","inputType","isValidNumber","parseNumberString","childNumberEl","displayedValue","inputNumberKeyDownHandler","nudgeNumberValue","supportedKeys","numberKeys","altKey","ctrlKey","metaKey","isShiftTabEvent","shiftKey","includes","decimal","indexOf","test","split","length","direction","KeyboardEvent","repeat","inputMax","maxString","parseFloat","inputMin","minString","valueNudgeDelayInMs","incrementOrDecrementNumberValue","firstValueNudge","setInterval","numberButtonPointerUpAndOutHandler","numberButtonPointerDownHandler","isPrimaryPointerButton","dataset","adjustment","onHiddenFormInputInput","name","stopPropagation","setChildElRef","setChildNumberElRef","setInputValue","newInputValue","normalizeValue","setPreviousValue","previousValue","signDisplay","isValueDeleted","hasTrailingDecimalSeparator","charAt","sanitizedValue","sanitizeNumberString","newValue","newLocalizedValue","localize","addLocalizedTrailingDecimalZeros","calciteInputInputEvent","calciteInputInput","inputKeyUpHandler","disabledWatcher","maxWatcher","max","toString","minWatcher","min","onMessagesChange","valueWatcher","warnAboutInvalidNumberValue","updateRequestedIcon","requestedIcon","setRequestedIcon","icon","isTextarea","clearable","effectiveLocaleChange","updateMessages","connectedCallback","connectInteractive","connectLocalized","connectMessages","inlineEditableEl","closest","connectLabel","connectForm","observe","childList","addEventListener","internalHiddenInputInputEvent","disconnectedCallback","disconnectInteractive","disconnectLabel","disconnectForm","disconnectLocalized","disconnectMessages","disconnect","removeEventListener","componentWillLoad","setUpLoadableComponent","setUpMessages","componentDidLoad","setComponentLoaded","componentShouldUpdate","oldValue","property","componentDidRender","updateHostInteraction","componentFocusable","focus","selectText","select","onLabelClick","inputStep","step","Math","abs","inputVal","BigDecimal","nudgedValue","add","nudgedValueBelowInputMin","isNaN","subtract","isNegative","nudgedValueAboveInputMax","finalValue","syncHiddenFormInput","input","getAttribute","slottedActionElDisabledInternally","setAttribute","removeAttribute","console","warn","render","dir","getElementDir","h","class","label","messages","loading","inputClearButton","clear","onClick","tabIndex","scale","getIconScale","iconEl","flipRtl","iconFlipRtl","isHorizontalNumberButton","numberButtonType","numberButtonsHorizontalUp","onPointerDown","onPointerOut","onPointerUp","numberButtonsHorizontalDown","numberButtonsVertical","prefixText","suffixText","localeNumberInput","accept","getLabelText","autocomplete","autofocus","defaultValue","enterKeyHint","inputMode","maxLength","minLength","multiple","undefined","onBlur","onFocus","onInput","onKeyDown","onKeyUp","pattern","placeholder","ref","onChange","required","Host","InteractiveContainer","CSS_UTILITY","rtl","HiddenFormInputSlot","component","validationMessage","status","Validation","validationIcon","message"],"sources":["src/components/input/resources.ts","src/components/input/input.scss?tag=calcite-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["export const CSS = {\n  loader: \"loader\",\n  clearButton: \"clear-button\",\n  editingEnabled: \"editing-enabled\",\n  inlineChild: \"inline-child\",\n  inputIcon: \"icon\",\n  prefix: \"prefix\",\n  suffix: \"suffix\",\n  numberButtonWrapper: \"number-button-wrapper\",\n  buttonItemHorizontal: \"number-button-item--horizontal\",\n  wrapper: \"element-wrapper\",\n  inputWrapper: \"wrapper\",\n  actionWrapper: \"action-wrapper\",\n  resizeIconWrapper: \"resize-icon-wrapper\",\n  numberButtonItem: \"number-button-item\",\n};\n\nexport const INPUT_TYPE_ICONS = {\n  tel: \"phone\",\n  password: \"lock\",\n  email: \"email-address\",\n  date: \"calendar\",\n  time: \"clock\",\n  search: \"search\",\n};\n\nexport const SLOTS = {\n  action: \"action\",\n};\n",":host {\n  @apply block;\n}\n\n// scales\n:host([scale=\"s\"]) {\n  & input,\n  & .prefix,\n  & .suffix {\n    @apply text-n2h h-6 px-2;\n  }\n  & textarea {\n    @apply h-6;\n    min-block-size: theme(\"spacing.6\");\n  }\n  & .number-button-wrapper,\n  & .action-wrapper calcite-button,\n  & .action-wrapper calcite-button button {\n    @apply h-6;\n  }\n  & input[type=\"file\"] {\n    @apply h-6;\n  }\n  & .clear-button {\n    min-block-size: theme(\"spacing.6\");\n    min-inline-size: theme(\"spacing.6\");\n  }\n  & textarea {\n    @apply text-n2h\n    h-auto\n    py-1\n    px-2;\n  }\n}\n\n:host([scale=\"m\"]) {\n  & input,\n  & .prefix,\n  & .suffix {\n    @apply text-n1h h-8 px-3;\n  }\n  & textarea {\n    min-block-size: theme(\"spacing.8\");\n  }\n  & .number-button-wrapper,\n  & .action-wrapper calcite-button,\n  & .action-wrapper calcite-button button {\n    @apply h-8;\n  }\n  & input[type=\"file\"] {\n    @apply h-8;\n  }\n  & .clear-button {\n    min-block-size: theme(\"spacing.8\");\n    min-inline-size: theme(\"spacing.8\");\n  }\n  & textarea {\n    @apply text-n1h\n      h-auto\n      py-2\n      px-3;\n  }\n}\n\n:host([scale=\"l\"]) {\n  & input,\n  & .prefix,\n  & .suffix {\n    @apply text-0h h-11 px-4;\n  }\n  & textarea {\n    min-block-size: theme(\"spacing.11\");\n  }\n  & .number-button-wrapper,\n  & .action-wrapper calcite-button,\n  & .action-wrapper calcite-button button {\n    @apply h-11;\n  }\n  & input[type=\"file\"] {\n    @apply h-11;\n  }\n  & .clear-button {\n    min-block-size: theme(\"spacing.11\");\n    min-inline-size: theme(\"spacing.11\");\n  }\n  & textarea {\n    @apply text-0h\n      h-auto\n      py-3\n      px-4;\n  }\n}\n\n@include disabled() {\n  & textarea {\n    resize: none;\n  }\n}\n\ntextarea,\ninput {\n  transition:\n    var(--calcite-animation-timing),\n    block-size 0,\n    outline-offset 0s;\n  -webkit-appearance: none;\n  @apply font-inherit\n    text-color-1\n    bg-foreground-1\n    relative\n    m-0\n    box-border\n    flex\n    max-h-full\n    w-full\n    max-w-full\n    flex-1\n    rounded-none\n    font-normal;\n}\n\ninput[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n// states\ninput,\ntextarea {\n  @apply border\n    border-color-input\n    border-solid\n    text-color-1\n    text-ellipsis;\n  &::placeholder,\n  &:-ms-input-placeholder,\n  &::-ms-input-placeholder {\n    @apply text-color-3 font-normal;\n  }\n  &:placeholder-shown {\n    @apply text-ellipsis;\n  }\n}\ninput:focus,\ntextarea:focus {\n  @apply border-color-brand text-color-1;\n}\ninput[readonly],\ntextarea[readonly] {\n  @apply bg-background font-medium;\n}\ninput[readonly]:focus,\ntextarea[readonly]:focus {\n  @apply text-color-1;\n}\ncalcite-icon {\n  @apply text-color-3;\n}\n\n//focus\ntextarea,\ninput {\n  @apply focus-base;\n}\ntextarea:focus,\ninput:focus {\n  @apply focus-inset;\n}\n\n:host([status=\"invalid\"]) {\n  & input,\n  & textarea {\n    @apply border-color-danger;\n  }\n  & input:focus,\n  & textarea:focus {\n    @apply focus-inset-danger;\n  }\n}\n\n// ICONS\n\n// position icons\n\n:host([scale=\"s\"]) .icon {\n  inset-inline-start: theme(\"spacing.2\");\n}\n\n:host([scale=\"m\"]) .icon {\n  inset-inline-start: theme(\"spacing.3\");\n}\n\n:host([scale=\"l\"]) .icon {\n  inset-inline-start: theme(\"spacing.4\");\n}\n\n// position placeholder/value text in relation to icons\n\n:host([icon][scale=\"s\"]) input {\n  padding-inline-start: theme(\"padding.8\");\n}\n\n:host([icon][scale=\"m\"]) input {\n  padding-inline-start: theme(\"padding.10\");\n}\n\n:host([icon][scale=\"l\"]) input {\n  padding-inline-start: theme(\"padding.14\");\n}\n\n// positioning wrapper for icon and loader\n\n.element-wrapper {\n  @apply relative\n    order-3\n    inline-flex\n    flex-1\n    items-center;\n}\n\n.icon {\n  @apply transition-default\n    pointer-events-none\n    absolute\n    block;\n}\n\n.icon,\n.resize-icon-wrapper {\n  @apply z-default; // needed for firefox to display the icon properly\n}\n\n// hide browser default clear\n\ninput[type=\"text\"]::-ms-clear,\ninput[type=\"text\"]::-ms-reveal {\n  @apply hidden\n    h-0\n    w-0;\n}\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration,\ninput[type=\"date\"]::-webkit-clear-button,\ninput[type=\"time\"]::-webkit-clear-button {\n  @apply hidden;\n}\n\n.clear-button {\n  pointer-events: initial;\n  @apply focus-base\n    border-color-input\n    bg-foreground-1\n    order-4\n    m-0\n    box-border\n    flex\n    min-h-full\n    cursor-pointer\n    items-center\n    justify-center\n    self-stretch\n    border\n    border-solid;\n\n  border-inline-start-width: theme(\"borderWidth.0\");\n\n  &:hover {\n    @apply bg-foreground-2 transition-default;\n    calcite-icon {\n      @apply text-color-1 transition-default;\n    }\n  }\n  &:active {\n    @apply bg-foreground-3;\n    calcite-icon {\n      @apply text-color-1;\n    }\n  }\n  &:focus {\n    @apply focus-inset;\n  }\n  &:disabled {\n    @apply opacity-disabled;\n  }\n}\n\n// loading\n.loader {\n  inset-block-start: 1px;\n  inset-inline: 1px;\n  @apply pointer-events-none\n    absolute\n    block;\n}\n\n// slotted action\n.action-wrapper {\n  @apply order-7 flex;\n}\n\n// prefix and suffix\n.prefix,\n.suffix {\n  @apply border-color-input\n    bg-background\n    text-color-2\n    box-border\n    flex\n    h-auto\n    min-h-full\n    select-none\n    content-center\n    items-center\n    break-words\n    border\n    border-solid\n    font-medium\n    leading-none;\n}\n\n.prefix {\n  @apply order-2;\n  border-inline-end-width: theme(\"borderWidth.0\");\n}\n.suffix {\n  @apply order-5;\n  border-inline-start-width: theme(\"borderWidth.0\");\n}\n\n// alignment type\n:host([alignment=\"start\"]) {\n  & textarea,\n  & input {\n    text-align: start;\n  }\n}\n\n:host([alignment=\"end\"]) {\n  & textarea,\n  & input {\n    text-align: end;\n  }\n}\n\n// number buttons\ninput[type=\"number\"] {\n  -moz-appearance: textfield;\n\n  &::-webkit-inner-spin-button,\n  &::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    -moz-appearance: textfield;\n    @apply m-0;\n  }\n}\n\n.number-button-wrapper {\n  @apply transition-default\n    pointer-events-none\n    order-6\n    box-border\n    flex\n    flex-col;\n}\n\n:host([number-button-type=\"vertical\"]) .wrapper {\n  flex-direction: row;\n  display: flex;\n}\n\n:host([number-button-type=\"vertical\"]) {\n  & input,\n  textarea {\n    @apply order-2;\n  }\n}\n\n:host([number-button-type=\"horizontal\"]) .calcite--rtl {\n  & .number-button-item[data-adjustment=\"down\"] calcite-icon {\n    transform: rotate(-90deg);\n  }\n  & .number-button-item[data-adjustment=\"up\"] calcite-icon {\n    transform: rotate(-90deg);\n  }\n}\n\n.number-button-item.number-button-item--horizontal {\n  &[data-adjustment=\"down\"],\n  &[data-adjustment=\"up\"] {\n    @apply order-1\n      max-h-full\n      min-h-full\n      self-stretch;\n    & calcite-icon {\n      transform: rotate(90deg);\n    }\n  }\n}\n\n.number-button-item.number-button-item--horizontal[data-adjustment=\"down\"] {\n  @apply border-color-input\n    border\n    border-solid;\n  border-inline-end-width: theme(\"borderWidth.0\");\n  &:hover {\n    @apply bg-foreground-2;\n    calcite-icon {\n      @apply text-color-1;\n    }\n  }\n}\n\n.number-button-item.number-button-item--horizontal[data-adjustment=\"up\"] {\n  @apply order-5;\n  &:hover {\n    @apply bg-foreground-2;\n    calcite-icon {\n      @apply text-color-1;\n    }\n  }\n}\n\n:host([number-button-type=\"vertical\"]) .number-button-item[data-adjustment=\"down\"]:hover {\n  @apply bg-foreground-2;\n  calcite-icon {\n    @apply text-color-1;\n  }\n}\n\n:host([number-button-type=\"vertical\"]) .number-button-item[data-adjustment=\"up\"]:hover {\n  @apply bg-foreground-2;\n  calcite-icon {\n    @apply text-color-1;\n  }\n}\n\n:host([number-button-type=\"vertical\"]) .number-button-item[data-adjustment=\"down\"] {\n  @apply border-t-0;\n}\n\n.number-button-item {\n  max-block-size: 50%;\n  min-block-size: 50%;\n  pointer-events: initial;\n  @apply border-color-input\n    bg-foreground-1\n    transition-default\n    m-0\n    box-border\n    flex\n    cursor-pointer\n    items-center\n    self-center\n    border\n    border-solid\n    py-0\n    px-2;\n  border-inline-start-width: theme(\"borderWidth.0\");\n  & calcite-icon {\n    @apply transition-default pointer-events-none;\n  }\n  &:focus {\n    @apply bg-foreground-2;\n    calcite-icon {\n      @apply text-color-1;\n    }\n  }\n  &:active {\n    @apply bg-foreground-3;\n  }\n  &:disabled {\n    @apply pointer-events-none;\n  }\n}\n\n.wrapper {\n  @apply relative\n    flex\n    flex-row\n    items-center;\n}\n\n// hide the default date picker\n:input::-webkit-calendar-picker-indicator {\n  @apply hidden;\n}\n\ninput[type=\"date\"]::-webkit-input-placeholder {\n  visibility: hidden !important;\n}\n\n// textarea resize icon\ntextarea::-webkit-resizer {\n  @apply absolute\n    bottom-0\n    box-border\n    py-0\n    px-1;\n  inset-inline-end: 0;\n}\n\n.resize-icon-wrapper {\n  inset-block-end: 2px;\n  inset-inline-end: 2px;\n\n  @apply bg-foreground-1\n    text-color-3\n    pointer-events-none\n    absolute\n    h-3\n    w-3;\n\n  & calcite-icon {\n    inset-block-end: theme(\"spacing.1\");\n    inset-inline-end: theme(\"spacing.1\");\n    transform: rotate(-45deg);\n  }\n}\n\n.calcite--rtl {\n  .resize-icon-wrapper {\n    & calcite-icon {\n      transform: rotate(45deg);\n    }\n  }\n}\n\n:host([type=\"color\"]) input {\n  @apply p-1;\n}\n\n// file input\n:host([type=\"file\"]) input {\n  @apply bg-foreground-1\n    border-color-input\n    cursor-pointer\n    border\n    border-dashed\n    text-center;\n}\n\n:host([type=\"file\"][scale=\"s\"]) input {\n  @apply py-px px-2;\n}\n\n:host([type=\"file\"][scale=\"m\"]) input {\n  @apply py-1 px-3;\n}\n\n:host([type=\"file\"][scale=\"l\"]) input {\n  @apply py-2 px-4;\n}\n\n:host(.no-bottom-border) input {\n  @apply border-b-0;\n}\n\n:host(.border-top-color-one) input {\n  @apply border-t-color-1;\n}\n\n// input needed for higher specificity of these overrides\ninput {\n  &.inline-child {\n    @apply transition-default bg-transparent;\n    .editing-enabled {\n      background-color: inherit;\n    }\n  }\n\n  &.inline-child:not(.editing-enabled) {\n    @apply border-color-transparent\n      flex\n      cursor-pointer text-ellipsis;\n    padding-inline-start: 0;\n  }\n}\n\n@include form-validation-message();\n@include hidden-form-input();\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  getElementDir,\n  getSlotted,\n  isPrimaryPointerButton,\n  setRequestedIcon,\n} from \"../../utils/dom\";\nimport { Scale, Status, Alignment } from \"../interfaces\";\nimport {\n  connectForm,\n  disconnectForm,\n  FormComponent,\n  HiddenFormInputSlot,\n  internalHiddenInputInputEvent,\n  submitForm,\n} from \"../../utils/form\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { numberKeys } from \"../../utils/key\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n} from \"../../utils/locale\";\nimport {\n  addLocalizedTrailingDecimalZeros,\n  BigDecimal,\n  isValidNumber,\n  parseNumberString,\n  sanitizeNumberString,\n} from \"../../utils/number\";\nimport { createObserver } from \"../../utils/observers\";\nimport { CSS_UTILITY } from \"../../utils/resources\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { getIconScale } from \"../../utils/component\";\nimport { Validation } from \"../functional/Validation\";\nimport { InputMessages } from \"./assets/input/t9n\";\nimport { InputPlacement, NumberNudgeDirection, SetValueOrigin } from \"./interfaces\";\nimport { CSS, INPUT_TYPE_ICONS, SLOTS } from \"./resources\";\nimport { NumericInputComponent, syncHiddenFormInput, TextualInputComponent } from \"./common/input\";\n\n/**\n * @slot action - A slot for positioning a `calcite-button` next to the component.\n */\n@Component({\n  tag: \"calcite-input\",\n  styleUrl: \"input.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Input\n  implements\n    LabelableComponent,\n    FormComponent,\n    InteractiveComponent,\n    T9nComponent,\n    LocalizedComponent,\n    LoadableComponent,\n    NumericInputComponent,\n    TextualInputComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** Specifies the text alignment of the component's value. */\n  @Prop({ reflect: true }) alignment: Extract<\"start\" | \"end\", Alignment> = \"start\";\n\n  /**\n   * When `true`, the component is focused on page load. Only one element can contain `autofocus`. If multiple elements have `autofocus`, the first element will receive focus.\n   *\n   * @mdn [autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)\n   */\n  @Prop({ reflect: true }) autofocus = false;\n\n  /**\n   * When `true`, a clear button is displayed when the component has a value. The clear button shows by default for `\"search\"`, `\"time\"`, and `\"date\"` types, and will not display for the `\"textarea\"` type.\n   */\n  @Prop({ reflect: true }) clearable = false;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   *\n   * @mdn [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  @Watch(\"disabled\")\n  disabledWatcher(): void {\n    this.setDisabledAction();\n  }\n\n  /**\n   * The `id` of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true }) form: string;\n\n  /**\n   * When `true`, number values are displayed with a group separator corresponding to the language and country format.\n   */\n  @Prop({ reflect: true }) groupSeparator = false;\n\n  /**\n   * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.\n   */\n  @Prop({ reflect: true }) icon: string | boolean;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /** Accessible name for the component. */\n  @Prop() label: string;\n\n  /** When `true`, a busy indicator is displayed. */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * Specifies the Unicode numeral system used by the component for localization.\n   *\n   */\n  @Prop({ reflect: true }) numberingSystem: NumberingSystem;\n\n  /**\n   * When `true`, uses locale formatting for numbers.\n   *\n   * @internal\n   */\n  @Prop() localeFormat = false;\n\n  /**\n   * Specifies the maximum value for type \"number\".\n   *\n   * @mdn [max](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max)\n   */\n  @Prop({ reflect: true }) max: number;\n\n  /** watcher to update number-to-string for max */\n  @Watch(\"max\")\n  maxWatcher(): void {\n    this.maxString = this.max?.toString() || null;\n  }\n\n  /**\n   * Specifies the minimum value for `type=\"number\"`.\n   *\n   * @mdn [min](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min)\n   */\n  @Prop({ reflect: true }) min: number;\n\n  /** watcher to update number-to-string for min */\n  @Watch(\"min\")\n  minWatcher(): void {\n    this.minString = this.min?.toString() || null;\n  }\n\n  /**\n   * Specifies the maximum length of text for the component's value.\n   *\n   * @mdn [maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength)\n   */\n  @Prop({ reflect: true }) maxLength: number;\n\n  /**\n   * Specifies the minimum length of text for the component's value.\n   *\n   * @mdn [minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength)\n   */\n  @Prop({ reflect: true }) minLength: number;\n\n  /** Specifies the validation message to display under the component. */\n  @Prop() validationMessage: string;\n\n  /** Specifies the validation icon to display under the component. */\n  @Prop({ reflect: true }) validationIcon: string | boolean;\n\n  /**\n   * Specifies the name of the component.\n   *\n   * Required to pass the component's `value` on form submission.\n   *\n   * @mdn [name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name)\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /** Specifies the placement of the buttons for `type=\"number\"`. */\n  @Prop({ reflect: true }) numberButtonType: InputPlacement = \"vertical\";\n\n  /**\n   * Specifies placeholder text for the component.\n   *\n   * @mdn [placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder)\n   */\n  @Prop() placeholder: string;\n\n  /** Adds text to the start of the component. */\n  @Prop() prefixText: string;\n\n  /**\n   * When `true`, the component's value can be read, but cannot be modified.\n   *\n   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)\n   */\n  @Prop({ reflect: true }) readOnly = false;\n\n  /** When `true`, the component must have a value in order for the form to submit. */\n  @Prop({ reflect: true }) required = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the status of the input field, which determines message and icons. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /**\n   * Specifies the granularity the component's `value` must adhere to.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step)\n   */\n  @Prop({ reflect: true }) step: number | \"any\";\n\n  /**\n   * Specifies the type of content to autocomplete, for use in forms.\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete)\n   */\n  @Prop() autocomplete: string;\n\n  /**\n   * Specifies a regex pattern the component's `value` must match for validation.\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern)\n   */\n  @Prop() pattern: string;\n\n  /**\n   * Specifies a comma separated list of unique file type specifiers for limiting accepted file types.\n   * This property only has an effect when `type` is \"file\".\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern)\n   */\n  @Prop() accept: string;\n\n  /**\n   * When `true`, the component can accept more than one value.\n   * This property only has an effect when `type` is \"email\" or \"file\".\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/multiple)\n   */\n  @Prop() multiple = false;\n\n  /**\n   * Specifies the type of content to help devices display an appropriate virtual keyboard.\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)\n   */\n  @Prop() inputMode = \"text\";\n\n  /**\n   * Specifies the action label or icon for the Enter key on virtual keyboards.\n   * Read the native attribute's documentation on MDN for more info.\n   *\n   * @mdn [step](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/enterkeyhint)\n   */\n  @Prop() enterKeyHint: string;\n\n  /** Adds text to the end of the component. */\n  @Prop() suffixText: string;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true, reflect: true }) editingEnabled = false;\n\n  /**\n   * Specifies the component type.\n   *\n   * Note that the following `type`s add type-specific icons by default: `\"date\"`, `\"email\"`, `\"password\"`, `\"search\"`, `\"tel\"`, `\"time\"`.\n   */\n  @Prop({ reflect: true }) type:\n    | \"color\"\n    | \"date\"\n    | \"datetime-local\"\n    | \"email\"\n    | \"file\"\n    | \"image\"\n    | \"month\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"textarea\"\n    | \"time\"\n    | \"url\"\n    | \"week\" = \"text\";\n\n  /** The component's value. */\n  @Prop({ mutable: true }) value = \"\";\n\n  /**\n   * When `type` is `\"file\"`, specifies the component's selected files.\n   *\n   * @mdn https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/files\n   */\n  @Prop() files: FileList | undefined;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: InputMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<InputMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  @Watch(\"value\")\n  valueWatcher(newValue: string, previousValue: string): void {\n    if (!this.userChangedValue) {\n      if (this.type === \"number\" && (newValue === \"Infinity\" || newValue === \"-Infinity\")) {\n        this.displayedValue = newValue;\n        this.previousEmittedValue = newValue;\n        return;\n      }\n\n      this.setValue({\n        origin: \"direct\",\n        previousValue,\n        value:\n          newValue == null || newValue == \"\"\n            ? \"\"\n            : this.type === \"number\"\n              ? isValidNumber(newValue)\n                ? newValue\n                : this.previousValue || \"\"\n              : newValue,\n      });\n      this.warnAboutInvalidNumberValue(newValue);\n    }\n    this.userChangedValue = false;\n  }\n\n  @Watch(\"icon\")\n  @Watch(\"type\")\n  updateRequestedIcon(): void {\n    this.requestedIcon = setRequestedIcon(INPUT_TYPE_ICONS, this.icon, this.type);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteInputElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  formEl: HTMLFormElement;\n\n  defaultValue: Input[\"value\"];\n\n  inlineEditableEl: HTMLCalciteInlineEditableElement;\n\n  /** keep track of the rendered child type */\n  private childEl?: HTMLInputElement | HTMLTextAreaElement;\n\n  /** keep track of the rendered child type */\n  private childElType?: \"input\" | \"textarea\" = \"input\";\n\n  /** number text input element for locale */\n  private childNumberEl?: HTMLInputElement;\n\n  get isClearable(): boolean {\n    return !this.isTextarea && (this.clearable || this.type === \"search\") && this.value?.length > 0;\n  }\n\n  get isTextarea(): boolean {\n    return this.childElType === \"textarea\";\n  }\n\n  private minString?: string;\n\n  private maxString?: string;\n\n  private previousEmittedValue: string;\n\n  private previousValue: string;\n\n  private previousValueOrigin: SetValueOrigin = \"initial\";\n\n  /** the computed icon to render */\n  private requestedIcon?: string;\n\n  private nudgeNumberValueIntervalId: number;\n\n  mutationObserver = createObserver(\"mutation\", () => this.setDisabledAction());\n\n  private userChangedValue = false;\n\n  //--------------------------------------------------------------------------\n  //\n  //  State\n  //\n  //--------------------------------------------------------------------------\n\n  @State() defaultMessages: InputMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() displayedValue: string;\n\n  @State() slottedActionElDisabledInternally = false;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n\n    this.inlineEditableEl = this.el.closest(\"calcite-inline-editable\");\n    if (this.inlineEditableEl) {\n      this.editingEnabled = this.inlineEditableEl.editingEnabled || false;\n    }\n    connectLabel(this);\n    connectForm(this);\n\n    this.mutationObserver?.observe(this.el, { childList: true });\n\n    this.setDisabledAction();\n    this.el.addEventListener(internalHiddenInputInputEvent, this.onHiddenFormInputInput);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n\n    this.mutationObserver?.disconnect();\n    this.el.removeEventListener(internalHiddenInputInputEvent, this.onHiddenFormInputInput);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    this.childElType = this.type === \"textarea\" ? \"textarea\" : \"input\";\n    this.maxString = this.max?.toString();\n    this.minString = this.min?.toString();\n    this.requestedIcon = setRequestedIcon(INPUT_TYPE_ICONS, this.icon, this.type);\n    await setUpMessages(this);\n\n    this.setPreviousEmittedValue(this.value);\n    this.setPreviousValue(this.value);\n\n    if (this.type === \"number\") {\n      if (this.value === \"Infinity\" || this.value === \"-Infinity\") {\n        this.displayedValue = this.value;\n        this.previousEmittedValue = this.value;\n      } else {\n        this.warnAboutInvalidNumberValue(this.value);\n        this.setValue({\n          origin: \"connected\",\n          value: isValidNumber(this.value) ? this.value : \"\",\n        });\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentShouldUpdate(newValue: string, oldValue: string, property: string): boolean {\n    if (this.type === \"number\" && property === \"value\" && newValue && !isValidNumber(newValue)) {\n      this.setValue({\n        origin: \"reset\",\n        value: oldValue,\n      });\n      return false;\n    }\n    return true;\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalInputFocus: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalInputBlur: EventEmitter<void>;\n\n  /**\n   * Fires each time a new `value` is typed.\n   */\n  @Event({ cancelable: true }) calciteInputInput: EventEmitter<void>;\n\n  /**\n   * Fires each time a new `value` is typed and committed.\n   */\n  @Event({ cancelable: false }) calciteInputChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    if (this.type === \"number\") {\n      this.childNumberEl?.focus();\n    } else {\n      this.childEl?.focus();\n    }\n  }\n\n  /** Selects the text of the component's `value`. */\n  @Method()\n  async selectText(): Promise<void> {\n    if (this.type === \"number\") {\n      this.childNumberEl?.select();\n    } else {\n      this.childEl?.select();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  keyDownHandler = (event: KeyboardEvent): void => {\n    if (this.readOnly || this.disabled || event.defaultPrevented) {\n      return;\n    }\n\n    if (this.isClearable && event.key === \"Escape\") {\n      this.clearInputValue(event);\n      event.preventDefault();\n    }\n    if (event.key === \"Enter\") {\n      if (submitForm(this)) {\n        event.preventDefault();\n      }\n    }\n  };\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  incrementOrDecrementNumberValue(\n    direction: NumberNudgeDirection,\n    inputMax: number | null,\n    inputMin: number | null,\n    nativeEvent: KeyboardEvent | MouseEvent,\n  ): void {\n    const { value } = this;\n\n    if (value === \"Infinity\" || value === \"-Infinity\") {\n      return;\n    }\n\n    const adjustment = direction === \"up\" ? 1 : -1;\n    const inputStep = this.step === \"any\" ? 1 : Math.abs(this.step || 1);\n    const inputVal = new BigDecimal(value !== \"\" ? value : \"0\");\n    const nudgedValue = inputVal.add(`${inputStep * adjustment}`);\n\n    const nudgedValueBelowInputMin = () =>\n      typeof inputMin === \"number\" &&\n      !isNaN(inputMin) &&\n      nudgedValue.subtract(`${inputMin}`).isNegative;\n\n    const nudgedValueAboveInputMax = () =>\n      typeof inputMax === \"number\" &&\n      !isNaN(inputMax) &&\n      !nudgedValue.subtract(`${inputMax}`).isNegative;\n\n    const finalValue = nudgedValueBelowInputMin()\n      ? `${inputMin}`\n      : nudgedValueAboveInputMax()\n        ? `${inputMax}`\n        : nudgedValue.toString();\n\n    this.setValue({\n      committing: true,\n      nativeEvent,\n      origin: \"user\",\n      value: finalValue,\n    });\n  }\n\n  private clearInputValue = (nativeEvent: KeyboardEvent | MouseEvent): void => {\n    this.setValue({\n      committing: true,\n      nativeEvent,\n      origin: \"user\",\n      value: \"\",\n    });\n  };\n\n  private emitChangeIfUserModified = (): void => {\n    if (this.previousValueOrigin === \"user\" && this.value !== this.previousEmittedValue) {\n      this.calciteInputChange.emit();\n      this.setPreviousEmittedValue(this.value);\n    }\n  };\n\n  private inputBlurHandler = () => {\n    window.clearInterval(this.nudgeNumberValueIntervalId);\n    this.calciteInternalInputBlur.emit();\n    this.emitChangeIfUserModified();\n  };\n\n  private clickHandler = (event: MouseEvent): void => {\n    if (this.disabled) {\n      return;\n    }\n\n    const slottedActionEl = getSlotted(this.el, \"action\");\n    if (event.target !== slottedActionEl) {\n      this.setFocus();\n    }\n  };\n\n  private inputFocusHandler = (): void => {\n    this.calciteInternalInputFocus.emit();\n  };\n\n  private inputChangeHandler = (): void => {\n    if (this.type === \"file\") {\n      this.files = (this.childEl as HTMLInputElement).files;\n    }\n  };\n\n  private inputInputHandler = (nativeEvent: InputEvent): void => {\n    if (this.disabled || this.readOnly) {\n      return;\n    }\n    this.setValue({\n      nativeEvent,\n      origin: \"user\",\n      value: (nativeEvent.target as HTMLInputElement).value,\n    });\n  };\n\n  private inputKeyDownHandler = (event: KeyboardEvent): void => {\n    if (this.disabled || this.readOnly) {\n      return;\n    }\n    if (event.key === \"Enter\") {\n      this.emitChangeIfUserModified();\n    }\n  };\n\n  private inputNumberInputHandler = (nativeEvent: InputEvent): void => {\n    if (this.disabled || this.readOnly) {\n      return;\n    }\n\n    if (this.value === \"Infinity\" || this.value === \"-Infinity\") {\n      return;\n    }\n\n    const value = (nativeEvent.target as HTMLInputElement).value;\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n    const delocalizedValue = numberStringFormatter.delocalize(value);\n    if (nativeEvent.inputType === \"insertFromPaste\") {\n      if (!isValidNumber(delocalizedValue)) {\n        nativeEvent.preventDefault();\n      }\n      this.setValue({\n        nativeEvent,\n        origin: \"user\",\n        value: parseNumberString(delocalizedValue),\n      });\n      this.childNumberEl.value = this.displayedValue;\n    } else {\n      this.setValue({\n        nativeEvent,\n        origin: \"user\",\n        value: delocalizedValue,\n      });\n    }\n  };\n\n  private inputNumberKeyDownHandler = (event: KeyboardEvent): void => {\n    if (this.type !== \"number\" || this.disabled || this.readOnly) {\n      return;\n    }\n\n    if (this.value === \"Infinity\" || this.value === \"-Infinity\") {\n      event.preventDefault();\n      if (event.key === \"Backspace\" || event.key === \"Delete\") {\n        this.clearInputValue(event);\n      }\n      return;\n    }\n\n    if (event.key === \"ArrowUp\") {\n      /* prevent default behavior of moving cursor to the beginning of the input when holding down ArrowUp */\n      event.preventDefault();\n      this.nudgeNumberValue(\"up\", event);\n      return;\n    }\n    if (event.key === \"ArrowDown\") {\n      this.nudgeNumberValue(\"down\", event);\n      return;\n    }\n    const supportedKeys = [\n      ...numberKeys,\n      \"ArrowLeft\",\n      \"ArrowRight\",\n      \"Backspace\",\n      \"Delete\",\n      \"Enter\",\n      \"Escape\",\n      \"Tab\",\n    ];\n    if (event.altKey || event.ctrlKey || event.metaKey) {\n      return;\n    }\n    const isShiftTabEvent = event.shiftKey && event.key === \"Tab\";\n    if (supportedKeys.includes(event.key) || isShiftTabEvent) {\n      if (event.key === \"Enter\") {\n        this.emitChangeIfUserModified();\n      }\n      return;\n    }\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n    if (event.key === numberStringFormatter.decimal) {\n      if (!this.value && !this.childNumberEl.value) {\n        return;\n      }\n      if (this.value && this.childNumberEl.value.indexOf(numberStringFormatter.decimal) === -1) {\n        return;\n      }\n    }\n    if (/[eE]/.test(event.key)) {\n      if (!this.value && !this.childNumberEl.value) {\n        return;\n      }\n      if (this.value && !/[eE]/.test(this.childNumberEl.value)) {\n        return;\n      }\n    }\n\n    if (event.key === \"-\") {\n      if (!this.value && !this.childNumberEl.value) {\n        return;\n      }\n      if (this.value && this.childNumberEl.value.split(\"-\").length <= 2) {\n        return;\n      }\n    }\n    event.preventDefault();\n  };\n\n  private nudgeNumberValue = (\n    direction: NumberNudgeDirection,\n    nativeEvent: KeyboardEvent | MouseEvent,\n  ): void => {\n    if ((nativeEvent instanceof KeyboardEvent && nativeEvent.repeat) || this.type !== \"number\") {\n      return;\n    }\n\n    const inputMax = this.maxString ? parseFloat(this.maxString) : null;\n    const inputMin = this.minString ? parseFloat(this.minString) : null;\n    const valueNudgeDelayInMs = 150;\n\n    this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);\n\n    if (this.nudgeNumberValueIntervalId) {\n      window.clearInterval(this.nudgeNumberValueIntervalId);\n    }\n    let firstValueNudge = true;\n    this.nudgeNumberValueIntervalId = window.setInterval(() => {\n      if (firstValueNudge) {\n        firstValueNudge = false;\n        return;\n      }\n\n      this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);\n    }, valueNudgeDelayInMs);\n  };\n\n  private numberButtonPointerUpAndOutHandler = (): void => {\n    window.clearInterval(this.nudgeNumberValueIntervalId);\n  };\n\n  private numberButtonPointerDownHandler = (event: PointerEvent): void => {\n    if (!isPrimaryPointerButton(event)) {\n      return;\n    }\n\n    event.preventDefault();\n    const direction = (event.target as HTMLDivElement).dataset.adjustment as NumberNudgeDirection;\n    if (!this.disabled) {\n      this.nudgeNumberValue(direction, event);\n    }\n  };\n\n  syncHiddenFormInput(input: HTMLInputElement): void {\n    syncHiddenFormInput(this.type, this, input);\n  }\n\n  private onHiddenFormInputInput = (event: Event): void => {\n    if ((event.target as HTMLInputElement).name === this.name) {\n      this.setValue({\n        value: (event.target as HTMLInputElement).value,\n        origin: \"direct\",\n      });\n    }\n    this.setFocus();\n    event.stopPropagation();\n  };\n\n  private setChildElRef = (el: HTMLInputElement | HTMLTextAreaElement) => {\n    this.childEl = el;\n  };\n\n  private setChildNumberElRef = (el: HTMLInputElement) => {\n    this.childNumberEl = el;\n  };\n\n  private setDisabledAction(): void {\n    const slottedActionEl = getSlotted(this.el, \"action\");\n\n    if (!slottedActionEl) {\n      return;\n    }\n\n    if (this.disabled) {\n      if (slottedActionEl.getAttribute(\"disabled\") == null) {\n        this.slottedActionElDisabledInternally = true;\n      }\n      slottedActionEl.setAttribute(\"disabled\", \"\");\n    } else if (this.slottedActionElDisabledInternally) {\n      slottedActionEl.removeAttribute(\"disabled\");\n      this.slottedActionElDisabledInternally = false;\n    }\n  }\n\n  private setInputValue = (newInputValue: string): void => {\n    if (this.type === \"text\" && !this.childEl) {\n      return;\n    }\n    if (this.type === \"number\" && !this.childNumberEl) {\n      return;\n    }\n    this[`child${this.type === \"number\" ? \"Number\" : \"\"}El`].value = newInputValue;\n  };\n\n  private setPreviousEmittedValue = (value: string): void => {\n    this.previousEmittedValue = this.normalizeValue(value);\n  };\n\n  private normalizeValue(value: string): string {\n    return this.type === \"number\" ? (isValidNumber(value) ? value : \"\") : value;\n  }\n\n  private setPreviousValue = (value: string): void => {\n    this.previousValue = this.normalizeValue(value);\n  };\n\n  private setValue = ({\n    committing = false,\n    nativeEvent,\n    origin,\n    previousValue,\n    value,\n  }: {\n    committing?: boolean;\n    nativeEvent?: MouseEvent | KeyboardEvent | InputEvent;\n    origin: SetValueOrigin;\n    previousValue?: string;\n    value: string;\n  }): void => {\n    this.setPreviousValue(previousValue ?? this.value);\n    this.previousValueOrigin = origin;\n\n    if (this.type === \"number\") {\n      numberStringFormatter.numberFormatOptions = {\n        locale: this.effectiveLocale,\n        numberingSystem: this.numberingSystem,\n        useGrouping: this.groupSeparator,\n        signDisplay: \"never\",\n      };\n\n      const isValueDeleted =\n        this.previousValue?.length > value.length || this.value?.length > value.length;\n      const hasTrailingDecimalSeparator = value.charAt(value.length - 1) === \".\";\n      const sanitizedValue =\n        hasTrailingDecimalSeparator && isValueDeleted ? value : sanitizeNumberString(value);\n\n      const newValue =\n        value && !sanitizedValue\n          ? isValidNumber(this.previousValue)\n            ? this.previousValue\n            : \"\"\n          : sanitizedValue;\n\n      let newLocalizedValue = numberStringFormatter.localize(newValue);\n\n      if (origin !== \"connected\" && !hasTrailingDecimalSeparator) {\n        newLocalizedValue = addLocalizedTrailingDecimalZeros(\n          newLocalizedValue,\n          newValue,\n          numberStringFormatter,\n        );\n      }\n\n      // adds localized trailing decimal separator\n      this.displayedValue =\n        hasTrailingDecimalSeparator && isValueDeleted\n          ? `${newLocalizedValue}${numberStringFormatter.decimal}`\n          : newLocalizedValue;\n\n      this.userChangedValue = origin === \"user\" && this.value !== newValue;\n      // don't sanitize the start of negative/decimal numbers, but\n      // don't set value to an invalid number\n      this.value = [\"-\", \".\"].includes(newValue) ? \"\" : newValue;\n    } else {\n      this.userChangedValue = origin === \"user\" && this.value !== value;\n      this.value = value;\n    }\n\n    if (origin === \"direct\") {\n      this.setInputValue(value);\n      this.previousEmittedValue = value;\n    }\n\n    if (nativeEvent) {\n      const calciteInputInputEvent = this.calciteInputInput.emit();\n      if (calciteInputInputEvent.defaultPrevented) {\n        this.value = this.previousValue;\n        this.displayedValue =\n          this.type === \"number\"\n            ? numberStringFormatter.localize(this.previousValue)\n            : this.previousValue;\n      } else if (committing) {\n        this.emitChangeIfUserModified();\n      }\n    }\n  };\n\n  private inputKeyUpHandler = (): void => {\n    window.clearInterval(this.nudgeNumberValueIntervalId);\n  };\n\n  private warnAboutInvalidNumberValue(value: string): void {\n    if (this.type === \"number\" && value && !isValidNumber(value)) {\n      console.warn(`The specified value \"${value}\" cannot be parsed, or is out of range.`);\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  render(): VNode {\n    const dir = getElementDir(this.el);\n    const loader = (\n      <div class={CSS.loader}>\n        <calcite-progress label={this.messages.loading} type=\"indeterminate\" />\n      </div>\n    );\n\n    const inputClearButton = (\n      <button\n        aria-label={this.messages.clear}\n        class={CSS.clearButton}\n        disabled={this.disabled || this.readOnly}\n        onClick={this.clearInputValue}\n        tabIndex={-1}\n        type=\"button\"\n      >\n        <calcite-icon icon=\"x\" scale={getIconScale(this.scale)} />\n      </button>\n    );\n    const iconEl = (\n      <calcite-icon\n        class={CSS.inputIcon}\n        flipRtl={this.iconFlipRtl}\n        icon={this.requestedIcon}\n        scale={getIconScale(this.scale)}\n      />\n    );\n\n    const isHorizontalNumberButton = this.numberButtonType === \"horizontal\";\n\n    const numberButtonsHorizontalUp = (\n      <button\n        aria-hidden=\"true\"\n        class={{\n          [CSS.numberButtonItem]: true,\n          [CSS.buttonItemHorizontal]: isHorizontalNumberButton,\n        }}\n        data-adjustment=\"up\"\n        disabled={this.disabled || this.readOnly}\n        onPointerDown={this.numberButtonPointerDownHandler}\n        onPointerOut={this.numberButtonPointerUpAndOutHandler}\n        onPointerUp={this.numberButtonPointerUpAndOutHandler}\n        tabIndex={-1}\n        type=\"button\"\n      >\n        <calcite-icon icon=\"chevron-up\" scale={getIconScale(this.scale)} />\n      </button>\n    );\n\n    const numberButtonsHorizontalDown = (\n      <button\n        aria-hidden=\"true\"\n        class={{\n          [CSS.numberButtonItem]: true,\n          [CSS.buttonItemHorizontal]: isHorizontalNumberButton,\n        }}\n        data-adjustment=\"down\"\n        disabled={this.disabled || this.readOnly}\n        onPointerDown={this.numberButtonPointerDownHandler}\n        onPointerOut={this.numberButtonPointerUpAndOutHandler}\n        onPointerUp={this.numberButtonPointerUpAndOutHandler}\n        tabIndex={-1}\n        type=\"button\"\n      >\n        <calcite-icon icon=\"chevron-down\" scale={getIconScale(this.scale)} />\n      </button>\n    );\n\n    const numberButtonsVertical = (\n      <div class={CSS.numberButtonWrapper}>\n        {numberButtonsHorizontalUp}\n        {numberButtonsHorizontalDown}\n      </div>\n    );\n\n    const prefixText = <div class={CSS.prefix}>{this.prefixText}</div>;\n\n    const suffixText = <div class={CSS.suffix}>{this.suffixText}</div>;\n\n    const localeNumberInput =\n      this.type === \"number\" ? (\n        <input\n          accept={this.accept}\n          aria-label={getLabelText(this)}\n          autocomplete={this.autocomplete}\n          autofocus={this.autofocus ? true : null}\n          defaultValue={this.defaultValue}\n          disabled={this.disabled ? true : null}\n          enterKeyHint={this.enterKeyHint}\n          inputMode={this.inputMode}\n          key=\"localized-input\"\n          maxLength={this.maxLength}\n          minLength={this.minLength}\n          multiple={this.multiple}\n          name={undefined}\n          onBlur={this.inputBlurHandler}\n          onFocus={this.inputFocusHandler}\n          onInput={this.inputNumberInputHandler}\n          onKeyDown={this.inputNumberKeyDownHandler}\n          onKeyUp={this.inputKeyUpHandler}\n          pattern={this.pattern}\n          placeholder={this.placeholder || \"\"}\n          readOnly={this.readOnly}\n          type=\"text\"\n          value={this.displayedValue}\n          // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n          ref={this.setChildNumberElRef}\n        />\n      ) : null;\n\n    const childEl =\n      this.type !== \"number\"\n        ? [\n            <this.childElType\n              accept={this.accept}\n              aria-label={getLabelText(this)}\n              autocomplete={this.autocomplete}\n              autofocus={this.autofocus ? true : null}\n              class={{\n                [CSS.editingEnabled]: this.editingEnabled,\n                [CSS.inlineChild]: !!this.inlineEditableEl,\n              }}\n              defaultValue={this.defaultValue}\n              disabled={this.disabled ? true : null}\n              enterKeyHint={this.enterKeyHint}\n              inputMode={this.inputMode}\n              max={this.maxString}\n              maxLength={this.maxLength}\n              min={this.minString}\n              minLength={this.minLength}\n              multiple={this.multiple}\n              name={this.name}\n              onBlur={this.inputBlurHandler}\n              onChange={this.inputChangeHandler}\n              onFocus={this.inputFocusHandler}\n              onInput={this.inputInputHandler}\n              onKeyDown={this.inputKeyDownHandler}\n              onKeyUp={this.inputKeyUpHandler}\n              pattern={this.pattern}\n              placeholder={this.placeholder || \"\"}\n              readOnly={this.readOnly}\n              required={this.required ? true : null}\n              step={this.step}\n              tabIndex={\n                this.disabled || (this.inlineEditableEl && !this.editingEnabled) ? -1 : null\n              }\n              type={this.type}\n              value={this.value}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={this.setChildElRef}\n            />,\n            this.isTextarea ? (\n              <div class={CSS.resizeIconWrapper}>\n                <calcite-icon icon=\"chevron-down\" scale={getIconScale(this.scale)} />\n              </div>\n            ) : null,\n          ]\n        : null;\n\n    return (\n      <Host onClick={this.clickHandler} onKeyDown={this.keyDownHandler}>\n        <InteractiveContainer disabled={this.disabled}>\n          <div class={{ [CSS.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === \"rtl\" }}>\n            {this.type === \"number\" && this.numberButtonType === \"horizontal\" && !this.readOnly\n              ? numberButtonsHorizontalDown\n              : null}\n            {this.prefixText ? prefixText : null}\n            <div class={CSS.wrapper}>\n              {localeNumberInput}\n              {childEl}\n              {this.isClearable ? inputClearButton : null}\n              {this.requestedIcon ? iconEl : null}\n              {this.loading ? loader : null}\n            </div>\n            <div class={CSS.actionWrapper}>\n              <slot name={SLOTS.action} />\n            </div>\n            {this.type === \"number\" && this.numberButtonType === \"vertical\" && !this.readOnly\n              ? numberButtonsVertical\n              : null}\n            {this.suffixText ? suffixText : null}\n            {this.type === \"number\" && this.numberButtonType === \"horizontal\" && !this.readOnly\n              ? numberButtonsHorizontalUp\n              : null}\n            <HiddenFormInputSlot component={this} />\n          </div>\n          {this.validationMessage && this.status === \"invalid\" ? (\n            <Validation\n              icon={this.validationIcon}\n              message={this.validationMessage}\n              scale={this.scale}\n              status={this.status}\n            />\n          ) : null}\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/calcite/p-e0692ae5.entry.js

@@ -1,7 +0,0 @@
-/*!
- * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.8.0-next.1
- */
-import{r as e,c as t,h as i,H as n,g as o}from"./p-85931c71.js";import{t as s,k as a,d as r}from"./p-fb848c65.js";import{f as c,c as l,d,a as h,F as p,r as m}from"./p-a93ae81c.js";import{g as f}from"./p-be664342.js";import{c as u,u as b,d as g,I as w}from"./p-1b03b527.js";import{i as k}from"./p-0e53a49b.js";import{c as v,s as y,a as x}from"./p-b5a073f3.js";import{c as z}from"./p-60c275fd.js";import{o as D}from"./p-2f5471be.js";import{g as I}from"./p-c56cce40.js";import"./p-b5773566.js";import"./p-d66143b4.js";import"./p-3d0a8ad2.js";const C={dropdownTrigger:"trigger"};const E=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline-block}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host .calcite-dropdown-wrapper{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}.calcite-dropdown-wrapper .calcite-floating-ui-anim{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}.calcite-dropdown-wrapper[data-placement^=bottom] .calcite-floating-ui-anim{transform:translateY(-5px)}.calcite-dropdown-wrapper[data-placement^=top] .calcite-floating-ui-anim{transform:translateY(5px)}.calcite-dropdown-wrapper[data-placement^=left] .calcite-floating-ui-anim{transform:translateX(5px)}.calcite-dropdown-wrapper[data-placement^=right] .calcite-floating-ui-anim{transform:translateX(-5px)}.calcite-dropdown-wrapper[data-placement] .calcite-floating-ui-anim--active{opacity:1;transform:translate(0)}:host([open]) .calcite-dropdown-wrapper{visibility:visible}:host .calcite-dropdown-content{max-block-size:45vh;inline-size:auto;overflow-y:auto;overflow-x:hidden;background-color:var(--calcite-color-foreground-1);inline-size:var(--calcite-dropdown-width)}.calcite-trigger-container{position:relative;display:flex;block-size:100%;flex:1 1 auto;word-wrap:break-word;word-break:break-word}@media (forced-colors: active){:host([open]) .calcite-dropdown-wrapper{border:1px solid canvasText}}:host([width-scale=s]){--calcite-dropdown-width:12rem}:host([width-scale=m]){--calcite-dropdown-width:14rem}:host([width-scale=l]){--calcite-dropdown-width:16rem}:host([hidden]){display:none}[hidden]{display:none}";const H=E;const P=class{constructor(i){e(this,i);this.calciteDropdownSelect=t(this,"calciteDropdownSelect",6);this.calciteDropdownBeforeClose=t(this,"calciteDropdownBeforeClose",6);this.calciteDropdownClose=t(this,"calciteDropdownClose",6);this.calciteDropdownBeforeOpen=t(this,"calciteDropdownBeforeOpen",6);this.calciteDropdownOpen=t(this,"calciteDropdownOpen",6);this.items=[];this.groups=[];this.mutationObserver=z("mutation",(()=>this.updateItems()));this.resizeObserver=z("resize",(e=>this.resizeObserverCallback(e)));this.openTransitionProp="opacity";this.guid=`calcite-dropdown-${f()}`;this.defaultAssignedElements=[];this.slotChangeHandler=e=>{this.defaultAssignedElements=e.target.assignedElements({flatten:true});this.updateItems()};this.setFilteredPlacements=()=>{const{el:e,flipPlacements:t}=this;this.filteredFlipPlacements=t?c(t,e):null};this.updateTriggers=e=>{this.triggers=e.target.assignedElements({flatten:true});this.reposition(true)};this.updateItems=()=>{this.items=this.groups.map((e=>Array.from(e?.querySelectorAll("calcite-dropdown-item")))).reduce(((e,t)=>[...e,...t]),[]);this.updateSelectedItems();this.reposition(true);this.items.forEach((e=>e.scale=this.scale))};this.updateGroups=e=>{const t=e.target.assignedElements({flatten:true}).filter((e=>e?.matches("calcite-dropdown-group")));this.groups=t;this.updateItems()};this.resizeObserverCallback=e=>{e.forEach((e=>{const{target:t}=e;if(t===this.referenceEl){this.setDropdownWidth()}else if(t===this.scrollerEl){this.setMaxScrollerHeight()}}))};this.setDropdownWidth=()=>{const{referenceEl:e,scrollerEl:t}=this;const i=e?.clientWidth;if(!i||!t){return}t.style.minWidth=`${i}px`};this.setMaxScrollerHeight=()=>{const{scrollerEl:e}=this;if(!e){return}this.reposition(true);const t=this.getMaxScrollerHeight();e.style.maxHeight=t>0?`${t}px`:"";this.reposition(true)};this.setScrollerAndTransitionEl=e=>{this.resizeObserver.observe(e);this.scrollerEl=e;this.transitionEl=e};this.setReferenceEl=e=>{this.referenceEl=e;l(this,this.referenceEl,this.floatingEl);this.resizeObserver.observe(e)};this.setFloatingEl=e=>{this.floatingEl=e;l(this,this.referenceEl,this.floatingEl)};this.keyDownHandler=e=>{if(!e.composedPath().includes(this.referenceEl)){return}const{defaultPrevented:t,key:i}=e;if(t){return}if(this.open){if(i==="Escape"){this.closeCalciteDropdown();e.preventDefault();return}else if(e.shiftKey&&i==="Tab"){this.closeCalciteDropdown();e.preventDefault();return}}if(k(i)){this.openCalciteDropdown();e.preventDefault()}else if(i==="Escape"){this.closeCalciteDropdown();e.preventDefault()}};this.focusOnFirstActiveOrFirstItem=()=>{this.getFocusableElement(this.getTraversableItems().find((e=>e.selected))||this.items[0])};this.toggleOpenEnd=()=>{this.focusOnFirstActiveOrFirstItem();this.el.removeEventListener("calciteDropdownOpen",this.toggleOpenEnd)};this.openCalciteDropdown=()=>{this.open=!this.open;if(this.open){this.el.addEventListener("calciteDropdownOpen",this.toggleOpenEnd)}};this.open=false;this.closeOnSelectDisabled=false;this.disabled=false;this.flipPlacements=undefined;this.maxItems=0;this.overlayPositioning="absolute";this.placement=d;this.selectedItems=[];this.type="click";this.widthScale=undefined;this.scale="m"}openHandler(){D(this);if(this.disabled){this.open=false;return}this.reposition(true)}handleDisabledChange(e){if(!e){this.open=false}}flipPlacementsHandler(){this.setFilteredPlacements();this.reposition(true)}maxItemsHandler(){this.setMaxScrollerHeight()}overlayPositioningHandler(){this.reposition(true)}placementHandler(){this.reposition(true)}handlePropsChange(){this.updateItems()}async setFocus(){await v(this);this.el.focus()}connectedCallback(){this.mutationObserver?.observe(this.el,{childList:true,subtree:true});this.setFilteredPlacements();if(this.open){this.openHandler();D(this)}u(this);this.updateItems();l(this,this.referenceEl,this.floatingEl)}componentWillLoad(){y(this)}componentDidLoad(){x(this);l(this,this.referenceEl,this.floatingEl)}componentDidRender(){b(this)}disconnectedCallback(){this.mutationObserver?.disconnect();this.resizeObserver?.disconnect();g(this);h(this,this.referenceEl,this.floatingEl)}render(){const{open:e,guid:t}=this;return i(n,{key:"f08f6800ced2d866923905420a672ddf9e5b2e53"},i(w,{key:"af8dc8c5b21830269e0219ace810363f47a09d61",disabled:this.disabled},i("div",{key:"0b2a66eb0b24e3829a813fdad7a7c693d8e33ece",class:"calcite-trigger-container",id:`${t}-menubutton`,onClick:this.openCalciteDropdown,onKeyDown:this.keyDownHandler,ref:this.setReferenceEl},i("slot",{key:"91996d38c791bf3d216f83e8141e1c57fa9d2c3d","aria-controls":`${t}-menu`,"aria-expanded":s(e),"aria-haspopup":"menu",name:C.dropdownTrigger,onSlotchange:this.updateTriggers})),i("div",{key:"20942ac7c3082d67084363f85fab964363d5f499","aria-hidden":s(!e),class:"calcite-dropdown-wrapper",ref:this.setFloatingEl},i("div",{key:"47dbd0577d04ef7d7e94459bef36986edea404c7","aria-labelledby":`${t}-menubutton`,class:{["calcite-dropdown-content"]:true,[p.animation]:true,[p.animationActive]:e},id:`${t}-menu`,role:"menu",ref:this.setScrollerAndTransitionEl},i("slot",{key:"cf62d6b14412cd287751cbb4cb18290317edc833",onSlotchange:this.updateGroups})))))}async reposition(e=false){const{floatingEl:t,referenceEl:i,placement:n,overlayPositioning:o,filteredFlipPlacements:s}=this;return m(this,{floatingEl:t,referenceEl:i,overlayPositioning:o,placement:n,flipPlacements:s,type:"menu"},e)}closeCalciteDropdownOnClick(e){if(this.disabled||!this.open||e.composedPath().includes(this.el)){return}this.closeCalciteDropdown(false)}closeCalciteDropdownOnEvent(e){this.closeCalciteDropdown();e.stopPropagation()}closeCalciteDropdownOnOpenEvent(e){if(e.composedPath().includes(this.el)){return}this.open=false}pointerEnterHandler(){if(this.disabled||this.type!=="hover"){return}this.openCalciteDropdown()}pointerLeaveHandler(){if(this.disabled||this.type!=="hover"){return}this.closeCalciteDropdown()}getTraversableItems(){return this.items.filter((e=>!e.disabled&&!e.hidden))}calciteInternalDropdownItemKeyEvent(e){const{keyboardEvent:t}=e.detail;const i=t.target;const n=this.getTraversableItems();switch(t.key){case"Tab":this.open=false;this.updateTabIndexOfItems(i);break;case"ArrowDown":a(n,i,"next");break;case"ArrowUp":a(n,i,"previous");break;case"Home":a(n,i,"first");break;case"End":a(n,i,"last");break}e.stopPropagation()}handleItemSelect(e){this.updateSelectedItems();e.stopPropagation();this.calciteDropdownSelect.emit();if(!this.closeOnSelectDisabled||e.detail.requestedDropdownGroup.selectionMode==="none"){this.closeCalciteDropdown()}e.stopPropagation()}onBeforeOpen(){this.calciteDropdownBeforeOpen.emit()}onOpen(){this.calciteDropdownOpen.emit()}onBeforeClose(){this.calciteDropdownBeforeClose.emit()}onClose(){this.calciteDropdownClose.emit()}updateSelectedItems(){this.selectedItems=this.items.filter((e=>e.selected))}getMaxScrollerHeight(){const{maxItems:e,items:t}=this;let i=0;let n=0;let o;this.groups.forEach((t=>{if(e>0&&i<e){Array.from(t.children).forEach(((t,s)=>{if(s===0){if(isNaN(o)){o=t.offsetTop}n+=o}if(i<e){n+=t.offsetHeight;i+=1}}))}}));return t.length>e?n:0}closeCalciteDropdown(e=true){this.open=false;if(e){r(this.triggers[0])}}getFocusableElement(e){if(!e){return}r(e)}updateTabIndexOfItems(e){this.items.forEach((t=>{t.tabIndex=e!==t?-1:0}))}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{open:["openHandler"],disabled:["handleDisabledChange"],flipPlacements:["flipPlacementsHandler"],maxItems:["maxItemsHandler"],overlayPositioning:["overlayPositioningHandler"],placement:["placementHandler"],scale:["handlePropsChange"]}}};P.style=H;const j={container:"container",containerLink:"container--link",containerMulti:"container--multi-selection",containerSingle:"container--single-selection",containerNone:"container--none-selection",icon:"dropdown-item-icon",iconEnd:"dropdown-item-icon-end",iconStart:"dropdown-item-icon-start",itemContent:"dropdown-item-content",link:"dropdown-link"};const O=":host{position:relative;display:block}.container{text-align:start}.container--s{font-size:var(--calcite-font-size--2);line-height:1rem}.container--s .dropdown-title{padding:0.5rem}.container--m{font-size:var(--calcite-font-size--1);line-height:1rem}.container--m .dropdown-title{padding:0.75rem}.container--l{font-size:var(--calcite-font-size-0);line-height:1.25rem}.container--l .dropdown-title{padding:1rem}.dropdown-title{margin-block-end:-1px;display:block;cursor:default;overflow-wrap:break-word;border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);font-weight:var(--calcite-font-weight-bold);color:var(--calcite-color-text-2)}.dropdown-separator{display:block;block-size:1px;background-color:var(--calcite-color-border-3)}:host([hidden]){display:none}[hidden]{display:none}";const A=O;const $=class{constructor(i){e(this,i);this.calciteInternalDropdownItemChange=t(this,"calciteInternalDropdownItemChange",6);this.updateItems=()=>{Array.from(this.el.querySelectorAll("calcite-dropdown-item")).forEach((e=>e.selectionMode=this.selectionMode))};this.mutationObserver=z("mutation",(()=>this.updateItems()));this.groupTitle=undefined;this.scale="m";this.selectionMode="single"}handlePropsChange(){this.updateItems()}connectedCallback(){this.updateItems();this.mutationObserver?.observe(this.el,{childList:true})}componentWillLoad(){this.groupPosition=this.getGroupPosition()}disconnectedCallback(){this.mutationObserver?.disconnect()}render(){const e=this.groupTitle?i("span",{"aria-hidden":"true",class:"dropdown-title"},this.groupTitle):null;const t=this.groupPosition>0?i("div",{class:"dropdown-separator",role:"separator"}):null;return i(n,{key:"d664a714cdd2052e9cae840ef1e4dbd0717a8be2","aria-label":this.groupTitle,role:"group"},i("div",{key:"e68b8fa794a37935f74488c1c746fd8763397f2d",class:{[j.container]:true,[`${j.container}--${this.scale}`]:true}},t,e,i("slot",{key:"dde1409a0bce134ee3a8585a8b2750bb1b20cdfb"})))}updateActiveItemOnChange(e){this.requestedDropdownGroup=e.detail.requestedDropdownGroup;this.requestedDropdownItem=e.detail.requestedDropdownItem;this.calciteInternalDropdownItemChange.emit({requestedDropdownGroup:this.requestedDropdownGroup,requestedDropdownItem:this.requestedDropdownItem})}getGroupPosition(){return Array.prototype.indexOf.call(this.el.parentElement.querySelectorAll("calcite-dropdown-group"),this.el)}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{selectionMode:["handlePropsChange"]}}};$.style=A;const S=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}.container--s{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-inline-end:0.5rem;padding-inline-start:1.5rem}.container--m{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-inline-end:0.75rem;padding-inline-start:2rem}.container--l{padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;padding-inline-end:1rem;padding-inline-start:2.5rem}.container--s.container--none-selection{padding-inline-start:0.25rem}.container--s.container--none-selection .dropdown-link{padding-inline-start:0px}.container--m.container--none-selection{padding-inline-start:0.5rem}.container--m.container--none-selection .dropdown-link{padding-inline-start:0px}.container--l.container--none-selection{padding-inline-start:0.75rem}.container--l.container--none-selection .dropdown-link{padding-inline-start:0px}:host{position:relative;display:flex;flex-grow:1;align-items:center}.container{position:relative;display:flex;flex-grow:1;cursor:pointer;align-items:center;color:var(--calcite-color-text-3);text-decoration-line:none;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);text-align:start}.dropdown-item-content{flex:1 1 auto;padding-block:0.125rem;padding-inline-end:auto;padding-inline-start:0.25rem}:host,.container--link a{outline-color:transparent}:host(:focus){outline:2px solid transparent;outline-offset:2px;outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite-color-brand)));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.container--link{padding:0px}.container--link a{position:relative;display:flex;flex-grow:1;cursor:pointer;align-items:center;color:var(--calcite-color-text-3);text-decoration-line:none;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.container--s .dropdown-link{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-inline-end:0.5rem;padding-inline-start:1.5rem}.container--m .dropdown-link{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-inline-end:0.75rem;padding-inline-start:2rem}.container--l .dropdown-link{padding-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;padding-inline-end:1rem;padding-inline-start:2.5rem}:host(:hover:not([disabled])) .container,:host(:active:not([disabled])) .container{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1);text-decoration-line:none}:host(:hover:not([disabled])) .container--link .dropdown-link,:host(:active:not([disabled])) .container--link .dropdown-link{color:var(--calcite-color-text-1)}:host(:active:not([disabled])) .container{background-color:var(--calcite-color-foreground-3)}:host(:focus) .container{color:var(--calcite-color-text-1);text-decoration-line:none}:host([selected]) .container:not(.container--none-selection),:host([selected]) .container--link .dropdown-link{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}:host([selected]) .container:not(.container--none-selection) calcite-icon,:host([selected]) .container--link .dropdown-link calcite-icon{color:var(--calcite-color-brand)}.dropdown-item-icon{position:absolute;opacity:0;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:scale(0.9)}.container--s .dropdown-item-icon{inset-inline-start:0.25rem}.container--m .dropdown-item-icon{inset-inline-start:0.5rem}.container--l .dropdown-item-icon{inset-inline-start:0.75rem}:host(:hover:not([disabled])) .dropdown-item-icon{color:var(--calcite-color-border-1);opacity:1}:host([selected]) .dropdown-item-icon{color:var(--calcite-color-brand);opacity:1}.container--s .dropdown-item-icon-start{margin-inline-end:0.5rem;margin-inline-start:0.25rem}.container--s .dropdown-item-icon-end{margin-inline-start:0.5rem}.container--m .dropdown-item-icon-start{margin-inline-end:0.75rem;margin-inline-start:0.25rem}.container--m .dropdown-item-icon-end{margin-inline-start:0.75rem}.container--l .dropdown-item-icon-start{margin-inline-end:1rem;margin-inline-start:0.25rem}.container--l .dropdown-item-icon-end{margin-inline-start:1rem}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";const L=S;const F=class{constructor(i){e(this,i);this.calciteDropdownItemSelect=t(this,"calciteDropdownItemSelect",6);this.calciteInternalDropdownItemSelect=t(this,"calciteInternalDropdownItemSelect",6);this.calciteInternalDropdownItemKeyEvent=t(this,"calciteInternalDropdownItemKeyEvent",6);this.calciteInternalDropdownCloseRequest=t(this,"calciteInternalDropdownCloseRequest",6);this.disabled=false;this.href=undefined;this.iconFlipRtl=undefined;this.iconStart=undefined;this.iconEnd=undefined;this.label=undefined;this.rel=undefined;this.selected=false;this.target=undefined;this.selectionMode="single";this.scale="m"}async setFocus(){await v(this);this.el?.focus()}componentWillLoad(){y(this);this.initialize()}componentDidLoad(){x(this)}connectedCallback(){this.initialize()}componentDidRender(){b(this)}render(){const{href:e,selectionMode:t,label:o,iconFlipRtl:a,scale:r}=this;const c=i("calcite-icon",{key:"7a7964e413af87a4d1732ff2ddb4c223a53dfa59",class:j.iconStart,flipRtl:a==="start"||a==="both",icon:this.iconStart,scale:I(this.scale)});const l=i("span",{key:"0588fc187ef8c6460bdf8e0b51ffb2b421637668",class:j.itemContent},i("slot",{key:"2d8c6a9949587cc3aa43291edc42dc07da90e65e"}));const d=i("calcite-icon",{key:"43da0361d9c2b2ac1c42c7a563a256918ca5bdca",class:j.iconEnd,flipRtl:a==="end"||a==="both",icon:this.iconEnd,scale:I(this.scale)});const h=this.iconStart&&this.iconEnd?[c,l,d]:this.iconStart?[c,l]:this.iconEnd?[l,d]:l;const p=!e?h:i("a",{"aria-label":o,class:j.link,href:e,rel:this.rel,tabIndex:-1,target:this.target,ref:e=>this.childLink=e},h);const m=e?null:t==="single"?"menuitemradio":t==="multiple"?"menuitemcheckbox":"menuitem";const f=t!=="none"?s(this.selected):null;const{disabled:u}=this;return i(n,{key:"c7f3e08d212168d26e7f41051ad59bf76fdc7ba3","aria-checked":f,"aria-label":!e?o:"",role:m,tabIndex:u?-1:0},i(w,{key:"0f953a23be54c233381b9038e7318a606abaddd3",disabled:u},i("div",{key:"be03db3de6cf56363449f282c620b9ef78598415",class:{[j.container]:true,[j.containerLink]:!!e,[`${j.container}--${r}`]:true,[j.containerMulti]:t==="multiple",[j.containerSingle]:t==="single",[j.containerNone]:t==="none"}},t!=="none"?i("calcite-icon",{class:j.icon,icon:t==="multiple"?"check":"bullet-point",scale:I(this.scale)}):null,p)))}onClick(){this.emitRequestedItem()}keyDownHandler(e){switch(e.key){case" ":case"Enter":this.emitRequestedItem();if(this.href){this.childLink.click()}e.preventDefault();break;case"Escape":this.calciteInternalDropdownCloseRequest.emit();e.preventDefault();break;case"Tab":this.calciteInternalDropdownItemKeyEvent.emit({keyboardEvent:e});break;case"ArrowUp":case"ArrowDown":case"Home":case"End":e.preventDefault();this.calciteInternalDropdownItemKeyEvent.emit({keyboardEvent:e});break}}updateActiveItemOnChange(e){const t=e.composedPath().includes(this.parentDropdownGroupEl);if(t){this.requestedDropdownGroup=e.detail.requestedDropdownGroup;this.requestedDropdownItem=e.detail.requestedDropdownItem;this.determineActiveItem()}e.stopPropagation()}initialize(){this.parentDropdownGroupEl=this.el.closest("calcite-dropdown-group");if(this.selectionMode==="none"){this.selected=false}}determineActiveItem(){switch(this.selectionMode){case"multiple":if(this.el===this.requestedDropdownItem){this.selected=!this.selected}break;case"single":if(this.el===this.requestedDropdownItem){this.selected=true}else if(this.requestedDropdownGroup===this.parentDropdownGroupEl){this.selected=false}break;case"none":this.selected=false;break}}emitRequestedItem(){this.calciteDropdownItemSelect.emit();this.calciteInternalDropdownItemSelect.emit({requestedDropdownItem:this.el,requestedDropdownGroup:this.parentDropdownGroupEl})}get el(){return o(this)}};F.style=L;export{P as calcite_dropdown,$ as calcite_dropdown_group,F as calcite_dropdown_item};
-//# sourceMappingURL=p-e0692ae5.entry.js.map